/* ==========================================================================
   RED HORIZON OUTFITTER & KENNEL — "Red Horizon Editorial"
   Custom design system. Dark, high-contrast, editorial luxury.
   Palette lifted from the client's existing site; structural cues from
   southernoakkennels.com (oversized condensed display, stacked eyebrow,
   full-bleed photographic bands, generous vertical air).
   ========================================================================== */

/* ---------- Tokens ---------- */
/* ============================================================
   DIRTY DUCK OUTFITTERS — palette derived from the brand mark
   60 / 30 / 10:
     60% dominant  → --ink / --ink-2 / --ink-3 (deep warm charcoal)
     30% secondary → --bronze family + --bone light bands
     10% accent    → --red* (burnt sunset amber, CTA only)
   ============================================================ */
:root{
  /* Accent — 10% — burnt sunset amber off the logo sky */
  --red:        #D4762A;
  --red-deep:   #A4541A;
  --red-bright: #E8892F;

  /* Gold script accent (hover states, small marks) */
  --amber:      #D9A441;
  --amber-dim:  #A8823A;

  /* Secondary — 30% — bronze / tan for borders, muted type, outline buttons */
  --bronze:     #8C7355;
  --bronze-dim: rgba(140,115,85,.42);
  --oxblood:    #7E1A18;

  /* Surfaces — 60% */
  --ink:        #0F0C0B;
  --ink-2:      #171310;
  --ink-3:      #221B16;
  --ink-4:      #2E241D;
  --bone:       #E9E2D4;
  --bone-2:     #F5F1E8;

  /* Type colors */
  --fg:         #F3EFE7;
  --fg-dim:     rgba(243,239,231,.68);
  --fg-faint:   rgba(243,239,231,.44);
  --fg-dark:    #171310;
  --fg-dark-dim:rgba(23,19,16,.70);
  --rule:       rgba(200,170,130,.20);
  --rule-dark:  rgba(23,19,16,.16);

  /* Type */
  --display: "Bebas Neue", "Oswald", Impact, sans-serif;
  --body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Layout */
  --wrap: 1280px;
  --wrap-narrow: 860px;
  --gutter: clamp(20px, 5vw, 64px);
  --section-y: clamp(76px, 10vw, 150px);

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out-expo: cubic-bezier(.16,1,.3,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family: var(--body) !important;
  background: var(--ink-2) !important;
  color: var(--fg) !important;
  font-size:17px;
  line-height:1.72;
  font-weight:380;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; }
::selection{ background:var(--red); color:#fff; }

/* ---------- Layout ---------- */
.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }
.wrap--narrow{ max-width:var(--wrap-narrow); }
.section{ padding: var(--section-y) 0; position:relative; }
.section--dark{ background:var(--ink-2) !important; color:var(--fg) !important; }
.section--deep{ background:var(--ink) !important; color:var(--fg) !important; }
.section--raised{ background:var(--ink-3) !important; color:var(--fg) !important; }
.section--light{ background:var(--bone) !important; color:var(--fg-dark) !important; }
.section--light-2{ background:var(--bone-2) !important; color:var(--fg-dark) !important; }
.section--tight{ padding: clamp(56px,7vw,96px) 0; }

/* ---------- Typography ---------- */
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:400;
  letter-spacing:.012em;
  line-height:.92;
  margin:0 0 .35em;
  text-transform:uppercase;
}
h1{ font-size:clamp(46px, 8.4vw, 118px); }
h2{ font-size:clamp(36px, 5.6vw, 78px); }
h3{ font-size:clamp(24px, 3vw, 40px); }
h4{ font-size:clamp(19px, 1.8vw, 25px); letter-spacing:.04em; }
p{ margin:0 0 1.15em; }
p:last-child{ margin-bottom:0; }

.lede{ font-size:clamp(18px,1.55vw,22px); line-height:1.66; color:var(--fg-dim); font-weight:340; }
.section--light .lede, .section--light-2 .lede{ color:var(--fg-dark-dim); }

/* Stacked uppercase eyebrow above the title — the Southern Oak signature */
.eyebrow{
  display:block;
  font-family:var(--body);
  font-size:12px;
  font-weight:600;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--amber);
  margin:0 0 20px;
}
.eyebrow--muted{ color:var(--fg-faint); }
.section--light .eyebrow--muted,.section--light-2 .eyebrow--muted{ color:rgba(23,19,16,.45); }
.eyebrow--num::before{ content:attr(data-num); color:var(--red); margin-right:14px; }

.rule{ height:1px; background:var(--rule); border:0; margin:0; }
.section--light .rule,.section--light-2 .rule{ background:var(--rule-dark); }
.rule--amber{ width:64px; height:2px; background:var(--amber); border:0; margin:0 0 28px; }

.section-head{ max-width:820px; margin-bottom:clamp(40px,5vw,70px); }
.section-head--center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head--center .rule--amber{ margin-left:auto; margin-right:auto; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--body);
  font-size:12px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  padding:17px 34px;
  border:1px solid transparent;
  border-radius:0;
  cursor:pointer;
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
  position:relative; overflow:hidden;
  line-height:1;
  text-align:center;
}
.btn.btn--primary{ background:var(--red); color:#fff; border-color:var(--red); }
.btn.btn--primary:hover{ background:var(--red-deep); border-color:var(--red-deep); }
.btn.btn--ghost{ background:transparent; color:var(--fg); border-color:rgba(243,239,231,.34); }
.btn.btn--ghost:hover{ background:var(--fg); color:var(--ink); border-color:var(--fg); }
.btn.btn--dark{ background:var(--ink); color:var(--fg); border-color:var(--ink); }
.btn.btn--dark:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.btn.btn--outline-dark{ background:transparent; color:var(--fg-dark); border-color:rgba(23,19,16,.3); }
.btn.btn--outline-dark:hover{ background:var(--ink); color:var(--fg); border-color:var(--ink); }
.btn.btn--sm{ padding:13px 24px; font-size:11px; letter-spacing:.18em; }
.btn.btn--lg{ padding:21px 46px; font-size:13px; }
.btn-row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }

