/* =============================================================================
   GLASS PRO — LANDING
   Depende de tokens.css. Todos los colores, tipografías, espacios, radios
   y sombras salen de ahí: acá no se escribe ni un hex suelto.

   Regla de proporción del manual: 70 % blanco y bruma · 20 % tinta · 10 % azul.
   ============================================================================= */

/* ---------------------------------------------------------------- BASE ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:var(--gp-azul)}
/* Cualquier clase con `display` le gana al [hidden] del navegador.
   Sin esto, los botones del formulario aparecen en pasos que no corresponden. */
[hidden]{display:none!important}
:where(h1,h2,h3,h4,p){margin:0}

.gp-saltar{
  position:absolute;left:var(--e4);top:-100px;z-index:200;
  background:var(--gp-azul);color:#fff;padding:var(--e3) var(--e5);
  border-radius:var(--r-boton);font-weight:600;text-decoration:none;
}
.gp-saltar:focus{top:var(--e4)}
.gp-oculto-visual{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}

.gp-wrap{
  width:100%;max-width:var(--ancho-contenido);
  margin-inline:auto;padding-inline:var(--e4);
}
@media (min-width:768px){.gp-wrap{padding-inline:var(--e6)}}

.gp-sec{padding-block:var(--sec-gap-movil)}
@media (min-width:768px){.gp-sec{padding-block:var(--sec-gap-desktop)}}
.gp-sec--bruma{background:var(--gp-bruma)}
.gp-sec--borde{border-top:1px solid var(--gp-borde)}

/* Cabecera de sección: eyebrow + título + la línea fina del logo */
.gp-cab{max-width:62ch;margin-bottom:var(--e7)}
.gp-cab--centro{margin-inline:auto;text-align:center}
.gp-cab__eyebrow{
  font-size:var(--t-eyebrow);font-weight:var(--fw-semibold);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  color:var(--gp-azul);margin-bottom:var(--e3);
}
.gp-cab__titulo{
  font-family:var(--gp-display);font-weight:var(--fw-extrabold);
  font-size:var(--t-display-l);line-height:var(--lh-display-l);
  letter-spacing:var(--ls-display-l);margin-bottom:var(--e4);
}
.gp-cab__linea{
  height:2px;width:56px;background:var(--gp-pasada);
  border-radius:var(--r-pill);margin-bottom:var(--e5);
}
.gp-cab--centro .gp-cab__linea{margin-inline:auto}
.gp-cab__texto{font-size:var(--t-cuerpo-l);line-height:var(--lh-cuerpo-l);color:var(--gp-piedra)}

/* -------------------------------------------------------------- BOTONES ---- */
.gp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--e2);
  font-family:var(--gp-texto);font-weight:var(--fw-semibold);font-size:var(--t-cuerpo-s);
  padding:var(--e3) var(--e5);border-radius:var(--r-boton);
  min-height:44px;   /* zona táctil mínima en celular */
  border:1.5px solid transparent;text-decoration:none;cursor:pointer;
  line-height:1.3;text-align:center;
  transition:background var(--dur-rapida) var(--ease),
             border-color var(--dur-rapida) var(--ease),
             transform var(--dur-rapida) var(--ease),
             box-shadow var(--dur-rapida) var(--ease);
}
.gp-btn svg{flex:none}
.gp-btn--primario{background:var(--gp-azul);color:#fff;box-shadow:var(--s-azul)}
.gp-btn--primario:hover{background:var(--gp-azul-600);transform:translateY(-1px)}
.gp-btn--secundario{background:transparent;color:var(--gp-azul);border-color:var(--gp-azul-200)}
.gp-btn--secundario:hover{background:var(--gp-azul-50);border-color:var(--gp-azul)}
.gp-btn--wa{background:var(--gp-whatsapp);color:var(--gp-negro)}   /* contraste 9,98:1 */
.gp-btn--wa:hover{transform:translateY(-1px);filter:brightness(1.04)}
.gp-btn--grande{padding:var(--e4) var(--e6);font-size:var(--t-cuerpo)}
.gp-btn--bloque{width:100%}
.gp-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none}

a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:3px solid var(--gp-azul);outline-offset:3px;border-radius:var(--r-chip);
}

/* ------------------------------------------------------- AVISO PENDIENTE ---- */
.gp-aviso-config{
  background:var(--gp-atencion);color:#fff;font-size:var(--t-caption);
  text-align:center;padding:var(--e2) var(--e4);font-weight:var(--fw-medium);
}

