/* ═══════════════════════════════════════════════════════════════
   Connections-Lab · Capa de impacto visual (enhance.css)
   Se carga DESPUÉS de index.Cj3HhGeZ.css — solo agrega, no rompe.
   ═══════════════════════════════════════════════════════════════ */

/* ── Barra de progreso de scroll ─────────────────────────────── */
#cl-progress{
  position:fixed;top:0;left:0;height:3px;width:0;z-index:10000;
  background:linear-gradient(90deg,#2272D9,#1A9EC4 55%,#22B573);
  box-shadow:0 0 12px rgba(34,114,217,.55);
  border-radius:0 3px 3px 0;
  pointer-events:none;
}

/* ── Hero: auroras animadas (los glows existentes cobran vida) ── */
@keyframes clDrift1{
  0%,100%{transform:translate(0,0) scale(1);opacity:.16}
  50%{transform:translate(-60px,40px) scale(1.18);opacity:.30}
}
@keyframes clDrift2{
  0%,100%{transform:translate(0,0) scale(1);opacity:.16}
  50%{transform:translate(70px,-30px) scale(1.15);opacity:.28}
}
.hero-glow-1{animation:clDrift1 13s ease-in-out infinite}
.hero-glow-2{animation:clDrift2 10s ease-in-out infinite}
.cl-glow-3{
  position:absolute;width:340px;height:340px;border-radius:50%;
  filter:blur(85px);opacity:.10;
  background:radial-gradient(circle,#1A9EC4,transparent 70%);
  top:26%;left:36%;
  animation:clDrift2 17s ease-in-out infinite reverse;
}

/* ── Hero: partículas flotantes ──────────────────────────────── */
.cl-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.cl-p{
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,.55);
  animation:clRise linear infinite;
  opacity:0;
}
.cl-p.b{background:rgba(99,179,237,.65)}
.cl-p.g{background:rgba(34,181,115,.6)}
@keyframes clRise{
  0%{transform:translateY(0);opacity:0}
  12%{opacity:.8}
  85%{opacity:.35}
  100%{transform:translateY(-46vh);opacity:0}
}

/* ── Hero: línea de electrocardiograma ───────────────────────── */
.cl-ecg{
  position:absolute;left:0;right:0;bottom:18px;
  width:100%;height:64px;pointer-events:none;opacity:.55;
}
.cl-ecg path{
  fill:none;stroke:url(#clEcgGrad);stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 0 6px rgba(34,181,115,.75));
}

/* ── Hero: titular con brillo animado en la palabra clave ────── */
#hero-section .hero-h1 em{
  background:linear-gradient(100deg,#63b3ed 0%,#a8dcff 30%,#4fe3a3 55%,#63b3ed 80%);
  background-size:230% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:clShimmer 6s ease-in-out infinite;
}
@keyframes clShimmer{
  0%,100%{background-position:0% 0}
  50%{background-position:100% 0}
}

/* ── Hero: video con halo y tilt 3D ──────────────────────────── */
.hero-media{perspective:1100px}
.hero-media::before{
  content:"";position:absolute;inset:-22px;
  background:
    radial-gradient(60% 60% at 30% 20%,rgba(34,114,217,.35),transparent 70%),
    radial-gradient(55% 55% at 75% 85%,rgba(34,181,115,.28),transparent 70%);
  filter:blur(34px);
  z-index:0;pointer-events:none;
}
.hero-video-wrap{
  position:relative;z-index:1;
  transform-style:preserve-3d;
  transition:transform .18s ease-out;
  will-change:transform;
}
/* Las tarjetas flotantes siempre por ENCIMA del video (el z-index:1
   del wrap las tapaba porque ellas no tenían z-index propio) */
.hero-media .float-card{z-index:2}

/* ── Barra de confianza: destello que la recorre ─────────────── */
.trust-bar{position:relative;overflow:hidden}
.trust-bar::after{
  content:"";position:absolute;top:0;bottom:0;width:140px;left:-160px;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.16),transparent);
  animation:clSheen 6.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes clSheen{
  0%{left:-160px}
  45%,100%{left:110%}
}

