/* =========================================================
   FUFU & VIBES — Brand System
   Palette extracted from the brand mark.
   ========================================================= */

:root{
  /* Core */
  --ink:        #1A1208;
  --ink-soft:   #2C2113;
  --noir:       #14110D;
  --smoke:      #4A3F2E;
  --mist:       #7A6F5E;

  /* Cream family */
  --ivory:      #F4E7CB;
  --cream:      #FAF3DE;
  --bone:       #EEE2C5;
  --linen:      #E6D7B5;

  /* Accents from logo */
  --clay:       #C25A2E;   /* terracotta — the '&' */
  --clay-deep:  #9A4319;
  --clay-soft:  #E2906A;

  --olive:      #5B6B3A;   /* 'Vibes' + frond */
  --olive-deep: #3A4624;
  --olive-soft: #8A9963;

  --gold:       #B89048;   /* earring tone */
  --gold-soft:  #D6B074;
  --wood:       #6B4423;   /* mortar */
  --wood-deep:  #3F2814;

  /* Surfaces */
  --surface:    var(--cream);
  --surface-2:  var(--ivory);
  --surface-3:  var(--bone);
  --on-surface: var(--ink);

  /* Inverted (dark sections) */
  --night:      #14110D;
  --night-2:    #1F1A11;
  --on-night:   #F0E4C6;

  /* Type */
  --serif: "Fraunces", "Cormorant Garamond", "Times New Roman", serif;
  --sans:  "Inter", "Helvetica Neue", system-ui, -apple-system, sans-serif;
  --script:"Caveat", "Brush Script MT", cursive;

  /* Scale */
  --fs-eyebrow: 11.5px;
  --fs-body:    17px;
  --fs-lead:    19px;
  --fs-h6:      clamp(1.1rem, 1.4vw, 1.25rem);
  --fs-h5:      clamp(1.25rem, 1.8vw, 1.5rem);
  --fs-h4:      clamp(1.5rem, 2.2vw, 2rem);
  --fs-h3:      clamp(1.85rem, 3vw, 2.75rem);
  --fs-h2:      clamp(2.4rem, 4.8vw, 4rem);
  --fs-h1:      clamp(3.2rem, 8vw, 7.5rem);
  --fs-hero:    clamp(3.6rem, 11vw, 10.5rem);

  /* Layout */
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --max:    1320px;
  --max-narrow: 880px;

  /* Motion */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur-fast: .3s;
  --dur:      .6s;
  --dur-slow: 1.2s;

  /* Shadow */
  --ring: 0 1px 0 rgba(26,18,8,.06);
  --lift: 0 30px 60px -30px rgba(26,18,8,.25);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol{margin:0}
ul[role="list"],ol[role="list"]{list-style:none;padding:0}
img,picture,video,svg{display:block;max-width:100%;height:auto}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
::selection{background:var(--clay);color:var(--cream)}

html{ background:var(--surface); }
body{
  font-family:var(--sans);
  font-size:var(--fs-body);
  line-height:1.6;
  color:var(--on-surface);
  background:var(--surface);
  font-feature-settings:"ss01","cv11";
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* ---------- Type ---------- */
.eyebrow{
  font-family:var(--sans);
  font-size:var(--fs-eyebrow);
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--smoke);
  display:inline-block;
}

h1,h2,h3,h4,h5,h6,.serif{
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.015em;
  line-height:1.02;
  color:var(--ink);
  font-variation-settings:"SOFT" 50,"WONK" 1,"opsz" 144;
}
h1,.h1{ font-size:var(--fs-h1); line-height:.96; letter-spacing:-.025em }
h2,.h2{ font-size:var(--fs-h2); line-height:1; letter-spacing:-.022em }
h3,.h3{ font-size:var(--fs-h3); line-height:1.05 }
h4,.h4{ font-size:var(--fs-h4); line-height:1.15 }
h5,.h5{ font-size:var(--fs-h5); line-height:1.25 }
.hero-type{ font-size:var(--fs-hero); line-height:.92; letter-spacing:-.035em }

.script{ font-family:var(--script); font-weight:400; }
em, .italic{ font-style:italic; font-variation-settings:"SOFT" 100,"WONK" 1; }

p{ max-width:62ch; }
.lead{ font-size:var(--fs-lead); line-height:1.55; color:var(--ink-soft); }
.muted{ color:var(--smoke); }
.balance{ text-wrap:balance; }
.pretty{ text-wrap:pretty; }

/* ---------- Layout ---------- */
.wrap{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--gutter); }
.wrap-narrow{ width:100%; max-width:var(--max-narrow); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:clamp(4rem,9vw,8rem); }
.section-sm{ padding-block:clamp(2.5rem,5vw,4rem); }
.section-lg{ padding-block:clamp(6rem,12vw,11rem); }

.grid{ display:grid; gap:clamp(1.25rem,2.4vw,2.5rem); }
.cols-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.cols-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.cols-12{ grid-template-columns:repeat(12,minmax(0,1fr)); }
@media (max-width:880px){
  .cols-2,.cols-3{ grid-template-columns:1fr; }
  .cols-12{ grid-template-columns:repeat(6,minmax(0,1fr)); }
}

.flex{ display:flex; }
.between{ justify-content:space-between; }
.center{ align-items:center; }
.gap-sm{ gap:.5rem } .gap{ gap:1rem } .gap-lg{ gap:2rem }
.tac{ text-align:center } .tar{ text-align:right }

