/* ═══════════════════════════════════════════════════════════════
   BRIAN HOLLAND REAL ESTATE — STYLE SYSTEM
   Palette: warm ivory/stone, deep espresso text, forest green accent
   Fonts: Cormorant Garamond (display) + DM Sans (body)
═══════════════════════════════════════════════════════════════ */

/* ─── TOKENS ─────────────────────────────────────────────── */
:root,
[data-theme='light'] {
  /* Surfaces */
  --color-bg:            #F5F3EE;
  --color-surface:       #F9F7F3;
  --color-surface-2:     #FDFCFA;
  --color-surface-offset:#EDE9E2;
  --color-divider:       #DDD9D1;
  --color-border:        #D2CEC5;

  /* Text */
  --color-text:          #1E1B16;
  --color-text-muted:    #6B6760;
  --color-text-faint:    #B0ADA6;
  --color-text-inverse:  #F9F7F3;

  /* Accent: deep forest green */
  --color-primary:       #2A4A3A;
  --color-primary-hover: #1F3A2C;
  --color-primary-active:#162A1F;
  --color-primary-light: #4A7A60;
  --color-primary-highlight: #D4E0DA;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(30,27,22,0.06);
  --shadow-md:  0 4px 16px rgba(30,27,22,0.08);
  --shadow-lg:  0 12px 40px rgba(30,27,22,0.12);

  /* Radius */
  --radius-sm:  0.25rem;
  --radius-md:  0.375rem;
  --radius-lg:  0.625rem;
  --radius-full:9999px;

  /* Transitions */
  --t:          200ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Fonts */
  --font-display: 'Cormorant Garamond', 'Georgia', serif;
  --font-body:    'DM Sans', 'Helvetica Neue', sans-serif;

  /* Type scale */
  --text-xs:   clamp(0.75rem, 0.7rem + 0.2vw,  0.8125rem);
  --text-sm:   clamp(0.875rem, 0.82rem + 0.25vw, 0.9375rem);
  --text-base: clamp(1rem, 0.96rem + 0.2vw,    1.0625rem);
  --text-lg:   clamp(1.125rem, 1rem + 0.5vw,   1.375rem);
  --text-xl:   clamp(1.5rem, 1.2rem + 1vw,     2rem);
  --text-2xl:  clamp(2rem, 1.2rem + 2.5vw,     3.25rem);
  --text-3xl:  clamp(2.5rem, 1rem + 5vw,       5rem);
  --text-hero: clamp(2.5rem, 0.5rem + 5vw,    4.75rem);

  /* Space */
  --space-1: 0.25rem; --space-2: 0.5rem;  --space-3: 0.75rem;
  --space-4: 1rem;    --space-5: 1.25rem; --space-6: 1.5rem;
  --space-8: 2rem;    --space-10:2.5rem;  --space-12:3rem;
  --space-16:4rem;    --space-20:5rem;    --space-24:6rem;
  --space-32:8rem;

  /* Widths */
  --content-narrow:  700px;
  --content-default: 1060px;
  --content-wide:    1280px;
}

[data-theme='dark'] {
  --color-bg:            #141210;
  --color-surface:       #1A1815;
  --color-surface-2:     #1F1D1A;
  --color-surface-offset:#242220;
  --color-divider:       #2E2C29;
  --color-border:        #3A3835;
  --color-text:          #E8E5DF;
  --color-text-muted:    #8A8780;
  --color-text-faint:    #5A5855;
  --color-text-inverse:  #141210;
  --color-primary:       #6FAF8C;
  --color-primary-hover: #88C4A3;
  --color-primary-active:#A0D4B7;
  --color-primary-light: #6FAF8C;
  --color-primary-highlight: #2A3D35;
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.25);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.35);
  --shadow-lg:  0 12px 40px rgba(0,0,0,0.45);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --color-bg:            #141210;
    --color-surface:       #1A1815;
    --color-surface-2:     #1F1D1A;
    --color-surface-offset:#242220;
    --color-divider:       #2E2C29;
    --color-border:        #3A3835;
    --color-text:          #E8E5DF;
    --color-text-muted:    #8A8780;
    --color-text-faint:    #5A5855;
    --color-text-inverse:  #141210;
    --color-primary:       #6FAF8C;
    --color-primary-hover: #88C4A3;
    --color-primary-active:#A0D4B7;
    --color-primary-light: #6FAF8C;
    --color-primary-highlight: #2A3D35;
    --shadow-sm:  0 1px 3px rgba(0,0,0,0.25);
    --shadow-md:  0 4px 16px rgba(0,0,0,0.35);
    --shadow-lg:  0 12px 40px rgba(0,0,0,0.45);
  }
}

