:root {
  --color-background: #f8f8f5;
  --color-surface: #ffffff;
  --color-surface-warm: #f1f1ed;
  --color-surface-stone: #e8e8e3;
  --color-text: #1e1d1b;
  --color-muted: #666159;
  --color-border: #d6d6d0;
  --color-accent: #ed1c24;
  --color-accent-dark: #b8161b;
  --color-charcoal: #222220;
  --color-charcoal-soft: #2d2c29;

  --font-serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  --shadow-soft: 0 22px 55px rgba(33, 28, 22, 0.09);
  --radius-small: 3px;
  --header-height: 86px;
  --body-copy-size: 1rem;
  --body-copy-leading: 1.68;
  --paragraph-gap: 1.1rem;
  --container-wide: min(92vw, 1360px);
  --container-narrow: min(82vw, 880px);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--color-background);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img {
  display: block;
  width: 100%;
  max-width: 100%;
}

a { color: inherit; }

a:focus-visible,
button:focus-visible {
  outline: 3px solid rgba(237, 28, 36, 0.45);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 9999;
  transform: translateY(-150%);
  padding: 0.75rem 1rem;
  background: var(--color-charcoal);
  color: #fff;
  text-decoration: none;
}

.skip-link:focus { transform: translateY(0); }

.container-wide { width: var(--container-wide); margin-inline: auto; }
.container-narrow { width: var(--container-narrow); margin-inline: auto; }
.section-shell { position: relative; overflow: clip; }
.surface-warm { background: var(--color-surface-warm); }
.surface-stone { background: var(--color-surface-stone); }
.surface-dark { background: var(--color-charcoal); color: #fff; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  min-height: var(--header-height);
  background: rgba(250, 250, 248, 0.97);
  border-bottom: 1px solid rgba(60, 54, 46, 0.1);
  backdrop-filter: blur(14px);
  transition: box-shadow 180ms ease, background-color 180ms ease;
}

.site-header.is-scrolled { box-shadow: 0 8px 30px rgba(30, 29, 27, 0.08); }

.header-inner {
  min-height: var(--header-height);
  display: grid;
  grid-template-columns: minmax(300px, 1fr) auto minmax(290px, 1fr);
  align-items: center;
  gap: 2rem;
}

.brand { text-decoration: none; display: inline-flex; align-items: center; width: fit-content; }
.brand-logo { max-width: min(295px, 100%); }
.brand-logo-image { display: block; width: 100%; height: auto; max-height: 64px; object-fit: contain; object-position: left center; }

.desktop-nav { display: flex; align-items: center; gap: clamp(1.2rem, 2.4vw, 2.4rem); }
.desktop-nav a {
  position: relative;
  text-decoration: none;
  font-size: 0.92rem;
  font-weight: 520;
  padding-block: 0.65rem;
}
.desktop-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 0.25rem;
  height: 2px;
  background: var(--color-accent);
  transition: right 160ms ease;
}
.desktop-nav a:hover::after,
.desktop-nav a[aria-current="page"]::after { right: 0; }

.header-contact { justify-self: end; display: flex; align-items: center; gap: 1rem; }
.phone-link { display: inline-flex; align-items: center; gap: 0.55rem; color: var(--color-accent-dark); text-decoration: none; font-size: 0.92rem; font-weight: 650; }

.button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 48px;
  padding: 0.8rem 1.3rem;
  border: 1px solid transparent;
  border-radius: var(--radius-small);
  font-size: 0.92rem;
  font-weight: 650;
  text-decoration: none;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}