/* ---------- Themes ---------- */
.theme-cream{ background:var(--cream); color:var(--ink); }
.theme-ivory{ background:var(--ivory); color:var(--ink); }
.theme-bone{  background:var(--bone);  color:var(--ink); }
.theme-night{ background:var(--night); color:var(--on-night); }
.theme-night h1,.theme-night h2,.theme-night h3,.theme-night h4,.theme-night h5{ color:var(--cream); }
.theme-night .eyebrow{ color:var(--gold-soft); }
.theme-night .muted{ color:#B8AC8E; }
.theme-night .lead{ color:#D8C9A3; }
.theme-clay{ background:var(--clay); color:var(--cream); }
.theme-clay h1,.theme-clay h2,.theme-clay h3{ color:var(--cream); }
.theme-clay .eyebrow{ color:var(--ivory); }
.theme-olive{ background:var(--olive-deep); color:var(--cream); }
.theme-olive h1,.theme-olive h2,.theme-olive h3{ color:var(--cream); }
.theme-olive .eyebrow{ color:var(--gold-soft); }
.theme-olive .muted{ color:#C9C1A6; }

/* ---------- Header / Nav ---------- */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:50;
  padding:1.1rem 0;
  transition:background var(--dur) var(--ease), color var(--dur) var(--ease), padding var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  color:var(--cream);
}
.site-header .wrap{ display:flex; align-items:center; justify-content:space-between; }
.site-header.is-scrolled{
  background:rgba(20,17,13,.82);
  backdrop-filter:saturate(1.3) blur(14px);
  -webkit-backdrop-filter:saturate(1.3) blur(14px);
  padding:.7rem 0;
  box-shadow:0 1px 0 rgba(255,255,255,.05);
}
.site-header.is-light{ color:var(--ink); }
.site-header.is-light.is-scrolled{
  background:rgba(250,243,222,.86);
  color:var(--ink);
  box-shadow:0 1px 0 rgba(26,18,8,.06);
}

.brand{
  display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--serif); font-style:italic; font-size:1.25rem; letter-spacing:-.01em;
}
.brand .mark{
  width:42px; height:42px; border-radius:50%; overflow:hidden;
  background:var(--ivory);
  display:grid; place-items:center;
  box-shadow:inset 0 0 0 1px rgba(91,107,58,.5), 0 0 0 1px rgba(255,255,255,.06);
}
.brand .mark img{ width:100%; height:100%; object-fit:cover; }
.brand .name b{ font-weight:400; }

.nav{
  display:flex; align-items:center; gap:2.1rem;
  font-size:13.5px; letter-spacing:.06em;
  font-weight:500;
}
.nav a{ position:relative; padding:.4rem 0; }
.nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:.05rem;
  height:1px; background:currentColor; transition:right var(--dur) var(--ease);
}
.nav a:hover::after, .nav a.active::after{ right:0; }

