/* =============================================================================
   Profic Hero — visual "Link Building" (Figma Prueba-WPFIG 2245:6203)
   Componente "Frame 149" 2245:5033: escenario 362.74×392 (incluye los íconos que
   Figma deja 85.25px por encima del frame). Mismo tamaño en Desktop, Tablet
   y Mobile (2245:6200 / 6423 / 6629): no se escala, si no las líneas de 2px
   y el trazo de los íconos quedan finos.
   Ciclo 17.35s (Smart Animate 0.6s ease-out, 0.15s entre variantes):
     9 pasos de aparición (0.15–6.75s) · pausa 10s · 16.75–17.35s vuelve al ícono inicial
   Cada línea es un resplandor que viaja hacia el sitio central (1.5s, en bucle).
   ============================================================================= */

.profic-hero-seo-section--linkbuilding {
	overflow-x: clip;
}

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

.profic-hero-seo-section--linkbuilding .profic-hero-seo-visual {
	flex: none;
	width: 100%;
	height: auto;
	min-height: 0;
	padding: 24px 0 40px;
	justify-content: center;
	align-items: flex-start;
	overflow: visible;
}

/* Desktop: columna Hero Design 558×416, Frame 149 en (122.63, 74.13) */
@media (min-width: 1280px) {
	.profic-hero-seo-section--linkbuilding .profic-hero-seo-visual {
		flex: 0 0 558px;
		width: 558px;
		height: 416px;
		min-height: 416px;
		padding: 0;
		justify-content: flex-start;
	}
}

.profic-hseo-lb {
	--profic-hseo-lb-scale: 1;
	--profic-hseo-lb-cycle: 17.35s;
	--profic-hseo-lb-ease: cubic-bezier(0, 0, 0.58, 1);
	position: relative;
	flex: none;
	width: calc(362.74px * var(--profic-hseo-lb-scale));
	height: calc(392px * var(--profic-hseo-lb-scale));
	margin-inline: auto;
}

@media (min-width: 1280px) {
	.profic-hseo-lb {
		margin: -11.12px 0 0 122.63px;
	}
}

.profic-hseo-lb__stage {
	position: absolute;
	left: 0;
	top: 0;
	width: 362.74px;
	height: 392px;
	transform: scale(var(--profic-hseo-lb-scale));
	transform-origin: 0 0;
}

.profic-hseo-lb__site,
.profic-hseo-lb__line {
	position: absolute;
	animation-duration: var(--profic-hseo-lb-cycle);
	animation-iteration-count: infinite;
	animation-timing-function: var(--profic-hseo-lb-ease);
	animation-fill-mode: both;
}

.profic-hseo-lb__site svg {
	display: block;
	width: 100%;
	height: 100%;
}

.profic-hseo-lb__site--sm {
	width: 35.244px;
	height: 29.244px;
}

.profic-hseo-lb__site--lg {
	width: 58.74px;
	height: 48.74px;
}

.profic-hseo-lb--s1 { animation-name: profic-hseo-lb-in-1; }
.profic-hseo-lb--s2 { animation-name: profic-hseo-lb-in-2; }
.profic-hseo-lb--s3 { animation-name: profic-hseo-lb-in-3; }
.profic-hseo-lb--s4 { animation-name: profic-hseo-lb-in-4; }
.profic-hseo-lb--s5 { animation-name: profic-hseo-lb-in-5; }
.profic-hseo-lb--s6 { animation-name: profic-hseo-lb-in-6; }
.profic-hseo-lb--s7 { animation-name: profic-hseo-lb-in-7; }
.profic-hseo-lb--s8 { animation-name: profic-hseo-lb-in-8; }
.profic-hseo-lb--s9 { animation-name: profic-hseo-lb-in-9; }

/* Líneas: franja de 2px que recorta una elipse #5D0FEC con layer blur 19.4 */
.profic-hseo-lb__line {
	overflow: hidden;
	transform-origin: 0 0;
}

.profic-hseo-lb__line--v {
	width: 2px;
}

.profic-hseo-lb__line--h {
	height: 2px;
}

.profic-hseo-lb__pulse {
	position: absolute;
	border-radius: 50%;
	background: #5d0fec;
	filter: blur(9.7px);
	animation: 1.5s var(--profic-hseo-lb-ease) infinite both;
}

.profic-hseo-lb__line--v .profic-hseo-lb__pulse {
	left: -15px;
	width: 99px;
	height: 38px;
}

.profic-hseo-lb__line--h .profic-hseo-lb__pulse {
	top: -13px;
	width: 26px;
	height: 29px;
}

.profic-hseo-lb__line--down .profic-hseo-lb__pulse { animation-name: profic-hseo-lb-pulse-down; }
.profic-hseo-lb__line--up .profic-hseo-lb__pulse { animation-name: profic-hseo-lb-pulse-up; }
.profic-hseo-lb__line--right .profic-hseo-lb__pulse { animation-name: profic-hseo-lb-pulse-right; }
.profic-hseo-lb__line--left .profic-hseo-lb__pulse { animation-name: profic-hseo-lb-pulse-left; }

/* Sin animación: red completa (variante final) con el resplandor a mitad de cada línea */
@media (prefers-reduced-motion: reduce) {
	.profic-hseo-lb__site,
	.profic-hseo-lb__line,
	.profic-hseo-lb__pulse {
		animation-delay: calc(var(--profic-hseo-lb-cycle) * -0.5);
		animation-play-state: paused;
	}

	.profic-hseo-lb__pulse {
		animation-delay: -0.4s;
	}
}

/* Restricciones de Figma: Linea 4/10 y Linea 2 fijas al inicio, Linea 3 y Linea 1 al final */
@keyframes profic-hseo-lb-pulse-down {
	from { top: -11px; }
	to { top: 82px; }
}

@keyframes profic-hseo-lb-pulse-up {
	from { top: calc(100% - 29px); }
	to { top: calc(100% - 217px); }
}

@keyframes profic-hseo-lb-pulse-right {
	from { left: -7px; }
	to { left: 180px; }
}

@keyframes profic-hseo-lb-pulse-left {
	from { left: calc(100% - 13px); }
	to { left: calc(100% - 206px); }
}

@keyframes profic-hseo-lb-in-1 {
	0%, 0.865% { opacity: 0; }
	4.323%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-2 {
	0%, 5.187% { opacity: 0; }
	8.646%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-3 {
	0%, 9.51% { opacity: 0; }
	12.968%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-4 {
	0%, 13.833% { opacity: 0; }
	17.291%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-5 {
	0%, 18.156% { opacity: 0; }
	21.614%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-6 {
	0%, 22.478% { opacity: 0; }
	25.937%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-7 {
	0%, 26.801% { opacity: 0; }
	30.259%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-8 {
	0%, 31.124% { opacity: 0; }
	34.582%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes profic-hseo-lb-in-9 {
	0%, 35.447% { opacity: 0; }
	38.905%, 96.542% { opacity: 1; }
	100% { opacity: 0; }
}