/* ============================================================
   THE DISTRICT — Jacksonville, Alabama
   Design system & site styles  ·  V1
   ------------------------------------------------------------
   Sections:
   01 Tokens & reset      06 Cards & badges
   02 Typography          07 Forms
   03 Layout & utilities  08 Footer
   04 Header & nav        09 Chat widget
   05 Hero & sections     10 Responsive
   ============================================================ */

/* ===== 01 · TOKENS & RESET ================================= */
:root {
  /* Surfaces */
  --cream:      #F5EFE2;
  --cream-2:    #EFE6D3;
  --ivory:      #FCFAF3;
  /* Ink */
  --ink:        #221F1A;
  --charcoal:   #2C2A24;
  --stone:      #6E6655;
  --stone-2:    #8B8170;
  /* Brand */
  --green:      #2C4636;
  --green-2:    #1E3327;
  --green-3:    #15241B;
  --brick:      #9C4A2F;
  --brick-2:    #823C26;
  --brass:      #B68A3C;
  --brass-2:    #C9A24E;
  /* Lines & tints */
  --line:       #DCD0B5;
  --line-soft:  #E7DEC9;
  --green-tint: #E2E7DF;
  --brass-tint: #F0E6CE;
  --brick-tint: #F0DFD5;

  --shadow-sm:  0 2px 10px rgba(34,31,26,.06);
  --shadow-md:  0 14px 38px rgba(34,31,26,.13);
  --shadow-lg:  0 26px 70px rgba(20,32,26,.30);

  --maxw: 1220px;
  --gap: clamp(1.5rem, 4vw, 2.5rem);
  --section-y: clamp(4.5rem, 9vw, 8rem);
  --radius: 5px;

  --font-display: "Fraunces", "Playfair Display", Georgia, serif;
  --font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

:target { scroll-margin-top: 100px; }
[id] { scroll-margin-top: 100px; }

body {
  font-family: var(--font-body);
  background: var(--cream);
  color: var(--ink);
  font-size: 1.0625rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: inherit; cursor: pointer; }

:focus-visible {
  outline: 2px solid var(--brass);
  outline-offset: 3px;
}

.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;
}

.skip-link {
  position: absolute; left: 1rem; top: -3rem;
  background: var(--green); color: var(--cream);
  padding: .6rem 1.1rem; border-radius: 4px; z-index: 999;
  transition: top .2s ease;
}
.skip-link:focus { top: 1rem; }

/* ===== 02 · TYPOGRAPHY ===================================== */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.01em;
  color: var(--ink);
}

h1 { font-size: clamp(2.6rem, 6vw, 4.7rem); font-weight: 480; }
h2 { font-size: clamp(2rem, 4vw, 3.15rem); }
h3 { font-size: clamp(1.3rem, 2.1vw, 1.7rem); }
h4 { font-size: 1.15rem; }

p { max-width: 70ch; }

.display {
  font-family: var(--font-display);
  font-weight: 460;
  line-height: 1.1;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  font-family: var(--font-body);
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--brass);
}
.eyebrow::before {
  content: "";
  width: 26px; height: 1px;
  background: var(--brass);
  display: inline-block;
}
.eyebrow--center { justify-content: center; }
.eyebrow--center::after {
  content: "";
  width: 26px; height: 1px;
  background: var(--brass);
  display: inline-block;
}

.lede {
  font-size: clamp(1.12rem, 1.7vw, 1.4rem);
  line-height: 1.6;
  color: var(--stone);
  font-weight: 400;
}

.text-accent { color: var(--brick); }
.serif-accent { font-family: var(--font-display); font-style: italic; }

/* ===== 03 · LAYOUT & UTILITIES ============================= */
.container {
  width: 100%;
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}
.container--narrow { max-width: 880px; }

.section { padding-block: var(--section-y); }
.section--cream  { background: var(--cream); }
.section--cream2 { background: var(--cream-2); }
.section--ivory  { background: var(--ivory); }
.section--green {
  background: var(--green);
  color: var(--cream);
}
.section--green .eyebrow,
.section--dark .eyebrow { color: var(--brass-2); }
.section--green .eyebrow::before,
.section--green .eyebrow--center::after,
.section--dark .eyebrow::before,
.section--dark .eyebrow--center::after { background: var(--brass-2); }
.section--green h1, .section--green h2, .section--green h3,
.section--dark h1, .section--dark h2, .section--dark h3 { color: var(--cream); }
.section--green .lede, .section--dark .lede { color: rgba(245,239,226,.78); }
.section--dark { background: var(--green-3); color: var(--cream); }

.section-head { max-width: 760px; margin-bottom: clamp(2.2rem, 4vw, 3.4rem); }
.section-head--center { margin-inline: auto; text-align: center; }
.section-head h2 { margin-top: 1rem; }
.section-head .lede { margin-top: 1.1rem; }

.section-head--row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  max-width: none;
  flex-wrap: wrap;
}
.section-head--row .section-head__text { max-width: 640px; }

