/* ============================================================
   Hendersons — pitch build · SOMETHINGCOOL
   Botanical heritage-modern. Light-native (clay cream), with a
   deep-forest inverse surface. Tokens per design-system.md.
   ============================================================ */

:root{
  --paper:     #F2EADD;
  --paper-2:   #EAE0CF;
  --ink:       #2B2A24;
  --ink-soft:  rgba(43,42,36,.68);
  --ink-faint: rgba(43,42,36,.45);
  --pri:       #3A4A42;
  --pri-hover: #2E3B34;
  --forest:    #26302B;
  --forest-2:  #2E3A33;
  --clay:      #B79274;
  --clay-deep: #8C6244;
  --hairline:  rgba(43,42,36,.14);
  --hairline-2:rgba(43,42,36,.08);
  --rule-clay: rgba(183,146,116,.42);
  --cream-soft: rgba(242,234,221,.72);
  --cream-faint: rgba(242,234,221,.5);

  --display: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  --body: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --ease: cubic-bezier(.22,.61,.2,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.62;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{ background:var(--pri); color:var(--paper); }

img,svg{ display:block; max-width:100%; }
a{ color:var(--ink); text-underline-offset:3px; }
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--pri); outline-offset:3px;
}

/* Layout ------------------------------------------------------ */
.wrap{ max-width:1180px; margin:0 auto; padding-left:26px; padding-right:26px; }
/* vertical padding never on .wrap — specificity trap (brain/patterns) */
section{ position:relative; }
.section-pad{ padding-top:clamp(74px,11vw,152px); padding-bottom:clamp(74px,11vw,152px); }

.label{
  font-family:var(--body);
  font-size:11.5px; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase;
  color:var(--pri);
  margin:0 0 22px;
  display:inline-flex; align-items:center; gap:12px;
}
.label::before{ content:""; width:26px; height:1px; background:var(--clay); flex:none; }
.forest .label{ color:var(--clay); }
.forest .label::before{ background:var(--clay); }

h1,h2,h3,h4{ font-family:var(--display); font-weight:600; margin:0; color:var(--ink); }
.forest h1,.forest h2,.forest h3,.forest h4{ color:var(--paper); }
.display{ font-weight:600; line-height:1.0; letter-spacing:-.015em; }
h2.display{ font-size:clamp(2.05rem,4.4vw,3.5rem); margin-bottom:26px; }
.lede{ font-size:clamp(1.06rem,1.55vw,1.26rem); color:var(--ink-soft); max-width:36em; line-height:1.55; }
.forest .lede{ color:var(--cream-soft); }
p strong{ font-weight:600; color:var(--ink); }
.forest p strong{ color:var(--paper); }

/* Buttons ------------------------------------------------------ */
.btn{
  display:inline-block;
  font-family:var(--body); font-size:12px; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  padding:16px 30px 14px;
  background:var(--pri); color:var(--paper);
  text-decoration:none; border:1px solid var(--pri);
  cursor:pointer; border-radius:2px;
  transition:background .35s var(--ease), color .35s var(--ease), transform .35s var(--ease), border-color .35s var(--ease);
}
.btn:hover{ background:var(--pri-hover); border-color:var(--pri-hover); transform:translateY(-2px); }
.btn-ghost{
  background:transparent; color:var(--ink);
  border:1px solid var(--rule-clay);
}
.btn-ghost:hover{ background:transparent; border-color:var(--ink); color:var(--ink); transform:translateY(-2px); }
.forest .btn{ background:var(--paper); color:var(--forest); border-color:var(--paper); }
.forest .btn:hover{ background:var(--clay); border-color:var(--clay); color:var(--forest); }
.forest .btn-ghost{ background:transparent; color:var(--paper); border-color:rgba(242,234,221,.34); }
.forest .btn-ghost:hover{ border-color:var(--paper); color:var(--paper); }
.cta-row{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }

/* Demo honesty tag -------------------------------------------- */
.demo-tag{
  display:inline-flex; align-items:center; gap:8px;
  font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--paper); background:var(--pri);
  border-radius:999px; padding:6px 14px 5px; vertical-align:middle;
}
.demo-tag::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--clay); }
.forest .demo-tag{ background:var(--paper); color:var(--forest); }