/* Text link with animated underline */
.tlink{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12px; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--amber); padding-bottom:6px; position:relative;
}
.tlink::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:currentColor; transform:scaleX(1); transform-origin:right; transition:transform .5s var(--ease-out-expo); }
.tlink:hover::after{ transform:scaleX(0); }
.tlink .arw{ transition:transform .45s var(--ease-out-expo); }
.tlink:hover .arw{ transform:translateX(6px); }
.section--light .tlink,.section--light-2 .tlink{ color:var(--red); }

/* ==========================================================================
   HEADER / NAV
   ========================================================================== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1100; /* must sit above .mobile-menu so the X stays clickable */
  padding:22px 0;
  transition:background .45s var(--ease), padding .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease);
  border-bottom:1px solid transparent;
  background:linear-gradient(to bottom, rgba(8,6,5,.72), rgba(8,6,5,0));
}
.site-header.is-stuck{
  background:rgba(15,12,11,.97);
  backdrop-filter:saturate(150%) blur(14px);
  -webkit-backdrop-filter:saturate(150%) blur(14px);
  padding:12px 0;
  border-bottom-color:var(--rule);
  box-shadow:0 14px 40px rgba(0,0,0,.4);
}
.site-header.is-solid{ background:rgba(15,12,11,.97); }
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:26px; }

/* header gets a wider container than body content so the nav row never overflows */
.site-header > .wrap{ max-width:1560px !important; }

.brand{ display:flex; align-items:center; flex-shrink:0; }
.brand__logo{ height:48px; width:auto; transition:height .45s var(--ease); }
.site-header.is-stuck .brand__logo{ height:40px; }

.nav-main{ display:flex; align-items:center; gap:26px; margin-left:auto; }
.nav-main > li{ list-style:none; position:relative; }
.nav-main a, .nav-main .drop-trigger{
  font-family:var(--body);
  font-size:12px; font-weight:600; letter-spacing:.19em; text-transform:uppercase;
  color:var(--fg); background:none; border:0; padding:0; cursor:pointer;
  display:inline-flex; align-items:center; gap:7px;
  position:relative; transition:color .3s var(--ease);
  white-space:nowrap;
}
.nav-main a::after, .nav-main .drop-trigger::after{
  content:""; position:absolute; left:0; bottom:-7px; height:1px; width:100%;
  background:var(--red); transform:scaleX(0); transform-origin:left;
  transition:transform .45s var(--ease-out-expo);
}
.nav-main li:hover > a::after,
.nav-main li:hover > .drop-trigger::after,
.nav-main a[aria-current="page"]::after{ transform:scaleX(1); }
.nav-main .caret{ width:9px; height:9px; transition:transform .35s var(--ease); opacity:.7; }
.nav-main li:hover .caret{ transform:rotate(180deg); }

/* Dropdown */
.nav-drop{
  position:absolute; top:100%; left:-26px; min-width:288px;
  background:var(--ink-3); border:1px solid var(--rule);
  padding:10px; margin-top:20px;
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .35s var(--ease), transform .35s var(--ease), visibility .35s;
  box-shadow:0 26px 60px rgba(0,0,0,.55);
}
/* transparent bridge so the cursor can cross the gap */
.nav-drop::before{ content:""; position:absolute; left:0; right:0; top:-22px; height:24px; }
.nav-main li:hover .nav-drop, .nav-main li:focus-within .nav-drop{ opacity:1; visibility:visible; transform:translateY(0); }
.nav-drop li{ list-style:none; }
.nav-drop a{
  display:block; padding:13px 16px; font-size:11.5px; letter-spacing:.15em;
  color:var(--fg) !important; transition:background .3s var(--ease), color .3s var(--ease), padding-left .3s var(--ease);
}
.nav-drop a::after{ display:none; }
.nav-drop a:hover{ background:var(--ink-4); color:var(--amber) !important; padding-left:22px; }
.nav-drop .drop-note{ display:block; font-family:var(--body); font-size:10.5px; letter-spacing:.06em;
  text-transform:none; color:var(--fg-faint); margin-top:3px; font-weight:400; }

.header-cta{ display:flex; align-items:center; gap:18px; flex-shrink:0; }
.header-phone{
  font-size:12px; font-weight:600; letter-spacing:.14em; color:var(--fg-dim);
  white-space:nowrap; transition:color .3s var(--ease);
}
.header-phone:hover{ color:var(--amber); }

/* ---------- Hamburger (animated) ---------- */
.hamburger{
  display:none; position:relative; z-index:1002;
  width:46px; height:46px; border:1px solid rgba(243,239,231,.28);
  background:transparent; cursor:pointer; padding:0;
  transition:border-color .35s var(--ease), background .35s var(--ease);
}
.hamburger:hover{ border-color:var(--amber); }
.hamburger span{
  position:absolute; left:13px; width:20px; height:1.5px; background:var(--fg);
  transition:transform .5s var(--ease-out-expo), opacity .3s var(--ease), width .5s var(--ease-out-expo), background .3s;
}
.hamburger span:nth-child(1){ top:16px; }
.hamburger span:nth-child(2){ top:22px; width:14px; }
.hamburger span:nth-child(3){ top:28px; }
.hamburger.is-open{ border-color:var(--red); }
.hamburger.is-open span:nth-child(1){ transform:translateY(6px) rotate(45deg); background:var(--red-bright); }
.hamburger.is-open span:nth-child(2){ opacity:0; transform:translateX(-14px); }
.hamburger.is-open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); background:var(--red-bright); }

