/* Holmpark v6 port. One shared stylesheet. Palette, type, spacing per v6 fileset;
   rem units with fluid root (spec 16b), sticky header (25a), full-bleed hero (16a). */

@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url('../fonts/newsreader-400-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/newsreader-italic-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('../fonts/instrument-sans-400-600.woff2') format('woff2');
}

:root {
  --bg: #F7F4EF;
  --ink: #26221D;
  --ink-2: #4A443B;
  --muted: #8A8175;
  --nav: #6E675C;
  --rule: #DAD3C6;
  --accent: #8A6A45;
  --accent-hover: #6F5433;
  --select: #E5DCCB;
  --field: #C9C1B2;
  --dark-hover: #3A342C;
  --light-hover: #EAE4D8;
  --scrim: rgba(26, 21, 16, 0.45);
  --overlay: rgba(28, 24, 20, 0.97);
  --header-bg: rgba(247, 244, 239, 0.86);
  --serif: 'Newsreader', Georgia, serif;
  --sans: 'Instrument Sans', -apple-system, sans-serif;
  --pad-x: clamp(1.5rem, 6vw, 6rem);
}

html {
  font-size: clamp(93.75%, 88.75% + 0.125vw, 106.25%);
  scroll-padding-top: 5.5rem;
}

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

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 400;
  text-wrap: pretty;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

/* Full-bleed media sections break out of the content grid (todo-3 item 1). */
.bleed {
  width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  margin-top: 0; margin-bottom: 0;
}

a { color: var(--accent-hover); }
a:hover { color: var(--ink); }
::selection { background: var(--select); }
:focus-visible { outline: 1px solid var(--accent); outline-offset: 0.1875rem; }
img, video { display: block; max-width: 100%; }
button { font: inherit; }

/* Fade-up on section entry, exactly as v6 (IO threshold 0.12 + fallbacks in site.js). */
[data-fade] { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  [data-fade] { opacity: 0; transform: translateY(0.875rem); transition: opacity 0.7s ease, transform 0.7s ease; }
  [data-fade].in { opacity: 1; transform: none; }
}

/* ---------- Shared chrome ---------- */

.wrap { max-width: 85rem; margin: 0 auto; padding-left: var(--pad-x); padding-right: var(--pad-x); }

.site-header {
  position: sticky; top: 0; z-index: 90;
  background: var(--header-bg);
  -webkit-backdrop-filter: blur(0.625rem); backdrop-filter: blur(0.625rem);
  border-bottom: 1px solid var(--rule);
}
.site-header .wrap {
  padding-top: 1.625rem; padding-bottom: 1.625rem;
  display: flex; align-items: center; gap: clamp(1.125rem, 3vw, 2.75rem);
}
.logo { margin-right: auto; display: flex; align-items: center; text-decoration: none; }
.logo-wordmark { display: block; height: 1.4rem; width: auto; }
.logo-mark { display: none; height: 1.625rem; width: auto; }
@media (max-width: 61.24rem) {
  .logo-wordmark { display: none; }
  .logo-mark { display: block; }
}
.overlay-brand-img { height: 1.4rem; width: auto; display: block; }
.nav-wide { display: flex; align-items: center; gap: clamp(1.125rem, 3vw, 2.75rem); }
.nav-wide a { font-size: 0.8125rem; text-decoration: none; color: var(--nav); }
.nav-wide a:hover { color: var(--ink); }
.nav-wide a[aria-current="page"] {
  color: var(--ink);
  border-bottom: 1px solid var(--accent); padding-bottom: 0.3125rem;
}

.cta-underline {
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  color: var(--ink); border-bottom: 1px solid var(--accent); padding-bottom: 0.3125rem; white-space: nowrap;
  background: none; cursor: pointer; display: inline-block;
}
.cta-underline:hover { color: var(--accent-hover); }

/* Filled nav CTA (todo-3 item 2): dark button, ivory text, 44px tap target. */
.btn-nav {
  display: inline-flex; align-items: center; min-height: 44px;
  background: var(--ink); color: var(--bg); padding: 0.5rem 1.5rem;
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  white-space: nowrap;
}
.btn-nav:hover { background: var(--dark-hover); color: var(--bg); }

.menu-btn {
  display: none; background: none; border: none; cursor: pointer; padding: 0;
  color: var(--ink);
}

