/*
  The Lookout Barossa — Global stylesheet
  Standalone static site (Cloudflare hosting, not a GHL page paste), but kept
  under the .tlb-site scope with a tlb- class prefix per docs/DESIGN-SYSTEM.md
  so a future GHL export stays possible without a rewrite.
*/

/* ---------------------------------------------------------------------- */
/* Design tokens                                                          */
/* ---------------------------------------------------------------------- */
.tlb-site {
  /* Brand colours — approved palette, docs/CONTENT-REQUIRED.md #10 */
  --tlb-forest: #153620;
  --tlb-forest-deep: #0E2417;   /* darker step — hero overlay, hover states */
  --tlb-cream: #F6EFE7;
  --tlb-gold: #B68A43;
  --tlb-gold-ink: #8A6428;      /* darker gold for TEXT on cream/grey (4.7:1 on cream) — plain --tlb-gold is for fills, lines and text on forest only */
  --tlb-gold-soft: #D9BE8C;     /* lighter gold step, for gold-on-forest hover */
  --tlb-grey: #D8D0C5;
  --tlb-white: #FFFFFF;
  --tlb-ink: #16241B;           /* near-forest charcoal for body text on cream */
  --tlb-ink-soft: #4B5A50;      /* secondary text on light backgrounds */
  --tlb-line: rgba(21, 54, 32, 0.14);
  --tlb-line-on-forest: rgba(246, 239, 231, 0.18);
  --tlb-error: #8C3A2E; /* functional-only colour, not part of the brand palette — form validation/error states */

  /* Typography — CSS vars so licensed fonts can be swapped globally later.
     Deliberately not Playfair/Poppins/Montserrat/Inter (brief flags these
     as overused template defaults). Georgia/system-serif + system-sans
     fallback pairing until IvyPresto/Canela/Noe + Neue Haas/Söhne/Suisse
     Intl/ABC Diatype are licensed. */
  --tlb-font-display: Georgia, 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', serif;
  --tlb-font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, Roboto, sans-serif;

  --tlb-fs-body: clamp(1rem, 0.97rem + 0.12vw, 1.0625rem);
  --tlb-fs-small: 0.875rem;
  --tlb-fs-eyebrow: 0.75rem;
  --tlb-fs-h1: clamp(2.75rem, 2.1rem + 3.2vw, 5rem);
  --tlb-fs-h2: clamp(1.875rem, 1.6rem + 1.4vw, 2.625rem);
  --tlb-fs-h3: clamp(1.375rem, 1.22rem + 0.7vw, 1.75rem);
  --tlb-fs-stat: clamp(2.5rem, 2rem + 2.4vw, 3.75rem);

  /* Spacing scale (4px base) */
  --tlb-sp-1: 0.25rem;
  --tlb-sp-2: 0.5rem;
  --tlb-sp-3: 0.75rem;
  --tlb-sp-4: 1rem;
  --tlb-sp-6: 1.5rem;
  --tlb-sp-8: 2rem;
  --tlb-sp-12: 3rem;
  --tlb-sp-16: 4rem;
  --tlb-sp-24: 6rem;
  --tlb-sp-32: 8rem;

  --tlb-container: 1280px;
  --tlb-container-narrow: 780px;
  --tlb-gutter: clamp(1.25rem, 4vw, 3rem);

  /* Restrained radii — this is an editorial site, not a rounded-card template */
  --tlb-radius-sm: 3px;
  --tlb-radius-md: 4px;

  --tlb-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --tlb-dur-fast: 180ms;
  --tlb-dur-med: 480ms;
  --tlb-dur-slow: 860ms;

  --tlb-header-h: 86px;
  --tlb-header-h-compact: 64px;
}

/* ---------------------------------------------------------------------- */
/* Reset (scoped)                                                         */
/* ---------------------------------------------------------------------- */
.tlb-site, .tlb-site *, .tlb-site *::before, .tlb-site *::after {
  box-sizing: border-box;
}
.tlb-site {
  background: var(--tlb-cream);
  color: var(--tlb-ink);
  font-family: var(--tlb-font-sans);
  font-size: var(--tlb-fs-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
/* No horizontal-overflow guard here on purpose. overflow other than
   'visible' on an ancestor of a position:sticky element makes browsers
   treat that ancestor as the sticky containing scroll-context instead of
   the real viewport, breaking/flickering every sticky element on the page
   (the header, here) — this exact bug already bit the Hangry Bep sibling
   project, see that project's css/styles.css for the fuller writeup.
   Verified no horizontal overflow at 375/768/1400px without this rule. */
.tlb-site img, .tlb-site svg { max-width: 100%; display: block; }
.tlb-site a { color: inherit; text-decoration: none; }
.tlb-site ul { list-style: none; margin: 0; padding: 0; }
.tlb-site button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.tlb-site h1, .tlb-site h2, .tlb-site h3, .tlb-site h4 {
  font-family: var(--tlb-font-display);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin: 0;
  color: var(--tlb-forest);
}
.tlb-site p { margin: 0; }
.tlb-site :focus-visible {
  outline: 2px solid var(--tlb-gold);
  outline-offset: 3px;
}

.tlb-container {
  width: 100%;
  max-width: var(--tlb-container);
  margin-inline: auto;
  padding-inline: var(--tlb-gutter);
}
.tlb-container-narrow {
  width: 100%;
  max-width: var(--tlb-container-narrow);
  margin-inline: auto;
  padding-inline: var(--tlb-gutter);
}

.tlb-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.tlb-skip-link {
  position: absolute;
  left: var(--tlb-sp-4);
  top: -100px;
  background: var(--tlb-forest);
  color: var(--tlb-cream);
  padding: var(--tlb-sp-3) var(--tlb-sp-4);
  z-index: 200;
  transition: top var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-skip-link:focus { top: var(--tlb-sp-4); }

/* ---------------------------------------------------------------------- */
/* Eyebrow / small tracked labels — logo-derived motif                    */
/* ---------------------------------------------------------------------- */
.tlb-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--tlb-sp-3);
  font-size: var(--tlb-fs-eyebrow);
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--tlb-gold-ink);
}
.tlb-eyebrow::before {
  content: '';
  display: block;
  width: 28px;
  height: 1px;
  background: currentColor;
}
.tlb-eyebrow-center { justify-content: center; }
/* Eyebrows on dark backgrounds use the light gold step (plain gold is only ~4.2:1 on forest at this size) */
.tlb-hero .tlb-eyebrow, .tlb-page-hero .tlb-eyebrow, .tlb-section-forest .tlb-eyebrow,
.tlb-final-cta .tlb-eyebrow, .tlb-footer .tlb-eyebrow, .tlb-mobile-nav .tlb-eyebrow,
.tlb-contact-functions-cta .tlb-eyebrow { color: var(--tlb-gold-soft); }

