/* =========================================================
   FIRE & TABLE — design system
   Editorial, flat, photographic. No gradients, no glass,
   no pills, minimal shadow. Magazine, not software.
   ========================================================= */

:root{
  /* Core palette */
  --cream:      #F5EFE3;
  --paper:      #FBF8F1;
  --charcoal:   #1F1F1C;
  --orange:     #B55A32;
  --orange-dk:  #96461F;

  /* Supporting naturals, used sparingly */
  --brown:      #6B4A32;
  --sage:       #6E7359;
  --butcher:    #E4D6BC;
  --iron:       #2A2A26;

  /* Derived */
  --ink:        var(--charcoal);
  --rule:       rgba(31,31,28,.16);
  --rule-strong:rgba(31,31,28,.32);
  --muted:      rgba(31,31,28,.62);
  --on-dark:    #F0E9DC;
  --muted-dark: rgba(240,233,220,.66);
  --rule-dark:  rgba(240,233,220,.22);

  /* Type */
  --display: "Roboto Slab", Clarendon, "Bitter", Georgia, serif;
  --body:    "Archivo", "Helvetica Neue", Arial, sans-serif;

  /* Measure & rhythm */
  --gutter: 20px;
  --max: 1280px;
  --measure: 62ch;
  --section: clamp(64px, 10vw, 148px);

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

@media (min-width: 900px){ :root{ --gutter: 40px; } }

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg,video{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }
h1,h2,h3,h4,p,figure,blockquote{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }

/* Aged-paper texture — deliberately almost invisible */
body::before{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:.5;
  background-image:
    radial-gradient(circle at 18% 22%, rgba(107,74,50,.035), transparent 45%),
    radial-gradient(circle at 82% 78%, rgba(110,115,89,.03), transparent 45%);
}
body > *{ position:relative; z-index:1; }

/* ---------- Typography ---------- */
.display{
  font-family:var(--display);
  font-weight:800;
  line-height:.92;
  letter-spacing:-.02em;
  text-transform:uppercase;
  text-wrap:balance;
}
.d-xxl{ font-size:clamp(2.9rem, 9.5vw, 8.5rem); }
.d-xl { font-size:clamp(2.4rem, 7.2vw, 6rem); }
.d-lg { font-size:clamp(2rem, 5.2vw, 4rem); }
.d-md { font-size:clamp(1.6rem, 3.4vw, 2.6rem); }
.d-sm { font-size:clamp(1.25rem, 2.2vw, 1.7rem); letter-spacing:-.01em; }

.eyebrow{
  font-family:var(--body);
  font-size:clamp(.66rem,1.4vw,.76rem);
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--muted);
}
.eyebrow--orange{ color:var(--orange); }
.on-dark .eyebrow, .eyebrow.on-dark{ color:var(--muted-dark); }

.serif-sub{
  font-family:var(--display);
  font-weight:400;
  font-size:clamp(1.15rem,2.4vw,1.9rem);
  line-height:1.25;
  letter-spacing:-.01em;
  text-transform:none;
}

.lede{
  font-size:clamp(1.05rem,1.9vw,1.3rem);
  line-height:1.6;
  max-width:var(--measure);
}
.copy{ max-width:var(--measure); }
.copy p + p{ margin-top:1.1em; }
.muted{ color:var(--muted); }
.on-dark .muted{ color:var(--muted-dark); }

.rule{ height:1px; background:var(--rule); border:0; }
.on-dark .rule{ background:var(--rule-dark); }

/* ---------- Layout ---------- */
.wrap{ width:100%; max-width:var(--max); margin:0 auto; padding-inline:var(--gutter); }
.wrap--narrow{ max-width:920px; }
.section{ padding-block:var(--section); }
.section--tight{ padding-block:clamp(44px,6vw,88px); }
.stack > * + *{ margin-top:clamp(14px,1.6vw,22px); }
.stack-lg > * + *{ margin-top:clamp(24px,3vw,44px); }

.grid-2{ display:grid; gap:clamp(28px,4vw,72px); }
@media (min-width:900px){ .grid-2{ grid-template-columns:1fr 1fr; align-items:center; } }

