/* ==========================================================================
   GES Ingeniería · Servicios Eléctricos — hoja de estilos
   Paleta tomada del isotipo: azul profundo, azul GES y verde.
   ========================================================================== */

:root{
  --azul-950:#071a33;
  --azul-900:#0b2545;
  --azul-800:#10305a;
  --azul-700:#164079;
  --azul-600:#1e5aa8;
  --azul-500:#2e7bc4;
  --azul-100:#e3edfa;

  --verde-600:#3f9c33;
  --verde-500:#58b947;
  --verde-400:#8cc63f;
  --verde-100:#e8f6e3;

  --tinta:#0f172a;
  --gris-700:#334155;
  --gris-600:#52627a;
  --gris-400:#94a3b8;
  --gris-200:#e2e8f0;
  --gris-100:#eef2f7;
  --gris-50:#f7f9fc;
  --blanco:#ffffff;

  --wsp:#25d366;
  --wsp-oscuro:#128c7e;

  --sombra-sm:0 1px 2px rgba(11,37,69,.06), 0 1px 3px rgba(11,37,69,.08);
  --sombra:0 4px 6px -1px rgba(11,37,69,.08), 0 10px 24px -6px rgba(11,37,69,.12);
  --sombra-lg:0 18px 44px -12px rgba(11,37,69,.28);

  --radio:14px;
  --radio-sm:10px;
  --ancho:1180px;
  --alto-header:74px;

  --ff-titulo:"Saira","Segoe UI",system-ui,sans-serif;
  --ff-texto:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:calc(var(--alto-header) + 14px);-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:var(--ff-texto);color:var(--gris-700);background:var(--blanco);
  font-size:16.5px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit}

h1,h2,h3,h4{font-family:var(--ff-titulo);color:var(--azul-900);line-height:1.14;margin:0;letter-spacing:-.015em}
h1{font-size:clamp(2.05rem,5.2vw,3.5rem);font-weight:800}
h2{font-size:clamp(1.7rem,3.7vw,2.6rem);font-weight:700}
h3{font-size:1.16rem;font-weight:700;letter-spacing:-.005em}
p{margin:0}

.contenedor{width:min(100% - 2.5rem,var(--ancho));margin-inline:auto}
.seccion{padding:clamp(3.75rem,8vw,6.5rem) 0}
.seccion--gris{background:var(--gris-50);border-block:1px solid var(--gris-200)}

/* ---------- encabezado de sección ---------- */
.enc{max-width:62ch;margin-bottom:clamp(2rem,4vw,3.25rem)}
.enc--centro{margin-inline:auto;text-align:center}
.rotulo{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--ff-titulo);font-size:.775rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--azul-600);margin-bottom:.85rem;
}
.rotulo::before{content:"";width:26px;height:2px;background:linear-gradient(90deg,var(--verde-500),var(--azul-500));border-radius:2px}
.enc p{margin-top:1rem;font-size:1.06rem;color:var(--gris-600)}