/* ---------------------------------------------------------------------- */
/* Buttons                                                                */
/* ---------------------------------------------------------------------- */
.tlb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--tlb-sp-2);
  padding: 0.95rem 1.75rem;
  font-size: var(--tlb-fs-small);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid transparent;
  border-radius: var(--tlb-radius-sm);
  transition: background var(--tlb-dur-fast) var(--tlb-ease),
              color var(--tlb-dur-fast) var(--tlb-ease),
              border-color var(--tlb-dur-fast) var(--tlb-ease);
  white-space: nowrap;
}
.tlb-btn-primary {
  background: var(--tlb-gold);
  color: var(--tlb-forest-deep);
  border-color: var(--tlb-gold);
}
.tlb-btn-primary:hover { background: var(--tlb-gold-soft); border-color: var(--tlb-gold-soft); }

.tlb-btn-ghost-on-dark {
  background: transparent;
  color: var(--tlb-cream);
  border-color: rgba(246, 239, 231, 0.5);
}
.tlb-btn-ghost-on-dark:hover { border-color: var(--tlb-cream); background: rgba(246, 239, 231, 0.08); }

.tlb-btn-outline {
  background: transparent;
  color: var(--tlb-forest);
  border-color: var(--tlb-forest);
}
.tlb-btn-outline:hover { background: var(--tlb-forest); color: var(--tlb-cream); }

/* ---------------------------------------------------------------------- */
/* Header                                                                 */
/* ---------------------------------------------------------------------- */
.tlb-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(246, 239, 231, 0.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color var(--tlb-dur-fast) var(--tlb-ease),
              box-shadow var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-header[data-scrolled="true"] {
  border-bottom-color: var(--tlb-line);
  box-shadow: 0 8px 24px rgba(14, 36, 23, 0.06);
}
.tlb-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--tlb-sp-6);
  height: var(--tlb-header-h);
  transition: height var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-header[data-scrolled="true"] .tlb-header-inner { height: var(--tlb-header-h-compact); }

/* Header logo — icon only. The source artwork (tlb-logo-transparent.svg) is
   a vertical stack [icon / "THE" / "LOOKOUT" / "BAROSSA"] as approved by the
   client; an earlier version of this rule cropped the image into a custom
   icon+text side-by-side arrangement to make the small wordmark legible,
   but that recomposes their approved lockup into something they never
   signed off on — reverted. Showing the icon alone isn't a composition
   change (it's one complete, unmodified element of the mark, same as a
   favicon crop), just cropped via a fixed-size overflow:hidden frame
   (oversized + repositioned) since the source file has no icon-only export.
   Crop coordinates measured directly off the source artwork (see chat) —
   re-measure if the logo file is ever replaced. Flagged in
   CONTENT-REQUIRED.md: ask the client for a proper horizontal lockup
   variant rather than us inventing one, if the wordmark needs to return
   to the header.
   .tlb-header[data-scrolled="true"] scales the icon down via transform so
   the crop math (computed for the 52px unscaled height) stays correct at
   the compact size too. */
.tlb-logo-link {
  display: inline-flex;
  align-items: center;
  transform: scale(1);
  transform-origin: left center;
  transition: transform var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-header[data-scrolled="true"] .tlb-logo-link { transform: scale(0.74); }

.tlb-logo-crop-icon {
  position: relative;
  overflow: hidden;
  flex: none;
  height: 52px;
  width: 32.4px;
}
.tlb-logo-crop-icon img {
  position: absolute;
  max-width: none;
  height: 149.98px;
  width: 149.98px;
  top: -38.5px;
  left: -58.8px;
}
.tlb-logo-lockup { display: flex; flex-direction: column; gap: 0.2em; }
.tlb-logo-eyebrow {
  font-size: 0.5625rem;
  letter-spacing: 0.34em;
  margin-bottom: 0.1em;
  color: var(--tlb-gold-soft);
}
.tlb-logo-eyebrow::before { width: 16px; }
.tlb-logo-word {
  font-family: var(--tlb-font-display);
  font-size: 1.5rem;
  letter-spacing: 0.03em;
  color: var(--tlb-forest);
}
.tlb-logo-sub {
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--tlb-gold);
}

.tlb-nav-links {
  display: flex;
  align-items: center;
  gap: var(--tlb-sp-8);
}
.tlb-nav-links a {
  font-size: var(--tlb-fs-small);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--tlb-ink-soft);
  padding-block: var(--tlb-sp-2);
  border-bottom: 1px solid transparent;
  transition: color var(--tlb-dur-fast) var(--tlb-ease), border-color var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-nav-links a:hover,
.tlb-nav-links a[aria-current="page"] {
  color: var(--tlb-forest);
  border-bottom-color: var(--tlb-gold);
}

.tlb-header-actions { display: flex; align-items: center; gap: var(--tlb-sp-4); }

.tlb-menu-toggle {
  display: none;
  width: 40px; height: 40px;
  align-items: center;
  justify-content: center;
  color: var(--tlb-forest);
}
.tlb-menu-toggle svg { width: 22px; height: 22px; }