/* ---------- Mobile menu overlay ---------- */
/* while the overlay is open the header goes transparent so only logo + X read */
body.is-locked .site-header{
  background:transparent !important; box-shadow:none !important; border-bottom-color:transparent !important;
  -webkit-backdrop-filter:none; backdrop-filter:none;
}
body.is-locked .header-cta .btn{ display:none; }
/* review-phase feedback pill must not sit on top of the open mobile nav */
body.is-locked .mbfb-fab{ opacity:0 !important; pointer-events:none !important; }

.mobile-menu{
  position:fixed; inset:0; z-index:1050;
  background:var(--ink);
  display:flex; flex-direction:column;
  padding:104px var(--gutter) 40px;
  overflow-y:auto;
  /* wipe in from the right */
  clip-path:inset(0 0 0 100%);
  transition:clip-path .72s var(--ease-out-expo);
  pointer-events:none;
  visibility:hidden;
}
.mobile-menu::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(120% 80% at 85% 0%, rgba(212,118,42,.20), transparent 62%);
  pointer-events:none;
}
.mobile-menu.is-open{ clip-path:inset(0 0 0 0%); pointer-events:auto; visibility:visible; }
.mm-list{ list-style:none; margin:0; padding:0; position:relative; }
.mm-list > li{ border-bottom:1px solid rgba(243,239,231,.1); }
.mm-list > li > a, .mm-sub-trigger{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  font-family:var(--display); font-size:34px; letter-spacing:.02em; text-transform:uppercase;
  color:var(--fg); background:none; border:0; text-align:left;
  padding:19px 0; cursor:pointer; line-height:1;
}
.mm-sub-trigger .caret{ width:14px; height:14px; color:var(--red-bright); transition:transform .4s var(--ease); }
.mm-sub-trigger[aria-expanded="true"] .caret{ transform:rotate(180deg); }
.mm-sub{ list-style:none; margin:0; padding:0; max-height:0; overflow:hidden; transition:max-height .5s var(--ease-out-expo); }
.mm-sub.is-open{ max-height:340px; }
.mm-sub a{
  display:block; padding:12px 0 12px 22px;
  font-size:12.5px; font-weight:600; letter-spacing:.19em; text-transform:uppercase;
  color:var(--fg-dim); border-left:1px solid rgba(212,118,42,.5); margin-bottom:2px;
  transition:color .3s var(--ease), padding-left .3s var(--ease);
}
.mm-sub a:last-child{ margin-bottom:14px; }
.mm-sub a:hover{ color:var(--amber); padding-left:30px; }

/* staggered entrance for each row */
.mobile-menu .mm-stagger{ opacity:0; transform:translateY(26px); }
.mobile-menu.is-open .mm-stagger{
  opacity:1; transform:translateY(0);
  transition:opacity .6s var(--ease) var(--d,0s), transform .7s var(--ease-out-expo) var(--d,0s);
}
.mm-foot{ margin-top:auto; padding-top:38px; position:relative; }
.mm-foot .btn{ width:100%; }
.mm-contact{ margin-top:24px; display:flex; flex-direction:column; gap:9px;
  font-size:13px; letter-spacing:.09em; color:var(--fg-dim); }
.mm-contact a:hover{ color:var(--amber); }
.mm-social{ display:flex; gap:14px; margin-top:24px; }
.mm-social a{ width:42px; height:42px; border:1px solid var(--rule); display:grid; place-items:center;
  transition:background .3s, border-color .3s, color .3s; }
.mm-social a:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.mm-social svg{ width:16px; height:16px; fill:currentColor; }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative; min-height:clamp(560px, 92vh, 940px);
  display:flex; align-items:flex-end;
  padding: 190px 0 clamp(64px,7vw,104px);
  overflow:hidden; isolation:isolate;
  background:var(--ink);
}
.hero--short{ min-height:clamp(440px,64vh,640px); padding-top:180px; }
.hero__bg{
  position:absolute; inset:0; z-index:-2;
  background-size:cover; background-position:center;
  /* NO zoom/pan — keeps faces uncropped */
  animation:none !important; transform:none !important;
}
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(12,9,9,.94) 0%, rgba(12,9,9,.62) 34%, rgba(12,9,9,.28) 62%, rgba(12,9,9,.55) 100%),
    linear-gradient(to right, rgba(12,9,9,.72) 0%, rgba(12,9,9,.1) 62%);
}
.hero__inner{ position:relative; z-index:2; width:100%; }
.hero h1{
  font-size:clamp(48px, 9vw, 132px) !important; /* guard vs MB normalize h1{font-size:2em} */
  line-height:.88 !important;
  margin:0 0 26px;
  max-width:16ch;
  text-shadow:0 2px 30px rgba(0,0,0,.6);
}
.hero .eyebrow{ text-shadow:0 1px 14px rgba(0,0,0,.7); }
.hero .lede{ max-width:56ch; color:rgba(243,239,231,.86); text-shadow:0 1px 20px rgba(0,0,0,.62); }
.hero .btn-row{ margin-top:38px; }
.hero__meta{
  margin-top:clamp(44px,6vw,76px); padding-top:26px; border-top:1px solid rgba(243,239,231,.18);
  display:flex; flex-wrap:wrap; gap:clamp(26px,5vw,64px);
}
.hero__meta div{ min-width:120px; }
.hero__meta dt{ font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--amber); margin-bottom:8px; }
.hero__meta dd{ margin:0; font-family:var(--display); font-size:clamp(24px,2.6vw,34px); line-height:1; letter-spacing:.02em; }

.scroll-cue{
  position:absolute; right:var(--gutter); bottom:clamp(64px,7vw,104px); z-index:3;
  writing-mode:vertical-rl; font-size:10px; letter-spacing:.34em; text-transform:uppercase;
  color:var(--fg-faint); display:flex; align-items:center; gap:14px;
}
.scroll-cue::after{ content:""; width:1px; height:64px; background:linear-gradient(var(--amber), transparent); }

