/* ============================================================
   GARANTÍAYA CÓRDOBA — hoja de estilos
   Reconstrucción del diseño aprobado. Landing de autogestión:
   CTA único "Solicitar Garantía" → formulario de Zoho (#solicitar).

   TIPOGRAFÍA — Raleway (la fuente del diseño en el .ai).
   Para cambiarla, reemplazar SOLO la variable --gy-font
   y el <link> de Google Fonts en index.html.
   ============================================================ */

:root{
  /* Color — azul y rojo muestreados del logo oficial.
     --gy-blue-head es el navy de titulares tomado de la maqueta. */
  --gy-blue:        #1E3579;
  --gy-blue-head:   #103A72;
  --gy-blue-bg:     #1D3D76;
  --gy-red:         #D30F13;
  --gy-red-hover:   #B50C10;
  --gy-white:       #FFFFFF;
  --gy-light-gray:  #F3F4F8;
  --gy-line:        #E3E7EF;
  --gy-text:        #565968;
  --gy-text-strong: #2B3142;

  --gy-font: 'Raleway', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;

  --radius:        14px;
  --radius-btn:    6px;
  --container:     1440px;
  --gutter:        clamp(20px, 7.6vw, 109px);  /* contenido 1222 px a 1440, medido en la maqueta */
  --section-y:     clamp(56px, 7vw, 104px);
}

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:104px;
}