.tlb-mobile-nav {
  position: fixed;
  inset: 0;
  z-index: 150;
  background: var(--tlb-forest);
  color: var(--tlb-cream);
  padding: var(--tlb-sp-6) var(--tlb-gutter);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform var(--tlb-dur-med) var(--tlb-ease);
}
.tlb-mobile-nav[data-open="true"] { transform: translateX(0); }
.tlb-mobile-nav-top { display: flex; align-items: center; justify-content: space-between; }
.tlb-mobile-nav-top .tlb-logo-word,
.tlb-mobile-nav-top .tlb-logo-sub { color: var(--tlb-cream); }
.tlb-mobile-nav-top .tlb-logo-sub { color: var(--tlb-gold); }
.tlb-mobile-nav-top button { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
.tlb-mobile-nav-links {
  display: flex;
  flex-direction: column;
  gap: var(--tlb-sp-6);
  margin-top: var(--tlb-sp-16);
}
.tlb-mobile-nav-links a {
  font-family: var(--tlb-font-display);
  font-size: 1.75rem;
}
.tlb-mobile-nav-cta { margin-top: auto; padding-top: var(--tlb-sp-8); }

@media (max-width: 860px) {
  .tlb-nav, .tlb-header-actions .tlb-btn { display: none; }
  .tlb-menu-toggle { display: inline-flex; }
}

/* ---------------------------------------------------------------------- */
/* Hero                                                                   */
/* ---------------------------------------------------------------------- */
.tlb-hero {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: flex-end;
  color: var(--tlb-cream);
  overflow: hidden;
}
.tlb-hero-media {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.tlb-hero-media video {
  width: 100%; height: 100%;
  object-fit: cover;
}
.tlb-hero-placeholder-bg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(14,36,23,0.35) 0%, rgba(14,36,23,0.55) 55%, rgba(14,36,23,0.85) 100%),
    repeating-linear-gradient(
      178deg,
      rgba(246,239,231,0.05) 0px,
      rgba(246,239,231,0.05) 1px,
      transparent 1px,
      transparent 64px
    ),
    linear-gradient(160deg, #1F4A2C 0%, #153620 45%, #0E2417 100%);
}
.tlb-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(14,36,23,0.9) 0%, rgba(14,36,23,0.15) 60%);
  z-index: 1;
}
.tlb-hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-block: var(--tlb-sp-24) var(--tlb-sp-16);
}
.tlb-hero-eyebrow { color: var(--tlb-gold-soft); }
.tlb-hero-content .tlb-hero-title {
  color: var(--tlb-cream);
  font-size: var(--tlb-fs-h1);
  max-width: 16ch;
  margin-top: var(--tlb-sp-4);
}
.tlb-hero-sub {
  margin-top: var(--tlb-sp-6);
  max-width: 46ch;
  font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
  color: rgba(246, 239, 231, 0.86);
}
.tlb-hero-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--tlb-sp-4);
  margin-top: var(--tlb-sp-8);
}
.tlb-hero-placeholder-tag {
  position: absolute;
  right: var(--tlb-gutter);
  bottom: var(--tlb-sp-6);
  z-index: 2;
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  color: rgba(246, 239, 231, 0.55);
  border-bottom: 1px dashed rgba(246, 239, 231, 0.4);
  padding-bottom: 2px;
}

.tlb-hero-media video {
  width: 100%; height: 100%;
  object-fit: cover;
}

/* Visible pause control for the autoplaying hero video, per brief section
   12 — real controls, not just prefers-reduced-motion, since a visitor may
   want to stop the motion without that OS-level setting on. */
.tlb-hero-video-toggle {
  position: absolute;
  right: var(--tlb-gutter);
  bottom: var(--tlb-sp-6);
  z-index: 3;
  width: 40px; height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(14, 36, 23, 0.55);
  border: 1px solid rgba(246, 239, 231, 0.4);
  color: var(--tlb-cream);
  backdrop-filter: blur(4px);
  transition: background var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-hero-video-toggle:hover { background: rgba(14, 36, 23, 0.8); }
.tlb-hero-video-toggle svg { width: 16px; height: 16px; }
.tlb-hero-video-toggle .tlb-icon-play { display: none; }
.tlb-hero-video-toggle[aria-pressed="true"] .tlb-icon-pause { display: none; }
.tlb-hero-video-toggle[aria-pressed="true"] .tlb-icon-play { display: block; }

@media (max-width: 640px) {
  .tlb-hero { min-height: 100vh; }
  .tlb-hero-placeholder-tag { left: var(--tlb-gutter); right: var(--tlb-gutter); bottom: var(--tlb-sp-4); }
  .tlb-hero-video-toggle { right: var(--tlb-gutter); bottom: var(--tlb-sp-4); }
}

/* ---------------------------------------------------------------------- */
/* Sections — shared rhythm                                               */
/* ---------------------------------------------------------------------- */
.tlb-section { padding-block: var(--tlb-sp-24); }
.tlb-section-tight { padding-block: var(--tlb-sp-16); }
.tlb-section-forest { background: var(--tlb-forest); color: var(--tlb-cream); }
.tlb-section-forest h2, .tlb-section-forest h3 { color: var(--tlb-cream); }
.tlb-section-grey { background: var(--tlb-grey); }

.tlb-section-head { max-width: 46rem; }
.tlb-section-head h2 { margin-top: var(--tlb-sp-4); }
.tlb-section-head p { margin-top: var(--tlb-sp-4); color: var(--tlb-ink-soft); font-size: 1.0625rem; }
.tlb-section-forest .tlb-section-head p { color: rgba(246, 239, 231, 0.78); }
.tlb-section-head-center { margin-inline: auto; text-align: center; }

[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--tlb-dur-slow) var(--tlb-ease), transform var(--tlb-dur-slow) var(--tlb-ease);
}
[data-reveal].tlb-revealed { opacity: 1; transform: translateY(0); }
[data-reveal="stagger"] > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--tlb-dur-med) var(--tlb-ease), transform var(--tlb-dur-med) var(--tlb-ease);
}
[data-reveal="stagger"].tlb-revealed > * { opacity: 1; transform: translateY(0); }
[data-reveal="stagger"].tlb-revealed > *:nth-child(1) { transition-delay: 0ms; }
[data-reveal="stagger"].tlb-revealed > *:nth-child(2) { transition-delay: 90ms; }
[data-reveal="stagger"].tlb-revealed > *:nth-child(3) { transition-delay: 180ms; }
[data-reveal="stagger"].tlb-revealed > *:nth-child(4) { transition-delay: 270ms; }