.theme-dark{
  background:var(--charcoal);
  color:var(--on-dark);
}
.theme-dark .rule{ background:var(--rule-dark); }
.theme-dark .muted{ color:var(--muted-dark); }
.theme-dark .eyebrow{ color:var(--muted-dark); }
.theme-paper{ background:var(--paper); }
.theme-butcher{ background:var(--butcher); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  padding:.95em 1.6em;
  font-family:var(--body);
  font-size:.82rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  text-decoration:none;
  border:1px solid currentColor;
  border-radius:var(--radius);
  background:transparent;
  cursor:pointer;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
  min-height:48px;
}
.btn:hover,.btn:focus-visible{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.btn--solid{ background:var(--orange); border-color:var(--orange); color:#fff; }
.btn--solid:hover,.btn--solid:focus-visible{ background:var(--orange-dk); border-color:var(--orange-dk); color:#fff; }
.theme-dark .btn:hover,.theme-dark .btn:focus-visible{ background:var(--on-dark); color:var(--charcoal); border-color:var(--on-dark); }
.theme-dark .btn--solid:hover{ background:var(--orange-dk); color:#fff; border-color:var(--orange-dk); }
.btn--ghost{ border-color:currentColor; }

.link-arrow{
  display:inline-flex; align-items:center; gap:.5em;
  font-size:.82rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  text-decoration:none; color:var(--orange);
  padding-block:.5em;
  border-bottom:1px solid transparent;
  transition:border-color .25s var(--ease), gap .25s var(--ease);
}
.link-arrow:hover,.link-arrow:focus-visible{ border-color:currentColor; gap:.85em; }

:focus-visible{ outline:2px solid var(--orange); outline-offset:3px; }
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:999;
  background:var(--charcoal); color:var(--cream);
  padding:.8em 1.2em; text-decoration:none;
}
.skip-link:focus{ left:0; }
.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;
}

/* =========================================================
   PHOTOGRAPHY — Kodak Portra treatment
   Real photographs, graded not replaced.
   ========================================================= */
.photo{
  position:relative;
  overflow:hidden;
  background:var(--butcher);
  isolation:isolate;
}
.photo img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  /* Portra: warm highlights, soft contrast, slightly muted */
  filter:saturate(.88) contrast(.95) brightness(1.02) sepia(.06);
  transition:transform 1.2s var(--ease), filter .6s var(--ease);
  will-change:transform;
}
/* Warm overlay — light touch, not an orange wash */
.photo::after{
  content:"";
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 15%, rgba(255,228,190,.10), transparent 62%),
    linear-gradient(180deg, rgba(31,31,28,.04), rgba(31,31,28,.10));
  mix-blend-mode:multiply;
  opacity:.75;
}
/* Film grain — SVG fractal noise, no image request */
.photo::before{
  content:"";
  position:absolute; inset:-50%; z-index:3; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
  opacity:.18;
  mix-blend-mode:overlay;
}
.photo--plain::before,.photo--plain::after{ content:none; }

/* Scrim variants for text over photography */
.photo--scrim::after{
  background:linear-gradient(180deg, rgba(31,31,28,.34) 0%, rgba(31,31,28,.12) 38%, rgba(31,31,28,.72) 100%);
  mix-blend-mode:normal;
  opacity:1;
}
.photo--scrim-heavy::after{
  background:linear-gradient(180deg, rgba(31,31,28,.52) 0%, rgba(31,31,28,.42) 45%, rgba(31,31,28,.80) 100%);
  mix-blend-mode:normal;
  opacity:1;
}

/* Aspect helpers */
.ar-16-9{ aspect-ratio:16/9; }
.ar-4-3 { aspect-ratio:4/3; }
.ar-3-2 { aspect-ratio:3/2; }
.ar-1-1 { aspect-ratio:1/1; }
.ar-4-5 { aspect-ratio:4/5; }
.ar-2-3 { aspect-ratio:2/3; }