/* breadcrumb on interior heroes */
.crumbs{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--fg-faint); margin-bottom:18px; }
.crumbs a:hover{ color:var(--amber); }
.crumbs span{ margin:0 9px; opacity:.5; }

/* ==========================================================================
   SPLIT / EDITORIAL BLOCKS
   ========================================================================== */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(38px,6vw,92px); align-items:center; }
.split--wide-left{ grid-template-columns:1.15fr .85fr; }
.split--wide-right{ grid-template-columns:.85fr 1.15fr; }
.split__media{ position:relative; }
.split__media img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; }
.split__media--land img{ aspect-ratio:4/3; }
.split__media--tall img{ aspect-ratio:3/4; }
.split__media.is-offset::before{
  content:""; position:absolute; inset:auto auto -22px -22px; width:52%; height:46%;
  border-left:2px solid var(--red); border-bottom:2px solid var(--red); z-index:-1;
}
.split__badge{
  position:absolute; right:-1px; bottom:-1px; background:var(--red); color:#fff;
  padding:20px 26px; max-width:210px;
}
.split__badge strong{ font-family:var(--display); font-size:34px; line-height:1; display:block; letter-spacing:.02em; }
.split__badge span{ font-size:10px; letter-spacing:.22em; text-transform:uppercase; opacity:.86; }
@media (max-width:900px){
  .split,.split--wide-left,.split--wide-right{ grid-template-columns:1fr; }
  .split--flip-mobile .split__media{ order:-1; }
}

/* ---------- Stat band ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); }
.stats div{ background:var(--ink-2); padding:clamp(28px,3.4vw,46px) clamp(18px,2vw,32px); text-align:center; }
.section--deep .stats div{ background:var(--ink); }
.stats dt{ font-family:var(--display); font-size:clamp(40px,5vw,68px); line-height:1; color:var(--fg); letter-spacing:.02em; }
.stats dt em{ font-style:normal; color:var(--red-bright); }
.stats dd{ margin:12px 0 0; font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--fg-faint); }
@media (max-width:820px){ .stats{ grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   CARDS
   ========================================================================== */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:clamp(18px,2.2vw,30px); }
.card-grid--2{ grid-template-columns:repeat(auto-fit,minmax(400px,1fr)); }
.card-grid--3{ grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); }

.card{
  position:relative; display:flex; flex-direction:column;
  background:var(--ink-3); border:1px solid var(--rule);
  overflow:hidden; transition:border-color .5s var(--ease), transform .6s var(--ease-out-expo);
}
.card:hover{ border-color:rgba(246,171,74,.45); transform:translateY(-5px); }
.card__media{ overflow:hidden; aspect-ratio:3/2; }
.card__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.05s var(--ease-out-expo), filter .6s var(--ease); filter:saturate(.94); }
.card:hover .card__media img{ transform:scale(1.055); filter:saturate(1.05); }
.card__body{ padding:clamp(24px,2.4vw,34px); display:flex; flex-direction:column; flex:1; }
.card__eyebrow{ font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--amber); margin-bottom:14px; }
.card h3{ margin-bottom:14px; font-size:clamp(22px,2.1vw,30px); }
.card p{ color:var(--fg-dim); font-size:15.5px; line-height:1.68; }
.card__foot{ margin-top:auto; padding-top:24px; }
.card__price{ font-family:var(--display); font-size:30px; color:var(--fg); letter-spacing:.02em; line-height:1; }
.card__price sup{ font-size:.48em; top:-.68em; position:relative; margin-right:4px; color:var(--amber); }
.card__price small{ display:block; font-family:var(--body); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--fg-faint); margin-top:9px; }

.section--light .card,.section--light-2 .card{ background:#fff; border-color:var(--rule-dark); }
.section--light .card p,.section--light-2 .card p{ color:var(--fg-dark-dim); }
.section--light .card__price,.section--light-2 .card__price{ color:var(--fg-dark); }
.section--light .card__eyebrow,.section--light-2 .card__eyebrow{ color:var(--red); }
.section--light .card__price small,.section--light-2 .card__price small{ color:rgba(23,19,16,.5); }

/* Numbered feature list (no boxes — editorial) */
.features{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:clamp(28px,3.6vw,58px); }
/* forced 4-across variant — keeps a set of four on a single row instead of
   wrapping 3 + 1 orphan */
.features--4{ grid-template-columns:repeat(4,1fr); gap:clamp(20px,2.4vw,38px); }
.features--4 .feature p{ font-size:14.5px; line-height:1.62; }
.features--4 h4{ font-size:clamp(17px,1.35vw,21px); }
@media (max-width:1180px){ .features--4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .features--4{ grid-template-columns:1fr; } }
.feature__num{ font-family:var(--display); font-size:15px; letter-spacing:.2em; color:var(--red-bright); margin-bottom:16px; display:block; }
.feature h4{ margin-bottom:12px; }
.feature p{ color:var(--fg-dim); font-size:15.5px; }
.section--light .feature p,.section--light-2 .feature p{ color:var(--fg-dark-dim); }
.feature::before{ content:""; display:block; width:100%; height:1px; background:var(--rule); margin-bottom:24px; }
.section--light .feature::before,.section--light-2 .feature::before{ background:var(--rule-dark); }

/* ---------- Program / pricing rows ---------- */
.rows{ border-top:1px solid var(--rule); }
.section--light .rows,.section--light-2 .rows{ border-color:var(--rule-dark); }
.row-item{
  display:grid; grid-template-columns:auto 1fr auto; gap:clamp(20px,3vw,52px);
  align-items:start; padding:clamp(30px,3.6vw,50px) 0; border-bottom:1px solid var(--rule);
}
.section--light .row-item,.section--light-2 .row-item{ border-color:var(--rule-dark); }
.row-item__num{ font-family:var(--display); font-size:clamp(30px,3.4vw,46px); color:var(--red-bright); line-height:1; letter-spacing:.02em; min-width:56px; }
.row-item h3{ margin-bottom:12px; }
.row-item p{ color:var(--fg-dim); max-width:66ch; font-size:15.5px; }
.section--light .row-item p,.section--light-2 .row-item p{ color:var(--fg-dark-dim); }
.row-item__aside{ text-align:right; min-width:170px; }
.row-item__aside .tag{ display:inline-block; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--amber); border:1px solid rgba(246,171,74,.4); padding:8px 14px; margin-bottom:12px; white-space:nowrap; }
.section--light .row-item__aside .tag,.section--light-2 .row-item__aside .tag{ color:var(--red); border-color:rgba(212,118,42,.35); }
@media (max-width:860px){
  .row-item{ grid-template-columns:auto 1fr; }
  .row-item__aside{ grid-column:2; text-align:left; margin-top:6px; }
}