body{
  margin:0;
  background:var(--gy-white);
  color:var(--gy-text);
  font-family:var(--gy-font);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,p,ul,ol,figure{ margin:0; }
ul,ol{ list-style:none; padding:0; }
button{ font:inherit; color:inherit; }

:focus-visible{
  outline:3px solid var(--gy-red);
  outline-offset:3px;
  border-radius:2px;
}

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--gy-white); color:var(--gy-blue);
  padding:12px 18px; font-weight:600;
}
.skip:focus{ left:12px; top:12px; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* ---------- tipografía compartida ---------- */
.h2{
  color:var(--gy-blue-head);
  font-weight:700;
  font-size:clamp(26px, 2.9vw, 38px);
  line-height:1.2;
  letter-spacing:-0.015em;
}
.h2--light{ color:var(--gy-white); }

.eyebrow{
  color:var(--gy-blue-head);
  font-weight:700;
  font-size:clamp(18px, 1.7vw, 24px);
  letter-spacing:-0.01em;
  margin-bottom:18px;
}
.eyebrow::after{
  content:"";
  display:block;
  width:100px; height:4px;
  background:var(--gy-red);
  margin-top:14px;
}
.eyebrow--light{ color:var(--gy-white); }

.rule{
  display:block;
  width:44px; height:3px;
  background:var(--gy-red);
  margin:22px 0;
}

/* ---------- botones ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 30px;
  min-height:48px;
  border:1px solid transparent;
  border-radius:var(--radius-btn);
  font-size:16px;
  font-weight:500;
  line-height:1.2;
  text-align:center;
  cursor:pointer;
  transition:background-color .18s ease, color .18s ease;
}
.btn--red{ background:var(--gy-red); color:var(--gy-white); }
.btn--red:hover{ background:var(--gy-red-hover); }
.btn--lg{ padding:16px 38px; min-height:54px; font-size:17px; }
.btn--sm{ padding:11px 22px; min-height:42px; font-size:14px; }

/* ============================================================
   HEADER
   ============================================================ */
.header{
  position:fixed;
  inset:0 0 auto;
  z-index:100;
  transition:background-color .3s ease, box-shadow .3s ease;
}
.header__in{
  display:flex;
  align-items:center;
  gap:clamp(24px, 3vw, 44px);
  height:120px;            /* en la maqueta el logo tiene mucha presencia */
  transition:height .25s ease;
}
.header__logo img{
  height:92px;             /* el archivo original trae margen propio */
  width:auto;
  transition:height .25s ease;
}
.header__logo-pos{ display:none; }

/* En la maqueta la navegación va pegada al logo, no alineada a la derecha. */
.header__nav{
  display:flex;
  gap:clamp(18px, 2.2vw, 34px);
}
.header__nav a{
  color:rgba(255,255,255,.92);
  font-size:15px;
  font-weight:400;
  padding:6px 0;
  border-bottom:2px solid transparent;
  transition:border-color .18s ease;
}
.header__nav a:hover{ border-bottom-color:var(--gy-red); }

.header__cta{ display:none; margin-left:auto; }

/* Al scrollear el header se compacta para no comerse la pantalla. */
.header.is-solid{
  background:var(--gy-white);
  box-shadow:0 1px 0 var(--gy-line);
}
.header.is-solid .header__in{ height:84px; }
.header.is-solid .header__logo img{ height:62px; }
.header.is-solid .header__logo-rev{ display:none; }
.header.is-solid .header__logo-pos{ display:block; }
.header.is-solid .header__nav a{ color:var(--gy-text-strong); }
.header.is-solid .header__cta{ display:inline-flex; }
.header__in > .burger{ margin-left:auto; }

.burger{
  display:none;
  margin-left:auto;
  background:none;
  border:0;
  padding:10px;
  cursor:pointer;
}
.burger span{
  display:block;
  width:26px; height:2px;
  background:var(--gy-white);
  border-radius:2px;
  margin:6px 0;
}
.header.is-solid .burger span{ background:var(--gy-text-strong); }

/* ---------- menú móvil ---------- */
.menu-movil{
  position:fixed;
  inset:0;
  z-index:110;
  display:flex;
  flex-direction:column;
  background:var(--gy-blue);
  padding:110px var(--gutter) 40px;
}
.menu-movil[hidden]{ display:none; }
.menu-movil nav{ display:flex; flex-direction:column; }
.menu-movil nav a{
  color:var(--gy-white);
  font-size:22px;
  font-weight:500;
  padding:18px 0;
  border-bottom:1px solid rgba(255,255,255,.18);
}
.menu-movil .btn{ margin-top:28px; }
.menu-movil__cliente{
  color:rgba(255,255,255,.8);
  font-size:16px;
  margin-top:20px;
  text-align:center;
}
.menu-movil__close{
  position:absolute;
  top:26px; right:var(--gutter);
  background:none; border:0;
  color:var(--gy-white);
  font-size:34px; line-height:1;
  padding:6px 10px;
  cursor:pointer;
}

/* ============================================================
   01 · HERO
   ============================================================ */
.hero{
  position:relative;
  min-height:min(86vh, 700px);
  display:flex;
  align-items:center;
  padding-top:120px;
  background:#0E1220;
  overflow:hidden;
}
.hero__img{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:50% 50%;
}
.hero__veil{
  position:absolute;
  inset:0;
  /* Veladura: ~67% izquierda, ~42% centro, ~8% derecha. */
  background:
    linear-gradient(90deg,
      rgba(10,14,26,.67) 0%,
      rgba(10,14,26,.56) 26%,
      rgba(10,14,26,.42) 50%,
      rgba(10,14,26,.20) 76%,
      rgba(10,14,26,.08) 100%),
    linear-gradient(to bottom, rgba(10,14,26,.34) 0%, rgba(10,14,26,0) 22%);
}
.hero__in{ position:relative; }
.hero__copy{ max-width:600px; color:var(--gy-white); }

.hero__title{
  font-size:clamp(32px, 3.9vw, 52px);
  font-weight:400;
  line-height:1.16;
  letter-spacing:-0.02em;
}
.hero__title strong{ font-weight:700; }

.hero__sub{
  margin-top:20px;
  font-size:clamp(15.5px, 1.2vw, 17px);
  line-height:1.5;
  color:rgba(255,255,255,.9);
}
.hero__sub strong{ font-weight:600; }

.hero__actions{
  display:flex;
  align-items:center;
  gap:26px;
  flex-wrap:wrap;
  margin-top:34px;
  padding-top:26px;
  border-top:1px solid rgba(255,255,255,.35);
  max-width:430px;
}
.hero__cliente{
  color:var(--gy-white);
  font-size:16px;
  font-weight:500;
  padding-bottom:2px;
  border-bottom:1px solid transparent;
}
.hero__cliente:hover{ border-bottom-color:rgba(255,255,255,.7); }

.hero__micro{
  margin-top:18px;
  font-size:14px;
  color:rgba(255,255,255,.78);
}

/* ============================================================
   02 · BENEFICIOS
   ============================================================ */
.beneficios{
  background:var(--gy-light-gray);
  padding-block:var(--section-y);
}
.beneficios__head{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:clamp(28px, 5vw, 80px);
  align-items:start;
  margin-bottom:clamp(34px, 4vw, 58px);
}
.beneficios__head .h2{ max-width:26ch; }
.beneficios__intro{
  font-size:16px;
  line-height:1.6;
  color:var(--gy-text);
  max-width:40ch;
}
.beneficios__intro strong{ color:var(--gy-text-strong); font-weight:600; }

.beneficio{
  display:grid;
  grid-template-columns:110px minmax(0,1.05fr) minmax(0,2.3fr);
  gap:clamp(14px, 2.4vw, 34px);
  align-items:start;
  padding-block:clamp(20px, 2.4vw, 30px);
  border-top:1px solid var(--gy-line);
}
.lista-beneficios .beneficio:last-child{ border-bottom:1px solid var(--gy-line); }

.beneficio__num{
  color:var(--gy-red);
  font-size:clamp(28px, 2.6vw, 36px);
  font-weight:400;
  line-height:1;
  letter-spacing:-0.02em;
}
.beneficio__titulo{
  color:var(--gy-blue-head);
  font-size:15.5px;
  font-weight:600;
  line-height:1.3;
  padding-top:6px;
}
.beneficio__texto{
  font-size:14.5px;
  line-height:1.6;
  color:var(--gy-text);
  padding-top:5px;
  max-width:62ch;
}
.beneficio__texto strong{
  display:block;
  color:var(--gy-text-strong);
  font-weight:600;
}

/* ============================================================
   03 · ¿CÓMO FUNCIONA?
   ============================================================ */
.como{
  position:relative;
  background:var(--gy-blue-bg);
  padding-block:var(--section-y);
  overflow:hidden;
}
.como__bg{
  position:absolute;
  inset:0;
  background:url("assets/cordoba-sierras.webp") center 34% / cover no-repeat;
  opacity:.13;
}
.como__in{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,.37fr) minmax(0,.63fr);
  gap:clamp(24px, 2.6vw, 40px);
  align-items:start;
}
.como__left .h2{ max-width:412px; line-height:1.3; margin-bottom:34px; }  /* corte de línea de la maqueta */
.como__left .btn{ padding:20px 40px; min-height:68px; font-size:17px; }