.grid { display: grid; gap: var(--gap); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

.stack > * + * { margin-top: 1.1rem; }
.center { text-align: center; }
.mt-1 { margin-top: 1rem; } .mt-2 { margin-top: 2rem; } .mt-3 { margin-top: 3rem; }
.divider { height: 1px; background: var(--line); border: 0; }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6em;
  font-family: var(--font-body);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 1rem 1.9rem;
  border: 1px solid transparent;
  border-radius: 3px;
  cursor: pointer;
  transition: background .22s ease, color .22s ease, transform .22s ease, border-color .22s ease;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }

.btn--primary { background: var(--green); color: var(--cream); }
.btn--primary:hover { background: var(--brick); }

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

.btn--light { background: var(--cream); color: var(--green); }
.btn--light:hover { background: var(--brass-2); color: var(--ink); }

.btn--on-dark {
  background: transparent;
  color: var(--cream);
  border-color: rgba(245,239,226,.55);
}
.btn--on-dark:hover { background: var(--cream); color: var(--green); border-color: var(--cream); }

.btn--brick { background: var(--brick); color: var(--cream); }
.btn--brick:hover { background: var(--brick-2); }

.btn--sm { padding: .72rem 1.25rem; font-size: .72rem; }
.btn--block { width: 100%; }

.btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--brick);
  padding: .35rem 0;
  border-bottom: 1px solid transparent;
  transition: gap .2s ease, border-color .2s ease, color .2s ease;
}
.btn-ghost:hover { gap: .85em; border-color: currentColor; }
.btn-ghost .arrow { transition: transform .2s ease; }
.btn-ghost:hover .arrow { transform: translateX(3px); }
.section--green .btn-ghost, .section--dark .btn-ghost { color: var(--brass-2); }

.btn-row { display: flex; flex-wrap: wrap; gap: .9rem; }

/* ===== 04 · HEADER & NAV =================================== */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 100;
  transition: background .3s ease, box-shadow .3s ease, border-color .3s ease;
  border-bottom: 1px solid transparent;
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  height: 80px;
}
.site-header.is-scrolled,
.site-header.is-solid {
  background: var(--cream);
  border-bottom-color: var(--line);
  box-shadow: 0 2px 16px rgba(34,31,26,.06);
}

/* Brand / logo */
.brand { display: flex; align-items: center; gap: .7rem; }
.brand__mark { width: 38px; height: 38px; flex: none; }
.brand__mark .stroke { stroke: var(--cream); transition: stroke .3s ease; }
.brand__mark .fill { fill: var(--cream); transition: fill .3s ease; }
.brand__text { line-height: 1; }
.brand__name {
  font-family: var(--font-display);
  font-size: 1.32rem;
  font-weight: 500;
  letter-spacing: .02em;
  color: var(--cream);
  transition: color .3s ease;
  display: block;
}
.brand__sub {
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--brass-2);
  display: block;
  margin-top: .22rem;
}
.is-scrolled .brand__name, .is-solid .brand__name { color: var(--ink); }
.is-scrolled .brand__mark .stroke, .is-solid .brand__mark .stroke { stroke: var(--green); }
.is-scrolled .brand__mark .fill, .is-solid .brand__mark .fill { fill: var(--green); }
.is-scrolled .brand__sub, .is-solid .brand__sub { color: var(--brass); }

/* Nav */
.nav { display: flex; align-items: center; gap: 2rem; }
.nav-links { display: flex; align-items: center; gap: 1.55rem; }
.nav-links a {
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: rgba(245,239,226,.9);
  padding: .4rem 0;
  position: relative;
  transition: color .2s ease;
}
.nav-links a::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 0; height: 1.5px;
  background: var(--brass-2);
  transition: width .25s ease;
}
.nav-links a:hover::after,
.nav-links a.is-active::after { width: 100%; }
.is-scrolled .nav-links a, .is-solid .nav-links a { color: var(--charcoal); }
.is-scrolled .nav-links a:hover, .is-solid .nav-links a:hover { color: var(--brick); }
.nav-links a.is-active { color: var(--brass-2); }
.is-scrolled .nav-links a.is-active, .is-solid .nav-links a.is-active { color: var(--brick); }

.nav-cta { display: flex; align-items: center; gap: .8rem; }

/* Hamburger */
.nav-toggle {
  display: none;
  width: 44px; height: 44px;
  background: transparent;
  border: 1px solid rgba(245,239,226,.4);
  border-radius: 4px;
  position: relative;
}
.is-scrolled .nav-toggle, .is-solid .nav-toggle { border-color: var(--line); }
.nav-toggle span,
.nav-toggle span::before,
.nav-toggle span::after {
  content: "";
  position: absolute;
  left: 50%; width: 20px; height: 2px;
  background: var(--cream);
  transform: translateX(-50%);
  transition: transform .25s ease, opacity .2s ease, background .3s ease;
}
.nav-toggle span { top: 50%; margin-top: -1px; }
.nav-toggle span::before { top: -6px; }
.nav-toggle span::after  { top: 6px; }
.is-scrolled .nav-toggle span,
.is-scrolled .nav-toggle span::before,
.is-scrolled .nav-toggle span::after,
.is-solid .nav-toggle span,
.is-solid .nav-toggle span::before,
.is-solid .nav-toggle span::after { background: var(--ink); }
body.nav-open .nav-toggle span { background: transparent; }
body.nav-open .nav-toggle span::before { transform: translateX(-50%) rotate(45deg); top: 0; background: var(--ink); }
body.nav-open .nav-toggle span::after  { transform: translateX(-50%) rotate(-45deg); top: 0; background: var(--ink); }

