/* =====================================================================
   Green Matter — sitio corporativo (premium, cinematográfico)
   Verde profundo · cristal esmerilado · acento brass · motivos de marca
   Autocontenido: tokens + fuentes Trip Sans embebidas + estilos del sitio.
   Basado en el design system de Claude Design (site.css), sin @imports
   externos para que el sitio sea 100 % estático y publicable en Netlify.
   ===================================================================== */

/* ---------- Fuentes de marca (Trip Sans, self-hosted) ---------- */
@font-face{font-family:'Trip Sans';src:url('fonts/trip-sans.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Trip Sans';src:url('fonts/trip-sans-medium.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Trip Sans';src:url('fonts/trip-sans-bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Trip Sans';src:url('fonts/trip-sans-ultra.otf') format('opentype');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Trip Sans Mono';src:url('fonts/trip-sans-mono.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap;}

/* ---------- Tokens (reconstrucción de colors_and_type.css) ---------- */
:root{
  /* paleta de marca */
  --gm-forest:#3A5540;
  --gm-forest-700:#2E4234;
  --gm-forest-900:#18251C;
  --gm-fern:#6B9E6F;
  --gm-sage:#8BAD8C;
  --gm-mist:#C5D9C6;
  --gm-cream:#F4F1EC;
  --gm-bark:#2A2E2A;
  --gm-stone:#8A8F88;
  --gm-brass:#C2A368;
  --gm-mineral:#FBFAF7;
  /* texto */
  --ink:#272B25;
  --ink-soft:#55605A;
  /* superficies */
  --surface:#FFFFFF;
  --hairline:rgba(42,46,42,.12);
  /* radios */
  --r-md:18px;
  --r-lg:26px;
  --r-pill:999px;
  /* sombras */
  --sh-1:0 1px 2px rgba(24,37,28,.05),0 6px 18px rgba(24,37,28,.04);
  --sh-3:0 24px 60px -18px rgba(24,37,28,.22);
  /* motion */
  --dur-2:.3s;
  --dur-3:.5s;
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  /* tipografía */
  --font-sans:'Trip Sans','Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display:'Trip Sans','Figtree',system-ui,sans-serif;
  --font-mono:'Trip Sans Mono','IBM Plex Mono',ui-monospace,monospace;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:var(--font-sans);color:var(--gm-cream);
  background:var(--gm-forest-900);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
section{position:relative;}
.wrap{max-width:1240px;margin:0 auto;padding:0 48px;}
.eyebrow{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gm-sage);margin:0;
}
.brass{color:var(--gm-brass);}

/* accesibilidad: foco visible y selección */
:focus-visible{outline:2px solid var(--gm-brass);outline-offset:3px;border-radius:4px;}
::selection{background:var(--gm-brass);color:var(--gm-forest-900);}
.skip-link{
  position:absolute;left:-999px;top:0;z-index:200;
  background:var(--gm-cream);color:var(--gm-forest);
  font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  padding:12px 18px;border-radius:0 0 var(--r-md) 0;
}
.skip-link:focus{left:0;}

/* ---------- marca: molécula CBD (inline, recoloreable, para placeholders) ---------- */
.gm-mark{color:currentColor;display:block;}

/* ---------- liquid glass primitive ---------- */
.glass{
  background:rgba(244,241,236,.04);
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  border:none;position:relative;overflow:hidden;
  box-shadow:inset 0 1px 1px rgba(244,241,236,.12);
}
.glass::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.3px;
  background:linear-gradient(180deg,
    rgba(244,241,236,.5) 0%, rgba(244,241,236,.14) 22%,
    rgba(244,241,236,0) 42%, rgba(244,241,236,0) 58%,
    rgba(244,241,236,.14) 78%, rgba(244,241,236,.5) 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;
}
/* fallback cuando el navegador no soporta backdrop-filter: dar un fondo
   sólido suficiente para que el menú y el CTA conserven forma y contraste */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .glass{background:rgba(24,37,28,.55);}
  .nav.on-light .nav__center,.nav.on-light .nav__cta{background:rgba(58,85,64,.14);}
}

/* ============================ NAV ============================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:26px 48px;color:var(--gm-cream);
  transition:padding var(--dur-3) var(--ease),background var(--dur-3) var(--ease),box-shadow var(--dur-3) var(--ease),color var(--dur-3) var(--ease);
}
.nav.shrink{padding:13px 48px;}
.nav.on-light{color:var(--gm-forest);}
/* marca: logotipo real — lockup completo (expandido) que pasa a badge circular al hacer scroll */
.nav__brand{position:relative;display:flex;align-items:center;width:140px;height:58px;flex:none;}
.nav__brand .brand__lockup,.nav__brand .brand__seal{
  position:absolute;left:0;top:50%;transform:translateY(-50%);
  transition:opacity .45s var(--ease-out);pointer-events:none;
}
.brand__lockup{height:58px;width:auto;opacity:0;}
.brand__seal{width:58px;height:58px;opacity:0;}
.brand__seal-img{width:100%;height:100%;display:block;}
/* expandido (sin scroll): versión del lockup según el tema del nav */
.nav:not(.shrink):not(.on-light) .brand__lockup--dark{opacity:1;}
.nav:not(.shrink).on-light .brand__lockup--light{opacity:1;}
/* contraído (con scroll): muestra el badge GM circular */
.nav.shrink .brand__seal{opacity:1;}
.nav__center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:2px;padding:7px;border-radius:var(--r-pill);
}
.nav__center a{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(244,241,236,.82);padding:8px 18px;border-radius:var(--r-pill);
  transition:background var(--dur-2) var(--ease),color var(--dur-2) var(--ease);
}
.nav__center a:hover{color:var(--gm-cream);background:rgba(244,241,236,.08);}
.nav__cta{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(244,241,236,.9);padding:11px 22px;border-radius:var(--r-pill);
  transition:color var(--dur-2) var(--ease),background var(--dur-2) var(--ease);
}
.nav__cta:hover{color:var(--gm-cream);}
/* color de menú adaptativo: forest sobre secciones claras, cream sobre oscuras */
.nav.on-light .nav__center{background:rgba(58,85,64,.05);}
.nav.on-light .nav__center::before,.nav.on-light .nav__cta::before{opacity:0;}
.nav.on-light .nav__center a{color:rgba(42,46,42,.7);}
.nav.on-light .nav__center a:hover{color:var(--gm-forest);background:rgba(58,85,64,.08);}
.nav.on-light .nav__cta{color:var(--gm-forest);background:rgba(58,85,64,.05);}
.nav.on-light .nav__cta:hover{color:var(--gm-forest-900);}
/* con el menú móvil abierto, la marca y el toggle van sobre el panel oscuro */
.nav.nav--menu-open{color:var(--gm-cream);}

/* ---------- botón hamburguesa (solo móvil) ---------- */
.nav__toggle{
  display:none;width:44px;height:44px;align-items:center;justify-content:center;
  background:transparent;border:none;cursor:pointer;color:inherit;padding:0;margin:-10px -8px -10px 0;
}
.nav__toggle-bars,.nav__toggle-bars::before,.nav__toggle-bars::after{
  display:block;width:22px;height:2px;background:currentColor;border-radius:2px;
  transition:transform var(--dur-2) var(--ease),opacity var(--dur-2) var(--ease),background var(--dur-2) var(--ease);
}
.nav__toggle-bars{position:relative;}
.nav__toggle-bars::before{content:"";position:absolute;top:-7px;left:0;}
.nav__toggle-bars::after{content:"";position:absolute;top:7px;left:0;}
.nav__toggle[aria-expanded="true"]{color:var(--gm-cream);}
.nav__toggle[aria-expanded="true"] .nav__toggle-bars{background:transparent;}
.nav__toggle[aria-expanded="true"] .nav__toggle-bars::before{transform:translateY(7px) rotate(45deg);}
.nav__toggle[aria-expanded="true"] .nav__toggle-bars::after{transform:translateY(-7px) rotate(-45deg);}

/* ---------- panel de navegación móvil ---------- */
.nav__mobile{
  position:fixed;top:0;left:0;right:0;z-index:55;
  display:flex;flex-direction:column;gap:2px;
  padding:92px 28px 30px;
  background:rgba(24,37,28,.97);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(244,241,236,.12);
  transform:translateY(-100%);visibility:hidden;
  transition:transform var(--dur-3) var(--ease),visibility var(--dur-3) var(--ease);
}
.nav__mobile.is-open{transform:translateY(0);visibility:visible;}
.nav__mobile a{
  font-family:var(--font-sans);font-size:20px;color:var(--gm-cream);
  padding:15px 4px;border-bottom:1px solid rgba(244,241,236,.08);
}
.nav__mobile a:hover{color:var(--gm-sage);}
.nav__mobile .nav__mobile-cta{
  margin-top:18px;background:var(--gm-cream);color:var(--gm-forest);
  text-align:center;border-radius:var(--r-pill);padding:15px;font-weight:500;border-bottom:none;
}
.nav__mobile .nav__mobile-cta:hover{color:var(--gm-forest-900);}

@media(max-width:880px){
  .nav__center{display:none;}
  .nav__cta{display:none;}
  .nav__toggle{display:inline-flex;}
}
@media(min-width:881px){
  .nav__mobile{display:none;}
}

/* ============================ HERO ============================ */
.hero{
  min-height:100vh;display:flex;flex-direction:column;
  justify-content:center;align-items:center;text-align:center;
  padding:140px 24px 120px;overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% -10%, #426049 0%, var(--gm-forest) 38%, var(--gm-forest-900) 78%, #1b2a20 100%);
}
.hero__layer{position:absolute;inset:-8%;pointer-events:none;will-change:transform;}
.hero__glow{
  background:
    radial-gradient(38% 50% at 22% 30%, rgba(139,173,140,.22), transparent 70%),
    radial-gradient(34% 46% at 82% 64%, rgba(107,158,111,.20), transparent 72%),
    radial-gradient(50% 60% at 60% 8%, rgba(197,217,198,.10), transparent 70%);
  animation:drift 26s ease-in-out infinite alternate;
}
.hero__lattice{
  opacity:.5;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='112' height='194' viewBox='0 0 112 194'><g fill='none' stroke='%236B9E6F' stroke-width='1' stroke-opacity='0.16'><polygon points='56,2 110,33 110,95 56,126 2,95 2,33'/><polygon points='56,128 110,159 110,221 56,252 2,221 2,159'/></g></svg>");
  background-size:130px auto;
}
.hero__mol{
  position:absolute;left:50%;bottom:-6%;width:min(1500px,135vw);
  transform:translateX(-50%);opacity:.10;pointer-events:none;
  filter:brightness(0) invert(1);
}
.hero__vign{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 50%, transparent 52%, rgba(13,21,15,.55) 100%);}