/* ---------------------------------------------------------------------- */
/* Media placeholder (photography/video pending)                          */
/* ---------------------------------------------------------------------- */
.tlb-media-placeholder {
  position: relative;
  display: flex;
  align-items: flex-end;
  border: 1px solid var(--tlb-line);
  background:
    repeating-linear-gradient(180deg, rgba(21,54,32,0.05) 0px, rgba(21,54,32,0.05) 1px, transparent 1px, transparent 40px),
    var(--tlb-grey);
  overflow: hidden;
}
.tlb-media-placeholder::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(21,54,32,0.12) 0%, transparent 45%);
}
.tlb-media-placeholder-label {
  position: relative;
  z-index: 1;
  margin: var(--tlb-sp-4);
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  color: var(--tlb-ink-soft);
  background: rgba(246, 239, 231, 0.85);
  border: 1px dashed var(--tlb-gold);
  padding: var(--tlb-sp-1) var(--tlb-sp-2);
}

/* ---------------------------------------------------------------------- */
/* Real photography — fills the same aspect-ratio slots as                */
/* .tlb-media-placeholder once an asset is supplied.                      */
/* ---------------------------------------------------------------------- */
.tlb-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border: 1px solid var(--tlb-line);
}
/* Menu photo collage — small tight tiles, slow zoom on hover. Mobile-first:
   2 cols -> 4 cols -> a 6-col mosaic with one big anchor tile (.tlb-c1) and
   one tall tile (.tlb-c5). Desktop cell maths: 6 cols x 4 rows = 24 cells,
   tiles 8+2+2+2+4+2+2+2 = 24, so there are no holes. */
.tlb-collage {
  margin-top: var(--tlb-sp-8);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 100px;
  gap: 6px;
}
.tlb-collage-tile {
  position: relative;
  overflow: hidden;
  margin: 0;
  grid-row: span 2;
  background: var(--tlb-grey);
}
.tlb-collage-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--tlb-dur-slow) var(--tlb-ease);
}
.tlb-collage-tile:hover img { transform: scale(1.12); }
.tlb-collage-tile figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: var(--tlb-sp-8) var(--tlb-sp-3) var(--tlb-sp-3);
  background: linear-gradient(0deg, rgba(14, 36, 23, 0.78), transparent);
  color: var(--tlb-cream);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity var(--tlb-dur-med) var(--tlb-ease), transform var(--tlb-dur-med) var(--tlb-ease);
}
.tlb-collage-tile:hover figcaption { opacity: 1; transform: none; }

@media (min-width: 521px) {
  .tlb-collage { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 110px; }
}
@media (min-width: 901px) {
  .tlb-collage { grid-template-columns: repeat(6, 1fr); grid-auto-rows: 100px; }
  .tlb-c1 { grid-column: 1 / span 2; grid-row: 1 / span 4; }
  .tlb-c2 { grid-column: 3; grid-row: 1 / span 2; }
  .tlb-c3 { grid-column: 4; grid-row: 1 / span 2; }
  .tlb-c4 { grid-column: 5; grid-row: 1 / span 2; }
  .tlb-c5 { grid-column: 6; grid-row: 1 / span 4; }
  .tlb-c6 { grid-column: 3; grid-row: 3 / span 2; }
  .tlb-c7 { grid-column: 4; grid-row: 3 / span 2; }
  .tlb-c8 { grid-column: 5; grid-row: 3 / span 2; }
}

/* ---------------------------------------------------------------------- */
/* Data-placeholder inline convention                                     */
/* ---------------------------------------------------------------------- */
[data-placeholder="true"] {
  border-bottom: 1px dashed var(--tlb-gold);
  padding-bottom: 1px;
  font-style: italic;
  color: var(--tlb-ink-soft);
}
.tlb-section-forest [data-placeholder="true"] { color: rgba(246, 239, 231, 0.7); border-bottom-color: var(--tlb-gold-soft); }

/* ---------------------------------------------------------------------- */
/* Occasion pathways                                                      */
/* ---------------------------------------------------------------------- */
.tlb-pathways-grid {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--tlb-line);
  border: 1px solid var(--tlb-line);
}
.tlb-pathway-card {
  position: relative;
  background: var(--tlb-cream);
  padding: var(--tlb-sp-8) var(--tlb-sp-6);
  display: flex;
  flex-direction: column;
  gap: var(--tlb-sp-6);
  transition: background var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-pathway-card:hover { background: var(--tlb-white); }
.tlb-pathway-media {
  aspect-ratio: 4 / 5;
}
.tlb-pathway-card h3 { font-size: 1.125rem; }
.tlb-pathway-card .tlb-pathway-link {
  margin-top: auto;
  font-size: var(--tlb-fs-small);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--tlb-forest);
  display: inline-flex;
  align-items: center;
  gap: var(--tlb-sp-2);
}
.tlb-pathway-card .tlb-pathway-link::after { content: '→'; transition: transform var(--tlb-dur-fast) var(--tlb-ease); }
.tlb-pathway-card:hover .tlb-pathway-link::after { transform: translateX(4px); }