/* ---------- Species marquee ---------- */
.marquee{ overflow:hidden; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); padding:22px 0; background:var(--ink); }
.marquee__track{ display:flex; gap:56px; width:max-content; animation:slide 46s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee span{ font-family:var(--display); font-size:clamp(20px,2.1vw,30px); letter-spacing:.06em;
  color:var(--fg-faint); white-space:nowrap; display:flex; align-items:center; gap:56px; }
.marquee span::after{ content:""; width:6px; height:6px; background:var(--red); flex-shrink:0; transform:rotate(45deg); }
@keyframes slide{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marquee__track{ animation:none; flex-wrap:wrap; width:auto; } }

/* ---------- Quote / testimonial ---------- */
.quote{ max-width:900px; margin:0 auto; text-align:center; }
.quote blockquote{
  margin:0 0 30px; font-family:var(--display); text-transform:none;
  font-size:clamp(24px,3.1vw,44px); line-height:1.16; letter-spacing:.01em; color:var(--fg);
}
.quote__mark{ font-family:var(--display); font-size:70px; color:var(--red); line-height:.6; display:block; margin-bottom:20px; }
.quote cite{ font-style:normal; font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--amber); }

/* ---------- Full-bleed CTA band ---------- */
.cta-band{ position:relative; padding:clamp(90px,11vw,170px) 0; overflow:hidden; isolation:isolate; background:var(--ink); }
.cta-band__bg{ position:absolute; inset:0; z-index:-2; background-size:cover; background-position:center; }
.cta-band__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(to right, rgba(12,9,9,.93), rgba(12,9,9,.7) 55%, rgba(12,9,9,.55)); }
.cta-band .wrap{ position:relative; z-index:2; }
.cta-band h2{ max-width:17ch; }
.cta-band .lede{ max-width:50ch; }
.cta-band .btn-row{ margin-top:36px; }

/* ---------- Gallery (masonry, full-size, lightbox) ---------- */
.gallery{ column-count:3; column-gap:14px; }
.gallery figure{ break-inside:avoid; margin:0 0 14px; position:relative; overflow:hidden; cursor:zoom-in; background:var(--ink-3); }
.gallery img{ width:100%; height:auto; transition:transform 1s var(--ease-out-expo), filter .5s var(--ease); filter:saturate(.95); }
.gallery figure:hover img{ transform:scale(1.045); filter:saturate(1.06); }
.gallery figure::after{
  content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(212,118,42,.28), transparent 55%);
  opacity:0; transition:opacity .45s var(--ease);
}
.gallery figure:hover::after{ opacity:1; }
@media (max-width:1000px){ .gallery{ column-count:2; } }
@media (max-width:620px){ .gallery{ column-count:1; } }

.gallery-strip{ column-count:3; column-gap:14px; }
.gallery-strip figure{ break-inside:avoid; margin:0 0 14px; overflow:hidden; cursor:zoom-in; }
.gallery-strip img{ width:100%; height:auto; transition:transform 1s var(--ease-out-expo); }
.gallery-strip figure:hover img{ transform:scale(1.04); }
@media (max-width:800px){ .gallery-strip{ column-count:2; } }

/* Lightbox */
.lightbox{
  position:fixed; inset:0; z-index:1300; background:rgba(8,6,6,.985);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s;
}
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox img{ max-width:92vw; max-height:86vh; object-fit:contain; }
.lightbox__btn{
  position:absolute; background:transparent; border:1px solid rgba(243,239,231,.28); color:var(--fg);
  width:52px; height:52px; cursor:pointer; display:grid; place-items:center; font-size:22px;
  transition:background .3s, border-color .3s;
}
.lightbox__btn:hover{ background:var(--red); border-color:var(--red); }
.lightbox__close{ top:26px; right:26px; }
.lightbox__prev{ left:26px; top:50%; transform:translateY(-50%); }
.lightbox__next{ right:26px; top:50%; transform:translateY(-50%); }
.lightbox__count{ position:absolute; bottom:26px; left:50%; transform:translateX(-50%);
  font-size:11px; letter-spacing:.24em; color:var(--fg-faint); }
@media (max-width:640px){ .lightbox__prev{ left:10px; } .lightbox__next{ right:10px; } }

/* ---------- Team ---------- */
.team-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:clamp(24px,3vw,40px); }
.team__media{ overflow:hidden; margin-bottom:22px; aspect-ratio:4/5; }
.team__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease-out-expo); filter:saturate(.92); }
.team-member:hover .team__media img{ transform:scale(1.05); }
.team-member h3{ margin-bottom:8px; }
.team__role{ font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--amber); margin-bottom:14px; }
.team__ph{ width:100%; height:100%; display:grid; place-items:center; background:var(--ink-4);
  color:var(--fg-faint); font-family:var(--display); font-size:56px; letter-spacing:.06em; }