/* ------------------------------------------------------------- CABECERA ---- */
.gp-head{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.88);backdrop-filter:blur(12px);
  border-bottom:1px solid transparent;
  transition:border-color var(--dur-media) var(--ease),box-shadow var(--dur-media) var(--ease);
}
.gp-head[data-scroll="si"]{border-bottom-color:var(--gp-borde);box-shadow:var(--s1)}
.gp-head__barra{display:flex;align-items:center;gap:var(--e5);min-height:68px}
.gp-head__logo{display:flex;align-items:center;text-decoration:none;flex:none;min-height:44px}
.gp-head__logo img{height:34px;width:auto}
.gp-head__nav{display:none;margin-left:auto;gap:var(--e5)}
.gp-head__nav a{
  font-size:var(--t-cuerpo-s);font-weight:var(--fw-medium);
  color:var(--gp-tinta);text-decoration:none;padding-block:var(--e2);
  position:relative;
}
.gp-head__nav a::after{
  content:'';position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--gp-pasada);border-radius:var(--r-pill);
  transition:right var(--dur-media) var(--ease);
}
.gp-head__nav a:hover::after{right:0}
.gp-head__cta{margin-left:auto}
@media (min-width:1000px){
  .gp-head__nav{display:flex}
  .gp-head__cta{margin-left:0}
}

/* ------------------------------------------------------------------ HERO ---- */
.gp-hero{padding-block:var(--e8) var(--e7);position:relative;overflow:hidden}
@media (min-width:768px){.gp-hero{padding-block:var(--e9) var(--e8)}}
.gp-hero::before{   /* respiro de color, muy tenue, detrás del marco de vidrio */
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 55% at 85% 18%,var(--gp-azul-50),transparent 70%);
}
.gp-hero__grid{position:relative;display:grid;gap:var(--e7);align-items:center}
@media (min-width:900px){
  .gp-hero__grid{grid-template-columns:1.1fr .9fr;gap:var(--e8)}
}
.gp-hero__eyebrow{
  font-size:var(--t-eyebrow);font-weight:var(--fw-semibold);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  color:var(--gp-azul);margin-bottom:var(--e4);
}
.gp-hero__titulo{
  font-family:var(--gp-display);font-weight:var(--fw-extrabold);
  font-size:var(--t-display-xl);line-height:var(--lh-display-xl);
  letter-spacing:var(--ls-display-xl);margin-bottom:var(--e5);max-width:15ch;
}
.gp-hero__titulo em{font-style:normal;color:var(--gp-azul)}
.gp-hero__bajada{
  font-size:var(--t-cuerpo-l);line-height:var(--lh-cuerpo-l);
  color:var(--gp-piedra);max-width:52ch;margin-bottom:var(--e6);
}
.gp-hero__acciones{display:flex;flex-wrap:wrap;gap:var(--e3);margin-bottom:var(--e6)}
.gp-hero__senales{
  display:flex;flex-wrap:wrap;gap:var(--e3) var(--e5);
  font-size:var(--t-caption);color:var(--gp-piedra);
  padding-top:var(--e5);border-top:1px solid var(--gp-borde);
}
.gp-hero__senales span{display:inline-flex;align-items:center;gap:var(--e2)}
.gp-hero__senales svg{color:var(--gp-azul);flex:none}

/* ------------------------------------------- MARCO DE VIDRIO + LA PASADA ---- */
/* El video se muestra a 340-380 px: el material nace a 464 px de ancho, así que
   a este tamaño se ve nítido. Nunca a pantalla completa.                      */
.gp-vidrio{
  position:relative;width:100%;max-width:360px;margin-inline:auto;
  border-radius:var(--r-panel);overflow:hidden;
  background:var(--gp-bruma);border:1px solid var(--gp-borde);
  box-shadow:var(--s2);
}
.gp-vidrio::after{  /* reflejo diagonal del vidrio */
  content:'';position:absolute;inset:0;pointer-events:none;z-index:3;
  background:linear-gradient(118deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,0) 42%);
}
.gp-vidrio video,.gp-vidrio img{width:100%;height:auto;display:block}
.gp-vidrio__sucio{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  backdrop-filter:blur(4px) saturate(.4) contrast(.85);
  background:
    radial-gradient(60% 50% at 24% 30%,rgba(140,150,160,.34),transparent 70%),
    radial-gradient(46% 42% at 72% 66%,rgba(130,142,155,.30),transparent 72%),
    rgba(226,232,240,.34);
}
.gp-vidrio__filo{
  position:absolute;top:0;bottom:0;left:0;width:3px;z-index:4;
  background:var(--gp-pasada);box-shadow:0 0 24px 6px rgba(60,166,254,.6);
  opacity:0;pointer-events:none;
}
@keyframes gp-wipe{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 0 100%)}}
@keyframes gp-filo{0%{left:0;opacity:0}10%{opacity:1}86%{opacity:1}100%{left:100%;opacity:0}}
.gp-vidrio[data-pasada="si"] .gp-vidrio__sucio{animation:gp-wipe 2.6s cubic-bezier(.62,.02,.34,1) .45s forwards}
.gp-vidrio[data-pasada="si"] .gp-vidrio__filo{animation:gp-filo 2.6s cubic-bezier(.62,.02,.34,1) .45s forwards}
.gp-vidrio__pie{
  position:relative;z-index:5;display:flex;justify-content:space-between;
  gap:var(--e3);padding:var(--e3) var(--e4);background:#fff;
  border-top:1px solid var(--gp-borde);
  font-family:var(--gp-dato);font-size:.625rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gp-piedra);
}