/* ─── BASE RESET ─────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html {
  -webkit-text-size-adjust:none; text-size-adjust:none;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  scroll-behavior:smooth;
  scroll-padding-top: var(--space-20);
}
body {
  min-height:100dvh;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height:1.65;
  color: var(--color-text);
  background-color: var(--color-bg);
}
img,picture,video,canvas,svg { display:block; max-width:100%; height:auto; }
ul[role='list'],ol[role='list'] { list-style:none; }
input,button,textarea,select { font:inherit; color:inherit; }
h1,h2,h3,h4,h5,h6 { text-wrap:balance; line-height:1.15; }
p,li { text-wrap:pretty; max-width:68ch; }
::selection { background: color-mix(in oklab, var(--color-primary), transparent 75%); color:var(--color-text); }
:focus-visible { outline:2px solid var(--color-primary); outline-offset:3px; border-radius:var(--radius-sm); }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}
a,button,[role='button'],input,textarea,select {
  transition: color var(--t), background var(--t), border-color var(--t), box-shadow var(--t), opacity var(--t);
}
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border-width:0; }

/* ─── LAYOUT ─────────────────────────────────────────────── */
.container {
  width:100%;
  max-width: var(--content-default);
  margin-inline:auto;
  padding-inline: clamp(var(--space-5), 5vw, var(--space-16));
}
.container-narrow {
  max-width: var(--content-narrow);
}
.section-pad {
  padding-block: clamp(var(--space-12), 8vw, var(--space-32));
}

/* ─── TYPOGRAPHY ─────────────────────────────────────────── */
h1 { font-family: var(--font-display); font-size: var(--text-hero); font-weight:500; letter-spacing:-0.02em; line-height:1.05; }
h2 { font-family: var(--font-display); font-size: var(--text-2xl); font-weight:500; letter-spacing:-0.02em; line-height:1.1; }
h3 { font-family: var(--font-display); font-size: var(--text-xl); font-weight:500; letter-spacing:-0.01em; }
p  { font-size: var(--text-base); color: var(--color-text-muted); line-height:1.72; }

.section-label {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color: var(--color-primary);
  margin-bottom: var(--space-4);
  display:block;
}
.section-label--light {
  color: color-mix(in oklab, var(--color-primary-light), white 60%);
}

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight:500;
  letter-spacing:.03em;
  line-height:1;
  border-radius: var(--radius-md);
  padding: 0.75rem 1.5rem;
  cursor:pointer;
  text-decoration:none;
  border:1.5px solid transparent;
  white-space:nowrap;
}
.btn-sm { padding: 0.5rem 1rem; font-size: var(--text-xs); }
.btn-lg { padding: 0.9rem 2rem; font-size: var(--text-sm); letter-spacing:.04em; }
.btn-full { width:100%; }

.btn-primary {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.btn-primary:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); }
.btn-primary:active { background: var(--color-primary-active); }