/* Nav ---------------------------------------------------------- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  background:rgba(242,234,221,.82);
  -webkit-backdrop-filter:blur(14px) saturate(1.1); backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid var(--hairline);
}
.nav-inner{
  max-width:1260px; margin:0 auto; padding:0 26px;
  height:72px; display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.nav-mark{
  font-family:var(--display); font-weight:600; font-size:1.42rem; line-height:1;
  color:var(--ink); text-decoration:none; letter-spacing:-.01em;
}
.nav-mark span{ color:var(--clay-deep); }
.nav-links{ display:flex; align-items:center; gap:32px; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-size:12px; font-weight:500; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-soft); text-decoration:none;
  transition:color .3s var(--ease);
}
.nav-links a:hover{ color:var(--ink); }
.nav-links a[aria-current="page"]{ color:var(--pri); }
.nav .btn{ padding:11px 22px 9px; font-size:11px; }
.nav-burger{
  display:none; background:none; border:0; cursor:pointer; padding:10px;
  width:44px; height:44px;
}
.nav-burger span{
  display:block; width:24px; height:2px; background:var(--ink);
  margin:5px auto; transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.nav.open .nav-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav.open .nav-burger span:nth-child(2){ opacity:0; }
.nav.open .nav-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width: 900px){
  .nav-links{
    position:fixed; top:72px; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--paper); border-bottom:1px solid var(--hairline);
    padding:12px 26px 28px;
    transform:translateY(-8px); opacity:0; visibility:hidden; pointer-events:none;
    transition:transform .35s var(--ease), opacity .35s var(--ease), visibility 0s .35s;
  }
  .nav.open .nav-links{
    transform:translateY(0); opacity:1; visibility:visible; pointer-events:auto;
    transition:transform .35s var(--ease), opacity .35s var(--ease);
  }
  .nav-links li{ width:100%; border-bottom:1px solid var(--hairline); }
  .nav-links li:last-child{ border-bottom:0; }
  .nav-links a{ display:block; padding:18px 2px; font-size:13px; letter-spacing:.1em; }
  .nav-burger{ display:block; }
}
@media (max-width: 520px){
  .nav-mark{ font-size:1.22rem; }
  .nav .btn{ padding:10px 15px 9px; font-size:10px; letter-spacing:.14em; }
  .nav-inner{ gap:12px; }
}

/* Photography — their real imagery, graded warm ---------------- */
.photo{
  position:relative; overflow:hidden; margin:0;
  border:1px solid var(--hairline-2); background:var(--paper-2);
  border-radius:3px;
}
.photo img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(1.02) contrast(1.02);
  transition:transform .8s var(--ease);
}
.photo figcaption{
  position:absolute; left:18px; right:18px; bottom:15px; z-index:1;
  font-family:var(--body); font-size:10.5px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--paper);
  text-shadow:0 1px 12px rgba(0,0,0,.5);
}
.photo.cap::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top, rgba(38,48,43,.5), transparent 42%);
}
/* Arched frame — echo of the mural arch */
.photo.arch{ border-radius:1000px 1000px 6px 6px / 320px 320px 6px 6px; }
.r43{ aspect-ratio:4/3; } .r32{ aspect-ratio:3/2; }
.r45{ aspect-ratio:4/5; } .r219{ aspect-ratio:21/9; } .r11{ aspect-ratio:1/1; }
.photo-row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,2.5vw,26px); }
@media (max-width:700px){ .photo-row{ grid-template-columns:1fr; } .r219{ aspect-ratio:16/10; } }