/* -------------------------------------------------------------- CONFIANZA ---- */
.gp-confianza{border-block:1px solid var(--gp-borde);background:#fff}
.gp-confianza__grid{
  display:grid;gap:var(--e5);padding-block:var(--e6);
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
}
.gp-confianza__item{display:flex;gap:var(--e3);align-items:flex-start}
.gp-confianza__item svg{color:var(--gp-azul);flex:none;margin-top:2px}
.gp-confianza__item h3{
  font-family:var(--gp-texto);font-size:var(--t-cuerpo-s);
  font-weight:var(--fw-semibold);margin-bottom:2px;letter-spacing:0;
}
.gp-confianza__item p{font-size:var(--t-caption);color:var(--gp-piedra);max-width:none}

/* -------------------------------------------------------------- SERVICIOS ---- */
.gp-servicios{display:grid;gap:var(--e5);grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}
.gp-servicio{
  display:flex;flex-direction:column;background:#fff;
  border:1px solid var(--gp-borde);border-radius:var(--r-tarjeta);
  overflow:hidden;box-shadow:var(--s1);position:relative;
  transition:transform var(--dur-media) var(--ease),box-shadow var(--dur-media) var(--ease);
}
.gp-servicio::before{  /* la pasada recorre el borde superior al pasar el mouse */
  content:'';position:absolute;top:0;left:0;right:100%;height:3px;z-index:2;
  background:var(--gp-pasada);transition:right var(--dur-media) var(--ease);
}
.gp-servicio:hover{transform:translateY(-3px);box-shadow:var(--s2)}
.gp-servicio:hover::before{right:0}
.gp-servicio__media{position:relative;background:var(--gp-bruma);aspect-ratio:4/5;overflow:hidden}
.gp-servicio__media img,.gp-servicio__media video{width:100%;height:100%;object-fit:cover}
.gp-servicio__cuerpo{display:flex;flex-direction:column;flex:1;padding:var(--e5)}
.gp-servicio__titulo{
  font-family:var(--gp-display);font-weight:var(--fw-bold);font-size:1.125rem;
  letter-spacing:var(--ls-subtitulo);line-height:1.25;margin-bottom:var(--e2);
}
.gp-servicio__texto{font-size:var(--t-cuerpo-s);color:var(--gp-piedra);max-width:none;margin-bottom:var(--e4)}
.gp-servicio__lista{list-style:none;margin:0 0 var(--e5);padding:0;display:grid;gap:6px}
.gp-servicio__lista li{
  font-size:var(--t-caption);color:var(--gp-tinta);
  display:flex;gap:var(--e2);align-items:flex-start;
}
.gp-servicio__lista li::before{
  content:'';flex:none;width:14px;height:2px;margin-top:9px;
  background:var(--gp-pasada);border-radius:var(--r-pill);
}
.gp-servicio .gp-btn{margin-top:auto}

/* --------------------------------------------------------- ANTES/DESPUÉS ---- */
.gp-ad-grid{display:grid;gap:var(--e6);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));max-width:820px;margin-inline:auto}
.gp-ad{
  background:#fff;border:1px solid var(--gp-borde);
  border-radius:var(--r-tarjeta);overflow:hidden;box-shadow:var(--s1);
}
.gp-ad__visor{
  position:relative;width:100%;aspect-ratio:464/832;
  overflow:hidden;background:var(--gp-bruma);
  touch-action:pan-y;cursor:ew-resize;user-select:none;
}
.gp-ad__visor img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gp-ad__despues{clip-path:inset(0 0 0 var(--pos,50%))}
.gp-ad__etq{
  position:absolute;top:var(--e3);z-index:3;
  font-family:var(--gp-dato);font-size:.625rem;letter-spacing:.1em;
  text-transform:uppercase;padding:4px var(--e2);border-radius:var(--r-chip);
  background:rgba(17,20,24,.78);color:#fff;pointer-events:none;
}
.gp-ad__etq--a{left:var(--e3)}
.gp-ad__etq--d{right:var(--e3);background:var(--gp-azul)}
.gp-ad__filo{   /* la pasada es la manilla: el gesto de la marca, funcionando */
  position:absolute;top:0;bottom:0;left:var(--pos,50%);width:3px;z-index:4;
  background:var(--gp-pasada);box-shadow:0 0 18px 4px rgba(60,166,254,.5);
  transform:translateX(-1.5px);
}
.gp-ad__tirador{
  position:absolute;top:50%;left:var(--pos,50%);z-index:5;
  transform:translate(-50%,-50%);
  width:44px;height:44px;border-radius:var(--r-pill);
  background:#fff;border:2px solid var(--gp-azul);box-shadow:var(--s2);
  display:grid;place-items:center;color:var(--gp-azul);cursor:ew-resize;
  padding:0;
}
.gp-ad__pie{padding:var(--e3) var(--e4);border-top:1px solid var(--gp-borde)}
.gp-ad__pie h3{
  font-family:var(--gp-texto);font-size:var(--t-cuerpo-s);
  font-weight:var(--fw-semibold);letter-spacing:0;margin-bottom:2px;
}
.gp-ad__pie p{font-size:var(--t-caption);color:var(--gp-piedra);max-width:none}
.gp-ad-nota{
  text-align:center;font-size:var(--t-caption);color:var(--gp-piedra);
  margin-top:var(--e6);max-width:60ch;margin-inline:auto;
}