@media (max-width: 61.24rem) {
  .nav-wide { display: none; }
  .menu-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px; margin: -10px -10px -10px 0;
  }
}

/* Full-screen menu overlay (unchanged behavior, v6 values) */
.menu-overlay {
  position: fixed; inset: 0; z-index: 100; background: var(--bg);
  display: flex; flex-direction: column; padding: 1.625rem var(--pad-x) 2.5rem; overflow: auto;
}
.menu-overlay[hidden] { display: none; }
.menu-overlay .overlay-top { display: flex; align-items: center; justify-content: space-between; }
.menu-overlay .overlay-brand { font-size: 0.9375rem; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; }
.menu-overlay nav { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 0.625rem; }
.menu-overlay nav a {
  font-family: var(--serif); font-size: clamp(2rem, 6vw, 2.75rem); line-height: 1.45;
  text-decoration: none; color: var(--ink);
}
.menu-overlay nav a:hover { color: var(--accent-hover); }
.menu-overlay nav a[aria-current="page"] {
  border-bottom: 1px solid var(--accent); padding-bottom: 0.3125rem; align-self: flex-start;
}
.menu-overlay nav a.overlay-cta { color: var(--accent-hover); }
.menu-overlay nav a.overlay-cta:hover { color: var(--ink); }
.menu-overlay .overlay-mail { font-size: 0.8125rem; text-decoration: none; color: var(--nav); }
.menu-overlay .overlay-mail:hover { color: var(--ink); }
.menu-overlay .overlay-cta-btn { margin-top: 1.5rem; align-self: flex-start; }

/* ---------- Footer ---------- */

.site-footer { border-top: 1px solid var(--rule); margin-top: clamp(4.5rem, 10vh, 7rem); }
.site-footer .cols {
  padding-top: 3.5rem;
  display: flex; flex-wrap: wrap; gap: 2.5rem clamp(3rem, 8vw, 8rem);
}
.footer-brand { max-width: 21.25rem; margin-right: auto; }
.footer-brand .brand { font-size: 0.875rem; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; }
.footer-brand p { font-family: var(--serif); font-size: 1.1875rem; line-height: 1.5; color: var(--ink-2); margin: 1rem 0 0; }
.footer-col { display: flex; flex-direction: column; gap: 0.625rem; }
.footer-col .col-label { font-size: 0.6875rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); }
.footer-col a { font-size: 0.8125rem; text-decoration: none; color: var(--ink-2); }
.footer-col a:hover { color: var(--ink); }
.footer-legal { padding-top: 2.5rem; padding-bottom: 2.75rem; font-size: 0.75rem; color: var(--muted); }

/* ---------- Type patterns ---------- */

.label {
  display: block;
  font-size: 0.6875rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted);
}
.h-display {
  font-family: var(--serif); font-weight: 400; line-height: 1.1; letter-spacing: -0.01em;
  font-size: clamp(2.375rem, 4.8vw, 4.25rem); margin: 1.125rem 0 0; max-width: 28ch;
}
.h-display.h-home { font-size: clamp(2.125rem, 4.6vw, 4.125rem); max-width: 17ch; margin: 0; }
.h-section {
  font-family: var(--serif); font-weight: 400; line-height: 1.15; letter-spacing: -0.01em;
  font-size: clamp(1.875rem, 3vw, 2.75rem); margin: 1.125rem 0 0; max-width: 18ch;
}
.h-closing {
  font-family: var(--serif); font-weight: 400; line-height: 1.12; letter-spacing: -0.01em;
  font-size: clamp(1.875rem, 3.6vw, 3.125rem); margin: 2.5rem 0 0; max-width: 22ch;
}
.h-closing.h-closing-lg { font-size: clamp(2rem, 4vw, 3.5rem); max-width: 20ch; margin: 0; }
.lede { font-size: 1.0625rem; line-height: 1.65; color: var(--ink-2); margin: 1.5rem 0 0; max-width: 46ch; }
.body-copy { font-size: 1rem; line-height: 1.7; color: var(--ink-2); margin: 1.25rem 0 0; max-width: 44ch; }
.body-copy.body-loose { line-height: 1.75; margin: 0; }
.body-copy.body-loose + .body-copy.body-loose { margin-top: 1.25rem; }