/* Hero --------------------------------------------------------- */
.hero{
  min-height:100svh; display:flex; align-items:flex-end;
  padding-top:132px; padding-bottom:clamp(48px,7vw,84px);
  overflow:hidden;
}
.hero-bg{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; }
.hero-bg::after{ /* warm wash — paper type holds ≥AA over the photo */
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(28,32,28,.86) 0%, rgba(30,36,31,.42) 42%, rgba(30,36,31,.22) 72%, rgba(30,36,31,.4) 100%);
}
.hero-inner{ position:relative; z-index:2; width:100%; }
.hero .label{ color:var(--paper); }
.hero .label::before{ background:var(--clay); }
.hero-badges{ display:flex; align-items:center; gap:20px; margin:0 0 26px; flex-wrap:wrap; }
.hero-badges img{ height:clamp(64px,9vw,96px); width:auto; }
.hero-mark{
  font-family:var(--display); font-weight:600;
  font-size:clamp(3.2rem,11vw,8.2rem); line-height:.92; letter-spacing:-.02em;
  color:var(--paper); margin:0 0 20px;
}
.hero-tagline{
  font-family:var(--display); font-weight:400;
  font-size:clamp(1.2rem,2.3vw,1.7rem); color:var(--paper);
  letter-spacing:.02em; margin:0 0 14px;
}
.hero-sub{ font-size:clamp(1rem,1.5vw,1.16rem); color:var(--cream-soft); max-width:34em; margin:0 0 34px; }
.hero .cta-row .btn-ghost{ background:transparent; color:var(--paper); border-color:rgba(242,234,221,.4); }
.hero .cta-row .btn-ghost:hover{ background:transparent; border-color:var(--paper); color:var(--paper); }
.hero .btn{ background:var(--paper); color:var(--forest); border-color:var(--paper); }
.hero .btn:hover{ background:var(--clay); border-color:var(--clay); color:var(--forest); }
.awards-line{
  display:flex; flex-wrap:wrap; gap:10px 0; align-items:center;
  font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--cream-faint); margin:38px 0 0; padding:0; list-style:none;
}
.awards-line li{ display:flex; align-items:center; }
.awards-line li + li::before{ content:""; width:5px; height:5px; border-radius:50%; background:var(--clay); margin:0 16px; }

/* Marquee ------------------------------------------------------ */
.marquee{
  background:var(--forest); color:var(--paper);
  border-top:1px solid var(--forest-2); border-bottom:1px solid var(--forest-2);
  padding:24px 0; overflow:hidden; white-space:nowrap;
}
.marquee-track{ display:inline-flex; animation:marquee 48s linear infinite; will-change:transform; }
.marquee-seq{
  display:inline-flex; align-items:center;
  font-family:var(--display); font-weight:500;
  font-size:clamp(1.15rem,2.1vw,1.65rem); color:var(--paper); letter-spacing:.005em;
}
.marquee-seq span{ padding:0 .1em; display:inline-flex; align-items:center; }
.marquee-seq span::after{ content:""; width:6px; height:6px; border-radius:50%; background:var(--clay); margin:0 1.1em; opacity:.9; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee-track{ animation:none; } }

/* Split & feature list ----------------------------------------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,92px); align-items:start; }
.split.center{ align-items:center; }
@media (max-width:900px){ .split{ grid-template-columns:1fr; } }
.copy p{ color:var(--ink-soft); margin:0 0 1.2em; max-width:36em; }
.forest .copy p{ color:var(--cream-soft); }

.feature-list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--hairline); }
.feature-list li{
  display:flex; justify-content:space-between; align-items:baseline; gap:20px;
  padding:19px 2px; border-bottom:1px solid var(--hairline);
}
.feature-list .f-name{ font-family:var(--display); font-weight:500; font-size:1.16rem; color:var(--ink); }
.feature-list .f-note{ font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--clay-deep); text-align:right; }
.forest .feature-list{ border-color:rgba(242,234,221,.16); }
.forest .feature-list li{ border-color:rgba(242,234,221,.16); }
.forest .feature-list .f-name{ color:var(--paper); }
.forest .feature-list .f-note{ color:var(--clay); }

/* Alt surfaces ------------------------------------------------- */
.paper-2{ background:var(--paper-2); }
.forest{ background:var(--forest); color:var(--paper); }
.forest a{ color:var(--paper); }
.forest p{ color:var(--cream-soft); }
.forest .kindly{ color:var(--cream-soft); }

/* Menu / dish lists (NO prices — house rule) ------------------- */
.menu-course{ margin-top:clamp(46px,6vw,74px); }
.menu-course:first-of-type{ margin-top:0; }
.course-head{
  font-family:var(--display); font-weight:600; font-size:clamp(1.5rem,2.5vw,2.1rem);
  color:var(--ink); margin-bottom:6px; letter-spacing:-.01em;
}
.course-sub{ font-family:var(--body); color:var(--ink-soft); margin:0 0 20px; font-size:1rem; }
.dish-list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--hairline); }
.dish{ padding:20px 2px; border-bottom:1px solid var(--hairline); }
.dish-name{ font-family:var(--display); font-weight:500; font-size:clamp(1.12rem,1.7vw,1.32rem); color:var(--ink); }
.dish-name .tag{
  font-family:var(--body); font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--pri); border:1px solid var(--rule-clay); border-radius:999px;
  padding:2px 9px 1px; margin-left:10px; vertical-align:middle; white-space:nowrap;
}
.dish-chain{ display:block; font-family:var(--body); font-size:.95rem; font-weight:400; color:var(--ink-soft); margin-top:6px; }
.kindly{ font-family:var(--body); font-style:italic; color:var(--ink-soft); font-size:1rem; max-width:40em; }