/* ===== 05 · HERO & SECTIONS ================================ */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: flex-end;
  color: var(--cream);
  overflow: hidden;
}
.hero__bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 72% 18%, rgba(201,162,78,.26), transparent 55%),
    radial-gradient(ellipse at 14% 96%, rgba(156,74,47,.34), transparent 58%),
    linear-gradient(158deg, #2B4636 0%, #1E3327 46%, #14201A 100%);
}
.hero__bg::before {
  content: "";
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(
    115deg, rgba(255,255,255,.035) 0 2px, transparent 2px 26px);
}
.hero__bg::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 64%, transparent 38%, rgba(10,18,13,.55) 100%);
}
.hero__inner {
  position: relative;
  z-index: 2;
  padding-block: clamp(7rem, 14vh, 11rem) clamp(3.5rem, 8vh, 6rem);
  width: 100%;
}
.hero__content { max-width: 880px; }
.hero h1 { color: var(--cream); margin-top: 1.4rem; }
.hero h1 em { font-style: italic; color: var(--brass-2); }
.hero__lede {
  margin-top: 1.6rem;
  font-size: clamp(1.1rem, 1.6vw, 1.35rem);
  color: rgba(245,239,226,.84);
  max-width: 60ch;
}
.hero__cta { margin-top: 2.4rem; }
.hero__scroll {
  position: absolute;
  bottom: 1.7rem; left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display: flex; flex-direction: column; align-items: center;
  gap: .55rem;
  font-size: .64rem; letter-spacing: .26em; text-transform: uppercase;
  color: rgba(245,239,226,.6);
}
.hero__scroll .line {
  width: 1px; height: 42px;
  background: linear-gradient(var(--brass-2), transparent);
  animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:.35;} 50%{opacity:1;} }

/* media tag (placeholder note) */
.media-tag {
  position: absolute;
  bottom: 1.2rem; right: 1.3rem;
  z-index: 3;
  font-size: .6rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(245,239,226,.5);
  border: 1px solid rgba(245,239,226,.22);
  padding: .3rem .6rem;
  border-radius: 3px;
  background: rgba(10,18,13,.3);
}

/* Light editorial hero (showcases an elevation/rendering on cream) */
.hero--light {
  min-height: auto;
  display: block;
  background: var(--cream);
  color: var(--ink);
  overflow: visible;
}
.hero--light .hero__inner {
  position: relative;
  z-index: 2;
  padding-block: clamp(7rem, 13vh, 9.5rem) clamp(1.5rem, 3vw, 2.5rem);
  text-align: center;
}
.hero--light .hero__content { max-width: 920px; margin-inline: auto; }
.hero--light .eyebrow { justify-content: center; }
.hero--light .eyebrow::after {
  content: ""; width: 26px; height: 1px; background: var(--brass); display: inline-block;
}
.hero--light h1 { color: var(--ink); margin-top: 1.3rem; }
.hero--light h1 em { color: var(--brick); font-style: italic; }
.hero--light .hero__lede {
  margin: 1.5rem auto 0;
  color: var(--stone);
  max-width: 62ch;
}
.hero--light .hero__cta { justify-content: center; margin-top: 2.2rem; }
.hero__elevation {
  background: var(--cream);
  padding: clamp(.5rem, 2vw, 1.5rem) 0 0;
  overflow: hidden;
}
.hero__elevation img {
  display: block;
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
  mix-blend-mode: multiply;
}
@media (max-width: 620px) {
  .hero--light .hero__inner { padding-top: 6.5rem; }
}

/* Interior page hero */
.page-hero {
  position: relative;
  min-height: 56vh;
  display: flex;
  align-items: center;
  text-align: center;
  color: var(--cream);
  overflow: hidden;
}
.page-hero__bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 78% 22%, rgba(201,162,78,.22), transparent 56%),
    radial-gradient(ellipse at 18% 92%, rgba(156,74,47,.30), transparent 60%),
    linear-gradient(160deg, #2B4636 0%, #1E3327 50%, #16261D 100%);
}
.page-hero__bg::before {
  content: "";
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(
    115deg, rgba(255,255,255,.03) 0 2px, transparent 2px 30px);
}
.page-hero__inner {
  position: relative; z-index: 2;
  width: 100%;
  padding-block: clamp(8rem, 16vh, 11rem) clamp(3.5rem, 7vh, 5.5rem);
}
.page-hero h1 { color: var(--cream); margin-top: 1.1rem; }
.page-hero__lede {
  margin: 1.3rem auto 0;
  max-width: 62ch;
  color: rgba(245,239,226,.82);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
}
.breadcrumb {
  margin-top: 1.8rem;
  font-size: .73rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(245,239,226,.6);
}
.breadcrumb a:hover { color: var(--brass-2); }
.breadcrumb span { color: var(--brass-2); }