.hero__inner{position:relative;z-index:3;max-width:960px;}
.hero__kicker{margin-bottom:30px;}
.hero h1{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(46px,7.4vw,104px);line-height:.98;letter-spacing:-.03em;
  margin:0;color:var(--gm-cream);text-wrap:balance;
}
.hero h1 .dim{display:block;color:rgba(244,241,236,.5);}
.hero__lede{
  font-size:clamp(16px,1.5vw,20px);line-height:1.6;color:rgba(244,241,236,.74);
  max-width:50ch;margin:32px auto 0;text-wrap:pretty;
}
.hero__actions{display:flex;gap:16px;justify-content:center;align-items:center;margin-top:40px;flex-wrap:wrap;}
.btn-light{
  background:var(--gm-cream);color:var(--gm-forest);font-weight:500;font-size:15px;font-family:var(--font-sans);
  border:none;border-radius:var(--r-pill);padding:15px 30px;cursor:pointer;
  transition:transform var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out);
}
.btn-light:hover{transform:scale(1.03);box-shadow:0 0 40px 2px rgba(244,241,236,.22);}
.btn-light:active{transform:scale(.98);}
.btn-ghost{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
  color:rgba(244,241,236,.85);padding:14px 18px;display:inline-flex;align-items:center;gap:8px;
  transition:color var(--dur-2) var(--ease);
}
.btn-ghost:hover{color:var(--gm-cream);}
.btn-ghost svg{width:15px;height:15px;}
.hero__cred{
  position:absolute;left:0;right:0;bottom:38px;z-index:3;
  display:flex;justify-content:center;align-items:center;gap:14px;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(244,241,236,.55);
}
.hero__cred svg{width:13px;height:13px;}
.hero__cred .dot{width:3px;height:3px;border-radius:50%;background:var(--gm-brass);}