.btn-secondary {
  background: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn-secondary:hover { background: var(--color-primary-highlight); }

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

.btn-light {
  background: #fff;
  color: var(--color-primary-active);
  border-color: #fff;
}
.btn-light:hover { background: var(--color-surface-offset); }

.btn-outline-light {
  background: rgba(255,255,255,0.12);
  color: #fff;
  border-color: rgba(255,255,255,0.6);
}
.btn-outline-light:hover { border-color: rgba(255,255,255,0.95); background: rgba(255,255,255,0.22); }

/* ─── SCROLL REVEALS ─────────────────────────────────────── */
.reveal {
  opacity:0;
  transform: translateY(22px);
  transition: opacity 0.65s cubic-bezier(0.16,1,0.3,1), transform 0.65s cubic-bezier(0.16,1,0.3,1);
}
.reveal.visible {
  opacity:1;
  transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }

/* ─── HEADER ─────────────────────────────────────────────── */
.site-header {
  position:sticky; top:0; z-index:100;
  background: color-mix(in oklab, var(--color-bg), transparent 8%);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom:1px solid transparent;
  transition: border-color var(--t), box-shadow var(--t);
}
.site-header.scrolled {
  border-bottom-color: var(--color-divider);
  box-shadow: var(--shadow-sm);
}
.header-inner {
  display:flex;
  align-items:center;
  gap: var(--space-8);
  height:68px;
}

/* Wordmark */
.wordmark {
  display:flex;
  align-items:center;
  gap: var(--space-3);
  text-decoration:none;
  color: var(--color-text);
  flex-shrink:0;
}
.wordmark:hover { color: var(--color-primary); }
.wordmark-text {
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight:500;
  letter-spacing: 0.01em;
  line-height:1;
}

/* Nav */
.main-nav { flex:1; }
.main-nav ul {
  display:flex;
  align-items:center;
  gap: var(--space-8);
  list-style:none;
  justify-content:center;
}
.main-nav a {
  font-size: var(--text-sm);
  font-weight:400;
  color: var(--color-text-muted);
  text-decoration:none;
  letter-spacing:.01em;
}
.main-nav a:hover { color: var(--color-primary); }

/* Header right */
.header-actions {
  display:flex;
  align-items:center;
  gap: var(--space-3);
  flex-shrink:0;
}
.theme-toggle {
  display:flex; align-items:center; justify-content:center;
  width:36px; height:36px;
  color: var(--color-text-muted);
  border-radius: var(--radius-md);
  background:transparent; border:none; cursor:pointer;
}
.theme-toggle:hover { color: var(--color-primary); background: var(--color-surface-offset); }

.mobile-menu-toggle {
  display:none;
  flex-direction:column;
  gap:5px;
  width:36px; height:36px;
  align-items:center; justify-content:center;
  background:transparent; border:none; cursor:pointer;
  padding:0;
}
.mobile-menu-toggle span {
  display:block;
  width:22px; height:1.5px;
  background: var(--color-text);
  transition: transform var(--t), opacity var(--t);
}
.mobile-menu-toggle.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.mobile-menu-toggle.open span:nth-child(2) { opacity:0; }
.mobile-menu-toggle.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* Mobile nav panel */
.mobile-nav {
  display:none;
  flex-direction:column;
  gap: var(--space-6);
  padding: var(--space-6) clamp(var(--space-5),5vw,var(--space-16)) var(--space-8);
  border-top:1px solid var(--color-divider);
  background: var(--color-surface);
}
.mobile-nav ul { list-style:none; display:flex; flex-direction:column; gap:var(--space-4); }
.mobile-nav a { font-size: var(--text-base); color: var(--color-text); text-decoration:none; font-weight:400; }
.mobile-nav a:hover { color: var(--color-primary); }
.mobile-nav .affiliation-line {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  line-height:1.5;
  max-width:none;
}

@media (max-width:860px) {
  .main-nav { display:none; }
  .mobile-menu-toggle { display:flex; }
  .mobile-nav.open { display:flex; }
  .header-inner .btn-sm { display:none; }
}

/* ─── HERO ───────────────────────────────────────────────── */
.hero {
  position:relative;
  min-height: clamp(580px, 88vh, 820px);
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}
.hero-image-wrap {
  position:absolute; inset:0;
  z-index:0;
}
.hero-img {
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 40%;
}
.hero-overlay {
  position:absolute; inset:0;
  background: linear-gradient(
    to top,
    rgba(20,18,14,0.82) 0%,
    rgba(20,18,14,0.45) 45%,
    rgba(20,18,14,0.12) 100%
  );
}
.hero-content {
  position:relative; z-index:1;
  padding-bottom: clamp(var(--space-12), 7vw, var(--space-24));
  padding-top: var(--space-24);
  max-width:840px;
}
.hero .eyebrow {
  font-size: var(--text-xs);
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color: rgba(255,255,255,0.7);
  margin-bottom: var(--space-5);
  max-width:none;
}
.hero h1 {
  color:#fff;
  font-size: var(--text-hero);
  max-width:18ch;
  margin-bottom: var(--space-6);
}
.hero-sub {
  color:rgba(255,255,255,0.8);
  font-size: var(--text-lg);
  max-width:58ch;
  margin-bottom: var(--space-8);
  line-height:1.6;
}
.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.affiliation-microcopy {
  font-size: var(--text-xs);
  color:rgba(255,255,255,0.45);
  letter-spacing:.04em;
  max-width:none;
}

/* Hero outline button needs to be visible on dark overlay */
.hero .btn-outline {
  color: rgba(255,255,255,0.92);
  border-color: rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.08);
}
.hero .btn-outline:hover {
  color: #fff;
  border-color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.18);
}