/* ----------------------------------------------------------------- PASOS ---- */
.gp-pasos{list-style:none;margin:0;padding:0;display:grid;gap:var(--e5);counter-reset:paso}
@media (min-width:768px){.gp-pasos{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.gp-paso{counter-increment:paso;position:relative;padding-top:var(--e5);border-top:2px solid var(--gp-borde)}
.gp-paso::before{
  content:counter(paso,decimal-leading-zero);
  position:absolute;top:calc(var(--e5) * -1 + 10px);left:0;
  font-family:var(--gp-dato);font-size:var(--t-caption);font-weight:var(--fw-medium);
  color:var(--gp-azul);padding-right:var(--e2);
  background:var(--gp-blanco);   /* tapa la línea para que no cruce el número */
}
.gp-paso[data-activo]{border-top-color:transparent;background-image:var(--gp-pasada);
  background-size:100% 2px;background-repeat:no-repeat;background-position:top}
.gp-paso h3{
  font-family:var(--gp-display);font-weight:var(--fw-bold);font-size:1.0625rem;
  letter-spacing:var(--ls-subtitulo);margin:var(--e4) 0 var(--e2);
}
.gp-paso p{font-size:var(--t-cuerpo-s);color:var(--gp-piedra);max-width:none}

/* ----------------------------------------------------------------- PILARES ---- */
.gp-pilares{display:grid;gap:var(--e5);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.gp-pilar{
  background:#fff;border:1px solid var(--gp-borde);border-radius:var(--r-tarjeta);
  padding:var(--e5);box-shadow:var(--s1);
}
.gp-pilar svg{color:var(--gp-azul);margin-bottom:var(--e3)}
.gp-pilar h3{
  font-family:var(--gp-display);font-weight:var(--fw-bold);font-size:1.0625rem;
  letter-spacing:var(--ls-subtitulo);margin-bottom:var(--e2);
}
.gp-pilar p{font-size:var(--t-cuerpo-s);color:var(--gp-piedra);max-width:none}

/* ---------------------------------------------------------------- GALERÍA ---- */
.gp-galeria{display:grid;gap:var(--e4);grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.gp-galeria figure{
  margin:0;border-radius:var(--r-tarjeta);overflow:hidden;
  border:1px solid var(--gp-borde);background:var(--gp-bruma);
  box-shadow:var(--s1);position:relative;
}
.gp-galeria__media{aspect-ratio:4/5;overflow:hidden}
.gp-galeria__media img,.gp-galeria__media video{width:100%;height:100%;object-fit:cover}
.gp-galeria figcaption{
  padding:var(--e3) var(--e4);background:#fff;
  font-size:var(--t-caption);color:var(--gp-piedra);
  border-top:1px solid var(--gp-borde);
}
.gp-galeria__tag{
  position:absolute;top:var(--e3);left:var(--e3);z-index:2;
  font-family:var(--gp-dato);font-size:.5625rem;letter-spacing:.1em;
  text-transform:uppercase;padding:3px var(--e2);border-radius:var(--r-chip);
  background:rgba(17,20,24,.75);color:#fff;
}

/* ----------------------------------------------------------------- PLANES ---- */
.gp-planes{display:grid;gap:var(--e4);grid-template-columns:repeat(auto-fit,minmax(214px,1fr))}
.gp-plan{
  display:flex;flex-direction:column;background:#fff;
  border:1px solid var(--gp-borde);border-radius:var(--r-tarjeta);
  padding:var(--e5);box-shadow:var(--s1);
  transition:border-color var(--dur-media) var(--ease),box-shadow var(--dur-media) var(--ease);
}
.gp-plan:hover{border-color:var(--gp-azul-200);box-shadow:var(--s2)}
.gp-plan__titulo{
  font-family:var(--gp-display);font-weight:var(--fw-extrabold);font-size:1.25rem;
  letter-spacing:var(--ls-titulo);margin-bottom:var(--e1);
}
.gp-plan__frec{font-family:var(--gp-dato);font-size:var(--t-caption);color:var(--gp-azul);margin-bottom:var(--e4)}
.gp-plan__para{font-size:var(--t-caption);color:var(--gp-piedra);max-width:none;margin-bottom:var(--e5);flex:1}
.gp-planes-nota{
  margin-top:var(--e6);padding:var(--e4) var(--e5);
  border-left:3px solid var(--gp-azul);background:var(--gp-azul-50);
  border-radius:0 var(--r-boton) var(--r-boton) 0;
  font-size:var(--t-cuerpo-s);max-width:none;
}

/* ------------------------------------------------------------- COBERTURA ---- */
.gp-comunas{display:flex;flex-wrap:wrap;gap:var(--e3);justify-content:center;margin-bottom:var(--e5)}
.gp-comuna{
  display:inline-flex;align-items:center;gap:var(--e2);
  background:#fff;border:1px solid var(--gp-borde);border-radius:var(--r-pill);
  padding:var(--e2) var(--e4);font-size:var(--t-cuerpo-s);font-weight:var(--fw-medium);
  box-shadow:var(--s1);
}
.gp-comuna::before{
  content:'';width:8px;height:8px;border-radius:var(--r-pill);
  background:var(--gp-azul);flex:none;
}

/* -------------------------------------------------------------------- FAQ ---- */
.gp-faq{max-width:760px;margin-inline:auto;display:grid;gap:var(--e3)}
.gp-faq details{
  background:#fff;border:1px solid var(--gp-borde);
  border-radius:var(--r-tarjeta);overflow:hidden;
}
.gp-faq details[open]{border-color:var(--gp-azul-200);box-shadow:var(--s1)}
.gp-faq summary{
  cursor:pointer;list-style:none;padding:var(--e4) var(--e5);
  font-weight:var(--fw-semibold);font-size:var(--t-cuerpo-s);
  display:flex;justify-content:space-between;gap:var(--e4);align-items:center;
}
.gp-faq summary::-webkit-details-marker{display:none}
.gp-faq summary::after{
  content:'';flex:none;width:10px;height:10px;
  border-right:2px solid var(--gp-azul);border-bottom:2px solid var(--gp-azul);
  transform:rotate(45deg) translateY(-2px);
  transition:transform var(--dur-media) var(--ease);
}
.gp-faq details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.gp-faq__r{padding:0 var(--e5) var(--e5)}
.gp-faq__r p{font-size:var(--t-cuerpo-s);color:var(--gp-piedra);max-width:none}
.gp-faq__r p + p{margin-top:var(--e3)}

/* ------------------------------------------------------------ FORMULARIO ---- */
.gp-cotizar{background:var(--gp-bruma)}
.gp-form-grid{display:grid;gap:var(--e6);align-items:start}
@media (min-width:1000px){.gp-form-grid{grid-template-columns:1fr 300px;gap:var(--e8)}}

.gp-form-card{
  background:#fff;border:1px solid var(--gp-borde);
  border-radius:var(--r-panel);box-shadow:var(--s2);overflow:hidden;
}

/* Progreso */
.gp-prog{display:flex;gap:var(--e2);padding:var(--e5) var(--e5) 0}
.gp-prog__seg{flex:1}
.gp-prog__barra{height:4px;border-radius:var(--r-pill);background:var(--gp-borde);overflow:hidden}
.gp-prog__seg[data-estado="activo"] .gp-prog__barra,
.gp-prog__seg[data-estado="hecho"] .gp-prog__barra{background:var(--gp-pasada)}
.gp-prog__txt{
  font-family:var(--gp-dato);font-size:.625rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gp-piedra);margin-top:var(--e2);
}
.gp-prog__seg[data-estado="activo"] .gp-prog__txt{color:var(--gp-azul)}

.gp-paso-form{padding:var(--e5)}
@media (min-width:600px){.gp-paso-form{padding:var(--e6)}}
.gp-paso-form[hidden]{display:none}
.gp-paso-form__titulo{
  font-family:var(--gp-display);font-weight:var(--fw-extrabold);font-size:1.375rem;
  letter-spacing:var(--ls-titulo);margin-bottom:var(--e2);
}
.gp-paso-form__sub{font-size:var(--t-cuerpo-s);color:var(--gp-piedra);margin-bottom:var(--e6);max-width:none}

.gp-campo{margin-bottom:var(--e6);border:0;padding:0;min-width:0}
.gp-campo:last-of-type{margin-bottom:0}
.gp-campo__label,.gp-campo > legend{
  display:block;font-size:var(--t-cuerpo-s);font-weight:var(--fw-semibold);
  margin-bottom:var(--e1);padding:0;color:var(--gp-tinta);
}
.gp-campo__ayuda{font-size:var(--t-caption);color:var(--gp-piedra);margin-bottom:var(--e3);max-width:none}
.gp-campo__opt{font-weight:var(--fw-regular);color:var(--gp-piedra);font-size:var(--t-caption)}

/* Chips: radio y checkbox con cara de botón */
.gp-chips{display:flex;flex-wrap:wrap;gap:var(--e2)}
.gp-chip{position:relative;display:inline-flex}
.gp-chip input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.gp-chip span{
  display:inline-flex;align-items:center;gap:var(--e2);
  min-height:44px;   /* el formulario es casi todo chips: deben ser tocables */
  padding:var(--e2) var(--e4);border-radius:var(--r-pill);
  border:1.5px solid var(--gp-borde);background:#fff;
  font-size:var(--t-cuerpo-s);line-height:1.4;color:var(--gp-tinta);
  transition:border-color var(--dur-rapida) var(--ease),
             background var(--dur-rapida) var(--ease),
             color var(--dur-rapida) var(--ease);
}
.gp-chip:hover span{border-color:var(--gp-azul-300)}
.gp-chip input:checked + span{
  border-color:var(--gp-azul);background:var(--gp-azul-50);
  color:var(--gp-azul-700);font-weight:var(--fw-medium);
}
.gp-chip input:focus-visible + span{outline:3px solid var(--gp-azul);outline-offset:3px}

/* Campos de texto */
.gp-input,.gp-select,.gp-textarea{
  width:100%;font-family:var(--gp-texto);font-size:var(--t-cuerpo);
  padding:var(--e3) var(--e4);border-radius:var(--r-boton);
  border:1.5px solid var(--gp-borde);background:#fff;color:var(--gp-tinta);
  transition:border-color var(--dur-rapida) var(--ease),box-shadow var(--dur-rapida) var(--ease);
}
.gp-input:hover,.gp-select:hover,.gp-textarea:hover{border-color:var(--gp-azul-300)}
.gp-input:focus,.gp-select:focus,.gp-textarea:focus{
  border-color:var(--gp-azul);box-shadow:0 0 0 3px var(--gp-azul-100);outline:none;
}
.gp-textarea{min-height:92px;resize:vertical;line-height:1.6}
.gp-select{appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--gp-azul) 50%),
                   linear-gradient(135deg,var(--gp-azul) 50%,transparent 50%);
  background-position:calc(100% - 19px) 50%,calc(100% - 13px) 50%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:var(--e8);
}
.gp-tel{display:flex;align-items:stretch}
.gp-tel__pref{
  display:inline-flex;align-items:center;padding:0 var(--e3);
  border:1.5px solid var(--gp-borde);border-right:0;
  border-radius:var(--r-boton) 0 0 var(--r-boton);
  background:var(--gp-bruma);color:var(--gp-piedra);
  font-family:var(--gp-dato);font-size:var(--t-cuerpo-s);white-space:nowrap;
}
.gp-tel .gp-input{border-radius:0 var(--r-boton) var(--r-boton) 0;font-variant-numeric:tabular-nums}
.gp-fechas{display:grid;gap:var(--e3);grid-template-columns:1fr 1fr}
@media (max-width:420px){.gp-fechas{grid-template-columns:1fr}}

/* Validación */
.gp-error{
  display:block;font-size:var(--t-caption);color:var(--gp-error);
  margin-top:var(--e2);font-weight:var(--fw-medium);
}
.gp-error:empty{display:none}
.gp-campo[data-error="si"] .gp-input,
.gp-campo[data-error="si"] .gp-select,
.gp-campo[data-error="si"] .gp-textarea{border-color:var(--gp-error)}
.gp-campo[data-error="si"] .gp-tel__pref{border-color:var(--gp-error)}

/* Consentimiento */
.gp-check{display:flex;gap:var(--e3);align-items:flex-start;cursor:pointer}
.gp-check input{
  flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--gp-azul);cursor:pointer;
}
.gp-check span{font-size:var(--t-cuerpo-s);color:var(--gp-tinta)}