/* ── CTA principal del hero: destello periódico ──────────────── */
.hero-btn-primary{position:relative;overflow:hidden}
.hero-btn-primary::after{
  content:"";position:absolute;top:0;bottom:0;width:70px;left:-90px;
  background:linear-gradient(105deg,transparent,rgba(34,114,217,.28),transparent);
  animation:clSheen 4.5s ease-in-out infinite 1.2s;
  pointer-events:none;
}

/* ── Banda de estadísticas: números con degradado ────────────── */
/* Números de estadísticas: color sólido de marca (el degradado en
   texto de datos restaba legibilidad; énfasis por peso, no por adorno) */

/* ── Carrusel de clientes: los logos reaccionan al mouse ─────── */
/* (hover solo en dispositivos con puntero fino: en táctil provoca
   falsos positivos al tocar) */
.logo-card{transition:transform .25s cubic-bezier(0.23,1,0.32,1),box-shadow .25s cubic-bezier(0.23,1,0.32,1)}
.feat-card{transition:transform .3s cubic-bezier(0.23,1,0.32,1),box-shadow .3s cubic-bezier(0.23,1,0.32,1)}
@media (hover:hover) and (pointer:fine){
  .logo-card:hover{
    transform:translateY(-5px) scale(1.05);
    box-shadow:0 16px 34px rgba(13,48,96,.16);
  }
  .feat-card:hover{
    transform:translateY(-6px);
    box-shadow:0 22px 48px rgba(13,48,96,.12);
  }
}

/* ═══════════════════════════════════════════════════════════════
   SECCIÓN DIFERENCIACIÓN — "El Duelo": paquetes vs todo incluido
   ═══════════════════════════════════════════════════════════════ */

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