/* Placeholder media */
.ph {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  background:
    linear-gradient(135deg, #EDE3CD 0%, #E2D6BA 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--stone);
  text-align: center;
  overflow: hidden;
  min-height: 200px;
}
.ph::before {
  content: "";
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(
    45deg, rgba(255,255,255,.35) 0 1px, transparent 1px 16px);
  opacity: .5;
}
.ph svg { position: relative; z-index: 1; opacity: .55; }
.ph__label {
  position: relative; z-index: 1;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--stone);
  max-width: 80%;
}
.ph--dark {
  background: linear-gradient(150deg, #2B4636, #16261D);
  border-color: rgba(245,239,226,.14);
  color: rgba(245,239,226,.65);
}
.ph--dark::before { background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 1px, transparent 1px 16px); }
.ph--dark .ph__label { color: rgba(245,239,226,.6); }
.ph--brick { background: linear-gradient(150deg, #B96545, #823C26); border-color: rgba(245,239,226,.14); color: rgba(245,239,226,.7); }
.ph--brick .ph__label { color: rgba(245,239,226,.72); }
.ph--tall { min-height: 420px; }
.ph--wide { aspect-ratio: 16 / 9; }
.ph--square { aspect-ratio: 1 / 1; }

/* Split section */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
.split--media-right { direction: ltr; }
.split__media .ph { min-height: 460px; height: 100%; }
.split__text { max-width: 540px; }
.split__text h2 { margin-top: 1rem; }
.split__text p { margin-top: 1.1rem; }

/* Stat strip */
.stat-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.stat {
  background: var(--ivory);
  padding: clamp(1.6rem, 3vw, 2.4rem) 1.4rem;
  text-align: center;
}
.section--green .stat-strip, .section--dark .stat-strip { background: rgba(245,239,226,.16); border-color: rgba(245,239,226,.16); }
.section--green .stat, .section--dark .stat { background: var(--green-2); }
.section--dark .stat { background: rgba(245,239,226,.04); }
.stat__num {
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 3.6vw, 3rem);
  font-weight: 480;
  color: var(--brick);
  line-height: 1;
}
.section--green .stat__num, .section--dark .stat__num { color: var(--brass-2); }
.stat__label {
  margin-top: .7rem;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--stone);
}
.section--green .stat__label, .section--dark .stat__label { color: rgba(245,239,226,.7); }

/* CTA band */
.cta-band {
  position: relative;
  overflow: hidden;
  text-align: center;
  color: var(--cream);
}
.cta-band__bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 80% 15%, rgba(201,162,78,.26), transparent 55%),
    radial-gradient(ellipse at 12% 95%, rgba(156,74,47,.32), transparent 60%),
    linear-gradient(155deg, #2B4636, #16261D);
}
.cta-band__bg::before {
  content:""; position:absolute; inset:0;
  background-image: repeating-linear-gradient(115deg, rgba(255,255,255,.03) 0 2px, transparent 2px 28px);
}
.cta-band .container { position: relative; z-index: 2; }
.cta-band h2 { color: var(--cream); }
.cta-band p { margin: 1.2rem auto 0; color: rgba(245,239,226,.82); }
.cta-band .btn-row { justify-content: center; margin-top: 2.2rem; }

/* Pull quote */
.pullquote {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  font-weight: 460;
  line-height: 1.32;
  font-style: italic;
  max-width: 22ch;
}
.pullquote__cite {
  margin-top: 1.4rem;
  font-family: var(--font-body);
  font-style: normal;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--brass);
}

