/* ==========================================================================
   Hindsight Farms  -  main.css v2  (the ONLY stylesheet)  "An Estate Book"
   Evolves the v1 system per V2-CONCEPT.md. FROZEN after the Home build:
   interior pages use what is here, one-offs live in a marked page block.
   Order: 1) design tokens  2) reset + base  3) typography (incl. chapter
          opener, small caps meta, statement, pull-line)  4) layout (splits,
          crossing media + the one L1 shadow, plate)  5) buttons
          6) header/nav  7) footer  8) hero (100svh + scroll cue)
          9) page-header  10) stat band  11) cards, spec list, LEDGER
          12) trainer block  13) photo grid  14) placeholder block
          15) video block  16) full-bleed break  17) form  18) map frame
          19) scrub band (the scroll moment)  20) wipe reveal
          21) CTA bands (solid strip + dark texture band)  22) utilities
          (double rules, skip link, panel, contact grid, 404)
          23) responsive nav  24) motion: scroll reveal, first-load entrance,
          in-view video, reduced-motion kill switches  25) depth: ghost bit,
          matted print, photo surfaces  26) page patterns: drop cap, draft
          block, gallery grid
   Fonts (Cormorant Garamond + Inter) load via Google Fonts in the head.
   Held to DESIGN.md + V2-CONCEPT.md: light theme only, sharp corners
   (2px on buttons alone), one accent (tan), no gradients beyond the hero
   scrim, hovers 150ms. The ONLY shadow on the site is the single L1
   media-overlap shadow on the one boundary-crossing image per page.
   ========================================================================== */

/* 1) DESIGN TOKENS ---------------------------------------------------------- */
:root {
  /* palette (sampled from the real logo) */
  --bark:      #563b26;   /* headings, logo, footer, primary buttons */
  --tan:       #b9946a;   /* accents as SURFACES: rules, frames, dividers */
  --tan-light: #e6caa9;   /* subtle backgrounds, borders on cream, labels on dark */
  --cream:     #efe3d6;   /* alternate section backgrounds, cards */
  --paper:     #faf7f2;   /* default page background, photo mats */
  --ink:       #241b12;   /* body text */
  --stone:     #6d655b;   /* captions, meta text (5.4:1 on paper, 4.5:1 on cream) */

  /* derived, kept inside the palette family */
  --bark-deep: #3f2b1b;   /* button hover, duotone shadow end, texture-band overlay */
  --tan-deep:  #80603c;   /* the tan hue at text weight: eyebrow-size text on light
                             grounds only (5.4:1 paper / 4.6:1 cream); dark grounds
                             keep tan-light for labels */
  --line:      rgba(86, 59, 38, .18);   /* hairline rules on light backgrounds */
  --line-cream:rgba(239, 227, 214, .28);/* hairline rules on bark backgrounds */
  --rule-tan:  rgba(185, 148, 106, .35);/* the double hairline rules, tan at ~35% */
  --scrim-flat:rgba(36, 27, 18, .52);   /* flat wash for text over photos (never a gradient) */
  --cross:     clamp(48px, 5vw, 72px);  /* how far the one crossing image per page
                                           overlaps a band seam (L1) */
  --shadow-l1: 0 16px 40px rgba(36, 27, 18, .10); /* the deepest lift, spent on
                                           the L1 crossing image */
  /* depth pass (2026-07-20, Buster's "add real depth without AI tells" ask):
     restrained warm shadows, matted-print soft, card elevation gentle, header
     depth on scroll. All low-alpha, no glows, no gradients. */
  --shadow-soft:    0 10px 28px rgba(36, 27, 18, .07);  /* matted prints */
  --shadow-soft-sm: 0 4px 14px rgba(36, 27, 18, .05);   /* card resting lift */
  --shadow-card:    0 12px 26px rgba(36, 27, 18, .10);  /* card hover lift */
  --shadow-header:  0 8px 22px rgba(36, 27, 18, .16);   /* solid / scrolled header */
  --board:          rgba(36, 27, 18, .60);              /* translucent board over photos */

  /* type families */
  --font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* fluid type scale (V2: the estate-book register)
     display 44 to 104, chapter 32 to 56, h3 20 to 28, body 17, small 14,
     eyebrow 12 caps, meta small caps 13 */
  --fs-display: clamp(2.25rem, 1.45rem + 3.9vw, 5rem);    /* 36 -> 80  (G1 density) */
  --fs-2: clamp(1.7rem, 1.28rem + 1.9vw, 2.75rem);        /* 27 -> 44  (G1 density) */
  --fs-3: clamp(1.15rem, 1.06rem + 0.6vw, 1.5rem);        /* 18 -> 24  (G1 density) */
  --fs-4: clamp(1.125rem, 1.03rem + 0.4vw, 1.25rem);      /* 18 -> 20, leads */
  --fs-body: 1.0625rem;                                   /* 17 */
  --fs-small: 0.875rem;                                   /* 14 */
  --fs-meta: 0.8125rem;                                   /* 13, small-caps meta */
  --fs-eyebrow: 0.75rem;                                  /* 12 */

  /* spacing + layout (8pt scale) */
  --container: 1280px;
  --gutter: clamp(20px, 5vw, 64px);
  --section-y: clamp(40px, 3vw + 26px, 88px);             /* G1 density: was 72->160,
                                                             then 46->100; tightened
                                                             2026-08-28 so the bands
                                                             sit closer together */
  --measure: 65ch;
  --header-h: 72px;

  --radius: 2px;         /* the "slightly rounded edges" nod, buttons only */
  --ease: 150ms ease;
}

/* 2) RESET + BASE ----------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html {
  -webkit-text-size-adjust: 100%;
  /* Lining figures site-wide (2026-09-30): Cormorant's default old-style
     figures made "01 / 29" read as "OI / 29" and blurred arena dimensions. */
  font-variant-numeric: lining-nums;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 12px);
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;   /* guard against accidental horizontal overflow. clip, not hidden: hidden turns <body> into the scroll container, which stops window scroll tracking (breaks GSAP ScrollTrigger scrubbing and header-on-scroll). clip crops the same overflow without creating a scroller. */
}

img, video, iframe, svg, canvas { display: block; max-width: 100%; }
img, video { height: auto; }
picture { display: contents; }

a { color: var(--bark); text-decoration: none; }
a:hover { color: var(--tan-deep); }
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--bark);
  outline-offset: 2px;
}
/* focus rings on dark grounds swap to cream so they keep 3:1
   (.hero added during the Home build: its buttons sit on dark footage,
   where the bark ring measured under 3:1) */
.site-header a:focus-visible, .site-header button:focus-visible,
.site-footer a:focus-visible, .mobile-nav a:focus-visible,
.mobile-nav button:focus-visible, .cta-strip a:focus-visible,
.hero a:focus-visible {
  outline-color: var(--cream);
}

::selection { background: var(--tan-light); color: var(--ink); }

/* 3) TYPOGRAPHY ------------------------------------------------------------- */
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 600; line-height: 1.1; color: var(--bark); }

.display        { font-family: var(--font-display); font-weight: 600; line-height: 1.06; color: var(--bark); letter-spacing: -0.005em; }
.display--md    { font-size: var(--fs-3); }
/* the italic accent phrase: ONE phrase inside a display heading, never two */
.display em, .display i { font-style: italic; font-weight: 500; }

.eyebrow {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-eyebrow);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tan-deep);
  margin-bottom: 0.9rem;
}
/* chapter eyebrow: "No. 01 · The riding". The "No. 01" piece is Cormorant
   italic (the engraved numeral), the rest stays Inter caps. Chapter counts
   restart at 01 on every page. Never an oversized ghost numeral; this small
   chapter form is the whole idea.
   <p class="eyebrow"><span class="eyebrow__num">No. 01</span> &middot; The riding</p> */
.eyebrow__num {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 1.5em;
  line-height: 1;
  letter-spacing: 0.06em;
  text-transform: none;
}

/* ceremonial small caps (Cormorant at the engraving register): one-line
   moments only (hero meta, photo captions, footer address, scroll cue).
   Never a full paragraph. */
.smallcaps {
  font-family: var(--font-display);
  font-variant-caps: small-caps;
  font-weight: 500;
  font-size: var(--fs-meta);
  letter-spacing: 0.18em;
}


/* the pull-line band (Y1): one huge italic Cormorant fact set alone between
   double rules. One per Home; at most one per interior page, and only when a
   verifiable fact fits. Facts from inputs only, no coined taglines. */
.pullband { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.pullband .rule { margin-block: 0; }
.pull-line {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(2rem, 1.05rem + 3.5vw, 4rem);     /* ~32 -> 64  (G1 density) */
  line-height: 1.08;
  color: var(--bark);
  text-align: center;
  padding-block: clamp(1.75rem, 4vw, 2.75rem);
}

.lead { font-size: var(--fs-4); color: var(--ink); max-width: var(--measure); }
.prose { max-width: var(--measure); }
.prose p + p { margin-top: 1.1rem; }
/* inline links inside body copy get a tan underline so they read as links
   (global anchors are underline-free). Hover thickens the underline instead
   of flashing colour. */
.prose a { color: var(--bark); text-decoration: underline; text-decoration-color: var(--tan); text-decoration-thickness: 1px; text-underline-offset: 3px; transition: text-decoration-thickness var(--ease); }
.prose a:hover { color: var(--bark); text-decoration-color: var(--tan); text-decoration-thickness: 2px; }

.meta { font-size: var(--fs-small); color: var(--stone); }

/* chapter opener: eyebrow + chapter display + short double rule. This is the
   sectionhead of v1 grown into the book's chapter furniture; the rule div is
   part of the opener's anatomy (the full-width .rule stays reserved for major
   moves like the pull-line band). */
.sectionhead { max-width: 46ch; margin-bottom: clamp(1.25rem, 2.1vw, 1.9rem); }
.sectionhead .display { font-size: var(--fs-2); }
.sectionhead--center { max-width: 40ch; margin-inline: auto; text-align: center; }
/* the short double hairline under a chapter opener (1px + 3px gap + 1px) */
.sectionhead__rule {
  width: 96px; height: 5px;
  border-top: 1px solid var(--rule-tan);
  border-bottom: 1px solid var(--rule-tan);
  margin-top: clamp(1.1rem, 2vw, 1.5rem);
}
.sectionhead--center .sectionhead__rule { margin-inline: auto; }

/* 4) LAYOUT ----------------------------------------------------------------- */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.section { padding-block: var(--section-y); }
.section--cream { background: var(--cream); }
.section--paper { background: var(--paper); }

/* editorial two-column row: image beside text, alternating */
.split {
  display: grid;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
@media (min-width: 768px) {
  .split { grid-template-columns: 1fr 1fr; }
  
  /* asymmetric splits (L2): exactly two ratios, 58/42 and 42/58, named by the
     media column's share so reverse rows stay legible. 1.38fr : 1fr = 58 : 42. */
  .split--media-58 { grid-template-columns: 1.38fr 1fr; }
      
    
  /* the RECEIVING band needs its own leading edge to clear the print that now
     hangs into it: --section-y and --cross grow at almost the same rate with
     the viewport, so a band padded only by --section-y lets the crossing image
     land on its first line (measured: the Home CTA heading collided by 6px at
     1440). Padding the receiving edge to --cross plus one 24px breath keeps a
     constant gap at every width. Home's CTA band is the site's one receiver;
     it collapses back to --section-y below 768px, where nothing crosses. */
  .page--home .cta-band { padding-top: calc(var(--cross) + 1.5rem); }
}

/* framed plate (L3): one hairline frame around a whole split composition,
   like a plate in a book. ONE per page maximum, on the page's most
   important block. */
.plate { border: 1px solid var(--tan); padding: clamp(1.25rem, 4vw, 3rem); }


/* 5) BUTTONS ---------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5em;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1;
  padding: 0.95em 1.6em;
  min-height: 44px;
  border: 1px solid var(--bark);
  border-radius: var(--radius);
  cursor: pointer;
  transition: background-color var(--ease), color var(--ease), border-color var(--ease);
}
.btn--primary   { background: var(--bark); color: #fff; }
.btn--primary:hover { background: var(--bark-deep); border-color: var(--bark-deep); color: #fff; }
.btn--primary:active { background: var(--ink); border-color: var(--ink); }
.btn--secondary { background: transparent; color: var(--bark); }
.btn--secondary:hover { background: var(--bark); color: #fff; }
.btn--secondary:active { background: var(--bark-deep); border-color: var(--bark-deep); color: #fff; }

/* compact button, for boxed CTAs sitting inside cards and tight blocks
   (Milan revision round 1: line-style links become boxes site-wide) */
.btn--sm { font-size: calc(var(--fs-small) * 0.92); padding: 0.7em 1.15em; min-height: 38px; }

/* light-context buttons, for use over dark heroes / bands / footers */
.btn--on-dark.btn--primary { background: var(--cream); color: var(--bark); border-color: var(--cream); }
.btn--on-dark.btn--primary:hover { background: #fff; border-color: #fff; color: var(--bark); }
.btn--on-dark.btn--secondary { color: var(--cream); border-color: var(--cream); background: transparent; }
.btn--on-dark.btn--secondary:hover { background: var(--cream); color: var(--bark); }

.btn-row { display: flex; flex-wrap: wrap; gap: 1rem; }
/* a button row directly after prose gets its own air (mirrors .prose + .speclist) */
.prose + .btn-row { margin-top: 1.75rem; }

/* 6) HEADER + NAV ----------------------------------------------------------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 60;
  height: var(--header-h);
  display: flex; align-items: center;
  transition: background-color var(--ease), border-color var(--ease), box-shadow var(--ease);
  border-bottom: 1px solid transparent;
}
.site-header__inner {
  width: 100%; max-width: var(--container);
  margin-inline: auto; padding-inline: var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.site-header__logo { display: inline-flex; align-items: center; }
.site-header__logo img { height: 46px; width: auto; }

/* Shared solid state: interior pages and Home after the hero. */
.site-header--solid,
.site-header--over-hero.is-scrolled {
  background: rgba(63, 43, 27, .84);
  border-bottom-color: rgba(239, 227, 214, .16);
  box-shadow: 0 5px 16px rgba(36, 27, 18, .12);
  -webkit-backdrop-filter: blur(12px) saturate(105%);
  backdrop-filter: blur(12px) saturate(105%);
}
/* transparent variant: over the Home hero. It carries a quiet flat scrim (a
   translucent wash, not a gradient) so the logo and nav read over bright sky;
   it turns solid, with the same soft depth, once scrolled. */
.site-header--over-hero { background: rgba(36, 27, 18, .24); border-bottom-color: rgba(239, 227, 214, .10); }

/* desktop nav */
.nav { display: flex; align-items: center; gap: clamp(1rem, 2.4vw, 2.1rem); }
.nav__link, .nav__soon-item {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 500;
  letter-spacing: 0.03em;
  color: var(--cream);
}
.nav__link { transition: color var(--ease); }
.nav__link:hover, .nav__link[aria-current="page"] { color: var(--tan-light); }
.nav__link[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; text-decoration-color: var(--tan); }
.nav__contact { margin-left: 0.4rem; }

/* hamburger */
.nav-toggle {
  display: none;
  width: 44px; height: 44px;
  background: transparent; border: 0; cursor: pointer;
  align-items: center; justify-content: center;
}
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after {
  content: ""; display: block; width: 24px; height: 2px; background: var(--cream); position: relative;
}
.nav-toggle__bars::before { position: absolute; top: -7px; }
.nav-toggle__bars::after  { position: absolute; top: 7px; }

/* mobile drawer. Sits ABOVE the header (65 vs 60): its close button occupies
   the same 44px box as the hamburger, so the drawer must cover the header for
   the close control to be visible and clickable. */
.mobile-nav {
  position: fixed; inset: 0; z-index: 65;
  background: var(--bark);
  padding: calc(var(--header-h) + 24px) var(--gutter) 40px;
  display: flex; flex-direction: column; gap: 0.35rem;
  transform: translateY(-100%);
  visibility: hidden;
  transition: transform 220ms ease, visibility 220ms ease;
}
.mobile-nav.is-open { transform: translateY(0); visibility: visible; }
/* 2026-09-30: the short-screen fix that About, History and Facilities each
   carried now lives here, so every page's drawer scrolls instead of cutting
   off Trainers, Gallery and Contact on small or sideways phones. */
.mobile-nav { overflow-y: auto; overscroll-behavior: contain; }
.mobile-nav a, .mobile-nav span.nav__soon-item {
  font-family: var(--font-display);
  font-size: 1.75rem;
  color: var(--cream);
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--line-cream);
  flex-shrink: 0;
  min-height: 44px;
}
.mobile-nav .btn { margin-top: 1.5rem; align-self: flex-start; }
/* The drawer's Contact button matches the header button: Inter, padded on
   all sides, full border (the link rule above had stripped its side padding). */
.mobile-nav a.btn {
  font-family: var(--font-body);
  font-size: 1rem;
  letter-spacing: .04em;
  padding: .85rem 1.75rem;
  border-bottom: 1px solid var(--cream);
}
@media (max-height: 640px) {
  .mobile-nav { padding-top: calc(var(--header-h) + .75rem); padding-bottom: 1.5rem; gap: .25rem; }
  .mobile-nav a { padding-block: .375rem; font-size: 1.5rem; line-height: 1.25; }
  .mobile-nav a.btn { font-size: 1rem; padding: .75rem 1.5rem; }
  .mobile-nav .btn { margin-top: 1rem; }
}
.mobile-nav__close {
  position: absolute; top: 14px; right: var(--gutter);
  width: 44px; height: 44px; background: transparent; border: 0; cursor: pointer; color: var(--cream);
  font-size: 1.75rem; line-height: 1;
}
/* lock scroll while the mobile drawer is open. the :has() half locks the root
   scroller (the window/documentElement), needed now that <body> is no longer the
   scroll container; the body half stays as a belt-and-suspenders fallback. */
body.nav-open, html:has(body.nav-open) { overflow: hidden; }

/* 7) FOOTER ----------------------------------------------------------------- */
.site-footer { background: var(--bark); color: var(--cream); padding-block: clamp(48px, 7vw, 88px); position: relative; overflow: hidden; }
.site-footer > .container { position: relative; z-index: 1; }
.site-footer a { color: var(--cream); }
.site-footer a:hover { color: var(--tan-light); }
.site-footer__grid {
  display: grid; gap: 2.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .site-footer__grid { grid-template-columns: 1.4fr 1fr 1fr; }
}
.site-footer__logo img { height: 58px; width: auto; margin-bottom: 1.25rem; }
.site-footer__tagline { color: var(--tan-light); max-width: 34ch; font-size: var(--fs-small); }
/* tan-light, not tan: 12px headings on the bark ground need 4.5:1 */
.footer-col h3 { font-family: var(--font-body); font-size: var(--fs-eyebrow); letter-spacing: 0.14em; text-transform: uppercase; color: var(--tan-light); margin-bottom: 1rem; font-weight: 500; }
.footer-col p, .footer-col address { font-style: normal; font-size: var(--fs-small); line-height: 1.9; color: var(--cream); }
/* Explore-column links each sit on their own line; scoped to the list under a
   column heading, so the logo anchor in the first column is untouched */
.footer-col h3 ~ a { display: block; }
/* the footer address is one of the page's small-caps moments */
.footer-col address .smallcaps { font-size: var(--fs-small); letter-spacing: 0.16em; }
/* base row sits under a double hairline rule, engraved-stationery style */
.site-footer__base {
  margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line-cream);
  display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; justify-content: space-between;
  font-size: var(--fs-small); color: var(--tan-light);
  position: relative;
}
.site-footer__base::before {
  content: ""; position: absolute; top: 4px; left: 0; right: 0;
  height: 1px; background: var(--line-cream);
}
.site-footer__legal {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .5rem 1.25rem;
}
.site-footer__legal a {
  color: var(--tan-light);
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 4px;
}
.site-footer__legal a:hover,
.site-footer__legal a[aria-current="page"] {
  color: var(--cream);
  text-decoration-color: var(--tan);
}

/* 8) HERO ------------------------------------------------------------------- */
/* Home: the full film frame. 100svh with a 100vh fallback; interior pages
   use the page-header instead. */
.hero { position: relative; display: flex; min-height: 86vh; min-height: 86svh; overflow: hidden; }
.hero__media { position: absolute; inset: 0; z-index: 0; }
.hero__media img, .hero__media video { width: 100%; height: 100%; object-fit: cover; }
/* dark scrim so cream text always reads over footage: the site's ONE gradient */
.hero__scrim { position: absolute; inset: 0; z-index: 1; background:
  linear-gradient(to top, rgba(36,27,18,.72) 0%, rgba(36,27,18,.30) 45%, rgba(36,27,18,.18) 100%); }
.hero__inner { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end;
  width: 100%; max-width: var(--container); margin-inline: auto;
  padding: calc(var(--header-h) + 2.5rem) var(--gutter) clamp(3.5rem, 8vh, 7rem); }
/* the ch cap lives on the title (display size), not the wrapper: on the
   wrapper it resolved against 17px Inter (~187px) and stacked the headline
   one word per line. Fixed during the Home build, 2026-07-12. */
.hero__content { max-width: 62rem; }
/* Hero display runs a notch smaller than --fs-display (2026-07-23, Buster's
   call): the full 104px read loud rather than expensive. Restraint is the
   premium signal, so the home headline tops out at 80px with more air around
   it. --fs-display itself is untouched, so interior page headers are unaffected. */
.hero__title { color: var(--cream); font-size: clamp(2.5rem, 1.5rem + 4.1vw, 5rem); max-width: 22ch; letter-spacing: -0.005em; }
.hero__title em { font-style: italic; font-weight: 500; }
.hero__sub { color: var(--cream); font-size: var(--fs-4); max-width: 44ch; margin-top: 1.25rem; }
.hero .btn-row { margin-top: 2rem; }
/* 9) PAGE-HEADER (interior title band) -------------------------------------- */
/* eyebrow + display h1 + lead over cream; the bottom edge is a double
   hairline rule; overflow hidden crops the ghost bit at the band edge so it
   can never cause sideways scroll */
.page-header { background: var(--cream); position: relative; overflow: hidden; padding-top: calc(var(--header-h) + clamp(2.5rem, 6vw, 5rem)); padding-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.page-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px;
  border-top: 1px solid var(--rule-tan); border-bottom: 1px solid var(--rule-tan);
  pointer-events: none;
}
.page-header__inner { max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); position: relative; z-index: 1; }
.page-header .display { font-size: clamp(2.5rem, 1.8rem + 3vw, 4.75rem); max-width: 16ch; }
.page-header .lead { margin-top: 1.5rem; }