.pasos{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:clamp(14px, 1.6vw, 24px);
  padding-top:4px;
  text-align:center;
}
.paso{ position:relative; }
/* flecha entre pasos: línea más punta, como en la maqueta */
.paso:not(:last-child)::after{
  content:"";
  position:absolute;
  top:26px;
  left:calc(50% + 40px);
  right:calc(-50% + 36px);
  height:1.5px;
  background:rgba(255,255,255,.9);
}
.paso__num{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  width:54px; height:54px;
  margin:0 auto 34px;
  border:0;
  border-radius:50%;
  background:var(--gy-white);
  color:var(--gy-blue-head);
  font-size:24px;
  font-weight:700;
}
.paso:not(:first-child) .paso__num::before{
  content:"";
  position:absolute;
  left:-14px; top:50%;
  width:9px; height:9px;
  margin-top:-5px;
  border-top:1.5px solid rgba(255,255,255,.9);
  border-right:1.5px solid rgba(255,255,255,.9);
  transform:rotate(45deg);
}
.paso__titulo{
  color:var(--gy-white);
  font-size:15px;
  font-weight:700;
  line-height:1.3;
  margin-bottom:18px;
}
.paso__texto{
  color:rgba(255,255,255,.92);
  font-size:14px;
  line-height:1.5;
}