/* Trampa de spam: invisible y fuera del orden de tabulación */
.gp-trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Navegación del formulario */
.gp-form-nav{
  display:flex;gap:var(--e3);align-items:center;flex-wrap:wrap;
  padding:var(--e5);border-top:1px solid var(--gp-borde);background:var(--gp-bruma);
}
.gp-form-nav .gp-btn--primario,.gp-form-nav .gp-btn--wa{margin-left:auto}
@media (max-width:520px){
  .gp-form-nav{flex-direction:column-reverse;align-items:stretch}
  .gp-form-nav .gp-btn{width:100%;margin-left:0}
}

/* Resumen */
.gp-resumen{
  background:var(--gp-azul-50);border:1px solid var(--gp-azul-100);
  border-radius:var(--r-tarjeta);padding:var(--e4) var(--e5);margin-bottom:var(--e5);
}
.gp-resumen h3{
  font-family:var(--gp-texto);font-size:var(--t-caption);font-weight:var(--fw-semibold);
  text-transform:uppercase;letter-spacing:.1em;color:var(--gp-azul);
  margin-bottom:var(--e3);
}
.gp-resumen dl{margin:0;display:grid;gap:6px;font-size:var(--t-caption)}
.gp-resumen div{display:flex;gap:var(--e2);flex-wrap:wrap}
.gp-resumen dt{color:var(--gp-piedra);min-width:112px}
.gp-resumen dd{margin:0;color:var(--gp-tinta);font-weight:var(--fw-medium);flex:1}