/* ===== 06 · CARDS & BADGES ================================= */
.badge {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .38em .7em;
  border-radius: 2px;
}
.badge::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.badge--available { background: var(--green-tint); color: #355E42; }
.badge--soon      { background: var(--brass-tint); color: #8A6A20; }
.badge--loi       { background: #E6E1D4; color: var(--stone); }
.badge--open      { background: var(--green-tint); color: #355E42; }
.badge--new       { background: var(--brick-tint); color: var(--brick-2); }

/* Generic card */
.card {
  background: var(--ivory);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  display: flex;
  flex-direction: column;
}
.card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
  border-color: var(--line);
}
.card__body { padding: 1.6rem; display: flex; flex-direction: column; gap: .7rem; flex: 1; }
.card__media { position: relative; }
.card__media .ph { border: 0; border-radius: 0; min-height: 210px; }
.card__media .badge { position: absolute; top: 1rem; left: 1rem; z-index: 2; box-shadow: 0 2px 8px rgba(20,32,26,.18); }
.card__img { width: 100%; height: 232px; object-fit: cover; display: block; }

/* Real photo in split media + generic media image */
.media-img {
  width: 100%; height: 100%;
  min-height: 460px;
  object-fit: cover;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  display: block;
}
.split__media .media-img { min-height: 460px; }

/* Hero & page-hero background photography */
.hero__img, .page-hero__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.hero.is-photo .hero__bg {
  background: linear-gradient(157deg, rgba(16,26,20,.86) 0%, rgba(28,48,38,.55) 48%, rgba(16,26,20,.84) 100%);
}
.page-hero.is-photo .page-hero__bg {
  background: linear-gradient(160deg, rgba(16,26,20,.85) 0%, rgba(28,48,38,.58) 50%, rgba(16,26,20,.84) 100%);
}

/* Tenant / concept card */
.tenant-card .card__body { gap: .5rem; }
.tenant-card__cat {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--brass);
}
.tenant-card h3 { font-size: 1.4rem; }
.tenant-card__blurb { font-size: .96rem; color: var(--stone); }
.tenant-card__meta {
  margin-top: auto;
  padding-top: .9rem;
  border-top: 1px solid var(--line-soft);
  font-size: .8rem;
  color: var(--stone-2);
  display: flex; align-items: center; gap: .5rem;
}

/* Space card */
.space-card { }
.space-card .card__body { gap: .8rem; }
.space-card__project {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--brass);
}
.space-card h3 { font-size: 1.45rem; }
.space-card__addr { font-size: .88rem; color: var(--stone-2); margin-top: -.3rem; }
.space-specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .1rem 1rem;
  margin-top: .3rem;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding-block: .9rem;
}
.space-specs div { display: flex; flex-direction: column; gap: .1rem; }
.space-specs dt {
  font-size: .68rem; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: var(--stone-2);
}
.space-specs dd {
  font-family: var(--font-display);
  font-size: 1.18rem;
  color: var(--ink);
}
.space-card__uses { font-size: .9rem; color: var(--stone); }
.space-card__uses strong { color: var(--ink); font-weight: 600; }
.space-card__cta {
  margin-top: auto;
  padding-top: 1rem;
  display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap;
}

/* Event card */
.event-card { display: flex; flex-direction: row; gap: 0; align-items: stretch; }
.event-card__date {
  flex: none;
  width: 92px;
  background: var(--green);
  color: var(--cream);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  padding: 1rem .5rem;
}
.event-card__date .m {
  font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--brass-2);
}
.event-card__date .d {
  font-family: var(--font-display);
  font-size: 2.1rem; line-height: 1.1;
}
.event-card__date .season {
  font-family: var(--font-display);
  font-size: 1rem; line-height: 1.2; padding: .2rem;
}
.event-card__body { padding: 1.3rem 1.5rem; display: flex; flex-direction: column; gap: .45rem; flex: 1; }
.event-card__tag {
  font-size: .7rem; font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; color: var(--brass);
}
.event-card h3 { font-size: 1.25rem; }
.event-card__meta { font-size: .82rem; color: var(--stone-2); }
.event-card__blurb { font-size: .92rem; color: var(--stone); }

/* Feature card (icon) */
.feature-card {
  background: var(--ivory);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  padding: 1.9rem 1.7rem;
  transition: transform .25s ease, box-shadow .25s ease;
}
.feature-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); }
.feature-card__icon {
  width: 52px; height: 52px;
  display: flex; align-items: center; justify-content: center;
  background: var(--green-tint);
  color: var(--green);
  border-radius: 6px;
  margin-bottom: 1.1rem;
}
.section--green .feature-card,
.section--dark .feature-card {
  background: rgba(245,239,226,.05);
  border-color: rgba(245,239,226,.14);
}
.section--green .feature-card__icon,
.section--dark .feature-card__icon {
  background: rgba(201,162,78,.18); color: var(--brass-2);
}
.feature-card h3 { font-size: 1.22rem; margin-bottom: .5rem; }
.feature-card p { font-size: .94rem; color: var(--stone); }
.section--green .feature-card p, .section--dark .feature-card p { color: rgba(245,239,226,.74); }

/* Numbered list / steps */
.steps { counter-reset: step; display: grid; gap: 1.3rem; }
.step { display: flex; gap: 1.2rem; }
.step__num {
  counter-increment: step;
  flex: none;
  width: 46px; height: 46px;
  border: 1px solid var(--brass);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display);
  font-size: 1.2rem;
  color: var(--brick);
}
.step__num::before { content: counter(step, decimal-leading-zero); }
.step h3 { font-size: 1.15rem; margin-bottom: .3rem; }
.step p { font-size: .95rem; color: var(--stone); }

/* Filter bar */
.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-bottom: 2.4rem;
}
.filter-btn {
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .6rem 1.1rem;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 50px;
  color: var(--stone);
  transition: all .2s ease;
}
.filter-btn:hover { border-color: var(--green); color: var(--green); }
.filter-btn.is-active {
  background: var(--green);
  border-color: var(--green);
  color: var(--cream);
}