/* Interior pages keep the estate-book character at a more restrained scale.
   Home is intentionally excluded so its established cinematic hierarchy is
   unchanged. Sub-item headings retain their smaller existing size. */
.page--solid .sectionhead:not(.sectionhead--sub) > .display {
  font-size: clamp(1.875rem, 1.35rem + 2vw, 3rem);
}

/* ABOUT OPENING (2026-09-08): a full-width aerial banner establishes the
   page, followed by a compact introduction on cream. */
.page--about .about-opening {
  padding: var(--header-h) 0 0;
}
.page--about .about-opening::after { display: none; }
.about-opening__stage {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: clamp(30rem, 40vw, 35rem);
  overflow: hidden;
  background: var(--bark-deep);
}
.about-opening__media,
.about-opening__wash {
  position: absolute;
  inset: 0;
}
.about-opening__media { display: block; z-index: 0; }
.about-opening__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 75%;
}
.about-opening__wash {
  z-index: 1;
  background: linear-gradient(90deg, rgba(36, 27, 18, .80) 0%, rgba(36, 27, 18, .72) 50%, rgba(36, 27, 18, .58) 64%, rgba(36, 27, 18, .14) 82%, rgba(36, 27, 18, .02) 100%);
}
.about-opening__title {
  position: relative;
  z-index: 2;
  width: 100%;
  min-width: 0;
  padding-block: 4rem 5rem;
}
.page--about .about-opening .eyebrow {
  color: var(--cream);
  margin-bottom: 1.25rem;
}
.page--about .about-opening .display {
  max-width: 16ch;
  color: var(--cream);
  font-size: clamp(3rem, 2.15rem + 3.6vw, 5.5rem);
  line-height: .98;
  font-weight: 500;
  letter-spacing: -.015em;
}
.about-opening__title .display span { display: block; }
.about-opening__location {
  position: absolute;
  z-index: 2;
  right: var(--gutter);
  bottom: 1.5rem;
  max-width: calc(100% - 2 * var(--gutter));
  margin: 0;
  padding: .4rem .6rem;
  background: rgba(36, 27, 18, .76);
  color: var(--cream);
  font-size: .6875rem;
  line-height: 1.5;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.about-opening__intro {
  padding-block: clamp(2rem, 3.5vw, 3rem);
  background: var(--cream);
}
.page--about .about-opening__intro::after {
  content: "";
  display: block;
  width: 3rem;
  height: 1px;
  margin: 1.35rem auto 0;
  background: var(--tan);
}
.page--about .about-opening .lead {
  margin: 0 auto;
  max-width: 46ch;
  font-family: var(--font-display);
  font-weight: 500;
  color: var(--bark);
  text-align: center;
  text-wrap: balance;
  font-size: clamp(1.5rem, 1.2rem + .75vw, 1.75rem);
  line-height: 1.38;
}
@media (max-width: 599px) {
  .about-opening__stage {
    min-height: 27rem;
    align-items: flex-start;
  }
  .about-opening__media img { object-position: 60% center; }
  .about-opening__wash {
    background: linear-gradient(180deg, rgba(36, 27, 18, .78) 0%, rgba(36, 27, 18, .67) 52%, rgba(36, 27, 18, .22) 78%, rgba(36, 27, 18, .02) 100%);
  }
  .about-opening__title { padding-block: 3rem 5rem; }
  .page--about .about-opening .eyebrow { margin-bottom: 1rem; }
  .about-opening__location { bottom: 1rem; }
}
.page--about .section { padding-block: clamp(4rem, 7vw, 6.5rem); }
.page--about .statband { padding-block: clamp(2rem, 4vw, 3rem); }


/* About's History chapter is one wide photographic field with a paper panel
   crossing into it. The picture stays visible as place and atmosphere while
   the panel keeps the section about the people and the timeline. */
.page--about .about-history { padding-block: clamp(3rem, 5vw, 4.75rem); }
.about-history__frame {
  display: grid;
  min-height: clamp(440px, 44vw, 560px);
}
.about-history__media,
.about-history__panel { grid-area: 1 / 1; }
.about-history__media {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(128, 96, 60, .48);
  box-shadow: var(--shadow-soft);
}
.about-history__media picture {
  display: block;
  position: absolute;
  inset: -24px;
}
.about-history__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: translate3d(0, var(--history-shift, 0px), 0) scale(1.04);
  filter: saturate(.82) contrast(.96);
}
.about-history__media figcaption,
.about-team__media figcaption {
  position: absolute;
  z-index: 2;
  right: 1rem;
  bottom: .8rem;
  padding: .3rem .55rem;
  background: rgba(36, 27, 18, .68);
  color: var(--cream);
  font-size: .72rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.about-history__panel {
  align-self: center;
  justify-self: start;
  position: relative;
  z-index: 2;
  width: min(47%, 560px);
  margin-left: clamp(1.5rem, 4vw, 4rem);
  padding: clamp(2rem, 4vw, 3.75rem);
  background: rgba(250, 247, 242, .93);
  border: 1px solid rgba(128, 96, 60, .6);
  box-shadow: var(--shadow-l1);
}
.about-history__panel .display { max-width: none; text-wrap: balance; }
.about-history__panel .prose { max-width: 48ch; }
.about-history__media.is-parallax img { will-change: transform; }

.about-team__media {
  position: relative;
  min-width: 0;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 1px solid rgba(128, 96, 60, .55);
  background: var(--cream);
  box-shadow: var(--shadow-soft);
}
.about-team__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  transform: translate3d(0, var(--team-shift), 0) scale(var(--team-scale));
}

@media (min-width: 900px) {
    .about-team__media {
    aspect-ratio: auto;
    height: clamp(520px, calc(100svh - var(--header-h) - 56px), 680px);
  }
  }

@media (min-width: 900px) and (prefers-reduced-motion: no-preference) {
    .about-team__media.is-parallax img { will-change: transform; }
        }

@media (max-width: 767px) {
  .about-history__frame { display: block; min-height: 0; }
  .about-history__media { min-height: 280px; }
  .about-history__media picture { inset: -12px; }
  .about-history__media img { transform: scale(1.03); }
  .about-history__media figcaption { top: .8rem; bottom: auto; }
  .about-history__panel {
    width: auto;
    margin: -2.5rem 1rem 0;
    padding: 2rem 1.5rem;
    background: rgba(250, 247, 242, .97);
  }
  }

/* ABOUT PHONE REFINEMENT (2026-09-09): a readable stacked history card,
   shorter gaps, and generous main-page touch targets. Desktop stays intact. */
@media (max-width: 899px) {
  .page--about .mobile-nav {
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .page--about .mobile-nav a { flex-shrink: 0; min-height: 44px; }
}
@media (max-width: 767px) {
  .page--about .about-opening__intro { padding-block: 2rem 1.75rem; }
  .page--about .about-opening .lead {
    font-size: clamp(1.5rem, 1.1rem + 1.6vw, 1.625rem);
  }
  .page--about .about-opening__intro::after { margin-top: 1.25rem; }
  .page--about .about-history { padding-block: 1.5rem 2.5rem; }
  .page--about .about-ride,
  .page--about .about-team-section,
  .page--about .cta-band { padding-block: 2.5rem; }
  .page--about .about-history__media {
    min-height: 0;
    aspect-ratio: 3 / 2;
    box-shadow: none;
  }
  .page--about .about-history__media picture { inset: 0; }
  .page--about .about-history__media img { transform: none; }
  .page--about .about-history__media figcaption {
    top: auto;
    right: .75rem;
    bottom: .75rem;
  }
  .page--about .about-history__panel {
    width: 100%;
    margin: 0;
    padding: 1.5rem 1.25rem;
    border-top: 0;
    background: var(--paper);
    box-shadow: none;
  }
  .page--about .about-history__panel .prose,
  .page--about .about-ride .prose,
  .page--about .about-team__chapter .prose {
    max-width: none;
    font-size: 1.0625rem;
    line-height: 1.6;
  }
  .page--about .about-history__panel .display,
  .page--about .about-ride .display,
  .page--about .about-team__chapter .display,
  .page--about .about-team__subhead {
    max-width: none;
    text-wrap: balance;
  }
        .page--about main .btn-row {
    flex-direction: column;
    align-items: stretch;
    gap: .75rem;
    margin-top: 1.5rem;
  }
  .page--about main .btn {
    width: 100%;
    min-height: 48px;
    padding-inline: 1rem;
    line-height: 1.3;
  }
}
@media (max-width: 599px) {
  .page--about .about-opening__stage { min-height: clamp(24rem, 70vw, 26rem); }
  .page--about .about-opening__title { padding-block: 2.5rem 4.5rem; }
  .page--about .about-opening .display {
    max-width: none;
    font-size: clamp(2.25rem, 10.8vw, 2.75rem);
    line-height: 1.02;
  }
}
@media (max-width: 899px) and (max-height: 640px) {
  .page--about .mobile-nav {
    padding-top: calc(var(--header-h) + .75rem);
    padding-bottom: 1.5rem;
    gap: .25rem;
  }
  .page--about .mobile-nav a {
    padding-block: .375rem;
    font-size: 1.5rem;
    line-height: 1.25;
  }
  .page--about .mobile-nav .btn { margin-top: 1rem; }
}

/* ABOUT PHONE SWIPE TRIAL (2026-09-09) retired 2026-10-01: phones use the stacked rows. */

/* 10) STAT BAND ------------------------------------------------------------- */
/* 2x2 by default; 4-across only once it comfortably fits (>=1100px). */
.statband { background: var(--paper); border-block: 1px solid var(--line); padding-block: clamp(2.5rem, 5vw, 4rem); }
.stat { text-align: center; position: relative; padding-inline: 0.5rem; }
@media (min-width: 1100px) { .stat + .stat::before { content: ""; position: absolute; left: 0; top: 10%; height: 80%; width: 1px; background: var(--line); } }

/* 11) CARDS, SPEC LIST, LEDGER ---------------------------------------------- */
/* card: cream/paper, 1px tan inset frame, sharp corners, NO shadow.
   Hover adds a layer instead of a glow: border steps to bark, a second
   hairline frame fades in 6px inside the edge, the card lifts 2px. The lift
   uses the separate translate property so it never fights the reveal
   animation's transform. */
.card {
  background: var(--paper);
  border: 1px solid var(--tan);
  padding: clamp(1.5rem, 3vw, 2.25rem);
  position: relative;
  box-shadow: var(--shadow-soft-sm);   /* resting elevation (depth pass) */
  transition: background-color var(--ease), border-color var(--ease), translate var(--ease), box-shadow var(--ease);
}
.card::after {
  content: ""; position: absolute; inset: 6px;
  border: 1px solid var(--tan);
  opacity: 0;
  transition: opacity var(--ease);
  pointer-events: none;
}
.card:hover { border-color: var(--bark); translate: 0 -2px; box-shadow: var(--shadow-card); }
.card:hover::after { opacity: 1; }
.card__eyebrow { font-size: var(--fs-eyebrow); letter-spacing: 0.14em; text-transform: uppercase; color: var(--tan-deep); font-weight: 500; margin-bottom: 0.75rem; }
.card__title { font-family: var(--font-display); font-size: var(--fs-3); color: var(--bark); margin-bottom: 0.75rem; }
.card__text { font-size: var(--fs-small); color: var(--ink); }
.approach-story__count {
  position: absolute;
  z-index: 2;
  right: 1rem;
  bottom: 1rem;
  padding: .35rem .65rem;
  background: rgba(36, 27, 18, .72);
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 1.15rem;
  letter-spacing: .08em;
}

@media (prefers-reduced-motion: reduce) {
  .about-team__media img { transform: none; }
  }

/* spec list: quiet catalogue rows for board and care facts */
.speclist { list-style: none; padding: 0; }
.prose + .speclist { margin-top: 1.4rem; }
.speclist__row { display: flex; justify-content: space-between; gap: 1.5rem; padding: 0.85rem 0; border-bottom: 1px solid var(--line); }
.speclist__row:last-child { border-bottom: 0; }
.speclist__term { font-weight: 500; color: var(--bark); }
.speclist__val { color: var(--stone); text-align: right; font-size: var(--fs-small); }

/* THE LEDGER: specs set like a printed ledger, not a table-styled
   spreadsheet. Each row is a name, a Cormorant dimension flush right, and a
   quiet note underneath. Opens and closes on hairlines. Used for the arena
   book on Home and the full arena/stall ledgers on interior pages.
   <ul class="ledger">
     <li class="ledger__row">
       <span class="ledger__name">Lower arena</span>
       <span class="ledger__dim">214' x 109'</span>
       <span class="ledger__note">Lighted, all-weather GGT footing</span>
     </li> ...
   </ul> */
.ledger { list-style: none; padding: 0; }
.prose + .ledger { margin-top: 1.6rem; }
.ledger__row {
  display: grid;
  grid-template-columns: 1fr auto;
  column-gap: 1.5rem;
  align-items: baseline;
  padding-block: 0.95rem;
  border-bottom: 1px solid var(--line);
}
.ledger__row:first-child { border-top: 1px solid var(--line); }
.ledger__name { font-weight: 500; font-size: var(--fs-small); letter-spacing: 0.02em; color: var(--ink); }
.ledger__dim {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.375rem, 1.2rem + 0.9vw, 1.75rem);
  line-height: 1.1;
  color: var(--bark);
  text-align: right;
  white-space: nowrap;
}
.ledger__note { grid-column: 1 / -1; font-size: var(--fs-small); color: var(--stone); margin-top: 2px; }
/* a quiet one-line addendum under a ledger (the Eurociser line) */
.ledger + .meta { margin-top: 0.9rem; }


/* 14) LABELED PLACEHOLDER BLOCK -------------------------------------------- */
/* stands in for a photo/video slot that has no confirmed asset yet:
   cream ground, stone text, states subject + ratio */
.placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 0.35rem;
  width: 100%; height: 100%; min-height: 160px;
  background: var(--cream);
  border: 1px solid var(--tan-light);
  color: var(--stone);
  padding: 1.5rem;
}
.placeholder__subject { font-family: var(--font-body); font-weight: 500; font-size: var(--fs-small); letter-spacing: 0.08em; text-transform: uppercase; color: var(--bark); }
.placeholder__ratio { font-size: var(--fs-eyebrow); letter-spacing: 0.1em; color: var(--stone); }
.placeholder::after { content: "photo pending"; font-size: 0.625rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tan-deep); margin-top: 0.25rem; }
.ratio-4x3  { aspect-ratio: 4 / 3; }
img.ratio-16x9, img.ratio-4x3, img.ratio-3x2, img.ratio-1x1, img.ratio-4x5 {
  width: 100%; height: auto; object-fit: cover;
}
.section--cream .placeholder { background: var(--paper); }


/* live forward link: tan underline, thickens on hover, no colour flash */
.textlink { display: inline-flex; align-items: baseline; margin-top: 1.4rem; font-size: var(--fs-small); font-weight: 500; color: var(--bark); border-bottom: 1px solid var(--tan); padding-bottom: 3px; }
.textlink:hover { color: var(--bark); border-bottom-width: 2px; padding-bottom: 2px; }
.card .textlink { margin-top: 0.9rem; }

/* 17) FORM ------------------------------------------------------------------ */
/* single column, visible labels, correct types + autocomplete */
.form { display: grid; gap: 1.25rem; }
.field { display: grid; gap: 0.45rem; }
.field label { font-size: var(--fs-small); font-weight: 500; color: var(--bark); letter-spacing: 0.02em; transition: color var(--ease); }
.field input, .field select, .field textarea {
  font-family: var(--font-body); font-size: var(--fs-body); color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--tan); border-radius: 0;
  padding: 0.8rem 0.9rem; width: 100%;
  transition: border-color var(--ease), background-color var(--ease);
}
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--bark); background: rgba(230, 202, 169, .22); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--bark); outline-offset: 1px; }
.field:focus-within label { color: var(--tan-deep); }
.field textarea { min-height: 140px; resize: vertical; }
.field select { appearance: none; background-image: none; }
.field--hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* 18) MAP FRAME ------------------------------------------------------------- */
.mapframe { border: 1px solid var(--tan); padding: 6px; background: var(--paper); }
.mapframe iframe { width: 100%; height: clamp(280px, 42vh, 460px); border: 0; filter: saturate(0.85); }

/* 19) SCRUB BAND (the scroll moment) ---------------------------------------- */
/* Markup contract (scrub.js owns the behaviour, this file owns the look):
     <section class="scrubband" data-scrub-base="assets/scrub/home"
              data-scrub-frames="32" aria-label="...">
       <div class="scrubband__sticky">
         <img class="scrubband__poster" src=".../poster.jpg" alt="...">
         <canvas class="scrubband__canvas" aria-hidden="true"></canvas>
         <p class="scrubband__caption smallcaps">What you are seeing</p>
       </div>
     </section>
   Base state = the fallback: with JS off, reduced motion, or no
   IntersectionObserver, scrub.js never arms the band, so it renders as a
   plain full-width poster photograph with its caption. Nothing is hidden.
   scrub.js adds .is-armed at setup (the band grows a 340vh runway and the
   inner box pins for the ride) and .is-live once the first frame paints on
   the canvas. The page NEVER stops scrolling; the band plays as it passes.
   Rules: never the hero, max ONE per page, caption always states the view. */
.scrubband { position: relative; }
.scrubband__sticky { position: relative; overflow: hidden; }
.scrubband__poster { width: 100%; height: auto; display: block; }
.scrubband__canvas { display: none; }

.scrubband.is-armed { height: 340vh; }
.scrubband.is-armed .scrubband__sticky {
  position: sticky; top: 0;
  height: 100vh; height: 100svh;
}
.scrubband.is-armed .scrubband__poster {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
}
.scrubband.is-armed .scrubband__canvas {
  display: block;
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  opacity: 0;
}

/* the caption: one small-caps line over the footage, on the flat wash
   (darkened toward .62 so 13px cream text keeps AA over bright footing) */
.scrubband__caption {
  position: absolute; z-index: 2;
  left: 50%; transform: translateX(-50%);
  bottom: clamp(16px, 3vh, 32px);
  max-width: min(92%, 60ch);
  text-align: center;
  color: var(--cream);
  background: rgba(36, 27, 18, .62);
  padding: 0.55em 1.1em;
}