/* ---------- Buttons and links ---------- */

.btn-dark {
  display: inline-block; background: var(--ink); color: var(--bg); padding: 0.9375rem 1.875rem;
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  border: none; cursor: pointer;
}
.btn-dark:hover { background: var(--dark-hover); color: var(--bg); }
.btn-light {
  display: inline-block; background: var(--bg); color: var(--ink); padding: 0.875rem 1.75rem;
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
}
.btn-light:hover { background: var(--light-hover); color: var(--ink); }
.mail-link {
  font-size: 0.875rem; text-decoration: none; color: var(--ink-2);
  border-bottom: 1px solid var(--rule); padding-bottom: 0.25rem;
}
.mail-link:hover { color: var(--ink); }
.cta-row { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; margin-top: 2rem; }

/* ---------- Media slots (empty placeholders until media lands) ---------- */

.slot {
  position: relative; width: 100%; background: var(--light-hover);
  border: 1px solid var(--rule); overflow: hidden;
}
.slot::after {
  content: attr(data-slot);
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  padding: 1rem; text-align: center;
  font-size: 0.6875rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted);
}
.slot.ratio-4-3 { aspect-ratio: 4 / 3; }
.slot.ratio-21-10 { aspect-ratio: 21 / 10; }
.slot > img, .slot > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.slot.filled { border: none; background: none; }
.slot.filled::after { content: none; }

/* Casual right-click deterrent on portfolio imagery (todo-3 item 2): a transparent
   shield receives the click, so the context menu has no save-image entry. */
.img-shield { position: absolute; inset: 0; z-index: 1; background: transparent; }

/* ---------- Hero (home, full bleed per 16a) ---------- */

.hero {
  position: relative; height: 85vh; height: 85svh; min-height: 30rem; overflow: hidden;
}
.hero .slot { position: absolute; inset: 0; border: none; }
.hero-video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity 0.9s ease;
}
.hero-video.ready { opacity: 1; }
.hero-scrim {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(26, 21, 16, 0.72) 0%, rgba(26, 21, 16, 0.45) 45%, rgba(26, 21, 16, 0) 85%);
}
.hero-body { position: absolute; left: 0; right: 0; bottom: 0; pointer-events: none; }
.hero-body .hero-inner {
  max-width: 85rem; margin: 0 auto;
  padding: 0 var(--pad-x) clamp(2rem, 6vh, 4.5rem);
}
.hero-body .h-display { color: var(--bg); text-shadow: 0 1px 1.75rem var(--scrim); }
.hero-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.25rem 2rem; margin-top: 1.375rem; }
.hero-sub {
  font-size: clamp(0.9375rem, 1.3vw, 1.0625rem); line-height: 1.6; color: rgba(247, 244, 239, 0.92);
  margin: 0; max-width: 44ch; text-shadow: 0 1px 1.25rem rgba(26, 21, 16, 0.5);
}
.hero-ctas { display: flex; align-items: center; gap: 1.75rem; flex-wrap: wrap; }
.hero-ctas a { pointer-events: auto; }
.hero-ctas .ghost-link {
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  color: var(--bg); border-bottom: 1px solid rgba(247, 244, 239, 0.6); padding-bottom: 0.3125rem;
}
.hero-ctas .ghost-link:hover { color: var(--light-hover); }

/* ---------- Section spacing ---------- */

.section-hero { padding-top: clamp(4rem, 9vh, 7rem); }
.section-hero .lede { max-width: 46ch; }
.section-hero figure { margin-top: clamp(2.5rem, 6vh, 4rem); }
.mt-1 { margin-top: clamp(3.5rem, 8vh, 5.5rem); }
.mt-2 { margin-top: clamp(4.5rem, 10vh, 7.5rem); }
.mt-3 { margin-top: clamp(5.5rem, 12vh, 9rem); }
.mt-4 { margin-top: clamp(6rem, 14vh, 10rem); }

/* Video media band (facilities film on About; todo-3 item 1) */
.video-band { position: relative; aspect-ratio: 21 / 10; overflow: hidden; background: var(--light-hover); }
.video-band video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity 0.9s ease;
}
.video-band video.ready { opacity: 1; }

/* ---------- Inverted band (todo-3 item 3): the site's single dark section ---------- */