/* Empty image slot — visible, labelled, easy to fill. Never a fake photo. */
.slot{
  display:flex; align-items:center; justify-content:center;
  text-align:center; padding:2rem;
  background:
    repeating-linear-gradient(135deg, rgba(31,31,28,.035) 0 10px, transparent 10px 20px),
    var(--butcher);
  border:1px dashed var(--rule-strong);
  color:var(--muted);
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600;
  line-height:1.8;
}
.slot span{ display:block; max-width:26ch; }

/* =========================================================
   DOORWAY (landing page)
   ========================================================= */
.doorway{
  min-height:100svh;
  display:flex; flex-direction:column;
  background:var(--cream);
}
.doorway__head{
  text-align:center;
  padding:clamp(36px,7vh,80px) var(--gutter) clamp(24px,4vh,44px);
}
.doorway__head .eyebrow{ display:block; margin-bottom:clamp(16px,2.5vh,26px); }
.doorway__head .d-xxl{ margin-bottom:.22em; }
.doorway__sub{
  font-family:var(--display);
  font-weight:400; text-transform:none;
  font-size:clamp(1.05rem,2.4vw,1.6rem);
  letter-spacing:.01em;
  color:var(--muted);
}

.doors{
  flex:1;
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--rule);
  border-block:1px solid var(--rule);
}
@media (min-width:860px){ .doors{ grid-template-columns:1fr 1fr; } }

.door{
  position:relative; display:block; text-decoration:none; color:var(--on-dark);
  min-height:74svh; overflow:hidden; background:var(--charcoal);
}
@media (min-width:860px){ .door{ min-height:clamp(480px,58vh,660px); } }

.door__media{ position:absolute; inset:0; }
.door__media img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(.86) contrast(.96) brightness(.98) sepia(.06);
  transform:scale(1.02);
  transition:transform 1.6s var(--ease);
}
  .door:hover .door__media img,
.door:focus-visible .door__media img{ transform:scale(1.06); }