/* Aviso de la foto: lo que más acelera la cotización */
.gp-foto-aviso{
  display:flex;gap:var(--e3);align-items:flex-start;
  background:#fff;border:1.5px dashed var(--gp-azul-200);
  border-radius:var(--r-tarjeta);padding:var(--e4);margin-bottom:var(--e5);
}
.gp-foto-aviso svg{color:var(--gp-azul);flex:none;margin-top:1px}
.gp-foto-aviso p{font-size:var(--t-caption);color:var(--gp-tinta);max-width:none}
.gp-foto-aviso strong{font-weight:var(--fw-semibold)}

/* Estado tras abrir WhatsApp */
.gp-enviado{padding:var(--e7) var(--e5);text-align:center}
.gp-enviado[hidden]{display:none}
.gp-enviado__icono{
  width:64px;height:64px;border-radius:var(--r-pill);margin:0 auto var(--e5);
  display:grid;place-items:center;background:var(--gp-azul-50);color:var(--gp-azul);
}
.gp-enviado h3{
  font-family:var(--gp-display);font-weight:var(--fw-extrabold);font-size:1.375rem;
  letter-spacing:var(--ls-titulo);margin-bottom:var(--e3);
}
.gp-enviado p{color:var(--gp-piedra);max-width:46ch;margin:0 auto var(--e5);font-size:var(--t-cuerpo-s)}