/* 21) CTA BANDS -------------------------------------------------------------- */
/* solid strip (interior pages): centered ask on flat bark */
.cta-strip { background: var(--bark); color: var(--cream); text-align: center; position: relative; overflow: hidden; }
.cta-strip > .container { position: relative; z-index: 1; }
.cta-strip .display { color: var(--cream); font-size: var(--fs-2); max-width: 22ch; margin-inline: auto; }
.cta-strip .eyebrow { color: var(--tan-light); }
.cta-strip .btn-row { justify-content: center; margin-top: 2rem; }
/* the quiet reach-us line under the button */
.cta-strip__meta { margin-top: 1.75rem; color: var(--tan-light); }
.cta-strip__meta a { color: var(--cream); text-decoration: underline; text-decoration-color: var(--tan); text-underline-offset: 3px; }
.cta-strip__meta a:hover { color: var(--tan-light); }

/* dark texture band (Home): real property wood under a flat bark-deep wash
   at 88%. Add .cta-band alongside .cta-strip; the strip supplies the type
   and the reveal hook, this supplies the photographic ground. The wash is
   flat, not a gradient. */
.cta-band__media { position: absolute; inset: 0; z-index: 0; }
.cta-band__media img { width: 100%; height: 100%; object-fit: cover; }
.cta-band__wash { position: absolute; inset: 0; z-index: 0; background: rgba(63, 43, 27, .88); }

/* 22) UTILITIES -------------------------------------------------------------- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* skip-to-content: the first focusable element on every page. Parked above
   the viewport until keyboard focus lands on it. Target: <main id="main"
   tabindex="-1">; nav.js moves focus there on activation. */
.skip-link {
  position: fixed;
  top: 14px;
  left: 14px;
  z-index: 100;
  transform: translateY(calc(-100% - 20px));
  background: var(--cream);
  color: var(--bark);
  border: 1px solid var(--bark);
  border-radius: var(--radius);
  padding: 0.8em 1.3em;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 500;
  letter-spacing: 0.04em;
}
.skip-link:focus { transform: translateY(0); }
main[tabindex="-1"]:focus { outline: none; }
/* double hairline rule, engraved stationery style: 1px line, 3px gap, 1px
   line, tan at ~35%. Full width, between major moves only (the pull-line
   band). Chapter openers use the short .sectionhead__rule instead. */
.rule { height: 5px; background: transparent; border: 0; border-top: 1px solid var(--rule-tan); border-bottom: 1px solid var(--rule-tan); margin-block: clamp(2rem, 5vw, 4rem); }

/* framed centered panel: the "contact for pricing" block on boarding.
   Paper ground with a 1px tan inset frame (same restraint as the cards). */
.panel { border: 1px solid var(--tan); background: var(--paper); padding: clamp(2rem, 5vw, 3.5rem); text-align: center; max-width: 720px; margin-inline: auto; }
.panel > * + * { margin-top: 1.25rem; }
.panel .eyebrow { margin-bottom: 0; }
.panel .display { max-width: 26ch; margin-inline: auto; }

.contact-detail + .contact-detail { margin-top: 1.75rem; }
.contact-detail h3 { font-family: var(--font-body); font-size: var(--fs-eyebrow); letter-spacing: 0.14em; text-transform: uppercase; color: var(--tan-deep); margin-bottom: 0.4rem; font-weight: 500; }
.contact-detail p, .contact-detail address { font-style: normal; color: var(--ink); }
.contact-route {
  max-width: var(--measure);
  padding: clamp(1.25rem, 3vw, 1.75rem) 0;
  border-top: 1px solid var(--tan);
  border-bottom: 1px solid var(--tan);
}
.contact-route .eyebrow { margin-bottom: 0.75rem; }
.contact-route p:not(.eyebrow) { max-width: 62ch; }


/* 404: one cream room, the logo, one line, one way home */
.notfound {
  min-height: 100vh; min-height: 100svh;
  background: var(--cream);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 1.75rem;
  text-align: center;
  padding: var(--gutter);
}
/* the packaged logo files are cream (cut for dark grounds), so on the cream
   page the mark is painted bark through an alpha mask of the same file */
.notfound__logo {
  width: min(240px, 60vw);
  aspect-ratio: 329 / 128;
  background: var(--bark);
  -webkit-mask: url("../img/logo-header.png") no-repeat center / contain;
  mask: url("../img/logo-header.png") no-repeat center / contain;
}
.notfound .display { font-size: var(--fs-2); max-width: 18ch; }

/* 23) RESPONSIVE NAV -------------------------------------------------------- */
@media (max-width: 899px) {
  .nav { display: none; }
  .nav-toggle { display: inline-flex; }
}
@media (min-width: 900px) {
  .mobile-nav { display: none; }
}

/* 24) MOTION ----------------------------------------------------------------- */
/* Scroll reveal. Progressive enhancement: nav.js adds .reveal to content
   blocks at runtime, then .is-visible once they scroll into view
   (IntersectionObserver, ~15%). With JavaScript disabled the .reveal class
   is never added, so every block stays fully visible.
   Spec: opacity 0 -> 1 + translateY 14px -> 0, 500ms ease-out, fires once,
   up to three siblings staggered 80ms apart. Off under reduced motion.
   Depth offset: in split rows the media arrives first with the full 14px
   rise; nav.js marks the text column .reveal--text, which follows 120ms
   later with a smaller 9px rise. Whole sequence 620ms, one direction. */
.reveal { opacity: 0; transform: translateY(14px); }
.reveal--text { transform: translateY(9px); }
.reveal.is-visible { opacity: 1; transform: translateY(0); transition: opacity 500ms ease-out, transform 500ms ease-out; }

/* First-load entrance: the one text block above the fold (Home hero content;
   interior page-header inner) carries class="entrance"; its children rise
   12px at 360ms ease-out, staggered 90ms by sibling order, on page load.
   Hidden state exists only under html.js-entrance, which nav.js stamps as
   its very first act (deferred scripts run pre-paint, so nothing flashes).
   The hero media layer sits OUTSIDE .entrance and never animates. The
   scroll-reveal system skips .entrance blocks. */
html.js-entrance .entrance:not(.is-in) > * { opacity: 0; transform: translateY(12px); }
html.js-entrance .entrance.is-in > * {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 360ms ease-out, transform 360ms ease-out;
}
html.js-entrance .entrance.is-in > * + * { transition-delay: 90ms; }
html.js-entrance .entrance.is-in > * + * + * { transition-delay: 180ms; }
html.js-entrance .entrance.is-in > * + * + * + * { transition-delay: 270ms; }

/* In-view video: no CSS of its own. A <video class="js-inview-video"> is
   played muted by nav.js once ~35% in view and paused out of view; under
   reduced motion nav.js never touches it, so the poster holds. */

/* Reduced motion: everything dead. Scrub bands and wipes never arm (scrub.js
   exits first thing), the belts below force every state visible anyway. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
  .reveal, .entrance > * { opacity: 1 !important; transform: none !important; }
    .scrubband.is-armed { height: auto; }
  .scrubband.is-armed .scrubband__sticky { position: relative; height: auto; }
  .scrubband.is-armed .scrubband__poster { position: relative; height: auto; object-fit: fill; }
  .scrubband .scrubband__canvas { display: none !important; }
  .card:hover { translate: none; }
}

.bit-ghost {
  position: absolute; z-index: 0;
  background: var(--tan);
  opacity: .07;
  -webkit-mask: url("../img/bit-ghost.svg") no-repeat center / contain;
  mask: url("../img/bit-ghost.svg") no-repeat center / contain;
  aspect-ratio: 920 / 260;
  pointer-events: none;
}
/* bleeding off the right band edge, vertically centered (Home intro;
   interior page-headers reuse it: the text column never reaches it) */
.bit-ghost--edge {
  width: clamp(600px, 55vw, 900px);
  right: max(-220px, -18vw);
  top: 50%;
  transform: translateY(-50%);
}
/* on dark grounds the emboss needs a touch more to register */
.section--bark .bit-ghost, .cta-strip .bit-ghost { opacity: .08; }
@media (max-width: 899px) { .bit-ghost { display: none; } }

/* Matted print treatment: in-column photos sit on a 10px paper mat inside a
   1px tan frame, like matted prints on a tack room wall. Mat is always
   paper, never white. Full-bleed images NEVER get this. The caption is a
   gallery label: stone small caps, never bold.
   <figure class="matted">
     <picture>...</picture>
     <figcaption class="matted__caption">The label</figcaption>
   </figure> */
/* the soft matted-print shadow is the 2026-07-20 depth pass: every matted
   print lifts a little off the page. The L1 crossing image adds its deeper
   --shadow-l1 on top, so it still reads as the one that lifts most. */
.matted { background: var(--paper); border: 1px solid var(--tan); padding: 10px; margin: 0; box-shadow: var(--shadow-soft); }
.matted img { width: 100%; display: block; }
.matted__caption {
  margin-top: 0.7rem;
  font-family: var(--font-display);
  font-variant-caps: small-caps;
  font-weight: 500;
  font-size: var(--fs-meta);
  letter-spacing: 0.16em;
  color: var(--stone);
  text-align: center;
  line-height: 1.5;
}

/* DRAFT copy block: the copy version of the labeled photo placeholder, for
   text awaiting Milan (name origin, history, trainer bios). Cream ground,
   stone text, dashed tan frame, visible tag, so pending copy never reads as
   finished copy. Every instance pairs with a CONFIRM WITH MILAN comment in
   the HTML. */
.draft {
  background: var(--cream);
  border: 1px dashed var(--tan);
  padding: clamp(1.25rem, 3vw, 1.75rem);
  max-width: var(--measure);
}
.draft p { color: var(--stone); }
.draft p + p { margin-top: 1.1rem; }
.draft p.draft__name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--fs-3);
  line-height: 1.15;
}
.draft p.draft__tag, .draft__tag {
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-eyebrow);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tan-deep);
  border: 1px solid var(--tan-light);
  padding: 2px 8px;
}
.card .draft__tag { margin-top: 0.9rem; }
.section--cream .draft { background: var(--paper); }

/* Gallery grid: the curated grid for gallery.html. A six-column canvas with
   deliberately placed spans (never auto-balanced masonry). Items top-align
   like a salon hang. One column below 640px.
   Spans: default = full row, --half = pairs, --third = verticals three
   across, --twothirds = a wider frame beside a --third. Slots are matted
   figures with small-caps captions; a video slot stays unmatted. */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: clamp(1.25rem, 2.5vw, 1.75rem);
  align-items: start;
}
/* static fallback: no fixed attachment under reduced motion or on phones (iOS
   handles background-attachment: fixed poorly, and reduced motion wants no
   parallax). It becomes a plain framed photograph. */
/* setting photo strip: a native horizontal scroll-snap strip of the place and
   what is around it. The track is a focusable scroll region (keyboard
   scrollable), and home.js reveals the prev/next buttons. It sits inside the
   container, so its own overflow never pushes the page sideways. */
.photostrip__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; margin-bottom: 1.1rem;
}
.photostrip__head .eyebrow { margin-bottom: 0; }
.photostrip__nav { display: flex; gap: 0.5rem; }
.photostrip__btn {
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--paper); color: var(--bark);
  border: 1px solid var(--tan); border-radius: var(--radius);
  font-size: 1.05rem; line-height: 1; cursor: pointer;
  transition: background-color var(--ease), color var(--ease), border-color var(--ease);
}
.photostrip__btn:hover { background: var(--bark); color: #fff; border-color: var(--bark); }
.photostrip__btn:disabled { opacity: 0.4; cursor: default; }
.photostrip__btn:disabled:hover { background: var(--paper); color: var(--bark); border-color: var(--tan); }
.photostrip__track {
  list-style: none; margin: 0; padding: 6px 2px 8px;
  display: flex; gap: clamp(1rem, 2.4vw, 1.5rem);
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--tan) transparent;
}
.photostrip__track:focus-visible { outline: 2px solid var(--bark); outline-offset: 3px; }
.photostrip__item {
  flex: 0 0 clamp(228px, 74vw, 336px);
  scroll-snap-align: start;
  min-width: 0;
}
.photostrip__item .matted { height: 100%; }
.photostrip__item .placeholder { min-height: 0; }

.ride__grid { display: grid; gap: clamp(1.5rem, 4vw, 2.75rem); grid-template-columns: 1fr; overflow-x: clip; }
.ride__photo, .ride__text { min-width: 0; }

@media (min-width: 768px) {
  /* static two-column fallback: arena LEFT (larger), text RIGHT. No overlap, no
     second photo, no pin, no animation. This is what no-JS, reduced motion, and
     the pre-arm first paint all show. */
  .ride__grid { grid-template-columns: minmax(0, 46%) minmax(0, 1fr); align-items: center; }
}

@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  /* Armed: sticky PHOTO, the page keeps scrolling. home.js adds .ride--armed and
     sets --ride-sticky-top = (viewport - photo height)/2 + --ride-center-nudge, so
     the arena sits vertically centred when it sticks. It computes --ride-text-top
     the same way from the TEXT's height (same --ride-center-nudge), so the text is
     sticky-centred in the viewport too and its centre tracks the photos' centre at
     every scroll position (even, not lopsided, in the settled end state). --p1 / --p2
     default to the rest state (0 = no drift, no swap), so if JS ever stops after
     arming, the clean arena-left / text-right row still holds. */
  .ride--armed .ride__grid {
    position: relative;
    grid-template-columns: 46% 46%;
    justify-content: space-between;
    align-items: start;
    /* A single tall row is the sticky travel: one screen for the photo to sit
       through, plus --ride-travel of extra scroll during which it stays stuck and
       follows you. Using an explicit row (not min-height) so each grid cell is
       this tall, which is what lets the sticky photo travel inside it. The PAGE
       scrolls through this normally; only the photo is sticky. */
    grid-template-rows: calc(100vh + var(--ride-travel));
  }
  .ride--armed .ride__photo-a {
    grid-column: 1;
    grid-row: 1;                          /* explicit so the sticky text (row 1) can overlap, not bump it */
    align-self: start;
    position: sticky;
    top: var(--ride-sticky-top, 22vh);   /* JS overwrites with the exact centre */
    /* eased DOWN by up to --ride-drift to meet the rising text (p1), then fades
       out under the arriving text (p2). transform + opacity only. */
    transform: translateY(calc(var(--p1, 0) * var(--ride-drift)));
    opacity: calc(1 - var(--p2, 0));
    will-change: transform, opacity;
  }
    .ride--armed .ride__text {
    /* Spans the whole row (both photo columns) but is only 46% wide and parked at
       the start, so its width resolves against the FULL row (46% of the row, the
       same box the photos occupy) and the horizontal slide math is unchanged. It
       overlays the photos in row 1; z-index keeps it on top. */
    grid-column: 1 / 3;
    grid-row: 1;
    align-self: start;
    justify-self: start;
    width: 46%;
    /* Viewport-centred the SAME way as the photos: position: sticky pinned at
       --ride-text-top = (viewport - text height)/2 + --ride-center-nudge (home.js
       computes it right next to --ride-sticky-top, on the same nudge). The text and
       the photos therefore share one centre (viewport/2 + nudge) at EVERY scroll
       position, so text-centre == photo-centre through the whole stuck range and,
       most visibly, in the settled end state (no more high/low drift). */
    position: sticky;
    top: var(--ride-text-top, 25vh);
    /* At rest (p2 = 0) the transform parks it in the RIGHT slot (117.39% of its own
       46% width = the row's 54% offset); as p2 -> 1 it slides back to the LEFT slot.
       translateX ONLY (no translateY) so the sticky top keeps it vertically centred;
       stays composited; the right edge resolves to 100% of the row, never overflows. */
    transform: translateX(calc((1 - var(--p2, 0)) * 117.39%));
    background: var(--cream);            /* opaque, so it cleanly covers the arena it slides over */
    padding-inline: clamp(0.25rem, 1.4vw, 0.9rem);
    z-index: 2;
    will-change: transform;
  }
}

/* --- Change 2 (2026-07-20): photo-topped info card for the setting strip ------
   The Trails/Views/Access cards now carry a real property photo on top of the
   eyebrow + title + fact, laid out in the same scroll-snap strip. Cream card,
   tan frame, soft elevation, photo flush at the top. */
.photocard {
  display: flex; flex-direction: column; height: 100%;
  background: var(--cream);
  border: 1px solid var(--tan);
  box-shadow: var(--shadow-soft-sm);
  overflow: hidden;
  transition: border-color var(--ease), box-shadow var(--ease), translate var(--ease);
}
.photocard:hover { border-color: var(--bark); box-shadow: var(--shadow-card); translate: 0 -2px; }
.photocard__media img { width: 100%; display: block; }
.photocard__body { padding: clamp(1.1rem, 2.4vw, 1.5rem); }
.photocard__body .card__title { margin-top: 0.1rem; }

/* 28) FACILITIES REDESIGN (2026-07-22) --------------------------------------
   A photo-led property page built from the approved Home/About language.
   The click-to-change explorer and contained Eurociser sequence are the two
   purposeful interactions; all other motion is a short one-time reveal. */
.page--facilities .section { padding-block: clamp(4.75rem, 7vw, 6.75rem); }

/* Opening: one real aerial field and one restrained paper panel. The flat
   wash is for tonal control only; the text never sits directly on the image. */
.fac-hero {
  position: relative;
  min-height: clamp(620px, 78svh, 820px);
  padding-top: var(--header-h);
  display: flex;
  overflow: hidden;
  isolation: isolate;
  background: var(--cream);
}
.fac-hero__media,
.fac-hero__wash { position: absolute; inset: 0; }
.fac-hero__media { z-index: 0; }
.fac-hero__media picture { display: block; width: 100%; height: 100%; }
.fac-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 48%;
  filter: saturate(.94) contrast(.98);
}
.fac-hero__wash { z-index: 1; background: rgba(36, 27, 18, .22); }
.fac-hero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  padding-block: clamp(2rem, 6vw, 5rem);
}
.fac-hero__panel {
  width: min(100%, 610px);
  padding: clamp(2rem, 4.5vw, 3.5rem);
  background: rgba(250, 247, 242, .94);
  border: 1px solid rgba(128, 96, 60, .62);
  box-shadow: var(--shadow-l1);
}
.fac-hero__panel .display {
  max-width: 12ch;
  font-size: clamp(2.65rem, 2.1rem + 2.4vw, 3.75rem);
}
.fac-hero__panel .lead {
  margin-top: 1.25rem;
  max-width: 52ch;
  font-size: clamp(1rem, .96rem + .18vw, 1.1rem);
  line-height: 1.7;
}
.fac-hero__links {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem 1.5rem;
  margin-top: 1.6rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--line);
}
.fac-hero__links a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  color: var(--bark);
  font-size: var(--fs-small);
  font-weight: 500;
  border-bottom: 1px solid transparent;
}
.fac-hero__links a:hover { border-bottom-color: var(--tan); }

.fac-explorer {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(360px, .7fr);
  min-height: clamp(540px, 44vw, 620px);
  margin-top: clamp(2.5rem, 5vw, 4rem);
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(128, 96, 60, .58);
  background: var(--paper);
  box-shadow: 0 14px 34px rgba(36, 27, 18, .09);
}
.fac-explorer__media {
  position: relative;
  min-width: 0;
  min-height: 100%;
  overflow: hidden;
  background: var(--bark-deep);
}
.fac-explorer__image {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  transform: scale(1.025);
  pointer-events: none;
  transition: opacity 320ms ease, transform 650ms ease-out;
}
.fac-explorer__image.is-active { opacity: 1; transform: scale(1); }
.fac-explorer__image picture { display: block; width: 100%; height: 100%; }
.fac-explorer__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.9) contrast(.98);
}
.fac-explorer__image[data-facilities-media="1"] img { object-position: center; }
.fac-explorer__image[data-facilities-media="2"] img { object-position: center 60%; }
.fac-explorer__image figcaption,
.fac-stabling__media figcaption,
.fac-land__media figcaption {
  position: absolute;
  z-index: 2;
  left: 1rem;
  bottom: .9rem;
  padding: .35rem .65rem;
  background: rgba(36, 27, 18, .70);
  color: var(--cream);
  font-size: .72rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.fac-explorer__count {
  position: absolute;
  z-index: 3;
  right: 1rem;
  bottom: .9rem;
  padding: .35rem .65rem;
  background: rgba(36, 27, 18, .70);
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 1.1rem;
  letter-spacing: .08em;
}
.fac-explorer__choices {
  display: grid;
  grid-template-rows: repeat(3, minmax(0, 1fr));
  min-width: 0;
  background: var(--paper);
}
.fac-explorer__choice {
  appearance: none;
  width: 100%;
  min-height: 148px;
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  padding: clamp(1.35rem, 2.5vw, 2rem);
  border: 0;
  border-left: 3px solid transparent;
  border-bottom: 1px solid var(--line);
  background: rgba(239, 227, 214, .45);
  color: var(--ink);
  text-align: left;
  font-family: var(--font-body);
  cursor: pointer;
  transition: background-color 220ms ease, border-color 220ms ease;
}
.fac-explorer__choice:last-child { border-bottom: 0; }
.fac-explorer__choice:hover { background: rgba(239, 227, 214, .78); }
.fac-explorer__choice.is-active {
  background: var(--paper);
  border-left-color: var(--bark);
}
.fac-explorer__choice:focus-visible {
  position: relative;
  z-index: 2;
  outline: 2px solid var(--bark);
  outline-offset: -4px;
}
.fac-explorer__number {
  padding-top: .18rem;
  color: var(--tan-deep);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-style: italic;
}
.fac-explorer__copy { display: grid; gap: .48rem; }
.fac-explorer__copy strong {
  color: var(--bark);
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 1.4rem + .7vw, 2.1rem);
  font-weight: 500;
  line-height: 1;
}
.fac-explorer__copy > span { font-size: var(--fs-small); line-height: 1.55; }
.fac-explorer__copy small {
  color: var(--stone);
  font-size: .72rem;
  line-height: 1.45;
  letter-spacing: .02em;
}