@media (max-width:600px) {
  .hero h1 { font-size: clamp(2.25rem, 8vw, 3rem); }
  .hero-sub { font-size: var(--text-base); }
  .hero-actions { flex-direction:column; }
  .hero-actions .btn { width:100%; justify-content:center; }
}

/* ─── TRUST SIGNALS ──────────────────────────────────────── */
.trust-signals {
  background: var(--color-surface);
  border-top:1px solid var(--color-divider);
  border-bottom:1px solid var(--color-divider);
}
.trust-signals h2 {
  font-size: var(--text-xl);
  margin-bottom: var(--space-12);
  color: var(--color-text);
}
.trust-grid {
  display:grid;
  gap: var(--space-8);
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.trust-item {
  display:flex;
  gap: var(--space-5);
  align-items:flex-start;
}
.trust-icon {
  flex-shrink:0;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  border-radius: var(--radius-md);
  background: var(--color-primary-highlight);
  color: var(--color-primary);
}
.trust-item h3 {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight:500;
  color: var(--color-text);
  margin-bottom: var(--space-2);
}
.trust-item p { font-size: var(--text-sm); margin:0; }

/* ─── ABOUT ──────────────────────────────────────────────── */
.about { background: var(--color-bg); }
.about-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: clamp(var(--space-10), 6vw, var(--space-20));
  align-items:center;
}
.about-image {
  position:relative;
  border-radius: var(--radius-lg);
  overflow:hidden;
  box-shadow: var(--shadow-lg);
}
.about-image img {
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center top;
}
.about-image-badge {
  position:absolute;
  bottom: var(--space-5);
  left: var(--space-5);
  background: rgba(20,18,14,0.82);
  backdrop-filter: blur(10px);
  color:#fff;
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-md);
}
.about-image-badge span:first-child {
  display:block;
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight:500;
  line-height:1.2;
}
.badge-sub {
  font-size: var(--text-xs);
  color:rgba(255,255,255,0.65);
  letter-spacing:.05em;
}
.about-content h2 { margin-bottom: var(--space-6); color: var(--color-text); }
.about-content p { margin-bottom: var(--space-5); }
.about-content .btn { margin-top: var(--space-4); }

@media (max-width:760px) {
  .about-grid { grid-template-columns:1fr; }
  .about-image img { aspect-ratio:4/3; }
}

/* ─── SERVICES ───────────────────────────────────────────── */
.services { background: var(--color-surface); }
.services-header {
  max-width:660px;
  margin-bottom: clamp(var(--space-10), 5vw, var(--space-16));
}
.services-header h2 { color: var(--color-text); margin-bottom: var(--space-5); }
.services-intro { font-size: var(--text-base); }
.services-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap: var(--space-6);
}
.service-card {
  background: var(--color-bg);
  border:1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: clamp(var(--space-6), 3vw, var(--space-10));
  display:flex;
  flex-direction:column;
  gap: var(--space-4);
  transition: box-shadow var(--t), border-color var(--t), transform var(--t);
}
.service-card:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--color-primary-light);
  transform: translateY(-3px);
}
.service-card--accent {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color:#fff;
}
.service-card--accent h3 { color:#fff; }
.service-card--accent p { color:rgba(255,255,255,0.82); }
.service-card--accent .card-link { color:rgba(255,255,255,0.9); border-color:rgba(255,255,255,0.35); }
.service-card--accent .card-link:hover { color:#fff; border-color:rgba(255,255,255,0.8); }
.service-card--accent:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); }
.service-card--accent .service-card-label { color:rgba(255,255,255,0.45); }
.service-card-label {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  letter-spacing:.1em;
  font-weight:500;
}
.service-card h3 {
  font-size: var(--text-xl);
  color: var(--color-text);
  margin:0;
  line-height:1.2;
}
.service-card p { font-size: var(--text-sm); flex:1; margin:0; }
.card-link {
  display:inline-flex;
  align-items:center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  font-weight:500;
  color: var(--color-primary);
  text-decoration:none;
  padding-top: var(--space-3);
  border-top:1px solid var(--color-border);
  margin-top:auto;
}
.card-link:hover { gap: var(--space-3); }

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