/* Columna de confianza al lado del formulario */
.gp-form-aside{display:grid;gap:var(--e4)}
.gp-form-aside__card{
  background:#fff;border:1px solid var(--gp-borde);
  border-radius:var(--r-tarjeta);padding:var(--e5);box-shadow:var(--s1);
}
.gp-form-aside__card h3{
  font-family:var(--gp-display);font-weight:var(--fw-bold);font-size:1rem;
  letter-spacing:var(--ls-subtitulo);margin-bottom:var(--e3);
}
.gp-form-aside ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--e3)}
.gp-form-aside li{display:flex;gap:var(--e3);font-size:var(--t-caption);color:var(--gp-piedra)}
.gp-form-aside li svg{color:var(--gp-azul);flex:none;margin-top:2px}
.gp-form-aside li b{color:var(--gp-tinta);font-weight:var(--fw-semibold)}

/* --------------------------------------------------------------- CONTACTO ---- */
.gp-contacto{display:grid;gap:var(--e4);grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.gp-contacto a{
  display:flex;gap:var(--e4);align-items:center;
  background:#fff;border:1px solid var(--gp-borde);border-radius:var(--r-tarjeta);
  padding:var(--e5);text-decoration:none;color:inherit;box-shadow:var(--s1);
  transition:border-color var(--dur-media) var(--ease),transform var(--dur-media) var(--ease);
}
.gp-contacto a:hover{border-color:var(--gp-azul-200);transform:translateY(-2px)}
.gp-contacto svg{color:var(--gp-azul);flex:none}
.gp-contacto b{display:block;font-size:var(--t-cuerpo-s);font-weight:var(--fw-semibold)}
.gp-contacto span{font-size:var(--t-caption);color:var(--gp-piedra);word-break:break-word}

/* ------------------------------------------------------------------- PIE ---- */
.gp-pie{background:var(--gp-azul-900);color:#C7DBFF;padding-block:var(--e8) var(--e6)}
.gp-pie__grid{display:grid;gap:var(--e6);grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.gp-pie__marca img{height:38px;width:auto;background:#fff;border-radius:var(--r-chip);padding:var(--e3)}
.gp-pie__lema{
  font-family:var(--gp-display);font-weight:var(--fw-bold);color:#fff;
  margin-top:var(--e4);font-size:var(--t-cuerpo-s);letter-spacing:var(--ls-subtitulo);
}
.gp-pie h3{
  font-size:var(--t-caption);text-transform:uppercase;letter-spacing:.12em;
  color:#85AEFA;font-weight:var(--fw-semibold);margin-bottom:var(--e3);
  font-family:var(--gp-texto);
}
.gp-pie ul{list-style:none;margin:0;padding:0;display:grid}
.gp-pie li{display:flex;align-items:center;min-height:36px}
.gp-pie a{
  color:#C7DBFF;text-decoration:none;font-size:var(--t-cuerpo-s);
  display:inline-flex;align-items:center;min-height:36px;   /* tocable en celular */
}
.gp-pie a:hover{color:#fff;text-decoration:underline}
.gp-pie__legal{
  margin-top:var(--e7);padding-top:var(--e5);border-top:1px solid rgba(255,255,255,.14);
  display:flex;justify-content:space-between;gap:var(--e4);flex-wrap:wrap;
  font-size:var(--t-caption);color:#85AEFA;
}
.gp-pie__legal p{max-width:none}

/* ------------------------------------------------------------- FLOTANTES ---- */
.gp-wa-flota{
  position:fixed;right:var(--e4);bottom:var(--e4);z-index:90;
  width:56px;height:56px;border-radius:var(--r-pill);
  background:var(--gp-whatsapp);color:var(--gp-negro);
  display:grid;place-items:center;box-shadow:0 10px 26px -8px rgba(10,61,122,.45);
  transition:transform var(--dur-rapida) var(--ease);
}
.gp-wa-flota:hover{transform:scale(1.06)}
.gp-barra-movil{
  position:fixed;left:0;right:0;bottom:0;z-index:95;
  display:flex;gap:var(--e3);padding:var(--e3) var(--e4);
  padding-bottom:calc(var(--e3) + env(safe-area-inset-bottom,0px));
  background:rgba(255,255,255,.95);backdrop-filter:blur(12px);
  border-top:1px solid var(--gp-borde);
}
.gp-barra-movil .gp-btn{flex:1}
@media (min-width:768px){.gp-barra-movil{display:none}}
@media (max-width:767px){
  .gp-wa-flota{bottom:calc(var(--e8) + var(--e4))}
  body{padding-bottom:76px}

  /* El material es todo vertical 9:16. A ancho completo de celular, una
     tarjeta 4:5 mide casi 600 px de alto y la página se vuelve interminable.
     Acá se recorta el encuadre y se achican los marcos: el video igual se ve
     nítido porque el original nace a 464 px de ancho. */
  .gp-servicio__media{aspect-ratio:16/10}
  .gp-galeria__media{aspect-ratio:1/1}
  .gp-vidrio{max-width:272px}
  .gp-ad{max-width:320px;margin-inline:auto}
  .gp-ad-grid{gap:var(--e5)}
}

/* -------------------------------------------------------------- REVEALS ---- */
/* Se esconden solo si hay JS para volver a mostrarlos. Sin JS, o si el
   observador falla, el contenido se ve igual: nunca una página en blanco. */
.js [data-reveal]{opacity:0;transform:translateY(12px);
  transition:opacity .5s var(--ease),transform .5s var(--ease)}
.js [data-reveal][data-visible]{opacity:1;transform:none}

/* ------------------------------------------------- MOVIMIENTO REDUCIDO ---- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
  .gp-vidrio__sucio{display:none}
  .gp-vidrio__filo{display:none}
  .js [data-reveal]{opacity:1;transform:none}
}