.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--sans); font-size:13px; letter-spacing:.16em; text-transform:uppercase;
  padding:1.1rem 1.6rem;
  min-height:48px;
  border-radius:999px;
  transition:transform var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  white-space:nowrap;
}
.btn .arr{ width:1em; height:1em; transition:transform var(--dur) var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }
.btn-primary{ background:var(--clay); color:var(--cream); }
.btn-primary:hover{ background:var(--clay-deep); }
.btn-ghost{ border:1px solid currentColor; }
.btn-ghost:hover{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.theme-night .btn-ghost:hover{ background:var(--cream); color:var(--ink); border-color:var(--cream); }
.btn-cream{ background:var(--cream); color:var(--ink); }
.btn-cream:hover{ background:var(--ivory); }

.menu-toggle{
  display:none;
  width:46px; height:46px; border-radius:50%;
  border:1px solid currentColor;
  align-items:center; justify-content:center;
}
.menu-toggle span{
  position:relative; display:block; width:18px; height:1px; background:currentColor;
}
.menu-toggle span::before, .menu-toggle span::after{
  content:""; position:absolute; left:0; width:100%; height:1px; background:currentColor;
  transition:transform var(--dur) var(--ease), top var(--dur) var(--ease);
}
.menu-toggle span::before{ top:-6px; }
.menu-toggle span::after{ top:6px; }
.menu-toggle.is-open span{ background:transparent; }
.menu-toggle.is-open span::before{ top:0; transform:rotate(45deg); }
.menu-toggle.is-open span::after{ top:0; transform:rotate(-45deg); }

@media (max-width:880px){
  .nav, .header-cta{ display:none; }
  .menu-toggle{ display:inline-flex; }
}

/* Mobile drawer */
.drawer{
  position:fixed; inset:0; z-index:45;
  background:var(--night); color:var(--cream);
  display:grid; place-items:center;
  opacity:0; pointer-events:none; transition:opacity var(--dur) var(--ease);
}
.drawer.is-open{ opacity:1; pointer-events:auto; }
.drawer ul{ list-style:none; padding:0; text-align:center; }
.drawer li{ overflow:hidden; }
.drawer a{
  display:block; padding:.55rem 0;
  font-family:var(--serif); font-style:italic;
  font-size:clamp(2rem,8vw,3.5rem);
  letter-spacing:-.01em;
  transform:translateY(110%); transition:transform var(--dur-slow) var(--ease-out);
}
.drawer.is-open a{ transform:translateY(0); }
.drawer.is-open li:nth-child(2) a{ transition-delay:.05s }
.drawer.is-open li:nth-child(3) a{ transition-delay:.1s }
.drawer.is-open li:nth-child(4) a{ transition-delay:.15s }
.drawer.is-open li:nth-child(5) a{ transition-delay:.2s }
.drawer.is-open li:nth-child(6) a{ transition-delay:.25s }

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:100vh; min-height:100svh;
  display:flex; align-items:center; justify-content:center;
  color:var(--cream);
  overflow:hidden;
  isolation:isolate;
  padding-block:clamp(6rem,12vw,9rem);
  background:var(--night);
}
.hero-bg{
  position:absolute; inset:0; z-index:-2;
  background:
    radial-gradient(70% 60% at 80% 10%, rgba(194,90,46,.35), transparent 70%),
    radial-gradient(70% 60% at 10% 90%, rgba(91,107,58,.45), transparent 70%),
    linear-gradient(180deg,#1A140C 0%, #0E0B07 100%);
}
.hero-img{
  position:absolute; inset:0; z-index:-1;
  background-size:cover; background-position:center;
  filter:saturate(.95) contrast(.95) brightness(.78);
  animation:kenburns 22s var(--ease) both infinite alternate;
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(180deg, rgba(20,17,13,.0) 0%, rgba(20,17,13,.05) 50%, rgba(20,17,13,.85) 100%),
    linear-gradient(0deg, rgba(20,17,13,.7) 0%, rgba(20,17,13,0) 60%);
}
@keyframes kenburns{
  0%{ transform:scale(1.05) translate3d(0,0,0); }
  100%{ transform:scale(1.18) translate3d(-1.5%,-1%,0); }
}

.hero-eyebrow{ color:var(--gold-soft); margin-bottom:1.4rem; }
.hero h1{
  color:var(--cream);
  text-wrap:balance;
}
.hero h1 .clay{ color:var(--clay-soft); font-style:italic; font-variation-settings:"SOFT" 100; }
.hero h1 .script{ color:var(--gold-soft); display:block; font-size:.55em; line-height:1.1; margin-top:.4em; transform:rotate(-3deg) translateX(-.2em); }
.hero-meta{
  margin-top:2.2rem; display:flex; flex-wrap:wrap; gap:1rem 2.2rem; align-items:center;
  font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:#D8C9A3;
}
.hero-meta .dot{ width:5px; height:5px; border-radius:50%; background:var(--clay); display:inline-block; margin-right:.7rem; vertical-align:middle; }
.hero-cta{ margin-top:2rem; display:flex; gap:.75rem; flex-wrap:wrap; }

.scroll-cue{
  position:absolute; left:50%; bottom:1.5rem; transform:translateX(-50%);
  font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:#C8B991;
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
}
.scroll-cue .line{ width:1px; height:42px; background:linear-gradient(180deg, transparent, currentColor); animation:cue 2.2s ease-in-out infinite; transform-origin:top; }
@keyframes cue{ 0%{transform:scaleY(0)} 50%{transform:scaleY(1)} 100%{transform:scaleY(0); transform-origin:bottom} }

/* ---------- Marquee ---------- */
.marquee{
  overflow:hidden; padding:1.4rem 0;
  background:var(--night-2); color:var(--gold-soft);
}
.marquee .track{
  display:flex; gap:3rem; white-space:nowrap;
  animation:scroll 38s linear infinite;
  font-family:var(--serif); font-style:italic; font-size:clamp(1.4rem,2.4vw,2rem);
}
.marquee .track span{ display:inline-flex; align-items:center; gap:3rem; }
.marquee .track .dot{ width:6px; height:6px; border-radius:50%; background:var(--clay); display:inline-block; }
@keyframes scroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ---------- Story Panels ---------- */
.split{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(2rem,5vw,5rem); align-items:center;
}
.split.reverse{ grid-template-columns:.95fr 1.05fr; }
.split.reverse > .visual{ order:-1; }
@media (max-width:880px){ .split,.split.reverse{ grid-template-columns:1fr; } .split.reverse > .visual{ order:0; } }

.visual{
  position:relative; aspect-ratio:4/5; border-radius:6px; overflow:hidden;
  background:var(--linen);
  box-shadow:var(--lift);
}
.visual.tall{ aspect-ratio:3/4.4; }
.visual.wide{ aspect-ratio:16/10; }
.visual.square{ aspect-ratio:1/1; }
.visual img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.8s var(--ease);
}
.visual:hover img{ transform:scale(1.04); }
.visual .caption{
  position:absolute; left:1rem; bottom:1rem; right:1rem;
  font-size:11.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--cream); text-shadow:0 1px 16px rgba(0,0,0,.6);
}
.visual .stamp{
  position:absolute; top:1rem; left:1rem;
  background:rgba(20,17,13,.6); color:var(--cream);
  padding:.4rem .7rem; border-radius:999px;
  font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  backdrop-filter:blur(8px);
}

/* Painted fallback (when image fails) */
.paint-clay{ background:
  radial-gradient(60% 50% at 30% 20%, rgba(255,200,160,.45), transparent 60%),
  radial-gradient(60% 50% at 80% 80%, rgba(154,67,25,.7), transparent 60%),
  linear-gradient(135deg, #C25A2E, #6B2A0E);
}
.paint-olive{ background:
  radial-gradient(60% 50% at 30% 20%, rgba(220,220,160,.4), transparent 60%),
  radial-gradient(60% 50% at 80% 80%, rgba(58,70,36,.8), transparent 60%),
  linear-gradient(135deg, #5B6B3A, #2A331A);
}
.paint-cream{ background:
  radial-gradient(60% 50% at 30% 20%, rgba(255,240,210,.9), transparent 60%),
  radial-gradient(60% 50% at 80% 80%, rgba(184,144,72,.45), transparent 60%),
  linear-gradient(135deg, #F4E7CB, #C9A857);
}

/* ---------- Dish Card ---------- */
.dish-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.25rem,2.5vw,2.5rem);
}
@media (max-width:980px){ .dish-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:680px){ .dish-grid{ grid-template-columns:1fr; } }

.dish{
  display:flex; flex-direction:column; gap:1.1rem;
  text-align:left;
}
.dish .frame{
  position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:4px;
  background:var(--linen);
}
.dish .frame img{ width:100%; height:100%; object-fit:cover; transition:transform 1.6s var(--ease); }
.dish:hover .frame img{ transform:scale(1.05); }
.dish .num{
  position:absolute; top:1rem; right:1rem;
  font-family:var(--serif); font-style:italic; font-size:1.1rem;
  color:var(--cream); text-shadow:0 2px 10px rgba(0,0,0,.5);
}
.dish h3{ font-size:var(--fs-h4); }
.dish .meta{ font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--smoke); }
.dish p{ color:var(--ink-soft); font-size:15.5px; line-height:1.55; }