.dif-section{
  position:relative;overflow:hidden;padding:96px 0;
  background:linear-gradient(155deg,#060F1E 0%,#0A2340 45%,#0B2A52 100%);
}
.dif-bg{position:absolute;inset:0;pointer-events:none}
.dif-gridlines{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:56px 56px;
}
.dif-glow{position:absolute;border-radius:50%;filter:blur(90px)}
.dif-glow-1{
  width:560px;height:560px;top:-180px;left:-120px;opacity:.16;
  background:radial-gradient(circle,var(--blue-500),transparent 70%);
  animation:clDrift1 14s ease-in-out infinite;
}
.dif-glow-2{
  width:420px;height:420px;bottom:-140px;right:-80px;opacity:.14;
  background:radial-gradient(circle,var(--green-500),transparent 70%);
  animation:clDrift2 11s ease-in-out infinite;
}
.dif-inner{position:relative;z-index:1}

/* Header */
.dif-header{text-align:center;max-width:680px;margin:0 auto 60px}
.dif-section .dif-eyebrow{color:var(--blue-400);justify-content:center}
.dif-section .dif-eyebrow:before{background:var(--blue-400)}
.dif-section .dif-title{color:#fff}
.dif-section .dif-title em{
  background:linear-gradient(100deg,#63b3ed 0%,#a8dcff 30%,#4fe3a3 55%,#63b3ed 80%);
  background-size:230% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:clShimmer 6s ease-in-out infinite;
}
.dif-section .dif-sub{color:#B9C6DA;margin-left:auto;margin-right:auto}

/* Arena (mobile-first: columna) */
.dif-arena{
  position:relative;display:flex;flex-direction:column;gap:16px;
  max-width:560px;margin:0 auto;
}
.dif-card{border-radius:20px;padding:28px 24px}
.dif-card-title{
  font-family:var(--font-h);font-weight:800;font-size:1.05rem;
  letter-spacing:-.01em;margin-bottom:18px;
}

/* Tarjeta "otros sistemas": fantasma que se apaga */
.dif-section .dif-card-otros{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  transition:opacity .55s ease,transform .55s ease,filter .9s ease .6s;
}
.dif-card-otros .dif-card-title{color:#C7D2E3}
.dif-section.dif-on .dif-card-otros{filter:grayscale(.45) brightness(.85)}
.dif-x{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);
  color:#8FA2BD;display:flex;align-items:center;justify-content:center;
  font-size:.78rem;font-weight:700;
}
.dif-card-otros .dif-list li{color:#A9B6CC}

/* Medallón VS */
.dif-vs{
  position:relative;width:56px;height:56px;margin:-6px auto;z-index:2;
  border-radius:50%;background:var(--blue-950);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-h);font-weight:800;font-size:.92rem;color:#fff;
  opacity:0;transform:scale(.5);
  transition:transform .45s cubic-bezier(.34,1.56,.64,1) .5s,opacity .3s ease .5s;
}
.dif-vs::before{
  content:"";position:absolute;inset:-2px;border-radius:50%;z-index:-1;
  background:conic-gradient(var(--blue-500),var(--green-400),var(--blue-500));
}
.dif-section.dif-on .dif-vs{
  opacity:1;transform:scale(1);
  animation:difPulse 2.4s ease-out 1.4s infinite;
}
@keyframes difPulse{
  0%{box-shadow:0 0 0 0 rgba(34,181,115,.35)}
  70%{box-shadow:0 0 0 14px rgba(34,181,115,0)}
  100%{box-shadow:0 0 0 0 rgba(34,181,115,0)}
}

/* Tarjeta Connections-Lab: borde conic animado + tarjeta blanca */
@property --difAngle{syntax:'<angle>';initial-value:0deg;inherits:false}
.dif-section .dif-card-cl-wrap{position:relative;border-radius:24px;padding:2px;transition:opacity .55s ease,transform .55s ease,box-shadow .9s ease .6s}
.dif-card-cl-wrap::before{
  content:"";position:absolute;inset:0;border-radius:24px;
  background:conic-gradient(from var(--difAngle,0deg),var(--blue-600),var(--teal-400),var(--green-400),var(--blue-600));
  opacity:0;transition:opacity .9s ease .6s;
}
.dif-section.dif-on .dif-card-cl-wrap{
  box-shadow:0 32px 80px rgba(6,15,30,.55),0 0 60px rgba(34,181,115,.16);
}
.dif-section.dif-on .dif-card-cl-wrap::before{
  opacity:1;animation:difSpin 6s linear infinite;
}
@keyframes difSpin{to{--difAngle:360deg}}

.dif-card-cl{
  position:relative;background:#fff;border-radius:22px;
  padding:30px 26px 24px;overflow:hidden;
}
.dif-card-cl .dif-card-title{color:var(--text)}
.dif-card-cl .dif-list li{color:var(--sub);font-weight:500}

/* Badge sello: se estampa al final de la coreografía */
.dif-badge{
  display:inline-flex;align-items:center;
  background:var(--green-50);color:var(--green-700);
  border:1.5px solid rgba(34,181,115,.5);
  font-family:var(--font-h);font-weight:800;font-size:.74rem;
  letter-spacing:.05em;text-transform:uppercase;
  padding:6px 14px;border-radius:100px;margin-bottom:14px;
  opacity:0;transform:scale(1.8);
}
.dif-section.dif-on .dif-badge{
  animation:difStamp .3s cubic-bezier(.34,1.56,.64,1) 1.9s forwards;
}
@keyframes difStamp{
  0%{opacity:0;transform:scale(1.8) rotate(0deg)}
  60%{opacity:1}
  100%{opacity:1;transform:scale(1) rotate(-3deg)}
}
.dif-section.dif-on .dif-card-cl{animation:difShake .18s ease 2.2s}
@keyframes difShake{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(2px)}
}

/* Listas: cascada espejo ✗ → ✓ */
.dif-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px}
.dif-list li{
  display:flex;align-items:flex-start;gap:12px;
  font-size:.93rem;line-height:1.5;
  opacity:0;transform:translateY(10px);
  transition:opacity .45s ease,transform .45s ease;
}
.dif-section.dif-on .dif-list li{opacity:1;transform:none}
.dif-card-otros .dif-list li:nth-child(1){transition-delay:.55s}
.dif-card-otros .dif-list li:nth-child(2){transition-delay:.71s}
.dif-card-otros .dif-list li:nth-child(3){transition-delay:.87s}
.dif-card-otros .dif-list li:nth-child(4){transition-delay:1.03s}
.dif-card-cl .dif-list li:nth-child(1){transition-delay:.70s}
.dif-card-cl .dif-list li:nth-child(2){transition-delay:.86s}
.dif-card-cl .dif-list li:nth-child(3){transition-delay:1.02s}
.dif-card-cl .dif-list li:nth-child(4){transition-delay:1.18s}

/* Checks que se dibujan */
.dif-check{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  background:var(--green-50);border:1px solid rgba(34,181,115,.4);
  color:var(--green-600);display:flex;align-items:center;justify-content:center;
}
.dif-check svg{width:14px;height:14px}
.dif-check svg path{stroke-dasharray:22;stroke-dashoffset:22;transition:stroke-dashoffset .4s ease}
.dif-section.dif-on .dif-card-cl .dif-list li:nth-child(1) .dif-check svg path{stroke-dashoffset:0;transition-delay:.90s}
.dif-section.dif-on .dif-card-cl .dif-list li:nth-child(2) .dif-check svg path{stroke-dashoffset:0;transition-delay:1.06s}
.dif-section.dif-on .dif-card-cl .dif-list li:nth-child(3) .dif-check svg path{stroke-dashoffset:0;transition-delay:1.22s}
.dif-section.dif-on .dif-card-cl .dif-list li:nth-child(4) .dif-check svg path{stroke-dashoffset:0;transition-delay:1.38s}

/* Divisor, CTA y nota */
.dif-divider{height:1px;background:var(--border);margin:20px 0 16px}
.dif-section .dif-cta{width:100%;justify-content:center;font-size:.95rem}
.dif-note{margin-top:12px;text-align:center;color:var(--sub);font-size:.8rem}

/* Sheen de una sola pasada sobre la tarjeta blanca */
.dif-card-cl::after{
  content:"";position:absolute;top:0;bottom:0;width:80px;left:-120px;
  background:linear-gradient(105deg,transparent,rgba(34,114,217,.16),transparent);
  transform:skewX(-12deg);pointer-events:none;
}
.dif-section.dif-on .dif-card-cl::after{animation:difSheen 1s ease 2.4s forwards}
@keyframes difSheen{to{left:120%}}

/* Desktop: arena en duelo lado a lado */
@media (min-width:1101px){
  .dif-section{padding:110px 0}
  .dif-arena{
    display:grid;grid-template-columns:1fr 1.15fr;gap:56px;
    align-items:center;max-width:1040px;
  }
  .dif-card{padding:36px 32px}
  .dif-card-cl{padding:34px 32px 28px}
  .dif-card-cl-wrap{transform:scale(1.02)}
  .dif-vs{
    position:absolute;margin:0;width:64px;height:64px;font-size:1rem;
    left:calc((100% - 56px)*.4651 + 28px);top:50%;
    transform:translate(-50%,-50%) scale(.5);
  }
  .dif-section.dif-on .dif-vs{transform:translate(-50%,-50%) scale(1)}
  /* Entrada en duelo: lados opuestos */
  .dif-card-otros.reveal{transform:translateX(-36px)}
  .dif-card-cl-wrap.reveal{transform:translateX(36px) scale(1.02)}
  .dif-card-otros.reveal.visible{transform:none}
  .dif-card-cl-wrap.reveal.visible{transform:scale(1.02)}
}

/* Spotlight en hover (solo desktop con mouse) */
@media (hover:hover) and (pointer:fine){
  .dif-arena:has(.dif-card-cl-wrap:hover) .dif-card-otros{opacity:.7}
  .dif-card-cl-wrap:hover .dif-card-cl::after{animation:difSheen .7s ease forwards}
}

/* ═══════════════════════════════════════════════════════════════
   FIX: FAQ reconstruidas por el switch de pestañas (Radiología /
   Clínica Mixta). El JS del sitio re-crea los .faq-item SIN los
   atributos data-astro-cid, así que el CSS scoped de Astro deja de
   aplicar. Réplica exacta de esas reglas, ancladas a #faq-list.
   ═══════════════════════════════════════════════════════════════ */
#faq-list .faq-item{border-bottom:1px solid var(--border);overflow:hidden}
#faq-list .faq-item:first-child{border-top:1px solid var(--border)}
#faq-list .faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:20px 4px;background:none;border:none;cursor:pointer;
  text-align:left;font-family:var(--font-h);font-size:.94rem;font-weight:700;
  color:var(--text);transition:color .18s;
}
#faq-list .faq-q:hover,
#faq-list .faq-q[aria-expanded=true]{color:var(--accent)}
#faq-list .faq-arrow{flex-shrink:0;color:var(--muted);transition:transform .25s ease}
#faq-list .faq-q[aria-expanded=true] .faq-arrow{transform:rotate(180deg);color:var(--accent)}
#faq-list .faq-a{
  font-size:.88rem;color:var(--sub);line-height:1.72;padding:0 4px 20px;
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .35s ease,padding .25s ease,opacity .25s ease;
}
#faq-list .faq-item.open .faq-a{max-height:200px;opacity:1}

