/* ===== G cafe Bilbao — base: reset, tokens, type, utilities =====
   Palette + type measured from the Savoria reference (own clean rebuild):
   deep green canvas, ochre accent, warm cream text, Newsreader + Source Sans 3. */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body,h1,h2,h3,h4,h5,p,figure,blockquote,ul,ol,dl,dd{margin:0}
ul[role="list"],ol[role="list"]{list-style:none;padding:0;margin:0}
img,picture,svg,video{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--ochre);outline-offset:3px}

:root{
  /* palette (measured from reference) */
  --green:#202D2D;        /* page canvas */
  --green-2:#1B2626;      /* deeper panel */
  --green-3:#223B3B;      /* raised surface */
  --green-btn:#3B5843;    /* button / form panel green */
  --green-btn-2:#30492F;  /* button hover */
  --ink:#14201F;          /* near-black band / overlay */
  --ochre:#D39969;        /* primary accent */
  --ochre-2:#C9884F;      /* ochre hover */
  --cream:#D8CBB8;        /* body text */
  --cream-bright:#FFFCF3; /* headings on dark / bright */
  --cream-dim:#A99F8C;    /* muted text */
  --line:rgba(216,203,184,.15);
  --line-2:rgba(216,203,184,.26);

  /* fonts */
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  /* radii — Savoria is sharp; buttons & panels square */
  --r-card:2px;
  --r-btn:0px;

  /* rhythm */
  --pad-top:clamp(92px,13vw,200px);
  --pad-top-sm:clamp(68px,9vw,128px);
  --gut:clamp(20px,5vw,50px);
  --maxw:1340px;

  --ease:cubic-bezier(.22,1,.36,1);
}

/* Lenis drives smooth scroll in JS; native smooth would double-ease and fight it. */
html{scroll-behavior:auto}
html:not(.js){scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html:not(.js){scroll-behavior:auto}}

body{
  background:var(--green);
  color:var(--cream);
  font-family:var(--sans);
  font-size:19px;
  line-height:1.6;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}

/* ---- type ---- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;letter-spacing:-.01em;line-height:1.02;color:var(--ochre)}
h1 em,h2 em,h3 em,h4 em,.i{font-style:italic;font-weight:400}
.h-display{font-size:clamp(30px,7.7vw,128px);font-weight:300;letter-spacing:-.02em;line-height:.99;overflow-wrap:break-word}
h2,.h2{font-size:clamp(28px,6vw,76px);line-height:1.02}
h3,.h3{font-size:clamp(27px,4.2vw,50px)}
h4,.h4{font-size:clamp(23px,3vw,38px);font-weight:400}
.lead{font-size:clamp(18px,2.1vw,23px);line-height:1.5;color:var(--cream)}
p{color:var(--cream);font-size:clamp(15px,1.25vw,17px);line-height:1.62}
.muted{color:var(--cream-dim)}
small,.small{font-size:14px}

.eyebrow{
  font-family:var(--sans);font-size:12px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ochre);
  display:inline-flex;align-items:center;gap:.6em;
}
.eyebrow::before{content:"";width:24px;height:1px;background:currentColor;opacity:.7}
.eyebrow.center{justify-content:center}
.eyebrow.center::before{display:none}

/* ---- utilities ---- */
.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.container.fluid{max-width:none;padding-inline:clamp(20px,4vw,64px)}
.section{padding-top:var(--pad-top);padding-bottom:var(--pad-top-sm)}
.section.tight{padding-top:var(--pad-top-sm)}
.center{text-align:center}
.mx-auto{margin-inline:auto}
.measure{max-width:56ch}
.measure-sm{max-width:44ch}
.stack-s>*+*{margin-top:.75rem}
.stack-m>*+*{margin-top:1.25rem}
.stack-l>*+*{margin-top:2rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.accent{color:var(--ochre)}
.no-js .js-only{display:none}