/* ---------- Pull Quote / Editorial ---------- */
.pull{
  font-family:var(--serif); font-style:italic;
  font-size:clamp(1.8rem,3.4vw,3rem); line-height:1.18;
  letter-spacing:-.015em; text-wrap:balance;
  color:var(--ink);
}
.theme-night .pull{ color:var(--cream); }
.byline{
  margin-top:1.6rem; font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--smoke);
}
.theme-night .byline{ color:#B8AC8E; }

/* ---------- Event card ---------- */
.event{
  display:grid; grid-template-columns:200px 1fr auto; gap:1.5rem; align-items:center;
  padding:1.6rem 0;
}
.event .date{
  font-family:var(--serif); font-size:clamp(2rem,3vw,2.5rem); line-height:1; letter-spacing:-.02em;
}
.event .date small{ display:block; font-family:var(--sans); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--smoke); margin-top:.5rem; }
.theme-night .event .date small{ color:#B8AC8E; }
.event h3{ font-size:var(--fs-h4); margin-bottom:.4rem; }
.event .where{ font-size:13.5px; letter-spacing:.04em; color:var(--smoke); }
.theme-night .event .where{ color:#B8AC8E; }
.event .status{
  font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--clay);
}
.event .status.sold{ color:var(--smoke); }
@media (max-width:760px){
  .event{ grid-template-columns:1fr; gap:.6rem; padding:1.2rem 0; }
}

/* ---------- Journal cards ---------- */
.journal-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:clamp(1.25rem,2.5vw,2.25rem); }
@media (max-width:980px){ .journal-grid{ grid-template-columns:1fr 1fr; } .journal-grid > article:first-child{ grid-column:1/-1; } }
@media (max-width:620px){ .journal-grid{ grid-template-columns:1fr; } }

.j-card{ display:flex; flex-direction:column; gap:1rem; }
.j-card .frame{ aspect-ratio:4/3; overflow:hidden; border-radius:4px; background:var(--linen); }
.j-card.feature .frame{ aspect-ratio:7/5; }
.j-card .frame img{ width:100%; height:100%; object-fit:cover; transition:transform 1.6s var(--ease); }
.j-card:hover .frame img{ transform:scale(1.05); }
.j-card .cat{ font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--clay); }
.j-card h3{ font-size:var(--fs-h4); }
.j-card.feature h3{ font-size:var(--fs-h3); }
.j-card p{ color:var(--ink-soft); font-size:15px; }
.j-card .reading{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--smoke); }

/* ---------- Subscribe (inline pill) ---------- */
.subscribe{
  display:flex; gap:.4rem; align-items:center;
  background:rgba(255,255,255,.08);
  border-radius:999px;
  padding:.45rem .45rem .45rem 1.4rem;
  max-width:520px;
  transition:background var(--dur) var(--ease);
}
.subscribe:focus-within{ background:rgba(255,255,255,.14); }
.theme-cream .subscribe, .theme-ivory .subscribe, .theme-bone .subscribe{
  background:var(--cream);
  box-shadow:inset 0 0 0 1px rgba(91,107,58,.2);
}
.theme-cream .subscribe:focus-within, .theme-ivory .subscribe:focus-within, .theme-bone .subscribe:focus-within{
  box-shadow:inset 0 0 0 1.5px var(--clay);
}
.subscribe input{
  flex:1; background:transparent; border:0; outline:0;
  font-family:var(--serif); font-size:1.15rem; font-style:italic;
  color:inherit; padding:.7rem 0;
}
.subscribe input::placeholder{ color:rgba(240,228,198,.5); font-style:italic; }
.theme-cream .subscribe input::placeholder, .theme-ivory .subscribe input::placeholder{ color:var(--mist); }
.subscribe button{
  font-size:12px; letter-spacing:.2em; text-transform:uppercase;
  padding:.85rem 1.4rem; border-radius:999px; background:var(--clay); color:var(--cream);
  transition:background var(--dur) var(--ease);
}
.subscribe button:hover{ background:var(--clay-deep); }