/* ═══════════════════════════════════════════════════════════════
   MODAL DE BIENVENIDA — primera visita: "Todo en un solo lugar"
   ═══════════════════════════════════════════════════════════════ */
.clw-overlay{
  position:fixed;inset:0;z-index:100000;
  display:flex;align-items:center;justify-content:center;padding:20px;
  overflow-y:auto;
  background:rgba(6,15,30,.72);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .35s ease;
}
.clw-overlay.open{opacity:1;pointer-events:auto}

.clw-wrap{
  position:relative;border-radius:26px;padding:2px;
  max-width:500px;width:100%;margin:auto;
  background:conic-gradient(from var(--difAngle,0deg),var(--blue-600),var(--teal-400),var(--green-400),var(--blue-600));
  animation:difSpin 7s linear infinite;
  box-shadow:0 40px 100px rgba(0,0,0,.6);
  transform:translateY(16px) scale(.94);
  transition:transform .45s cubic-bezier(.34,1.56,.64,1);
}
.clw-overlay.open .clw-wrap{transform:none}

.clw-card{
  position:relative;border-radius:24px;overflow:hidden;text-align:center;
  background:linear-gradient(155deg,#081A33 0%,#0A2340 55%,#0B2A52 100%);
  padding:38px 30px 30px;
}
.clw-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(55% 40% at 20% 0%,rgba(34,114,217,.25),transparent 70%),
    radial-gradient(50% 40% at 85% 100%,rgba(34,181,115,.18),transparent 70%);
}
.clw-card > *{position:relative}