@media (max-width: 980px) {
  .tlb-pathways-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .tlb-pathways-grid { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------- */
/* Venue showcase                                                         */
/* ---------------------------------------------------------------------- */
.tlb-showcase {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--tlb-sp-12);
  align-items: center;
}
.tlb-showcase-media { aspect-ratio: 4 / 3; }
.tlb-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--tlb-sp-8) var(--tlb-sp-6);
  padding-bottom: var(--tlb-sp-8);
  border-bottom: 1px solid var(--tlb-line);
  margin-bottom: var(--tlb-sp-8);
}
.tlb-stat-figure {
  font-family: var(--tlb-font-display);
  font-size: var(--tlb-fs-stat);
  color: var(--tlb-forest);
  line-height: 1;
}
.tlb-stat-label {
  margin-top: var(--tlb-sp-2);
  font-size: var(--tlb-fs-small);
  color: var(--tlb-ink-soft);
}
.tlb-fact-list { display: flex; flex-direction: column; gap: var(--tlb-sp-3); }
.tlb-fact-list li {
  display: flex;
  align-items: baseline;
  gap: var(--tlb-sp-3);
  font-size: 0.9375rem;
  color: var(--tlb-ink-soft);
}
.tlb-fact-list li::before {
  content: '';
  width: 6px; height: 6px;
  flex: none;
  background: var(--tlb-gold);
  border-radius: 50%;
  transform: translateY(-2px);
}
.tlb-showcase .tlb-showcase-note {
  margin-top: var(--tlb-sp-8);
  padding-top: var(--tlb-sp-6);
  border-top: 1px solid var(--tlb-line);
  font-size: var(--tlb-fs-small);
  color: var(--tlb-ink-soft);
}

@media (max-width: 900px) {
  .tlb-showcase { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .tlb-stat-grid { grid-template-columns: 1fr 1fr; }
}

/* ---------------------------------------------------------------------- */
/* Tailored hospitality                                                   */
/* ---------------------------------------------------------------------- */
.tlb-hospitality {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: var(--tlb-sp-12);
  align-items: center;
}
.tlb-hospitality-media { aspect-ratio: 3 / 4; }
.tlb-hospitality-copy p + p { margin-top: var(--tlb-sp-4); }
.tlb-hospitality-copy { color: rgba(246, 239, 231, 0.82); }
.tlb-hospitality-copy .tlb-btn { margin-top: var(--tlb-sp-8); }

@media (max-width: 900px) {
  .tlb-hospitality { grid-template-columns: 1fr; }
  .tlb-hospitality-media { order: -1; }
}

/* ---------------------------------------------------------------------- */
/* Why The Lookout — proof points                                         */
/* ---------------------------------------------------------------------- */
.tlb-proof-grid {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--tlb-sp-8) var(--tlb-sp-6);
}
.tlb-proof-item {
  padding-top: var(--tlb-sp-6);
  border-top: 1px solid var(--tlb-line);
}
.tlb-proof-item h3 { font-size: 1.0625rem; }
.tlb-proof-item p { margin-top: var(--tlb-sp-2); font-size: 0.9375rem; color: var(--tlb-ink-soft); }

@media (max-width: 780px) {
  .tlb-proof-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .tlb-proof-grid { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------- */
/* Planning process                                                       */
/* ---------------------------------------------------------------------- */
.tlb-process-steps {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--tlb-line);
  border: 1px solid var(--tlb-line);
}
.tlb-step {
  background: var(--tlb-cream);
  padding: var(--tlb-sp-8) var(--tlb-sp-6);
  display: flex;
  flex-direction: column;
  gap: var(--tlb-sp-2);
  transition: background var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-step:hover { background: var(--tlb-white); }
.tlb-step-number {
  font-family: var(--tlb-font-display);
  font-size: 1.5rem;
  line-height: 1;
  color: var(--tlb-gold-ink);
}
.tlb-step h3 { font-size: 1.0625rem; }
.tlb-step p { font-size: 0.9375rem; color: var(--tlb-ink-soft); }

@media (max-width: 700px) {
  .tlb-process-steps { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------- */
/* Gallery                                                                */
/* ---------------------------------------------------------------------- */
.tlb-gallery-grid {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 180px;
  gap: var(--tlb-sp-2);
}
.tlb-gallery-item:nth-child(1) { grid-column: span 3; grid-row: span 2; }
.tlb-gallery-item:nth-child(2) { grid-column: span 3; grid-row: span 1; }
.tlb-gallery-item:nth-child(3) { grid-column: span 3; grid-row: span 1; }
.tlb-gallery-item:nth-child(4) { grid-column: span 2; grid-row: span 1; }
.tlb-gallery-item:nth-child(5) { grid-column: span 2; grid-row: span 1; }
.tlb-gallery-item:nth-child(6) { grid-column: span 2; grid-row: span 1; }

@media (max-width: 780px) {
  .tlb-gallery-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 220px; }
  .tlb-gallery-item, .tlb-gallery-item:nth-child(1) { grid-column: span 1; grid-row: span 1; }
}

/* ---------------------------------------------------------------------- */
/* Final conversion                                                       */
/* ---------------------------------------------------------------------- */
.tlb-final-cta {
  position: relative;
  padding-block: var(--tlb-sp-32);
  text-align: center;
  color: var(--tlb-cream);
  overflow: hidden;
}
.tlb-final-cta-bg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(14,36,23,0.6) 0%, rgba(14,36,23,0.82) 100%),
    linear-gradient(160deg, #1F4A2C 0%, #153620 55%, #0E2417 100%);
}
.tlb-final-cta-content { position: relative; z-index: 1; }
.tlb-final-cta h2 { color: var(--tlb-cream); max-width: 26ch; margin-inline: auto; margin-top: var(--tlb-sp-4); }
.tlb-final-cta p { margin-top: var(--tlb-sp-4); color: rgba(246, 239, 231, 0.8); max-width: 42ch; margin-inline: auto; }
.tlb-final-cta .tlb-btn { margin-top: var(--tlb-sp-8); }

/* ---------------------------------------------------------------------- */
/* Footer                                                                 */
/* ---------------------------------------------------------------------- */
.tlb-footer { background: var(--tlb-forest-deep); color: rgba(246, 239, 231, 0.78); padding-block: var(--tlb-sp-16) var(--tlb-sp-8); }
.tlb-footer-top {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr 0.9fr 1fr;
  gap: var(--tlb-sp-8);
  padding-bottom: var(--tlb-sp-12);
  border-bottom: 1px solid var(--tlb-line-on-forest);
}
.tlb-footer-brand .tlb-logo-word { color: var(--tlb-cream); }
.tlb-footer-brand p { margin-top: var(--tlb-sp-4); max-width: 32ch; font-size: 0.9375rem; }
.tlb-footer-heading {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tlb-gold-soft);
}
.tlb-footer-col .tlb-footer-heading { margin-bottom: var(--tlb-sp-4); }
.tlb-footer-col ul { display: flex; flex-direction: column; gap: var(--tlb-sp-3); font-size: 0.9375rem; }
.tlb-footer-col a:hover { color: var(--tlb-cream); }
.tlb-footer-col address { font-style: normal; }
.tlb-footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--tlb-sp-4);
  padding-top: var(--tlb-sp-6);
  font-size: 0.8125rem;
  color: rgba(246, 239, 231, 0.55);
}
.tlb-footer-bottom-links { display: flex; gap: var(--tlb-sp-6); }
.tlb-footer-bottom-links a:hover { color: var(--tlb-cream); }