/* ---------- FAQ accordion ---------- */
.faq{ border-top:1px solid var(--rule-dark); }
.faq-item{ border-bottom:1px solid var(--rule-dark); }
.faq-q{
  width:100%; background:none; border:0; cursor:pointer; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:26px;
  padding:26px 0; color:var(--fg-dark);
  font-family:var(--display); font-size:clamp(19px,1.9vw,25px); text-transform:uppercase; letter-spacing:.02em; line-height:1.2;
}
.faq-q .ind{ position:relative; width:16px; height:16px; flex-shrink:0; }
.faq-q .ind::before,.faq-q .ind::after{ content:""; position:absolute; background:var(--red); transition:transform .45s var(--ease-out-expo); }
.faq-q .ind::before{ left:0; top:7.5px; width:16px; height:1.5px; }
.faq-q .ind::after{ left:7.5px; top:0; width:1.5px; height:16px; }
.faq-q[aria-expanded="true"] .ind::after{ transform:scaleY(0); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .55s var(--ease-out-expo); }
.faq-a > div{ padding:0 0 28px; max-width:74ch; color:var(--fg-dark-dim); font-size:15.5px; }

/* ---------- Contact ---------- */
.contact-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1px; background:var(--rule); border:1px solid var(--rule); }
.contact-card{ background:var(--ink-3); padding:clamp(28px,3vw,42px); }
.contact-card .ic{ width:22px; height:22px; fill:var(--red-bright); margin-bottom:20px; }
.contact-card h4{ margin-bottom:10px; }
.contact-card a,.contact-card p{ color:var(--fg-dim); font-size:15.5px; }
.contact-card a:hover{ color:var(--amber); }

/* The Mallard Bay embeds ship their own dark rounded card. Don't wrap them in a
   second surface — give them a plain block and let their card stand on its own. */
.form-intro{ margin-bottom:22px; color:var(--fg-dark); }
.form-intro h3{ margin-bottom:8px; }
.form-intro p{ color:var(--fg-dark-dim); font-size:15px; }
.contact-form-shell{ min-height:120px; }
.mb-embed{ width:100%; display:block; }
.mb-embed > div,
.mb-embed > div > div,
.mb-embed iframe{ max-width:100% !important; width:100% !important; }
.mb-form-embed.is-placeholder{ position:relative; padding-top:26px; }
.mb-form-embed.is-placeholder::before{
  content:"MALLARD BAY FORM EMBED"; position:absolute; top:0; left:0;
  font-size:10px; letter-spacing:.24em; color:rgba(23,19,16,.4);
}

/* Netlify fallback form */
.nf-form{ display:grid; gap:16px; }
.nf-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:640px){ .nf-row{ grid-template-columns:1fr; } }
.nf-form label{ display:block; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(23,19,16,.6); margin-bottom:8px; }
.nf-form input,.nf-form select,.nf-form textarea{
  width:100%; padding:14px 16px; border:1px solid rgba(23,19,16,.2); background:#fff;
  font-family:var(--body); font-size:15px; color:var(--fg-dark); border-radius:0;
  transition:border-color .3s var(--ease);
}
.nf-form input:focus,.nf-form select:focus,.nf-form textarea:focus{ outline:none; border-color:var(--red); }
.nf-hp{ position:absolute; left:-9999px; }

/* ---------- Booking widget shell ---------- */
.book-shell{ background:var(--ink-3); border:1px solid var(--rule); padding:clamp(24px,3vw,40px); }
.section--raised .mb-embed, .section--light .mb-embed{ margin-inline:auto; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:var(--ink) !important; color:var(--fg) !important; padding:clamp(64px,7vw,100px) 0 0; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.1fr; gap:clamp(30px,4vw,60px); padding-bottom:clamp(48px,5vw,72px); }
@media (max-width:960px){ .footer-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-top{ grid-template-columns:1fr; } }
.footer-brand__logo{ height:52px; width:auto; margin-bottom:24px; }
.footer-col h5{ font-family:var(--body); font-size:10.5px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--amber); margin:0 0 20px; font-weight:600; }
.footer-col ul{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.footer-col a{ font-size:14.5px; color:var(--fg-dim); transition:color .3s var(--ease), padding-left .3s var(--ease); }
.footer-col a:hover{ color:var(--amber); padding-left:5px; }
.footer-about p{ color:var(--fg-dim); font-size:14.5px; max-width:42ch; }
.footer-social{ display:flex; gap:12px; margin-top:26px; }
.footer-social a{ width:42px; height:42px; border:1px solid var(--rule); display:grid; place-items:center;
  color:var(--fg-dim); transition:background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease); }
.footer-social a:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.footer-social svg{ width:16px; height:16px; fill:currentColor; }
.footer-bottom{ border-top:1px solid var(--rule); padding:26px 0 34px; display:flex; flex-wrap:wrap;
  gap:14px; justify-content:space-between; align-items:center; }
.footer-bottom p{ font-size:12px; color:var(--fg-faint); margin:0; letter-spacing:.06em; }
.footer-bottom a:hover{ color:var(--amber); }

/* ==========================================================================
   REVEAL ON SCROLL
   ========================================================================== */