/* ---------- Footer ---------- */
.site-footer{ background:var(--night); color:var(--on-night); padding-top:clamp(4rem,8vw,7rem); padding-bottom:2rem; }
.site-footer .top{
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem;
}
@media (max-width:880px){ .site-footer .top{ grid-template-columns:1fr 1fr; gap:2rem; } .site-footer .col-brand{ grid-column:1/-1; } }
.site-footer h6{ font-family:var(--sans); font-weight:500; font-size:11.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:1.2rem; }
.site-footer ul{ list-style:none; padding:0; display:grid; gap:.6rem; font-size:14.5px; color:#D8C9A3; }
.site-footer a:hover{ color:var(--cream); }
.site-footer .col-brand p{ font-family:var(--serif); font-style:italic; font-size:1.3rem; line-height:1.4; color:var(--cream); margin-top:1.2rem; max-width:34ch; }
.site-footer .meta{
  margin-top:clamp(3rem,6vw,5rem); padding-top:1.5rem;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#9E926F;
}
.site-footer .brand .name{ color:var(--cream); }

/* ---------- Tags / Chips ---------- */
.chip{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  padding:.45rem .8rem; border-radius:999px;
  background:rgba(26,18,8,.06); color:var(--ink-soft);
}
.theme-night .chip{ background:rgba(240,228,198,.08); color:#D8C9A3; }
.chip.clay{ background:rgba(194,90,46,.12); color:var(--clay-deep); }

/* ---------- Page header (interior) ---------- */
.page-head{
  position:relative; padding-top:clamp(9rem,16vw,13rem); padding-bottom:clamp(3rem,6vw,5rem);
  background:var(--night); color:var(--cream); overflow:hidden;
}
.page-head .wrap{ position:relative; z-index:2; }
.page-head h1{ color:var(--cream); max-width:18ch; }
.page-head p{ color:#D8C9A3; max-width:54ch; margin-top:1.2rem; }
.page-head .bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  filter:brightness(.45) saturate(.9);
  z-index:0;
}
.page-head::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(20,17,13,.4), rgba(20,17,13,.92));
}

/* ---------- Reveal animation ---------- */
[data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out);
}
[data-reveal].is-in{ opacity:1; transform:none; }
[data-reveal="left"]{ transform:translateX(-28px); }
[data-reveal="left"].is-in{ transform:none; }
[data-reveal="fade"]{ transform:none; }
[data-reveal-delay="1"]{ transition-delay:.08s; }
[data-reveal-delay="2"]{ transition-delay:.16s; }
[data-reveal-delay="3"]{ transition-delay:.24s; }
[data-reveal-delay="4"]{ transition-delay:.32s; }

/* ---------- Forms ---------- */
.field{ display:grid; gap:.5rem; }
.field label{
  font-size:11.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--smoke);
  font-weight:500;
}
.field input, .field select, .field textarea{
  width:100%; padding:1rem 1.1rem;
  min-height:52px;
  background:var(--cream);
  border:1.5px solid transparent;
  border-radius:4px;
  font-family:var(--serif); font-size:17px; color:var(--ink); /* 16px+ to prevent iOS focus zoom */
  outline:0;
  transition:border-color var(--dur) var(--ease), background var(--dur) var(--ease);
  box-shadow:inset 0 0 0 1px rgba(91,107,58,.15);
  -webkit-appearance:none;
  appearance:none;
}
.field input:focus, .field select:focus, .field textarea:focus{
  border-color:var(--clay);
  background:var(--cream);
  box-shadow:inset 0 0 0 1px transparent;
}
.field input::placeholder, .field textarea::placeholder{ color:var(--mist); font-style:italic; }
.field textarea{ resize:vertical; min-height:130px; font-family:var(--sans); font-size:16px; font-style:normal; }
.field select{
  font-family:var(--sans); font-size:16px;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='%23C25A2E' stroke-width='1.6'/></svg>");
  background-repeat:no-repeat;
  background-position:right 1.1rem center;
  background-size:12px;
  padding-right:2.5rem;
}
.theme-night .field input, .theme-night .field textarea, .theme-night .field select{
  color:var(--cream); background:rgba(240,228,198,.06);
  box-shadow:inset 0 0 0 1px rgba(240,228,198,.15);
}
.theme-night .field input::placeholder, .theme-night .field textarea::placeholder{ color:rgba(240,228,198,.4); }
.theme-night .field label{ color:#B8AC8E; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem 1.5rem; }
@media (max-width:680px){ .form-grid{ grid-template-columns:1fr; } }

/* ---------- Decorative ornament ---------- */
.ornament{
  display:inline-flex; align-items:center; gap:.6rem;
  color:var(--clay);
  font-family:var(--serif); font-style:italic; font-size:1.1rem;
}
.ornament .dot{ width:5px; height:5px; border-radius:50%; background:currentColor; display:inline-block; }
.ornament .leaf{ display:inline-block; width:14px; height:14px; background:currentColor; mask:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 21c8 0 18-3 18-18C9 5 3 13 3 21z' fill='black'/></svg>"); -webkit-mask:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 21c8 0 18-3 18-18C9 5 3 13 3 21z' fill='black'/></svg>"); }

/* ---------- Stat row ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
@media (max-width:760px){ .stats{ grid-template-columns:repeat(2,1fr); } }
.stat .n{ font-family:var(--serif); font-size:clamp(2.4rem,4.5vw,3.6rem); line-height:1; letter-spacing:-.02em; color:var(--ink); }
.theme-night .stat .n{ color:var(--cream); }
.stat .l{ margin-top:.6rem; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--smoke); max-width:22ch; }
.theme-night .stat .l{ color:#B8AC8E; }

/* ---------- Tabs (Kitchen menu) ---------- */
.tabs{ display:inline-flex; gap:.4rem; border:1px solid rgba(26,18,8,.15); padding:.4rem; border-radius:999px; background:var(--ivory); }
.tabs button{
  font-size:12px; letter-spacing:.18em; text-transform:uppercase;
  padding:.65rem 1.1rem; border-radius:999px; color:var(--smoke);
  transition:color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.tabs button.active{ background:var(--ink); color:var(--cream); }

.menu-list{ display:grid; gap:1.2rem; }
.menu-row{
  display:grid; grid-template-columns:1fr auto; gap:1.5rem;
  align-items:baseline; padding-block:1.3rem;
}
.menu-row h4{ font-size:var(--fs-h5); margin-bottom:.35rem; }
.menu-row .d{ font-size:14.5px; color:var(--ink-soft); max-width:60ch; }
.menu-row .price{ font-family:var(--serif); font-size:1.35rem; color:var(--clay); white-space:nowrap; }

/* ---------- Misc ---------- */
.kicker{
  font-family:var(--script); color:var(--clay);
  font-size:clamp(1.4rem, 2.2vw, 1.9rem); transform:rotate(-3deg); display:inline-block;
}
.divider-dot{ display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--clay); }
.txt-clay{ color:var(--clay); }
.txt-olive{ color:var(--olive); }
.txt-gold{ color:var(--gold); }
.mt-1{ margin-top:.5rem } .mt-2{ margin-top:1rem } .mt-3{ margin-top:1.5rem } .mt-4{ margin-top:2rem } .mt-5{ margin-top:3rem } .mt-6{ margin-top:4rem }
.mb-1{ margin-bottom:.5rem } .mb-2{ margin-bottom:1rem } .mb-3{ margin-bottom:1.5rem } .mb-4{ margin-bottom:2rem } .mb-5{ margin-bottom:3rem }
.hidden-sm{ display:initial; }
@media (max-width:680px){ .hidden-sm{ display:none; } }

/* ---------- Accessibility ---------- */
:focus-visible{ outline:2px solid var(--clay); outline-offset:3px; border-radius:2px; }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
  .hero-img{ animation:none; }
}

/* ---------- Logo treatments ---------- */
.logo-lg{
  width:clamp(200px, 28vw, 360px); aspect-ratio:1/1; border-radius:50%;
  overflow:hidden; display:block;
  background:var(--ivory);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.55), inset 0 0 0 1px rgba(91,107,58,.35);
}
.logo-lg img{ width:100%; height:100%; object-fit:cover; }
.logo-xl{
  width:clamp(280px, 42vw, 520px); aspect-ratio:1/1; border-radius:50%;
  overflow:hidden; display:block;
  background:var(--ivory);
  box-shadow:0 40px 100px -40px rgba(0,0,0,.5), inset 0 0 0 1px rgba(91,107,58,.35);
}
.logo-xl img{ width:100%; height:100%; object-fit:cover; }