.door__inner{
  position:relative; z-index:4;
  height:100%;
  display:flex; flex-direction:column; justify-content:flex-end;
  gap:clamp(14px,2vw,22px);
  padding:clamp(28px,4.5vw,56px);
}
.door__logo{
  width:clamp(150px,30%,260px);
  height:auto;
  margin-bottom:auto;
  filter:drop-shadow(0 2px 14px rgba(0,0,0,.45));
}
.door__logo--fallback{
  margin-bottom:auto;
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:clamp(1.3rem,2.6vw,1.9rem); letter-spacing:.04em; line-height:1.05;
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}
.door__headline{
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:clamp(1.9rem,4.6vw,3.2rem); line-height:.95; letter-spacing:-.015em;
  text-shadow:0 2px 20px rgba(0,0,0,.4);
}
.door__desc{
  font-size:.7rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(240,233,220,.8);
}
.door__cta{
  display:inline-flex; align-items:center; gap:.6em; align-self:flex-start;
  font-size:.78rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  padding:.9em 1.5em; min-height:48px;
  border:1px solid rgba(240,233,220,.6);
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.door:hover .door__cta,.door:focus-visible .door__cta{
  background:var(--orange); border-color:var(--orange); color:#fff;
}
.doorway__foot{
  text-align:center;
  padding:clamp(22px,4vh,40px) var(--gutter);
}

/* =========================================================
   NAVIGATION
   ========================================================= */
.nav{
  position:sticky; top:0; z-index:60;
  background:color-mix(in srgb, var(--cream) 92%, transparent);
  backdrop-filter:saturate(1.1) blur(8px);
  border-bottom:1px solid var(--rule);
}
.nav--dark{
  background:color-mix(in srgb, var(--charcoal) 92%, transparent);
  border-bottom-color:var(--rule-dark);
  color:var(--on-dark);
}
.nav__bar{
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  min-height:68px;
}
.nav__brand{
  display:flex; align-items:center; gap:.7rem;
  text-decoration:none;
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:.95rem; letter-spacing:.06em; white-space:nowrap;
}
.nav__brand img{ height:34px; width:auto; }
.nav__links{ display:none; }
@media (min-width:980px){
  .nav__links{ display:flex; align-items:center; gap:clamp(18px,2vw,32px); }
}
.nav__link{
  text-decoration:none;
  font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  padding-block:.6em;
  border-bottom:1px solid transparent;
  transition:border-color .25s var(--ease), color .25s var(--ease);
}
.nav__link:hover,.nav__link:focus-visible,.nav__link[aria-current="page"]{ border-color:var(--orange); }
.nav__cross{
  color:var(--orange);
  font-size:.7rem; letter-spacing:.18em;
}
.nav__toggle{
  display:inline-flex; align-items:center; gap:.55em;
  background:none; border:1px solid currentColor; border-radius:var(--radius);
  padding:.6em .9em; min-height:44px; cursor:pointer;
  font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
}
@media (min-width:980px){ .nav__toggle{ display:none; } }
.nav__panel{
  display:none;
  padding:clamp(18px,4vw,28px) 0 clamp(26px,5vw,36px);
  border-top:1px solid var(--rule);
}
.nav--dark .nav__panel{ border-top-color:var(--rule-dark); }
.nav__panel[data-open="true"]{ display:block; }
.nav__panel .nav__link{
  display:block; font-size:1.05rem; letter-spacing:.1em;
  padding-block:.85em; border-bottom:1px solid var(--rule);
}
.nav--dark .nav__panel .nav__link{ border-bottom-color:var(--rule-dark); }

/* =========================================================
   HEROES
   ========================================================= */
.hero{ position:relative; min-height:min(92svh,860px); display:flex; }
.hero__media{ position:absolute; inset:0; }
.hero__inner{
  position:relative; z-index:4;
  align-self:flex-end;
  width:100%;
  padding-block:clamp(48px,9vw,110px);
  color:var(--on-dark);
}
.hero__inner .eyebrow{ color:rgba(240,233,220,.78); }
.hero h1{ text-shadow:0 2px 26px rgba(0,0,0,.35); }
.hero__logo{ width:clamp(190px,34vw,420px); height:auto; margin-bottom:clamp(18px,3vw,30px); }
.hero__lede{ color:rgba(240,233,220,.88); }

/* Statement blocks */
.statement{ text-align:center; }
.statement .d-xl{ margin-inline:auto; max-width:18ch; }
.statement__mark{
  display:block; width:56px; height:2px; background:var(--orange);
  margin:clamp(22px,3vw,34px) auto;
}

/* =========================================================
   EXPERIENCES — large editorial rows, not cards
   ========================================================= */
.exp{ border-top:1px solid var(--rule); }
.theme-dark .exp{ border-top-color:var(--rule-dark); }
.exp__row{
  display:grid; gap:clamp(22px,3.4vw,56px);
  padding-block:clamp(40px,6vw,86px);
  border-bottom:1px solid var(--rule);
  align-items:center;
}
.theme-dark .exp__row{ border-bottom-color:var(--rule-dark); }
@media (min-width:920px){
  .exp__row{ grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
  .exp__row:nth-child(even) .exp__media{ order:2; }
}
.exp__num{
  font-family:var(--display); font-weight:800;
  font-size:.8rem; letter-spacing:.2em; color:var(--orange);
  display:block; margin-bottom:1em;
}
.exp__title{ margin-bottom:.4em; }
.exp__kicker{
  font-family:var(--display); font-weight:400; text-transform:none;
  font-size:clamp(1.1rem,2.2vw,1.55rem); line-height:1.3;
  color:var(--orange); margin-bottom:.8em;
}

/* =========================================================
   EVENTS
   ========================================================= */
.events{ border-top:1px solid var(--rule); }
.event{
  display:grid; gap:clamp(18px,3vw,44px);
  padding-block:clamp(30px,4.5vw,58px);
  border-bottom:1px solid var(--rule);
  align-items:start;
}
.theme-dark .event{ border-bottom-color:var(--rule-dark); }
@media (min-width:860px){ .event{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); } }
.event__meta{
  display:flex; flex-wrap:wrap; gap:.5em 1.4em;
  font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted); margin-bottom:1em;
}
.theme-dark .event__meta{ color:var(--muted-dark); }
.event__brand{ color:var(--orange); }
.event__date{
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:clamp(.95rem,1.6vw,1.1rem); letter-spacing:.08em;
  color:var(--ink);
}
.theme-dark .event__date{ color:var(--on-dark); }
.event__actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.4em; }
.tag{
  display:inline-block;
  padding:.35em .8em;
  border:1px solid currentColor;
  font-size:.64rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
}
.tag--soldout{ color:var(--orange); }
.tag--past{ color:var(--muted); }
.event--past{ opacity:.82; }
.event--past .photo img{ filter:saturate(.5) contrast(.94) brightness(1.02) sepia(.12); }