/* Chapter opener: every numbered section now reads in one clear, compact
   column before its visual composition begins. */
.fac-chapter-head {
  display: block;
  max-width: 780px;
  margin-bottom: clamp(2.4rem, 4.5vw, 3.8rem);
}
.fac-chapter-head .sectionhead { margin-bottom: 0; }
.fac-chapter-head__copy {
  max-width: 62ch;
  margin-top: 1.15rem;
  color: var(--stone);
  font-size: clamp(1rem, .96rem + .12vw, 1.08rem);
  line-height: 1.7;
}

/* Facilities Revision 4: the amenity tour. The older selectors immediately
   above remain harmless for the previous markup, while these classes own the
   current page. Every section uses a different editorial composition. */

/* Shared photograph captions inside the new Facilities chapters. */
.fac-arena-card__media,
.fac-turnout__media,
.fac-roundpens__media,
.fac-barns__main,
.fac-barns__detail,
.fac-trails__land,
.fac-trails__amenity { position: relative; margin: 0; }

.fac-arena-card__media figcaption,
.fac-turnout__media figcaption,
.fac-roundpens__media figcaption,
.fac-barns__main figcaption,
.fac-barns__detail figcaption,
.fac-trails__land figcaption,
.fac-trails__amenity figcaption {
  position: absolute;
  z-index: 3;
  left: .85rem;
  bottom: .75rem;
  padding: .38rem .68rem;
  background: rgba(36, 27, 18, .70);
  color: var(--cream);
  font-size: .7rem;
  letter-spacing: .07em;
  line-height: 1.35;
  text-transform: uppercase;
}

/* Arenas: mobile first gives each chapter its own balanced image-topped card.
   JavaScript arms the shared sticky photograph only on larger screens. */
.fac-arena-story { display: grid; gap: clamp(1.65rem, 3vw, 2.5rem); }
.fac-arena-card { display: grid; min-width: 0; }
.fac-arena-card__media {
  overflow: hidden;
  background: var(--paper);
  border: 1px solid rgba(128, 96, 60, .58);
  box-shadow: var(--shadow-soft);
}
.fac-arena-card__media picture { display: block; }
.fac-arena-card__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  filter: saturate(.92) contrast(.98);
}
.fac-arena-card__chapter {
  position: relative;
  z-index: 2;
  margin: -1rem .85rem 0;
}
.fac-arena-card__surface {
  padding: clamp(1.35rem, 3vw, 1.85rem);
  background: rgba(250, 247, 242, .97);
  border: 1px solid rgba(128, 96, 60, .58);
  box-shadow: var(--shadow-soft-sm);
}
.fac-arena-card__surface .display {
  margin: 1rem 0 .55rem;
  max-width: 13ch;
  font-size: clamp(2rem, 1.68rem + 1.1vw, 2.75rem);
}
.fac-arena-card__dimension {
  display: block;
  margin-bottom: .85rem;
  color: var(--bark);
  font-family: var(--font-display);
  font-size: clamp(1.55rem, 1.35rem + .7vw, 2rem);
  font-weight: 600;
}
.fac-arena-card__surface > p:last-child {
  max-width: 42ch;
  color: var(--stone);
  font-size: var(--fs-small);
}

/* Barns: one compact three-part plate keeps the overview, care text, and
   detail photograph together instead of leaving a floating side column. */
.fac-barns__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(270px, .72fr) minmax(230px, .58fr);
  gap: 0;
  align-items: stretch;
  min-height: clamp(420px, 38vw, 500px);
  overflow: hidden;
  background: var(--cream);
  border: 1px solid rgba(128, 96, 60, .5);
  box-shadow: var(--shadow-soft);
}
.fac-barns__main {
  overflow: hidden;
  border-right: 1px solid rgba(128, 96, 60, .42);
}
.fac-barns__main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.9) contrast(.98);
}
.fac-barns__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: clamp(1.55rem, 2.6vw, 2.25rem);
  background: var(--cream);
  border-right: 1px solid rgba(128, 96, 60, .42);
}
.fac-barns__copy .display {
  max-width: 12ch;
  margin-bottom: 1rem;
  font-size: clamp(1.8rem, 1.55rem + .75vw, 2.35rem);
}
.fac-barns__copy .textlink { margin-top: 1.1rem; }
.fac-barns__detail {
  overflow: hidden;
}
.fac-barns__detail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Barns receives the same fixed stall-door texture and warm paper wash used
   behind Home's No. 04 chapter. The wood stays atmospheric; the opaque
   editorial plate preserves text contrast and keeps the effect restrained. */
.fac-barns--wood {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--cream);
}
.fac-barns--wood::before,
.fac-barns--wood::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.fac-barns--wood::before {
  z-index: 0;
  background-image: image-set(
    url("../img-v2/cta-texture-1600.webp") type("image/webp"),
    url("../img-v2/cta-texture-1600.jpg") type("image/jpeg"));
  background-image: -webkit-image-set(
    url("../img-v2/cta-texture-1600.webp") type("image/webp"),
    url("../img-v2/cta-texture-1600.jpg") type("image/jpeg"));
  background-position: 82% top;
  background-size: 820px auto;
  background-repeat: repeat;
  background-attachment: fixed;
  filter: grayscale(.7) saturate(.35) brightness(1.12) contrast(.74);
}
.fac-barns--wood::after {
  z-index: 1;
  background: rgba(239, 227, 214, .89);
}
.fac-barns--wood > .container {
  position: relative;
  z-index: 2;
}

/* Trails and rider amenities: facts lead directly into a low two-image band. */
.fac-trails__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, .72fr);
  gap: 1rem 1.1rem;
  align-items: stretch;
}
.fac-trails__land {
  overflow: hidden;
  border: 1px solid rgba(128, 96, 60, .5);
  box-shadow: var(--shadow-soft);
}
.fac-trails__land img {
  width: 100%;
  height: clamp(290px, 28vw, 370px);
  object-fit: cover;
  filter: saturate(.92) contrast(.98);
}
.fac-trails__copy {
  grid-column: 1 / -1;
  padding: 0 0 .65rem;
}
.fac-trails__copy .speclist {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-block: 1px solid var(--line);
}
.fac-trails__copy .speclist__row {
  display: grid;
  align-content: start;
  gap: .35rem;
  padding: 1rem 1.1rem;
  border-bottom: 0;
  border-right: 1px solid var(--line);
}
.fac-trails__copy .speclist__row:last-child { border-right: 0; }
.fac-trails__copy .speclist__val { text-align: left; }
.fac-trails__amenity {
  overflow: hidden;
  border: 1px solid rgba(128, 96, 60, .5);
}
.fac-trails__amenity img {
  width: 100%;
  height: clamp(290px, 28vw, 370px);
  object-fit: cover;
}

/* Facilities-only staged entrances. JavaScript adds the ready state, so
   no-JS and reduced-motion visitors always receive complete visible content. */
@media (prefers-reduced-motion: no-preference) {
  .fac-motion-group.is-motion-ready > * {
    opacity: 0;
    transform: translateY(12px);
  }
  .fac-motion-group.is-motion-ready.is-in > * {
    opacity: 1;
    transform: none;
    transition: opacity 440ms ease-out, transform 440ms ease-out;
  }
  .fac-motion-group.is-motion-ready.is-in > *:nth-child(2) { transition-delay: 70ms; }
  .fac-motion-group.is-motion-ready.is-in > *:nth-child(3) { transition-delay: 120ms; }
  .fac-explorer.is-motion-ready .fac-explorer__choice {
    opacity: 0;
    transform: translateY(10px);
  }
  .fac-explorer.is-motion-ready.is-in .fac-explorer__choice {
    opacity: 1;
    transform: none;
    transition:
      opacity 360ms ease-out,
      transform 360ms ease-out,
      background-color 220ms ease,
      border-color 220ms ease;
  }
  .fac-explorer.is-motion-ready.is-in .fac-explorer__choice:nth-child(2) { transition-delay: 50ms; }
  .fac-explorer.is-motion-ready.is-in .fac-explorer__choice:nth-child(3) { transition-delay: 100ms; }
}

@media (min-width: 900px) and (prefers-reduced-motion: no-preference) {
  .fac-arena-story.is-armed {
    display: grid;
    grid-template-columns: minmax(0, 1.14fr) minmax(340px, .68fr);
    grid-template-rows: repeat(3, 1fr);
    column-gap: clamp(2.25rem, 5vw, 4.5rem);
    row-gap: 0;
  }
  .fac-arena-story.is-armed .fac-arena-card { display: contents; }
  .fac-arena-story.is-armed .fac-arena-card__media {
    grid-column: 1;
    grid-row: 1 / 4;
    align-self: start;
    position: sticky;
    top: calc(var(--header-h) + 4vh);
    height: min(58vh, 560px);
    opacity: 0;
    transform: scale(1.012);
    pointer-events: none;
    transition: opacity 360ms ease, transform 600ms ease-out;
  }
  .fac-arena-story.is-armed .fac-arena-card__media.is-current {
    z-index: 2;
    opacity: 1;
    transform: none;
  }
  .fac-arena-story.is-armed .fac-arena-card__media picture,
  .fac-arena-story.is-armed .fac-arena-card__media img {
    width: 100%;
    height: 100%;
  }
  .fac-arena-story.is-armed .fac-arena-card__media img { aspect-ratio: auto; }
  .fac-arena-story.is-armed .fac-arena-card__chapter {
    grid-column: 2;
    display: flex;
    align-items: stretch;
    padding-block: 12px;
    margin: 0;
  }
  .fac-arena-story.is-armed .fac-arena-card:nth-child(1) .fac-arena-card__chapter { grid-row: 1; }
  .fac-arena-story.is-armed .fac-arena-card:nth-child(2) .fac-arena-card__chapter { grid-row: 2; }
  .fac-arena-story.is-armed .fac-arena-card:nth-child(3) .fac-arena-card__chapter { grid-row: 3; }
  .fac-arena-story.is-armed .fac-arena-card__surface {
    width: 100%;
    display: flex;
    flex-direction: column;
    opacity: .72;
    transition: opacity 260ms ease, border-color 260ms ease, box-shadow 260ms ease;
  }
  .fac-arena-story.is-armed .fac-arena-card.is-current .fac-arena-card__surface {
    opacity: 1;
    border-color: rgba(128, 96, 60, .72);
    box-shadow: var(--shadow-l1);
  }
}

@media (max-width: 999px) {
  .fac-explorer { grid-template-columns: minmax(0, 1.1fr) minmax(330px, .9fr); }
          }

@media (max-width: 899px) {
  .fac-barns--wood::before {
    background-attachment: scroll;
    background-size: 520px auto;
  }

  .fac-barns__grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .fac-barns__main {
    border-right: 0;
    border-bottom: 1px solid rgba(128, 96, 60, .42);
  }
  .fac-barns__main img { height: auto; aspect-ratio: 16 / 10; }
  .fac-barns__copy {
    border-right: 0;
    border-bottom: 1px solid rgba(128, 96, 60, .42);
  }
  .fac-barns__detail img { height: auto; aspect-ratio: 16 / 10; }
}

@media (max-width: 767px) {
  .page--facilities .section { padding-block: 4rem; }
  .fac-hero { min-height: 660px; }
  .fac-hero__media img { object-position: 36% center; }
  .fac-hero__wash { background: rgba(36, 27, 18, .16); }
  .fac-hero__inner { align-items: flex-end; padding: 2rem var(--gutter) 1.5rem; }
  .fac-hero__panel { padding: 1.75rem 1.4rem; background: rgba(250, 247, 242, .96); }
  .fac-hero__panel .display { font-size: clamp(2.5rem, 11vw, 3.15rem); }
  .fac-hero__links { gap: .1rem 1.1rem; }

  .fac-explorer { grid-template-columns: 1fr; min-height: 0; }
  .fac-explorer__media { min-height: clamp(340px, 85vw, 480px); }
  .fac-explorer__choices { grid-template-rows: none; }
  .fac-explorer__choice { min-height: 132px; border-left: 0; border-bottom: 1px solid var(--line); }
  .fac-explorer__choice.is-active { border-left: 3px solid var(--bark); }

  .fac-chapter-head { margin-bottom: 2.5rem; }

  .fac-arena-story { gap: 2.25rem; }
  .fac-arena-card__chapter { margin-inline: .75rem; }

  .fac-trails__grid { grid-template-columns: 1fr; gap: 1rem; }
  .fac-trails__copy { grid-column: auto; padding-bottom: .5rem; }
  .fac-trails__copy .speclist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fac-trails__copy .speclist__row:nth-child(2) { border-right: 0; }
  .fac-trails__copy .speclist__row:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  .fac-trails__land img,
  .fac-trails__amenity img { height: auto; aspect-ratio: 16 / 10; }
}

@media (max-width: 430px) {
  .fac-explorer__choice { grid-template-columns: 1.8rem minmax(0, 1fr); gap: .7rem; padding: 1.25rem 1rem; }
  .fac-explorer__copy small { display: none; }
                .fac-barns__copy { padding: 1.35rem 1.1rem; }
      .fac-trails__copy .speclist__row { padding: .85rem .75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .fac-explorer__image {
    transform: none !important;
    transition: none !important;
  }
  .fac-detail-card img,
  .fac-arena-card__media,
  .fac-arena-card__surface { transform: none !important; transition: none !important; }
}

/* 29) BOARDING REDESIGN (2026-07-23) ---------------------------------------
   Layout pass only. The daily-care chapter establishes the page's dominant
   sticky composition, but custom image-change choreography waits for the
   motion pass. Every selector is scoped to .page--boarding so Facilities can
   keep moving independently. */

/* Photo-led opener: related to About's editorial split, but the photograph
   fills its own field instead of becoming another portrait print. */
.page--boarding .boarding-hero {
  padding-top: calc(var(--header-h) + clamp(2.75rem, 5vw, 5rem));
  padding-bottom: clamp(3.5rem, 6vw, 6rem);
  background: var(--cream);
}
.boarding-hero__copy { max-width: 560px; }
.page--boarding .boarding-hero .display {
  max-width: 10ch;
  font-size: clamp(3.25rem, 2.15rem + 3.7vw, 6rem);
}
.boarding-hero__copy .lead { max-width: 52ch; }
.boarding-hero__copy .textlink {
  display: inline-flex;
  margin-top: 2rem;
}
.boarding-hero__media {
  margin: 0;
  padding: 10px;
  border: 1px solid var(--tan);
  background: var(--paper);
  box-shadow: var(--shadow-soft);
}
.boarding-hero__media picture { display: block; height: 100%; }
.boarding-hero__media img {
  width: 100%;
  height: clamp(480px, 47vw, 620px);
  display: block;
  object-fit: cover;
  object-position: 54% center;
}
.boarding-hero__media figcaption,
.boarding-selector__media figcaption,
.boarding-tenure__media figcaption {
  font-family: var(--font-display);
  font-variant-caps: small-caps;
  font-weight: 500;
  font-size: var(--fs-meta);
  letter-spacing: .16em;
  line-height: 1.5;
  color: var(--stone);
}
.boarding-hero__media figcaption {
  padding-top: .7rem;
  text-align: center;
}


/* Daily rhythm: one portrait stays with the reader while the care schedule
   unfolds. The text owns a comfortable measure at every point. */
.boarding-routine { padding-block: clamp(5rem, 8vw, 9rem); }
.boarding-routine__grid {
  display: grid;
  grid-template-columns: minmax(360px, .84fr) minmax(0, 1.16fr);
  gap: clamp(3.5rem, 8vw, 8rem);
  align-items: start;
}
.boarding-routine__visual {
  position: sticky;
  top: calc(var(--header-h) + 2.5rem);
}
.boarding-routine__visual figure {
  margin: 0;
  padding: 10px;
  border: 1px solid var(--tan);
  background: var(--paper);
  box-shadow: var(--shadow-soft);
}
.boarding-routine__visual picture { display: block; overflow: hidden; }
.boarding-routine__visual img {
  width: 100%;
  aspect-ratio: 4 / 5;
  display: block;
  object-fit: cover;
}
.boarding-routine__visual figcaption {
  padding-top: .7rem;
  font-family: var(--font-display);
  font-variant-caps: small-caps;
  font-size: var(--fs-meta);
  letter-spacing: .16em;
  color: var(--stone);
  text-align: center;
}
.boarding-routine__story { padding-block: clamp(1rem, 4vw, 4rem); }
.boarding-routine__story > .prose { max-width: 54ch; }
.boarding-routine__story > .speclist { margin-top: 2rem; }

/* Stall browser: one stable image field and four real, information-rich
   buttons. State is shown by background, edge, and type—not color alone. */
.boarding-stalls { padding-block: clamp(5rem, 8vw, 8rem); }
.boarding-stalls__browser {
  margin-top: clamp(3rem, 6vw, 5rem);
  min-height: 590px;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr);
  align-items: stretch;
}
.boarding-selector__visual {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--tan);
  background: var(--tan-light);
  box-shadow: var(--shadow-soft);
}
.boarding-selector__media {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 240ms ease,
    visibility 0s linear 240ms;
}
.boarding-selector__media.is-active {
  z-index: 1;
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}
.boarding-selector__media picture {
  position: absolute;
  inset: 0;
}
.boarding-selector__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.boarding-selector__media figcaption {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  z-index: 2;
  padding: .55rem .8rem;
  background: rgba(250, 247, 242, .94);
}
.boarding-selector__count {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 3;
  min-width: 78px;
  padding: .55rem .75rem;
  font-family: var(--font-display);
  font-size: var(--fs-meta);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: .13em;
  text-align: center;
  color: var(--bark);
  background: rgba(250, 247, 242, .94);
  border: 1px solid rgba(185, 148, 106, .6);
}
.boarding-stall-choice:focus-visible,
.boarding-turnout__choice:focus-visible {
  z-index: 4;
  outline: 3px solid var(--bark);
  outline-offset: -4px;
}

@media (hover: hover) {
  .boarding-stall-choice:hover,
  .boarding-turnout__choice:hover { background: var(--paper); }
}


/* Honest turnout: three manual views reuse the same accessible selector
   behavior while staying visually quieter than the stall browser. */
.boarding-turnout { padding-block: clamp(5rem, 8vw, 8rem); }
.boarding-turnout__grid {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  gap: clamp(3rem, 7vw, 7rem);
  align-items: center;
}
.boarding-turnout__copy { max-width: 520px; }
.boarding-turnout__copy .textlink {
  display: inline-flex;
  margin-top: 1.75rem;
}
.boarding-turnout__viewer { min-width: 0; }
.boarding-turnout__viewer .boarding-selector__visual {
  aspect-ratio: 3 / 2;
}
.boarding-turnout__choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-top: 0;
}
.boarding-turnout__choice {
  min-height: 58px;
  padding: .75rem 1rem;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 500;
  line-height: 1.35;
  color: var(--stone);
  background: var(--cream);
  border: 0;
  border-right: 1px solid var(--line);
  cursor: pointer;
  touch-action: manipulation;
  transition:
    color 180ms ease,
    background-color 180ms ease;
}
.boarding-turnout__choice:last-child { border-right: 0; }
.boarding-turnout__choice.is-active {
  color: var(--bark);
  background: var(--paper);
  box-shadow: inset 0 -3px 0 var(--tan-deep);
}

/* Arrival and pricing share one close. The two steps sit like parallel
   chapters, not product cards. */
.boarding-start { padding-block: clamp(5rem, 8vw, 8rem); }

