/* ============================================================
   SOPORTE VITAL DE COSTA RICA — Sistema de diseño
   Rojo Vital #C41E2A · Azul Institucional #12224F · Ámbar #E8B923
   Display: Oswald · Cuerpo: Inter · Datos: JetBrains Mono
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  --rojo: #C41E2A;
  --rojo-dark: #8F1420;
  --rojo-bright: #E42839;
  --azul: #12224F;
  --azul-2: #1B3266;
  --azul-3: #26407F;
  --ambar: #E8B923;
  --ambar-dim: #B8931B;
  --carbon: #14161C;
  --carbon-2: #1D2029;
  --niebla: #F4F5F7;
  --niebla-2: #E9EBEF;
  --blanco: #FFFFFF;
  --texto: #191B22;
  --texto-suave: #5B6170;
  --linea: #E3E5EA;

  --display: 'Oswald', 'Arial Narrow', sans-serif;
  --cuerpo: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --mono: 'JetBrains Mono', 'SFMono-Regular', monospace;

  --radio: 6px;
  --radio-lg: 14px;
  --sombra: 0 10px 30px -12px rgba(18,34,79,0.35);
  --sombra-sm: 0 4px 14px -6px rgba(18,34,79,0.25);

  --header-h: 76px;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
body{
  margin:0;
  font-family: var(--cuerpo);
  color: var(--texto);
  background: var(--blanco);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family: var(--display); margin:0; letter-spacing:.01em; }
p{ margin:0; }
button{ font-family:inherit; cursor:pointer; }

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--ambar); color:var(--carbon);
  padding:10px 16px; z-index:999; font-weight:700;
}
.skip-link:focus{ left:8px; top:8px; }

:focus-visible{ outline: 3px solid var(--ambar); outline-offset:2px; }

.contenedor{ width:100%; max-width:1180px; margin:0 auto; padding:0 24px; }

.eyebrow{
  font-family: var(--mono); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
  color: var(--rojo); font-weight:700; display:flex; align-items:center; gap:8px;
}
.eyebrow::before{
  content:''; width:7px; height:7px; border-radius:50%; background: var(--rojo);
  box-shadow: 0 0 0 4px rgba(196,30,42,0.15);
}

.pulso{ position:relative; width:9px; height:9px; border-radius:50%; background:#33D17A; flex-shrink:0; }
.pulso::after{
  content:''; position:absolute; inset:-6px; border-radius:50%; border:2px solid #33D17A;
  animation: pulso 1.8s ease-out infinite;
}
@keyframes pulso{
  0%{ transform:scale(.5); opacity:.9; }
  100%{ transform:scale(1.9); opacity:0; }
}

/* ---------- Barra de despacho (ticker) ---------- */
.ticker-bar{
  background: var(--carbon);
  color: #C9CCD6;
  font-family: var(--mono);
  font-size: 12.5px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.ticker-wrap{
  display:flex; align-items:center; gap:22px;
  max-width:1180px; margin:0 auto; padding:8px 24px;
  overflow:hidden; white-space:nowrap;
}
.ticker-live{
  display:flex; align-items:center; gap:8px; color:#33D17A; font-weight:700;
  flex-shrink:0; padding-right:16px; border-right:1px solid rgba(255,255,255,.15);
}
.ticker-track{ display:flex; gap:36px; animation: desplazar 26s linear infinite; }
.ticker-bar:hover .ticker-track{ animation-play-state: paused; }
.ticker-track span{ color:#8A8FA0; }
.ticker-track strong{ color:#E9EBEF; font-weight:500; }
@keyframes desplazar{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}

/* ---------- Header ---------- */
.header{
  position: sticky; top:0; z-index:80;
  height: var(--header-h);
  display:flex; align-items:center;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--linea);
}
.header-inner{
  width:100%; max-width:1180px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.marca{ display:flex; align-items:center; gap:10px; }
.marca img{ height:44px; width:auto; }
.marca-texto{ display:flex; flex-direction:column; line-height:1.05; }
.marca-texto strong{ font-family:var(--display); font-size:16px; letter-spacing:.02em; color:var(--azul); }
.marca-texto span{ font-family:var(--mono); font-size:10.5px; color:var(--texto-suave); letter-spacing:.06em; }

.nav-principal{ display:flex; align-items:center; gap:28px; }
.nav-principal a{
  font-size:14.5px; font-weight:600; color:var(--texto);
  position:relative; padding:6px 0;
}
.nav-principal a::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--rojo);
  transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
}
.nav-principal a:hover::after{ transform:scaleX(1); }

.header-cta{ display:flex; align-items:center; gap:10px; }
.nav-toggle{
  display:none; background:none; border:2px solid var(--azul); border-radius:8px;
  width:42px; height:42px; align-items:center; justify-content:center;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:''; display:block; width:18px; height:2px; background:var(--azul); position:relative;
}
.nav-toggle span::before{ position:absolute; top:-6px; }
.nav-toggle span::after{ position:absolute; top:6px; }

/* ---------- Botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-weight:700; font-size:14.5px; padding:13px 22px; border-radius:var(--radio);
  border:2px solid transparent; transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
.btn:active{ transform: translateY(1px); }
.btn-rojo{ background:var(--rojo); color:#fff; box-shadow: var(--sombra-sm); }
.btn-rojo:hover{ background:var(--rojo-bright); box-shadow:0 10px 22px -8px rgba(196,30,42,.55); }
.btn-whatsapp{ background:#22C55E; color:#fff; box-shadow:0 10px 22px -8px rgba(34,197,94,.5); }
.btn-whatsapp:hover{ background:#1FAF54; }
.btn-outline{ background:transparent; border-color: var(--azul); color:var(--azul); }
.btn-outline:hover{ background:var(--azul); color:#fff; }
.btn-outline-claro{ background:transparent; border-color: rgba(255,255,255,.5); color:#fff; }
.btn-outline-claro:hover{ background: rgba(255,255,255,.12); border-color:#fff; }
.btn-sm{ padding:9px 15px; font-size:13px; }
.btn svg{ width:18px; height:18px; flex-shrink:0; }

/* ---------- Hero: panel de despacho ---------- */
.hero{
  position:relative; background: var(--azul); color:#fff; overflow:hidden;
  padding: 64px 0 0;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
}
.hero-bg img{ width:100%; height:100%; object-fit:cover; opacity:.34; }
.hero-bg::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(18,34,79,.55) 0%, rgba(18,34,79,.88) 55%, var(--azul) 100%),
              linear-gradient(90deg, rgba(18,34,79,.98) 0%, rgba(18,34,79,.35) 55%);
}
.hero-inner{ position:relative; z-index:2; }
.hero-grid{
  display:grid; grid-template-columns: 1.15fr .85fr; gap:40px; align-items:end;
  padding-bottom: 46px;
}
.hero-eyebrow{
  font-family:var(--mono); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ambar); display:flex; align-items:center; gap:10px; margin-bottom:22px; font-weight:700;
}
.hero h1{
  font-size: clamp(40px, 5.6vw, 68px); line-height:1.02; font-weight:700; margin-bottom:20px;
  text-wrap: balance;
}
.hero h1 em{ font-style:normal; color:var(--ambar); }
.hero-sub{
  font-size:18px; line-height:1.55; color:#D7DCEA; max-width:52ch; margin-bottom:32px; font-weight:400;
}
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:34px; }