/* ─── NEIGHBORHOODS ──────────────────────────────────────── */
.neighborhoods { background: var(--color-bg); }
.section-header-split {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap: var(--space-6);
  margin-bottom: var(--space-6);
}
.section-header-split h2 { color: var(--color-text); }
.view-all-btn { flex-shrink:0; }
.neighborhoods-intro {
  margin-bottom: clamp(var(--space-10), 5vw, var(--space-16));
  font-size: var(--text-base);
  max-width:72ch;
}
.neighborhoods-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap: var(--space-6);
}
.neighborhood-card {
  display:block;
  text-decoration:none;
  color: var(--color-text);
  border-radius: var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--color-border);
  transition: box-shadow var(--t), transform var(--t), border-color var(--t);
}
.neighborhood-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
  border-color: var(--color-primary-light);
}
.neighborhood-img-wrap {
  overflow:hidden;
  aspect-ratio:4/3;
}
.neighborhood-img-wrap img {
  width:100%; height:100%;
  object-fit:cover;
  transition: transform 0.5s cubic-bezier(0.16,1,0.3,1);
}
.neighborhood-card:hover .neighborhood-img-wrap img { transform: scale(1.04); }
.neighborhood-info {
  padding: var(--space-5) var(--space-6);
  background: var(--color-surface);
}
.neighborhood-info h3 {
  font-size: var(--text-lg);
  color: var(--color-text);
  margin-bottom: var(--space-2);
}
.neighborhood-info p { font-size: var(--text-sm); margin:0; }

@media (max-width:760px) {
  .neighborhoods-grid { grid-template-columns:1fr; }
  .section-header-split { flex-direction:column; align-items:flex-start; }
  .view-all-btn { align-self:flex-start; }
}

/* ─── HOLLAND HOUSE ──────────────────────────────────────── */
.holland-house {
  position:relative;
  overflow:hidden;
  color:#fff;
}
.holland-house-bg {
  position:absolute; inset:0; z-index:0;
}
.hh-bg-img {
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 30%;
}
.hh-overlay {
  position:absolute; inset:0;
  background: linear-gradient(
    105deg,
    rgba(20,36,28,0.93) 0%,
    rgba(20,36,28,0.80) 50%,
    rgba(20,36,28,0.55) 100%
  );
}
.hh-content {
  position:relative; z-index:1;
  max-width:680px;
  padding-block: clamp(var(--space-16), 10vw, var(--space-32));
}
.hh-content h2 {
  color:#fff;
  font-size: var(--text-2xl);
  margin-bottom: var(--space-6);
}
.hh-content p {
  color:rgba(255,255,255,0.8);
  font-size: var(--text-lg);
  line-height:1.7;
  margin-bottom: var(--space-8);
  max-width:58ch;
}
.hh-actions {
  display:flex;
  flex-wrap:wrap;
  gap: var(--space-4);
}

@media (max-width:600px) {
  .hh-actions { flex-direction:column; }
  .hh-actions .btn { justify-content:center; }
}