/* ---------- divisor cadena pentilo (motivo de marca) ---------- */
.wave{display:block;width:100%;height:26px;color:var(--gm-brass);opacity:.8;}
.wave--soft{color:var(--gm-sage);opacity:.5;}

/* ============================ MANIFESTO ============================ */
.manifesto{background:var(--gm-forest);padding:140px 0;text-align:center;}
.manifesto__line{width:46px;height:1.5px;background:var(--gm-brass);margin:0 auto 30px;}
.manifesto p{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(26px,3.6vw,46px);line-height:1.28;letter-spacing:-.01em;
  max-width:21ch;margin:18px auto 0;color:var(--gm-cream);text-wrap:balance;
}
.manifesto .sig{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gm-sage);margin-top:40px;
}

/* ============================ FAMILIA (portfolio) ============================ */
.family{background:var(--gm-cream);color:var(--gm-bark);padding:130px 0;}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:54px;}
.sec-head__t{max-width:30ch;}
.sec-head h2{
  font-family:var(--font-display);font-weight:400;font-size:clamp(32px,4vw,56px);
  line-height:1.02;letter-spacing:-.02em;margin:14px 0 0;color:var(--gm-forest);
}
.sec-head .eyebrow{color:var(--gm-fern);}
.sec-head__n{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;color:var(--gm-stone);white-space:nowrap;}
.fam-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.fam-card{
  background:var(--gm-mineral);border:1px solid var(--hairline);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;cursor:pointer;
  transition:transform var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out);
}
.fam-card:hover{transform:translateY(-6px);box-shadow:var(--sh-3);}
.fam-card__media{
  aspect-ratio:4/5;position:relative;display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.fam-card__media::after{
  content:attr(data-label);position:absolute;left:16px;bottom:14px;
  font-family:var(--font-mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(244,241,236,.55);
}
.fam-card__media .gm-mark{width:74px;height:74px;opacity:.5;}
/* foto real (cubre el placeholder cuando existe el archivo; si falta, onerror la quita) */
.media-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:3;}
.m-sage{background:var(--gm-sage);}
.m-sage .gm-mark{color:var(--gm-cream);}
.m-forest{background:var(--gm-forest);}
.m-forest .gm-mark{color:var(--gm-cream);}
.m-mist{background:var(--gm-mist);}
.m-mist .gm-mark{color:var(--gm-forest);}
.fam-card__body{padding:26px 26px 30px;display:flex;flex-direction:column;gap:9px;flex:1;}
.fam-card__tag{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gm-fern);}
.fam-card h3{font-family:var(--font-display);font-weight:400;font-size:27px;letter-spacing:-.01em;margin:2px 0 0;color:var(--gm-forest);}
.fam-card p{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:0;flex:1;}
.fam-card .more{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;color:var(--gm-forest);margin-top:8px;}
.fam-card .more svg{width:15px;height:15px;transition:transform var(--dur-2) var(--ease-out);}
.fam-card:hover .more svg{transform:translateX(4px);}