/* ---------- botones ---------- */
.btn{
  --bg:var(--azul-600);--fg:#fff;--bd:transparent;
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.9rem 1.5rem;border-radius:var(--radio-sm);border:1.5px solid var(--bd);
  background:var(--bg);color:var(--fg);font-weight:650;font-size:.97rem;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
  box-shadow:var(--sombra-sm);
}
.btn:hover{transform:translateY(-2px);box-shadow:var(--sombra)}
.btn:active{transform:translateY(0)}
.btn svg{width:19px;height:19px;flex:none}
.btn--wsp{--bg:var(--wsp);--fg:#053d24}
.btn--wsp:hover{--bg:#1ec15c}
.btn--linea{--bg:transparent;--fg:var(--azul-700);--bd:var(--gris-200);box-shadow:none}
.btn--linea:hover{--bd:var(--azul-500);--fg:var(--azul-600);background:var(--azul-100)}
.btn--claro{--bg:#fff;--fg:var(--azul-800)}
.btn--fantasma{--bg:rgba(255,255,255,.08);--fg:#fff;--bd:rgba(255,255,255,.28);box-shadow:none}
.btn--fantasma:hover{--bg:rgba(255,255,255,.16)}
.btn--bloque{width:100%}
.btn--grande{padding:1.05rem 1.9rem;font-size:1.02rem}

:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--verde-500);outline-offset:2px;border-radius:6px;
}

/* ==========================================================================
   Cabecera
   ========================================================================== */
.barra-info{background:var(--azul-900);color:#cddcef;font-size:.82rem}
.barra-info .contenedor{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:38px}
.barra-info a{text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}
.barra-info a:hover{color:#fff}
.barra-info svg{width:15px;height:15px;opacity:.8}
.barra-info__izq{display:flex;gap:1.5rem;align-items:center}
.barra-info__ocultar{display:none}
@media(min-width:860px){.barra-info__ocultar{display:inline-flex}}

.cabecera{
  position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--gris-200);
  transition:box-shadow .2s ease;
}
.cabecera.esta-fija{box-shadow:0 6px 24px -12px rgba(11,37,69,.35)}
.cabecera .contenedor{display:flex;align-items:center;gap:1rem;min-height:var(--alto-header)}
.marca{display:flex;align-items:center;text-decoration:none;flex:none}
.marca img{height:42px;width:auto}
.nav{margin-left:auto;display:none;align-items:center;gap:.35rem}
.nav a{
  text-decoration:none;padding:.5rem .78rem;border-radius:8px;font-size:.93rem;font-weight:550;
  color:var(--gris-700);transition:background .15s,color .15s;
}
.nav a:hover{background:var(--gris-100);color:var(--azul-700)}
.cabecera__acciones{margin-left:auto;display:none;align-items:center;gap:.6rem}
.cabecera__acciones .btn{padding:.72rem 1.15rem;font-size:.9rem}
@media(min-width:1040px){
  .nav{display:flex}
  .cabecera__acciones{display:flex;margin-left:1rem}
}
.hamburguesa{
  margin-left:auto;display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;padding:0 10px;background:none;border:1px solid var(--gris-200);
  border-radius:10px;cursor:pointer;
}
.hamburguesa span{display:block;height:2px;background:var(--azul-800);border-radius:2px;transition:transform .22s,opacity .22s}
.hamburguesa[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburguesa[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamburguesa[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:1040px){.hamburguesa{display:none}}

.menu-movil{
  position:fixed;inset:0;top:0;z-index:70;background:var(--azul-950);
  padding:1.25rem 1.5rem 2rem;display:flex;flex-direction:column;gap:.25rem;
  transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);overflow-y:auto;
}
.menu-movil[hidden]{display:none}
.menu-movil.abierto{transform:translateX(0)}
.menu-movil__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.menu-movil__top img{height:38px}
.menu-movil__cerrar{background:none;border:1px solid rgba(255,255,255,.25);color:#fff;width:44px;height:44px;border-radius:10px;font-size:1.4rem;line-height:1;cursor:pointer}
.menu-movil a.enlace{
  color:#e8f0fb;text-decoration:none;font-family:var(--ff-titulo);font-size:1.28rem;font-weight:600;
  padding:.85rem .25rem;border-bottom:1px solid rgba(255,255,255,.1);
}
.menu-movil a.enlace:hover{color:var(--verde-400)}
.menu-movil .btn{margin-top:1.5rem}
.menu-movil .btn + .btn{margin-top:.7rem}
body.sin-scroll{overflow:hidden}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{position:relative;background:var(--azul-950);color:#dfe9f6;overflow:hidden;isolation:isolate}
.hero__foto{position:absolute;inset:0;z-index:-2}
.hero__foto img{width:100%;height:100%;object-fit:cover;object-position:72% 50%;opacity:.62}
.hero__velo{
  position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(105% 95% at 8% 45%, rgba(7,26,51,.97) 0%, rgba(7,26,51,.92) 38%, rgba(7,26,51,.62) 66%, rgba(7,26,51,.34) 100%),
    linear-gradient(180deg, rgba(7,26,51,.5), rgba(7,26,51,.88));
}
.hero__trama{position:absolute;inset:0;z-index:-1;opacity:.5;pointer-events:none}
.hero .contenedor{position:relative;padding:clamp(3.5rem,9vw,7rem) 0 clamp(3rem,7vw,5.5rem)}
.hero__caja{max-width:47rem}
.hero__chip{
  display:inline-flex;align-items:center;gap:.5rem;padding:.42rem .9rem;border-radius:999px;
  background:rgba(88,185,71,.14);border:1px solid rgba(88,185,71,.38);color:#a5e394;
  font-size:.8rem;font-weight:600;letter-spacing:.03em;margin-bottom:1.35rem;
}
.hero__chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--verde-500);box-shadow:0 0 0 0 rgba(88,185,71,.7);animation:latido 2.4s infinite}
@keyframes latido{0%{box-shadow:0 0 0 0 rgba(88,185,71,.6)}70%{box-shadow:0 0 0 9px rgba(88,185,71,0)}100%{box-shadow:0 0 0 0 rgba(88,185,71,0)}}
.hero h1{color:#fff}
.hero h1 em{font-style:normal;background:linear-gradient(96deg,var(--verde-400),var(--verde-500) 45%,var(--azul-500));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__bajada{margin-top:1.25rem;font-size:clamp(1.02rem,2.1vw,1.19rem);color:#c3d3e8;max-width:40rem}
.hero__botones{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.1rem}
.hero__sellos{margin-top:2.4rem;padding-top:1.7rem;border-top:1px solid rgba(255,255,255,.13)}
.hero__sellos ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem 1.9rem;grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:760px){.hero__sellos ul{grid-template-columns:repeat(4,auto);justify-content:start}}
.hero__sellos li{display:flex;align-items:center;gap:.55rem;font-size:.9rem;color:#b9cbe2}
.hero__sellos svg{width:18px;height:18px;color:var(--verde-400);flex:none}

/* ---------- franja de cifras ---------- */
.cifras{background:var(--azul-800);border-top:1px solid rgba(255,255,255,.09);position:relative;overflow:hidden}
.cifras__grilla{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(255,255,255,.11);
}
@media(min-width:820px){.cifras__grilla{grid-template-columns:repeat(4,1fr)}}
.cifra{background:var(--azul-800);padding:1.85rem 1.25rem;text-align:center}
.cifra b{
  display:block;font-family:var(--ff-titulo);font-size:clamp(1.85rem,4.4vw,2.6rem);font-weight:800;
  color:#fff;line-height:1;letter-spacing:-.02em;
}
.cifra b span{color:var(--verde-400)}
.cifra small{display:block;margin-top:.55rem;font-size:.855rem;color:#a8bfda;line-height:1.4}

/* ==========================================================================
   Servicios
   ========================================================================== */
.grilla-servicios{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(275px,1fr))}
.servicio{
  position:relative;background:#fff;border:1px solid var(--gris-200);border-radius:var(--radio);
  padding:1.65rem 1.5rem 1.4rem;display:flex;flex-direction:column;overflow:hidden;
  transition:border-color .2s,box-shadow .2s,transform .2s;
}
.servicio::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--verde-500),var(--azul-500));
  transform:scaleX(0);transform-origin:left;transition:transform .3s ease;
}
.servicio:hover{border-color:var(--azul-100);box-shadow:var(--sombra);transform:translateY(-3px)}
.servicio:hover::before{transform:scaleX(1)}
.servicio__icono{
  width:50px;height:50px;border-radius:12px;display:grid;place-items:center;margin-bottom:1.1rem;
  background:linear-gradient(140deg,#d7e6fa,#e3f3dc);color:var(--azul-700);
  transition:background .25s,color .25s;
}
.servicio:hover .servicio__icono{background:linear-gradient(140deg,var(--azul-600),var(--verde-600));color:#fff}
.servicio__icono svg{width:25px;height:25px}
.servicio p{margin-top:.6rem;font-size:.945rem;color:var(--gris-600);flex:1}
.servicio__cta{
  margin-top:1.15rem;align-self:flex-start;background:none;border:0;padding:.35rem 0;cursor:pointer;
  color:var(--azul-600);font-weight:650;font-size:.9rem;display:inline-flex;align-items:center;gap:.4rem;
}
.servicio__cta svg{width:16px;height:16px;transition:transform .2s}
.servicio__cta:hover{color:var(--verde-600)}
.servicio__cta:hover svg{transform:translateX(4px)}

/* ---------- sectores ---------- */
.grilla-sectores{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.sector{
  border:1px solid var(--gris-200);border-radius:var(--radio);padding:1.5rem 1.35rem;background:#fff;
  transition:border-color .2s,box-shadow .2s;
}
.sector:hover{border-color:var(--azul-500);box-shadow:var(--sombra-sm)}
.sector__icono{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:var(--azul-900);color:var(--verde-400);margin-bottom:.95rem}
.sector__icono svg{width:22px;height:22px}
.sector h3{font-size:1.05rem}
.sector p{font-size:.9rem;color:var(--gris-600);margin-top:.4rem}

/* ==========================================================================
   Proceso
   ========================================================================== */
.proceso{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));counter-reset:paso}
.paso{position:relative;padding-top:1.1rem}
.paso::before{
  counter-increment:paso;content:"0" counter(paso);
  font-family:var(--ff-titulo);font-size:3.2rem;font-weight:800;line-height:.8;
  color:transparent;-webkit-text-stroke:1.5px var(--gris-200);display:block;margin-bottom:.85rem;
}
.paso__linea{position:absolute;top:1.6rem;left:4.4rem;right:-1.5rem;height:2px;background:linear-gradient(90deg,var(--gris-200),transparent);display:none}
@media(min-width:900px){.paso__linea{display:block}.paso:last-child .paso__linea{display:none}}
.paso h3{font-size:1.08rem}
.paso p{font-size:.93rem;color:var(--gris-600);margin-top:.45rem}

/* ==========================================================================
   Galería de trabajos
   ========================================================================== */
.galeria{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.trabajo{
  position:relative;margin:0;border-radius:var(--radio);overflow:hidden;background:var(--azul-900);
  aspect-ratio:4/3;cursor:zoom-in;border:0;padding:0;width:100%;display:block;
}
.trabajo img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1);}
.trabajo:hover img{transform:scale(1.06)}
.trabajo figcaption{
  position:absolute;inset:auto 0 0 0;padding:1.6rem 1.15rem .95rem;text-align:left;
  background:linear-gradient(transparent,rgba(7,26,51,.55) 38%,rgba(7,26,51,.93));color:#fff;
}
.trabajo figcaption b{display:block;font-family:var(--ff-titulo);font-size:1rem;font-weight:650}
.trabajo figcaption span{font-size:.8rem;color:#b7cbe4}

.visor{
  position:fixed;inset:0;z-index:90;background:rgba(4,14,28,.965);display:none;
  align-items:center;justify-content:center;padding:1.5rem;
}
.visor.abierto{display:flex}
.visor img{max-width:min(1100px,94vw);max-height:82vh;border-radius:10px;object-fit:contain;box-shadow:var(--sombra-lg)}
.visor__pie{position:absolute;bottom:1.7rem;left:0;right:0;text-align:center;color:#cfe0f2;font-size:.92rem;padding:0 1rem}
.visor__btn{
  position:absolute;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;
  width:48px;height:48px;border-radius:50%;font-size:1.5rem;line-height:1;cursor:pointer;display:grid;place-items:center;
}
.visor__btn:hover{background:rgba(255,255,255,.22)}
.visor__cerrar{top:1.2rem;right:1.2rem}
.visor__ant{left:1rem;top:50%;transform:translateY(-50%)}
.visor__sig{right:1rem;top:50%;transform:translateY(-50%)}

/* ==========================================================================
   Respaldo / certificaciones
   ========================================================================== */
.respaldo{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.aval{
  display:flex;gap:1rem;padding:1.4rem;border-radius:var(--radio);background:#fff;
  border:1px solid var(--gris-200);border-left:3px solid var(--verde-500);
}
.aval__icono{width:40px;height:40px;flex:none;border-radius:10px;display:grid;place-items:center;background:var(--verde-100);color:var(--verde-600)}
.aval__icono svg{width:21px;height:21px}
.aval h3{font-size:1rem}
.aval p{font-size:.885rem;color:var(--gris-600);margin-top:.3rem}

/* ---------- franja CTA ---------- */
.franja{position:relative;color:#fff;overflow:hidden;isolation:isolate;background:var(--azul-950)}
.franja img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45;z-index:-2}
.franja::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(7,26,51,.94) 26%,rgba(11,37,69,.62))}
.franja .contenedor{padding:clamp(3rem,7vw,4.75rem) 0;display:grid;gap:1.75rem;align-items:center}
@media(min-width:900px){.franja .contenedor{grid-template-columns:1.35fr auto}}
.franja h2{color:#fff}
.franja p{color:#c3d3e8;margin-top:.85rem;max-width:52ch}
.franja__botones{display:flex;flex-wrap:wrap;gap:.8rem}

/* ==========================================================================
   Testimonios
   ========================================================================== */
.testimonios{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.testimonio{background:#fff;border:1px solid var(--gris-200);border-radius:var(--radio);padding:1.6rem 1.5rem;display:flex;flex-direction:column}
.testimonio__estrellas{color:#f4a825;letter-spacing:.12em;font-size:.95rem;margin-bottom:.85rem}
.testimonio blockquote{margin:0;font-size:.97rem;color:var(--gris-700);flex:1}
.testimonio footer{margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--gris-100);display:flex;align-items:center;gap:.75rem}
.testimonio__avatar{
  width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--azul-600),var(--verde-600));color:#fff;
  font-family:var(--ff-titulo);font-weight:700;font-size:.95rem;
}
.testimonio__nombre{font-weight:650;color:var(--azul-900);font-size:.93rem;line-height:1.3}
.testimonio__meta{font-size:.8rem;color:var(--gris-400)}

/* ==========================================================================
   Preguntas frecuentes
   ========================================================================== */
.faq{max-width:820px;margin-inline:auto}
.faq details{border:1px solid var(--gris-200);border-radius:var(--radio-sm);background:#fff;margin-bottom:.7rem;overflow:hidden}
.faq details[open]{border-color:var(--azul-500);box-shadow:var(--sombra-sm)}
.faq summary{
  cursor:pointer;padding:1.05rem 3rem 1.05rem 1.25rem;font-weight:650;color:var(--azul-900);
  position:relative;list-style:none;font-size:1rem;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:1.25rem;top:50%;width:11px;height:11px;
  border-right:2px solid var(--azul-600);border-bottom:2px solid var(--azul-600);
  transform:translateY(-70%) rotate(45deg);transition:transform .22s;
}
.faq details[open] summary::after{transform:translateY(-20%) rotate(-135deg)}
.faq summary:hover{background:var(--gris-50)}
.faq__cuerpo{padding:0 1.25rem 1.2rem;color:var(--gris-600);font-size:.955rem}

/* ==========================================================================
   Formulario de cotización
   ========================================================================== */
.cotiza{background:var(--azul-950);color:#dbe6f5;position:relative;overflow:hidden;isolation:isolate}
.cotiza__trama{position:absolute;inset:0;opacity:.4;z-index:-1;pointer-events:none}
.cotiza .contenedor{display:grid;gap:2.5rem;align-items:start}
@media(min-width:980px){.cotiza .contenedor{grid-template-columns:.85fr 1.15fr;gap:3.5rem}}
.cotiza h2{color:#fff}
.cotiza__intro p{color:#bacce3;margin-top:1rem}
.cotiza__lista{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:.9rem}
.cotiza__lista li{display:flex;gap:.75rem;align-items:flex-start;font-size:.95rem;color:#cadaee}
.cotiza__lista svg{width:20px;height:20px;color:var(--verde-400);flex:none;margin-top:2px}
.cotiza__directo{margin-top:2rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.14)}
.cotiza__directo span{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;color:#8fa9c8;margin-bottom:.7rem;font-family:var(--ff-titulo);font-weight:600}
.cotiza__directo a{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:#fff;font-weight:600;padding:.45rem 0}
.cotiza__directo a:hover{color:var(--verde-400)}
.cotiza__directo svg{width:19px;height:19px;color:var(--verde-400)}

.tarjeta-form{background:#fff;border-radius:var(--radio);box-shadow:var(--sombra-lg);overflow:hidden}
.tarjeta-form__top{background:linear-gradient(100deg,var(--azul-700),var(--azul-600));color:#fff;padding:1.15rem 1.6rem}
.tarjeta-form__top b{font-family:var(--ff-titulo);font-size:1.05rem;font-weight:650;display:block}
.tarjeta-form__top small{font-size:.83rem;color:#c6dcf5}
form{padding:1.6rem}
.campos{display:grid;gap:1rem}
@media(min-width:620px){.campos--2{grid-template-columns:1fr 1fr}}
.campo{display:flex;flex-direction:column;gap:.4rem}
.campo label{font-size:.855rem;font-weight:650;color:var(--azul-900)}
.campo label span{color:#c0392b}
.campo input,.campo select,.campo textarea{
  font:inherit;font-size:.95rem;padding:.75rem .85rem;border:1.5px solid var(--gris-200);
  border-radius:var(--radio-sm);background:var(--gris-50);color:var(--tinta);
  transition:border-color .16s,background .16s,box-shadow .16s;width:100%;
}
.campo textarea{resize:vertical;min-height:112px}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--azul-500);background:#fff;box-shadow:0 0 0 3px rgba(46,123,196,.14);
}
.campo input[aria-invalid="true"],.campo textarea[aria-invalid="true"],.campo select[aria-invalid="true"]{border-color:#e05252;background:#fef5f5}
.campo__error{font-size:.795rem;color:#c0392b;min-height:1em}
.form__acciones{display:grid;gap:.7rem;margin-top:1.4rem}
@media(min-width:620px){.form__acciones{grid-template-columns:1.3fr 1fr}}
.form__nota{margin-top:1rem;font-size:.79rem;color:var(--gris-400);text-align:center;line-height:1.5}
.form__aviso{
  margin-top:1rem;padding:.85rem 1rem;border-radius:var(--radio-sm);font-size:.9rem;
  background:var(--verde-100);color:#1e5c17;border:1px solid #bfe4b4;display:none;
}
.form__aviso.visible{display:block}

/* ==========================================================================
   Pie
   ========================================================================== */
.pie{background:var(--azul-950);color:#a9c0da;padding:clamp(3rem,6vw,4.25rem) 0 0;font-size:.925rem}
.pie__grilla{display:grid;gap:2.25rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));padding-bottom:2.75rem}
.pie h4{color:#fff;font-size:.87rem;text-transform:uppercase;letter-spacing:.13em;margin-bottom:1.05rem;font-weight:650}
.pie__marca{display:flex;align-items:center;gap:.85rem;margin-bottom:1.1rem}
.pie__marca img{height:52px;width:auto}
.pie__marca b{display:block;font-family:var(--ff-titulo);color:#fff;font-size:1.22rem;font-weight:750;letter-spacing:.01em;line-height:1.1}
.pie__marca small{color:var(--verde-400);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.pie ul{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.pie a{text-decoration:none}
.pie a:hover{color:#fff}
.pie__contacto li{display:flex;gap:.65rem;align-items:flex-start}
.pie__contacto svg{width:17px;height:17px;color:var(--verde-400);flex:none;margin-top:3px}
.pie__legal{
  border-top:1px solid rgba(255,255,255,.1);padding:1.35rem 0;display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;
  justify-content:space-between;font-size:.82rem;color:#7f97b4;
}
.pie__legal a{color:#7f97b4}

/* ---------- barra de acciones móvil ---------- */
.acciones-movil{
  position:fixed;left:0;right:0;bottom:0;z-index:65;display:grid;grid-template-columns:repeat(3,1fr);
  background:rgba(7,26,51,.97);backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.12);
  padding:.45rem .5rem calc(.45rem + env(safe-area-inset-bottom));
}
.acciones-movil a{
  display:flex;flex-direction:column;align-items:center;gap:.22rem;padding:.5rem .25rem;
  text-decoration:none;color:#cfe0f2;font-size:.735rem;font-weight:600;border-radius:9px;
}
.acciones-movil a svg{width:21px;height:21px}
.acciones-movil a:active{background:rgba(255,255,255,.09)}
.acciones-movil .es-wsp{color:var(--verde-400)}
@media(min-width:1040px){.acciones-movil{display:none}}
@media(max-width:1039px){body{padding-bottom:70px}}

/* ---------- botón flotante whatsapp (escritorio) ---------- */
.wsp-flota{
  position:fixed;right:22px;bottom:24px;z-index:64;width:58px;height:58px;border-radius:50%;
  background:var(--wsp);color:#053d24;display:none;place-items:center;text-decoration:none;
  box-shadow:0 10px 28px -6px rgba(37,211,102,.55);transition:transform .2s;
}
.wsp-flota:hover{transform:scale(1.08)}
.wsp-flota svg{width:30px;height:30px}
@media(min-width:1040px){.wsp-flota{display:grid}}

/* ---------- animación de entrada ---------- */
.revela{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.3,1)}
.revela.visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .revela{opacity:1;transform:none}
}