/* ─── TESTIMONIALS ───────────────────────────────────────── */
.testimonials { background: var(--color-surface); }
.testimonials h2 { color: var(--color-text); margin-bottom: clamp(var(--space-10), 5vw, var(--space-16)); }
.testimonials-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: var(--space-6);
}
.testimonial {
  background: var(--color-bg);
  border:1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: clamp(var(--space-6), 3vw, var(--space-10));
  display:flex;
  flex-direction:column;
  gap: var(--space-6);
}
.testimonial blockquote {
  position:relative;
  padding-top: var(--space-5);
}
.testimonial blockquote::before {
  content:'"';
  font-family: var(--font-display);
  font-size:3.5rem;
  line-height:1;
  color: var(--color-primary);
  position:absolute;
  top:-0.1rem; left:-0.2rem;
  font-style:normal;
}
.testimonial blockquote p {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-style:italic;
  color: var(--color-text);
  line-height:1.6;
  max-width:none;
  margin:0;
}
.testimonial figcaption {
  border-top:1px solid var(--color-divider);
  padding-top: var(--space-4);
}
.testimonial figcaption strong {
  display:block;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight:500;
  color: var(--color-text);
  margin-bottom: var(--space-1);
}
.testimonial figcaption span {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  letter-spacing:.04em;
}

@media (max-width:660px) {
  .testimonials-grid { grid-template-columns:1fr; }
}

/* ─── CONTACT ────────────────────────────────────────────── */
.contact { background: var(--color-bg); }
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap: clamp(var(--space-10), 6vw, var(--space-20));
  align-items:start;
}
.contact-intro h2 { color: var(--color-text); margin-bottom: var(--space-5); }
.contact-intro p { margin-bottom: var(--space-8); }
.contact-details {
  list-style:none;
  display:flex;
  flex-direction:column;
  gap: var(--space-4);
}
.contact-details li {
  display:flex;
  align-items:center;
  gap: var(--space-3);
  font-size: var(--text-sm);
  color: var(--color-text);
}
.contact-details svg { color: var(--color-primary); flex-shrink:0; }
.contact-details a { color: var(--color-text); text-decoration:none; }
.contact-details a:hover { color: var(--color-primary); }

/* Form */
.contact-form {
  background: var(--color-surface);
  border:1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: clamp(var(--space-6), 4vw, var(--space-10));
  display:flex;
  flex-direction:column;
  gap: var(--space-5);
}
.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: var(--space-5);
}
.form-group {
  display:flex;
  flex-direction:column;
  gap: var(--space-2);
}
.form-group label {
  font-size: var(--text-xs);
  font-weight:500;
  letter-spacing:.05em;
  color: var(--color-text);
  text-transform:uppercase;
}
.optional { font-weight:400; text-transform:none; color: var(--color-text-muted); letter-spacing:0; }
.form-group input,
.form-group textarea,
.form-group select {
  background: var(--color-bg);
  border:1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 0.65rem var(--space-4);
  font-size: var(--text-base);
  color: var(--color-text);
  width:100%;
  outline:none;
  -webkit-appearance:none;
  appearance:none;
}
.form-group select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B6760' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position: right var(--space-4) center;
  padding-right: var(--space-10);
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--color-primary), transparent 82%);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: var(--color-text-faint); }
.form-group textarea { resize:vertical; min-height:120px; }
.form-disclosure {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  line-height:1.5;
  text-align:center;
  max-width:none;
}

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

/* ─── FOOTER ─────────────────────────────────────────────── */
.site-footer {
  background: var(--color-surface);
  border-top:1px solid var(--color-divider);
}
.footer-inner {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap: var(--space-10);
  padding-block: var(--space-10);
  flex-wrap:wrap;
}
.footer-brand { display:flex; flex-direction:column; gap: var(--space-3); }
.footer-tagline {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  letter-spacing:.05em;
  max-width:none;
}
.footer-nav ul {
  display:flex;
  flex-wrap:wrap;
  gap: var(--space-3) var(--space-6);
  list-style:none;
}
.footer-nav a {
  font-size: var(--text-sm);
  color: var(--color-text-muted);
  text-decoration:none;
}
.footer-nav a:hover { color: var(--color-primary); }
.footer-bottom {
  border-top:1px solid var(--color-divider);
  padding-block: var(--space-5);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap: var(--space-3);
}
.footer-bottom p {
  font-size: var(--text-xs);
  color: var(--color-text-faint);
  max-width:none;
  margin:0;
}
.footer-disclosure { text-align:right; }