/* ============================================================
   04 · INSTITUCIONAL
   ============================================================ */
.institucional{ padding-block:var(--section-y); }
.institucional__in{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px, 4.5vw, 70px);
  align-items:center;
}
.institucional__fig{
  border-radius:var(--radius);
  overflow:hidden;
}
.institucional__fig img{
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
}
.institucional__copy .h2{ max-width:470px; }  /* corte de línea de la maqueta */
.institucional__copy p{
  font-size:15px;
  line-height:1.65;
  color:var(--gy-text);
  max-width:48ch;
}
.institucional__copy p strong{ color:var(--gy-text-strong); font-weight:600; }

/* ============================================================
   05 · COBERTURA
   ============================================================ */
.cobertura{
  position:relative;
  padding-block:var(--section-y);
  overflow:hidden;
  background:var(--gy-white);
}
.cobertura__bg{
  position:absolute;
  inset:0 0 0 auto;
  width:58%;
  background:url("assets/cobertura-cordoba.webp") right center / cover no-repeat;
  opacity:.72;
}
.cobertura__bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, #fff 0%, rgba(255,255,255,.96) 32%, rgba(255,255,255,.82) 68%, rgba(255,255,255,.64) 100%);
}
.cobertura__in{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:clamp(26px, 4vw, 64px);
  align-items:center;
}
.cobertura__mapa img{
  width:100%;
  max-width:500px;
  margin-inline:auto;
}
.cobertura__titulo{
  font-weight:400;
  font-size:clamp(28px, 3.2vw, 42px);
  line-height:1.16;
  margin-bottom:22px;
}
.cobertura__titulo strong{ font-weight:700; }
.cobertura__texto{
  font-size:15px;
  line-height:1.65;
  color:var(--gy-text);
  max-width:44ch;
}
.cobertura__texto strong{ color:var(--gy-text-strong); font-weight:600; }

.cobertura__card{
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  margin-top:30px;
  padding:24px 28px;
  background:var(--gy-white);
  border:1px solid var(--gy-line);
  border-radius:10px;
  box-shadow:0 10px 28px -20px rgba(16,32,80,.3);
}
.cobertura__card p{
  color:var(--gy-blue-head);
  font-size:14.5px;
  font-weight:600;
  max-width:34ch;
}

/* ============================================================
   06 · QUÉ CUBRE LA GARANTÍA
   ============================================================ */
.cubre{ padding-block:var(--section-y); background:var(--gy-white); }
.cubre__in{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(26px, 4.5vw, 70px);
  align-items:start;
}
.cubre__head .h2{ max-width:12ch; }
.cubre__nota{
  margin-top:20px;
  font-size:13px;
  line-height:1.55;
  color:#8D94A4;
  max-width:36ch;
}
.cubre__lista{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.cubre__lista li{
  display:grid;
  grid-template-columns:22px 1fr;
  gap:14px;
  align-items:start;
  padding:28px 30px 30px;
  border:1px solid #EDF0F6;
  border-radius:var(--radius);
}
.check{
  width:18px; height:18px;
  margin-top:4px;
  fill:none;
  stroke:var(--gy-red);
  stroke-width:2.2;
}
.cubre__lista b{
  display:block;
  color:var(--gy-blue-head);
  font-size:15.5px;
  font-weight:600;
  line-height:1.3;
}
.cubre__lista span{
  display:block;
  margin-top:6px;
  font-size:14px;
  line-height:1.55;
  color:var(--gy-text);
}

/* ============================================================
   07 · CTA FINAL
   ============================================================ */
.cierre{
  position:relative;
  padding-block:clamp(64px, 8vw, 118px);
  background:#0E1220;
  overflow:hidden;
}
.cierre__img{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:50% 58%;
}
.cierre__veil{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(10,14,26,.92) 0%, rgba(10,14,26,.78) 40%, rgba(10,14,26,.44) 100%);
}
.cierre__in{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,440px);
  gap:clamp(32px, 5vw, 72px);
  align-items:center;
}
.cierre__copy{ max-width:560px; }
.cierre__form{
  background:var(--gy-white);
  border-radius:12px;
  box-shadow:0 18px 50px rgba(0,0,0,.28);
  padding:clamp(22px, 3vw, 32px);
}