.hero-numeros{
  display:flex; gap:22px; flex-wrap:wrap; font-family:var(--mono); font-size:13px; color:#AEB5C9;
}
.hero-numeros b{ color:#fff; font-size:15px; letter-spacing:.02em; }

/* Panel de despacho (tarjeta lateral del hero) */
.panel-despacho{
  background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16);
  border-radius: var(--radio-lg); padding:22px; backdrop-filter: blur(6px);
  box-shadow: var(--sombra);
}
.panel-despacho-top{
  display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;
  padding-bottom:14px; border-bottom:1px dashed rgba(255,255,255,.2);
}
.panel-despacho-top .estado{
  display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12px;
  color:#33D17A; font-weight:700; letter-spacing:.04em;
}
.panel-despacho-top .hora{ font-family:var(--mono); font-size:12px; color:#8A93AE; }
.panel-lista{ display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
.panel-item{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-size:14px; padding:10px 12px; background:rgba(255,255,255,.05); border-radius:8px;
}
.panel-item span:first-child{ display:flex; align-items:center; gap:10px; font-weight:600; }
.panel-item .badge{
  font-family:var(--mono); font-size:11px; padding:3px 8px; border-radius:100px;
  background: rgba(51,209,122,.16); color:#33D17A; font-weight:700;
}
.panel-cta{ display:flex; flex-direction:column; gap:10px; }
.panel-cta .btn{ width:100%; }

/* ---------- Franja de estadísticas ---------- */
.stats{ background:var(--carbon); color:#fff; }
.stats-grid{
  display:grid; grid-template-columns: repeat(4,1fr); gap:0;
}
.stats-item{
  padding: 30px 26px; border-right:1px solid rgba(255,255,255,.08);
}
.stats-item:last-child{ border-right:none; }
.stats-item b{
  display:block; font-family:var(--display); font-size:38px; color:var(--ambar); font-weight:600; line-height:1;
  margin-bottom:8px;
}
.stats-item span{ font-size:13px; color:#AEB5C9; line-height:1.4; display:block; }

/* ---------- Secciones genéricas ---------- */
.seccion{ padding: 92px 0; }
.seccion-niebla{ background: var(--niebla); }
.seccion-head{ max-width:640px; margin-bottom:48px; }
.seccion-head h2{
  font-size: clamp(30px, 3.6vw, 44px); font-weight:700; color:var(--azul); margin:14px 0 14px; line-height:1.08;
}
.seccion-head p{ font-size:16.5px; color:var(--texto-suave); line-height:1.6; }

/* ---------- Reels / galería ---------- */
.reels-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:32px; flex-wrap:wrap;
}
.reels-scroll{
  overflow:hidden; padding-bottom:14px; position:relative;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
}
.reels-track{
  display:flex; gap:16px; width:max-content;
  animation: deslizarReels 34s linear infinite;
}
.reels-scroll:hover .reels-track, .reels-scroll.pausado .reels-track{ animation-play-state: paused; }
@keyframes deslizarReels{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}
.reels-scroll::-webkit-scrollbar{ display:none; }
.reel-card{
  position:relative; flex: 0 0 240px; aspect-ratio: 9/16; border-radius:var(--radio-lg);
  overflow:hidden; box-shadow: var(--sombra-sm);
  background:var(--azul);
}
.reel-card img{
  width:100%; height:100%; object-fit:cover;
  animation: kenBurns 9s ease-in-out infinite alternate;
  transition: transform .4s ease;
}
.reel-card:nth-child(2) img{ animation-delay: -2s; }
.reel-card:nth-child(3) img{ animation-delay: -4.5s; }
.reel-card:nth-child(4) img{ animation-delay: -1.2s; }
.reel-card:nth-child(5) img{ animation-delay: -6s; }
.reel-card:nth-child(6) img{ animation-delay: -3.3s; }
.reel-card:hover img{ animation-play-state: paused; transform: scale(1.1); }
@keyframes kenBurns{
  0%{ transform: scale(1) translate(0,0); }
  100%{ transform: scale(1.14) translate(-1.5%, -1.5%); }
}
.reel-card::after{
  content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(18,34,79,0) 45%, rgba(10,14,30,.88) 100%);
}
.reel-tag{
  position:absolute; left:12px; top:12px; z-index:2; display:flex; align-items:center; gap:6px;
  background:rgba(0,0,0,.4); backdrop-filter:blur(4px); padding:5px 10px; border-radius:100px;
  font-family:var(--mono); font-size:10.5px; color:#fff; font-weight:600;
}
.reel-play{
  position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center;
  color:#fff; opacity:0; transition:opacity .2s ease;
}
.reel-card:hover .reel-play{ opacity:1; }
.reel-play svg{ width:46px; height:46px; filter: drop-shadow(0 4px 10px rgba(0,0,0,.4)); }
.reel-caption{
  position:absolute; left:14px; right:14px; bottom:14px; z-index:2; color:#fff;
  font-size:13.5px; font-weight:600; line-height:1.3;
}

/* ---------- Servicios ---------- */
.servicios-grid{
  display:grid; grid-template-columns: repeat(3, 1fr); gap:20px;
}
.servicio-card{
  background:#fff; border:1px solid var(--linea); border-radius:var(--radio-lg);
  padding:28px 24px; transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.servicio-card:hover{ box-shadow: var(--sombra-sm); transform: translateY(-3px); border-color:transparent; }
.servicio-icono{
  width:50px; height:50px; border-radius:12px; background: var(--azul);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;
}
.servicio-icono svg{ width:24px; height:24px; stroke:var(--ambar); }
.servicio-card h3{ font-size:19px; color:var(--azul); margin-bottom:10px; font-weight:600; }
.servicio-card p{ font-size:14.5px; color:var(--texto-suave); line-height:1.55; }

/* ---------- Cobertura / mapa ---------- */
.cobertura-grid{
  display:grid; grid-template-columns: .95fr 1.3fr; gap:36px; align-items:start;
}
.estaciones-lista{ display:flex; flex-direction:column; gap:10px; }
.estacion-item{
  display:flex; align-items:flex-start; gap:14px; padding:16px 16px; border-radius:12px;
  background:#fff; border:1px solid var(--linea); cursor:pointer; transition: border-color .15s ease, background .15s ease;
}
.estacion-item:hover, .estacion-item.activa{ border-color: var(--rojo); background:#FFF6F6; }
.estacion-punto{
  width:30px; height:30px; border-radius:50%; background:var(--rojo); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:12px; font-weight:700;
  margin-top:2px;
}
.estacion-item.zona .estacion-punto{ background:var(--azul-3); }
.estacion-texto strong{ display:block; font-size:15px; color:var(--azul); margin-bottom:2px; }
.estacion-texto span{ font-size:13px; color:var(--texto-suave); line-height:1.4; display:block; }
.estacion-badge{
  display:inline-block; margin-top:6px; font-family:var(--mono); font-size:10.5px; padding:2px 8px;
  border-radius:100px; background:var(--niebla-2); color:var(--texto-suave);
}
.mapa-wrap{
  border-radius:var(--radio-lg); overflow:hidden; border:1px solid var(--linea); box-shadow:var(--sombra-sm);
  background:#fff; min-height:460px;
}
.mapa-wrap iframe{ width:100%; height:460px; border:0; display:block; }
.mapa-nota{
  display:flex; gap:10px; align-items:flex-start; margin-top:14px; padding:14px 16px;
  background:#FFF9EC; border:1px solid #F1DFAE; border-radius:10px; font-size:13px; color:#7A5E12; line-height:1.5;
}
.mapa-nota svg{ width:18px; height:18px; flex-shrink:0; margin-top:1px; stroke:#B8931B; }

/* ---------- Afiliaciones ---------- */
.planes-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:20px; }
.plan-card{
  background:var(--azul); color:#fff; border-radius:var(--radio-lg); padding:30px 26px;
  display:flex; flex-direction:column; gap:16px; position:relative; overflow:hidden;
}
.plan-card.destacado{ background: linear-gradient(160deg, var(--rojo) 0%, var(--rojo-dark) 100%); }
.plan-card .plan-tag{
  align-self:flex-start; font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
  background:rgba(255,255,255,.14); padding:4px 10px; border-radius:100px; font-weight:700;
}
.plan-card h3{ font-size:23px; font-weight:600; }
.plan-card ul{ display:flex; flex-direction:column; gap:9px; margin: 4px 0 6px; }
.plan-card li{ display:flex; align-items:flex-start; gap:9px; font-size:14px; color:rgba(255,255,255,.9); line-height:1.4; }
.plan-card li svg{ width:16px; height:16px; flex-shrink:0; margin-top:2px; stroke:var(--ambar); }
.plan-card .btn{ margin-top:auto; }

/* ---------- Alianzas ---------- */
.alianzas-strip{
  display:flex; align-items:center; gap:0; flex-wrap:wrap; justify-content:space-between;
  padding: 30px 0;
}
.alianzas-strip span{ font-family:var(--mono); font-size:12.5px; color:var(--texto-suave); letter-spacing:.04em; }

.confianza-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:40px; align-items:center; }
.confianza-foto{ border-radius:var(--radio-lg); overflow:hidden; box-shadow:var(--sombra-sm); }
.confianza-lista{ display:flex; flex-direction:column; gap:22px; }
.confianza-fila{ display:flex; gap:16px; align-items:flex-start; }
.confianza-num{
  font-family:var(--display); font-size:26px; color:var(--rojo); font-weight:700; width:46px; flex-shrink:0;
}
.confianza-fila h4{ font-size:16.5px; color:var(--azul); margin-bottom:5px; font-weight:600; }
.confianza-fila p{ font-size:14.5px; color:var(--texto-suave); line-height:1.55; }

/* ---------- CTA final ---------- */
.cta-final{
  background: var(--carbon); color:#fff; position:relative; overflow:hidden;
}
.cta-final::before{
  content:''; position:absolute; inset:0;
  background: radial-gradient(600px 300px at 15% 20%, rgba(196,30,42,.25), transparent 60%),
              radial-gradient(600px 300px at 85% 80%, rgba(232,185,35,.12), transparent 60%);
}
.cta-final-inner{ position:relative; z-index:1; text-align:center; padding: 30px 0; }
.cta-final h2{ font-size:clamp(28px,4vw,42px); margin-bottom:16px; }
.cta-final p{ color:#AEB5C9; max-width:56ch; margin:0 auto 30px; font-size:16px; line-height:1.6; }
.cta-final-btns{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ---------- Footer ---------- */
.footer{ background: var(--azul); color:#D7DCEA; padding: 60px 0 26px; }
.footer-grid{ display:grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap:40px; margin-bottom:42px; }
.footer-marca{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.footer-marca img{ height:40px; }
.footer-marca strong{ font-family:var(--display); font-size:16px; color:#fff; }
.footer p{ font-size:13.5px; line-height:1.6; color:#AEB5C9; max-width:32ch; }
.footer h5{
  font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.1em;
  color:#8A93AE; margin-bottom:16px; font-weight:700;
}
.footer-lista{ display:flex; flex-direction:column; gap:11px; }
.footer-lista a, .footer-lista span{ font-size:14px; color:#D7DCEA; }
.footer-lista a:hover{ color:var(--ambar); }
.footer-social{ display:flex; gap:10px; margin-top:6px; }
.footer-social a{
  width:38px; height:38px; border-radius:9px; background:rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center; transition:background .15s ease;
}
.footer-social a:hover{ background: var(--rojo); }
.footer-social svg{ width:18px; height:18px; stroke:#fff; }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  padding-top:26px; border-top:1px solid rgba(255,255,255,.12); font-size:12.5px; color:#8A93AE;
}

/* ---------- Botones flotantes ---------- */
.flotantes{
  position:fixed; right:20px; bottom:20px; z-index:70; display:flex; flex-direction:column; gap:12px; align-items:flex-end;
}
.flotante-btn{
  width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow: 0 12px 28px -8px rgba(0,0,0,.4); transition: transform .15s ease;
}
.flotante-btn:hover{ transform: scale(1.06); }
.flotante-btn svg{ width:27px; height:27px; }
.flotante-whatsapp{ background:#22C55E; }
.flotante-llamar{ background:var(--rojo); }

/* ---------- Banner instalar PWA ---------- */
.instalar-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:90;
  max-width:460px; margin:0 auto;
  background:#fff; border-radius:16px; box-shadow:0 20px 44px -12px rgba(0,0,0,.35);
  padding:16px 16px; display:flex; align-items:center; gap:14px;
  transform: translateY(140%); transition: transform .35s ease;
  border:1px solid var(--linea);
}
.instalar-banner.mostrar{ transform: translateY(0); }
.instalar-banner img{ width:44px; height:44px; border-radius:10px; flex-shrink:0; }
.instalar-banner-texto{ flex:1; }
.instalar-banner-texto strong{ display:block; font-size:14px; color:var(--azul); }
.instalar-banner-texto span{ font-size:12.5px; color:var(--texto-suave); }
.instalar-banner-cerrar{
  background:none; border:none; color:var(--texto-suave); font-size:20px; line-height:1; padding:4px;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .nav-principal, .header .btn-outline{ display:none; }
  .nav-toggle{ display:flex; }
  .hero-grid{ grid-template-columns: 1fr; }
  .stats-grid{ grid-template-columns: repeat(2,1fr); }
  .stats-item{ border-bottom:1px solid rgba(255,255,255,.08); }
  .servicios-grid{ grid-template-columns: repeat(2,1fr); }
  .cobertura-grid{ grid-template-columns: 1fr; }
  .planes-grid{ grid-template-columns: 1fr; max-width:420px; margin:0 auto; }
  .confianza-grid{ grid-template-columns: 1fr; }
  .footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px){
  .contenedor{ padding:0 18px; }
  .seccion{ padding:64px 0; }
  .servicios-grid{ grid-template-columns: 1fr; }
  .stats-grid{ grid-template-columns: 1fr 1fr; }
  .footer-grid{ grid-template-columns: 1fr; gap:30px; }
  .hero-ctas .btn, .cta-final-btns .btn{ width:100%; }
  .hero-ctas, .cta-final-btns{ flex-direction:column; }
  .marca-texto span{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  html{ scroll-behavior:auto; }
}