@media (max-width: 899px) {
  .boarding-hero__inner,
  .boarding-routine__grid,
  .boarding-tenure__grid,
  .boarding-turnout__grid {
    grid-template-columns: 1fr;
  }
  .boarding-hero__copy { max-width: 680px; }
  .page--boarding .boarding-hero .display { max-width: 11ch; }
  .boarding-hero__media img {
    height: auto;
    aspect-ratio: 16 / 10;
  }

      
  .boarding-routine__grid { gap: 3rem; }
  .boarding-routine__visual {
    position: relative;
    top: auto;
    max-width: 680px;
  }
  .boarding-routine__visual img {
    aspect-ratio: 16 / 10;
    object-position: center 58%;
  }
  .boarding-routine__story { padding-block: 0; }
  
  .boarding-stalls__browser {
    min-height: 0;
    display: block;
  }
  .boarding-stalls__browser .boarding-selector__visual {
    height: clamp(390px, 62vw, 520px);
  }
          
      
  .boarding-turnout__grid { gap: 3rem; }
  .boarding-turnout__copy { max-width: 660px; }
  }

@media (max-width: 640px) {
  .page--boarding .boarding-hero {
    padding-top: calc(var(--header-h) + 2rem);
    padding-bottom: 3.5rem;
  }
    .page--boarding .boarding-hero .display {
    font-size: clamp(2.8rem, 12vw, 4rem);
  }
  .boarding-hero__media img { aspect-ratio: 4 / 3; }

  
  .boarding-routine,
  .boarding-stalls,
  .boarding-tenure,
  .boarding-turnout,
  .boarding-start { padding-block: 4.5rem; }
  .boarding-routine__visual img { aspect-ratio: 4 / 3; }
  
  .boarding-stalls__browser .boarding-selector__visual { height: 320px; }
              .boarding-selector__media figcaption {
    left: .65rem;
    bottom: .65rem;
    max-width: calc(100% - 1.3rem);
    font-size: .68rem;
  }
  .boarding-selector__count {
    top: .65rem;
    right: .65rem;
  }

  .boarding-turnout__viewer .boarding-selector__visual { aspect-ratio: 4 / 3; }
  .boarding-turnout__choice {
    min-height: 70px;
    padding-inline: .55rem;
  }

        }

@media (prefers-reduced-motion: reduce) {
  .boarding-routine__visual { position: relative; top: auto; }
  .boarding-selector__media,
  .boarding-stall-choice,
  .boarding-stall-choice::before,
  .boarding-turnout__choice {
    transition: none;
  }
}

/* 32) GALLERY: FOCUS VIEW + OPTIONAL BROWSE GRID ---------------------------
   Complete real-photo collection with a stable manual viewer, compact
   filmstrip, optional browse grid, and one click-to-play farm film. */
.gallery-intro {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--bark);
  padding-top: calc(var(--header-h) + clamp(2.75rem, 5vw, 4.5rem));
  padding-bottom: clamp(2.75rem, 5vw, 4.25rem);
}
.gallery-intro__media,
.gallery-intro__wash {
  position: absolute;
  inset: 0;
}
.gallery-intro__media {
  z-index: -2;
}
.gallery-intro__media picture,
.gallery-intro__media img {
  display: block;
  width: 100%;
  height: 100%;
}
.gallery-intro__media img {
  object-fit: cover;
  object-position: center 53%;
}
.gallery-intro__wash {
  z-index: -1;
  background: rgba(36, 27, 18, .62);
}
.gallery-intro::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  height: 5px;
  border-top: 1px solid var(--rule-tan);
  border-bottom: 1px solid var(--rule-tan);
}
.gallery-intro__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: end;
}
.gallery-intro__copy { max-width: 720px; }
.gallery-intro .eyebrow { color: var(--tan-light); }
.gallery-intro .display {
  max-width: 13ch;
  font-size: clamp(3rem, 2rem + 3.5vw, 5.5rem);
  color: var(--cream);
}
.gallery-intro .lead {
  margin-top: 1.25rem;
  max-width: 58ch;
  color: var(--cream);
}
.gallery-intro__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .75rem;
  padding-bottom: .25rem;
}

.gallery-experience {
  padding-top: clamp(3rem, 6vw, 5.5rem);
  padding-bottom: clamp(4.5rem, 8vw, 8rem);
}

@keyframes gallery-stage-enter {
  from { opacity: .58; transform: scale(1.004); }
  to { opacity: 1; transform: none; }
}

.gallery-film {
  margin-top: clamp(4rem, 8vw, 7rem);
  padding-top: clamp(2.5rem, 5vw, 4.5rem);
  border-top: 1px solid var(--tan);
}
.gallery-film__intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: end;
}
.gallery-film__intro .eyebrow { margin-bottom: .45rem; }
.gallery-film__intro .display {
  font-size: clamp(2rem, 1.45rem + 2vw, 3.5rem);
}
.gallery-film__intro > p {
  max-width: 42ch;
  color: var(--stone);
}
.gallery-film__frame {
  aspect-ratio: 16 / 9;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(7px, 1vw, 12px);
  border: 1px solid var(--tan);
  background: var(--bark-deep);
  box-shadow: var(--shadow-soft);
}
.gallery-film__frame video {
  display: block;
  width: 100%;
  height: 100%;
  background: #19120d;
  object-fit: cover;
}

@media (max-width: 900px) {
  .gallery-intro__inner { grid-template-columns: 1fr; gap: 2rem; }
  .gallery-intro__actions { justify-content: flex-start; }
    .gallery-film__intro { grid-template-columns: 1fr; gap: 1rem; }
}

@media (max-width: 640px) {
  .gallery-intro {
    padding-top: calc(var(--header-h) + 2.5rem);
    padding-bottom: 3.5rem;
  }
  .gallery-intro__media img { object-position: 58% center; }
  .gallery-intro .display { font-size: clamp(2.9rem, 13vw, 4.1rem); }
  .gallery-intro__actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .gallery-intro__actions .btn { width: 100%; padding-inline: .8rem; }
  .gallery-experience { padding-top: 2.5rem; padding-bottom: 5rem; }
                                  .gallery-film { margin-top: 4rem; padding-top: 3rem; }
}

@media (max-width: 390px) {
  .gallery-intro__actions { grid-template-columns: 1fr; }
        }

/* 32) LEGAL PAGES (2026-07-23) ---------------------------------------------
   Terms and privacy use the existing estate-book system at its quietest:
   narrow measure, numbered sections, a desktop contents rail, and no
   decorative motion or photography. */
.page--legal .page-header .display { max-width: 18ch; }
.page--legal .page-header .lead {
  max-width: 62ch;
  font-size: clamp(1rem, .96rem + .2vw, 1.125rem);
  line-height: 1.7;
}
.legal-meta {
  margin-top: 1.25rem;
  color: var(--tan-deep);
  font-size: var(--fs-small);
  font-weight: 500;
}
.legal-section { padding-block: clamp(3.75rem, 7vw, 7rem); }
.legal-layout {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 760px);
  gap: clamp(3rem, 7vw, 6.5rem);
  justify-content: center;
  align-items: start;
}
.legal-nav {
  position: sticky;
  top: calc(var(--header-h) + 2rem);
  display: grid;
  padding-block: 1rem;
  border-top: 1px solid var(--tan);
  border-bottom: 1px solid var(--tan);
}
.legal-nav__title {
  padding: .65rem 0 .75rem;
  color: var(--tan-deep);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.legal-nav a {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding-block: .35rem;
  border-top: 1px solid var(--line);
  color: var(--stone);
  font-size: .8125rem;
  line-height: 1.4;
  transition: color var(--ease);
}
.legal-nav a:hover { color: var(--bark); }
.legal-document { min-width: 0; }
.legal-summary {
  margin-bottom: clamp(3rem, 6vw, 4.5rem);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid var(--tan);
  background: var(--cream);
  box-shadow: inset 0 0 0 8px var(--paper);
}
.legal-summary .eyebrow { margin-bottom: .6rem; }
.legal-summary p:last-child {
  max-width: 62ch;
  font-size: clamp(1rem, .96rem + .18vw, 1.1rem);
  line-height: 1.75;
}
.legal-document > section {
  scroll-margin-top: calc(var(--header-h) + 1.5rem);
}
.legal-document > section + section {
  margin-top: clamp(2.75rem, 5vw, 4rem);
  padding-top: clamp(2.75rem, 5vw, 4rem);
  border-top: 1px solid var(--line);
}
.legal-document h2 {
  margin-bottom: 1.25rem;
  font-size: clamp(1.7rem, 1.4rem + 1vw, 2.2rem);
}
.legal-document h3 {
  margin-top: 1.75rem;
  margin-bottom: .65rem;
  font-family: var(--font-body);
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: .1em;
  line-height: 1.4;
  text-transform: uppercase;
}
.legal-document p,
.legal-document li {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.75;
}
.legal-document p + p { margin-top: 1rem; }
.legal-document ul {
  display: grid;
  gap: .75rem;
  margin: 1.1rem 0 0;
  padding-left: 1.25rem;
}
.legal-document strong { color: var(--bark); font-weight: 500; }
.legal-document a,
.form__privacy a {
  color: var(--bark);
  text-decoration: underline;
  text-decoration-color: var(--tan);
  text-underline-offset: 3px;
}
.legal-document a:hover,
.form__privacy a:hover { text-decoration-thickness: 2px; }
.legal-address {
  margin-top: 1rem;
  padding-left: 1rem;
  border-left: 2px solid var(--tan);
  color: var(--ink);
  font-style: normal;
  line-height: 1.75;
}
.form__privacy {
  margin-top: -.35rem;
  color: var(--stone);
  font-size: .8125rem;
  line-height: 1.6;
}

@media (max-width: 899px) {
  .legal-layout { grid-template-columns: minmax(0, 760px); }
  .legal-nav { display: none; }
}

@media (max-width: 640px) {
  .legal-section { padding-block: 3.25rem 4.5rem; }
  .legal-summary {
    margin-inline: -4px;
    padding: 1.5rem;
    box-shadow: inset 0 0 0 5px var(--paper);
  }
  .legal-document > section + section {
    margin-top: 2.5rem;
    padding-top: 2.5rem;
  }
  .site-footer__base { align-items: flex-start; }
  .site-footer__legal { flex-basis: 100%; order: 3; }
}

/* 35) TRAINERS REVIEW (2026-09-16)
   Photo header, two open profiles, and one shared inquiry close. */
.page--trainers .trainers-landscape-hero {
  padding-top: var(--header-h);
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.page--trainers .trainers-landscape-hero__banner {
  position: relative;
  height: clamp(320px, 30vw, 430px);
  isolation: isolate;
  background: var(--bark-deep);
}
.page--trainers .trainers-landscape-hero__media,
.page--trainers .trainers-landscape-hero__wash { position: absolute; inset: 0; }
.page--trainers .trainers-landscape-hero__media { z-index: -2; }
.page--trainers .trainers-landscape-hero__media picture { display: block; width: 100%; height: 100%; }
.page--trainers .trainers-landscape-hero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 48%;
}
.page--trainers .trainers-landscape-hero__wash {
  z-index: -1;
  background: linear-gradient(180deg, rgba(36, 27, 18, .04) 20%, rgba(36, 27, 18, .2) 55%, rgba(36, 27, 18, .76));
}
.page--trainers .trainers-landscape-hero__title-frame {
  height: 100%; display: flex; align-items: flex-end; padding-bottom: 32px;
}
.page--trainers .trainers-landscape-hero .display {
  margin: 0; color: var(--paper); font-size: 48px; line-height: 1.08;
}
.page--trainers .trainers-landscape-hero__intro {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  align-items: center; gap: 32px; padding-block: 24px;
}
.page--trainers .trainers-landscape-hero__intro .lead {
  margin: 0; max-width: 42ch; color: var(--bark); font: 500 23px/1.4 var(--font-display);
}
.page--trainers .trainers-landscape-hero__links { display: flex; gap: 24px; }
.page--trainers .trainers-landscape-hero__links a {
  display: flex; gap: 10px; align-items: center; min-height: 44px;
  color: var(--bark); font-size: 14px; font-weight: 500;
  text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 6px;
}
.page--trainers .trainers-landscape-hero__links a:hover { text-decoration-color: var(--bark); }
.page--trainers .trainer-feature-section { padding-block: clamp(48px, 5vw, 72px); scroll-margin-top: 0; }
.page--trainers .trainer-feature {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px clamp(40px, 6vw, 80px); align-items: center;
}
.page--trainers .trainer-feature__heading { grid-column: 2; grid-row: 1; align-self: end; }
.page--trainers .trainer-feature__heading .eyebrow { margin-bottom: 12px; font-size: 11px; }
.page--trainers .trainer-feature__heading h2 {
  max-width: 20ch; margin: 0; font: 500 40px/1.08 var(--font-display); color: var(--bark);
}
.page--trainers .trainer-feature__media { grid-column: 1; grid-row: 1 / span 2; margin: 0; width: 100%; max-width: 560px; justify-self: center; }
.page--trainers .trainer-feature__media picture,
.page--trainers .trainer-feature__media img { display: block; width: 100%; height: auto; }
.page--trainers .trainer-feature__media img { border: 1px solid var(--line); }
.page--trainers .trainer-feature__copy { grid-column: 2; grid-row: 2; align-self: start; }
.page--trainers .trainer-feature__copy p { max-width: 56ch; margin: 0; color: var(--stone); font-size: 16px; line-height: 1.7; }
.page--trainers .trainer-feature__copy p + p { margin-top: 14px; }
.page--trainers .trainer-feature__copy .btn-row { margin-top: 26px; }
.page--trainers .trainer-feature--reverse .trainer-feature__heading { grid-column: 1; }
.page--trainers .trainer-feature--reverse .trainer-feature__copy { grid-column: 1; }
.page--trainers .trainer-feature--reverse .trainer-feature__media { grid-column: 2; max-width: 352px; }
.page--trainers .trainer-feature .btn-row,
.page--trainers .trainers-inquiries .btn-row { align-items: center; gap: 16px 24px; }
.page--trainers .trainer-feature .textlink,
.page--trainers .trainers-inquiries .textlink { margin: 0; gap: 8px; font-size: 14px; padding-block: 10px; min-height: 44px; }
.page--trainers .trainer-feature .btn,
.page--trainers .trainers-inquiries .btn { font-size: 14px; }
.page--trainers .trainers-inquiries { position: relative; isolation: isolate; padding-block: 60px 36px; overflow: hidden; }
.page--trainers .trainers-inquiries::before,
.page--trainers .trainers-inquiries::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.page--trainers .trainers-inquiries::before {
  z-index: -2;
  background-image: url("../img-v2/cta-texture-1600.jpg");
  background-image: image-set(url("../img-v2/cta-texture-1600.webp") type("image/webp"), url("../img-v2/cta-texture-1600.jpg") type("image/jpeg"));
  background-position: 82% center; background-size: 820px auto; background-repeat: repeat;
  filter: grayscale(.7) saturate(.35) brightness(1.12) contrast(.74);
}
.page--trainers .trainers-inquiries::after { z-index: -1; background: rgba(239, 227, 214, .86); }
.page--trainers .trainers-inquiries__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 80px); }
.page--trainers .trainers-inquiries__item + .trainers-inquiries__item { border-left: 1px solid var(--line); padding-left: clamp(32px, 4vw, 56px); }
.page--trainers .trainers-inquiries h2 { margin: 0; color: var(--bark); font: 500 32px/1.15 var(--font-display); }
.page--trainers .trainers-inquiries__item p { max-width: 54ch; margin: 18px 0 24px; color: var(--bark); font-size: 16px; line-height: 1.65; }
.page--trainers .trainers-inquiries__visit { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--line); }
.page--trainers .trainers-inquiries__visit p { margin: 0 auto 0 0; color: var(--bark); font-size: 15px; }
.page--trainers .trainers-inquiries__email { color: var(--bark); font-size: 14px; overflow-wrap: anywhere; text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 4px; }
@media (max-width: 1100px) {
  .page--trainers .trainers-landscape-hero__intro { grid-template-columns: 1fr; gap: 12px; padding-block: 20px 12px; }
  .page--trainers .trainers-landscape-hero__intro .lead { max-width: 64ch; }
  .page--trainers .trainers-landscape-hero__links { border-top: 1px solid var(--line); padding-top: 8px; }
}
@media (max-width: 899px) {
  .page--trainers .trainer-feature { grid-template-columns: 1fr; gap: 24px; max-width: 600px; margin-inline: auto; }
  .page--trainers .trainer-feature .trainer-feature__heading,
  .page--trainers .trainer-feature .trainer-feature__media,
  .page--trainers .trainer-feature .trainer-feature__copy { grid-column: 1; grid-row: auto; }
  .page--trainers .trainer-feature__heading h2 { max-width: none; }
  .page--trainers .trainer-feature__media { justify-self: start; }
  .page--trainers .trainer-feature--reverse .trainer-feature__media { justify-self: start; }
  .page--trainers .trainers-inquiries__grid { grid-template-columns: 1fr; gap: 32px; }
  .page--trainers .trainers-inquiries__item + .trainers-inquiries__item { border-left: 0; border-top: 1px solid var(--line); padding: 28px 0 0; }
}
@media (max-width: 640px) {
  .page--trainers .trainers-landscape-hero__banner { height: clamp(280px, 78vw, 340px); }
  .page--trainers .trainers-landscape-hero__media img { object-position: 58% center; }
  .page--trainers .trainers-landscape-hero__title-frame { padding-bottom: 24px; }
  .page--trainers .trainers-landscape-hero .display { max-width: 15ch; font-size: 40px; }
  .page--trainers .trainers-landscape-hero__intro .lead { max-width: 34ch; font-size: 20px; }
  .page--trainers .trainers-landscape-hero__links { gap: 0; flex-direction: column; }
  .page--trainers .trainers-landscape-hero__links a { justify-content: space-between; text-decoration: none; min-height: 46px; }
  .page--trainers .trainers-landscape-hero__links a + a { border-top: 1px solid var(--line); }
  .page--trainers .trainer-feature-section { padding-block: 40px; }
  .page--trainers .trainer-feature { gap: 20px; }
  .page--trainers .trainer-feature__heading h2 { font-size: 34px; }
  .page--trainers .trainer-feature__heading .eyebrow { margin-bottom: 10px; }
  .page--trainers .trainer-feature__copy .btn-row { margin-top: 22px; }
  .page--trainers .trainer-feature .btn-row,
  .page--trainers .trainers-inquiries .btn-row { flex-direction: column; align-items: stretch; gap: 8px; }
  .page--trainers .trainer-feature .textlink,
  .page--trainers .trainers-inquiries .textlink { align-self: flex-start; }
  .page--trainers .trainers-inquiries { padding-block: 40px 32px; }
  .page--trainers .trainers-inquiries::before { background-size: 520px auto; }
  .page--trainers .trainers-inquiries h2 { font-size: 30px; }
  .page--trainers .trainers-inquiries__visit { margin-top: 28px; padding-top: 24px; align-items: stretch; flex-direction: column; gap: 18px; }
  .page--trainers .trainers-inquiries__email { align-self: flex-start; min-height: 32px; }
}

/* CONTACT REDESIGN (2026-07-23)
   A calm, task-first page: one photographic opener, one clear form surface,
   one supporting visit card, and a practical map/directions pairing. */
.page--contact .contact-hero {
  padding-top: calc(var(--header-h) + clamp(3rem, 6vw, 5.5rem));
  padding-bottom: clamp(4rem, 7vw, 7rem);
  overflow: hidden;
  background: var(--cream);
  border-bottom: 1px solid var(--line);
}
.page--contact .contact-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(440px, 1.12fr);
  gap: clamp(3rem, 7vw, 7.5rem);
  align-items: center;
}
.page--contact .contact-hero__copy {
  position: relative;
  z-index: 1;
  max-width: 620px;
}
.page--contact .contact-hero .display {
  max-width: 10ch;
  margin-top: .7rem;
  font-size: clamp(3.2rem, 2.15rem + 3.7vw, 5.6rem);
}
.page--contact .contact-hero .lead {
  max-width: 52ch;
  margin-top: 1.5rem;
  font-size: clamp(1rem, .95rem + .25vw, 1.125rem);
  line-height: 1.7;
}
.page--contact .contact-hero__expectation {
  max-width: 52ch;
  margin-top: clamp(2rem, 4vw, 3rem);
  padding-block: 1.25rem;
  border-block: 1px solid var(--line);
}
.page--contact .contact-hero__expectation .eyebrow {
  margin-bottom: .5rem;
}
.page--contact .contact-hero__expectation p:last-child {
  color: var(--stone);
  font-size: var(--fs-small);
  line-height: 1.7;
}
.page--contact .contact-hero .btn-row {
  align-items: center;
  gap: 1.25rem 1.75rem;
  margin-top: 2rem;
}
.page--contact .contact-hero .textlink {
  margin-top: 0;
}
.page--contact .contact-hero__media {
  position: relative;
  width: 100%;
  margin: 0 auto;
  justify-self: center;
  padding: 9px;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--tan);
  box-shadow: var(--shadow-l1);
}
.page--contact .contact-hero__media picture {
  display: block;
  width: 100%;
  height: 100%;
}
.page--contact .contact-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(.9) contrast(.98);
}
.page--contact .contact-hero__media figcaption {
  position: absolute;
  left: 50%;
  right: auto;
  bottom: 1.05rem;
  width: max-content;
  max-width: calc(100% - 2.2rem);
  transform: translateX(-50%);
  padding: .4rem .65rem;
  background: rgba(36, 27, 18, .75);
  color: var(--cream);
  font-size: .7rem;
  letter-spacing: .09em;
  text-align: center;
  text-transform: uppercase;
}