.is-hidden { display: none !important; }

.empty-note {
  grid-column: 1 / -1;
  text-align: center;
  padding: 3rem 1rem;
  color: var(--stone);
  font-style: italic;
  font-family: var(--font-display);
  font-size: 1.2rem;
}

/* Info list (FAQ-ish definition rows) */
.info-list { border-top: 1px solid var(--line); }
.info-row {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 1.5rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--line);
}
.info-row dt {
  font-family: var(--font-display);
  font-size: 1.2rem;
  color: var(--ink);
}
.info-row dd { color: var(--stone); }

/* FAQ accordion */
.faq { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  text-align: left;
  background: transparent;
  border: 0;
  padding: 1.45rem 0;
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 1.7vw, 1.32rem);
  color: var(--ink);
}
.faq-q .icon {
  flex: none;
  width: 28px; height: 28px;
  position: relative;
}
.faq-q .icon::before,
.faq-q .icon::after {
  content: "";
  position: absolute;
  background: var(--brick);
  transition: transform .25s ease;
}
.faq-q .icon::before { top: 50%; left: 4px; right: 4px; height: 2px; margin-top: -1px; }
.faq-q .icon::after  { left: 50%; top: 4px; bottom: 4px; width: 2px; margin-left: -1px; }
.faq-item.is-open .faq-q .icon::after { transform: rotate(90deg); opacity: 0; }
.faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
.faq-a__inner { padding: 0 0 1.5rem; color: var(--stone); max-width: 75ch; }
.faq-item.is-open .faq-a { max-height: 420px; }

/* Embed (external booking) */
.embed-card {
  background: var(--ivory);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.embed-card__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1rem 1.3rem;
  background: var(--green);
  color: var(--cream);
  border-bottom: 1px solid var(--line);
}
.embed-card__bar .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--brass-2); flex: none; margin-right: .5rem; }
.embed-card__url { font-size: .9rem; font-weight: 600; letter-spacing: .02em; display: flex; align-items: center; }
.embed-card__frame { position: relative; width: 100%; height: 660px; background: var(--cream-2); }
.embed-card__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 620px) { .embed-card__frame { height: 540px; } }

/* Contact aside */
.contact-aside {
  background: var(--ivory);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: clamp(1.7rem, 3.5vw, 2.6rem);
  height: 100%;
}
.ca-item { padding: 1.15rem 0; border-bottom: 1px solid var(--line-soft); }
.ca-item:first-of-type { padding-top: 0; }
.ca-item:last-child { border-bottom: 0; padding-bottom: 0; }
.ca-label {
  font-size: .72rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--brass);
  display: block; margin-bottom: .4rem;
}
.ca-value { font-size: 1rem; color: var(--ink); line-height: 1.55; }
.ca-value a { color: var(--brick); font-weight: 500; }
.ca-value a:hover { text-decoration: underline; }

/* Callout */
.callout {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  background: var(--brass-tint);
  border: 1px solid #E3D2A8;
  border-left: 3px solid var(--brass);
  border-radius: var(--radius);
  padding: 1.3rem 1.6rem;
}
.callout__icon { color: var(--brass); flex: none; margin-top: 2px; }
.callout p { font-size: .92rem; color: var(--charcoal); margin: 0; max-width: none; }
.callout strong { color: var(--ink); }
.section--green .callout, .section--dark .callout {
  background: rgba(201,162,78,.12);
  border-color: rgba(201,162,78,.32);
  border-left-color: var(--brass-2);
}
.section--green .callout p, .section--dark .callout p { color: rgba(245,239,226,.82); }
.section--green .callout strong, .section--dark .callout strong { color: var(--cream); }

/* Tag pills */
.tag-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.tag {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  padding: .35rem .75rem;
  background: var(--cream-2);
  border: 1px solid var(--line-soft);
  border-radius: 50px;
  color: var(--stone);
}

/* ===== 07 · FORMS ========================================== */
.form { display: grid; gap: 1.25rem; }
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.field { display: flex; flex-direction: column; gap: .45rem; }
.field label {
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--charcoal);
}
.field label .req { color: var(--brick); }
.field input,
.field select,
.field textarea {
  font-family: inherit;
  font-size: 1rem;
  color: var(--ink);
  background: var(--ivory);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: .85rem 1rem;
  width: 100%;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.field textarea { min-height: 140px; resize: vertical; }
.field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236E6655' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.6rem;
}
.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(44,70,54,.12);
}
.field input::placeholder,
.field textarea::placeholder { color: var(--stone-2); }

.form-card {
  background: var(--ivory);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: clamp(1.8rem, 4vw, 3rem);
}
.section--green .form-card,
.section--dark .form-card {
  background: rgba(245,239,226,.04);
  border-color: rgba(245,239,226,.16);
}
.section--green .field label,
.section--dark .field label { color: rgba(245,239,226,.85); }
.section--green .field input,
.section--green .field select,
.section--green .field textarea,
.section--dark .field input,
.section--dark .field select,
.section--dark .field textarea {
  background: rgba(245,239,226,.06);
  border-color: rgba(245,239,226,.22);
  color: var(--cream);
}
.section--green .field input::placeholder,
.section--dark .field input::placeholder { color: rgba(245,239,226,.45); }