.rv{ opacity:0; transform:translateY(30px); }
.rv.is-in{ opacity:1; transform:none; transition:opacity .9s var(--ease), transform 1s var(--ease-out-expo); }
@media (prefers-reduced-motion:reduce){
  .rv{ opacity:1 !important; transform:none !important; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1500px){
  .nav-main{ gap:20px; }
  .nav-main a, .nav-main .drop-trigger{ font-size:11.5px; letter-spacing:.15em; }
  .brand__logo{ height:44px; }
  .site-header.is-stuck .brand__logo{ height:38px; }
}
@media (max-width:1280px){
  .header-phone{ display:none; }
  .nav-main{ gap:17px; }
  .nav-main a, .nav-main .drop-trigger{ font-size:11px; letter-spacing:.11em; }
  .header-cta .btn{ padding:12px 18px; font-size:10.5px; letter-spacing:.14em; }
}
@media (max-width:1024px){
  .nav-main{ display:none; }
  .hamburger{ display:block; }
  .header-cta .btn{ display:none; }
  .brand__logo{ height:46px; }
  .site-header.is-stuck .brand__logo{ height:40px; }
}
@media (max-width:640px){
  body{ font-size:16px; }
  .scroll-cue{ display:none; }
  .hero{ min-height:82vh; padding-top:150px; }
  .btn{ padding:16px 26px; }
  .btn-row .btn{ width:100%; }
  .mm-list > li > a, .mm-sub-trigger{ font-size:28px; }
}

/* ==========================================================================
   MALLARD BAY WIDGET DEFENSES — load-bearing, do not remove
   MB injects a Tailwind-flavored stylesheet + Emotion/Chakra runtime styles.
   ========================================================================== */
/* 1. .container hijack — we use .wrap everywhere, but belt-and-braces.
      NOTE: the !important here outranks .wrap--narrow on equal specificity,
      so the narrow modifier needs its own guarded rule below. */
.wrap{ max-width:var(--wrap) !important; }
.wrap.wrap--narrow{ max-width:var(--wrap-narrow) !important; }
.site-header > .wrap{ max-width:1560px !important; }
/* 2. body font/color/background forced above with !important */
/* 3. section washes forced above with !important */
/* 4. button styling — double-class specificity + explicit guards */
.mb_widget.btn.btn--primary{ background:var(--red) !important; color:#fff !important; border-color:var(--red) !important; }
.mb_widget.btn.btn--primary:hover{ background:var(--red-deep) !important; border-color:var(--red-deep) !important; }
.mb_widget.btn.btn--ghost{ background:transparent !important; color:var(--fg) !important; border-color:rgba(243,239,231,.34) !important; }
.mb_widget.btn.btn--ghost:hover{ background:var(--fg) !important; color:var(--ink) !important; }
.mb_widget.btn.btn--dark{ background:var(--ink) !important; color:var(--fg) !important; border-color:var(--ink) !important; }
.mb_widget.btn.btn--dark:hover{ background:var(--red) !important; border-color:var(--red) !important; color:#fff !important; }
.mb_widget.btn.btn--outline-dark{ background:transparent !important; color:var(--fg-dark) !important; border-color:rgba(23,19,16,.3) !important; }
.mb_widget.btn.btn--outline-dark:hover{ background:var(--ink) !important; color:var(--fg) !important; }
.mb_widget.btn{ font-family:var(--body) !important; text-transform:uppercase !important; border-radius:0 !important; }
/* 5. hero h1 collapse guard — set above on .hero h1 with !important */
/* 6. keep MB's injected containers from inheriting our uppercase display type */
.mb-widget-root, .mb-widget-root *{ text-transform:none; }

/* ============================================================
   DIRTY DUCK EXTENSIONS
   Secondary (30%) bronze application + components RH didn't need:
   Brands We Trust strip, pricing rows, club lockup.
   ============================================================ */

/* --- Secondary 30%: bronze carries borders, eyebrows, outline buttons --- */
.eyebrow{ color:var(--bronze); }
.eyebrow--muted{ color:var(--bronze); }
.card{ border-color:var(--bronze-dim); }
.btn--ghost{ border-color:var(--bronze); color:var(--fg); }
.btn--ghost:hover{ border-color:var(--red); color:var(--red-bright); background:rgba(212,118,42,.07); }
.feature__num{ color:var(--bronze); }
.card__eyebrow{ color:var(--bronze); }
.split__badge{ border-color:var(--bronze-dim); }

/* --- Brands We Trust --------------------------------------- */
/* Light chips: most partner marks are dark-on-transparent and disappear on ink. */
.brands{
  display:grid; gap:clamp(14px,2vw,22px);
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  align-items:stretch; margin-top:44px;
}
.brands a{
  display:grid; place-items:center; min-height:104px; padding:20px 18px;
  background:var(--bone-2); border:1px solid var(--bronze-dim);
  transition:border-color .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.brands a:hover{
  border-color:var(--red); transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(0,0,0,.34);
}
.brands img{
  max-width:100%; max-height:60px; width:auto; height:auto; object-fit:contain;
  opacity:.9; transition:opacity .35s var(--ease);
}
.brands a:hover img{ opacity:1; }
@media(max-width:600px){
  .brands{ grid-template-columns:repeat(2,1fr); }
  .brands a{ min-height:84px; padding:14px; }
  .brands img{ max-height:44px; }
}

/* --- Image-less cards (used where we have no honest photo yet) --- */
.card--plain .card__body{ padding-top:34px; }
.card--plain{ background:var(--ink-3); }
.spec{ list-style:none; margin:24px 0 0; padding:0; border-top:1px solid var(--rule); }
.spec li{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  padding:12px 0; border-bottom:1px solid var(--rule);
}
.spec span{
  font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--bronze);
}
.spec strong{
  font-family:var(--display); font-size:19px; letter-spacing:.03em;
  text-transform:uppercase; color:var(--fg); font-weight:400;
}

/* --- Pricing rows ------------------------------------------ */
.pricing{ list-style:none; margin:34px 0 0; padding:0; border-top:1px solid var(--rule); }
.pricing li{
  display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:10px 24px;
  padding:22px 0; border-bottom:1px solid var(--rule);
}
.pricing .pricing__name{
  font-family:var(--display); font-size:25px; letter-spacing:.02em;
  text-transform:uppercase; color:var(--fg); line-height:1.1;
}
.pricing .pricing__note{
  display:block; font-family:var(--body); font-size:12.5px; font-weight:500;
  letter-spacing:.13em; text-transform:uppercase; color:var(--bronze); margin-top:7px;
}
.pricing .pricing__amt{
  font-family:var(--display); font-size:32px; color:var(--red-bright);
  white-space:nowrap; line-height:1;
}
.pricing .pricing__amt sup{ font-size:.5em; top:-.62em; margin-right:3px; position:relative; }
.pricing .pricing__amt small{
  display:block; font-family:var(--body); font-size:11.5px; font-weight:500;
  letter-spacing:.13em; text-transform:uppercase; color:var(--fg-faint);
  margin-top:7px; text-align:right;
}
.section--light .pricing .pricing__name{ color:var(--fg-dark); }
.section--light .pricing .pricing__amt small{ color:var(--fg-dark-dim); }

/* --- Hunting Club lockup ----------------------------------- */
.club-lockup{ text-align:center; margin-bottom:clamp(30px,5vw,54px); }
.club-lockup img{
  width:clamp(150px,20vw,232px); height:auto; margin:0 auto 26px; display:block;
  filter:drop-shadow(0 18px 42px rgba(0,0,0,.55));
}
.club-band{ position:relative; overflow:hidden; }
.club-band::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(84% 62% at 50% 0%, rgba(212,118,42,.16), transparent 66%);
}
.club-band > *{ position:relative; z-index:1; }

/* --- Membership inquiry band ------------------------------- */
.inquire{ max-width:660px; margin:34px auto 0; text-align:center; }

/* --- Final QA pass (rendered-review fixes) ----------------- */
/* 7 partner marks in an auto-fit grid orphaned the last one; flex-center instead. */
.brands{ display:flex; flex-wrap:wrap; justify-content:center; }
.brands a{ flex:1 1 160px; max-width:220px; }
@media(max-width:600px){ .brands a{ flex:1 1 calc(50% - 14px); max-width:none; } }

/* Spec lists pin to the card bottom so uneven copy lengths still line up. */
.card--plain .card__body{ display:flex; flex-direction:column; height:100%; }
.card--plain .spec{ margin-top:auto; }

/* Heroes over pale dawn skies need a touch more scrim for white type. */
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(8,6,5,.80) 0%, rgba(8,6,5,.52) 46%, rgba(8,6,5,.26) 100%);
}