.page--contact .contact-form-card {
  padding: clamp(1.5rem, 4vw, 3.25rem);
  background: var(--paper);
  border: 1px solid rgba(128, 96, 60, .62);
  box-shadow: var(--shadow-soft);
}
.page--contact .contact-form-card__head {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  align-items: baseline;
  margin-bottom: 2rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--line);
}
.page--contact .contact-form-card__head h3,
.page--contact .contact-visit-card > h3 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.65rem + 1.25vw, 2.85rem);
  font-weight: 500;
  line-height: 1.05;
  color: var(--bark);
}
.page--contact .form__required {
  flex: 0 0 auto;
  color: var(--stone);
  font-size: var(--fs-meta);
}
.page--contact .form__required span,
.page--contact .form-required {
  color: var(--tan-deep);
}
.page--contact .form__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem 1rem;
}
.page--contact .field--wide {
  grid-column: 1 / -1;
}
.page--contact .field input,
.page--contact .field select {
  min-height: 48px;
}
.page--contact .field select {
  appearance: auto;
  cursor: pointer;
}
.page--contact .field textarea {
  min-height: 176px;
}
.page--contact .form__actions {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem 1.5rem;
  align-items: center;
  margin-top: .25rem;
}
.page--contact .form__privacy {
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}

.page--contact .contact-visit-card {
  padding: clamp(1.75rem, 4vw, 3rem);
  background: var(--cream);
  border: 1px solid var(--tan);
  box-shadow: inset 0 0 0 5px var(--paper);
}
.page--contact .contact-visit-card > .eyebrow {
  margin-bottom: .7rem;
}
.page--contact .contact-visit-card > h3 {
  max-width: 9ch;
}
.page--contact .contact-visit-card .contact-detail {
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}
.page--contact .contact-visit-card > h3 + .contact-detail {
  margin-top: 2rem;
}
.page--contact .contact-visit-card .contact-detail + .contact-detail {
  margin-top: 1.25rem;
}
.page--contact .contact-detail h4 {
  margin-bottom: .4rem;
  color: var(--tan-deep);
  font-family: var(--font-body);
  font-size: var(--fs-eyebrow);
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.page--contact .contact-detail p,
.page--contact .contact-detail address {
  color: var(--ink);
  font-style: normal;
  overflow-wrap: anywhere;
}
.page--contact .contact-visit-card__note {
  margin-top: 2rem;
  padding: 1.25rem;
  background: var(--paper);
  border-left: 2px solid var(--tan-deep);
}
.page--contact .contact-visit-card__note .eyebrow {
  margin-bottom: .45rem;
}
.page--contact .contact-visit-card__note p:last-child {
  color: var(--stone);
  font-size: var(--fs-small);
  line-height: 1.65;
}

.page--contact .contact-directions {
  padding-block: clamp(4.5rem, 8vw, 8rem);
}
.page--contact .contact-directions__head {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(280px, .55fr);
  column-gap: clamp(3rem, 8vw, 8rem);
  align-items: end;
}
.page--contact .contact-directions__head .eyebrow {
  grid-column: 1 / -1;
  margin-bottom: .7rem;
}
.page--contact .contact-directions__head .display {
  max-width: 13ch;
}
.page--contact .contact-directions__head > p:last-child {
  max-width: 50ch;
  padding-bottom: .25rem;
  color: var(--stone);
}
.page--contact .contact-directions__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(310px, .75fr);
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: stretch;
  margin-top: clamp(2.75rem, 5vw, 4.5rem);
}
.page--contact .contact-directions .mapframe {
  min-height: 480px;
  padding: 8px;
  box-shadow: var(--shadow-soft);
}
.page--contact .contact-directions .mapframe iframe {
  height: 100%;
  min-height: 462px;
}
.page--contact .contact-directions .contact-route {
  max-width: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(2rem, 4vw, 3.25rem);
  background: var(--paper);
  border: 1px solid var(--tan);
}
.page--contact .contact-directions .contact-route > p:not(.eyebrow) {
  max-width: 48ch;
  line-height: 1.75;
}
.page--contact .contact-directions .contact-route address {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  width: 100%;
  border-top: 1px solid var(--line);
  color: var(--stone);
  font-size: var(--fs-small);
  font-style: normal;
}
.page--contact .contact-directions .contact-route .btn {
  margin-top: 1.75rem;
}
.page--contact .contact-close__copy {
  max-width: 42ch;
  margin: 1rem auto 0;
  color: var(--tan-light);
}

@media (max-width: 1023px) {
  .page--contact .contact-hero__grid {
    grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr);
    gap: 3rem;
  }
    .page--contact .contact-form-card {
    padding: 2rem;
  }
  .page--contact .contact-directions__grid {
    grid-template-columns: minmax(0, 1fr) minmax(290px, .72fr);
  }
}

@media (max-width: 899px) {
  .page--contact .contact-hero {
    padding-top: calc(var(--header-h) + 3rem);
  }
  .page--contact .contact-hero__grid,
  .page--contact .contact-layout,
  .page--contact .contact-directions__head,
  .page--contact .contact-directions__grid {
    grid-template-columns: 1fr;
  }
  .page--contact .contact-hero__copy {
    max-width: 700px;
  }
  .page--contact .contact-hero__media {
    aspect-ratio: 16 / 10;
  }
    .page--contact .contact-visit-card {
    width: 100%;
    max-width: 680px;
  }
  .page--contact .contact-directions__head {
    gap: 1rem;
  }
  .page--contact .contact-directions__head .eyebrow {
    grid-column: auto;
    margin-bottom: 0;
  }
  .page--contact .contact-directions__head > p:last-child {
    max-width: 60ch;
  }
  .page--contact .contact-directions .mapframe {
    min-height: 400px;
  }
  .page--contact .contact-directions .mapframe iframe {
    min-height: 382px;
  }
}

@media (max-width: 640px) {
  .page--contact .contact-hero {
    padding-top: calc(var(--header-h) + 2.25rem);
    padding-bottom: 4.5rem;
  }
  .page--contact .contact-hero__grid {
    gap: 2.75rem;
  }
  .page--contact .contact-hero .display {
    font-size: clamp(3rem, 14vw, 4.1rem);
  }
  .page--contact .contact-hero .btn-row {
    align-items: stretch;
  }
  .page--contact .contact-hero .btn {
    width: 100%;
  }
  .page--contact .contact-hero .textlink {
    width: max-content;
  }
  .page--contact .contact-hero__media {
    aspect-ratio: 4 / 3;
    padding: 6px;
  }
  .page--contact .contact-hero__media figcaption {
    bottom: .75rem;
    max-width: calc(100% - 1.6rem);
  }
  .page--contact .contact-inquiry,
  .page--contact .contact-directions {
    padding-block: 4.5rem;
  }
  .page--contact .contact-form-card,
  .page--contact .contact-visit-card {
    padding: 1.5rem;
  }
  .page--contact .contact-form-card__head {
    display: grid;
    gap: .5rem;
  }
  .page--contact .form__fields,
  .page--contact .form__actions {
    grid-template-columns: 1fr;
  }
  .page--contact .field--wide {
    grid-column: auto;
  }
  .page--contact .form__actions .btn {
    width: 100%;
  }
  .page--contact .contact-directions .mapframe,
  .page--contact .contact-directions .mapframe iframe {
    min-height: 340px;
  }
  .page--contact .contact-directions .contact-route {
    padding: 1.75rem 1.4rem;
  }
  .page--contact .contact-directions .contact-route .btn {
    width: 100%;
  }
}

/* Home revision, 2026-09-04: one compact introduction, then the location reel
   and boarding inquiry. All spacing changes stay on the Home page. */
.page--home .hero { min-height: 78vh; min-height: 78svh; }
.page--home .home-intro,
.page--home .home-location { padding-block: clamp(3rem, 5vw, 4.5rem); }
.page--home .home-intro__grid {
  display: grid;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
}
.page--home .home-intro__body { min-width: 0; }
.page--home .home-intro .sectionhead { margin-bottom: 1.25rem; }
.page--home .home-intro .display { max-width: 17ch; }
.page--home .home-intro .prose { max-width: 48ch; }
.page--home .home-intro .btn-row { gap: .75rem; margin-top: 1.5rem; }
.page--home .btn--sm { min-height: 44px; }
.page--home .home-intro__photo {
  min-width: 0;
  margin: 0;
  padding: 8px;
  border: 1px solid var(--tan);
  background: var(--paper);
}
.page--home .home-intro__photo img { display: block; width: 100%; height: auto; }
.page--home .home-location .sectionhead {
  max-width: none;
  margin-bottom: 1.75rem;
}
.page--home .home-location .sectionhead__rule { margin-top: 1rem; }
.page--home .home-location .photocard__body { padding: 1.25rem; }
.page--home .cta-band { padding-block: clamp(3rem, 5vw, 4.5rem); }
.page--home .home-inquiry__intro {
  max-width: 46ch;
  margin: 1rem auto 0;
  color: var(--cream);
}
.page--home .cta-band .btn-row { margin-top: 1.5rem; }
.page--home .cta-strip__meta { margin-top: 1.25rem; font-size: var(--fs-small); }
@media (min-width: 768px) {
  .page--home .home-intro__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .page--home .hero { min-height: 74vh; min-height: 74svh; }
  .page--home .hero__inner { padding-bottom: 3rem; }
  .page--home .hero .btn-row { gap: .75rem; margin-top: 1.5rem; }
  .page--home .home-location .sectionhead { max-width: 28ch; }
}

/* Home polish, 2026-09-04: a small gallery invitation after the location reel. */
.page--home .home-location .photostrip__head { justify-content: flex-end; }
.page--home .home-gallery {
  padding-block: 1.5rem;
  border-top: 1px solid var(--line);
}
.page--home .home-gallery__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.5rem, 4vw, 3rem);
}
.page--home .home-gallery__photos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.page--home .home-gallery__photos picture { display: block; min-width: 0; }
.page--home .home-gallery__photos img {
  display: block;
  width: 100%;
  height: 152px;
  object-fit: cover;
}
.page--home .home-gallery__copy { min-width: 0; }
.page--home .home-gallery .display {
  font-size: clamp(1.75rem, 2.6vw, 2.25rem);
  line-height: 1.1;
}
.page--home .home-gallery .btn { margin-top: 1rem; }
@media (max-width: 639px) {
  .page--home .home-gallery__inner { grid-template-columns: 1fr; gap: 1.25rem; }
  .page--home .home-gallery__photos img { height: 112px; }
  .page--home .home-gallery__copy { text-align: center; }
}


/* FARM HISTORY ARTICLE — 2026-09-09. Static reading layout, scoped to history.html. */
.page--history { background: var(--paper); }
.page--history .farm-history-article {
  padding-top: calc(var(--header-h) + clamp(2rem, 5vw, 4rem));
  padding-bottom: clamp(3rem, 6vw, 5rem);
}
.page--history .farm-history-article__column {
  width: calc(100% - 2 * var(--gutter));
  max-width: 66ch;
  margin-inline: auto;
}
.page--history .farm-history-article__back {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-bottom: clamp(1.25rem, 3vw, 2rem);
  font-size: .875rem;
}
.page--history .farm-history-article__header .eyebrow { margin-bottom: 1rem; }
.page--history .farm-history-article__header .display {
  max-width: 21ch;
  font-size: clamp(2.375rem, 1.65rem + 3vw, 3.75rem);
  line-height: 1.05;
  font-weight: 500;
  text-wrap: balance;
}
.page--history .farm-history-article__deck {
  margin-top: 1.25rem;
  font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem);
  line-height: 1.65;
  color: var(--stone);
}
.page--history .farm-history-article__figure {
  width: calc(100% - 2 * var(--gutter));
  max-width: 960px;
  margin: clamp(2rem, 4vw, 3rem) auto;
}
.page--history .farm-history-article__figure picture { display: block; }
.page--history .farm-history-article__figure img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center 75%;
}
.page--history .farm-history-article__figure figcaption {
  margin-top: .75rem;
  font-size: .8125rem;
  line-height: 1.5;
  color: var(--stone);
}
.page--history .farm-history-article__body {
  font-size: 1.0625rem;
  line-height: 1.75;
}
.page--history .farm-history-article__body section + section { margin-top: 2.5rem; }
.page--history .farm-history-article__body h2,
.page--history .farm-history-article__sources h2 {
  margin-bottom: 1rem;
  color: var(--bark);
  font-size: clamp(1.75rem, 1.4rem + 1.1vw, 2.125rem);
  line-height: 1.16;
  font-weight: 500;
  text-wrap: balance;
}
.page--history .farm-history-article__body p + p { margin-top: 1.125rem; }
.page--history .farm-history-article__body h2:not(:first-child) { margin-top: 2.5rem; }
.page--history .farm-history-article a {
  text-decoration: underline;
  text-decoration-color: var(--tan-deep);
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}
.page--history .farm-history-article a:hover { text-decoration-thickness: 2px; }
.page--history .farm-history-article__body a,
.page--history .farm-history-article__sources a { overflow-wrap: anywhere; }
.page--history .farm-history-article__sources {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--tan);
}
.page--history .farm-history-article__source-list {
  display: grid;
  gap: 1rem;
  padding-left: 1.25rem;
  font-size: .9375rem;
  line-height: 1.6;
}
.page--history .farm-history-article__source-list li { padding-left: .25rem; }
.page--history .farm-history-article__return {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--line);
}
.page--history .farm-history-article__return a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: .9375rem;
}
.page--history .farm-history-article [id] { scroll-margin-top: calc(var(--header-h) + 1.25rem); }
@media (max-width: 767px) {
  .page--history .farm-history-article__body { line-height: 1.65; }
  .page--history .farm-history-article__body section + section { margin-top: 2rem; }
  .page--history .farm-history-article__sources { margin-top: 2.5rem; }
}
@media (max-width: 899px) {
  .page--history .mobile-nav { overflow-y: auto; overscroll-behavior: contain; }
  .page--history .mobile-nav a { flex-shrink: 0; min-height: 44px; }
}
@media (max-width: 899px) and (max-height: 640px) {
  .page--history .mobile-nav {
    padding-top: calc(var(--header-h) + .75rem);
    padding-bottom: 1.5rem;
    gap: .25rem;
  }
  .page--history .mobile-nav a { padding-block: .375rem; font-size: 1.5rem; line-height: 1.25; }
  .page--history .mobile-nav .btn { margin-top: 1rem; }
}
/* END FARM HISTORY ARTICLE */

/* About article return anchor clears the fixed navigation. */
.page--about #history { scroll-margin-top: calc(var(--header-h) + 1.25rem); }