.logo-watermark{
  position:absolute; inset:auto -8% -22% auto;
  width:min(60vw, 720px); aspect-ratio:1/1;
  opacity:.08; pointer-events:none; z-index:0;
}
.logo-watermark img{ width:100%; height:100%; object-fit:contain; }

.brand .mark{
  width:48px; height:48px;
  box-shadow:inset 0 0 0 1.5px rgba(91,107,58,.6), 0 0 0 1px rgba(255,255,255,.08);
}
.site-header.is-light .brand .mark{
  box-shadow:inset 0 0 0 1.5px rgba(91,107,58,.55), 0 1px 0 rgba(26,18,8,.08);
}
.brand .name{ font-size:1.2rem; }
.brand .name em{ color:var(--clay-soft); font-style:italic; padding-inline:.05em; }
.site-header.is-light .brand .name em,
.theme-cream .brand .name em,
.theme-ivory .brand .name em,
.theme-bone .brand .name em{ color:var(--clay); }

/* Hero with logo */
.hero-logo{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem, 6vw, 5rem);
  align-items:center; width:100%;
}
@media (max-width:880px){
  .hero-logo{ grid-template-columns:1fr; text-align:center; }
  .hero-logo .logo-lg{ margin-inline:auto; width:min(70vw, 320px); }
  .hero-meta, .hero-cta{ justify-content:center; }
}

/* Featured / focal block (replaces the old empty-state pattern) */
.empty-state{
  text-align:center; padding:clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 4vw, 3rem);
  background:var(--ivory); border-radius:6px;
  box-shadow:0 30px 80px -40px rgba(26,18,8,.25);
}
.theme-night .empty-state{ background:rgba(240,228,198,.04); box-shadow:none; }
.empty-state .logo-mini{
  width:120px; height:120px; border-radius:50%; overflow:hidden;
  margin:0 auto 1.5rem; background:var(--ivory);
  box-shadow:inset 0 0 0 1.5px rgba(91,107,58,.4);
}
.empty-state .logo-mini img{ width:100%; height:100%; object-fit:cover; }

/* Three pillars */
.pillars{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(1.5rem, 3vw, 3rem);
}
@media (max-width:880px){ .pillars{ grid-template-columns:1fr; } }
.pillar{
  display:flex; flex-direction:column; gap:1.1rem;
}
.pillar .pillar-img{
  aspect-ratio:4/5; overflow:hidden; border-radius:4px; background:var(--linen);
  position:relative;
}
.pillar .pillar-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.6s var(--ease); }
.pillar:hover .pillar-img img{ transform:scale(1.04); }
.pillar .num{
  position:absolute; top:1rem; right:1.1rem;
  font-family:var(--serif); font-style:italic; font-size:1.1rem;
  color:var(--cream); text-shadow:0 2px 10px rgba(0,0,0,.5);
}
.pillar h3{ font-size:var(--fs-h4); }
.pillar p{ color:var(--ink-soft); font-size:15.5px; }

/* Section anchor mark — small logo motif */
.section-anchor{
  width:64px; height:64px; border-radius:50%; overflow:hidden;
  margin:0 auto 1.5rem; background:var(--ivory);
  box-shadow:inset 0 0 0 1.2px rgba(91,107,58,.4);
}
.section-anchor img{ width:100%; height:100%; object-fit:cover; }