/* ---- Formulario de leads (Zoho Forms, HTML nativo) ---- */
.lead__fields{ display:grid; gap:16px; }
.lead__row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.lead__field{ display:grid; gap:6px; min-width:0; }
.lead__field label{
  color:var(--gy-blue-head);
  font-size:14px;
  font-weight:600;
}
.lead__opt{ color:var(--gy-text); font-weight:400; }
.lead input:not([type=hidden]),
.lead select{
  width:100%;
  min-height:48px;
  padding:12px 14px;
  border:1px solid #CDD3DF;
  border-radius:8px;
  background:var(--gy-white);
  color:var(--gy-text-strong);
  font:inherit;
  font-size:16px; /* 16px evita el zoom automático en iPhone */
}
.lead input:focus,
.lead select:focus{
  outline:none;
  border-color:var(--gy-blue);
  box-shadow:0 0 0 3px rgba(30,53,121,.15);
}
.lead__phone{ display:flex; }
.lead__prefix{
  display:flex; align-items:center;
  padding:0 12px;
  border:1px solid #CDD3DF; border-right:0;
  border-radius:8px 0 0 8px;
  background:var(--gy-light-gray);
  color:var(--gy-text-strong);
  font-weight:600;
}
.lead__phone input{ border-radius:0 8px 8px 0 !important; }
.lead__error{ display:none; color:var(--gy-red); font-size:13px; }
.lead__field.is-invalid input,
.lead__field.is-invalid select{ border-color:var(--gy-red); }
.lead__field.is-invalid .lead__error{ display:block; }
.lead__submit{ width:100%; margin-top:6px; }
.lead__submit[disabled]{ opacity:.7; cursor:wait; }
.lead__fail{ color:var(--gy-red); font-size:14px; text-align:center; }
.lead__ok{ text-align:center; padding:24px 0; color:var(--gy-text); }
.lead__ok-titulo{ color:var(--gy-blue-head); font-size:22px; font-weight:700; margin-bottom:8px; }
.lead__target{ display:none; }
.lead [hidden]{ display:none !important; }
.cierre__titulo{ margin-bottom:16px; }
.cierre__texto{
  color:rgba(255,255,255,.85);
  font-size:15.5px;
  line-height:1.6;
  max-width:40ch;
  margin-bottom:30px;
}

/* ============================================================
   08 · FAQ
   ============================================================ */