/* ABOUT OUR APPROACH — 2026-09-09. Static source for the phone sequence. */
.page--about #our-approach { scroll-margin-top: calc(var(--header-h) + .5rem); }
.page--about .about-philosophies {
  padding-block: clamp(3rem, 6vw, 5rem);
  background: var(--paper);
}
.page--about .about-philosophies__heading { margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.page--about .about-philosophies__rows { display: grid; gap: clamp(3rem, 6vw, 5rem); }
.page--about .about-philosophy {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 4rem);
}
.page--about .about-philosophy__photo { margin: 0; min-width: 0; }
.page--about .about-philosophy__photo picture { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.page--about .about-philosophy__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.page--about .about-philosophy__photo figcaption {
  margin-top: .625rem;
  font-size: .8125rem;
  line-height: 1.5;
  color: var(--stone);
}
.page--about .about-philosophy__body { min-width: 0; max-width: 46ch; }
.page--about .about-philosophy__body h3 {
  color: var(--bark);
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.25rem + 2vw, 3rem);
  font-weight: 500;
  line-height: 1.12;
  text-wrap: balance;
}
.page--about .about-philosophy__body .prose { margin-top: 1.25rem; }
@media (min-width: 768px) {
  .page--about .about-philosophy:nth-child(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
  .page--about .about-philosophy:nth-child(even) .about-philosophy__photo { grid-column: 2; grid-row: 1; }
  .page--about .about-philosophy:nth-child(even) .about-philosophy__body { grid-column: 1; grid-row: 1; }
}
@media (max-width: 767px) {
  .page--about .about-philosophies { padding-block: 2rem 2.5rem; }
  .page--about .about-philosophy { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .page--about .about-philosophy__body h3 { font-size: 1.75rem; }
  .page--about .about-philosophy__body .prose { margin-top: 1rem; font-size: 1.0625rem; line-height: 1.6; }
    }
/* END ABOUT OUR APPROACH */

/* FACILITIES HEADER AND LENGTH PASS — 2026-09-09.
   Keep the approved page compositions and motion; reduce repeated furniture
   and give the new eye-level hero its own clear photograph on phones. */
.page--facilities .section {
  padding-block: clamp(3rem, 5vw, 4.75rem);
}
.page--facilities .fac-hero {
  min-height: clamp(520px, 64svh, 620px);
}
.page--facilities .fac-hero__media img {
  object-position: center 72%;
  filter: none;
}
.page--facilities .fac-hero__wash { display: none; }
.page--facilities .fac-hero__inner {
  align-items: flex-start;
  padding-block: clamp(1.5rem, 3vw, 2.5rem);
}
.page--facilities .fac-hero__panel {
  width: min(100%, 500px);
  padding: clamp(1.4rem, 2.5vw, 2rem);
  background: rgba(250, 247, 242, .97);
}
.page--facilities .fac-hero__panel .display {
  font-size: clamp(2.4rem, 2rem + 1.4vw, 3.25rem);
}
.page--facilities .fac-hero__panel .lead {
  margin-top: .85rem;
  font-size: 1rem;
  line-height: 1.6;
}
.page--facilities .fac-hero__links {
  gap: 0 .65rem;
  margin-top: 1rem;
  padding-top: .65rem;
}
.page--facilities .fac-hero__links a { min-width: 44px; }
.page--facilities .fac-chapter-head {
  margin-bottom: clamp(1.5rem, 2.5vw, 2rem);
}
.page--facilities .sectionhead__rule { margin-top: .9rem; }
.page--facilities .fac-chapter-head__copy {
  margin-top: .9rem;
  line-height: 1.6;
}
.page--facilities .fac-explorer {
  min-height: 420px;
  margin-top: 1.5rem;
}
.page--facilities .fac-explorer__choice {
  min-height: 0;
  align-items: center;
  padding: 1.25rem 1.5rem;
}
.page--facilities .fac-explorer__copy { gap: .45rem; }
.page--facilities .fac-explorer__copy > span,
.page--facilities .fac-arena-card__surface > p:last-child,
.page--facilities .fac-detail-card figcaption span,
.page--facilities .speclist__val {
  font-size: 1rem;
  line-height: 1.6;
}
.page--facilities .fac-arena-card__surface {
  padding: clamp(1.2rem, 2.3vw, 1.65rem);
}
.page--facilities .fac-arena-card__surface .display {
  max-width: none;
  margin: 0 0 .5rem;
  font-size: clamp(1.85rem, 1.55rem + 1vw, 2.45rem);
}
.page--facilities .fac-arena-card__dimension {
  margin-bottom: .65rem;
  font-size: clamp(1.5rem, 1.3rem + .65vw, 1.85rem);
}
.page--facilities .fac-barns__copy .display { max-width: none; }

@media (max-width: 767px) {
  .page--facilities .section { padding-block: 2.5rem; }
  .page--facilities .fac-hero {
    display: block;
    min-height: 0;
    background: var(--paper);
  }
  .page--facilities .fac-hero__media {
    position: relative;
    inset: auto;
    aspect-ratio: 3 / 2;
  }
  .page--facilities .fac-hero__media img { object-position: center; }
  .page--facilities .fac-hero__inner {
    display: block;
    padding: 1.35rem var(--gutter) 1.5rem;
  }
  .page--facilities .fac-hero__panel {
    width: 100%;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: var(--paper);
  }
  .page--facilities .fac-hero__panel .display { font-size: 2.5rem; }
  .page--facilities .fac-hero__links { gap: 0 .6rem; }
  .page--facilities .fac-explorer { min-height: 0; }
  .page--facilities .fac-explorer__media {
    min-height: 0;
    aspect-ratio: 3 / 2;
  }
  .page--facilities .fac-explorer__choice {
    grid-template-columns: 1.5rem minmax(0, 1fr);
    gap: .65rem;
    padding: 1rem 1.1rem;
  }
  .page--facilities .fac-explorer__copy strong { font-size: 1.65rem; }
  .page--facilities .fac-arena-story { gap: 1.5rem; }
  .page--facilities .fac-arena-card__chapter { margin: 0; }
  .page--facilities .fac-arena-card__surface { border-top: 0; }
  .page--facilities .fac-arena-card__media img { aspect-ratio: 16 / 9; }
              }
/* END FACILITIES HEADER AND LENGTH PASS */

/* FACILITIES PHOTO SELECTORS — 2026-09-09.
   The original At a Glance keeps its layout. The added galleries become
   independent selectors only after their controls are initialized. */
.page--facilities .fac-photo-selector { margin-top: 0; }
.page--facilities .fac-photo-selector [hidden] { display: none; }
.page--facilities .fac-photo-selector .fac-explorer__choice { min-height: 88px; }
.page--facilities .fac-photo-selector .fac-explorer__image img { filter: none; }
.page--facilities .fac-photo-selector .fac-explorer__image figcaption {
  max-width: calc(100% - 6rem);
  line-height: 1.4;
}
.page--facilities .fac-photo-selector.is-enhanced { min-height: 0; }
.page--facilities .fac-photo-selector.is-enhanced .fac-explorer__media {
  min-height: clamp(340px, 33vw, 440px);
}
.page--facilities .fac-photo-selector--roundpens .fac-explorer__choices {
  grid-template-rows: repeat(2, minmax(0, 1fr));
}
.page--facilities .fac-photo-selector--roundpens [data-facilities-media="1"] img {
  object-position: center 65%;
}

/* Complete no-JS source: every image has a normal caption, including the
   two round-pen dimensions. Inert buttons and counters stay hidden. */
.page--facilities .fac-photo-selector:not(.is-enhanced) {
  display: block;
  min-height: 0;
}
.page--facilities .fac-photo-selector:not(.is-enhanced) .fac-explorer__media {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 1rem;
  min-height: 0;
  aspect-ratio: auto;
  background: var(--cream);
}
.page--facilities .fac-photo-selector:not(.is-enhanced) .fac-explorer__image {
  position: relative;
  inset: auto;
  opacity: 1;
  transform: none;
}
.page--facilities .fac-photo-selector:not(.is-enhanced) .fac-explorer__image picture {
  height: auto;
}
.page--facilities .fac-photo-selector:not(.is-enhanced) .fac-explorer__image img {
  height: auto;
  aspect-ratio: 3 / 2;
}
.page--facilities .fac-photo-selector:not(.is-enhanced) .fac-explorer__image figcaption {
  position: static;
  max-width: none;
  padding: .8rem 1rem;
  background: var(--cream);
  color: var(--bark);
  font-size: .875rem;
  letter-spacing: 0;
  text-transform: none;
}
@media (max-width: 767px) {
  .page--facilities .fac-photo-selector.is-enhanced .fac-explorer__media {
    min-height: 0;
    aspect-ratio: 3 / 2;
  }
      }
/* END FACILITIES PHOTO SELECTORS */

/* FACILITIES SHORT-PHONE MENU — 2026-09-09.
   Match the proven About/History drawer behavior without changing other pages. */
@media (max-width: 899px) {
  .page--facilities .mobile-nav {
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .page--facilities .mobile-nav a { flex-shrink: 0; min-height: 44px; }
}
@media (max-width: 899px) and (max-height: 640px) {
  .page--facilities .mobile-nav {
    padding-top: calc(var(--header-h) + .75rem);
    padding-bottom: 1.5rem;
    gap: .25rem;
  }
  .page--facilities .mobile-nav a {
    padding-block: .375rem;
    font-size: 1.5rem;
    line-height: 1.25;
  }
  .page--facilities .mobile-nav .btn { margin-top: 1rem; }
}
/* END FACILITIES SHORT-PHONE MENU */

/* FACILITIES CONFIRMED PHOTO FOLLOW-UP — 2026-09-09.
   Normal document flow replaces the Eurociser scrub. Its original 4:3 frame
   keeps the horse visible; the barn aisle uses its original photograph. */
.page--facilities .fac-euro-static {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  align-items: center;
  margin-top: clamp(2.5rem, 5vw, 4rem);
  overflow: hidden;
  background: var(--paper);
  border: 1px solid rgba(128, 96, 60, .5);
}
.page--facilities .fac-euro-static__media { min-width: 0; margin: 0; }
.page--facilities .fac-euro-static__media picture { display: block; }
.page--facilities .fac-euro-static__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center;
}
.page--facilities .fac-euro-static__media figcaption {
  padding: .65rem 1rem;
  color: var(--stone);
  font-size: .8125rem;
  line-height: 1.5;
}
.page--facilities .fac-euro-static__copy {
  min-width: 0;
  padding: clamp(1.3rem, 3vw, 2.25rem);
}
.page--facilities .fac-euro-static__copy .display {
  margin-bottom: .8rem;
  font-size: clamp(2rem, 1.65rem + 1.1vw, 2.75rem);
}
.page--facilities .fac-euro-static__copy > p { color: var(--stone); }
.page--facilities .fac-euro-static__copy .speclist { margin-top: 1rem; }
.page--facilities .fac-euro-static__copy .speclist__row { padding-block: .65rem; }
.page--facilities .fac-barns__main img { filter: none; }
@media (max-width: 899px) {
  .page--facilities .fac-euro-static { grid-template-columns: minmax(0, 1fr); }
}
/* END FACILITIES CONFIRMED PHOTO FOLLOW-UP */

/* FACILITIES PHONE LAYOUT — 2026-09-09.
   Compact choices, a native arena strip, and quieter framing. Tablet and
   desktop rules, including the approved header, remain unchanged. */
@media (max-width: 767px) {
  .page--facilities .fac-chapter-head { margin-bottom: 1.35rem; }
  .page--facilities .fac-explorer,
  .page--facilities .fac-arena-card__media,
  .page--facilities .fac-arena-card__surface,
  .page--facilities .fac-barns__grid,
  .page--facilities .fac-trails__land,
  .page--facilities .fac-trails__amenity { box-shadow: none; }
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__choices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 0;
    border-bottom: 1px solid var(--line);
  }
  .page--facilities .fac-photo-selector--roundpens.is-enhanced.has-phone-summary .fac-explorer__choices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__choice {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 64px;
    padding: .75rem .25rem;
    border: 0;
    border-right: 1px solid var(--line);
    border-bottom: 3px solid transparent;
    text-align: center;
  }
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__choice:last-child { border-right: 0; }
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__choice.is-active {
    border-bottom-color: var(--bark);
    background: var(--paper);
  }
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__number,
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__copy > span { display: none; }
  .page--facilities .fac-explorer.is-enhanced.has-phone-summary .fac-explorer__copy strong {
    font-family: var(--font-body);
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1.35;
    overflow-wrap: normal;
    word-break: normal;
  }
  .page--facilities .fac-explorer__summary:not([hidden]) {
    grid-column: 1 / -1;
    padding: 1rem 1.1rem;
    color: var(--stone);
    background: var(--paper);
    font-size: 1rem;
    line-height: 1.6;
  }
  
  .page--facilities .fac-arena-story {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    align-items: stretch;
  }
  .page--facilities .fac-arena-card {
    display: flex;
    flex-direction: column;
    flex: 0 0 100%;
    min-width: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  .page--facilities .fac-arena-card__media { border: 0; flex-shrink: 0; }
  .page--facilities .fac-arena-card__chapter { flex: 1; }
  .page--facilities .fac-arena-card__surface {
    height: 100%;
    padding: 1.1rem;
    border: 0;
  }
  .page--facilities .fac-arena-controls:not([hidden]) {
    display: grid;
    grid-template-columns: minmax(88px, 1fr) auto minmax(88px, 1fr);
    gap: .75rem;
    align-items: center;
    margin-top: .85rem;
  }
  .page--facilities .fac-arena-controls button {
    min-height: 44px;
    padding: .6rem .8rem;
    border: 1px solid var(--tan-deep);
    border-radius: var(--radius);
    background: var(--paper);
    color: var(--bark);
    font: 500 .875rem/1.3 var(--font-body);
    cursor: pointer;
  }
  .page--facilities .fac-arena-controls button:disabled { opacity: .45; cursor: default; }
  .page--facilities .fac-arena-controls__status {
    color: var(--stone);
    font-size: .875rem;
    font-variant-numeric: lining-nums tabular-nums;
    white-space: nowrap;
  }
  .page--facilities .fac-euro-static { margin-top: 2rem; }
  .page--facilities .fac-euro-static__media figcaption { padding: .5rem 1rem; }
  .page--facilities .fac-euro-static__copy { padding: 1rem 1.1rem 1.15rem; }
  .page--facilities .fac-euro-static__copy .speclist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .9rem 1rem;
  }
  .page--facilities .fac-euro-static__copy .speclist__row {
    display: grid;
    align-content: start;
    gap: .2rem;
    padding: 0;
    border: 0;
  }
  .page--facilities .fac-euro-static__copy .speclist__val { text-align: left; }
  .page--facilities .fac-barns--wood::before,
  .page--facilities .fac-barns--wood::after { display: none; }
  .page--facilities .fac-barns__grid { border: 0; }
  .page--facilities .fac-barns__copy { padding: 1.1rem; }
  .page--facilities .cta-band .btn-row { width: 100%; }
  .page--facilities .cta-band .btn { width: 100%; min-height: 48px; justify-content: center; }
}
/* END FACILITIES PHONE LAYOUT */

/* FACILITIES HEADER AND TURNOUT COPY — 2026-09-10. */
.page--facilities .fac-turnout-note {
  max-width: 76ch;
  color: var(--stone);
  font-size: 1rem;
  line-height: 1.65;
}
@media (max-width: 767px) {
  .page--facilities .fac-hero {
    display: grid;
    grid-template-columns: var(--gutter) minmax(0, 1fr) var(--gutter);
    grid-template-rows: clamp(230px, 64vw, 320px) auto auto;
    padding-bottom: 1.25rem;
  }
  .page--facilities .fac-hero__media {
    grid-column: 1 / -1;
    grid-row: 1;
    height: 100%;
    aspect-ratio: auto;
  }
  .page--facilities .fac-hero__media img { object-position: center 60%; }
  .page--facilities .fac-hero__wash {
    display: block;
    position: static;
    grid-column: 1 / -1;
    grid-row: 1;
    background: linear-gradient(180deg, rgba(36, 27, 18, 0) 35%, rgba(36, 27, 18, .12) 58%, rgba(36, 27, 18, .72));
  }
  .page--facilities .fac-hero__inner,
  .page--facilities .fac-hero__panel { display: contents; }
  .page--facilities .fac-hero__panel.entrance > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .page--facilities .fac-hero__panel .display {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    z-index: 2;
    margin: 0 0 1.2rem;
    color: var(--paper);
    font-size: clamp(2.25rem, 6vw, 2.5rem);
    line-height: 1.05;
  }
  .page--facilities .fac-hero__panel .lead {
    grid-column: 2;
    grid-row: 2;
    max-width: none;
    margin-top: 1rem;
  }
  .page--facilities .fac-hero__links {
    grid-column: 2;
    grid-row: 3;
    margin-top: .85rem;
    padding-top: .55rem;
  }
}
/* END FACILITIES HEADER AND TURNOUT COPY */

@media (max-width: 360px) {
  .page--facilities .fac-hero__links { gap: 0 .25rem; }
  .page--facilities .fac-hero__links a {
    min-width: 44px;
    min-height: 44px;
    font-size: .8125rem;
  }
}

/* FACILITIES TRAILS FACT CARDS — 2026-09-10.
   Full card borders replace the former shared and nth-child dividers. */
.page--facilities .fac-trails__copy .speclist {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  border: 0;
}
.page--facilities .fac-trails__copy .speclist__row {
  min-width: 0;
  padding: 1rem;
  background: var(--paper);
  border: 1px solid rgba(128, 96, 60, .38);
}
@media (max-width: 767px) {
  .page--facilities .fac-trails__copy .speclist {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
  }
  .page--facilities .fac-trails__copy .speclist__row { padding: .85rem .75rem; }
}
/* END FACILITIES TRAILS FACT CARDS */

/* FACILITIES TYPE AND SPACING — 2026-09-10.
   One restrained hierarchy for section heads, subsection heads, body copy
   and supporting facts. Keep the established layouts and compact controls. */
.page--facilities main { font-size: 16px; line-height: 1.55; }
.page--facilities .section { padding-block: 56px; }
.page--facilities .fac-hero__panel .display { font-size: 48px; line-height: 1.05; }
.page--facilities .sectionhead:not(.sectionhead--sub) > .display,
.page--facilities .cta-strip .display { font-size: 36px; line-height: 1.1; }
.page--facilities .fac-arena-card__surface .display,
.page--facilities .fac-euro-static__copy .display,
.page--facilities .fac-barns__copy .display {
  margin-bottom: 12px;
  font-size: 28px;
  line-height: 1.15;
}
.page--facilities .fac-explorer__copy strong { font-size: 24px; line-height: 1.15; }
.page--facilities .fac-arena-card__dimension {
  margin-bottom: 12px;
  font-size: 20px;
  line-height: 1.3;
}
.page--facilities .fac-hero__panel .lead,
.page--facilities .fac-chapter-head__copy,
.page--facilities .fac-explorer__copy > span,
.page--facilities .fac-explorer__summary:not([hidden]),
.page--facilities .fac-arena-card__surface > p:last-child,
.page--facilities .fac-euro-static__copy > p,
.page--facilities .fac-barns__copy > p,
.page--facilities .fac-turnout-note,
.page--facilities .cta-strip__meta {
  font-size: 16px;
  line-height: 1.55;
}
.page--facilities .speclist__term,
.page--facilities .speclist__val { font-size: 15px; line-height: 1.5; }
.page--facilities .fac-chapter-head { margin-bottom: 24px; }
.page--facilities .fac-chapter-head__copy { margin-top: 12px; }
.page--facilities .sectionhead__rule { margin-top: 12px; }
.page--facilities .fac-arena-card__surface,
.page--facilities .fac-euro-static__copy,
.page--facilities .fac-barns__copy,
.page--facilities .fac-explorer__choice { padding: 24px; }
.page--facilities .fac-euro-static { margin-top: 40px; }
.page--facilities .fac-barns__copy .btn-row { margin-top: 16px; }
.page--facilities .fac-barns__copy .btn { min-height: 44px; }
.page--facilities .fac-turnout-note { max-width: 65ch; }
.page--facilities .cta-strip .btn-row { margin-top: 20px; }
.page--facilities .cta-strip__meta {
  max-width: 60ch;
  margin: 16px auto 0;
}
@media (max-width: 767px) {
  .page--facilities .section { padding-block: 36px; }
  .page--facilities .fac-hero__panel .display { font-size: 36px; }
  .page--facilities .sectionhead:not(.sectionhead--sub) > .display,
  .page--facilities .cta-strip .display { font-size: 28px; }
  .page--facilities .fac-arena-card__surface .display,
  .page--facilities .fac-euro-static__copy .display,
  .page--facilities .fac-barns__copy .display { font-size: 24px; }
  .page--facilities .fac-arena-card__dimension { font-size: 18px; }
  .page--facilities .fac-chapter-head { margin-bottom: 20px; }
    .page--facilities .fac-arena-card__surface,
  .page--facilities .fac-euro-static__copy,
  .page--facilities .fac-barns__copy,
  .page--facilities .fac-explorer__choice,
  .page--facilities .fac-explorer__summary:not([hidden]) { padding: 16px; }
  .page--facilities .fac-euro-static { margin-top: 32px; }
}
/* END FACILITIES TYPE AND SPACING */

/* FACILITIES SELECTOR NOTES — 2026-09-10.
   Live updates stay available to screen readers without adding a text strip. */
.page--facilities .fac-explorer__summary.visually-hidden {
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
}
.page--facilities .fac-turnout-note {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.5;
}
/* END FACILITIES SELECTOR NOTES */

/* FACILITIES REVIEW FEEDBACK: 2026-09-13. */
.page--facilities .fac-equipment-details {
  margin-top: 20px;
  border-top: 1px solid var(--line);
}
.page--facilities .fac-equipment-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  padding-block: 10px;
  color: var(--bark);
  font: 500 15px/1.5 var(--font-body);
  cursor: pointer;
  list-style: none;
}
.page--facilities .fac-equipment-details summary::-webkit-details-marker { display: none; }
.page--facilities .fac-equipment-details summary::after { content: "+"; font-size: 22px; }
.page--facilities .fac-equipment-details[open] summary::after { content: "−"; }
.page--facilities .fac-equipment-details summary:focus-visible {
  outline: 2px solid var(--bark);
  outline-offset: 3px;
}
.page--facilities .fac-equipment-details .speclist {
  margin: 4px 0 0;
  opacity: 1;
  transform: none;
}
@media (max-width: 767px) {
  .page--facilities .fac-hero__panel .lead {
    margin-top: 22px;
    max-width: 38ch;
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--bark);
    text-wrap: pretty;
  }
}
.page--facilities .fac-barns--wood {
  background: var(--paper);
  border-block: 1px solid var(--line);
}
.page--facilities .fac-barns--wood::before,
.page--facilities .fac-barns--wood::after { display: none; }
.page--facilities .fac-barns__grid { background: transparent; }
.page--facilities .fac-barns__copy { background: transparent; }
/* END FACILITIES REVIEW FEEDBACK */

/* BOARDING REVIEW: 2026-09-14.
   Compact interior-page scale, one care section, and smaller photo choices. */
.page--boarding main { font-size: 16px; line-height: 1.55; }
.page--boarding .section { padding-block: 56px; }
.page--boarding .sectionhead { margin-bottom: 24px; }
.page--boarding .sectionhead:not(.sectionhead--sub) > .display { font-size: 36px; line-height: 1.1; }
.page--boarding .sectionhead__rule { margin-top: 12px; }
.page--boarding main p,
.page--boarding main .lead { font-size: 16px; line-height: 1.55; }
.page--boarding main .btn { min-height: 44px; }
.page--boarding .boarding-hero {
  padding-block: calc(var(--header-h) + 36px) 36px;
  background: var(--cream);
}
.page--boarding .boarding-hero .display {
  max-width: 12ch;
  font-size: 48px;
  line-height: 1.05;
}
.page--boarding .boarding-hero__copy .lead { margin-top: 16px; max-width: 38ch; }
.page--boarding .boarding-hero__media { padding: 0; border: 0; box-shadow: none; }
.page--boarding .boarding-hero__media img {
  height: auto;
  aspect-ratio: 3 / 2;
  max-height: 400px;
  object-position: center;
}
.page--boarding .boarding-hero__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0 20px;
  margin-top: 24px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.page--boarding .boarding-hero__links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--bark);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}