@media (max-width: 900px) {
  .tlb-footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .tlb-footer-top { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------- */
/* Sticky mobile CTA                                                      */
/* ---------------------------------------------------------------------- */
.tlb-sticky-cta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 90;
  padding: var(--tlb-sp-3) var(--tlb-gutter);
  background: rgba(246, 239, 231, 0.95);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--tlb-line);
  transform: translateY(100%);
  transition: transform var(--tlb-dur-fast) var(--tlb-ease);
  display: none;
}
.tlb-sticky-cta[data-visible="true"] { transform: translateY(0); }
.tlb-sticky-cta .tlb-btn { width: 100%; }

@media (max-width: 640px) {
  .tlb-sticky-cta { display: block; }
}

/* ---------------------------------------------------------------------- */
/* Inner-page hero (Functions / Menu / About / Contact)                   */
/* ---------------------------------------------------------------------- */
.tlb-page-hero {
  position: relative;
  min-height: 46vh;
  display: flex;
  align-items: flex-end;
  color: var(--tlb-cream);
  overflow: hidden;
}
.tlb-page-hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  padding-block: var(--tlb-sp-24) var(--tlb-sp-12);
}
.tlb-page-hero-content .tlb-page-hero-title {
  color: var(--tlb-cream);
  font-size: clamp(2.25rem, 1.85rem + 2vw, 3.5rem);
  max-width: 20ch;
  margin-top: var(--tlb-sp-4);
}
.tlb-page-hero-sub {
  margin-top: var(--tlb-sp-4);
  max-width: 46ch;
  font-size: 1.0625rem;
  color: rgba(246, 239, 231, 0.84);
}

/* ---------------------------------------------------------------------- */
/* Split content block — media + copy, alternates sides.                  */
/* Used for Functions event-type sections and About's story sections.     */
/* ---------------------------------------------------------------------- */
.tlb-split-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tlb-sp-12);
  align-items: center;
  padding-block: var(--tlb-sp-16);
  border-top: 1px solid var(--tlb-line);
}
.tlb-split-block:first-of-type { border-top: none; padding-top: 0; }
.tlb-split-block-media { aspect-ratio: 4 / 3; }
.tlb-split-block:nth-of-type(even) .tlb-split-block-media { order: 2; }
.tlb-split-block-copy .tlb-eyebrow { margin-bottom: var(--tlb-sp-3); }
.tlb-split-block-copy h2, .tlb-split-block-copy h3 { font-size: var(--tlb-fs-h3); }
.tlb-split-block-copy p { margin-top: var(--tlb-sp-3); color: var(--tlb-ink-soft); }
.tlb-split-block-copy p + p { margin-top: var(--tlb-sp-3); }
.tlb-split-block-copy .tlb-fact-list { margin-top: var(--tlb-sp-4); }

@media (max-width: 900px) {
  .tlb-split-block { grid-template-columns: 1fr; }
  .tlb-split-block:nth-of-type(even) .tlb-split-block-media { order: -1; }
}

/* ---------------------------------------------------------------------- */
/* FAQ accordion                                                          */
/* ---------------------------------------------------------------------- */
.tlb-faq-list { margin-top: var(--tlb-sp-8); border-top: 1px solid var(--tlb-line); }
.tlb-faq-item { border-bottom: 1px solid var(--tlb-line); }
.tlb-faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--tlb-sp-4);
  padding-block: var(--tlb-sp-5);
  text-align: left;
  font-family: var(--tlb-font-display);
  font-size: 1.0625rem;
  color: var(--tlb-forest);
}
.tlb-faq-icon {
  flex: none;
  position: relative;
  width: 18px; height: 18px;
}
.tlb-faq-icon::before, .tlb-faq-icon::after {
  content: '';
  position: absolute;
  background: var(--tlb-gold);
  transition: transform var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-faq-icon::before { left: 0; top: 8px; width: 18px; height: 2px; }
.tlb-faq-icon::after { left: 8px; top: 0; width: 2px; height: 18px; }
.tlb-faq-item[data-open="true"] .tlb-faq-icon::after { transform: rotate(90deg); opacity: 0; }
.tlb-faq-answer-wrap {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--tlb-dur-med) var(--tlb-ease);
}
.tlb-faq-item[data-open="true"] .tlb-faq-answer-wrap { grid-template-rows: 1fr; }
.tlb-faq-answer-inner { overflow: hidden; }
.tlb-faq-answer {
  padding-bottom: var(--tlb-sp-5);
  max-width: 62ch;
  color: var(--tlb-ink-soft);
  font-size: 0.9375rem;
}