/* =========================================================
   AROUND THE TABLE — editorial filmstrip
   ========================================================= */
.strip{ overflow:hidden; }
.strip__head{
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
  gap:1rem; margin-bottom:clamp(24px,3vw,40px);
}
.strip__track{
  display:flex; gap:clamp(10px,1.4vw,20px);
  width:max-content;
  padding-inline:var(--gutter);
  animation:strip-drift 95s linear infinite;
}
.strip:hover .strip__track,
.strip:focus-within .strip__track{ animation-play-state:paused; }
@keyframes strip-drift{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }

.strip__item{ flex:0 0 auto; height:clamp(240px,34vw,420px); }
.strip__item .photo{ height:100%; }
.strip__item--land{ width:clamp(340px,48vw,620px); }
.strip__item--port{ width:clamp(200px,28vw,320px); }

/* Mobile: native swipe instead of drift */
@media (max-width:760px){
  .strip__track{
    animation:none;
    width:auto;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:.5rem;
  }
  .strip__track::-webkit-scrollbar{ display:none; }
  .strip__item{ scroll-snap-align:center; height:62vw; max-height:400px; }
  .strip__dup{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .strip__track{ animation:none; overflow-x:auto; width:auto; }
  .strip__dup{ display:none; }
}

/* =========================================================
   PARTNERS / TESTIMONIALS / SIGNUP / FOOTER
   ========================================================= */
.partners__grid{
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:clamp(20px,3vw,44px); align-items:center;
}
@media (min-width:700px){ .partners__grid{ grid-template-columns:repeat(4,1fr); } }
.partners__grid img{
  width:100%; height:auto; max-height:62px; object-fit:contain;
  filter:grayscale(1); opacity:.6;
  transition:opacity .3s var(--ease), filter .3s var(--ease);
}
.partners__grid a:hover img,.partners__grid a:focus-visible img{ filter:grayscale(0); opacity:1; }

.quote{ max-width:30ch; }
.quote__text{
  font-family:var(--display); font-weight:400; text-transform:none;
  font-size:clamp(1.25rem,2.6vw,1.85rem); line-height:1.35; letter-spacing:-.01em;
}
.quote__attr{
  margin-top:1.2em;
  font-size:.72rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted);
}
.quotes{ display:grid; gap:clamp(28px,4vw,56px); }
@media (min-width:880px){ .quotes{ grid-template-columns:repeat(3,1fr); } }

.signup__form{ display:flex; flex-wrap:wrap; gap:.7rem; max-width:520px; }
.signup__form input[type="email"]{
  flex:1 1 220px;
  font:inherit; font-size:.95rem;
  padding:.9em 1em; min-height:48px;
  background:transparent;
  border:1px solid var(--rule-strong);
  border-radius:var(--radius);
  color:inherit;
}
.theme-dark .signup__form input[type="email"]{ border-color:var(--rule-dark); }
.signup__form input::placeholder{ color:var(--muted); }

