/* Gen2 · Hero — scoped under .sr-g2hero. Portado de la sección g2c-hero
   (chips, título gradiente, CTAs, animación breathing, producto explotado). */
.sr-g2hero { position: relative; padding: clamp(7rem, 11vw, 9.5rem) 0 clamp(2.5rem, 6vw, 4rem); background: linear-gradient(160deg, #f2f8ff 0%, #eef5ff 45%, #fff4ea 100%); overflow: hidden; }
.sr-g2hero * { box-sizing: border-box; }
.sr-g2hero .wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 clamp(1.25rem, 4vw, 2.5rem); }
.sr-g2hero::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(60% 70% at 82% 26%, rgba(34,211,238,.12), transparent 60%), radial-gradient(50% 60% at 96% 82%, rgba(249,115,22,.08), transparent 60%); pointer-events: none; }
.sr-g2hero::after { content: ""; position: absolute; inset: -25%; z-index: 0; pointer-events: none; background: radial-gradient(26% 28% at 18% 22%, rgba(34,211,238,.20), transparent 62%), radial-gradient(22% 24% at 66% 12%, rgba(125,211,252,.16), transparent 62%), radial-gradient(30% 32% at 88% 66%, rgba(249,115,22,.10), transparent 62%), radial-gradient(24% 26% at 34% 82%, rgba(34,211,238,.12), transparent 62%); filter: blur(34px); animation: g2hero-mesh 20s ease-in-out infinite alternate; }
@keyframes g2hero-mesh { 0% { transform: translate3d(0,0,0) scale(1); } 100% { transform: translate3d(2.5%, -2.5%, 0) scale(1.1); } }

.sr-g2hero .g2hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }

.sr-g2hero .g2hero-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: var(--sp-lg); }
.sr-g2hero .g2hero-chip { font-family: var(--font-display); font-weight: 700; font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; color: var(--c-ink); background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-pill); padding: .4em .85em; box-shadow: var(--sh-soft); }
.sr-g2hero .g2hero-chip-accent { color: var(--c-accent); background: var(--c-accent-soft); border-color: rgba(249,115,22,.28); }
.sr-g2hero .g2hero-chip-glow { color: #0e7490; background: var(--c-glow-soft); border-color: rgba(34,211,238,.4); }

.sr-g2hero .g2hero-eyebrow { font-family: var(--font-display); font-weight: 800; font-size: .82rem; letter-spacing: .14em; text-transform: uppercase; color: var(--c-ink); margin: 0 0 var(--sp-sm); }
.sr-g2hero .g2hero-title { font-family: var(--font-display); font-weight: 700; font-size: clamp(2.2rem, 4.8vw, 3.6rem); line-height: 1.04; margin: 0 0 var(--sp-md); background: linear-gradient(168deg, #16264f 0%, #244378 55%, #2f5aa0 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.sr-g2hero .g2hero-title em { font-style: normal; background: linear-gradient(96deg, #244378 0%, #2f6fb0 28%, #1f9dc4 58%, #35c6e6 84%, #f4a463 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.sr-g2hero .g2hero-sub { font-size: 1.12rem; line-height: 1.55; color: var(--c-text); font-weight: 600; max-width: 34em; margin: 0 0 var(--sp-md); }
.sr-g2hero .g2hero-copytext { font-size: .96rem; line-height: 1.62; color: var(--c-text-soft); max-width: 36em; margin: 0 0 var(--sp-lg); }

.sr-g2hero .g2hero-cta-row { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
/* Padding acotado para que los 2 CTAs entren en una sola fila dentro de la columna de copy. */
.sr-g2hero .g2hero-btn { display: inline-flex; align-items: center; gap: .45em; font-family: var(--font-display); font-weight: 700; font-size: 1rem; padding: .9em 1.15em; border-radius: var(--r-btn); border: 1px solid transparent; text-decoration: none; cursor: pointer; transition: background var(--t-micro), border-color var(--t-micro), color var(--t-micro), transform var(--t-micro), box-shadow var(--t-micro); white-space: nowrap; }
.sr-g2hero .g2hero-btn .arr { transition: transform var(--t-micro); }
.sr-g2hero .g2hero-btn:hover .arr { transform: translateX(3px); }
.sr-g2hero .g2hero-btn-primary { background: var(--c-accent); color: #fff; box-shadow: 0 10px 26px rgba(249,115,22,.32); }
.sr-g2hero .g2hero-btn-primary:hover { background: var(--c-accent-hov); box-shadow: 0 14px 32px rgba(249,115,22,.42); transform: translateY(-2px); color: #fff; }
.sr-g2hero .g2hero-btn-ghost { background: #fff; border-color: var(--c-border); color: var(--c-ink-deep); }
.sr-g2hero .g2hero-btn-ghost:hover { border-color: var(--c-glow); background: var(--c-glow-soft); transform: translateY(-2px); }
.sr-g2hero .g2hero-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 0 rgba(255,255,255,.6); animation: g2hero-pulse 2.4s var(--ease-out) infinite; }
@keyframes g2hero-pulse { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.5); } 70% { box-shadow: 0 0 0 7px rgba(255,255,255,0); } 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); } }
.sr-g2hero .g2hero-reassure { font-size: .92rem; color: var(--c-text-soft); margin: var(--sp-md) 0 0; font-style: italic; }

.sr-g2hero .g2hero-media { position: relative; display: flex; align-items: center; justify-content: center; min-height: 600px; }
/* Logo de marca: arriba a la derecha del producto (absoluto para no alterar el centrado del stage).
   top negativo → lo sube un poco para dar aire entre el logo y la imagen del producto (pedido cliente). */
.sr-g2hero .g2hero-brand { position: absolute; top: -1.75rem; right: 0; z-index: 5; display: inline-flex; align-items: center; justify-content: center; }
.sr-g2hero .g2hero-brand img { display: block; height: 78px; width: auto; max-width: 340px; object-fit: contain; }

.sr-g2hero .g2hero-stage { position: absolute; inset: 50% auto auto 50%; width: min(140%, 760px); aspect-ratio: 1; transform: translate(-50%, -50%); }
.sr-g2hero .g2hero-stage > * { position: absolute; inset: 0; }
.sr-g2hero .g2hero-stage-disc { border-radius: 50%; background: radial-gradient(circle at 50% 45%, rgba(255,255,255,.9) 0%, rgba(238,247,252,.55) 46%, transparent 70%); z-index: 2; }
.sr-g2hero .g2hero-breathe-core { border-radius: 50%; background: radial-gradient(circle at 50% 47%, rgba(34,211,238,.30) 0%, rgba(59,130,246,.15) 40%, transparent 68%), radial-gradient(circle at 56% 62%, rgba(249,115,22,.10), transparent 55%); filter: blur(8px); animation: g2hero-inhale 5.5s var(--ease-out) infinite alternate; }
.sr-g2hero .g2hero-breathe-halo { border-radius: 50%; border: 2px solid rgba(34,211,238,.5); background: radial-gradient(circle, transparent 58%, rgba(34,211,238,.14) 76%, transparent 86%); box-shadow: 0 0 26px rgba(34,211,238,.18), inset 0 0 26px rgba(34,211,238,.10); opacity: 0; animation: g2hero-exhale 7s var(--ease-out) infinite; animation-delay: var(--delay, 0s); will-change: transform, opacity; }
.sr-g2hero .g2hero-breathe-halo:nth-of-type(2) { border-color: rgba(59,130,246,.42); background: radial-gradient(circle, transparent 58%, rgba(59,130,246,.12) 76%, transparent 86%); }
.sr-g2hero .g2hero-breathe-halo:nth-of-type(3) { border-color: rgba(249,115,22,.42); background: radial-gradient(circle, transparent 58%, rgba(249,115,22,.12) 76%, transparent 86%); box-shadow: 0 0 26px rgba(249,115,22,.16), inset 0 0 26px rgba(249,115,22,.08); }
.sr-g2hero .g2hero-breathe-halo:nth-of-type(4) { border-color: rgba(103,232,249,.4); }
@keyframes g2hero-inhale { from { opacity: .45; transform: scale(.94); } to { opacity: 1; transform: scale(1.06); } }
@keyframes g2hero-exhale { 0% { transform: scale(.42); opacity: 0; } 16% { opacity: .82; } 100% { transform: scale(1.16); opacity: 0; } }

/* flex:none evita que el flex lo encoja, y max-width:none anula el `img{max-width:100%}` global del tema. */
.sr-g2hero .g2hero-stage-product { position: relative; z-index: 3; left: clamp(-44px, -3vw, 0px); width: 114%; max-width: none; flex: none; margin: 0 auto; display: block; filter: drop-shadow(0 32px 54px rgba(20,29,55,.26)); }

.sr-g2hero .g2hero-stage-labels { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
/* ---------- Modal de las píldoras (solo modo estrecho) ----------
   Vive colgado del <body>, no del hero: ahí el overflow:hidden del hero y el
   filtro del equipo lo recortarían. Por eso no va scopeado bajo .sr-g2hero. */
.sr-g2hero-modal {
	position: fixed; inset: 0; z-index: 10000;
	display: flex; align-items: center; justify-content: center;
	padding: clamp(1rem, 6vw, 2rem);
}
.sr-g2hero-modal[hidden] { display: none; }
.sr-g2hero-modal-bd { position: absolute; inset: 0; background: rgba(11,22,50,.62); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.sr-g2hero-modal-box {
	position: relative; width: 100%; max-width: 24rem;
	padding: 1.5rem 1.35rem 1.35rem;
	background: #fff; border-radius: 16px;
	box-shadow: 0 24px 60px rgba(11,22,50,.35);
	animation: sr-g2hero-modal-in .22s var(--ease-out, ease-out) both;
}
@keyframes sr-g2hero-modal-in { from { opacity: 0; transform: translateY(10px) scale(.98); } }
/* Los estilos base de botón del tema (fondo de marca, sombra) se cuelan aquí,
   así que se declaran todos los estados en vez de confiar en el inicial. */
.sr-g2hero-modal-x,
.sr-g2hero-modal-x:hover,
.sr-g2hero-modal-x:focus,
.sr-g2hero-modal-x:focus-visible,
.sr-g2hero-modal-x:active {
	position: absolute; top: .55rem; right: .55rem;
	width: 2.25rem; height: 2.25rem; min-width: 0; padding: 0; margin: 0;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent; background-image: none;
	border: 0; border-radius: 50%; box-shadow: none;
	color: var(--c-text-soft, #5b6b8c); cursor: pointer;
}
.sr-g2hero-modal-x:hover { background: rgba(20,29,55,.07); color: var(--c-ink-deep, #0e1d41); }
.sr-g2hero-modal-x:focus-visible { outline: 2px solid var(--c-accent, #f97316); outline-offset: 2px; }
.sr-g2hero-modal-x svg { width: 1.1rem; height: 1.1rem; }
.sr-g2hero-modal-t {
	margin: 0 2rem .5rem 0;
	font-family: var(--font-display); font-weight: 800; font-size: .78rem;
	letter-spacing: .1em; text-transform: uppercase; color: var(--c-ink-deep, #0e1d41);
}
.sr-g2hero-modal-d {
	margin: 0; font-family: var(--font-body); font-size: .95rem;
	line-height: 1.6; color: var(--c-text, #3d4d6b);
}
@media (prefers-reduced-motion: reduce) { .sr-g2hero-modal-box { animation: none; } }
/* En escritorio manda el tooltip de cada píldora: el modal no se abre nunca. */
@media (min-width: 861px) { .sr-g2hero-modal { display: none; } }
.sr-g2hero .g2hero-olabel { position: absolute; display: inline-flex; align-items: center; gap: .5em; font-family: var(--font-display); font-weight: 800; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--c-ink-deep); background: rgba(255,255,255,.55); backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); padding: .45em .75em; border-radius: var(--r-pill); box-shadow: var(--sh-soft); align-items: center; text-align: left; width: max-content; max-width: 15.5em; line-height: 1.25; --dot-x: -12px; opacity: 0; transform: translate(var(--dot-x), calc(-50% + 8px)); animation: g2hero-label-in .6s var(--ease-expo) forwards; animation-delay: calc(.5s + var(--i) * .18s); }
@keyframes g2hero-label-in { to { opacity: 1; transform: translate(var(--dot-x), -50%); } }
.sr-g2hero .g2hero-olabel-t { display: block; }
.sr-g2hero .g2hero-olabel i { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--c-glow); box-shadow: 0 0 8px rgba(34,211,238,.8); animation: g2hero-node-pulse 2.4s ease-in-out infinite; animation-delay: calc(var(--i) * .5s); }
@keyframes g2hero-node-pulse { 0%,100% { box-shadow: 0 0 8px rgba(34,211,238,.6); } 50% { box-shadow: 0 0 16px rgba(34,211,238,1); } }
.sr-g2hero .g2hero-olabel-tl { top: 14%; left: -2%; }
.sr-g2hero .g2hero-olabel-bl { bottom: 16%; left: 2%; }
.sr-g2hero .g2hero-olabel-tr { top: 20%; right: -2%; }
.sr-g2hero .g2hero-olabel-br { bottom: 12%; right: 0; }
.sr-g2hero .g2hero-olabel-p1 { top: 20%; right: 2%; }    /* Multi-port cap (tapa, arriba) */
.sr-g2hero .g2hero-olabel-p2 { top: 42%; right: -2%; }   /* Tubing management system (anillos del shell) */
.sr-g2hero .g2hero-olabel-p3 { top: 34%; left: -2%; }    /* Simplified external tubing (mangueras, izquierda) */
.sr-g2hero .g2hero-olabel-p4 { top: 56%; left: 4%; }     /* Stabilized internal tubing (tubos internos) */
.sr-g2hero .g2hero-olabel-p5 { bottom: 10%; right: 6%; } /* High contrast base (base negra, abajo) */

/* Tooltip en hover/foco de cada pildora. El contenedor de labels tiene pointer-events:none,
   asi que se reactiva solo en la pildora para que el hover funcione sobre la imagen. */
.sr-g2hero .g2hero-olabel { pointer-events: auto; cursor: default; }
.sr-g2hero .g2hero-olabel:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }
.sr-g2hero .g2hero-tip { position: absolute; top: calc(100% + .55em); left: 0; width: max-content; max-width: 15rem; padding: .7em .85em; background: rgba(14,29,65,.88); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; font-family: var(--font-body); font-size: .82rem; font-weight: 400; letter-spacing: 0; text-transform: none; line-height: 1.5; text-align: left; white-space: normal; border-radius: 10px; box-shadow: 0 12px 28px rgba(20,29,55,.28); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .22s var(--ease-out), transform .22s var(--ease-out), visibility .22s; z-index: 6; }
.sr-g2hero .g2hero-olabel:hover .g2hero-tip,
.sr-g2hero .g2hero-olabel:focus-visible .g2hero-tip { opacity: 1; visibility: visible; transform: none; }
/* Sin z-index propio manda el orden del DOM y la píldora siguiente tapa el
   tooltip. Al abrirse, su etiqueta sube por encima de las demás. */
.sr-g2hero .g2hero-olabel:hover,
.sr-g2hero .g2hero-olabel:focus-visible,
.sr-g2hero .g2hero-olabel:focus-within { z-index: 20; }
/* Las pildoras de la derecha abren el tooltip hacia la izquierda para no salirse del stage. */
.sr-g2hero .g2hero-olabel-p1 .g2hero-tip,
.sr-g2hero .g2hero-olabel-p2 .g2hero-tip,
.sr-g2hero .g2hero-olabel-p5 .g2hero-tip { left: auto; right: 0; }
@media (prefers-reduced-motion: reduce) { .sr-g2hero .g2hero-tip { transition: none; } }
/* Linea guia: sale del punto celeste de la pildora y "crece" hasta el tooltip.
   Se dibuja primero (sin delay) y el tooltip entra despues, para que la linea lo "traiga". */
.sr-g2hero .g2hero-olabel::after { content: ""; position: absolute; top: calc(100% - 2px); left: .7em; margin-left: 3px; width: 1px; height: .62em; background: linear-gradient(180deg, var(--c-glow), rgba(34,211,238,.15)); transform: scaleY(0); transform-origin: top center; opacity: 0; transition: transform .2s var(--ease-out), opacity .2s var(--ease-out); pointer-events: none; }
.sr-g2hero .g2hero-olabel:hover::after,
.sr-g2hero .g2hero-olabel:focus-visible::after { transform: scaleY(1); opacity: 1; }
.sr-g2hero .g2hero-tip { transition-delay: .16s; }
.sr-g2hero .g2hero-olabel:not(:hover):not(:focus-visible) .g2hero-tip { transition-delay: 0s; }
@media (prefers-reduced-motion: reduce) { .sr-g2hero .g2hero-olabel::after { transition: none; } .sr-g2hero .g2hero-tip { transition-delay: 0s; } }


@media (max-width: 860px) {
	/* minmax(0,1fr) y no 1fr: el mínimo automático de una pista deja que la
	   imagen del producto (114% de ancho) estire la columna y saque el texto
	   fuera de la pantalla. */
	.sr-g2hero .g2hero-grid { grid-template-columns: minmax(0, 1fr); }
	.sr-g2hero .g2hero-media { max-width: 520px; margin: 0 auto; order: -1; min-height: 420px; }
	.sr-g2hero .g2hero-cta-row { flex-direction: column; align-items: stretch; }
	.sr-g2hero .g2hero-btn { justify-content: center; }

	/* Aquí el escenario baja de 520px y una píldora anclada al 90% se sale sí o
	   sí; y encogerlas las solaparía entre ellas. Así que cada una se reduce a su
	   punto —que es lo que señala la pieza— y su texto se lee en la ficha de
	   abajo al pulsarlo. El texto sigue en el DOM: solo deja de verse. */
	.sr-g2hero .g2hero-olabel {
		min-width: 0 !important; padding: 0; gap: 0;
		background: none; box-shadow: none;
		-webkit-backdrop-filter: none; backdrop-filter: none;
		cursor: pointer;
		/* La píldora se muda al punto que señalaba su línea: ahí es donde está la
		   pieza. Su posición de escritorio la deja apartada del equipo, flotando
		   en el fondo. --mx/--my las calcula el render a partir del puntero. */
		left: var(--mx, 50%) !important;
		top: var(--my, 50%) !important;
		right: auto !important;
		bottom: auto !important;
		/* Centrado exacto sobre la pieza: aquí la píldora ES el punto. */
		--dot-x: -50%;
	}
	.sr-g2hero .g2hero-olabel-t,
	.sr-g2hero .g2hero-tip {
		position: absolute; width: 1px; height: 1px;
		margin: -1px; padding: 0; border: 0;
		overflow: hidden; clip-path: inset(50%); white-space: nowrap;
	}
	/* Al ser el único elemento tocable, el punto crece y lleva halo blanco para
	   leerse sobre cualquier parte del equipo. */
	.sr-g2hero .g2hero-olabel i {
		width: 17px; height: 17px;
		box-shadow: 0 0 0 3.5px rgba(255,255,255,.88), 0 0 14px rgba(34,211,238,.95);
		transition: transform .2s var(--ease-out), background .2s var(--ease-out);
	}
	.sr-g2hero .g2hero-olabel:active i { transform: scale(.88); }
	/* Área de toque cómoda sin agrandar el punto (recomendado ~44px). */
	.sr-g2hero .g2hero-olabel::before {
		content: ""; position: absolute; top: 50%; left: 50%;
		width: 44px; height: 44px; transform: translate(-50%, -50%);
		border-radius: 50%;
	}
	.sr-g2hero .g2hero-olabel::after { display: none; }

	/* Aquí las líneas guía y sus puntos del extremo solo añaden ruido y dejan
	   dudas sobre qué se toca. Se deja un único punto por característica: el de
	   la píldora, que es el que abre el modal. */
	.sr-g2hero .g2hero-leaders,
	.sr-g2hero .g2hero-leader-dot { display: none; }

	/* Rendimiento: en el móvil estas animaciones corren en bucle sobre cuatro
	   capas superpuestas, animando sombras y escalados —lo caro de repintar—, y
	   es lo que hace que el scroll se sienta pesado. Los halos siguen ahí,
	   quietos. El drop-shadow del equipo se deja, pero más barato. */
	.sr-g2hero::after,
	.sr-g2hero .g2hero-breathe-core,
	.sr-g2hero .g2hero-breathe-halo,
	.sr-g2hero .g2hero-olabel i { animation: none; }
	.sr-g2hero .g2hero-stage-product { filter: drop-shadow(0 16px 26px rgba(20,29,55,.22)); }
}
@media (prefers-reduced-motion: reduce) {
	.sr-g2hero::after, .sr-g2hero .g2hero-olabel i, .sr-g2hero .g2hero-dot { animation: none; }
	.sr-g2hero .g2hero-olabel { opacity: 1; transform: translate(var(--dot-x), -50%); animation: none; }
	.sr-g2hero .g2hero-breathe-core, .sr-g2hero .g2hero-breathe-halo { animation: none; }
	.sr-g2hero .g2hero-breathe-core { opacity: .85; }
	.sr-g2hero .g2hero-breathe-halo { opacity: .4; }
	.sr-g2hero .g2hero-breathe-halo:nth-of-type(2) { transform: scale(.72); opacity: .32; }
	.sr-g2hero .g2hero-breathe-halo:nth-of-type(3) { transform: scale(.92); opacity: .22; }
	.sr-g2hero .g2hero-breathe-halo:nth-of-type(4) { transform: scale(1.12); opacity: .14; }
}

/* La ® dentro de titulos con degradado de texto (background-clip:text + text-fill
   transparente): el <sup> hereda el relleno transparente pero NO el degradado, asi
   que quedaba invisible. Se le da relleno propio con el tono del degradado. */
.sr-g2hero .g2hero-title sup.sr-reg,
.sr-g2hero .g2hero-title em sup.sr-reg { -webkit-text-fill-color: var(--c-ink, #244378); color: var(--c-ink, #244378); }

/* Líneas guía de las etiquetas al equipo. Van bajo las píldoras (orden del DOM),
   así el trazo asoma desde su borde sin necesidad de calcular geometría. */
.sr-g2hero .g2hero-leaders { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.sr-g2hero .g2hero-leaders line {
	stroke: var(--c-ink-deep);
	stroke-width: 1.4;
	stroke-dasharray: 4 3;
	stroke-linecap: round;
	/* Mismo retardo que su píldora: entran a la vez. */
	opacity: 0;
	animation: g2hero-leader-in .6s var(--ease-expo) forwards;
	animation-delay: calc(.5s + var(--i) * .18s);
}
@keyframes g2hero-leader-in { to { opacity: .5; } }
.sr-g2hero .g2hero-leader-dot {
	position: absolute; width: 7px; height: 7px; border-radius: 50%;
	transform: translate(-50%, -50%); pointer-events: none;
	background: var(--c-glow); box-shadow: 0 0 0 3px rgba(255,255,255,.7);
	opacity: 0;
	animation: g2hero-dot-in .6s var(--ease-expo) forwards;
	animation-delay: calc(.5s + var(--i) * .18s);
}
@keyframes g2hero-dot-in { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .sr-g2hero .g2hero-leaders line { stroke-dasharray: none; opacity: .5; animation: none; }
	.sr-g2hero .g2hero-leader-dot { opacity: 1; animation: none; } }