/* ---------------------------------------------------------------------- */
/* Forms — function enquiry + general contact                            */
/* ---------------------------------------------------------------------- */
.tlb-form { margin-top: var(--tlb-sp-8); max-width: 46rem; }
.tlb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--tlb-sp-6); }
.tlb-field { display: flex; flex-direction: column; gap: var(--tlb-sp-2); margin-bottom: var(--tlb-sp-6); }
.tlb-field label {
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: var(--tlb-forest);
}
.tlb-field-optional { font-weight: 400; color: var(--tlb-ink-soft); text-transform: none; }
.tlb-input, .tlb-select, .tlb-textarea {
  width: 100%;
  padding: 0.85rem 1rem;
  border: 1px solid var(--tlb-line);
  border-radius: var(--tlb-radius-sm);
  background: var(--tlb-white);
  color: var(--tlb-ink);
  font: inherit;
  font-size: 0.9375rem;
  transition: border-color var(--tlb-dur-fast) var(--tlb-ease);
}
.tlb-input:focus, .tlb-select:focus, .tlb-textarea:focus { border-color: var(--tlb-gold); }
.tlb-textarea { resize: vertical; min-height: 7rem; }
.tlb-input[aria-invalid="true"], .tlb-textarea[aria-invalid="true"] { border-color: var(--tlb-error); }
.tlb-field-error {
  font-size: 0.8125rem;
  color: var(--tlb-error);
}
.tlb-radio-group, .tlb-checkbox-group { display: flex; flex-wrap: wrap; gap: var(--tlb-sp-2) var(--tlb-sp-6); }
.tlb-radio-option, .tlb-checkbox-option {
  display: flex;
  align-items: center;
  gap: var(--tlb-sp-2);
  font-size: 0.9375rem;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--tlb-ink);
}
.tlb-radio-option input, .tlb-checkbox-option input { accent-color: var(--tlb-forest); width: 16px; height: 16px; }
.tlb-consent-field {
  display: flex;
  align-items: flex-start;
  gap: var(--tlb-sp-3);
  font-size: 0.875rem;
  color: var(--tlb-ink-soft);
}
.tlb-consent-field input { margin-top: 3px; accent-color: var(--tlb-forest); width: 16px; height: 16px; flex: none; }
.tlb-consent-field a { text-decoration: underline; }
.tlb-form-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px; height: 1px;
  overflow: hidden;
}
.tlb-form-note {
  margin-top: var(--tlb-sp-2);
  margin-bottom: var(--tlb-sp-6);
  padding: var(--tlb-sp-4) var(--tlb-sp-5);
  border: 1px dashed var(--tlb-gold);
  background: rgba(182, 138, 67, 0.08);
  font-size: 0.875rem;
  font-style: italic;
  color: var(--tlb-ink-soft);
}
.tlb-form-submit-row { display: flex; align-items: center; gap: var(--tlb-sp-4); flex-wrap: wrap; }
.tlb-form-submit-row .tlb-btn[disabled] { opacity: 0.6; cursor: default; }
.tlb-form-status { font-size: 0.9375rem; font-weight: 600; }
.tlb-form-status-success { color: var(--tlb-forest); }
.tlb-form-status-error { color: var(--tlb-error); }

@media (max-width: 640px) {
  .tlb-form-row { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------- */
/* Menu page                                                              */
/* ---------------------------------------------------------------------- */
.tlb-menu-section { padding-block: var(--tlb-sp-16); border-top: 1px solid var(--tlb-line); }
.tlb-menu-section:first-of-type { border-top: none; padding-top: 0; }
.tlb-menu-grid {
  margin-top: var(--tlb-sp-8);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tlb-sp-8) var(--tlb-sp-12);
}
.tlb-menu-item { padding-bottom: var(--tlb-sp-4); border-bottom: 1px dotted var(--tlb-line); }
.tlb-menu-item-head { display: flex; justify-content: space-between; gap: var(--tlb-sp-4); }
.tlb-menu-item-name { font-family: var(--tlb-font-display); font-size: 1.0625rem; color: var(--tlb-forest); }
.tlb-menu-item-name { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5em; }
.tlb-menu-item-price.tlb-menu-item-price { flex: none; font-family: var(--tlb-font-display); font-size: 1.0625rem; color: var(--tlb-forest); }
.tlb-menu-tag { font-family: var(--tlb-font-sans); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.06em; padding: 1px 6px; border: 1px solid var(--tlb-gold-ink); color: var(--tlb-gold-ink); border-radius: var(--tlb-radius-sm); line-height: 1.5; }
.tlb-menu-coffee { margin-top: var(--tlb-sp-8); width: 100%; max-width: 520px; border-collapse: collapse; }
.tlb-menu-coffee thead th { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tlb-gold-ink); text-align: right; padding: 0 0 var(--tlb-sp-2); }
.tlb-menu-coffee tbody th, .tlb-menu-coffee tbody td { padding: var(--tlb-sp-3) 0; border-bottom: 1px dotted var(--tlb-line); font-size: 1.0625rem; }
.tlb-menu-coffee tbody th { font-family: var(--tlb-font-display); font-weight: 400; text-align: left; color: var(--tlb-forest); }
.tlb-menu-coffee tbody td { text-align: right; width: 5.5rem; font-variant-numeric: tabular-nums; }
.tlb-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tlb-menu-item-desc.tlb-menu-item-desc { margin-top: var(--tlb-sp-1); font-size: 0.9375rem; color: var(--tlb-ink-soft); }
.tlb-menu-dietary-note.tlb-menu-dietary-note {
  margin-top: var(--tlb-sp-8);
  padding-top: var(--tlb-sp-6);
  border-top: 1px solid var(--tlb-line);
  font-size: 0.875rem;
  color: var(--tlb-ink-soft);
}
.tlb-menu-pdf-cta.tlb-menu-pdf-cta { margin-top: var(--tlb-sp-6); }

@media (max-width: 700px) {
  .tlb-menu-grid { grid-template-columns: 1fr; }
}