/* Teaser cards ------------------------------------------------- */
.tease-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--hairline); border:1px solid var(--hairline); border-radius:4px; overflow:hidden; }
@media (max-width:900px){ .tease-grid{ grid-template-columns:1fr; } }
.tease{
  background:var(--paper); padding:clamp(28px,3.2vw,44px);
  display:flex; flex-direction:column; gap:14px; min-height:300px;
  text-decoration:none; transition:background .4s var(--ease);
}
.tease:hover{ background:var(--paper-2); }
.tease .photo{ margin:-4px 0 8px; aspect-ratio:16/10; }
.tease:hover .photo img{ transform:scale(1.045); }
.tease h3{ font-size:clamp(1.42rem,2.1vw,1.85rem); font-weight:600; line-height:1.08; color:var(--ink); }
.tease p{ color:var(--ink-soft); margin:0; font-size:.97rem; flex-grow:1; }
.tease .go{ font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--pri); }
.tease .go::after{ content:"→"; margin-left:10px; transition:margin .3s var(--ease); }
.tease:hover .go::after{ margin-left:16px; }

/* Big pull ----------------------------------------------------- */
.pull{
  font-family:var(--display); font-weight:500;
  font-size:clamp(1.7rem,3.6vw,2.9rem); line-height:1.2; letter-spacing:-.01em;
  max-width:20em; margin:0 0 30px; color:var(--ink);
}
.forest .pull{ color:var(--paper); }
.pull em{ color:var(--clay-deep); font-style:normal; }
.forest .pull em{ color:var(--clay); }

/* Press -------------------------------------------------------- */
.press-quote{
  font-family:var(--display); font-weight:400;
  font-size:clamp(1.35rem,2.7vw,2.15rem); line-height:1.32; max-width:24em; margin:0; color:var(--ink);
}
.forest .press-quote{ color:var(--paper); }
.press-cite{ display:block; margin-top:22px; font-family:var(--body); font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--clay-deep); }
.forest .press-cite{ color:var(--clay); }

/* Awards wall -------------------------------------------------- */
.awards-wall{ list-style:none; margin:0; padding:0; border-top:1px solid var(--hairline); }
.awards-wall li{ display:flex; justify-content:space-between; align-items:baseline; gap:24px; padding:24px 2px; border-bottom:1px solid var(--hairline); }
.awards-wall .a-name{ font-family:var(--display); font-weight:500; font-size:clamp(1.2rem,1.9vw,1.55rem); color:var(--ink); }
.awards-wall .a-year{ font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--clay-deep); white-space:nowrap; }
.forest .awards-wall,.forest .awards-wall li{ border-color:rgba(242,234,221,.16); }
.forest .awards-wall .a-name{ color:var(--paper); }
.forest .awards-wall .a-year{ color:var(--clay); }