.site-footer{
  background:var(--charcoal); color:var(--on-dark);
  padding-block:clamp(48px,7vw,86px);
}
.site-footer a{ text-decoration:none; }
.footer__grid{ display:grid; gap:clamp(28px,4vw,54px); }
@media (min-width:820px){ .footer__grid{ grid-template-columns:1.3fr 1fr 1fr; } }
.footer__links li + li{ margin-top:.7em; }
.footer__links a{
  font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted-dark);
  border-bottom:1px solid transparent;
}
.footer__links a:hover,.footer__links a:focus-visible{ color:var(--on-dark); border-color:var(--orange); }
.footer__bottom{
  margin-top:clamp(34px,5vw,60px); padding-top:clamp(20px,3vw,30px);
  border-top:1px solid var(--rule-dark);
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
  font-size:.7rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted-dark);
}

/* Contact */
.contact__grid{ display:grid; gap:clamp(30px,4vw,64px); }
@media (min-width:880px){ .contact__grid{ grid-template-columns:1fr 1fr; } }
.field{ display:block; margin-bottom:1.1rem; }
.field span{
  display:block; margin-bottom:.5em;
  font-size:.7rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
}
.field input,.field textarea,.field select{
  width:100%; font:inherit; font-size:1rem;
  padding:.85em 1em; min-height:48px;
  background:transparent; color:inherit;
  border:1px solid var(--rule-strong); border-radius:var(--radius);
}
.field textarea{ min-height:150px; resize:vertical; }

/* =========================================================
   MOTION — restrained reveals only
   ========================================================= */
[data-reveal]{
  opacity:0;
  transform:translateY(18px);
  transition:opacity 1s var(--ease), transform 1s var(--ease);
}
[data-reveal].is-in{ opacity:1; transform:none; }
[data-reveal][data-reveal="photo"]{ transform:none; clip-path:inset(0 0 12% 0); }
[data-reveal][data-reveal="photo"].is-in{ clip-path:inset(0 0 0 0); }
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1 !important; transform:none !important; clip-path:none !important; transition:none; }
  .photo img{ transition:none; }
}

/* Editorial prose fallback for WP content */
.prose h2{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:clamp(1.5rem,3vw,2.2rem); line-height:1; margin:1.8em 0 .6em; letter-spacing:-.015em; }
.prose h3{ font-family:var(--display); font-weight:700; font-size:1.25rem; margin:1.6em 0 .5em; }
.prose p{ max-width:var(--measure); margin-bottom:1.1em; }
.prose a{ color:var(--orange); }
.prose img{ margin-block:2em; }

/* =========================================================
   COMPONENT ADDITIONS
   ========================================================= */

/* Doorway panel scrim + grain (the panel is not a .photo wrapper) */
.door__scrim{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(31,31,28,.42) 0%, rgba(31,31,28,.18) 38%, rgba(31,31,28,.80) 100%);
}
.door__grain{
  position:absolute; inset:-50%; z-index:3; pointer-events:none;
  opacity:.16; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
}
.door__media picture{ display:block; width:100%; height:100%; }

/* Nav wordmark fallback (used until a real logo file is uploaded) */
.nav__wordmark{
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  letter-spacing:.05em; line-height:1;
}

/* Hero full-bleed photo must fill its box */
.hero__media .photo{ height:100%; }
.hero__media .photo picture{ display:block; height:100%; }

.hero__media .photo img{ height:100%; object-fit:cover; }
.hero__media .slot{ height:100%; }

/* Two Trails hero sits a touch taller — the logo needs room */
.hero--tt{ min-height:min(96svh,900px); }

/* Events filter tabs */
.filters{ display:flex; flex-wrap:wrap; gap:.5rem 1.6rem; margin-top:.6rem; }
.filters__tab{
  text-decoration:none;
  font-size:.74rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  padding-block:.6em;
  color:var(--muted);
  border-bottom:1px solid transparent;
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.filters__tab:hover,.filters__tab:focus-visible{ color:var(--ink); }
.filters__tab.is-on{ color:var(--ink); border-color:var(--orange); }

/* Definition list used for event and contact details */
.deets{ margin:0; }
.deets > div{ padding-block:1em; border-top:1px solid var(--rule); }
.theme-dark .deets > div{ border-top-color:var(--rule-dark); }
.deets dt{
  font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted); margin-bottom:.45em;
}
.theme-dark .deets dt{ color:var(--muted-dark); }
.deets dd{ margin:0; font-size:1.02rem; line-height:1.5; }
.deets a{ color:var(--orange); text-decoration:none; border-bottom:1px solid transparent; }
.deets a:hover,.deets a:focus-visible{ border-color:currentColor; }