/* ============================================================
   ROUND 2 — review fixes
   ============================================================ */

/* --- Accordion on dark bands ------------------------------
   .faq-q / .faq-a were authored for light sections (--fg-dark ink).
   On section--dark / --deep / --raised that rendered near-black on
   near-black. Re-tint per surface instead of globally.            */
.section--dark .faq-item,
.section--deep .faq-item,
.section--raised .faq-item{ border-bottom-color:var(--rule); }

.section--dark .faq-q,
.section--deep .faq-q,
.section--raised .faq-q{ color:var(--fg); }

.section--dark .faq-q:hover,
.section--deep .faq-q:hover,
.section--raised .faq-q:hover{ color:var(--red-bright); }

.section--dark .faq-q[aria-expanded="true"],
.section--deep .faq-q[aria-expanded="true"],
.section--raised .faq-q[aria-expanded="true"]{ color:var(--red-bright); }

.section--dark .faq-a > div,
.section--deep .faq-a > div,
.section--raised .faq-a > div{ color:var(--fg-dim); }

/* light-band accordion keeps ink, but gets the same hover affordance */
.section--light .faq-q:hover,
.section--light .faq-q[aria-expanded="true"]{ color:var(--red-deep); }

.faq-q__t{ flex:1 1 auto; min-width:0; }
.faq-q .ind{ margin-left:auto; }

/* --- Ghost buttons on light bands -------------------------
   .btn--ghost is near-white type by design (built for dark sections).
   On --bone it vanished. Any ghost inside a light band reads as ink.  */
.section--light .btn.btn--ghost,
.section--light-2 .btn.btn--ghost{
  color:var(--fg-dark); border-color:rgba(23,19,16,.34);
}
.section--light .btn.btn--ghost:hover,
.section--light-2 .btn.btn--ghost:hover{
  background:var(--ink); color:var(--fg); border-color:var(--ink);
}
/* and the explicit dark-outline variant used on the About page */
.section--light .btn.btn--outline-dark{ color:var(--fg-dark); border-color:rgba(23,19,16,.34); }
.section--light .btn.btn--outline-dark:hover{ background:var(--ink); color:var(--fg); border-color:var(--ink); }

/* --- Fixed photo grid: 3 across, 2 rows -------------------- */
.photo-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(10px,1.4vw,18px); margin-top:8px;
}
.photo-grid figure{ margin:0; overflow:hidden; background:var(--ink-3); }
.photo-grid img{
  display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover;
  cursor:zoom-in; transition:transform .7s var(--ease), opacity .4s var(--ease);
}
.photo-grid figure:hover img{ transform:scale(1.045); }
@media(max-width:860px){ .photo-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .photo-grid{ grid-template-columns:1fr; } }

/* --- Logo sizing for the new circular badge ---------------- */
.brand__logo{ height:62px !important; }
.site-header.is-stuck .brand__logo{ height:50px !important; }
.footer-brand__logo{ height:76px; width:auto; }
@media(max-width:820px){ .brand__logo{ height:50px !important; } }

/* 7 partner marks: 4 + 3 centred beats 6 + 1 orphan. */
.brands{ gap:clamp(12px,1.4vw,18px); }
.brands a{ flex:0 1 calc(25% - 14px); max-width:none; }
@media(max-width:900px){ .brands a{ flex:0 1 calc(33.333% - 14px); } }
@media(max-width:600px){ .brands a{ flex:0 1 calc(50% - 10px); } }