.page--boarding .boarding-hero__links a:hover { text-decoration: underline; text-underline-offset: 5px; }
.page--boarding .boarding-hero__links a:focus-visible { outline: 2px solid var(--bark); outline-offset: 3px; }
.page--boarding .boarding-routine__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: center;
}
.page--boarding .boarding-routine__visual { position: static; max-width: none; }
.page--boarding .boarding-routine__visual figure { padding: 0; border: 1px solid var(--line); box-shadow: none; }
.page--boarding .boarding-routine__visual img { aspect-ratio: 4 / 3; object-position: center; }
.page--boarding .boarding-routine__visual figcaption {
  padding: 10px 16px;
  text-align: left;
  font: 400 13px/1.5 var(--font-body);
  letter-spacing: 0;
  font-variant-caps: normal;
}
.page--boarding .boarding-routine__story { padding: 0; }
.page--boarding .boarding-routine__story > .speclist { margin-top: 0; }
.page--boarding .boarding-routine .speclist__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding-block: 12px;
}
.page--boarding .speclist__term,
.page--boarding .speclist__val { font-size: 15px; line-height: 1.5; text-align: left; }
.page--boarding .boarding-care-note { margin-top: 24px; }
.page--boarding .boarding-care-note .display,
.page--boarding .boarding-visit .display { font-size: 28px; line-height: 1.15; margin-bottom: 12px; }
.page--boarding .boarding-care-note p { color: var(--stone); max-width: 60ch; }
.page--boarding .boarding-care-note p + p { margin-top: 8px; }
.page--boarding .boarding-stalls__browser {
  margin-top: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
}
.page--boarding .boarding-stalls__browser .boarding-selector__visual {
  height: auto;
  min-height: 380px;
}
.page--boarding .boarding-selector__visual { box-shadow: none; }
.page--boarding .boarding-selector__media figcaption {
  left: 12px;
  bottom: 12px;
  max-width: calc(100% - 24px);
  padding: 8px 12px;
  font: 400 13px/1.4 var(--font-body);
  letter-spacing: 0;
  font-variant-caps: normal;
}
.page--boarding .boarding-selector__count {
  min-width: 0;
  padding: 6px 10px;
  font: 500 12px/1.4 var(--font-body);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: .04em;
}
.page--boarding .boarding-turnout__grid {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 40px;
}
.page--boarding .boarding-turnout__copy { max-width: 60ch; }
.page--boarding .boarding-turnout__note { margin-top: 12px; font-size: 15px; color: var(--stone); }
.page--boarding .boarding-turnout__copy .btn-row { margin-top: 20px; }
.page--boarding .boarding-turnout__choice {
  min-height: 64px;
  padding: 10px;
  font-size: 14px;
  background: var(--paper);
}
.page--boarding .boarding-turnout__choice.is-active { background: var(--cream); }
.page--boarding .boarding-start__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr);
  gap: 56px;
}
.page--boarding .boarding-start__copy { max-width: 60ch; }
.page--boarding .boarding-start__copy p + p { margin-top: 12px; }
.page--boarding .boarding-start .btn-row { margin-top: 20px; gap: 12px; }
.page--boarding .boarding-start .btn { font-size: 14px; padding: 12px 18px; }
.page--boarding .boarding-visit { padding-left: 32px; border-left: 1px solid var(--line); }
.page--boarding .boarding-visit p { margin-bottom: 20px; color: var(--stone); }
.page--boarding .boarding-visit__email {
  display: block;
  margin-top: 12px;
  color: var(--bark);
  font-size: 14px;
  overflow-wrap: anywhere;
  text-underline-offset: 3px;
}
@media (max-width: 899px) {
    .page--boarding .boarding-routine__grid,
  .page--boarding .boarding-turnout__grid { grid-template-columns: 1fr; gap: 24px; }
  .page--boarding .boarding-routine__visual img { aspect-ratio: 16 / 9; max-height: 360px; }
  .page--boarding .boarding-stalls__browser { grid-template-columns: 1fr; }
  .page--boarding .boarding-stalls__browser .boarding-selector__visual { min-height: 0; aspect-ratio: 3 / 2; max-height: 420px; }
              .page--boarding .boarding-turnout__viewer .boarding-selector__visual { aspect-ratio: 3 / 2; max-height: 420px; }
  .page--boarding .boarding-start__inner { gap: 32px; }
}
@media (max-width: 767px) {
  .page--boarding .section { padding-block: 36px; }
  .page--boarding .sectionhead { margin-bottom: 20px; }
  .page--boarding .sectionhead:not(.sectionhead--sub) > .display { font-size: 28px; }
  .page--boarding .boarding-care-note .display,
  .page--boarding .boarding-visit .display { font-size: 24px; }
  .page--boarding .boarding-hero { padding-block: var(--header-h) 0; }
    .page--boarding .boarding-hero__media { grid-row: 1; }
  .page--boarding .boarding-hero__media img { max-height: 320px; aspect-ratio: 3 / 2; }
  .page--boarding .boarding-hero__copy { padding: 24px var(--gutter) 20px; max-width: none; }
  .page--boarding .boarding-hero .display { max-width: none; font-size: 36px; }
  .page--boarding .boarding-hero__copy .lead {
    margin-top: 12px;
    max-width: 36ch;
    font: 500 22px/1.3 var(--font-display);
    color: var(--bark);
  }
  .page--boarding .boarding-hero__links { margin-top: 16px; gap: 0 20px; }
  .page--boarding .boarding-routine .speclist__row { grid-template-columns: 1fr 1fr; gap: 12px; }
    .page--boarding .boarding-turnout__choice { font-size: 13px; }
  .page--boarding .boarding-start__inner { grid-template-columns: 1fr; gap: 28px; }
  .page--boarding .boarding-visit { border-left: 0; border-top: 1px solid var(--line); padding: 24px 0 0; }
}
/* END BOARDING REVIEW */

/* BOARDING PHOTO HEADER: 2026-09-14.
   The title belongs to a full-width banner; introduction and anchors form its lower bar. */
.page--boarding .boarding-hero { padding-block: var(--header-h) 0; border-bottom: 1px solid var(--line); }
.page--boarding .boarding-hero__banner { position: relative; height: clamp(340px, 30vw, 430px); isolation: isolate; background: var(--bark-deep); }
.page--boarding .boarding-hero__media,
.page--boarding .boarding-hero__wash { position: absolute; inset: 0; margin: 0; }
.page--boarding .boarding-hero__media { z-index: -2; left: 0; }
.page--boarding .boarding-hero__media picture { display: block; width: 100%; height: 100%; }
.page--boarding .boarding-hero__media img {
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center 35%;
}
.page--boarding .boarding-hero__wash {
  z-index: -1;
  background: linear-gradient(90deg, rgba(63, 43, 27, .65), rgba(63, 43, 27, .42) 22%, rgba(63, 43, 27, .12) 45%, transparent 66%), linear-gradient(180deg, transparent 45%, rgba(36, 27, 18, .4));
}
.page--boarding .boarding-hero__title-frame { height: 100%; display: flex; align-items: flex-end; padding-bottom: 32px; }
.page--boarding .boarding-hero .display { max-width: none; margin: 0; color: var(--paper); font-size: 48px; line-height: 1.05; }
.page--boarding .boarding-hero__copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 40px;
  align-items: center;
  max-width: var(--container);
  padding: 22px var(--gutter);
}
.page--boarding .boarding-hero__copy .lead { max-width: 48ch; margin: 0; }
.page--boarding .boarding-hero__links { margin: 0; padding: 0; border: 0; gap: 0 24px; }
@media (max-width: 899px) {
  .page--boarding .boarding-hero__copy { grid-template-columns: 1fr; gap: 12px; padding-block: 20px 16px; }
  .page--boarding .boarding-hero__links { border-top: 1px solid var(--line); padding-top: 8px; gap: 0 20px; }
}
@media (max-width: 767px) {
  .page--boarding .boarding-hero__banner { height: clamp(250px, 66vw, 320px); }
  .page--boarding .boarding-hero__media { left: 0; }
  .page--boarding .boarding-hero__wash { background: linear-gradient(180deg, transparent 35%, rgba(36, 27, 18, .18) 60%, rgba(36, 27, 18, .76)); }
  .page--boarding .boarding-hero__title-frame { padding-bottom: 20px; }
  .page--boarding .boarding-hero .display { font-size: 36px; }
  .page--boarding .boarding-hero__copy .lead { max-width: 36ch; }
}
/* END BOARDING PHOTO HEADER */

/* BOARDING PHONE REFINEMENT: 2026-09-14. */
@media (max-width: 767px) {
  .page--boarding .boarding-hero__banner { height: clamp(300px, 85vw, 360px); }
  .page--boarding .boarding-hero__media img { object-position: 55% center; }
  .page--boarding .boarding-hero__wash {
    background: linear-gradient(180deg, transparent 38%, rgba(36, 27, 18, .15) 56%, rgba(36, 27, 18, .82));
  }
  .page--boarding .boarding-hero__title-frame { padding-bottom: 24px; }
  .page--boarding .boarding-hero .display {
    max-width: 6.5em;
    font-size: 42px;
    line-height: .98;
    text-wrap: balance;
  }
  .page--boarding .boarding-hero__copy { gap: 20px; padding-block: 22px 12px; }
  .page--boarding .boarding-hero__copy .lead { max-width: 32ch; font-size: 20px; line-height: 1.4; }
  .page--boarding .boarding-hero__links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding-top: 8px;
  }
  .page--boarding .boarding-hero__links a { min-height: 44px; justify-content: center; font-size: 13px; }
  .page--boarding .boarding-hero__links a + a { position: relative; }
  .page--boarding .boarding-hero__links a + a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 15px;
    bottom: 15px;
    border-left: 1px solid var(--line);
  }
  .page--boarding .boarding-routine__grid { gap: 20px; }
  .page--boarding .boarding-routine__story { display: contents; }
  .page--boarding .boarding-routine__story > .sectionhead { order: -1; margin-bottom: 0; }
  .page--boarding .boarding-routine__visual figure { border: 0; }
  .page--boarding .boarding-routine__visual figcaption { padding: 8px 0 0; }
  .page--boarding .boarding-care-note { margin-top: 4px; padding-top: 20px; border-top: 1px solid var(--line); }
  .page--boarding .boarding-start .btn-row { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .page--boarding .boarding-start .btn { width: 100%; justify-content: center; }
}
/* END BOARDING PHONE REFINEMENT */

/* BOARDING VISIT BACKGROUND: 2026-09-14. Reuse the site's real stall-door boards. */
.page--boarding .boarding-start { position: relative; isolation: isolate; overflow: hidden; }
.page--boarding .boarding-start::before,
.page--boarding .boarding-start::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.page--boarding .boarding-start::before {
  z-index: -2;
  background-image: url("../img-v2/cta-texture-1600.jpg");
  background-image: image-set(url("../img-v2/cta-texture-1600.webp") type("image/webp"), url("../img-v2/cta-texture-1600.jpg") type("image/jpeg"));
  background-position: 82% center;
  background-size: 820px auto;
  background-repeat: repeat;
  filter: grayscale(.7) saturate(.35) brightness(1.12) contrast(.74);
}
.page--boarding .boarding-start::after { z-index: -1; background: rgba(239, 227, 214, .86); }
.page--boarding .boarding-start .boarding-visit p { color: var(--bark); }
@media (max-width: 767px) {
  .page--boarding .boarding-start::before { background-size: 520px auto; }
}
/* END BOARDING VISIT BACKGROUND */

/* BOARDING STALL PHOTOS: 2026-09-14. Photo subjects and boarding options stay distinct. */
.page--boarding .boarding-stall-gallery { min-width: 0; display: grid; grid-template-rows: 1fr auto; }
/* END BOARDING STALL PHOTOS */

/* BOARDING GALLERY AND DESCRIPTION: 2026-09-14. */
.page--boarding .boarding-stalls > .container { max-width: 1008px; }
.page--boarding .boarding-stalls__browser { display: block; }
.page--boarding .boarding-stalls__browser .boarding-selector__visual {
  min-height: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  max-height: 520px;
}
.page--boarding .boarding-stalls__description { max-width: 70ch; margin-top: 22px; }
.page--boarding .boarding-stalls__description p { margin: 0; }
/* END BOARDING GALLERY AND DESCRIPTION */

/* BOARDING UNLABELED SLIDER: 2026-09-14. */
.page--boarding .boarding-stall-gallery { display: block; }
.page--boarding .boarding-stall-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: var(--paper);
  color: var(--bark);
  cursor: pointer;
}
.page--boarding .boarding-stall-arrow--previous { left: 12px; }
.page--boarding .boarding-stall-arrow--next { right: 12px; }
.page--boarding .boarding-stall-arrow:hover { background: var(--cream); }
.page--boarding .boarding-stall-arrow:focus-visible { outline: 2px solid var(--bark); outline-offset: -5px; }
/* END BOARDING UNLABELED SLIDER */

/* STEP 1 FIXES (2026-09-30), from the professional review.
   Contact: the two section headings had no size of their own (browser
   default, 25.5px) and sat under 44px card titles. Interim sizes until the
   site-wide type scale lands; the Contact rebuild replaces these. */
.page--contact .contact-inquiry__intro .display,
.page--contact .contact-directions__head .display {
  font-size: clamp(1.75rem, 1.35rem + 1.3vw, 2.25rem);
  max-width: none;
}
.page--contact .contact-form-card__head h3,
.page--contact .contact-visit-card > h3 {
  font-size: clamp(1.375rem, 1.25rem + .5vw, 1.5rem);
  line-height: 1.15;
  max-width: none;
}
/* Home: all four location cards in one row on wide screens. The reel used
   to clip the fourth card mid-word at 1440px; home.js now hides the arrows
   whenever nothing scrolls. The trails button also gets air above it. */
@media (min-width: 1200px) {
  .page--home .photostrip__item { flex: 0 0 calc((100% - 3 * 1.5rem) / 4); }
}
.page--home .photocard__body .btn { margin-top: 1rem; }
/* .photostrip__nav sets display:flex, which overrode the hidden attribute. */
.photostrip__nav[hidden] { display: none; }

/* Thank-you page after the contact form (2026-09-30). */
.page--thanks .thanks { padding-block: calc(var(--header-h) + clamp(3rem, 7vw, 5rem)) clamp(3.5rem, 8vw, 6rem); }
.page--thanks .thanks__inner { max-width: 40rem; }
.page--thanks .thanks h1 { font-size: clamp(2.25rem, 1.8rem + 1.6vw, 3rem); margin-top: .5rem; }
.page--thanks .thanks__lead { font-size: var(--fs-4); margin-top: 1.25rem; max-width: 34em; }
.page--thanks .thanks__note { margin-top: 1rem; }
.page--thanks .thanks__note a { color: var(--bark); text-decoration: underline; text-decoration-color: var(--tan); text-underline-offset: 3px; }
.page--thanks .btn-row { margin-top: 2rem; }
/* END STEP 1 FIXES */

/* SITE TYPE, SPACING, HEADER AND CLOSING BAND (2026-09-30, step 2).
   Flynn's decision: every page uses the September Facilities scale
   (titles 48/36, section heads 36/28, subsection heads 28/24, card titles
   24/22, sections 56/36) and a header that is clear over the Home film.
   Revised 2026-10-01: the wood closing bands and the translucent header
   bar stay, at Flynn's request. Selectors
   mirror the older page rules they replace, so this block wins by source
   order without !important. The Home film headline keeps its own size. */
:root {
  --t-h1: 48px; --t-h2: 36px; --t-h3: 28px; --t-card: 24px;
  --t-section: 56px; --t-band: 72px;
}
@media (max-width: 767px) {
  :root {
    --t-h1: 36px; --t-h2: 28px; --t-h3: 24px; --t-card: 22px;
    --t-section: 36px; --t-band: 48px;
  }
}

/* Page titles */
.page-header .display,
.page--about .about-opening .display,
.page--history .farm-history-article__header .display,
.page--boarding .boarding-hero .display,
.page--trainers .trainers-landscape-hero .display,
.gallery-intro .display,
.page--contact .contact-hero .display,
.page--thanks .thanks h1 {
  font-size: var(--t-h1);
  line-height: 1.05;
  font-weight: 600;
}
.page--contact .contact-hero .display { max-width: none; }
.gallery-intro .display { max-width: 16ch; }  /* "Photographs of / Hindsight Farms" */

/* Section headings */
.sectionhead:not(.sectionhead--sub) .display,
.page--solid .sectionhead:not(.sectionhead--sub) > .display,
.cta-strip .display,
.page--home .home-gallery .display,
.gallery-film__intro .display,
.page--history .farm-history-article__body h2,
.page--history .farm-history-article__sources h2,
.page--trainers .trainer-feature__heading h2 {
  font-size: var(--t-h2);
  line-height: 1.1;
  font-weight: 600;
}

/* Subsection headings */
.page--about .about-philosophy__body h3,
.legal-document h2,
.page--trainers .trainers-inquiries h2 {
  font-size: var(--t-h3);
  line-height: 1.15;
  font-weight: 600;
}

/* Card titles and labels */
.card__title { font-size: var(--t-card); line-height: 1.15; }
.page--trainers .trainer-feature__heading .eyebrow { font-size: var(--fs-eyebrow); }

/* Primary copy reads in ink; stone stays for captions and supporting notes. */
.page--facilities .fac-arena-card__surface > p,
.page--facilities .fac-chapter-head__copy,
.page--facilities .fac-euro-static__copy > p,
.page--boarding .boarding-care-note p,
.page--trainers .trainer-feature__copy p,
.gallery-film__intro p,
.page--contact .contact-inquiry__intro > p,
.page--contact .contact-directions__head > p { color: var(--ink); }

/* Section rhythm: 56px desktop, 36px phone */
.section,
.page--home .home-intro,
.page--home .home-location,
.page--about .section,
.page--about .about-history,
.page--trainers .trainer-feature-section,
.gallery-experience,
.page--contact .contact-inquiry,
.page--contact .contact-directions,
.legal-section { padding-block: var(--t-section); }
.page-header,
.gallery-intro,
.page--contact .contact-hero { padding-top: calc(var(--header-h) + var(--t-section)); }
.page--history .farm-history-article {
  padding-top: calc(var(--header-h) + var(--t-section));
  padding-bottom: var(--t-section);
}
.page--thanks .thanks { padding-block: calc(var(--header-h) + var(--t-section)) calc(var(--t-section) * 1.5); }

/* Footer address: plain Inter like the lines under it (was Cormorant small caps). */
.site-footer address .smallcaps {
  font-family: var(--font-body);
  font-variant-caps: normal;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
}

/* Header: clear over the Home film with a soft shade behind the logo and
   menu. Once scrolled, and on every other page, it keeps the original
   translucent blurred brown (Flynn, 2026-10-01: no solid bar). */
.site-header--over-hero:not(.is-scrolled) {
  background: transparent;
  border-bottom-color: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.page--home .hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 220px;
  background: linear-gradient(rgba(36, 27, 18, .6), rgba(36, 27, 18, 0));
  pointer-events: none;
  z-index: 1;
}

/* Closing bands keep the wood texture (Flynn, 2026-10-01: he preferred the
   wooden board to the plain cream band), so their original rules apply. */
/* END SITE TYPE, SPACING, HEADER AND CLOSING BAND */

/* SHARED CONTROLS (2026-10-01, step 3). One previous/next button, one
   counter and one caption style for the rebuilt galleries and selectors.
   Chevron markup: <svg viewBox="0 0 24 24" aria-hidden="true" focusable="false">
   <path d="M15 5 8 12l7 7" fill="none" stroke="currentColor" stroke-width="1.5"
   stroke-linecap="round" stroke-linejoin="round"/></svg> (next: "m9 5 7 7-7 7"). */
.ctl-row { display: flex; align-items: center; gap: 12px; }
.ctl-arrow {
  width: 44px; height: 44px; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0;
  background: var(--paper); color: var(--bark);
  border: 1px solid var(--bark); border-radius: var(--radius);
  cursor: pointer;
  transition: background-color var(--ease), color var(--ease), border-color var(--ease);
}
.ctl-arrow svg { width: 20px; height: 20px; }
.ctl-arrow:hover { background: var(--bark); color: #fff; }
.ctl-arrow:focus-visible { outline: 2px solid var(--bark); outline-offset: 3px; }
.ctl-arrow:disabled { opacity: .4; cursor: default; }
.ctl-arrow:disabled:hover { background: var(--paper); color: var(--bark); }
.ctl-arrow--on-dark { background: transparent; color: var(--cream); border-color: rgba(239, 227, 214, .6); }
.ctl-arrow--on-dark:hover { background: var(--cream); color: var(--bark); border-color: var(--cream); }
.ctl-arrow--on-dark:focus-visible { outline-color: var(--cream); }
.ctl-counter {
  font-family: var(--font-body); font-size: 13px; font-weight: 500;
  font-variant-numeric: lining-nums tabular-nums; letter-spacing: .04em;
  color: var(--stone); min-width: 3.5em; text-align: center;
}
.ctl-counter--on-dark { color: var(--tan-light); }
.media-caption {
  margin-top: 10px;
  font-family: var(--font-body); font-size: 14px; line-height: 1.5;
  color: var(--stone);
}
.media-caption--on-dark { color: var(--tan-light); }
/* END SHARED CONTROLS */

/* TRAINERS PROFILE PHOTOS (2026-10-01, step 3): both programs share one 7:5
   frame at the same width (Longview's photo was a narrower portrait). */
.page--trainers .trainer-feature__media,
.page--trainers .trainer-feature--reverse .trainer-feature__media { max-width: 560px; aspect-ratio: 7 / 5; }
.page--trainers .trainer-feature__media picture { height: 100%; }
.page--trainers .trainer-feature__media img { width: 100%; height: 100%; object-fit: cover; }
/* END TRAINERS PROFILE PHOTOS */