.faq{ padding-block:var(--section-y); background:var(--gy-white); }
.faq__titulo{ margin-bottom:clamp(28px, 3.4vw, 46px); }
.faq__cols{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 clamp(28px, 5vw, 76px);
}
.faq__item{ border-bottom:1px solid var(--gy-line); }
.faq__item summary{
  position:relative;
  list-style:none;
  cursor:pointer;
  padding:18px 44px 18px 0;
  color:var(--gy-blue-head);
  font-size:15.5px;
  font-weight:500;
  line-height:1.35;
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary::before,
.faq__item summary::after{
  content:"";
  position:absolute;
  right:6px; top:50%;
  background:var(--gy-blue-head);
  transition:transform .22s ease, opacity .22s ease;
}
.faq__item summary::after{ width:14px; height:1.6px; margin-top:-.8px; }
.faq__item summary::before{ width:1.6px; height:14px; margin-top:-7px; right:12.2px; }
.faq__item[open] summary::before{ transform:rotate(90deg); opacity:0; }
.faq__ans{
  padding:0 46px 22px 0;
  font-size:14.5px;
  line-height:1.65;
  color:var(--gy-text);
}

/* ============================================================
   09 · FOOTER
   ============================================================ */
.footer{
  background:var(--gy-white);
  border-top:1px solid var(--gy-line);
  padding-block:30px;
}
.footer__in{
  display:flex;
  align-items:center;
  gap:clamp(20px, 4vw, 54px);
  flex-wrap:wrap;
}
.footer__logo img{ height:44px; width:auto; }
.footer__nav{
  display:flex;
  flex-wrap:wrap;
  gap:clamp(16px, 2.6vw, 34px);
  padding-left:clamp(20px, 4vw, 54px);
  border-left:1px solid var(--gy-line);
}
.footer__nav a{
  color:var(--gy-blue-head);
  font-size:15px;
  font-weight:500;
}
.footer__nav a:hover{ color:var(--gy-red); }

/* ============================================================
   RESPONSIVE — tablet 768–1024
   ============================================================ */
@media (max-width:1024px){
  .cierre__in{ grid-template-columns:1fr; }
  .cierre__form{ max-width:520px; }
  .header__nav{ display:none; }
  .burger{ display:block; margin-left:auto; }
  /* Tablet: el CTA entra cómodo junto al logo. */
  .header__cta{ display:inline-flex; margin-left:auto; padding:11px 20px; min-height:44px; font-size:14px; }
  .header.is-solid .header__cta{ margin-left:auto; }
  .burger{ margin-left:14px; }

  .beneficios__head,
  .como__in,
  .institucional__in,
  .cobertura__in,
  .cubre__in{ grid-template-columns:1fr; }

  .como__left .h2{ max-width:none; }
  .pasos{ grid-template-columns:1fr 1fr; gap:40px 26px; }
  .paso:not(:last-child)::after{ display:none; }
  .paso:not(:first-child) .paso__num::before{ display:none; }

  .cobertura__bg{ width:100%; opacity:.5; }
  .cobertura__mapa img{ max-width:340px; }
  .cubre__lista{ grid-template-columns:1fr; }
  .faq__cols{ grid-template-columns:1fr; }
  .cubre__nota{ max-width:52ch; }
}

/* ============================================================
   RESPONSIVE — mobile 375–430
   ============================================================ */
@media (max-width:640px){
  .lead__row{ grid-template-columns:1fr; }
  body{ font-size:15.5px; }

  /* Mobile 375–430: solo logo + hamburguesa, sin apretar nada.
     El CTA "Comenzar mi garantía" está dentro del menú. */
  .header__in{ height:88px; gap:12px; }
  .header__logo img{ height:62px; }
  .header.is-solid .header__in{ height:76px; }
  .header.is-solid .header__logo img{ height:54px; }
  .header__cta,
  .header.is-solid .header__cta{ display:none; }

  .hero{ min-height:100svh; align-items:flex-end; padding-top:88px; padding-bottom:44px; }
  .hero__veil{
    background:linear-gradient(to bottom, rgba(10,14,26,.5) 0%, rgba(10,14,26,.3) 30%, rgba(10,14,26,.88) 100%);
  }
  .hero__title{ font-size:30px; }
  .hero__title br{ display:none; }
  .hero__sub br{ display:none; }
  .hero__actions{ max-width:none; gap:18px; }
  .hero__actions .btn{ width:100%; }
  .hero__cliente{ width:100%; text-align:center; }

  .beneficio{ grid-template-columns:62px 1fr; row-gap:8px; }
  .beneficio__texto{ grid-column:2 / 3; }
  .beneficio__titulo{ padding-top:2px; }

  .pasos{ grid-template-columns:1fr; gap:26px; }
  .paso{ display:grid; grid-template-columns:54px 1fr; gap:8px 18px; align-items:center; text-align:left; }
  .paso__num{ grid-row:1; margin:0; }
  .paso__titulo{ grid-column:2 / 3; margin-bottom:0; }
  .paso__texto{ grid-column:2 / 3; }

  .cobertura__card{ display:flex; width:100%; }
  .cobertura__card .btn{ width:100%; }
  .cierre__in .btn{ width:100%; }
  .faq__ans{ padding-right:0; }

  .footer__in{ flex-direction:column; align-items:flex-start; gap:22px; }
  .footer__nav{ border-left:0; padding-left:0; gap:12px 20px; }
}

/* ============================================================
   PREFERENCIAS DE MOVIMIENTO
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ transition:none !important; animation:none !important; }
}