.clw-close{
  position:absolute;top:14px;right:14px;width:34px;height:34px;
  border-radius:50%;border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.08);color:#CBD8EA;font-size:.95rem;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s,color .2s;z-index:2;
}
.clw-close:hover{background:rgba(255,255,255,.16);color:#fff}

.clw-logo{
  width:56px;height:56px;border-radius:16px;background:#fff;
  padding:6px;margin:0 auto 14px;display:block;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.clw-badge{
  display:inline-flex;align-items:center;
  background:rgba(34,181,115,.14);color:#4FE3A3;
  border:1.5px solid rgba(34,181,115,.45);
  font-family:var(--font-h);font-weight:800;font-size:.72rem;
  letter-spacing:.05em;text-transform:uppercase;
  padding:6px 14px;border-radius:100px;
  opacity:0;transform:scale(1.8);
}
.clw-overlay.open .clw-badge{
  animation:difStamp .3s cubic-bezier(.34,1.56,.64,1) .55s forwards;
}
.clw-title{
  font-family:var(--font-h);font-size:1.55rem;font-weight:800;
  color:#fff;line-height:1.22;letter-spacing:-.02em;margin:12px 0 10px;
}
.clw-title em{
  font-style:normal;
  background:linear-gradient(100deg,#63b3ed 0%,#a8dcff 30%,#4fe3a3 55%,#63b3ed 80%);
  background-size:230% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:clShimmer 6s ease-in-out infinite;
}
.clw-sub{
  color:#B9C6DA;font-size:.92rem;line-height:1.65;
  margin:0 auto 20px;max-width:400px;
}
.clw-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}
.clw-chip{
  display:flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:12px;padding:10px 12px;
  color:#DCE6F5;font-size:.8rem;font-weight:600;text-align:left;
}
.clw-check{
  width:20px;height:20px;border-radius:50%;flex-shrink:0;
  background:rgba(34,181,115,.18);border:1px solid rgba(34,181,115,.5);
  color:#4FE3A3;display:flex;align-items:center;justify-content:center;
  font-size:.62rem;font-weight:800;
}
.clw-close:focus-visible{outline:2px solid var(--blue-400);outline-offset:2px}

/* Barra de cuenta regresiva del cierre automático (7s) */
.clw-timer{
  position:absolute;left:0;right:0;bottom:0;height:4px;
  background:rgba(255,255,255,.08);overflow:hidden;
}
.clw-timer span{
  display:block;height:100%;width:100%;
  background:linear-gradient(90deg,var(--blue-500),var(--teal-400),var(--green-400));
  transform-origin:left;transform:scaleX(1);
}
.clw-overlay.open .clw-timer span{
  animation:clwCountdown 7s linear forwards;
}
@keyframes clwCountdown{to{transform:scaleX(0)}}

@media (max-width:480px){
  .clw-card{padding:32px 20px 24px}
  .clw-grid{grid-template-columns:1fr}
}

/* ── Accesibilidad: respetar movimiento reducido ─────────────── */
@media (prefers-reduced-motion: reduce){
  .clw-overlay{transition:none}
  .clw-wrap{
    animation:none;transform:none;transition:none;
    background:linear-gradient(135deg,var(--blue-600),var(--teal-400),var(--green-400));
  }
  .clw-badge{opacity:1;transform:scale(1) rotate(-3deg);animation:none !important}
  .clw-title em{animation:none}
  .clw-timer{display:none}
  #cl-progress{display:none}
  .hero-glow-1,.hero-glow-2,.cl-glow-3,
  .cl-p,.cl-ecg path,
  #hero-section .hero-h1 em,
  .trust-bar::after,.hero-btn-primary::after{animation:none !important}
  .cl-particles,.cl-ecg{display:none}
  .hero-video-wrap{transition:none}

  /* Sección diferenciación: saltar directo a estados finales */
  .dif-glow-1,.dif-glow-2{animation:none}
  .dif-section .dif-title em{animation:none}
  .dif-section .dif-header.reveal{opacity:1;transform:none;transition:none}
  .dif-section .dif-card-otros{filter:grayscale(.45) brightness(.85);transition:none}
  .dif-section .dif-card-cl-wrap{box-shadow:0 32px 80px rgba(6,15,30,.55),0 0 60px rgba(34,181,115,.16);transition:none}
  .dif-card-cl-wrap::before{
    opacity:1;animation:none !important;
    background:linear-gradient(135deg,var(--blue-600),var(--teal-400),var(--green-400));
  }
  .dif-list li{opacity:1;transform:none;transition:none}
  .dif-badge{opacity:1;transform:scale(1) rotate(-3deg);animation:none !important}
  .dif-vs{opacity:1;transform:scale(1);transition:none;animation:none !important}
  .dif-check svg path{stroke-dashoffset:0;transition:none}
  .dif-card-cl::after{display:none}
  .dif-section.dif-on .dif-card-cl{animation:none}
  .dif-card-otros.reveal,.dif-card-cl-wrap.reveal{transform:none;opacity:1;transition:none}
}
@media (prefers-reduced-motion: reduce) and (min-width:1101px){
  .dif-vs{transform:translate(-50%,-50%) scale(1)}
  .dif-card-cl-wrap.reveal{transform:scale(1.02)}
}

/* ═══════════════════════════════════════════════════════════════
   PULIDO v3 — micro-interacciones y detalle fino
   (guiado por emil-design-eng · impeccable · ui-ux-pro-max)
   ═══════════════════════════════════════════════════════════════ */

:root{
  --ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out-strong: cubic-bezier(0.77, 0, 0.175, 1);
}

/* Los saltos a anclas no quedan ocultos bajo el nav sticky */
html{scroll-padding-top:84px}

/* Íconos SVG (reemplazo de emojis): tamaño heredado del contenedor,
   color según el rol de cada bloque */
.feat-icon svg,.prob-icon-wrap svg,.fc-icon svg,.sol-icon svg,
.faq-cta-icon svg,.success-icon svg{width:1em;height:1em;display:block}
.feat-icon{color:var(--accent)}
.prob-icon-wrap{color:#B91C1C}
.fc-icon{color:var(--accent)}
.faq-cta-icon{color:var(--accent)}
.success-icon{color:#16A34A;display:flex;justify-content:center}

/* Tipografía: titulares balanceados, prosa sin viudas */
h1,h2,h3{text-wrap:balance}
.hero-sub,.s-sub,.faq-a,.prob-x,.feat-x,.dif-sub,.clw-sub,.cta-sub{text-wrap:pretty}

/* Transiciones con propiedades explícitas y curvas intencionales
   (sustituye los transition:all del bundle; clase doblada para ganar
   a los selectores con atributo de Astro y al <style> inline) */
.btn.btn{transition:transform .18s var(--ease-out-strong),box-shadow .18s var(--ease-out-strong),background-color .18s ease,border-color .18s ease}
.nav-tab.nav-tab{transition:color .15s ease,background-color .15s ease,transform .12s var(--ease-out-strong)}
.btn-nav-cta.btn-nav-cta{transition:transform .18s var(--ease-out-strong),box-shadow .18s var(--ease-out-strong),background-color .18s ease}
.hero-btn-primary.hero-btn-primary,.hero-btn-ghost.hero-btn-ghost{transition:transform .18s var(--ease-out-strong),box-shadow .18s var(--ease-out-strong),background-color .18s ease,border-color .18s ease}
.faq-cta-btn.faq-cta-btn{transition:transform .18s var(--ease-out-strong),background-color .18s ease}
.wa-btn.wa-btn{transition:transform .18s var(--ease-out-strong)}
.clw-close{transition:transform .15s var(--ease-out-strong),background .2s ease,color .2s ease}

/* Feedback al presionar: la interfaz confirma que escuchó */
.btn:active,.btn-nav-cta:active,.hero-btn-primary:active,.hero-btn-ghost:active,
.faq-cta-btn:active,.wa-btn:active,.dif-cta:active,.clw-close:active,
.btn-submit:active,.nav-tab:active,.modal-close:active,.modal-submit:active{
  transform:scale(.97);
}

/* Revelados y FAQ con deceleración fuerte */
.reveal.reveal{transition-timing-function:var(--ease-out-strong)}
.faq-arrow.faq-arrow,#faq-list .faq-arrow{transition:transform .22s var(--ease-out-strong)}

/* Modal de demo: entra con escala sutil (nada aparece de la nada),
   sale más rápido de lo que entra */
.modal-overlay .modal-card{
  transform:translateY(14px) scale(.97);
  transition:transform .28s var(--ease-out-strong);
}
.modal-overlay.open .modal-card{transform:none}
.modal-overlay:not(.open){transition-duration:.18s}
.modal-overlay:not(.open) .modal-card{transition-duration:.18s}

/* Modal de bienvenida: salida más rápida que la entrada */
.clw-overlay:not(.open){transition-duration:.2s}
.clw-overlay:not(.open) .clw-wrap{transition-duration:.2s}

/* Foco visible consistente en todo lo interactivo */
.nav-tab:focus-visible,.faq-q:focus-visible,.btn:focus-visible,
.btn-nav-cta:focus-visible,.hero-btn-primary:focus-visible,
.hero-btn-ghost:focus-visible,.wa-btn:focus-visible,
.footer-link:focus-visible,.nav-phone:focus-visible,
.modal-close:focus-visible,.modal-submit:focus-visible{
  outline:2px solid var(--blue-400);
  outline-offset:2px;
}

/* Objetivos táctiles ≥44px en pantallas táctiles */
@media (pointer:coarse){
  .clw-close{width:44px;height:44px}
  .modal-close{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .wa-tip-close{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
}

/* Movimiento reducido: sin desplazamientos, solo fundidos */
@media (prefers-reduced-motion: reduce){
  .reveal{transform:none !important;transition:opacity .2s ease}
  .modal-overlay .modal-card{transform:none;transition:opacity .2s ease}
  .logo-card,.feat-card{transition:none}
}

/* ═══════════════════════════════════════════════════════════════
   CONTRASTE AA — Regla del Gris Prohibido (DESIGN.md)
   Textos que usaban Gris Silencio #7A8AA0 sobre blanco (3.5:1)
   o blanco al 50% sobre oscuro. Clase doblada para ganar cascada.
   ═══════════════════════════════════════════════════════════════ */
.fc-sub.fc-sub{color:var(--sub)}
.cs-l.cs-l{color:var(--sub)}
.modal-privacy.modal-privacy{color:var(--sub)}
.wa-tip-close.wa-tip-close{color:var(--sub)}
.proof-l.proof-l{color:rgba(255,255,255,.72)}