.form__note { font-size: .82rem; color: var(--stone-2); }
.section--green .form__note, .section--dark .form__note { color: rgba(245,239,226,.6); }

.form-feedback {
  display: none;
  padding: 1rem 1.2rem;
  border-radius: 4px;
  font-size: .94rem;
}
.form-feedback.is-visible { display: block; }
.form-feedback--success {
  background: var(--green-tint);
  color: #2F5239;
  border: 1px solid #BBCDB9;
}
.form-feedback--error {
  background: var(--brick-tint);
  color: var(--brick-2);
  border: 1px solid #E0BCA9;
}

/* ===== 08 · FOOTER ========================================= */
.site-footer {
  background: var(--green-3);
  color: rgba(245,239,226,.72);
  padding-top: clamp(3.5rem, 7vw, 5.5rem);
}
.footer-top {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
  gap: 2.5rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(245,239,226,.13);
}
.footer-brand .brand__name { color: var(--cream); }
.footer-brand .brand__mark .stroke { stroke: var(--brass-2); }
.footer-brand .brand__mark .fill { fill: var(--brass-2); }
.footer-brand p {
  margin-top: 1.2rem;
  font-size: .92rem;
  max-width: 34ch;
}
.footer-col h4 {
  font-family: var(--font-body);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--brass-2);
  margin-bottom: 1.1rem;
}
.footer-col ul { display: grid; gap: .65rem; }
.footer-col a { font-size: .92rem; transition: color .2s ease; }
.footer-col a:hover { color: var(--cream); }
.footer-contact p { font-size: .92rem; margin-bottom: .55rem; }
.footer-contact a { color: rgba(245,239,226,.72); }
.footer-contact a:hover { color: var(--brass-2); }

.footer-news { margin-top: 1.4rem; }
.footer-news form { display: flex; gap: .5rem; }
.footer-news input {
  flex: 1;
  background: rgba(245,239,226,.07);
  border: 1px solid rgba(245,239,226,.2);
  border-radius: 4px;
  padding: .7rem .9rem;
  color: var(--cream);
  font-family: inherit;
  font-size: .9rem;
  min-width: 0;
}
.footer-news input::placeholder { color: rgba(245,239,226,.45); }
.footer-news input:focus { outline: none; border-color: var(--brass-2); }
.footer-news button {
  flex: none;
  background: var(--brass);
  color: var(--ink);
  border: 0;
  border-radius: 4px;
  padding: 0 1rem;
  font-weight: 600;
  font-size: .8rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: background .2s ease;
}
.footer-news button:hover { background: var(--brass-2); }
.footer-news .form-feedback { margin-top: .7rem; padding: .6rem .8rem; font-size: .84rem; }

.social-row { display: flex; gap: .7rem; margin-top: 1.3rem; }
.social-row a {
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(245,239,226,.2);
  border-radius: 50%;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.social-row a:hover { background: var(--brass); border-color: var(--brass); color: var(--ink); }

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding-block: 1.8rem;
  font-size: .8rem;
  color: rgba(245,239,226,.5);
}
.footer-bottom a:hover { color: var(--brass-2); }
.footer-bottom__links { display: flex; gap: 1.4rem; flex-wrap: wrap; }
.footer-invest {
  background: rgba(245,239,226,.05);
  border: 1px solid rgba(245,239,226,.13);
  border-radius: var(--radius);
  padding: 1.1rem 1.5rem;
  margin-bottom: 2.2rem;
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.2rem; flex-wrap: wrap;
  font-size: .92rem;
}
.footer-invest strong { color: var(--cream); font-weight: 600; }

/* ===== 09 · CHAT WIDGET ==================================== */
.chat-launch {
  position: fixed;
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1rem, 3vw, 2rem);
  z-index: 90;
  display: flex;
  align-items: center;
  gap: .6rem;
  background: var(--green);
  color: var(--cream);
  border: 1px solid rgba(245,239,226,.15);
  border-radius: 50px;
  padding: .85rem 1.3rem .85rem 1rem;
  box-shadow: var(--shadow-md);
  font-family: var(--font-body);
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .03em;
  transition: transform .2s ease, background .2s ease;
}
.chat-launch:hover { transform: translateY(-3px); background: var(--green-2); }
.chat-launch__icon {
  width: 30px; height: 30px;
  background: var(--brass);
  color: var(--green-3);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex: none;
}
.chat-launch.is-hidden { display: none; }

.chat-panel {
  position: fixed;
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1rem, 3vw, 2rem);
  z-index: 95;
  width: 374px;
  max-width: calc(100vw - 2rem);
  background: var(--ivory);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  transform: translateY(24px) scale(.96);
  opacity: 0;
  pointer-events: none;
  transition: transform .26s cubic-bezier(.2,.7,.2,1), opacity .2s ease;
}
.chat-panel.is-open { transform: translateY(0) scale(1); opacity: 1; pointer-events: auto; }