/* ---------- FAQ accordion ---------- */
.faq{
  display:grid; gap:.6rem;
}
.faq details{
  background:var(--ivory);
  border-radius:6px;
  padding:1.5rem 1.75rem;
  transition:background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.faq details:hover{ background:var(--cream); }
.faq details[open]{
  background:var(--cream);
  box-shadow:0 20px 50px -30px rgba(26,18,8,.18);
}
.faq summary{
  cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  font-family:var(--serif); font-size:clamp(1.15rem, 1.6vw, 1.4rem);
  letter-spacing:-.005em; color:var(--ink); line-height:1.3;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary .toggle{
  flex:none; width:28px; height:28px; border-radius:50%;
  background:var(--clay); color:var(--cream);
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-size:1.1rem; line-height:1;
  transition:transform var(--dur) var(--ease), background var(--dur) var(--ease);
}
.faq details[open] summary .toggle{
  transform:rotate(45deg); background:var(--olive);
}
.faq .answer{
  padding-top:1rem;
  font-size:15.5px; line-height:1.65;
  color:var(--ink-soft); max-width:64ch;
}

/* Booking flow steps */
.flow{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(1rem, 2vw, 1.5rem);
}
@media (max-width:980px){ .flow{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .flow{ grid-template-columns:1fr; } }
.flow .step{
  background:var(--ivory);
  border-radius:6px;
  padding:1.6rem 1.4rem;
  position:relative;
}
.theme-night .flow .step{ background:rgba(240,228,198,.05); }
.flow .step .n{
  font-family:var(--serif); font-style:italic; font-size:1.7rem; color:var(--clay);
  display:block; line-height:1; margin-bottom:.85rem;
}
.flow .step h4{ font-size:var(--fs-h5); margin-bottom:.5rem; }
.flow .step p{ font-size:14.5px; color:var(--ink-soft); line-height:1.55; }
.theme-night .flow .step p{ color:#C9C1A6; }
.flow .step.is-future{
  background:transparent;
  box-shadow:inset 0 0 0 1.5px rgba(91,107,58,.25);
}
.flow .step.is-future .n{ color:var(--olive); }
.flow .step .future-tag{
  position:absolute; top:1rem; right:1rem;
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--olive); background:rgba(91,107,58,.12);
  padding:.25rem .55rem; border-radius:999px;
}

/* Event Guidelines */
.guidelines{
  display:grid; grid-template-columns:1fr 1fr; gap:1rem 2.5rem;
}
@media (max-width:760px){ .guidelines{ grid-template-columns:1fr; } }
.guideline{
  display:grid; grid-template-columns:auto 1fr; gap:1rem; align-items:start;
  padding:1.1rem 0;
}
.guideline .check{
  width:34px; height:34px; flex:none; border-radius:50%;
  background:rgba(91,107,58,.12); color:var(--olive);
  display:inline-flex; align-items:center; justify-content:center;
}
.guideline .text strong{
  font-family:var(--serif); font-size:1.1rem; font-weight:500; color:var(--ink); display:block;
  letter-spacing:-.005em;
}
.guideline .text p{
  margin-top:.3rem; font-size:14.5px; color:var(--ink-soft); line-height:1.55;
}

/* Documentation Checklist */
.docs-checklist{
  background:var(--ivory);
  border-radius:8px;
  padding:clamp(1.75rem, 3vw, 2.5rem);
  box-shadow:0 30px 80px -50px rgba(26,18,8,.18);
}
.docs-checklist .head{
  display:flex; align-items:center; gap:.8rem; margin-bottom:1.25rem; flex-wrap:wrap;
}
.docs-checklist .head .badge{
  font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  background:rgba(91,107,58,.14); color:var(--olive-deep);
  padding:.4rem .75rem; border-radius:999px;
}
.docs-checklist > h3{ font-size:var(--fs-h4); margin-bottom:.4rem; }
.docs-checklist > p{ color:var(--ink-soft); font-size:15px; margin-bottom:1.25rem; }
.docs-checklist ol{
  list-style:none; padding:0; display:grid; gap:.25rem;
}
.docs-checklist li{
  display:grid; grid-template-columns:auto 1fr; gap:1rem; align-items:center;
  padding:1rem 0;
}
.docs-checklist li .tick{
  width:30px; height:30px; border-radius:50%;
  background:var(--cream);
  box-shadow:inset 0 0 0 1.5px var(--olive);
  color:var(--olive); display:inline-flex; align-items:center; justify-content:center;
  flex:none;
}
.docs-checklist li .label{
  font-family:var(--serif); font-size:1.1rem; color:var(--ink); display:block;
  letter-spacing:-.005em;
}
.docs-checklist li .note{
  font-size:13px; color:var(--smoke); margin-top:.2rem;
}
.docs-checklist .footer-note{
  margin-top:1.5rem; padding-top:1rem;
  font-size:13.5px; color:var(--ink-soft); max-width:58ch; line-height:1.55;
}
.docs-checklist .footer-note strong{ color:var(--ink); font-weight:500; }

/* Receive-after section */
.receive{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(1rem, 2vw, 2rem);
}
@media (max-width:880px){ .receive{ grid-template-columns:1fr; } }
.receive .item{ padding:1.5rem 0; }
.receive .item .icon{
  width:42px; height:42px; border-radius:50%;
  background:rgba(194,90,46,.12); color:var(--clay);
  display:inline-flex; align-items:center; justify-content:center;
  margin-bottom:1rem;
}
.receive .item h5{ font-size:var(--fs-h6); margin-bottom:.4rem; }
.receive .item p{ font-size:14.5px; color:var(--ink-soft); }

/* Form card */
.form-card{
  background:var(--ivory);
  border-radius:8px;
  padding:clamp(2rem, 4vw, 3.5rem);
  box-shadow:0 40px 100px -50px rgba(26,18,8,.3);
}
.form-card .section-anchor{ margin:0 0 1.5rem; }
.form-card h2{ margin-bottom:.5rem; }
.form-section{ margin-bottom:2.5rem; }
.form-section:last-of-type{ margin-bottom:0; }
.form-section-label{
  font-size:11.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--smoke); margin-bottom:1.25rem;
  display:flex; align-items:center; gap:.7rem;
}
.form-section-label .n{
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; border-radius:50%;
  background:var(--clay); color:var(--cream);
  font-family:var(--serif); font-style:italic; font-size:13px; letter-spacing:0;
}

/* Required marker */
.field label .req{ color:var(--clay); margin-left:.2em; }

/* Event Guidelines acknowledgement in booking form */
.guidelines-agree{
  background:rgba(91,107,58,.06);
  border-left:3px solid var(--olive);
  border-radius:6px;
  padding:1.5rem 1.6rem;
}
.guidelines-agree .agree-intro{
  font-size:14.5px; color:var(--ink-soft); margin:0 0 1rem;
  max-width:56ch;
}
.guidelines-agree .agree-list{
  list-style:none; padding:0; margin:0 0 1.25rem;
  display:grid; gap:.4rem;
  font-size:14.5px; color:var(--ink);
}
.guidelines-agree .agree-list li{
  position:relative; padding-left:1.4rem; line-height:1.55;
}
.guidelines-agree .agree-list li::before{
  content:"·";
  position:absolute; left:.4rem; top:-.05em;
  color:var(--olive); font-weight:700; font-size:1.4em;
}
.guidelines-agree .agree-check{
  display:grid; grid-template-columns:auto 1fr; gap:.85rem;
  align-items:flex-start; padding:.9rem 1rem;
  background:rgba(255,255,255,.6); border-radius:5px;
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease);
}
.guidelines-agree .agree-check:hover{ background:rgba(255,255,255,.9); }
.guidelines-agree .agree-check input[type="checkbox"]{
  width:22px; height:22px; margin-top:.1rem; flex:none;
  accent-color:var(--clay); cursor:pointer;
}
.guidelines-agree .agree-check span{
  font-size:14.5px; line-height:1.5; color:var(--ink);
}
.guidelines-agree .agree-check a{
  color:var(--clay); border-bottom:1.5px solid currentColor;
}

/* Mobile refinements for the agreement block */
@media (max-width:600px){
  .guidelines-agree{ padding:1.25rem 1.1rem; }
  .guidelines-agree .agree-check{ padding:.85rem; }
}

/* Suppress scroll cue if any HTML still has it */
.scroll-cue{ display:none !important; }

/* ---------- Mobile refinements ---------- */
@media (max-width:600px){
  :root{ --gutter: 1.4rem; }
  .section{ padding-block:clamp(3rem, 8vw, 4.5rem); }
  .section-lg{ padding-block:clamp(4rem, 10vw, 6rem); }
  .section-sm{ padding-block:clamp(2rem, 6vw, 3rem); }

  /* Header — keep tight on narrow phones */
  .site-header{ padding:.85rem 0; }
  .site-header.is-scrolled{ padding:.55rem 0; }
  .brand .mark{ width:42px; height:42px; }
  .brand .name{ font-size:1.05rem; }

  /* Footer — full stack on narrow phones */
  .site-footer .top{ grid-template-columns:1fr !important; gap:2.25rem; }
  .site-footer .col-brand{ grid-column:auto !important; }
  .site-footer .meta{ flex-direction:column; align-items:flex-start; gap:.6rem; }

  /* Form card breathing room */
  .form-card{ padding:1.75rem 1.25rem; }
  .form-section{ margin-bottom:2rem; }

  /* FAQ on mobile */
  .faq details{ padding:1.25rem 1.4rem; }
  .faq summary{ font-size:1.1rem; gap:.8rem; }
  .faq .answer{ font-size:15px; padding-top:.85rem; }

  /* Guidelines */
  .guideline{ padding:.85rem 0; gap:.85rem; }
  .guideline .check{ width:30px; height:30px; }

  /* Documentation checklist */
  .docs-checklist{ padding:1.5rem 1.25rem; }
  .docs-checklist li{ padding:.85rem 0; gap:.85rem; }
  .docs-checklist li .label{ font-size:1.05rem; }

  /* Hero CTAs stack nicely */
  .hero-cta{ gap:.6rem; flex-direction:column; align-items:stretch; }
  .hero-cta .btn{ justify-content:center; }

  /* Page-head paddings */
  .page-head{ padding-top:clamp(7rem, 18vw, 9rem); padding-bottom:clamp(2.5rem, 6vw, 4rem); }

  /* Lead paragraphs slightly tighter */
  .lead{ font-size:17px; }

  /* Marquee a touch smaller */
  .marquee .track{ font-size:1.3rem; gap:2rem; }
  .marquee .track span{ gap:2rem; }
}

@media (max-width:380px){
  .brand .name{ display:none; }   /* keep just the mark on tiny phones, room for menu */
}

/* Bigger tap targets for inline nav links on small screens */
@media (max-width:880px){
  .drawer a{ padding:.7rem 0; }
}

/* Force inline two-column grids to stack on phones */
@media (max-width:760px){
  main .grid[style*="grid-template-columns:"]{
    grid-template-columns:1fr !important;
    gap:2rem !important;
  }
}

/* iOS Safari address bar safe area */
@supports(padding:max(0px)){
  .site-header{ padding-left:max(0px, env(safe-area-inset-left)); padding-right:max(0px, env(safe-area-inset-right)); }
  .hero{ padding-left:max(var(--gutter), env(safe-area-inset-left)); padding-right:max(var(--gutter), env(safe-area-inset-right)); }
}

/* ---------- Print friendly ---------- */
@media print{
  .site-header,.site-footer,.menu-toggle,.drawer{ display:none !important; }
}