.dark-band {
  background: var(--ink); color: var(--bg);
  padding: clamp(3.5rem, 8vh, 5.5rem) 0;
}
.dark-band .label { color: rgba(247, 244, 239, 0.6); }
.dark-band h2 {
  font-family: var(--serif); font-weight: 400; line-height: 1.12; letter-spacing: -0.01em;
  font-size: clamp(1.875rem, 3.6vw, 3.125rem); margin: 1.125rem 0 0; max-width: 22ch;
}
.dark-band p { font-size: 1rem; line-height: 1.7; color: rgba(247, 244, 239, 0.8); margin: 1.25rem 0 0; max-width: 44ch; }
.dark-band .btn-light { margin-top: 2rem; }

/* Brand logo row (todo-3 items 4, 5; todo-4 items 1, 4): eyebrow label above,
   equal boxes on one centerline, 2-col centered grid on mobile. */
.brand-row {
  border-bottom: 1px solid var(--rule); padding: 1.5rem 0 1.75rem;
  display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem 2.5rem;
  margin-top: 1.5rem;
}
.brand-logo {
  height: 2.1rem; width: 6.5rem; object-fit: contain; object-position: center;
}
/* Optical balance nudges after review (item 5). */
.brand-logo[alt="JW Marriott"] { transform: scale(1.08); }
.brand-logo[alt="Four Seasons"] { transform: scale(1.12); }
.brand-logo[alt="Hyatt"] { transform: scale(0.9); }
.brand-logo[alt="Volkswagen"] { transform: scale(0.88); }
@media (max-width: 40rem) {
  .brand-row {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: center; justify-content: center; row-gap: 2rem;
  }
}

/* ---------- Stats ---------- */

.stats {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2.5rem clamp(1.5rem, 3vw, 3rem);
}
@media (max-width: 64rem) {
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.stat { border-top: 1px solid var(--rule); padding-top: 1.375rem; }
.stat .num {
  display: block; font-family: var(--serif); font-weight: 500;
  font-size: clamp(2.25rem, 3.2vw, 3rem); line-height: 1;
}
.stat .cap { display: block; margin-top: 0.75rem; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }

/* ---------- Split feature (text + image) ---------- */

.split {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  gap: 3rem clamp(2.5rem, 7vw, 7.5rem); align-items: center;
}
.split figure { margin: 0; }
.split .text-link { margin-top: 1.75rem; }

/* 2-up detail image pair (item 28) */
.pair {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
  gap: clamp(1.5rem, 3vw, 3rem);
}
.pair figure { margin: 0; }

/* ---------- Rule-separated list rows ---------- */

.rule-list { display: flex; flex-direction: column; margin-top: 1.5rem; }
.rule-row {
  display: flex; flex-wrap: wrap; gap: 0.5rem clamp(1.5rem, 4vw, 4rem); align-items: baseline;
  border-top: 1px solid var(--rule); padding: 1.375rem 0;
}
.rule-row:last-child { border-bottom: 1px solid var(--rule); }
.rule-row .term { font-family: var(--serif); font-size: 1.375rem; min-width: 15rem; }
.rule-row .desc { font-size: 0.875rem; color: var(--nav); flex: 1; min-width: 15rem; }

/* Process rows (numbered) */
.process-list { display: flex; flex-direction: column; }
.process-row {
  display: flex; flex-wrap: wrap; gap: 0.5rem clamp(1.5rem, 4vw, 4rem); align-items: baseline;
  border-top: 1px solid var(--rule); padding: 1.25rem 0;
}
.process-row:last-child { border-bottom: 1px solid var(--rule); }
.process-row .step { font-size: 0.75rem; color: var(--accent); width: 2rem; font-variant-numeric: tabular-nums; }
.process-row .term { font-family: var(--serif); font-size: 1.3125rem; min-width: 12.5rem; }
.process-row .desc { font-size: 0.875rem; color: var(--nav); flex: 1; min-width: 15rem; }

/* ---------- Section heading row ---------- */

.head-row {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 1rem;
  border-top: 1px solid var(--rule); padding-top: 1.5rem;
}
.head-row h2 {
  font-family: var(--serif); font-weight: 400; font-size: clamp(1.75rem, 2.6vw, 2.375rem);
  line-height: 1.15; margin: 0;
}
.h-standalone {
  font-family: var(--serif); font-weight: 400; font-size: clamp(1.75rem, 2.6vw, 2.375rem);
  line-height: 1.15; margin: 0 0 2rem;
}
.head-label { border-top: 1px solid var(--rule); padding-top: 1.5rem; }

/* ---------- Work grid (home featured) ---------- */

.work-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(17.5rem, 1fr));
  gap: 3rem clamp(1.5rem, 3vw, 3rem); margin-top: 2.5rem;
}
.work-grid figure { margin: 0; }
.work-grid figcaption { margin-top: 1rem; }
.work-name {
  font-family: var(--serif); font-size: 1.375rem; text-decoration: none; color: var(--ink);
  background: none; border: none; padding: 0; cursor: pointer; text-align: left; display: inline-block;
}
.work-name:hover { color: var(--accent-hover); }