/* ============================ CIENCIA ============================ */
.science{background:var(--gm-bark);padding:120px 0;}
.science .eyebrow{color:var(--gm-sage);}
.science h2{
  font-family:var(--font-display);font-weight:400;font-size:clamp(30px,3.6vw,48px);
  line-height:1.06;letter-spacing:-.02em;margin:14px 0 0;color:var(--gm-cream);max-width:24ch;
}
.sci-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:64px;}
.sci-item{display:flex;flex-direction:column;gap:16px;}
.sci-item__ic{
  width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(244,241,236,.16);color:var(--gm-sage);
}
.sci-item__ic svg{width:21px;height:21px;stroke-width:1.6;}
.sci-item h3{font-weight:500;font-size:17px;margin:4px 0 0;color:var(--gm-cream);}
.sci-item p{font-size:13.5px;line-height:1.6;color:rgba(244,241,236,.6);margin:0;}
.sci-item__n{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;color:var(--gm-brass);}

/* ============================ SPOTLIGHT (Santiva) ============================ */
.spot{background:var(--gm-cream);color:var(--gm-bark);padding:130px 0;}
.spot__grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.spot__art{
  aspect-ratio:1/1;border-radius:var(--r-lg);position:relative;overflow:hidden;
  background:var(--gm-forest);display:flex;align-items:center;justify-content:center;
}
.spot__art .gm-mark{width:130px;height:130px;color:var(--gm-cream);opacity:.45;}
/* foto real del producto (cubre el placeholder; el sello queda por encima) */
.spot__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;}
.spot__art::after{content:attr(data-label);position:absolute;left:18px;bottom:16px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,241,236,.5);}
.spot__seal{
  position:absolute;top:22px;right:22px;width:74px;height:74px;border-radius:50%;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  border:1px solid var(--gm-brass);color:var(--gm-brass);
  font-family:var(--font-mono);font-size:8px;letter-spacing:.12em;line-height:1.3;text-transform:uppercase;
  background:rgba(42,46,42,.25);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
}
.spot__seal b{font-size:15px;letter-spacing:0;}
.spot h2{font-family:var(--font-display);font-weight:400;font-size:clamp(38px,4.6vw,64px);line-height:.98;letter-spacing:-.02em;color:var(--gm-forest);margin:14px 0 0;}
.spot .spot__tagline{font-family:var(--font-display);font-weight:400;font-size:21px;color:var(--gm-fern);margin:6px 0 22px;letter-spacing:-.01em;}
.spot__actives{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:30px 0;padding:24px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);}
.spot__actives .act{display:flex;flex-direction:column;gap:4px;}
.spot__actives .act__n{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--gm-brass);}
.spot__actives .act h3{font-family:var(--font-display);font-weight:400;font-size:18px;line-height:1.1;color:var(--gm-forest);margin:2px 0 0;}
.spot__actives .act p{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--gm-stone);margin:0;max-width:none;}
.spot .spot__fmt{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gm-stone);margin:0 0 26px;}
.spot p{font-size:16px;line-height:1.65;color:var(--ink-soft);max-width:46ch;margin:0 0 10px;}
.spot .spot__legal{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;color:var(--gm-stone);margin:16px 0 0;opacity:.8;}
.btn-forest{
  background:var(--gm-forest);color:var(--gm-cream);font-weight:500;font-size:15px;border:none;font-family:var(--font-sans);
  border-radius:var(--r-pill);padding:15px 30px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;
  transition:transform var(--dur-2) var(--ease-out),background var(--dur-2) var(--ease);
}
.btn-forest svg{width:16px;height:16px;}
.btn-forest:hover{background:var(--gm-forest-700);transform:translateY(-2px);}
.btn-forest:active{transform:scale(.98);}
.spot__cta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.spot__ig{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:500;color:var(--gm-fern);transition:color var(--dur-2) var(--ease);}
.spot__ig svg{width:19px;height:19px;}
.spot__ig:hover{color:var(--gm-forest);}