.chat-header {
  background: linear-gradient(155deg, #2B4636, #16261D);
  color: var(--cream);
  padding: 1.4rem 1.4rem 1.3rem;
  position: relative;
}
.chat-header__eyebrow {
  font-size: .66rem; font-weight: 600; letter-spacing: .2em;
  text-transform: uppercase; color: var(--brass-2);
}
.chat-header h3 { color: var(--cream); font-size: 1.32rem; margin-top: .4rem; }
.chat-header p { font-size: .86rem; color: rgba(245,239,226,.72); margin-top: .25rem; }
.chat-close {
  position: absolute;
  top: 1rem; right: 1rem;
  width: 32px; height: 32px;
  background: rgba(245,239,226,.12);
  border: 0; border-radius: 50%;
  color: var(--cream);
  font-size: 1.1rem;
  display: flex; align-items: center; justify-content: center;
}
.chat-close:hover { background: rgba(245,239,226,.24); }

.chat-body { padding: 1.2rem; max-height: 60vh; overflow-y: auto; }
.chat-intro {
  font-size: .82rem;
  color: var(--stone);
  margin-bottom: .9rem;
}
.chat-options { display: grid; gap: .55rem; }
.chat-option {
  display: flex;
  align-items: center;
  gap: .85rem;
  width: 100%;
  text-align: left;
  background: var(--cream);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: .85rem .95rem;
  transition: border-color .2s ease, background .2s ease, transform .15s ease;
}
.chat-option:hover { border-color: var(--green); background: var(--ivory); transform: translateX(2px); }
.chat-option__icon {
  flex: none;
  width: 38px; height: 38px;
  background: var(--green-tint);
  color: var(--green);
  border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
}
.chat-option__text strong {
  display: block;
  font-size: .92rem;
  font-weight: 600;
  color: var(--ink);
}
.chat-option__text span { font-size: .78rem; color: var(--stone); }
.chat-option__arrow { margin-left: auto; color: var(--brass); flex: none; }

.chat-view { display: none; }
.chat-view.is-active { display: block; }
.chat-back {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--brick);
  background: transparent;
  border: 0;
  margin-bottom: 1rem;
  padding: 0;
}
.chat-view h4 { font-size: 1.2rem; margin-bottom: .5rem; }
.chat-view p { font-size: .9rem; color: var(--stone); margin-bottom: 1rem; }
.chat-links { display: grid; gap: .5rem; }
.chat-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  background: var(--cream);
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  padding: .75rem .9rem;
  font-size: .88rem;
  font-weight: 500;
  color: var(--ink);
  transition: border-color .2s ease, background .2s ease;
}
.chat-link:hover { border-color: var(--green); background: var(--ivory); }
.chat-link .chat-link__arrow { color: var(--brass); }
.chat-footer {
  border-top: 1px solid var(--line-soft);
  padding: .85rem 1.2rem;
  font-size: .76rem;
  color: var(--stone-2);
  text-align: center;
}

/* ===== 10 · RESPONSIVE ===================================== */
@media (max-width: 1080px) {
  .footer-top { grid-template-columns: 1fr 1fr; gap: 2rem 2.5rem; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 960px) {
  .nav-links,
  .nav-cta .btn { display: none; }
  .nav-toggle { display: block; }
  .nav {
    position: fixed;
    inset: 80px 0 auto 0;
    background: var(--cream);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 1rem clamp(1.25rem, 4vw, 2.5rem) 2rem;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-md);
    transform: translateY(-130%);
    transition: transform .3s ease;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
  }
  body.nav-open .nav { transform: translateY(0); }
  .nav-links {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }
  .nav-links a {
    color: var(--charcoal);
    padding: .95rem 0;
    border-bottom: 1px solid var(--line-soft);
    font-size: .95rem;
  }
  .nav-links a::after { display: none; }
  .nav-cta { width: 100%; margin-top: 1.2rem; }
  .nav-cta .btn { display: flex; width: 100%; }

  .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .split { grid-template-columns: 1fr; }
  .split__media { order: -1; }
  .split__media .ph { min-height: 320px; }
  .media-img, .split__media .media-img { min-height: 300px; }
  .stat-strip { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
  body { font-size: 1rem; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .section-head--row { flex-direction: column; align-items: flex-start; }
  .event-card { flex-direction: column; }
  .event-card__date { width: 100%; flex-direction: row; gap: .6rem; padding: .7rem; }
  .info-row { grid-template-columns: 1fr; gap: .4rem; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .chat-launch__label { display: none; }
  .chat-launch { padding: .85rem; }
  .hero__scroll { display: none; }
  .btn { width: 100%; }
  .btn-row .btn { width: auto; }
  .hero__cta .btn, .cta-band .btn { width: 100%; }
}

@media (max-width: 420px) {
  .btn-row { width: 100%; }
  .btn-row .btn { width: 100%; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}