/* ---------- Projects grid (4/2/1 per item 18, v6) ---------- */

.proj-grid {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(2.5rem, 6vh, 3.5rem) clamp(1.25rem, 2.5vw, 2.25rem);
  margin-top: 2rem;
}
.proj-grid > figure { min-width: 0; margin: 0; }
.proj-grid figcaption { margin-top: 0.875rem; }
.proj-grid .work-name { font-size: 1.1875rem; line-height: 1.3; }
@media (max-width: 67.5rem) {
  .proj-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 40rem) {
  .proj-grid { grid-template-columns: minmax(0, 1fr); }
}
.card-link { text-decoration: none; color: var(--ink); display: block; }
.card-link:hover .work-name { color: var(--accent-hover); }

/* ---------- Beyond hospitality mosaic (item 20, v6 pattern, 10 cells) ---------- */

.mosaic {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: clamp(5.625rem, 10vw, 9.375rem);
  gap: clamp(0.875rem, 1.8vw, 1.5rem);
  margin-top: 2rem;
}
.mosaic > div { min-width: 0; }
.mosaic .slot { height: 100%; border: none; }
.m-c4r2 { grid-column: span 4; grid-row: span 2; }
.m-c3r2 { grid-column: span 3; grid-row: span 2; }
.m-c2r2 { grid-column: span 2; grid-row: span 2; }
.m-c2r1 { grid-column: span 2; grid-row: span 1; }
.m-c6r1 { grid-column: span 6; grid-row: span 1; }
@media (max-width: 40rem) {
  .mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: clamp(7.5rem, 28vw, 11.25rem); }
  .m-c4r2, .m-c3r2 { grid-column: span 2; }
  .m-c2r2 { grid-column: span 1; grid-row: span 2; }
  .m-c2r1 { grid-column: span 1; grid-row: span 1; }
  .m-c6r1 { grid-column: span 2; grid-row: span 1; }
}

/* ---------- Project detail carousel (item 19) ---------- */

.detail-top {
  display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem;
}
.carousel-pos { font-size: 0.8125rem; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.carousel { position: relative; margin-top: 2rem; }
.carousel-track {
  display: flex; overflow-x: auto; overflow-y: hidden; width: 100%;
  scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  aspect-ratio: 16 / 10; max-height: 75vh;
}
.carousel-track::-webkit-scrollbar { display: none; }
.carousel-slide {
  flex: 0 0 100%; width: 100%; scroll-snap-align: center; scroll-snap-stop: always;
  display: flex; align-items: center; justify-content: center; position: relative;
}
.carousel-slide img { width: 100%; height: 100%; object-fit: contain; transform-origin: center; }
.carousel-slide .slot { height: 100%; border: none; aspect-ratio: auto; }
.carousel-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 2.75rem; height: 2.75rem; min-width: 44px; min-height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(247, 244, 239, 0.75); border: 1px solid rgba(38, 34, 29, 0.3);
  color: var(--ink); cursor: pointer; padding: 0;
}
.carousel-nav:hover { background: rgba(247, 244, 239, 0.95); }
.carousel-prev { left: clamp(0.5rem, 2vw, 1.5rem); }
.carousel-next { right: clamp(0.5rem, 2vw, 1.5rem); }
.detail-name {
  font-family: var(--serif); font-weight: 400; font-size: clamp(2rem, 3.6vw, 3.125rem);
  line-height: 1.12; letter-spacing: -0.01em; margin: 2.5rem 0 0;
}
.detail-location {
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--muted); margin: 0.875rem 0 0;
}