.button:hover { transform: translateY(-1px); }
.button-small { min-height: 42px; padding: 0.7rem 1.05rem; }
.button-primary { background: var(--color-accent-dark); color: #fff; border-color: var(--color-accent-dark); }
.button-primary:hover { background: #961116; border-color: #961116; }
.button-secondary { background: transparent; color: var(--color-text); border-color: #b8afa5; }
.button-secondary:hover { border-color: var(--color-text); background: rgba(255,255,255,.45); }

.menu-toggle {
  display: none;
  justify-self: end;
  width: 46px;
  height: 46px;
  border: 0;
  background: transparent;
  padding: 10px;
  cursor: pointer;
}
.menu-toggle span { display: block; height: 2px; background: var(--color-text); margin: 5px 0; transition: transform 180ms ease, opacity 180ms ease; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-menu { background: var(--color-background); border-top: 1px solid var(--color-border); }
.mobile-menu-inner { width: var(--container-wide); margin: 0 auto; padding: 1.2rem 0 1.6rem; display: grid; gap: 0.35rem; }
.mobile-menu a { padding: 0.75rem 0; text-decoration: none; font-size: 1.08rem; border-bottom: 1px solid rgba(70,64,56,.08); }
.mobile-menu .mobile-call { margin-top: 0.65rem; color: var(--color-accent-dark); font-weight: 700; border-bottom: 0; }

.hero { background: linear-gradient(90deg, #fafaf8 0%, #fafaf8 50%, #f0f0ec 50%, #f0f0ec 100%); }
.hero-grid { min-height: min(700px, calc(100vh - var(--header-height))); display: grid; grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr); }
.hero-copy { align-self: center; padding: clamp(3.4rem, 6vw, 5.8rem) clamp(2.2rem, 5vw, 4.8rem) clamp(3.2rem, 5.5vw, 5.2rem) 0; }
.eyebrow { margin: 0 0 1rem; color: var(--color-accent-dark); font-size: 0.76rem; font-weight: 760; letter-spacing: 0.14em; text-transform: uppercase; }
.eyebrow-light { color: #f7b3b6; }
.hero h1,
.section-copy h2,
.perspective h2,
.story-copy h2,
.breadth h2,
.brokerage h2,
.contact-band h2 {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.05;
}
.hero h1 { max-width: 660px; margin: 0; font-size: clamp(2.6rem, 3.2vw, 3.6rem); line-height: 1.05; }
.hero-lead { max-width: 640px; margin: 1.6rem 0 0; color: #48443f; font-size: clamp(0.98rem, 0.98vw, 1.08rem); line-height: 1.72; }
.hero-actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin-top: 2rem; }
.hero-identity { display: flex; flex-direction: column; gap: 0.15rem; margin-top: 2.6rem; color: var(--color-muted); font-size: 0.9rem; }
.hero-media { position: relative; margin: 0; min-height: 580px; overflow: hidden; background: #e7e7e2; }
.hero-media img { height: 100%; object-fit: cover; object-position: 50% 34%; }
.hero-media figcaption { position: absolute; left: 1rem; bottom: 1rem; max-width: 340px; padding: 0.55rem 0.7rem; background: rgba(20,20,18,.64); color: rgba(255,255,255,.92); font-size: 0.7rem; line-height: 1.35; }

.editorial-split { padding: clamp(4.5rem, 8vw, 8.5rem) 0; }
.split-grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(3rem, 7vw, 8rem); align-items: center; }
.split-grid-image-first { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); }
.section-copy { max-width: 600px; }
.section-copy h2,
.perspective h2,
.story-copy h2,
.breadth h2,
.brokerage h2,
.contact-band h2 { margin: 0 0 1.5rem; font-size: clamp(1.95rem, 2.75vw, 3.15rem); }
.section-copy p,
.story-copy p,
.breadth-heading p,
.brokerage-copy p,
.contact-copy p,
.perspective p:not(.eyebrow) {
  margin: 0;
  color: #4d4842;
  font-family: var(--font-sans);
  font-size: var(--body-copy-size);
  line-height: var(--body-copy-leading);
}

.section-copy p + p,
.story-copy p + p,
.breadth-heading p + p,
.brokerage-copy p + p,
.contact-copy p + p,
.perspective p:not(.eyebrow) + p:not(.eyebrow) {
  margin-top: var(--paragraph-gap);
}
.section-media { margin: 0; min-height: 520px; overflow: hidden; box-shadow: var(--shadow-soft); border-radius: 2px; }
.section-media img { height: 100%; min-height: 520px; object-fit: cover; object-position: center; }

.perspective { padding: clamp(5rem, 9vw, 9rem) 0; background: #ffffff; }
.perspective-rule { width: 76px; height: 3px; margin-bottom: 2.2rem; background: var(--color-accent); }
.perspective h2 { max-width: 860px; }
.perspective .large-copy {
  max-width: 760px;
  color: #4d4842;
  font-family: var(--font-sans);
  font-size: var(--body-copy-size);
  line-height: var(--body-copy-leading);
}
.perspective p:not(.eyebrow):not(.large-copy) { max-width: 760px; color: #4d4842; }

.story-band { padding: clamp(4rem, 7vw, 7rem) 0; }
.story-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(3rem, 7vw, 8rem); align-items: center; }
.story-media { margin: 0; overflow: hidden; min-height: 520px; background: #111; }
.story-media img { min-height: 520px; height: 100%; object-fit: cover; object-position: 50% 42%; filter: saturate(.9) contrast(1.01); }
.story-copy { max-width: 580px; }
.story-copy h2 { color: #fff; }
.story-copy p { color: rgba(255,255,255,.76); }

.breadth { padding: clamp(5rem, 8vw, 8rem) 0; background: #ffffff; }
.breadth-heading { max-width: 850px; }
.experience-list { margin-top: clamp(3rem, 5vw, 5rem); display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: clamp(1.2rem, 2.3vw, 2.6rem); }
.experience-item { padding-top: 0.5rem; }
.experience-rule { display: block; width: 38px; height: 2px; background: var(--color-accent); margin-bottom: 1.15rem; }
.experience-item h3 { margin: 0 0 0.7rem; font-family: var(--font-serif); font-weight: 400; font-size: clamp(1.25rem, 1.6vw, 1.65rem); }
.experience-item p { margin: 0; color: var(--color-muted); font-size: 0.92rem; }
.text-link { display: inline-flex; margin-top: 2.8rem; gap: 0.5rem; color: var(--color-accent-dark); text-decoration: none; font-weight: 700; }
.text-link:hover { text-decoration: underline; text-underline-offset: 0.25rem; }

.brokerage { padding: clamp(4rem, 7vw, 6.5rem) 0; }
.brokerage-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr); gap: 4rem; align-items: center; }
.brokerage-copy { max-width: 720px; }
.brokerage-logo-wrap { justify-self: end; width: min(100%, 300px); padding: 1rem 0; }
.brokerage-logo-wrap img { width: 100%; height: auto; object-fit: contain; }

.contact-band { padding: clamp(5rem, 9vw, 8rem) 0; background: #fff; border-top: 1px solid var(--color-border); }
.contact-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(3rem, 7vw, 8rem); align-items: end; }
.contact-band h2 { max-width: 720px; margin-bottom: 0; }
.contact-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.8rem; }

.site-footer { background: var(--color-charcoal-soft); color: #fff; padding: clamp(3.2rem, 6vw, 5rem) 0 1.5rem; }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(220px, .8fr); gap: 3rem; align-items: start; }
.footer-brand { display: inline-flex; width: min(100%, 360px); margin-bottom: 1rem; }
.footer-brand-image { width: 100%; height: auto; object-fit: contain; filter: brightness(0) invert(1); opacity: 0.96; max-height: 52px; object-position: left center; }
.footer-identity p { color: rgba(255,255,255,.72); font-size: 0.9rem; }
.footer-identity a { color: #fff; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: 0.2rem; }
.footer-nav { display: grid; gap: 0.45rem; }
.footer-label { color: rgba(255,255,255,.45); text-transform: uppercase; font-size: 0.68rem; letter-spacing: .14em; margin-bottom: .35rem; }
.footer-nav a { color: rgba(255,255,255,.8); text-decoration: none; font-size: .9rem; }
.footer-nav a:hover { color: #fff; }
.footer-bottom { margin-top: 3rem; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.14); display: flex; justify-content: space-between; gap: 2rem; color: rgba(255,255,255,.55); font-size: .72rem; }
.development-note { text-align: right; }

.motion-ready .reveal { opacity: 0; transform: translateY(20px); transition: opacity 650ms ease, transform 650ms ease; }
.motion-ready .reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1150px) {
  .header-inner { grid-template-columns: 1fr auto; }
  .desktop-nav, .header-contact { display: none; }
  .menu-toggle { display: block; }
  .hero-grid { grid-template-columns: 1fr 1fr; }
  .hero h1 { font-size: clamp(2.65rem, 5.1vw, 3.8rem); }
  .experience-list { grid-template-columns: repeat(3, minmax(0,1fr)); row-gap: 2.5rem; }
}

@media (max-width: 900px) {
  :root { --header-height: 74px; --container-wide: min(90vw, 820px); --container-narrow: min(86vw, 720px); }
  .hero { background: var(--color-background); }
  .hero-grid { width: 100%; grid-template-columns: 1fr; min-height: 0; }
  .hero-copy { width: var(--container-wide); margin-inline: auto; padding: 4.4rem 0 3.4rem; }
  .hero h1 { max-width: 760px; font-size: clamp(2.8rem, 7vw, 4rem); }
  .hero-media { min-height: 560px; }
  .hero-media img { min-height: 560px; object-position: 48% 38%; }

  .split-grid,
  .split-grid-image-first,
  .story-grid,
  .brokerage-grid,
  .contact-grid { grid-template-columns: 1fr; }
  .split-grid-image-first .section-media { order: 2; }
  .split-grid-image-first .section-copy { order: 1; }
  .section-copy { max-width: 720px; }
  .section-media, .section-media img, .story-media, .story-media img { min-height: 480px; }
  .story-copy { max-width: 720px; }
  .brokerage-logo-wrap { justify-self: start; width: min(100%, 340px); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 680px) {
  :root {
    --container-wide: min(88vw, 600px);
    --container-narrow: min(88vw, 600px);
    --body-copy-size: 1rem;
    --body-copy-leading: 1.62;
    --paragraph-gap: 1rem;
  }
  body { font-size: 16px; }
  .brand-logo { max-width: 235px; }
  .brand-logo-image { max-height: 44px; }
  .hero-copy { padding: 3.5rem 0 2.6rem; }
  .hero h1 { font-size: clamp(2.65rem, 11vw, 3.85rem); }
  .hero-lead { font-size: 1.02rem; }
  .hero-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .hero-actions .button { width: 100%; }
  .hero-media, .hero-media img { min-height: 440px; }
  .hero-media figcaption { display: none; }

  .editorial-split,
  .perspective,
  .story-band,
  .breadth,
  .brokerage,
  .contact-band { padding-top: 4.2rem; padding-bottom: 4.2rem; }
  .split-grid, .story-grid { gap: 2.35rem; }
  .section-copy h2,
  .perspective h2,
  .story-copy h2,
  .breadth h2,
  .brokerage h2,
  .contact-band h2 { font-size: clamp(2.2rem, 9vw, 3.2rem); }
  .section-media, .section-media img, .story-media, .story-media img { min-height: 360px; }
  /* Narrative paragraphs share one mobile type and rhythm system. */
  .section-copy p,
  .story-copy p,
  .breadth-heading p,
  .brokerage-copy p,
  .contact-copy p,
  .perspective p:not(.eyebrow),
  .perspective .large-copy {
    font-size: var(--body-copy-size);
    line-height: var(--body-copy-leading);
  }

  .experience-list { grid-template-columns: 1fr 1fr; gap: 2rem 1.4rem; }
  .experience-item:last-child { grid-column: 1 / -1; max-width: 280px; }
  .contact-actions { display: grid; grid-template-columns: 1fr; }
  .contact-actions .button { width: 100%; }

  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: .8rem; }
  .development-note { text-align: left; }
}

@media (max-width: 430px) {
  .brand-logo { max-width: 215px; }
  .brand-logo-image { max-height: 38px; }
  .hero-actions { grid-template-columns: 1fr; }
  .experience-list { grid-template-columns: 1fr; }
  .experience-item:last-child { grid-column: auto; max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.001ms !important; animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; }
  .motion-ready .reveal { opacity: 1; transform: none; }
}


/* About page */
.about-hero { background: #ffffff; }
.about-hero-grid {
  min-height: min(720px, calc(100vh - var(--header-height)));
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(420px, .96fr);
  align-items: stretch;
}
.about-hero-copy {
  align-self: center;
  max-width: 760px;
  padding: clamp(5rem, 9vw, 9rem) clamp(2.5rem, 6vw, 6rem) clamp(5rem, 8vw, 8rem) 0;
}
.about-hero h1,
.about-copy h2,
.about-room h2,
.about-career h2,
.about-philosophy h2,
.testimonials h2 {
  margin: 0 0 1.5rem;
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.035em;
  font-size: clamp(1.95rem, 3.05vw, 3.6rem);
  line-height: 1;
}
.about-hero-copy > p:not(.eyebrow),
.about-copy p,
.about-room-copy p,
.about-career p:not(.eyebrow),
.about-philosophy p:not(.eyebrow),
.testimonials-intro p:not(.eyebrow) {
  margin: 0;
  color: #4d4842;
  font-family: var(--font-sans);
  font-size: var(--body-copy-size);
  line-height: var(--body-copy-leading);
}
.about-hero-copy > p:not(.eyebrow) { max-width: 690px; }
.about-copy p + p,
.about-room-copy p + p,
.about-career p:not(.eyebrow) + p:not(.eyebrow),
.about-philosophy p:not(.eyebrow) + p:not(.eyebrow) { margin-top: var(--paragraph-gap); }

.about-hero-media { margin: 0; min-height: 640px; overflow: hidden; background: var(--color-surface-stone); }
.about-hero-media img { height: 100%; min-height: 640px; object-fit: cover; object-position: 50% 31%; }

.about-split { padding: clamp(5rem, 8vw, 8rem) 0; }
.about-split-grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: clamp(3.5rem, 7vw, 8rem); align-items: center; }
.about-split-grid-reverse { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.about-copy { max-width: 650px; }
.about-copy h2 { font-size: clamp(2.25rem, 3.6vw, 4.15rem); line-height: 1.01; }
.about-section-media { margin: 0; min-height: 540px; overflow: hidden; box-shadow: var(--shadow-soft); border-radius: 2px; }
.about-section-media img { height: 100%; min-height: 540px; object-fit: cover; object-position: center; }

.about-room { padding: clamp(4.5rem, 7.5vw, 7.5rem) 0; }
.about-room-grid { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: clamp(3.5rem, 7vw, 8rem); align-items: center; }
.about-room-copy { max-width: 690px; }
.about-room h2 { color: #fff; font-size: clamp(2.35rem, 3.9vw, 4.35rem); }
.about-room-copy p { color: rgba(255,255,255,.76); }
.about-room-media { margin: 0; min-height: 520px; overflow: hidden; }
.about-room-media img { height: 100%; min-height: 520px; object-fit: cover; object-position: 50% 35%; filter: saturate(.92) contrast(1.01); }

.about-career { padding: clamp(5.5rem, 9vw, 9rem) 0; background: #ffffff; }
.about-career h2 { max-width: 880px; font-size: clamp(2.4rem, 4.1vw, 4.7rem); }
.about-career p:not(.eyebrow) { max-width: 780px; }
.about-facts { margin: clamp(3rem, 5vw, 4.5rem) 0 0; padding: 1.4rem 0 0; border-top: 1px solid var(--color-border); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(1.2rem,3vw,2.4rem); }
.about-facts > div { display:block; padding:.35rem 0; }
.about-facts dt { color: var(--color-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .11em; font-weight: 720; }
.about-facts dd { margin:.6rem 0 0; font-family:var(--font-serif); font-size:1.12rem; line-height:1.35; }

.about-philosophy { padding: clamp(5.5rem, 9vw, 9rem) 0; background: #ffffff; }
.about-philosophy h2 { max-width: 900px; font-size: clamp(2.4rem, 4.1vw, 4.75rem); }
.about-philosophy p:not(.eyebrow) { max-width: 780px; }

.testimonials { padding: clamp(5rem, 8.5vw, 8.5rem) 0; }
.testimonials-grid { display: grid; grid-template-columns: minmax(250px, .66fr) minmax(0, 1.34fr); gap: clamp(3.5rem, 8vw, 8rem); align-items: start; }
.testimonials-intro { max-width: 460px; }
.testimonials h2 { font-size: clamp(2.3rem, 3.7vw, 4.1rem); }
.testimonial-carousel { min-width: 0; }
.testimonial-stage { min-height: 330px; display:grid; align-items:center; padding: clamp(1.6rem, 3.5vw, 3rem) 0 clamp(1.6rem, 3.5vw, 3rem) clamp(1.5rem, 3vw, 2.4rem); background: transparent; border-left: 3px solid var(--color-accent-dark); box-shadow: none; }
.testimonial { margin: 0; }
.testimonial blockquote { margin: 0; font-family: var(--font-serif); font-weight: 400; letter-spacing: -0.02em; line-height: 1.34; font-size: clamp(1.55rem, 2.15vw, 2.55rem); color: var(--color-text); }
.testimonial-author { margin: 1.8rem 0 0; color: var(--color-muted); font-size: .95rem; font-weight: 650; }
.testimonial-controls { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1.1rem; }
.testimonial-arrows { display: flex; gap: .55rem; }
.testimonial-arrow { width: 42px; height: 42px; border: 1px solid #b8afa5; border-radius: 50%; background: transparent; color: var(--color-text); font-size: 1.25rem; cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease; }
.testimonial-arrow:hover { border-color: var(--color-text); background: rgba(255,255,255,.55); }
.testimonial-dots { display: flex; gap: .55rem; align-items: center; }
.testimonial-dot { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #aaa198; cursor: pointer; }
.testimonial-dot.is-active { background: var(--color-accent-dark); transform: scale(1.18); }

@media (max-width: 900px) {
  .about-hero-grid,
  .about-split-grid,
  .about-split-grid-reverse,
  .about-room-grid,
  .testimonials-grid { grid-template-columns: 1fr; }
  .about-hero-grid { width: 100%; min-height: 0; }
  .about-hero-copy { width: var(--container-wide); margin-inline: auto; padding: 4.8rem 0 3.6rem; }
  .about-hero-media { min-height: 580px; }
  .about-hero-media img { min-height: 580px; object-position: 50% 31%; }
  .about-split-grid-reverse .about-copy { order: 1; }
  .about-split-grid-reverse .about-section-media { order: 2; }
  .about-copy, .about-room-copy { max-width: 720px; }
  .about-section-media, .about-section-media img, .about-room-media, .about-room-media img { min-height: 480px; }
  .testimonials-intro { max-width: 680px; }
  .testimonial-stage { min-height: 330px; }
}

@media (max-width: 680px) {
  .about-hero-copy { padding: 3.7rem 0 2.8rem; }
  .about-hero h1,
  .about-copy h2,
  .about-room h2,
  .about-career h2,
  .about-philosophy h2,
  .testimonials h2 { font-size: clamp(2.45rem, 10vw, 3.55rem); line-height: 1.02; }
  .about-hero-copy > p:not(.eyebrow),
  .about-copy p,
  .about-room-copy p,
  .about-career p:not(.eyebrow),
  .about-philosophy p:not(.eyebrow),
  .testimonials-intro p:not(.eyebrow) { font-size: var(--body-copy-size); line-height: var(--body-copy-leading); }
  .about-hero-media, .about-hero-media img { min-height: 430px; }
  .about-split, .about-room, .about-career, .about-philosophy, .testimonials { padding-top: 4.2rem; padding-bottom: 4.2rem; }
  .about-split-grid, .about-room-grid { gap: 2.4rem; }
  .about-section-media, .about-section-media img, .about-room-media, .about-room-media img { min-height: 360px; }
  .about-facts { grid-template-columns: 1fr 1fr; gap:1.5rem 1.1rem; }
  .about-facts > div { padding:.25rem 0; }
  .about-facts dd { font-size: 1.05rem; }
  .testimonials-grid { gap: 2.6rem; }
  .testimonial-stage { min-height: 0; padding: 2rem 1.5rem; }
  .testimonial blockquote { font-size: clamp(1.5rem, 6.6vw, 2rem); line-height: 1.38; }
  .testimonial-controls { margin-top: .9rem; }
}



/* ---------- Services page ---------- */
.page-hero {
  padding: clamp(4.5rem, 8vw, 8rem) 0 clamp(3.5rem, 6vw, 6rem);
  background: #ffffff;
  border-bottom: 1px solid var(--color-border);
}
.page-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(280px, .88fr);
  gap: clamp(2.5rem, 6vw, 7rem);
  align-items: end;
}
.page-hero h1,
.service-action h2,
.property-intro h2,
.contact-page-hero h1,
.contact-panel h2,
.contact-form-wrap h2 {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.05;
}
.page-hero h1,
.contact-page-hero h1 { margin: 0; font-size: clamp(2.25rem, 3.35vw, 3.7rem); }
.page-hero-lead { margin: 1.5rem 0 0; max-width: 760px; color: #4d4842; font-size: clamp(1.05rem,1.2vw,1.2rem); line-height: 1.72; }
.page-hero-side { padding-bottom: .35rem; color: var(--color-muted); max-width: 420px; }
.page-hero-side strong { color: var(--color-text); font-weight: 650; }

.service-actions { padding: clamp(5rem, 9vw, 9rem) 0; }
.service-actions-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--color-border); border:1px solid var(--color-border); }
.service-action { background:#fff; padding:clamp(2.7rem,5vw,5rem); }
.service-action:first-child { background:var(--color-surface-warm); }
.service-action .eyebrow { margin-bottom: 1.2rem; }
.service-action h2 { margin:0 0 1.5rem; font-size:clamp(2.35rem,3.8vw,4.5rem); }
.service-action p { margin:0; color:#4d4842; font-size:var(--body-copy-size); line-height:var(--body-copy-leading); }
.service-action p + p { margin-top:var(--paragraph-gap); }

.property-experience { padding:clamp(5rem,9vw,9rem) 0; background:#ffffff; }
.property-intro { max-width:900px; }
.property-intro h2 { margin:0 0 1.4rem; font-size:clamp(2.4rem,4vw,4.8rem); }
.property-intro p { margin:0; color:#4d4842; font-size:var(--body-copy-size); line-height:var(--body-copy-leading); }
.property-layout { margin-top:clamp(3.3rem,6vw,6rem); display:grid; grid-template-columns:minmax(260px,.78fr) minmax(0,1.22fr); gap:clamp(3rem,6vw,7rem); align-items:start; }
.property-visual { position:sticky; top:calc(var(--header-height) + 2rem); margin:0; min-height:580px; overflow:hidden; background:#e5e5e0; box-shadow:var(--shadow-soft); }
.property-visual img { width:100%; height:100%; min-height:580px; object-fit:cover; object-position:center; }
.property-list { border-top:1px solid var(--color-border); }
.property-row { display:grid; grid-template-columns:minmax(160px,.34fr) minmax(0,.66fr); gap:2rem; padding:2rem 0; border-bottom:1px solid var(--color-border); }
.property-row h3 { margin:0; font-family:var(--font-serif); font-weight:400; font-size:clamp(1.45rem,2vw,2rem); }
.property-row p { margin:0; color:var(--color-muted); font-size:1rem; line-height:1.7; }

.service-area-band { padding:clamp(4.5rem,8vw,7rem) 0; background:linear-gradient(135deg, var(--color-charcoal) 0%, #2b2926 100%); color:#fff; }
.service-area-grid { display:grid; grid-template-columns:1fr .75fr; gap:clamp(3rem,7vw,8rem); align-items:end; }
.service-area-band h2 { margin:0; max-width:780px; font-family:var(--font-serif); font-weight:400; letter-spacing:-.03em; line-height:1.06; font-size:clamp(2.2rem,3.3vw,4rem); }
.service-area-copy p { margin:0; color:rgba(255,255,255,.75); font-size:var(--body-copy-size); line-height:var(--body-copy-leading); }
.service-area-copy .button { margin-top:1.7rem; }

/* ---------- Contact page ---------- */
.contact-page-hero { padding:clamp(4.5rem,8vw,8rem) 0; background:#ffffff; }
.contact-page-hero-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); gap:clamp(3rem,7vw,8rem); align-items:center; }
.contact-page-hero p.contact-intro { margin:1.7rem 0 0; max-width:720px; color:#4d4842; font-size:clamp(1.05rem,1.2vw,1.2rem); line-height:1.72; }
.contact-portrait { margin:0; min-height:460px; max-height:620px; overflow:hidden; background:#e5e5e0; box-shadow:var(--shadow-soft); }
.contact-portrait img { width:100%; height:100%; min-height:460px; object-fit:cover; object-position:center 34%; }
.contact-details { padding:clamp(5rem,8vw,8rem) 0; background:var(--color-surface-warm); }
.contact-details-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(3rem,7vw,8rem); align-items:start; }
.contact-panel { background: var(--color-surface-stone); padding: clamp(2rem,4vw,3rem); border-top: 3px solid var(--color-accent-dark); box-shadow: var(--shadow-soft); }
.contact-panel h2,
.contact-form-wrap h2 { margin:0 0 1.4rem; font-size:clamp(2rem,3vw,3.55rem); }
.contact-panel p { margin:0; color:#4d4842; font-size:var(--body-copy-size); line-height:var(--body-copy-leading); }
.contact-panel p + p { margin-top:var(--paragraph-gap); }
.contact-methods { margin:2.2rem 0 0; padding:0; list-style:none; border-top:1px solid var(--color-border); }
.contact-methods li { padding:1.35rem 0; border-bottom:1px solid var(--color-border); }
.contact-methods span { display:block; margin-bottom:.25rem; color:var(--color-muted); font-size:.72rem; font-weight:750; letter-spacing:.13em; text-transform:uppercase; }
.contact-methods a { font-family:var(--font-serif); font-size:clamp(1.35rem,2.1vw,2rem); text-decoration:none; }
.contact-methods a:hover { text-decoration:underline; text-underline-offset:.25rem; }
.contact-form-wrap { background:#fff; padding:clamp(2rem,4vw,4rem); box-shadow:var(--shadow-soft); border-top: 3px solid rgba(237,28,36,.12); }
.contact-form { display:grid; gap:1.2rem; }
.form-field { display:grid; gap:.45rem; }
.form-field label { font-size:.82rem; font-weight:700; color:#514c46; }
.form-field input,
.form-field textarea {
  width:100%; border:1px solid #cfc7bd; background:#fff; color:var(--color-text); border-radius:2px;
  padding:.9rem 1rem; font:inherit; line-height:1.4;
}
.form-field textarea { min-height:180px; resize:vertical; }
.form-field input:focus,
.form-field textarea:focus { outline:3px solid rgba(237,28,36,.16); border-color:var(--color-accent-dark); }
.form-note { margin:.3rem 0 0; color:var(--color-muted); font-size:.88rem; line-height:1.55; }
.contact-form .button { justify-self:start; margin-top:.3rem; }
.contact-brokerage { padding:clamp(4rem,7vw,6rem) 0; background:#ffffff; }
.contact-brokerage-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(220px,.55fr); gap:3rem; align-items:center; }
.contact-brokerage-logo { width:min(100%,220px); justify-self:end; }
.contact-brokerage-logo img { display:block; width:100%; height:auto; max-height:72px; object-fit:contain; object-position:center; }
.contact-brokerage p { color:var(--color-muted); }

@media (max-width: 980px) {
  .page-hero-grid,
  .contact-page-hero-grid,
  .contact-details-grid,
  .contact-brokerage-grid { grid-template-columns:1fr; }
  .page-hero-side { max-width:720px; }
  .service-actions-grid { grid-template-columns:1fr; }
  .property-layout { grid-template-columns:1fr; }
  .property-visual { position:relative; top:auto; min-height:440px; }
  .property-visual img { min-height:440px; }
  .service-area-grid { grid-template-columns:1fr; }
  .contact-portrait { max-height:520px; }
  .contact-brokerage-logo { justify-self:start; width:min(100%,320px); }
}

@media (max-width: 700px) {
  .page-hero,
  .contact-page-hero { padding:3.25rem 0 3rem; }
  .page-hero h1,
  .contact-page-hero h1 { font-size:clamp(2.65rem,12.5vw,4rem); }
  .service-actions,
  .property-experience,
  .contact-details { padding:4rem 0; }
  .service-action { padding:2.35rem 1.25rem; }
  .service-actions-grid { border-left:0; border-right:0; }
  .property-layout { margin-top:2.8rem; gap:2.6rem; }
  .property-visual,
  .property-visual img { min-height:360px; }
  .property-row { grid-template-columns:1fr; gap:.65rem; padding:1.55rem 0; }
  .service-area-band { padding:4rem 0; }
  .contact-portrait,
  .contact-portrait img { min-height:390px; }
  .contact-details-grid { gap:3rem; }
  .contact-form-wrap { padding:1.5rem; }
  .contact-methods a { font-size:1.35rem; }
  .contact-brokerage-grid { gap:2.4rem; }
}

/* ---------- Staging hardening additions ---------- */
.honeypot-field {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.thanks-page {
  min-height: calc(100vh - var(--header-height));
  display: grid;
  align-items: center;
  padding: clamp(5rem, 10vw, 9rem) 0;
  background: #ffffff;
}
.thanks-page-inner h1 {
  margin: 0;
  max-width: 820px;
  font-family: var(--font-serif);
  font-size: clamp(2.7rem, 4.4vw, 4.9rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.04;
}
.thanks-lead {
  max-width: 700px;
  margin: 1.6rem 0 0;
  color: #4d4842;
  font-size: var(--body-copy-size);
  line-height: var(--body-copy-leading);
}


input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(237, 28, 36, 0.24);
  outline-offset: 2px;
}

@media (max-width: 680px) {
  .thanks-page { padding: 4.5rem 0; }
  .thanks-page-inner h1 { font-size: clamp(2.65rem, 12vw, 4rem); }
}


/* Services page social-inspired visual system — v1.3 preview */
.services-showcase-hero { background: #ffffff; border-bottom: 1px solid var(--color-border); }
.services-showcase-grid { min-height: min(650px, calc(100vh - var(--header-height))); display:grid; grid-template-columns:minmax(0,.92fr) minmax(440px,1.08fr); align-items:stretch; }
.services-showcase-copy { align-self:center; max-width:690px; padding:clamp(4.5rem,7vw,7rem) clamp(2.5rem,5vw,5rem) clamp(4.5rem,7vw,7rem) 0; }
.services-showcase-copy h1 { margin:0; font-family:var(--font-serif); font-size:clamp(3rem,4.4vw,4.9rem); line-height:.98; font-weight:400; letter-spacing:-.04em; }
.services-showcase-lead { margin:1.55rem 0 0; max-width:650px; color:#514b45; font-size:clamp(1.04rem,1.2vw,1.18rem); line-height:1.65; }
.services-showcase-note { margin:1.15rem 0 0; max-width:620px; color:var(--color-muted); font-size:.98rem; line-height:1.65; }
.services-showcase-photo { margin:0; min-height:560px; overflow:hidden; background:#e8e8e3; }
.services-showcase-photo img { width:100%; height:100%; min-height:560px; object-fit:cover; object-position:50% 30%; }

.service-type-showcase { padding:clamp(4.8rem,8vw,8rem) 0; background:#fff; }
.service-type-heading { max-width:780px; }
.service-type-heading h2, .significant-residential h2, .service-actions-intro h2 { margin:0 0 1rem; font-family:var(--font-serif); font-weight:400; letter-spacing:-.035em; line-height:1.03; font-size:clamp(2.1rem,3.2vw,3.6rem); }
.service-type-heading > p:not(.eyebrow), .significant-residential p, .service-actions-intro { color:#514b45; }
.service-type-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin-top:clamp(2.5rem,4vw,4rem); }
.service-type-card { background:#ffffff; border:1px solid var(--color-border); box-shadow:0 14px 34px rgba(33,28,22,.06); overflow:hidden; transition: transform 180ms ease, box-shadow 180ms ease; }
.service-type-card > img { width:100%; aspect-ratio:3/2; object-fit:cover; }
.service-type-card:hover { transform: translateY(-2px); box-shadow: 0 18px 40px rgba(33,28,22,.1); }
.service-type-card-body { padding:1.2rem 1.15rem 1.4rem; }
.service-card-rule { display:block; width:34px; height:3px; margin-bottom:1rem; background: var(--color-accent); }
.service-type-card h3 { margin:0 0 .55rem; font-family:var(--font-sans); font-size:1.18rem; line-height:1.2; }
.service-type-card p { margin:0; color:var(--color-muted); font-size:.94rem; line-height:1.55; }

.significant-residential { padding:clamp(4rem,7vw,6.5rem) 0; }
.significant-residential-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(3rem,7vw,7rem); align-items:center; }
.significant-residential h2 { max-width:650px; margin-bottom:0; }
.significant-residential p { margin:0; max-width:700px; font-size:var(--body-copy-size); line-height:var(--body-copy-leading); }

.service-actions { padding:clamp(5rem,8vw,8rem) 0; background:#ffffff; }
.service-actions-intro { max-width:780px; margin-bottom:clamp(2.5rem,4vw,4rem); }
.service-actions-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,5rem); }
.service-action { padding-top:1.4rem; border-top:1px solid #cfc7bd; }
.service-action h3 { margin:0 0 1rem; font-family:var(--font-serif); font-weight:400; font-size:clamp(2rem,2.7vw,3rem); }
.service-action p { margin:0; color:#514b45; font-size:var(--body-copy-size); line-height:var(--body-copy-leading); }
.service-action p+p { margin-top:var(--paragraph-gap); }

@media (max-width: 980px) {
  .services-showcase-grid { grid-template-columns:1fr; min-height:0; }
  .services-showcase-copy { width:var(--container-wide); margin-inline:auto; padding:4rem 0 3rem; }
  .services-showcase-photo { min-height:500px; }
  .services-showcase-photo img { min-height:500px; object-position:50% 38%; }
  .service-type-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .significant-residential-grid { grid-template-columns:1fr; gap:1.5rem; }
}

@media (max-width: 680px) {
  .services-showcase-copy { padding:3.4rem 0 2.5rem; }
  .services-showcase-copy h1 { font-size:clamp(2.65rem,12vw,4rem); }
  .services-showcase-photo, .services-showcase-photo img { min-height:430px; }
  .service-type-showcase { padding:4rem 0; }
  .service-type-grid { grid-template-columns:1fr; gap:1.15rem; }
  .service-type-card { display:grid; grid-template-columns:42% 58%; align-items:stretch; }
  .service-type-card > img { height:100%; aspect-ratio:auto; min-height:190px; }
  .service-type-card-body { padding:1.15rem 1rem; align-self:center; }
  .service-actions-grid { grid-template-columns:1fr; gap:2.5rem; }
  .significant-residential { padding:4rem 0; }
}

@media (max-width: 430px) {
  .service-type-card { grid-template-columns:1fr; }
  .service-type-card > img { aspect-ratio:3/2; min-height:0; }
}


/* v1.4 whole-site refinements */
.section-copy h2, .perspective h2, .story-copy h2, .breadth h2, .brokerage h2, .contact-band h2 { max-width: 14ch; }
.breadth-heading { max-width: 920px; }
.brokerage-copy p, .contact-copy p { max-width: 42rem; }
.contact-brokerage h2 { margin: 0 0 1rem; font-family: var(--font-serif); font-weight: 400; font-size: clamp(1.9rem, 2.6vw, 2.7rem); line-height: 1.05; letter-spacing: -0.03em; }
.contact-brokerage p { max-width: 42rem; }
@media (max-width: 900px) { .contact-brokerage-logo { justify-self:start; } }

/* v1.5 Home service teaser */
.breadth-teaser { margin-top: clamp(2.4rem, 4vw, 3.6rem); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.4rem; max-width:1100px; }
.breadth-category { padding-top:.35rem; font-family:var(--font-serif); font-size:clamp(1.15rem,1.5vw,1.5rem); line-height:1.25; }
.breadth-category .experience-rule { margin-bottom:.85rem; }
@media (max-width: 900px) { .breadth-teaser { grid-template-columns:1fr 1fr; } }
@media (max-width: 520px) { .breadth-teaser { grid-template-columns:1fr; gap:1.5rem; } }

@media (max-width: 430px) { .about-facts { grid-template-columns:1fr; } }


/* v1.6 approved-photo crop tuning */
.editorial-split.surface-warm .section-media img { object-position: 50% 34%; }
.story-media img { object-position: 50% 42%; }
.editorial-split.surface-stone .section-media img { object-position: 50% 45%; }
.about-hero-media img { object-position: 50% 32%; }
.about-split.surface-warm .about-section-media img { object-position: 50% 46%; }
.about-room-media img { object-position: 50% 40%; }
.about-split.surface-stone .about-section-media img { object-position: 50% 34%; }
.services-showcase-photo img { object-position: 50% 34%; }
.contact-portrait img { object-position: 50% 30%; }

/* Ensure the palette differences are visible, while remaining restrained. */
.surface-warm { background: #f1f1ed; }
.surface-stone { background: #e8e8e3; }
.perspective, .breadth, .about-career, .services-showcase-hero, .contact-page-hero { background: #ffffff; }
.contact-band, .service-type-showcase { background: #f8f8f5; }

/* Services card polish */
.service-type-card > img { width:100%; aspect-ratio: 3 / 2; object-fit: cover; background:#ecece8; }
@media (prefers-reduced-motion: reduce) { .service-type-card:hover { transform:none; } }

/* v1.7 neutral palette override */
:root{--color-background:#f8f8f5;--color-surface-warm:#f1f1ed;--color-surface-stone:#e8e8e3;--color-border:#d6d6d0;}
body,.mobile-menu{background:var(--color-background);}
.site-header{background:rgba(250,250,248,.97);}
.surface-warm{background:#f1f1ed;}
.surface-stone{background:#e8e8e3;}
.hero{background:linear-gradient(90deg,#fafaf8 0%,#fafaf8 50%,#f0f0ec 50%,#f0f0ec 100%);}
@media(max-width:900px){.hero{background:#f8f8f5;}}
.contact-band,.service-type-showcase{background:#f8f8f5;}


/* v1.8 final refinement pass */
.brand-picture { display:block; width:100%; }
.service-actions-bridge { max-width: 650px; margin: .8rem 0 0; color: var(--color-muted); line-height: 1.65; }

/* Editorial fact strip, not card UI. */
.about-facts { border-bottom: 1px solid var(--color-border); padding: 0; gap: 0; }
.about-facts > div { padding: 1.35rem 1.4rem 1.45rem 0; border-right: 1px solid var(--color-border); }
.about-facts > div + div { padding-left: 1.4rem; }
.about-facts > div:last-child { border-right: 0; }

/* More disciplined service-card proportions and equal-height content. */
.service-type-grid { align-items: stretch; }
.service-type-card { display:flex; flex-direction:column; height:100%; }
.service-type-card > img { flex:0 0 auto; }
.service-type-card-body { flex:1; }

@media (max-width: 680px) {
  :root { --header-height: 66px; }
  .site-header, .header-inner { min-height: var(--header-height); }
  .header-inner { gap: .9rem; }
  .brand-logo { max-width: 208px; }
  .brand-logo-image { max-height: 39px; }
  .menu-toggle { width: 42px; height: 42px; padding: 9px; }
  .about-facts { border-bottom: 0; }
  .about-facts > div { padding: 1rem 0; border-right: 0; border-bottom: 1px solid var(--color-border); }
  .about-facts > div + div { padding-left: 0; }
  .service-type-card { display:grid; height:auto; }
}
@media (max-width: 430px) {
  .brand-logo { max-width: 198px; }
  .brand-logo-image { max-height: 37px; }
}


/* ============================================================
   v2.0 — desktop finishing pass
   Desktop-only tightening after live Netlify review.
   Mobile/tablet presentation intentionally preserved.
   ============================================================ */
@media (min-width: 1160px) {
  /* Home: more controlled opening proportions */
  .hero-grid {
    min-height: 620px;
  }
  .hero-copy {
    padding-top: 3.4rem;
    padding-bottom: 3.4rem;
  }
  .hero-media {
    min-height: 540px;
  }
  .hero-media img {
    min-height: 540px;
  }

  /* Home editorial image/text sections */
  .editorial-split {
    padding-top: 5.25rem;
    padding-bottom: 5.25rem;
  }
  .section-media,
  .section-media img {
    min-height: 455px;
  }

  /* Home experience section: deliberate two-column editorial use of width */
  .perspective {
    padding: 5.2rem 0;
  }
  .perspective-grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: clamp(4rem, 8vw, 8rem);
    align-items: start;
  }
  .perspective-heading {
    max-width: 540px;
  }
  .perspective-heading h2 {
    max-width: 520px;
    margin-bottom: 0;
  }
  .perspective-copy {
    max-width: 720px;
    padding-top: 3.05rem;
  }
  .perspective-copy p {
    margin: 0;
    color: #4d4842;
    font-size: var(--body-copy-size);
    line-height: var(--body-copy-leading);
  }
  .perspective-copy p + p {
    margin-top: var(--paragraph-gap);
  }

  /* Home story remains a feature moment, but not an oversized one */
  .story-band {
    padding-top: 4.8rem;
    padding-bottom: 4.8rem;
  }
  .story-media,
  .story-media img {
    min-height: 475px;
  }

  /* Home service teaser, brokerage and closing CTA */
  .breadth {
    padding: 5.25rem 0;
  }
  .breadth-teaser {
    margin-top: 2.6rem;
  }
  .text-link {
    margin-top: 2.2rem;
  }
  .brokerage {
    padding: 3.7rem 0;
  }
  .brokerage-grid {
    gap: 2.5rem;
    grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr);
  }
  .brokerage-logo-wrap {
    width: min(100%, 260px);
    justify-self: center;
    padding: .25rem 0;
  }
  .contact-band {
    padding: 4.7rem 0;
  }

  /* About: reduce full-screen feeling while preserving visual sequence */
  .about-hero-grid {
    min-height: 620px;
  }
  .about-hero-copy {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
  }
  .about-hero-media,
  .about-hero-media img {
    min-height: 580px;
  }
  .about-split {
    padding-top: 5.25rem;
    padding-bottom: 5.25rem;
  }
  .about-section-media,
  .about-section-media img {
    min-height: 480px;
  }
  .about-room {
    padding-top: 4.65rem;
    padding-bottom: 4.65rem;
  }
  .about-room-media,
  .about-room-media img {
    min-height: 470px;
  }
  .about-career {
    padding: 5.25rem 0;
  }
  .about-facts {
    margin-top: 2.7rem;
  }
  .about-philosophy {
    padding: 4.8rem 0;
  }
  .testimonials {
    padding: 5rem 0;
  }
  .testimonial-stage {
    min-height: 285px;
  }
  .testimonial blockquote {
    max-width: 920px;
    font-size: clamp(1.5rem, 1.72vw, 2.05rem);
    line-height: 1.4;
  }
  .testimonials-grid {
    gap: clamp(3rem, 6vw, 6rem);
  }

  /* Services: preserve imagery; tighten supporting sections */
  .services-showcase-grid {
    min-height: 610px;
  }
  .services-showcase-copy {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  .services-showcase-photo,
  .services-showcase-photo img {
    min-height: 520px;
  }
  .service-type-showcase {
    padding: 5.2rem 0;
  }
  .service-type-grid {
    margin-top: 2.8rem;
  }
  .significant-residential {
    padding: 4.25rem 0;
  }
  .service-actions {
    padding: 4.8rem 0;
  }
  .service-actions-intro {
    margin-bottom: 2.6rem;
  }
  .service-actions-grid {
    background: transparent;
    border: 0;
    gap: 0;
  }
  .service-action {
    padding: 2.2rem 4.4rem 2.2rem 0;
    border-top: 1px solid #cfc7bd;
  }
  .service-action + .service-action {
    padding-left: 4.4rem;
    padding-right: 0;
    border-left: 1px solid #d8d3cc;
  }
  .service-area-band {
    padding: 4.4rem 0;
  }
  .services-final-cta,
  .service-final-cta {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
  }

  /* Contact: move quickly from introduction to useful contact actions */
  .contact-page-hero {
    padding: 4.1rem 0;
  }
  .contact-page-hero-grid {
    gap: clamp(3rem, 6vw, 6rem);
  }
  .contact-portrait {
    min-height: 420px;
    max-height: 540px;
  }
  .contact-portrait img {
    min-height: 420px;
  }
  .contact-details {
    padding: 4.75rem 0;
  }
  .contact-details-grid {
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
    gap: clamp(3.5rem, 6vw, 6rem);
  }
  .contact-panel {
    padding: 2.5rem;
  }
  .contact-methods {
    margin-top: 1.8rem;
  }
  .contact-methods li {
    padding: 1.15rem 0;
  }
  .contact-form-wrap {
    padding: 2.6rem 3rem 3rem;
  }
}

/* ============================================================
   v2.1 — final desktop proportion polish
   Based on live Netlify desktop review. Mobile remains unchanged.
   ============================================================ */
@media (min-width: 1160px) {
  /* Home: let the final CTA breathe horizontally rather than stack vertically. */
  .contact-band .contact-grid {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr);
    gap: clamp(3rem, 6vw, 6rem);
  }
  .contact-band h2 {
    max-width: 18ch;
  }

  /* About: shorten the deliberate pause before testimonials without losing it. */
  .about-philosophy {
    padding-top: 4.15rem;
    padding-bottom: 4.15rem;
  }

  /* Services: the four property images should support the cards, not dominate them. */
  .service-type-card > img {
    aspect-ratio: 16 / 9;
  }

  /* Contact: slightly reduce the dead space between the form and footer. */
  .contact-details {
    padding-bottom: 3.7rem;
  }
}


/* ============================================================
   v2.2 — Services image proportion correction
   Final desktop review showed the four property images were still
   visually too tall. Use an explicit responsive height on desktop
   so the images support the cards instead of dominating the page.
   Mobile proportions remain unchanged.
   ============================================================ */
@media (min-width: 1160px) {
  .service-type-card > img {
    width: 100%;
    height: clamp(190px, 15vw, 235px);
    aspect-ratio: auto;
    object-fit: cover;
  }
  .service-type-card:nth-child(1) > img { object-position: 50% 54%; }
  .service-type-card:nth-child(2) > img { object-position: 50% 58%; }
  .service-type-card:nth-child(3) > img { object-position: 50% 58%; }
  .service-type-card:nth-child(4) > img { object-position: 50% 54%; }
}

/* ============================================================
   v2.3 — desktop editorial balance + contact typography system
   Live desktop review identified two final consistency issues:
   the Services introduction was visually weighted to the left,
   and Direct Contact used mismatched value sizes. Mobile is kept
   intentionally unchanged except for the unified contact values.
   ============================================================ */

/* Contact information: one clear hierarchy.
   Name = section title; role = supporting line; all contact values = one size. */
.contact-panel h2 {
  margin-bottom: .8rem;
  font-size: clamp(2.15rem, 2.65vw, 3.1rem);
}
.contact-panel .contact-role {
  margin: 0;
  color: #4d4842;
  font-size: 1rem;
  line-height: 1.55;
}
.contact-methods a,
.contact-methods strong {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(1.4rem, 1.7vw, 1.75rem);
  line-height: 1.25;
  font-weight: 400;
  color: var(--color-text);
}

@media (min-width: 1160px) {
  /* Services intro: headline and explanation now share the width like an
     editorial spread rather than leaving half the page visually unused. */
  .service-type-heading {
    max-width: none;
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(320px, .72fr);
    gap: clamp(4rem, 8vw, 9rem);
    align-items: end;
  }
  .service-type-heading-title h2 {
    margin-bottom: 0;
    max-width: 13ch;
  }
  .service-type-heading-copy {
    padding-bottom: .35rem;
  }
  .service-type-heading-copy p {
    margin: 0;
    max-width: 560px;
    color: #514b45;
    font-size: var(--body-copy-size);
    line-height: var(--body-copy-leading);
  }
}

@media (max-width: 680px) {
  .contact-methods a,
  .contact-methods strong {
    font-size: 1.35rem;
  }
  .contact-panel .contact-role {
    font-size: var(--body-copy-size);
  }
}

/* ============================================================
   v2.4 — Services typography + property-card text balance
   Live desktop review clarified two issues:
   1) the two supporting paragraphs in the Services hero should use
      one consistent body treatment;
   2) the imbalance was inside the four property cards, not in the
      section introduction. Restore the intro and center the short
      card copy on desktop for better visual balance.
   ============================================================ */

/* Services hero: one supporting-copy system. */
.services-showcase-lead,
.services-showcase-note {
  max-width: 650px;
  color: #514b45;
  font-family: var(--font-sans);
  font-size: var(--body-copy-size);
  line-height: var(--body-copy-leading);
}
.services-showcase-lead { margin: 1.55rem 0 0; }
.services-showcase-note { margin: var(--paragraph-gap) 0 0; }

@media (min-width: 1160px) {
  /* Restore the property-experience introduction to the approved
     left editorial block. The previous two-column treatment was based
     on a misunderstanding of the review note. */
  .service-type-heading {
    max-width: 780px;
    display: block;
  }
  .service-type-heading-title h2 {
    max-width: none;
    margin-bottom: 1rem;
  }
  .service-type-heading-copy {
    padding-bottom: 0;
  }
  .service-type-heading-copy p {
    margin: 0;
    max-width: none;
    color: #514b45;
    font-size: var(--body-copy-size);
    line-height: var(--body-copy-leading);
  }

  /* The four short service descriptions are centered under their
     imagery so the card content no longer hugs the left edge. */
  .service-type-card-body {
    text-align: center;
    padding: 1.15rem 1.25rem 1.35rem;
  }
  .service-type-card-body .service-card-rule {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: .85rem;
  }
  .service-type-card h3 {
    margin-bottom: .5rem;
  }
  .service-type-card p {
    max-width: 28ch;
    margin-left: auto;
    margin-right: auto;
  }
}


/* ============================================================
   v2.5 — Services property-experience intro alignment
   Desktop review showed the short introductory block felt stranded
   on the left above a symmetrical four-card row. Centre the entire
   intro as one editorial unit while preserving left-aligned hero and
   page structure elsewhere.
   ============================================================ */
@media (min-width: 1160px) {
  .service-type-heading {
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
  .service-type-heading-title .eyebrow {
    text-align: center;
  }
  .service-type-heading-title h2 {
    max-width: 18ch;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
  }
  .service-type-heading-copy p {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
}

/* ============================================================
   v2.6 — Services heading correction + supplied Keith logo
   ============================================================ */

/* Use the supplied Keith MacCuaig logo as the global brand lockup. */
.brand-logo { max-width: min(315px, 100%); }
.brand-logo-image {
  width: 100%;
  height: auto;
  max-height: 62px;
  object-fit: contain;
  object-position: left center;
}
.footer-brand { width: min(100%, 390px); }
.footer-brand-image {
  width: 100%;
  height: auto;
  max-height: 72px;
  object-fit: contain;
  object-position: left center;
  filter: none;
  opacity: 1;
  background: #ffffff;
  padding: .35rem .45rem;
}

/* Services property-experience intro: desktop is three clean, full-width lines. */
.service-type-heading {
  max-width: none;
  width: 100%;
  text-align: left;
}
.service-type-heading-title,
.service-type-heading-copy {
  width: 100%;
  max-width: none;
}
.service-type-heading h2 {
  max-width: none;
}
.service-type-heading-copy p {
  margin: 0;
  max-width: none;
  color: #514b45;
  font-size: var(--body-copy-size);
  line-height: var(--body-copy-leading);
}

@media (min-width: 1100px) {
  .service-type-heading .eyebrow {
    margin-bottom: .75rem;
  }
  .service-type-heading h2 {
    margin: 0 0 .95rem;
    white-space: nowrap;
    font-size: clamp(2.35rem, 2.85vw, 3.2rem);
    line-height: 1.04;
  }
  .service-type-heading-copy p {
    white-space: nowrap;
    font-size: .98rem;
    line-height: 1.55;
  }
}

@media (max-width: 680px) {
  .brand-logo { max-width: 225px; }
  .brand-logo-image { max-height: 44px; }
  .footer-brand { width: min(100%, 310px); }
  .footer-brand-image { max-height: 62px; }
}

@media (max-width: 430px) {
  .brand-logo { max-width: 210px; }
  .brand-logo-image { max-height: 41px; }
}

/* ============================================================
   v2.7 — Services desktop heading alignment correction
   Property Experience and What Keith Helps Clients Do now share
   the same editorial rule:
   - eyebrow remains left-aligned to the site container
   - primary heading is one centered line on desktop
   - supporting sentence is one centered line on desktop
   Mobile/tablet wrapping remains responsive.
   ============================================================ */
@media (min-width: 1100px) {
  /* Property Experience */
  .service-type-heading {
    width: 100%;
    max-width: none;
    margin: 0;
    text-align: left;
  }
  .service-type-heading-title,
  .service-type-heading-copy {
    width: 100%;
    max-width: none;
  }
  .service-type-heading .eyebrow {
    text-align: left;
    margin-bottom: .9rem;
  }
  .service-type-heading h2 {
    width: 100%;
    max-width: none;
    margin: 0 0 .9rem;
    text-align: center;
    white-space: nowrap;
    font-size: clamp(2.25rem, 2.7vw, 3.15rem);
    line-height: 1.04;
  }
  .service-type-heading-copy p {
    width: 100%;
    max-width: none;
    margin: 0;
    text-align: center;
    white-space: nowrap;
    font-size: clamp(.92rem, 1vw, 1rem);
    line-height: 1.55;
  }

  /* What Keith Helps Clients Do */
  .service-actions-intro {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    text-align: left;
  }
  .service-actions-intro .eyebrow {
    text-align: left;
    margin-bottom: .9rem;
  }
  .service-actions-intro h2 {
    width: 100%;
    max-width: none;
    margin: 0 0 .9rem;
    text-align: center;
    white-space: nowrap;
    font-size: clamp(2rem, 2.45vw, 2.85rem);
    line-height: 1.05;
  }
  .service-actions-bridge {
    width: 100%;
    max-width: none;
    margin: 0;
    text-align: center;
    white-space: nowrap;
    font-size: clamp(.92rem, 1vw, 1rem);
    line-height: 1.55;
  }
}


/* ============================================================
   v2.8 — Services section-label alignment + transparent Keith logo
   - What Keith Helps Clients Do now shares the same container-left
     alignment as Property Experience.
   - The centered one-line heading/supporting copy remain unchanged.
   - New supplied transparent Keith MacCuaig logo replaces the prior
     white-background raster throughout the site.
   ============================================================ */

/* New transparent logo: preserve intrinsic proportions and remove boxed background. */
.brand-logo-image {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 62px;
  object-fit: contain;
  object-position: left center;
  background: transparent;
}
.footer-brand-image {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 60px;
  object-fit: contain;
  object-position: left center;
  background: transparent;
  padding: 0;
  /* Footer is charcoal; use a clean monochrome treatment there only. */
  filter: brightness(0) invert(1);
  opacity: .96;
}

@media (min-width: 1100px) {
  /* Keep this eyebrow aligned to the same standard container edge
     as Property Experience instead of overriding container auto margins. */
  .service-actions-intro {
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 680px) {
  .brand-logo-image { max-height: 44px; }
  .footer-brand-image { max-height: 54px; }
}
@media (max-width: 430px) {
  .brand-logo-image { max-height: 41px; }
}


/* ============================================================
   v2.10 — Final Services intro consistency + Contact CTA cleanup
   - Services section labels share the same container alignment.
   - Desktop section headlines/supporting lines remain centered and single-line.
   - Contact hero no longer repeats the header's Call Keith CTA.
   ============================================================ */
#message-form { scroll-margin-top: 7.5rem; }

@media (min-width: 1100px) {
  .service-type-heading .eyebrow,
  .service-actions-intro .eyebrow {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }
}


/* ============================================================
   v2.11 — Home brokerage composition + Services hero alignment
   - Home brokerage affiliation uses the same editorial rhythm as
     other refined sections: left eyebrow, centred headline/support,
     larger centred D.Global logo.
   - D.Global logo is a real link to the brokerage website.
   - Services hero follows the approved desktop alignment rule:
     left eyebrow, single-line centred heading, centred support copy.
   ============================================================ */

/* Home brokerage: remove the under-filled two-column composition. */
.brokerage-editorial {
  width: 100%;
}
.brokerage-centered {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.brokerage-centered h2 {
  max-width: 1100px;
  margin: 0 auto 1.05rem;
}
.brokerage-centered > p {
  max-width: 900px;
  margin: 0 auto;
}
.brokerage-logo-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 450px);
  margin-top: 2rem;
  padding: .45rem .7rem;
  border-radius: 2px;
  text-decoration: none;
  transition: opacity .18s ease, transform .18s ease;
}
.brokerage-logo-link:hover {
  opacity: .82;
}
.brokerage-logo-link:focus-visible {
  outline: 3px solid rgba(237,28,36,.25);
  outline-offset: 5px;
}
.brokerage-logo-link img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 92px;
  object-fit: contain;
}

@media (min-width: 1160px) {
  .brokerage {
    padding: 4.4rem 0 4.7rem;
  }
  .brokerage-editorial > .eyebrow {
    text-align: left;
    margin-bottom: .9rem;
  }
  .brokerage-centered h2 {
    width: 100%;
    max-width: none;
    white-space: nowrap;
    text-align: center;
    font-size: clamp(2.15rem, 2.7vw, 3rem);
    line-height: 1.04;
  }
  .brokerage-centered > p {
    width: 100%;
    max-width: none;
    white-space: nowrap;
    text-align: center;
    font-size: clamp(.92rem, 1vw, 1rem);
    line-height: 1.55;
  }
  .brokerage-logo-link {
    width: min(100%, 460px);
    margin-top: 2.15rem;
  }

  /* Services hero: same alignment language as the refined Services sections. */
  .services-showcase-grid {
    grid-template-columns: minmax(0, 1.04fr) minmax(440px, .96fr);
  }
  .services-showcase-copy {
    max-width: none;
    padding-right: clamp(2.5rem, 4vw, 4.2rem);
  }
  .services-showcase-copy > .eyebrow {
    text-align: left;
    margin-bottom: 1rem;
  }
  .services-showcase-copy h1 {
    width: 100%;
    max-width: none;
    margin: 0 0 1.2rem;
    text-align: center;
    white-space: nowrap;
    font-size: clamp(2.35rem, 2.75vw, 2.95rem);
    line-height: 1.04;
  }
  .services-showcase-lead {
    width: 100%;
    max-width: none;
    margin: 0;
    text-align: center;
    font-size: clamp(.92rem, 1vw, 1rem);
    line-height: 1.62;
  }
}

@media (max-width: 1159px) {
  .brokerage-logo-link {
    width: min(100%, 380px);
  }
}

@media (max-width: 680px) {
  .brokerage-centered {
    align-items: flex-start;
    text-align: left;
  }
  .brokerage-centered h2,
  .brokerage-centered > p {
    text-align: left;
    max-width: none;
  }
  .brokerage-logo-link {
    width: min(100%, 330px);
    justify-content: flex-start;
    margin-top: 1.6rem;
    padding-left: 0;
  }
  .services-showcase-copy h1,
  .services-showcase-lead {
    text-align: left;
  }
}

/* ============================================================
   v2.12 — Home property-experience composition
   - Keep eyebrow anchored left for site-wide editorial consistency.
   - Centre headline and supporting line on desktop, matching refined
     Services-page section logic.
   - Use a restrained table-like four-column strip instead of four
     floating labels, so the section fills the page intentionally.
   ============================================================ */
.breadth-heading {
  max-width: none;
}
.breadth-heading > .eyebrow {
  text-align: left;
  margin-bottom: .9rem;
}
.breadth-centered {
  text-align: center;
}
.breadth-centered h2 {
  max-width: none;
  margin: 0 auto 1rem;
}
.breadth-centered > p {
  max-width: 1120px;
  margin: 0 auto;
}
.breadth-teaser {
  max-width: none;
  width: 100%;
  margin: clamp(2.4rem, 4vw, 3.25rem) auto 0;
  gap: 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.breadth-category {
  min-height: 112px;
  padding: 1.55rem 1rem 1.45rem;
  border-left: 1px solid var(--color-border);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.breadth-category:first-child {
  border-left: 0;
}
.breadth-category .experience-rule {
  margin: 0 auto .85rem;
}
.breadth-link {
  display: flex;
  width: fit-content;
  margin: 2.15rem auto 0;
}

@media (min-width: 1160px) {
  .breadth-centered h2 {
    width: 100%;
    white-space: nowrap;
    font-size: clamp(2.15rem, 2.7vw, 3rem);
    line-height: 1.04;
  }
  .breadth-centered > p {
    width: 100%;
    max-width: none;
    white-space: nowrap;
    font-size: clamp(.92rem, 1vw, 1rem);
    line-height: 1.55;
  }
}

@media (max-width: 900px) {
  .breadth-teaser {
    grid-template-columns: 1fr 1fr;
  }
  .breadth-category:nth-child(odd) {
    border-left: 0;
  }
  .breadth-category:nth-child(n+3) {
    border-top: 1px solid var(--color-border);
  }
  .breadth-link {
    margin-left: 0;
    margin-right: 0;
  }
}

@media (max-width: 520px) {
  .breadth-centered {
    text-align: left;
  }
  .breadth-centered h2,
  .breadth-centered > p {
    text-align: left;
  }
  .breadth-teaser {
    grid-template-columns: 1fr;
  }
  .breadth-category,
  .breadth-category:nth-child(odd) {
    border-left: 0;
  }
  .breadth-category + .breadth-category {
    border-top: 1px solid var(--color-border);
  }
  .breadth-link {
    margin-left: 0;
  }
}

/* ============================================================
   v2.13 — Home Property Experience + Brokerage spacing polish
   - Keep the approved structured four-column experience strip.
   - Tighten excess vertical space in the section.
   - Keep the long supporting sentence on one line on wide desktop
     without clipping; allow natural wrapping below wide desktop.
   - Restore the Brokerage Affiliation eyebrow to the shared content
     margin by preventing the editorial wrapper from becoming viewport-wide.
   ============================================================ */

/* Slightly tighter Home property-experience rhythm. */
.breadth {
  padding: clamp(4.25rem, 6vw, 6rem) 0;
}

/* The brokerage wrapper also carries .container-wide. Do not override it
   with viewport width; keep it on the site's established content grid. */
.brokerage-editorial {
  width: var(--container-wide);
  margin-inline: auto;
}

@media (min-width: 1360px) {
  /* Preserve the requested single-line support copy on normal desktop
     while keeping the full sentence inside the 1360px content container. */
  .breadth-centered > p {
    white-space: nowrap;
    font-size: .84rem;
    letter-spacing: -0.005em;
  }
}

@media (min-width: 1160px) and (max-width: 1359px) {
  /* At narrower desktop widths, wrapping is safer than clipping. */
  .breadth-centered > p {
    white-space: normal;
    max-width: 1120px;
    font-size: .94rem;
  }
}

/* ============================================================
   v2.14 — Services section-label container alignment
   Keep the centred headline/support copy, but restore the
   "What Keith helps clients do" eyebrow to the same left content
   edge used by Property Experience and Service Area.
   ============================================================ */
@media (min-width: 1100px) {
  .service-actions-intro.container-wide {
    width: var(--container-wide);
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }
}


/* ============================================================
   v3.0 PRODUCTION HARDENING
   ============================================================ */
.footer-brand-image {
  filter: none !important;
  background: transparent !important;
  padding: 0 !important;
  opacity: 1 !important;
  max-height: 64px;
}
.footer-brokerage-link { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.footer-legal {
  border-top: 1px solid rgba(255,255,255,.12);
  margin-top: 2rem;
  padding-top: 1.25rem;
  color: rgba(255,255,255,.68);
  font-size: .73rem;
  line-height: 1.55;
}
.footer-legal p { max-width: 980px; margin: 0 0 .55rem; }
.footer-bottom { display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.footer-bottom a { color: inherit; }
.legal-page { background:#fff; }
.legal-page-inner { padding: clamp(4rem,8vw,7rem) 0; }
.legal-page h1 { margin:0 0 1.4rem; font-family:var(--font-serif); font-weight:400; font-size:clamp(2.8rem,5vw,4.7rem); line-height:1; letter-spacing:-.035em; }
.legal-page h2 { margin:2.4rem 0 .7rem; font-family:var(--font-serif); font-weight:400; font-size:clamp(1.6rem,2.6vw,2.25rem); line-height:1.1; }
.legal-page p { color:#4f4a44; line-height:1.72; }
.legal-page .legal-lead { font-size:clamp(1.05rem,1.3vw,1.2rem); max-width:46rem; }
.legal-effective { margin-top:3rem; font-size:.9rem; color:var(--color-muted) !important; }
.contact-form a { text-underline-offset:3px; }
@media (max-width:680px) {
  .footer-legal { font-size:.7rem; }
  .footer-bottom { align-items:flex-start; flex-direction:column; }
  .footer-brand-image { max-height:58px; }
}

/* ============================================================
   v3.1.1 — QA production patch
   Targeted only: Services desktop hero alignment + footer social links.
   Existing responsive layout and visual system are otherwise preserved.
   ============================================================ */
@media (min-width: 1160px) {
  .services-showcase-copy h1,
  .services-showcase-lead {
    text-align: left;
  }
}

.footer-social {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-top: 1.15rem;
}
.footer-social a {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.86);
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease, transform .18s ease;
}
.footer-social a:hover {
  color: #fff;
  border-color: rgba(255,255,255,.58);
  transform: translateY(-1px);
}
.footer-social a:focus-visible {
  outline: 3px solid rgba(237,28,36,.35);
  outline-offset: 3px;
}
.footer-social svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}
.inline-external-link { color: inherit; text-decoration: none; }
.inline-external-link:hover { text-decoration: underline; text-underline-offset: .18em; }