/* =============================================================================
   Profic Hero — visual "Contenido" (Figma /contenido-seo 506:5279 / 506:5497 / 506:5698)
   Componente "Hero Contenido B" 506:4804: documento 200×300 (Tablet/Mobile 150×225).
   Ciclo 5.9s (Smart Animate, ease-in-out):
     0–0.6s renglón 1 · +0.3s c/u renglones 2–6 · 2.1–2.7s check
     2.7–3.3s hojas en abanico (15° / 30°) · pausa 2s · 5.3–5.9s vuelve a V1
   ============================================================================= */

.profic-hero-seo-section--contenido .profic-hero-seo-container {
	gap: 0;
}

.profic-hero-seo-section--contenido .profic-hero-seo-visual {
	flex: none;
	width: 100%;
	height: 269.25px;
	min-height: 0;
	padding: 0 0 44.25px;
	justify-content: center;
	align-items: center;
}

@media (min-width: 800px) and (max-width: 1279px) {
	.profic-hero-seo-section--contenido .profic-hero-seo-content {
		padding-bottom: 30px;
	}

	.profic-hero-seo-section--contenido .profic-hero-seo-visual {
		width: 480px;
		max-width: 100%;
	}
}

/* Desktop: columna Hero Design 558×416, pb 59, documento centrado */
@media (min-width: 1280px) {
	.profic-hero-seo-section--contenido .profic-hero-seo-visual {
		flex: 0 0 558px;
		width: 558px;
		height: 416px;
		min-height: 416px;
		padding-bottom: 59px;
		justify-content: center;
	}
}

.profic-hseo-cnt {
	--profic-hseo-cnt-cycle: 5.9s;
	position: relative;
	flex: none;
	width: 150px;
	height: 225px;
}

@media (min-width: 1280px) {
	.profic-hseo-cnt {
		width: 200px;
		height: 300px;
	}
}

.profic-hseo-cnt__svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.profic-hseo-cnt__svg path,
.profic-hseo-cnt__svg rect {
	vector-effect: non-scaling-stroke;
}

.profic-hseo-cnt__line,
.profic-hseo-cnt__check,
.profic-hseo-cnt__sheet {
	animation-duration: var(--profic-hseo-cnt-cycle);
	animation-iteration-count: infinite;
	animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
	animation-fill-mode: both;
}

.profic-hseo-cnt__line--1 { animation-name: profic-hseo-cnt-line-1; }
.profic-hseo-cnt__line--2 { animation-name: profic-hseo-cnt-line-2; }
.profic-hseo-cnt__line--3 { animation-name: profic-hseo-cnt-line-3; }
.profic-hseo-cnt__line--4 { animation-name: profic-hseo-cnt-line-4; }
.profic-hseo-cnt__line--5 { animation-name: profic-hseo-cnt-line-5; }
.profic-hseo-cnt__line--6 { animation-name: profic-hseo-cnt-line-6; }

.profic-hseo-cnt__check {
	animation-name: profic-hseo-cnt-check;
}

/* Las hojas de atrás giran sobre el centro del documento */
.profic-hseo-cnt__sheet {
	transform-box: view-box;
	transform-origin: 100px 150px;
}

.profic-hseo-cnt__sheet--15 { animation-name: profic-hseo-cnt-sheet-15; }
.profic-hseo-cnt__sheet--30 { animation-name: profic-hseo-cnt-sheet-30; }

/* Sin animación: queda la variante final (documento completo + check + abanico) */
@media (prefers-reduced-motion: reduce) {
	.profic-hseo-cnt__line,
	.profic-hseo-cnt__check,
	.profic-hseo-cnt__sheet {
		animation-delay: calc(var(--profic-hseo-cnt-cycle) * -0.7);
		animation-play-state: paused;
	}
}

/* V1 → V7: cada renglón entra desde la derecha (fuera del documento, +261) */
@keyframes profic-hseo-cnt-line-1 {
	0% { transform: translateX(261px); }
	10.169%, 35.593% { transform: translateX(0); }
	45.763%, 89.831% { transform: translateX(-1.5px); }
	100% { transform: translateX(261px); }
}

@keyframes profic-hseo-cnt-line-2 {
	0%, 10.169% { transform: translateX(261px); }
	15.254%, 35.593% { transform: translateX(0); }
	45.763%, 89.831% { transform: translateX(-1.5px); }
	100% { transform: translateX(261px); }
}

@keyframes profic-hseo-cnt-line-3 {
	0%, 15.254% { transform: translateX(261px); }
	20.339%, 35.593% { transform: translateX(0); }
	45.763%, 89.831% { transform: translateX(-1.5px); }
	100% { transform: translateX(261px); }
}

@keyframes profic-hseo-cnt-line-4 {
	0%, 20.339% { transform: translateX(261px); }
	25.424%, 35.593% { transform: translateX(0); }
	45.763%, 89.831% { transform: translateX(-1.5px); }
	100% { transform: translateX(261px); }
}

@keyframes profic-hseo-cnt-line-5 {
	0%, 25.424% { transform: translateX(261px); }
	30.508%, 35.593% { transform: translateX(0); }
	45.763%, 89.831% { transform: translateX(-1.5px); }
	100% { transform: translateX(261px); }
}

@keyframes profic-hseo-cnt-line-6 {
	0%, 30.508% { transform: translateX(261px); }
	35.593% { transform: translateX(0); }
	45.763%, 89.831% { transform: translateX(-1.5px); }
	100% { transform: translateX(261px); }
}

/* Final a: aparece el check */
@keyframes profic-hseo-cnt-check {
	0%, 35.593% { opacity: 0; }
	45.763%, 89.831% { opacity: 1; }
	100% { opacity: 0; }
}

/* Final a: las hojas aparecen sobre el borde · Final b: se abren en abanico */
@keyframes profic-hseo-cnt-sheet-15 {
	0%, 35.593% { opacity: 0; transform: translate(0, 0) rotate(0deg); }
	45.763% { opacity: 1; transform: translate(0, 0) rotate(0deg); }
	55.932%, 89.831% { opacity: 1; transform: translate(26px, -0.1px) rotate(15deg); }
	100% { opacity: 0; transform: translate(26px, -0.1px) rotate(15deg); }
}

@keyframes profic-hseo-cnt-sheet-30 {
	0%, 35.593% { opacity: 0; transform: translate(0, 0) rotate(0deg); }
	45.763% { opacity: 1; transform: translate(0, 0) rotate(0deg); }
	55.932%, 89.831% { opacity: 1; transform: translate(49.4px, 0.2px) rotate(30deg); }
	100% { opacity: 0; transform: translate(49.4px, 0.2px) rotate(30deg); }
}