/* Function menus & packages (Menu page) */
.tlb-menu-jump { display: flex; flex-wrap: wrap; gap: var(--tlb-sp-3); margin-bottom: var(--tlb-sp-8); }
.tlb-fm-block { padding-top: var(--tlb-sp-16); }
.tlb-fm-block:first-of-type { padding-top: var(--tlb-sp-12); }
.tlb-fm-block h3 { font-size: var(--tlb-fs-h3); }
.tlb-fm-sub.tlb-fm-sub { margin-top: var(--tlb-sp-2); color: var(--tlb-ink-soft); }
.tlb-fm-banner.tlb-fm-banner { display: block; width: 100%; height: auto; aspect-ratio: 16 / 5; object-fit: cover; margin-top: var(--tlb-sp-6); }
.tlb-package-grid { margin-top: var(--tlb-sp-6); display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--tlb-sp-4); }
.tlb-package { padding: var(--tlb-sp-6); background: var(--tlb-cream); border: 1px solid var(--tlb-line); display: flex; flex-direction: column; gap: var(--tlb-sp-2); }
.tlb-package h4 { font-size: 1.125rem; }
.tlb-package-price.tlb-package-price { font-family: var(--tlb-font-display); font-size: 2rem; line-height: 1.1; color: var(--tlb-forest); }
.tlb-package-price span { font-family: var(--tlb-font-sans); font-size: 0.8125rem; color: var(--tlb-ink-soft); letter-spacing: 0.04em; }
.tlb-package-detail.tlb-package-detail { font-size: 0.9375rem; color: var(--tlb-ink-soft); }
.tlb-fm-lists { margin-top: var(--tlb-sp-8); display: grid; grid-template-columns: 1fr 1fr; gap: var(--tlb-sp-8) var(--tlb-sp-12); align-items: start; }
.tlb-fm-sec > h4 { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tlb-gold-ink); margin-bottom: var(--tlb-sp-3); }
.tlb-fm-sec + .tlb-fm-sec { margin-top: var(--tlb-sp-8); }
.tlb-fm-list { list-style: none; margin: 0; padding: 0; }
.tlb-fm-list li { padding: var(--tlb-sp-2) 0; border-bottom: 1px dotted var(--tlb-line); font-size: 0.9375rem; }
.tlb-fm-note.tlb-fm-note { margin-top: var(--tlb-sp-6); font-size: 0.9375rem; color: var(--tlb-ink-soft); }
@media (max-width: 900px) { .tlb-package-grid { grid-template-columns: 1fr; } .tlb-fm-lists { grid-template-columns: 1fr; } .tlb-fm-banner.tlb-fm-banner { aspect-ratio: 16 / 7; } }

/* ---------------------------------------------------------------------- */
/* About page — team card                                                 */
/* ---------------------------------------------------------------------- */
.tlb-team-card {
  margin-top: var(--tlb-sp-12);
  display: flex;
  align-items: center;
  gap: var(--tlb-sp-8);
  padding: var(--tlb-sp-8);
  background: var(--tlb-grey);
}
.tlb-team-card-media {
  width: 128px;
  height: 128px;
  flex: none;
  border-radius: 50%;
}
.tlb-team-card-copy h3 { font-size: 1.125rem; }
.tlb-team-card-copy p { margin-top: var(--tlb-sp-2); color: var(--tlb-ink-soft); font-size: 0.9375rem; }

@media (max-width: 560px) {
  .tlb-team-card { flex-direction: column; text-align: center; }
}

/* ---------------------------------------------------------------------- */
/* Contact page                                                           */
/* ---------------------------------------------------------------------- */
.tlb-contact-grid {
  margin-top: var(--tlb-sp-12);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tlb-sp-16);
}
.tlb-contact-details dt {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tlb-gold-ink);
  margin-top: var(--tlb-sp-6);
}
.tlb-contact-details dt:first-child { margin-top: 0; }
.tlb-contact-details dd { margin: var(--tlb-sp-1) 0 0; font-size: 1rem; }
.tlb-contact-map { margin-top: var(--tlb-sp-6); aspect-ratio: 16 / 9; max-height: 320px; }
.tlb-contact-directions-link.tlb-contact-directions-link { margin-top: var(--tlb-sp-3); display: inline-block; font-size: 0.9375rem; text-decoration: underline; }
.tlb-contact-functions-cta {
  margin-top: var(--tlb-sp-16);
  padding: var(--tlb-sp-8);
  background: var(--tlb-forest);
  color: var(--tlb-cream);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--tlb-sp-6);
  flex-wrap: wrap;
}
.tlb-contact-functions-cta h3 { color: var(--tlb-cream); font-size: 1.25rem; }
.tlb-contact-functions-cta p { margin-top: var(--tlb-sp-2); color: rgba(246, 239, 231, 0.78); }

@media (max-width: 860px) {
  .tlb-contact-grid { grid-template-columns: 1fr; gap: var(--tlb-sp-10); }
}

/* ---------------------------------------------------------------------- */
/* Long-form text (Privacy Policy)                                        */
/* Same specificity as the .tlb-site p / ul resets and declared later, so */
/* these win by source order.                                             */
/* ---------------------------------------------------------------------- */
.tlb-prose h2 { font-size: var(--tlb-fs-h3); margin-top: var(--tlb-sp-12); }
.tlb-prose h2:first-child { margin-top: 0; }
.tlb-prose p, .tlb-prose ul { margin-top: var(--tlb-sp-3); color: var(--tlb-ink-soft); }
.tlb-prose ul { list-style: disc; padding-left: 1.25rem; }
.tlb-prose li + li { margin-top: var(--tlb-sp-2); }
.tlb-prose a { text-decoration: underline; color: var(--tlb-forest); }
.tlb-draft-banner {
  margin-bottom: var(--tlb-sp-8);
  padding: var(--tlb-sp-4) var(--tlb-sp-6);
  border: 1px dashed var(--tlb-gold);
  background: rgba(182, 138, 67, 0.08);
  font-size: var(--tlb-fs-small);
  color: var(--tlb-ink);
}

/* ---------------------------------------------------------------------- */
/* Reduced motion                                                         */
/* ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .tlb-site * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  [data-reveal], [data-reveal="stagger"] > * { opacity: 1; transform: none; }
}