/* ============================ STATEMENT band ============================ */
.statement{background:var(--gm-forest-900);padding:120px 0;text-align:center;overflow:hidden;}
.statement__big{
  font-family:var(--font-display);font-weight:400;font-size:clamp(40px,8vw,128px);
  line-height:.94;letter-spacing:-.03em;color:var(--gm-cream);margin:0;text-wrap:balance;
}
.statement__big em{font-style:normal;color:var(--gm-brass);}
.statement__sub{font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gm-sage);margin:30px 0 0;}

/* ============================ FOOTER ============================ */
.foot{background:var(--gm-bark);padding:96px 0 40px;position:relative;overflow:hidden;}
/* mascota Moll-E — saludo de despedida, esquina inferior derecha */
.foot__mascot{position:absolute;right:40px;bottom:96px;width:158px;height:auto;pointer-events:none;transform:scaleX(-1);}
@media(max-width:980px){.foot__mascot{display:none;}}
.foot__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:48px;align-items:start;}
.foot__logo{height:72px;width:auto;display:block;}
.foot__news h3{font-family:var(--font-display);font-weight:400;font-size:26px;letter-spacing:-.01em;margin:18px 0 6px;color:var(--gm-cream);}
.foot__news p{font-size:14px;color:rgba(244,241,236,.6);margin:0 0 18px;max-width:30ch;line-height:1.55;}
.foot__form{display:flex;gap:8px;max-width:360px;}
.foot__form input{
  flex:1;background:rgba(244,241,236,.06);border:1px solid rgba(244,241,236,.18);
  border-radius:var(--r-pill);padding:13px 18px;color:var(--gm-cream);font-family:var(--font-sans);font-size:14px;outline:none;
  transition:border-color var(--dur-2) var(--ease);
}
.foot__form input::placeholder{color:rgba(244,241,236,.45);}
.foot__form input:focus{border-color:var(--gm-sage);}
.foot__form button{
  background:var(--gm-cream);color:var(--gm-forest);border:none;border-radius:var(--r-pill);font-family:var(--font-sans);
  padding:0 22px;font-weight:500;font-size:14px;cursor:pointer;transition:transform var(--dur-2) var(--ease-out);
}
.foot__form button:hover{transform:scale(1.03);}
.foot__col h4{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gm-sage);margin:0 0 18px;}
.foot__col a{display:block;color:rgba(244,241,236,.78);font-size:14.5px;margin-bottom:12px;transition:color var(--dur-2) var(--ease);}
.foot__col a:hover{color:var(--gm-cream);}
.foot__col .foot__loc{display:block;color:rgba(244,241,236,.5);font-size:14.5px;margin-top:2px;}
.foot__note{font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;color:var(--gm-sage);margin:12px 0 0;}
.foot__bottom{display:flex;justify-content:space-between;align-items:center;margin-top:72px;padding-top:26px;border-top:1px solid rgba(244,241,236,.14);gap:16px;flex-wrap:wrap;}
.foot__bottom .tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gm-sage);}
.foot__bottom .cr{font-size:12.5px;color:rgba(244,241,236,.5);}
.foot__legal{font-family:var(--font-mono);font-size:10.5px;line-height:1.6;letter-spacing:.04em;color:rgba(244,241,236,.42);margin:48px 0 0;max-width:70ch;}