/* ---------- Closing CTA ---------- */

.closing { padding-bottom: 1rem; }
.closing.ruled { border-top: 1px solid var(--rule); }

/* ---------- Contact page ---------- */

.contact-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(25rem, 100%), 1fr));
  gap: clamp(3rem, 7vh, 4.5rem) clamp(3rem, 8vw, 8rem);
  padding-top: clamp(4rem, 9vh, 7rem); align-items: start;
}
.contact-grid .h-display { font-size: clamp(2.375rem, 4.6vw, 4rem); max-width: 14ch; margin: 0; }
.contact-rows { display: flex; flex-direction: column; margin-top: clamp(2.5rem, 6vh, 3.5rem); }
.contact-row {
  border-top: 1px solid var(--rule); padding: 1.125rem 0;
  display: flex; flex-wrap: wrap; gap: 0.5rem 2rem; align-items: baseline;
}
.contact-row:last-child { border-bottom: 1px solid var(--rule); }
.contact-row .row-label { font-size: 0.6875rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); width: 5.625rem; }
.contact-row a { font-family: var(--serif); font-size: 1.25rem; text-decoration: none; color: var(--ink); }
.contact-row a:hover { color: var(--accent-hover); }
.next-steps { margin-top: clamp(2.5rem, 6vh, 3.5rem); }
.next-steps .steps { display: flex; flex-direction: column; gap: 1rem; margin-top: 1.25rem; }
.next-steps p { font-size: 0.9375rem; line-height: 1.6; color: var(--ink-2); margin: 0; }
.next-steps .n { color: var(--accent); font-variant-numeric: tabular-nums; margin-right: 0.75rem; }

/* Form */
.inquiry { border-top: 1px solid var(--ink); padding-top: 2rem; }
.field-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(11.25rem, 1fr));
  gap: 1.75rem 2rem; margin-top: 1.75rem;
}
.field {
  display: flex; flex-direction: column; gap: 0.5rem;
  font-size: 0.75rem; letter-spacing: 0.06em; color: var(--nav);
}
.field input, .field textarea {
  font: inherit; font-size: 0.9375rem; color: var(--ink); background: transparent;
  border: 0; border-bottom: 1px solid var(--field); padding: 0.5rem 0; border-radius: 0;
  outline: none; letter-spacing: 0; width: 100%;
}
.field textarea { resize: vertical; }
.field input:focus, .field textarea:focus { border-bottom-color: var(--accent); }
.field.ta { margin-top: 2rem; }
.radio-label { display: block; font-size: 0.75rem; letter-spacing: 0.06em; color: var(--nav); }
.radio-row { display: flex; flex-wrap: wrap; gap: 0.875rem 1.75rem; margin-top: 0.875rem; }
.radio-row label { display: inline-flex; align-items: center; gap: 0.5625rem; font-size: 0.875rem; cursor: pointer; color: var(--ink); }
.radio-row input { accent-color: var(--accent); margin: 0; }
.form-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; margin-top: 2.25rem; }
.form-note { font-size: 0.8125rem; color: var(--muted); }
.form-error { font-size: 0.875rem; color: var(--accent-hover); margin: 0; }
.hp-field { position: absolute; left: -625rem; top: auto; width: 1px; height: 1px; overflow: hidden; }
.inquiry-success h2 {
  font-family: var(--serif); font-weight: 400; font-size: clamp(1.75rem, 3vw, 2.5rem);
  line-height: 1.15; margin: 1.5rem 0 0;
}
.inquiry-success p { font-size: 1rem; line-height: 1.7; color: var(--ink-2); margin: 1rem 0 0; max-width: 40ch; }
.inquiry-success .cta-underline { margin-top: 1.75rem; }

/* About two-column statement */
.statement {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(25rem, 100%), 1fr));
  gap: 2.5rem clamp(3rem, 8vw, 8rem);
}
.statement h2 {
  font-family: var(--serif); font-weight: 400; font-size: clamp(1.75rem, 2.8vw, 2.5rem);
  line-height: 1.2; letter-spacing: -0.01em; margin: 0; max-width: 16ch;
}