.event__aside{ position:sticky; top:92px; }
@media (max-width:899px){ .event__aside{ position:static; } }

/* The Barbecue — photographic, loose, not a menu board */
.bbq{ display:grid; gap:clamp(20px,2.6vw,40px); }
@media (min-width:620px){ .bbq{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:960px){ .bbq{ grid-template-columns:repeat(3,1fr); } }
.bbq__item{ margin:0; }
.bbq__cap{ padding-top:1.1em; }
.bbq__cap h3{ margin-bottom:.35em; }
.bbq__cap p{ max-width:34ch; font-size:.96rem; }

/* Gallery mosaic */
.mosaic{
  display:grid; gap:clamp(8px,1.2vw,18px);
  grid-template-columns:repeat(2,1fr);
  grid-auto-rows:clamp(150px,22vw,230px);
}
@media (min-width:900px){ .mosaic{ grid-template-columns:repeat(3,1fr); } }
.mosaic__item{ margin:0; grid-row:span 1; overflow:hidden; }
.mosaic__item--tall{ grid-row:span 2; }
.mosaic__item .photo{ height:100%; }
.mosaic__item .photo picture{ display:block; height:100%; }
.mosaic__item img{ height:100%; object-fit:cover; }

/* Strip items need their pictures to fill */
.strip__item .photo picture{ display:block; height:100%; }
.strip__item img{ height:100%; object-fit:cover; }

/* Event media column */
.event__media .photo{ width:100%; }

/* Editorial pull for the doorway logo fallback */
.door__logo--fallback{ display:block; }

/* =========================================================
   FIXES FROM THE FIRST RENDER PASS
   ========================================================= */

/* A light section nested inside a dark page must reclaim dark ink,
   otherwise cream type lands on a cream ground. */
.theme-paper,
.theme-butcher{
  color:var(--ink);
}
.theme-paper .rule,
.theme-butcher .rule{ background:var(--rule); }
.theme-paper .muted,
.theme-butcher .muted{ color:var(--muted); }
.theme-paper .eyebrow,
.theme-butcher .eyebrow{ color:var(--muted); }
.theme-paper .event,
.theme-butcher .event,
.theme-paper .exp__row,
.theme-butcher .exp__row{ border-bottom-color:var(--rule); }
.theme-paper .deets > div,
.theme-butcher .deets > div{ border-top-color:var(--rule); }
.theme-paper .btn:hover,      .theme-butcher .btn:hover,
.theme-paper .btn:focus-visible,.theme-butcher .btn:focus-visible{
  background:var(--ink); color:var(--cream); border-color:var(--ink);
}
.theme-paper .btn--solid,.theme-butcher .btn--solid{ color:#fff; }
.theme-paper .event__date,.theme-butcher .event__date{ color:var(--ink); }
.theme-paper .signup__form input[type="email"],
.theme-butcher .signup__form input[type="email"]{ border-color:var(--rule-strong); }

/* Doorway: the headline was eating the panels. Give it its own scale. */
.doorway__head .d-xxl{ font-size:clamp(2.3rem, 5.6vw, 5rem); }
.doorway__head{ padding-block:clamp(30px,5.5vh,64px) clamp(20px,3.2vh,36px); }
@media (min-width:860px){ .door{ min-height:clamp(520px,62vh,720px); } }

/* Deeper scrim so type sits confidently on a bright daytime photograph */
/* Enough scrim to carry type, not so much that it buries the photograph.
   The weight sits at the very bottom where the copy actually lives. */
.door__scrim{
  background:
    linear-gradient(180deg,
      rgba(31,31,28,.46) 0%,
      rgba(31,31,28,.16) 30%,
      rgba(31,31,28,.10) 44%,
      rgba(31,31,28,.62) 78%,
      rgba(31,31,28,.86) 100%);
}
.photo--scrim::after{
  background:linear-gradient(180deg, rgba(31,31,28,.46) 0%, rgba(31,31,28,.20) 38%, rgba(31,31,28,.80) 100%);
}

/* Focal points — a landscape frame cropped into a tall panel needs telling
   where the subject is, or it crops to sky and tent poles. */
[data-focus="top"]    img{ object-position:50% 22%; }
[data-focus="upper"]  img{ object-position:50% 34%; }
[data-focus="center"] img{ object-position:50% 50%; }
[data-focus="lower"]  img{ object-position:50% 66%; }
[data-focus="bottom"] img{ object-position:50% 80%; }

/* Nav wordmark should never wrap the bar onto two lines */
.nav__wordmark{ white-space:nowrap; font-size:.95rem; }
@media (max-width:420px){ .nav__wordmark{ font-size:.82rem; } }

/* The Barbecue reads better as an even grid of portraits */
.bbq__item .photo{ width:100%; }
.bbq__cap h3{ letter-spacing:.02em; }

/* Hero: keep the eyebrow clear of a large wordmark */
.hero__inner .stack > .display + .serif-sub{ margin-top:.5em; }
.hero__logo{ max-width:min(420px,72vw); }
.hero .display.d-xl{ margin-block:.1em .05em; }

/* Strip: even height regardless of source ratio */
.strip__item .photo{ width:100%; }

/* =========================================================
   LOGOS — real artwork, given room to breathe
   ========================================================= */
.nav__brand picture{ display:block; }
.nav__logo{ height:38px; width:auto; }
@media (max-width:600px){ .nav__logo{ height:32px; } }

.door__logo{
  width:clamp(150px,52%,250px); height:auto;
  margin-bottom:auto;
  filter:drop-shadow(0 2px 16px rgba(0,0,0,.5));
}
.door__inner > picture{ margin-bottom:auto; width:clamp(150px,52%,250px); }
.door__inner > picture .door__logo{ width:100%; margin-bottom:0; }
/* The stacked Two Trails lockup is tall — hold it a little narrower. */
.doors .door:last-child .door__inner > picture{ width:clamp(120px,36%,190px); }

.hero__logo{ width:clamp(230px,44vw,470px); height:auto; filter:drop-shadow(0 2px 22px rgba(0,0,0,.45)); }
.hero__inner picture{ display:block; }
.hero__logo--tt{ width:clamp(180px,30vw,320px); }

.footer__mark picture{ display:block; }
.footer__logo{ width:clamp(180px,60%,240px); height:auto; }

/* The <picture> element is a plain inline wrapper — it needs to be told to
   fill its frame, or the <img> falls back to its intrinsic height and the
   crop never happens. */
.photo picture,
.door__media picture{ display:block; width:100%; height:100%; }
.photo img,
.door__media img{ width:100%; height:100%; object-fit:cover; }
.photo.ar-1-1 img,.photo.ar-3-2 img,.photo.ar-4-3 img,
.photo.ar-4-5 img,.photo.ar-16-9 img,.photo.ar-2-3 img{ height:100%; }

/* A logo needs air above it when an eyebrow line sits directly over the top. */
.hero__inner .stack > picture{ display:block; margin-top:clamp(10px,1.6vw,20px); }
.hero__inner .stack > picture + *{ margin-top:clamp(12px,1.6vw,20px); }
.hero__inner .eyebrow{ margin-bottom:.2em; }

/* Hero type sits bottom-left; give that corner a little more weight so the
   words hold whatever the photograph is doing behind them. */
.hero__media .photo--scrim::after{
  background:
    linear-gradient(180deg, rgba(31,31,28,.44) 0%, rgba(31,31,28,.14) 34%, rgba(31,31,28,.82) 100%),
    linear-gradient(90deg, rgba(31,31,28,.46), rgba(31,31,28,.06) 58%);
}

/* The doorway panel photograph fills its panel; the scrim and grain sit above it. */
.door__photo{ position:absolute; inset:0; height:100%; }
.door__photo picture, .door__photo img{ height:100%; }