/* ============================ reveal motion ============================ */
.reveal{opacity:1;transform:none;filter:none;
  transition:opacity 1.1s var(--ease-out),transform 1.1s var(--ease-out),filter 1.1s var(--ease-out);}
body.js .reveal{opacity:0;transform:translateY(40px);filter:blur(7px);}
body.js .reveal.in{opacity:1;transform:none;filter:blur(0);}
.reveal.d1{transition-delay:.12s;}
.reveal.d2{transition-delay:.24s;}
.reveal.d3{transition-delay:.36s;}

/* media clip-wipe + slow scale */
.reveal-media{overflow:hidden;}
body.js .reveal-media{clip-path:inset(0 0 101% 0);transition:clip-path 1.25s var(--ease-out);}
body.js .reveal-media.in{clip-path:inset(0 0 0 0);}
body.js .reveal-media>*{transition:transform 1.6s var(--ease-out);}
body.js .reveal-media:not(.in)>*{transform:scale(1.1);}

@keyframes drift{
  0%{transform:translate3d(0,0,0) scale(1);}
  100%{transform:translate3d(-3%,2%,0) scale(1.08);}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal,.reveal-media{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;}
  .reveal-media>*{transform:none!important;}
  .hero__glow{animation:none;}
}

/* ============================ responsive ============================ */
@media(max-width:980px){
  .wrap{padding:0 28px;}
  .nav{padding:20px 28px;}
  .nav.shrink{padding:12px 28px;}
  .fam-grid{grid-template-columns:1fr;}
  .sci-grid{grid-template-columns:1fr 1fr;}
  .spot__grid{grid-template-columns:1fr;gap:48px;}
  .foot__top{grid-template-columns:1fr 1fr;gap:36px;}
  .sec-head{flex-direction:column;align-items:flex-start;}
}
@media(max-width:560px){
  .sci-grid{grid-template-columns:1fr;}
  .foot__top{grid-template-columns:1fr;}
  .hero__cred{flex-wrap:wrap;padding:0 24px;row-gap:6px;}
  .spot__actives{grid-template-columns:1fr;gap:14px;}
  .nav__brand{width:124px;height:52px;}
  .brand__lockup{height:52px;}
  .foot__logo{height:62px;}
}