/* Forms -------------------------------------------------------- */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:640px){ .form-grid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:9px; }
.field.full{ grid-column:1 / -1; }
.field label{ font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); }
.field input, .field select, .field textarea{
  background:var(--paper); border:1px solid var(--rule-clay);
  color:var(--ink); font-family:var(--body); font-size:16px;
  padding:14px 15px; border-radius:2px; width:100%;
  transition:border-color .3s var(--ease);
}
.field input::placeholder, .field textarea::placeholder{ color:var(--ink-faint); }
.field input:hover, .field select:hover, .field textarea:hover{ border-color:var(--ink-soft); }
.field select{ appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%, calc(100% - 15px) 55%; background-size:5px 5px; background-repeat:no-repeat;
}
/* forest-surface forms flip to cream fields */
.forest .field label{ color:var(--cream-soft); }
.forest .field input, .forest .field select, .forest .field textarea{
  background:var(--forest-2); border-color:rgba(242,234,221,.24); color:var(--paper);
}
.forest .field input::placeholder, .forest .field textarea::placeholder{ color:var(--cream-faint); }
.forest .field input:hover, .forest .field select:hover, .forest .field textarea:hover{ border-color:var(--clay); }
.forest .field select{
  background-image:linear-gradient(45deg,transparent 50%,var(--paper) 50%),linear-gradient(135deg,var(--paper) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%, calc(100% - 15px) 55%; background-size:5px 5px; background-repeat:no-repeat;
}
.form-success{ border:1px solid var(--clay); padding:32px 30px; display:none; border-radius:3px; }
.form-success.show{ display:block; }
.form-success h3{ font-size:1.55rem; margin-bottom:12px; }
.form-success p{ color:var(--ink-soft); margin:0; }
.forest .form-success{ border-color:var(--clay); }
.forest .form-success p{ color:var(--cream-soft); }

/* Email band --------------------------------------------------- */
.email-band-inner{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(32px,5vw,80px); align-items:center; }
@media (max-width:900px){ .email-band-inner{ grid-template-columns:1fr; } }
.email-form{ display:flex; gap:0; }
.email-form input{
  flex:1; background:var(--forest-2); border:1px solid rgba(242,234,221,.24); border-right:0;
  color:var(--paper); font-family:var(--body); font-size:16px; padding:16px 18px; border-radius:2px 0 0 2px; min-width:0;
}
.email-form input::placeholder{ color:var(--cream-faint); }
.email-form .btn{ white-space:nowrap; border-radius:0 2px 2px 0; }
@media (max-width:480px){ .email-form{ flex-direction:column; gap:14px; } .email-form input{ border-right:1px solid rgba(242,234,221,.24); border-radius:2px; } .email-form .btn{ border-radius:2px; } }

/* Info cards (hours / find us) --------------------------------- */
.info-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--hairline); border:1px solid var(--hairline); border-radius:4px; overflow:hidden; }
@media (max-width:760px){ .info-grid{ grid-template-columns:1fr; } }
.info-card{ background:var(--paper); padding:clamp(26px,3vw,40px); }
.info-card h4{ font-family:var(--body); font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--clay-deep); margin:0 0 16px; }
.info-card p, .info-card li{ color:var(--ink-soft); font-size:.98rem; margin:0 0 6px; list-style:none; }
.info-card ul{ margin:0; padding:0; }
.info-card a{ text-decoration:none; }
.info-card a:hover{ text-decoration:underline; }

/* Page headers (subpages) -------------------------------------- */
.page-head{ padding-top:clamp(148px,20vh,216px); padding-bottom:clamp(46px,7vw,80px); }
.page-head h1{ font-size:clamp(2.6rem,6.5vw,5rem); font-weight:600; line-height:1; letter-spacing:-.02em; margin:0 0 22px; }
.page-head.forest{ position:relative; overflow:hidden; }

/* Footer ------------------------------------------------------- */
footer{ background:var(--forest); color:var(--paper); }
.foot-grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:clamp(32px,4vw,64px); padding-top:clamp(56px,7vw,88px); padding-bottom:clamp(40px,5vw,60px); }
@media (max-width:900px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .foot-grid{ grid-template-columns:1fr; } }
.foot-mark{ font-family:var(--display); font-weight:600; font-size:2rem; line-height:1; margin:0 0 16px; color:var(--paper); letter-spacing:-.01em; }
.foot-mark span{ color:var(--clay); }
.foot-tag{ color:var(--cream-soft); font-size:.9rem; max-width:24em; }
.foot-grid p, .foot-grid li{ color:var(--cream-soft); font-size:.92rem; }
.foot-grid h4{ font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--clay); margin:0 0 16px; }
.foot-grid ul{ list-style:none; margin:0; padding:0; }
.foot-grid ul li{ margin-bottom:10px; }
.foot-grid a{ text-decoration:none; color:var(--cream-soft); }
.foot-grid a:hover{ text-decoration:underline; color:var(--paper); }
.foot-bottom{ border-top:1px solid rgba(242,234,221,.16); padding-top:24px; padding-bottom:30px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:11px; letter-spacing:.1em; color:var(--cream-faint); }

/* Reveal system (transform+opacity ONLY) ----------------------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .68s var(--ease), transform .68s var(--ease); will-change:opacity,transform; }
.reveal.in{ opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.1s; }
.reveal[data-delay="2"]{ transition-delay:.2s; }
.reveal[data-delay="3"]{ transition-delay:.3s; }
.reveal[data-delay="4"]{ transition-delay:.4s; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .btn, .tease .go::after, .photo img, .tease:hover .photo img{ transition:none; transform:none; }
}
.noanim .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }

/* ============================================================
   Hub (pitch package page) — the walk-in link
   ============================================================ */
.nav-x{
  font-family:var(--body);
  font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--clay-deep); white-space:nowrap;
}
.forest .nav-x{ color:var(--clay); }

/* Hub head — forest surface, arched-mural motif */
.hub-head{
  background:var(--forest); color:var(--paper); overflow:hidden;
  padding-top:clamp(150px,22vh,232px); padding-bottom:clamp(60px,9vw,110px);
}
.hub-head::before{ /* arched wash — echo of the mural arch */
  content:""; position:absolute; top:-8%; left:50%; transform:translateX(-50%);
  width:min(760px,96vw); height:150%;
  background:radial-gradient(60% 42% at 50% 0%, rgba(183,146,116,.24), transparent 68%);
  pointer-events:none;
}
.hub-head .wrap{ position:relative; z-index:1; }
.hub-head h1{
  font-family:var(--display); font-weight:600; color:var(--paper);
  font-size:clamp(2.8rem,8vw,5.9rem); line-height:.96; letter-spacing:-.02em;
  margin:0 0 28px;
}
.hub-head .lede{ color:var(--cream-soft); max-width:38em; }
.hub-badge{
  display:inline-flex; align-items:center; gap:14px;
  margin-top:clamp(34px,5vw,52px);
  border:1px solid rgba(242,234,221,.22); border-radius:6px;
  padding:12px 18px 12px 14px; background:rgba(242,234,221,.04);
}
.hub-badge img{ height:52px; width:auto; }
.hub-badge span{
  font-family:var(--body); font-size:10.5px; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; line-height:1.4; color:var(--cream-soft);
}
.hub-badge span b{ display:block; color:var(--paper); letter-spacing:.06em; }

/* Video slot — the Loom, over a real Hendersons photo */
.hub-video .lede{ margin-bottom:clamp(30px,4vw,48px); }
.video-slot{
  position:relative; display:block; overflow:hidden;
  aspect-ratio:16/9; border:1px solid var(--hairline); background:var(--forest);
  text-decoration:none; border-radius:4px;
}
@media (max-width:640px){ .video-slot{ aspect-ratio:4/3; } }
.video-slot > img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(1) contrast(1.03) brightness(.72);
  transition:transform .7s var(--ease);
}
.video-slot::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 50% 56%, rgba(26,32,26,.22), rgba(26,32,26,.66) 82%);
}
.video-face{
  position:absolute; inset:0; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:18px; text-align:center; padding:24px;
}
.play-ring{
  width:clamp(74px,10vw,98px); height:clamp(74px,10vw,98px);
  border:1px solid var(--clay); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(26,32,26,.32);
  transition:transform .4s var(--ease), background .4s var(--ease);
}
.play-ring::before{
  content:""; display:block; margin-left:6px;
  border-style:solid; border-width:11px 0 11px 18px;
  border-color:transparent transparent transparent var(--paper);
}
a.video-slot:hover .play-ring{ transform:scale(1.06); background:rgba(26,32,26,.5); }
a.video-slot:hover > img{ transform:scale(1.03); }
.video-note{
  font-family:var(--body); font-size:11px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--paper); max-width:30em;
}
.video-slot .demo-tag{ background:var(--paper); color:var(--forest); }
.video-slot .demo-tag::before{ background:var(--clay); }

/* Package cards — reuse .tease, add a static (non-link) variant */
.hub-cards .tease{ min-height:300px; }
.hub-cards .tease .photo{ aspect-ratio:16/10; }
.tease.static{ cursor:default; }
.tease.static:hover{ background:var(--paper); }
.tease.static:hover .photo img{ transform:none; }
.tease .demo-tag{ align-self:flex-start; }

/* Hub close — forest, arched glow */
.hub-close{ background:var(--forest); color:var(--paper); overflow:hidden; }
.hub-close::before{
  content:""; position:absolute; inset:auto 0 -40% 0; height:120%;
  background:radial-gradient(50% 60% at 50% 100%, rgba(183,146,116,.16), transparent 68%);
  pointer-events:none;
}
.hub-close .wrap{ position:relative; z-index:1; }
.hub-close .lede{ color:var(--cream-soft); }