/* ==========================================================================
   MIDAS REVOLUTION — shared stylesheet
   Desktop design scale: 1440px. Sections are tuned against the six reference
   mockups in /references; see README.md for the measurement notes.
   ========================================================================== */

/* ---------- Fonts (self-hosted, variable) ---------- */
@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-var.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Figtree";
  src: url("../fonts/figtree-var.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-var.woff2") format("woff2");
  font-weight: 500 700;
  font-style: normal;
  font-display: swap;
}

/* ---------- Tokens ---------- */
:root {
  --charcoal: #1d1713;
  --charcoal-deep: #15110e;
  --charcoal-soft: #26211b;
  --ivory: #f9f6ef;
  --ivory-soft: #fcfaf5;
  --ivory-warm: #f4ecdd;
  --beige: #f2e4cc;
  --white: #ffffff;
  --gold: #cf9a3f;
  --gold-bright: #e3ad55;
  --gold-muted: #d8ac61;
  --gold-badge: #d6a14a;
  --burgundy: #6c1316;
  --burgundy-deep: #5a0e12;
  --burgundy-cta: #7f1016;
  --button-red: #8e0f1c;
  --button-red-hover: #a3142a;
  --ink: #16171a;
  --ink-navy: #141a2c;
  --body-ink: #4a4744;
  --muted-ink: #6a6560;
  --on-dark: #f1ece6;
  --on-dark-muted: #d9d1c8;
  --hairline: rgba(208, 152, 53, 0.72);
  --hairline-soft: rgba(208, 152, 53, 0.45);

  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans: "Figtree", "Lato", "Helvetica Neue", Arial, sans-serif;
  --label: "Montserrat", "Figtree", "Helvetica Neue", Arial, sans-serif;

  --container: 1290px;
  --gutter: clamp(20px, 5.3vw, 78px);
  /* distance from viewport edge to content edge, for full-bleed splits */
  --edge: max(var(--gutter), calc((100vw - var(--container)) / 2));
  --header-h: 78px;
}

/* ---------- Reset / base ---------- */
*,
*::before,
*::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
body {
  margin: 0;
  background: var(--ivory);
  color: var(--body-ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 600;
  font-variation-settings: "opsz" 36;
  color: var(--ink);
  letter-spacing: -0.012em;
  line-height: 1.08;
}
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: 200;
  background: var(--gold-bright); color: var(--charcoal); padding: 10px 16px;
  font: 600 13px/1 var(--label);
}
.skip-link:focus { top: 12px; }
.icon-sprite { display: none; }

.wrap {
  width: min(100% - 2 * var(--gutter), var(--container));
  margin-inline: auto;
}
.accent { color: var(--gold); }
.on-red .accent, .accent--bright { color: var(--gold-bright); }

/* ---------- Typographic primitives ---------- */
/* doubled specificity so section paragraph rules (e.g. .cta--cream p) never restyle the kicker */
.eyebrow, html body .eyebrow {
  display: block;
  margin: 0 0 14px;
  font: 600 12px/1.3 var(--label);
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--gold);
}
.on-dark .eyebrow, .on-red .eyebrow { color: var(--gold-bright); }

.h-section { font-size: clamp(32px, 4vw, 58px); }
.h-section--lg { font-size: clamp(34px, 3.9vw, 57px); }
.h-section--md { font-size: clamp(32px, 3.9vw, 56px); }
.on-dark h1, .on-dark h2, .on-dark h3,
.on-red h1, .on-red h2, .on-red h3 { color: var(--white); }
.on-dark, .on-red { color: var(--on-dark); }

.rule {
  display: block;
  width: 44px;
  height: 2px;
  margin: 18px 0 0;
  background: var(--gold);
  border: 0;
}
.lead { font-size: 17.9px; line-height: 1.6; }
.small { font-size: 15.7px; line-height: 1.55; }

/* ---------- Icons ---------- */
.icon {
  width: 1em; height: 1em;
  fill: none; stroke: currentColor;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
  flex: none;
}
.icon--arrow { width: 14px; height: 14px; stroke-width: 1.7; }

/* ---------- Buttons & links ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 14px;
  min-height: 54px;
  padding: 16px 30px;
  border: 1px solid var(--gold);
  background: var(--button-red);
  color: var(--white);
  font: 600 13px/1.2 var(--label);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn:hover { background: var(--button-red-hover); }
.btn .icon--arrow { transition: transform .2s ease; }
.btn:hover .icon--arrow, .link-arrow:hover .icon--arrow { transform: translateX(3px); }
.btn--outline {
  background: transparent;
  color: var(--gold-bright);
  border-color: var(--gold);
}
.btn--outline:hover { background: rgba(227, 173, 85, 0.12); }
.btn--outline-light { background: transparent; color: var(--white); border-color: var(--gold-bright); }
.btn--outline-light:hover { background: rgba(255, 255, 255, 0.08); }
.btn--sm { min-height: 40px; padding: 10px 20px; font-size: 11px; }
.btn--lg { min-height: 60px; padding: 18px 34px; }

.link-arrow {
  display: inline-flex; align-items: center; gap: 12px;
  font: 600 12.5px/1.2 var(--label);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink);
}
.link-arrow:hover { color: var(--button-red); }
.on-dark .link-arrow { color: var(--gold-bright); }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
  position: absolute; inset: 0 0 auto; z-index: 50;
  height: var(--header-h);
  background: rgba(24, 19, 16, 0.8);
  color: var(--white);
}
.site-header__inner {
  height: 100%;
  display: flex; align-items: center; gap: 32px;
  width: min(100% - 2 * clamp(20px, 3.6vw, 56px), 1340px);
  margin-inline: auto;
}
.brand { display: inline-flex; align-items: center; gap: 14px; color: var(--white); flex: none; }
.brand__mark { width: 68px; height: 68px; flex: none; }
.brand__name {
  font: 500 22px/1 var(--serif);
  font-variation-settings: "opsz" 30;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  white-space: nowrap;
}
.site-nav { margin-left: auto; }
.site-nav__list { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 38px); }
.site-nav__link {
  position: relative; display: inline-block; padding: 8px 0;
  font: 500 13.5px/1 var(--sans);
  color: var(--white);
  transition: color .2s ease;
}
.site-nav__link:hover { color: var(--gold-bright); }
.site-nav__link.is-active { color: var(--gold-bright); }
.site-nav__link.is-active::after {
  content: ""; position: absolute; left: 50%; bottom: -3px;
  width: 100%; min-width: 24px; height: 2px;
  transform: translateX(-50%);
  background: var(--gold-bright);
}
.site-header__cta { margin-left: clamp(16px, 2.6vw, 44px); }
.site-header .btn { min-height: 42px; padding: 11px 22px; font-size: 11.5px; }
.nav-toggle {
  display: none;
  margin-left: auto;
  width: 44px; height: 44px;
  align-items: center; justify-content: center;
  border: 1px solid var(--hairline);
  background: transparent; color: var(--white); cursor: pointer;
}
.nav-toggle .icon { width: 24px; height: 24px; }
.nav-toggle .icon--close { display: none; }
.nav-open .nav-toggle .icon--menu { display: none; }
.nav-open .nav-toggle .icon--close { display: block; }
.site-nav__cta { display: none; }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
  position: relative; isolation: isolate;
  display: flex; align-items: flex-start;
  min-height: var(--hero-h, 480px);
  padding: calc(var(--header-h) + var(--hero-pt, 42px)) 0 var(--hero-pb, 40px);
  background: var(--charcoal-deep);
  color: var(--white);
  overflow: hidden;
}
.hero__media {
  position: absolute; z-index: -2; top: 0; right: 0; bottom: 0;
  width: var(--hero-img-w, 100%);
  height: 100%;
  object-fit: cover;
  object-position: var(--hero-pos, 50% 55%);
}
.hero::before {
  content: ""; position: absolute; z-index: -1; inset: 0;
  background: var(--hero-shade,
    linear-gradient(90deg, rgba(20,16,13,.96) 0%, rgba(20,16,13,.9) 24%, rgba(20,16,13,.55) 44%, rgba(20,16,13,.12) 62%, rgba(20,16,13,0) 76%));
}
.hero__content { position: relative; max-width: var(--hero-copy-w, 760px); }
.hero h1 {
  color: var(--white);
  font-size: var(--hero-fs, clamp(40px, 4.4vw, 64px));
  line-height: 1.0;
  letter-spacing: -0.015em;
}
.hero h1 .accent { color: var(--gold-bright); }
.hero h1 > span { display: block; }
.hero__sub {
  margin: 12px 0 0;
  font: 400 var(--hero-sub-fs, 25px)/1.35 var(--sans);
  color: var(--white);
}
.hero .btn { margin-top: var(--hero-btn-mt, 24px); }
.hero .eyebrow { margin-bottom: 12px; }

.hero--home     { --hero-h: 390px; --hero-img-w: 80%; --hero-pos: 50% 52%; --hero-pt: 26px; --hero-fs: clamp(40px, 4.35vw, 63px); }
.hero--about    { --hero-h: 480px; --hero-img-w: 86%; --hero-pos: 50% 50%; --hero-pt: 34px; --hero-fs: clamp(46px, 5.9vw, 85px); --hero-sub-fs: 26.9px; }
.hero--services { --hero-h: 566px; --hero-img-w: 92%; --hero-pos: 50% 48%; --hero-pt: 40px; --hero-fs: clamp(44px, 5.3vw, 76px); --hero-copy-w: 680px; --hero-sub-fs: 24.6px; }
.hero--projects { --hero-h: 438px; --hero-img-w: 84%; --hero-pos: 50% 46%; --hero-pt: 48px; --hero-fs: clamp(50px, 5.6vw, 82px); }
.hero--contact  { --hero-h: 586px; --hero-img-w: 100%; --hero-pos: 50% 52%; --hero-pt: 64px; --hero-fs: clamp(44px, 5.5vw, 80px); --hero-copy-w: 600px; --hero-sub-fs: 20px; }
.hero--ext      { --hero-h: 632px; --hero-img-w: 74%; --hero-pos: 46% 46%; --hero-pt: 40px; --hero-fs: clamp(42px, 5vw, 72px); --hero-copy-w: 640px; --hero-sub-fs: 23.5px;
  --hero-shade: linear-gradient(90deg, rgba(20,16,13,.97) 0%, rgba(20,16,13,.93) 26%, rgba(20,16,13,.6) 38%, rgba(20,16,13,.12) 50%, rgba(20,16,13,0) 60%); }
.hero--projects .hero__tagline {
  margin: 14px 0 0;
  font: 500 clamp(24.6px, 2.5vw, 35.8px)/1.2 var(--serif);
  color: var(--gold-bright);
}
.hero--contact .hero__sub { max-width: 520px; line-height: 1.55; }
.hero--ext .hero__sub { max-width: 500px; }
.hero--services .hero__sub { max-width: 440px; }

/* ==========================================================================
   Sections — shared layouts
   ========================================================================== */
.section { padding: var(--pad-y, 64px) 0; }
.bg-ivory { background: var(--ivory); }
.bg-ivory-soft { background: var(--ivory-soft); }
.bg-white { background: var(--white); }
.bg-dark { background: var(--charcoal); }
.bg-red {
  background:
    linear-gradient(90deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 78%, rgba(0,0,0,.12) 100%),
    var(--burgundy);
}
.bg-red-cta {
  background: linear-gradient(90deg, #7a0f15 0%, #84111a 45%, #6f0e14 100%);
}
.cream-grad { background: linear-gradient(180deg, #fbf9f4 0%, #f7f3ea 100%); }

/* Section header row: title left, intro right */
.sec-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr);
  align-items: end;
  gap: 24px 60px;
  margin-bottom: 36px;
}
.sec-head__intro { margin: 0 0 6px; max-width: 470px; justify-self: end; font-size: 17.9px; line-height: 1.6; }

/* Split: text panel + flush photo */
.split {
  display: grid;
  grid-template-columns: var(--split-cols, 41% 59%);
  min-height: var(--split-h, 500px);
}
.split__text {
  display: flex; flex-direction: column; justify-content: center;
  padding: var(--split-pad-y, 56px) clamp(28px, 4.5vw, 70px) var(--split-pad-y, 56px) var(--edge);
}
.split__media { position: relative; min-height: 280px; }
.split__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.split--reverse .split__text { order: 2; padding: var(--split-pad-y, 56px) var(--edge) var(--split-pad-y, 56px) clamp(28px, 4.5vw, 70px); }
.split h2 { margin-bottom: 22px; }
.split .btn { align-self: flex-start; margin-top: 10px; }

/* Photo cards */
.card { display: flex; flex-direction: column; min-width: 0; }
.card__media { position: relative; overflow: hidden; aspect-ratio: var(--card-ar, 1.52); background: #ddd5c8; }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.card:hover .card__media img { transform: scale(1.03); }
.card__body {
  flex: 1;
  display: flex; flex-direction: column; align-items: flex-start;
  margin-top: 14px;
  padding: 4px 8px 2px 24px;
  border-left: 1px solid var(--hairline);
}
.card__title { font-size: var(--card-title-fs, 24.5px); line-height: 1.15; margin-bottom: 12px; }
.card__text { font-size: var(--card-text-fs, 16px); line-height: 1.6; color: var(--body-ink); margin-bottom: 18px; }
.card .link-arrow { margin-top: auto; }

.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--grid-gap, 24px); }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gap, 22px); }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--grid-gap, 28px); }

/* Small icon grid (intro strips) */
.icon-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px 12px;
}
.icon-grid__item { display: flex; flex-direction: column; align-items: center; text-align: center; color: var(--gold); }
.icon-grid__item .icon { width: var(--ig-size, 36px); height: var(--ig-size, 36px); stroke-width: 1.4; }
.icon-grid__label {
  margin-top: 9px;
  font: 700 10px/1.35 var(--label);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
}

/* Vertical gold divider helper */
.vdivide { border-left: 1px solid var(--hairline); }

/* Gold numbered badge */
.badge {
  display: inline-grid; place-items: center;
  width: 52px; height: 52px; flex: none;
  border-radius: 50%;
  background: var(--gold-badge);
  color: var(--ink);
  font: 600 20px/1 var(--serif);
  font-variation-settings: "opsz" 24;
}

/* ==========================================================================
   Process — three distinct layouts
   ========================================================================== */
/* (a) Tall crimson 4-column (Home, About) */
.process-red { padding: 42px 0 40px; }
.process-red__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 20px 56px;
  margin-bottom: 30px;
}
.process-red__title { font-size: clamp(32px, 4.3vw, 62px); white-space: nowrap; }
.process-red__title .dot { color: var(--gold-bright); padding: 0 0.35em; font-size: 0.26em; vertical-align: 0.6em; }
.process-red__intro { margin: 0; max-width: 400px; font-size: 17.4px; line-height: 1.55; color: var(--white); }
.steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.step { position: relative; padding: 0 30px; }
.step:first-child { padding-left: 0; }
.step + .step { border-left: 1px solid var(--hairline); }
.process-red .step__top { display: grid; grid-template-columns: 52px 1fr 52px; align-items: start; }
.process-red .step__icon { justify-self: center; width: 86px; height: 86px; color: var(--gold-bright); stroke-width: 1.35; margin-top: 4px; }
.process-red .step__title { margin: 12px 0 10px; text-align: center; font-size: clamp(22px, 2.1vw, 30px); color: var(--white); }
.process-red .step__text { font-size: 17.4px; line-height: 1.55; color: var(--on-dark); margin: 0; }
.process-red--about .step__text { text-align: center; }
.process-red--about .process-red__head { margin-bottom: 30px; }
.process-red--about .process-red__title { font-size: clamp(32px, 4.7vw, 68px); }

/* (b) Compact white horizontal (Services, Extensions) */
.process-compact { padding: 48px 0 52px; }
.process-compact .sec-head { margin-bottom: 26px; align-items: center; }
.process-compact .sec-head__intro { font-size: 16.8px; max-width: 520px; }
.process-compact .steps { gap: 0 0; }
.process-compact .step { padding: 0 34px 0 0; border: 0; }
.process-compact .step__top { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.process-compact .step__title { font-size: clamp(22px, 2vw, 28px); }
.process-compact .step__arrow { margin-left: auto; color: var(--gold); width: 22px; height: 22px; stroke-width: 1.3; }
.process-compact .step:last-child .step__arrow { display: none; }
.process-compact .step__text { font-size: 17px; line-height: 1.55; margin: 0; max-width: 290px; }

/* (c) Crimson split text + 4 narrow columns (Projects) */
.process-split { padding: 50px 0 48px; }
.process-split__grid { display: grid; grid-template-columns: 37% 1fr; gap: 40px; align-items: start; }
.process-split h2 { font-size: clamp(30px, 3.5vw, 50px); line-height: 1.08; }
.process-split__copy { margin: 20px 0 26px; max-width: 420px; font-size: 16.8px; line-height: 1.6; }
.process-split .steps { margin-top: 4px; }
.process-split .step { padding: 0 16px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.process-split .step:first-child { padding-left: 16px; }
.process-split .step + .step { border-left: 1px solid var(--hairline); }
.process-split .badge { width: 44px; height: 44px; font-size: 18px; align-self: flex-start; }
.process-split .step__icon { width: 68px; height: 68px; color: var(--gold-bright); stroke-width: 1.4; margin-top: 2px; }
.process-split .step__title { margin: 12px 0 8px; font-size: clamp(22px, 2.1vw, 30px); color: var(--white); }
.process-split .step__text { margin: 0; font-size: 15.5px; line-height: 1.5; color: var(--on-dark); }

/* ==========================================================================
   CTAs
   ========================================================================== */
.cta { position: relative; overflow: hidden; isolation: isolate; }
.cta__lineart {
  position: absolute; z-index: -1; right: 0; bottom: 0;
  width: min(48%, 640px); height: auto; aspect-ratio: 2 / 1;
  pointer-events: none;
}
.cta--red { padding: 40px 0 38px; }
.cta--red .cta__lineart { color: rgba(255, 216, 200, 0.2); right: 2%; width: min(40%, 560px); }
.cta--red .cta__grid { display: grid; grid-template-columns: auto 1fr; gap: 28px 60px; align-items: start; }
.cta--red h2 { font-size: clamp(30px, 3.1vw, 45px); }
.cta--red .cta__text { margin: 6px 0 0; font-size: 19px; line-height: 1.6; color: var(--on-dark); grid-column: 1 / -1; max-width: 640px; }
.cta--red .btn { margin-top: 6px; justify-self: start; }

.cta--cream { padding: 56px 0 58px; background: linear-gradient(90deg, #fbf8f2 0%, #f7f2e8 100%); }
.cta--cream .cta__lineart { color: rgba(178, 140, 82, 0.32); width: min(44%, 620px); right: 1%; }
.cta--cream .cta__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 30px 50px; align-items: center; max-width: 1080px; }
.cta--cream h2 { font-size: clamp(32px, 3.9vw, 56px); margin-bottom: 16px; }
.cta--cream p { margin: 0; max-width: 560px; font-size: 17.9px; color: var(--body-ink); }

.cta--photo { min-height: var(--cta-h, 410px); display: flex; align-items: center; padding: 56px 0; color: var(--white); background: var(--charcoal-deep); }
.cta--photo .cta__bg { position: absolute; z-index: -2; inset: 0 0 0 auto; width: var(--cta-img-w, 66%); height: 100%; object-fit: cover; object-position: var(--cta-pos, 50% 60%); }
.cta--photo::before { content: ""; position: absolute; z-index: -1; inset: 0; background: var(--cta-shade, linear-gradient(90deg, rgba(20,16,13,.97) 0%, rgba(20,16,13,.9) 34%, rgba(20,16,13,.35) 55%, rgba(20,16,13,.0) 72%)); }
.cta--photo h2 { font-size: clamp(38px, 4.5vw, 65px); color: var(--white); }
.cta--photo h2 .accent { color: var(--gold-bright); }
.cta--photo p { margin: 16px 0 26px; font-size: 19px; line-height: 1.55; max-width: 470px; color: var(--white); }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { background: var(--charcoal); color: var(--on-dark); }
.footer-bar {
  display: flex; align-items: center; gap: 28px;
  width: min(100% - 2 * clamp(20px, 2.8vw, 44px), 1360px);
  min-height: 150px; padding: 26px 0;
}
.footer-bar .brand__mark { width: 104px; height: 104px; }
.footer-bar .brand__name { font-size: 22px; }
.footer-nav { margin-left: auto; }
.footer-nav ul { display: flex; flex-wrap: wrap; gap: 8px clamp(14px, 2vw, 30px); }
.footer-nav a { font: 400 13.5px/1.2 var(--sans); color: var(--white); }
.footer-nav a:hover, .footer-nav a[aria-current="page"] { color: var(--gold-bright); }
.footer-tags { display: flex; align-items: center; gap: 22px; padding-left: 28px; border-left: 1px solid var(--gold); }
.footer-tags span {
  font: 700 10px/1.2 var(--label);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--white);
  white-space: nowrap;
}
.footer-tags span + span { padding-left: 22px; border-left: 1px solid var(--gold); }
.site-footer--edge { border-bottom: 10px solid var(--gold-bright); }

/* Expanded (Contact) footer */
.footer-expanded { display: grid; grid-template-columns: 34% 20% 23% 23%; gap: 0; padding: 58px 0 54px; }
.footer-expanded .brand { align-self: start; }
.footer-expanded .brand__mark { width: clamp(72px, 7.8vw, 112px); height: clamp(72px, 7.8vw, 112px); }
.footer-expanded .brand__name { font-size: clamp(18px, 1.65vw, 24px); }
.footer-expanded__brand::after { content: ""; display: block; width: 150px; height: 1px; margin-top: 26px; background: var(--gold); }
.footer-col { padding: 0 34px; border-right: 1px solid var(--gold); }
.footer-col:last-child { border-right: 0; padding-right: 0; }
.footer-col h2 {
  margin-bottom: 18px;
  font: 600 11px/1.3 var(--label); letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold-bright);
}
.footer-col li + li { margin-top: 9px; }
.footer-col a, .footer-col p { font-size: 16.2px; line-height: 1.6; color: var(--white); }
.footer-col a:hover, .footer-col a[aria-current="page"] { color: var(--gold-bright); }
.footer-copy { background: var(--charcoal-deep); border-top: 1px solid rgba(255,255,255,0.06); }
.footer-copy__inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 76px; font-size: 13px; color: var(--on-dark); }
.footer-copy__tags { display: flex; gap: 0; }
.footer-copy__tags span + span { margin-left: 18px; padding-left: 18px; border-left: 1px solid var(--gold); }

/* ==========================================================================
   PAGE: Home
   ========================================================================== */
.home-intro { padding: 18px 0 16px; background: linear-gradient(180deg, #fcfaf6, #f9f6ef); }
.home-intro__grid { display: grid; grid-template-columns: 43% 21% 1fr; align-items: center; }
.home-intro h2 { font-size: clamp(30px, 3.2vw, 46px); white-space: nowrap; }
.dot-list { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; margin-top: 18px; font-size: 17.9px; letter-spacing: 0.02em; color: var(--ink); }
.dot-list li + li::before { content: "·"; display: inline-block; margin: 0 12px; color: var(--gold); font-weight: 700; }
.home-intro__copy { margin: 0; padding-right: 26px; font-size: 13px; line-height: 1.65; color: var(--body-ink); }
.home-intro .icon-grid { padding: 4px 0 4px 40px; border-left: 1px solid var(--hairline); --ig-size: 50px; gap: 12px 6px; }
.home-intro .icon-grid__label { font-size: 9px; letter-spacing: 0.13em; }

.home-about { --split-cols: 40.6% 59.4%; --split-h: 515px; --split-pad-y: 26px; background: var(--ivory); }
.home-about h2 { font-size: clamp(34px, 3.8vw, 54px); line-height: 1.06; }
.home-about .split__text p:not(.eyebrow) { font-size: 17px; line-height: 1.6; color: var(--body-ink); max-width: 500px; }
.home-about .split__media img { object-position: 50% 60%; }

.feature-band { position: relative; isolation: isolate; min-height: 302px; padding: 38px 0 32px; background: var(--charcoal); color: var(--white); overflow: hidden; }
.feature-band__media { position: absolute; z-index: -2; inset: 0 0 0 auto; width: 58%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.feature-band::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #1e1713 0%, #1e1713 42%, rgba(30,23,19,.72) 52%, rgba(30,23,19,.1) 66%, rgba(30,23,19,0) 78%); }
.feature-band h2 { font-size: clamp(32px, 4vw, 58px); white-space: nowrap; }
.feature-band__row { display: flex; align-items: flex-end; gap: 70px; margin-top: 22px; }
.feature-band__row p { margin: 0; max-width: 540px; font-size: 18.5px; line-height: 1.6; color: var(--on-dark); }
.feature-band .btn { margin-bottom: -6px; }

.home-services { padding: 36px 0 40px; }
.home-services .sec-head { margin-bottom: 24px; }
.home-services .grid-4 { --grid-gap: 22px; grid-template-columns: 1.04fr 1fr 0.98fr 1fr; }
.home-services .card__media { aspect-ratio: auto; height: clamp(150px, 15.1vw, 218px); }
.home-services .card__title { --card-title-fs: 23.5px; }

.home-process { background: linear-gradient(90deg, #631115 0%, #6c1316 45%, #671215 100%); }

.work-strip { padding: 34px 0 30px; }
.work-strip__head { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.work-strip__head h2 { font-size: clamp(30px, 3vw, 44px); }
.work-strip__aside { display: flex; align-items: center; gap: 18px; }
.tagline-rule { display: inline-flex; align-items: center; gap: 22px; font: 600 10.5px/1.2 var(--label); letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); }
.tagline-rule::before { content: ""; width: 34px; height: 1px; background: var(--gold); }
.arrow-btns { display: flex; gap: 10px; }
.arrow-btn {
  display: grid; place-items: center;
  width: 52px; height: 52px;
  border: 1px solid var(--gold);
  background: transparent; color: var(--gold); cursor: pointer;
  transition: background-color .2s ease;
}
.arrow-btn:hover { background: rgba(207, 154, 63, 0.1); }
.arrow-btn .icon { width: 18px; height: 18px; }
.work-strip__track { display: grid; grid-template-columns: 0.94fr 1fr 1fr 1.26fr; gap: 14px; }
.thumb { display: block; min-width: 0; }
.thumb__media { aspect-ratio: var(--thumb-ar, 1.64); overflow: hidden; background: #ddd5c8; }
.thumb__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.thumb:hover .thumb__media img { transform: scale(1.03); }
.label-rule {
  display: flex; align-items: center; gap: 16px; margin-top: 14px;
  font: 600 11px/1.3 var(--label); letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink);
}
.label-rule::before { content: ""; width: 26px; height: 1px; background: var(--gold); flex: none; }
.work-strip__track .thumb__media { aspect-ratio: auto; height: clamp(150px, 15.4vw, 222px); }
.work-strip__track.is-shifting .thumb { animation: thumbIn .45s ease; }
@keyframes thumbIn { from { opacity: 0; transform: translateX(var(--shift-from, 14px)); } to { opacity: 1; transform: none; } }

.values-strip { padding: 34px 0; }
.values-strip__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.value { display: flex; align-items: flex-start; gap: 24px; padding: 6px 36px; }
.value:first-child { padding-left: 0; }
.value + .value { border-left: 1px solid var(--hairline); }
.value .icon { width: 82px; height: 82px; color: var(--gold-bright); stroke-width: 1.3; margin-top: 2px; }
.value h3 { font-size: clamp(19px, 1.6vw, 24px); color: var(--white); margin-bottom: 8px; }
.value p { margin: 0; font-size: 16.2px; line-height: 1.55; color: var(--on-dark); }

/* ==========================================================================
   PAGE: About
   ========================================================================== */
.about-who { --split-pad-y: 20px; --split-cols: 44.5% 55.5%; --split-h: 645px; padding: 34px 0 22px; background: var(--white); }
.about-who .split__media { min-height: 0; }
.about-who h2 { font-size: clamp(34px, 3.8vw, 54px); line-height: 1.06; }
.about-who .split__text p:not(.eyebrow) { font-size: 17.4px; line-height: 1.65; max-width: 520px; }
.about-who .split__media img { object-position: 50% 60%; }

.approach { position: relative; isolation: isolate; padding: 48px 0 52px; overflow: hidden; }
.approach__ghost { position: absolute; z-index: -1; right: -2%; top: -8%; width: min(62%, 860px); color: rgba(255, 255, 255, 0.05); }
.approach h2 { font-size: clamp(34px, 3.8vw, 54px); }
.approach__intro { margin: 22px 0 34px; max-width: 700px; font-size: 19px; line-height: 1.6; color: var(--on-dark); }
.pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pillar { padding: 0 40px; }
.pillar:first-child { padding-left: 10px; }
.pillar + .pillar { border-left: 1px solid var(--hairline); }
.pillar .icon { width: 96px; height: 96px; color: var(--gold-bright); stroke-width: 1.35; }
.pillar h3 { margin: 14px 0 10px; font-size: clamp(26.9px, 2.5vw, 37px); color: var(--white); }
.pillar p { margin: 0; font-size: 18.5px; line-height: 1.55; color: var(--on-dark); max-width: 340px; }

.about-services { padding: 46px 0 40px; background: var(--white); }
.about-services h2 { font-size: clamp(34px, 3.8vw, 54px); }
.about-services__intro { margin: 18px 0 30px; max-width: 880px; font-size: 18.5px; line-height: 1.55; }
.about-services .grid-3 { --grid-gap: 20px; }
.about-services .card__media { --card-ar: 1.54; }
.about-services .card__title { --card-title-fs: 26.9px; }

.about-work { padding: 26px 0 24px; background: var(--ivory); }
.about-work__grid { display: grid; grid-template-columns: 34% 1fr 1fr; gap: 16px; align-items: center; }
.about-work__text { padding-right: 34px; }
.about-work h2 { font-size: clamp(32px, 3.3vw, 48px); line-height: 1.05; }
.about-work p { margin: 20px 0 26px; font-size: 17.4px; line-height: 1.6; }
.about-work__media { aspect-ratio: 1.1; overflow: hidden; }
.about-work__media img { width: 100%; height: 100%; object-fit: cover; }

.process-red--about { background: linear-gradient(90deg, #631115 0%, #6e1517 50%, #641215 100%); }

/* ==========================================================================
   PAGE: Services
   ========================================================================== */
.svc-intro { padding: 50px 0 44px; background: var(--ivory-soft); }
.svc-intro__grid { display: grid; grid-template-columns: 55% 1fr; align-items: center; }
.svc-intro h2 { font-size: clamp(30px, 3.4vw, 49px); line-height: 1.1; }
.svc-intro__copy { margin: 14px 0 0; max-width: 610px; font-size: 17.9px; line-height: 1.6; padding-right: 30px; }
.svc-intro .icon-grid { padding-left: 46px; border-left: 1px solid var(--hairline); --ig-size: 60px; gap: 26px 10px; }

.svc-feature { --split-cols: 45% 55%; --split-h: 590px; background: var(--charcoal); color: var(--on-dark); }
.svc-feature .split__text { padding-right: 56px; }
.svc-feature h2 { font-size: clamp(40px, 5.2vw, 75px); line-height: 1.04; color: var(--white); }
.svc-feature h2 .accent { color: var(--gold-bright); }
.svc-feature .split__text > p:not(.eyebrow) { font-size: 18.5px; line-height: 1.6; max-width: 520px; }
.svc-feature .split__media { margin: 16px 0; }
.svc-feature .split__media img { object-position: 50% 62%; }
.check-list { margin: 8px 0 32px; }
.check-list li { display: flex; align-items: center; gap: 14px; font-size: 18px; color: var(--white); }
.check-list li + li { margin-top: 12px; }
.check-list .icon { width: 27px; height: 27px; color: var(--gold-bright); stroke-width: 1.6; }

.svc-duo { padding: 34px 0 42px; }
.svc-duo .grid-2 { --grid-gap: 28px; }
.svc-duo .card__media { --card-ar: 1.88; }
.svc-duo .card__title { --card-title-fs: clamp(30px, 3.5vw, 50px); }
.svc-duo .card__text { --card-text-fs: 17.9px; max-width: 590px; }
.svc-duo .card__body { padding-left: 24px; margin-top: 20px; }

.svc-more { padding: 42px 0 44px; background: var(--ivory-warm); background: linear-gradient(180deg, #f6f0e5 0%, #f3ede1 100%); }
.svc-more .sec-head { margin-bottom: 28px; }
.svc-more .sec-head h2 { font-size: clamp(32px, 3.9vw, 56px); }
.svc-more .grid-4 { --grid-gap: 22px; }
.svc-more .card__media { --card-ar: 1.33; }
.svc-more .card__title { --card-title-fs: 26px; }

.svc-team { padding: 50px 0; background: linear-gradient(90deg, #5c0f13 0%, #6a1216 50%, #5f0f13 100%); }
.svc-team__grid { display: grid; grid-template-columns: 54% 1fr; }
.svc-team__left { padding-right: 60px; }
.svc-team h2 { font-size: clamp(32px, 3.9vw, 56px); }
.svc-team__left p { margin: 22px 0 28px; max-width: 540px; font-size: 19px; line-height: 1.6; color: var(--on-dark); }
.svc-team__right { padding-left: 56px; border-left: 1px solid var(--hairline); display: flex; flex-direction: column; justify-content: center; gap: 30px; }
.benefit { display: flex; align-items: flex-start; gap: 22px; }
.benefit .icon { width: 66px; height: 66px; color: var(--gold-bright); stroke-width: 1.35; }
.benefit h3 { font-size: clamp(19px, 1.6vw, 23px); color: var(--white); margin-bottom: 4px; }
.benefit p { margin: 0; font-size: 16.8px; line-height: 1.5; color: var(--on-dark); }

.svc-cta { --cta-h: 412px; --cta-img-w: 70%; --cta-pos: 50% 70%; }

/* ==========================================================================
   PAGE: Projects
   ========================================================================== */
.proj-featured { padding: 26px 0; background: var(--ivory-soft); }
.proj-featured__grid { display: grid; grid-template-columns: 37% 1fr; gap: 40px; align-items: center; }
.proj-featured h2 { font-size: clamp(34px, 4.2vw, 60px); line-height: 1.05; }
.proj-featured p { margin: 22px 0 28px; max-width: 470px; font-size: 19.5px; line-height: 1.6; }
.proj-featured__media { display: block; aspect-ratio: 1.79; overflow: hidden; }
.proj-featured__media img { width: 100%; height: 100%; object-fit: cover; }

.cat-strip { padding: 40px 0 44px; }
.cat-strip .eyebrow { margin-bottom: 18px; }
.cat-strip__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cat-strip__list li + li { border-left: 1px solid var(--hairline); }
.cat-btn { font: 500 clamp(19px, 1.75vw, 25px)/1.2 var(--serif);
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  width: 100%; padding: 6px 12px 4px;
  background: none; border: 0; cursor: pointer; text-align: center;
  color: var(--white);
  font: 500 clamp(19px, 1.6vw, 23.5px)/1.2 var(--serif);
  transition: color .2s ease;
}
.cat-btn .icon { width: 92px; height: 92px; color: var(--gold-bright); stroke-width: 1.35; }
.cat-btn:hover, .cat-btn[aria-pressed="true"] { color: var(--gold-bright); }

.proj-gallery { padding: 44px 0 30px; }
.proj-gallery__head { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 20px 40px; margin-bottom: 34px; }
.proj-gallery__head h2 { font-size: clamp(34px, 4.45vw, 64px); }
.proj-gallery__head p { margin: 14px 0 0; max-width: 610px; font-size: 17.4px; line-height: 1.55; }
.proj-gallery__nav { display: flex; align-items: center; gap: 30px; padding-bottom: 54px; }
.proj-gallery__nav::before { content: ""; width: 100px; height: 1px; background: var(--gold); }
.proj-gallery__status { min-height: 1.2em; margin: -18px 0 18px; font: 600 11px/1.2 var(--label); letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.proj-gallery .proj-grid { width: min(100vw - 64px, 1376px); margin-left: 50%; transform: translateX(-50%); }
.proj-grid { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 22px 20px; }
.proj-card { grid-column: span 10; margin: 0; min-width: 0; transition: opacity .3s ease; scroll-margin-top: 120px; }
.proj-card:nth-child(1), .proj-card:nth-child(4) { grid-column: span 11; }
.proj-card:nth-child(2), .proj-card:nth-child(3) { grid-column: span 9; }
.proj-card--wide { grid-column: 1 / -1 !important; }
.proj-card.is-dimmed { opacity: .35; }
.proj-card.is-focus .proj-card__media { outline: 2px solid var(--gold); outline-offset: 4px; }
.proj-card__media {
  display: block; width: 100%; padding: 0; border: 0; cursor: zoom-in; background: #ddd5c8;
  height: clamp(200px, 30.6vw, 440px); overflow: hidden;
}
.proj-card--wide .proj-card__media { height: clamp(200px, 33.8vw, 486px); }
.proj-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.proj-card__media:hover img { transform: scale(1.025); }
.proj-card__cap { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.proj-card__cap .label-rule { margin: 0; }
.proj-card__cap .label-rule::before { width: 34px; }
.proj-card__cap .icon { width: 14px; height: 14px; color: var(--gold); }

.proj-process { background: linear-gradient(90deg, #5c0f13 0%, #6b1316 50%, #5c0f13 100%); }

/* ==========================================================================
   PAGE: Contact
   ========================================================================== */
.consult { padding: 28px 0 32px; background: linear-gradient(180deg, #fbfaf8, #f8f5ef); }
.consult__grid { display: grid; grid-template-columns: 1fr 1.05fr 0.88fr; gap: 24px; align-items: start; }
.consult__intro { padding-top: 22px; padding-right: 20px; }
.consult__intro h2 { font-size: clamp(32px, 3.6vw, 52px); line-height: 1.08; margin-bottom: 28px; }
.consult__intro p { font-size: 17.5px; line-height: 1.65; max-width: 450px; }
.consult__intro p + p { margin-top: 18px; }
.form-card { padding: 34px 32px 36px; background: var(--white); border-radius: 3px; box-shadow: 0 1px 2px rgba(60, 40, 20, 0.05), 0 8px 26px rgba(60, 40, 20, 0.06); }
.field { display: block; margin-bottom: 20px; }
.field__label { display: block; margin-bottom: 9px; font: 700 10.5px/1.2 var(--label); letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.field input, .field textarea {
  display: block; width: 100%;
  padding: 12px 14px;
  border: 1px solid #d4cec5; border-radius: 2px;
  background: var(--white); color: var(--ink);
  font: 400 16.8px/1.4 var(--sans);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.field textarea { min-height: 130px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: #a39d96; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(207, 154, 63, 0.18); }
.field.is-invalid input, .field.is-invalid textarea { border-color: var(--button-red); }
.field__error { display: block; min-height: 0; margin-top: 6px; font-size: 14px; color: var(--button-red); }
.field__error:empty { display: none; }
.form-card .btn { width: 100%; justify-content: center; min-height: 56px; margin-top: 8px; border-color: var(--button-red); }
.form-status { margin: 16px 0 0; font-size: 16.2px; line-height: 1.5; color: var(--ink); }
.form-status:empty { display: none; }
.form-status.is-success { padding: 12px 14px; border-left: 2px solid var(--gold); background: #fbf5e9; }
.planning-card { position: relative; padding: 40px 30px 34px 40px; background: var(--beige); background: linear-gradient(180deg, #f4e8d3, #f1e4cc); }
.planning-card::before { content: ""; position: absolute; left: 14px; top: 28px; bottom: 24px; width: 1px; background: var(--gold); }
.planning-card .icon { width: 90px; height: 90px; color: var(--gold); stroke-width: 1.3; margin-bottom: 30px; }
.planning-card h3 { font-size: clamp(26px, 2.5vw, 36px); line-height: 1.12; margin-bottom: 22px; }
.planning-card p { font-size: 16.5px; line-height: 1.65; }
.planning-card p + p { margin-top: 18px; }
.planning-card__rule { display: block; width: 52px; height: 1px; margin-top: 18px; background: var(--gold); }

.next-steps { padding: 44px 0 50px; background: var(--white); }
.next-steps .sec-head { margin-bottom: 40px; }
.next-steps .sec-head h2 { font-size: clamp(32px, 3.8vw, 54px); }
.next-steps__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.next-step { position: relative; padding: 0 40px; }
.next-step:first-child { padding-left: 0; }
.next-step + .next-step { border-left: 1px solid var(--hairline); }
.next-step__top { display: flex; align-items: flex-start; gap: 30px; margin-bottom: 26px; }
.next-step .badge { width: 54px; height: 54px; font-size: 22px; }
.next-step__icon { width: 86px; height: 86px; color: var(--gold); stroke-width: 1.35; margin-top: 8px; }
.next-step h3 { font-size: clamp(24px, 2.2vw, 31px); margin: 0 0 12px 16px; }
.next-step p { margin: 0 0 0 16px; font-size: 17.9px; line-height: 1.6; color: var(--body-ink); max-width: 320px; }
.next-step__arrow { position: absolute; right: -14px; top: 64px; width: 30px; height: 30px; color: var(--gold); stroke-width: 1.2; background: var(--white); }

.contact-about { --split-pad-y: 40px; --split-cols: 42% 58%; --split-h: 608px; background: var(--charcoal-deep); color: var(--on-dark); }
.contact-about .split__text { padding-right: 28px; }
.contact-about h2 { font-size: clamp(38px, 4.3vw, 62px); line-height: 1.02; color: var(--white); }
.contact-about h2 .accent { color: var(--gold-bright); }
.contact-about .split__text > p:not(.eyebrow) { font-size: 18.5px; line-height: 1.6; max-width: 480px; margin-bottom: 26px; }
.contact-about .split__media img { object-position: 50% 62%; }

.contact-cta { padding: 54px 0 52px; }
.contact-cta .cta__grid { display: grid; grid-template-columns: 1fr auto; gap: 20px 40px; align-items: start; }
.contact-cta h2 { font-size: clamp(32px, 4.2vw, 60px); }
.contact-cta p { margin: 18px 0 0; max-width: 620px; font-size: 19px; line-height: 1.6; color: var(--on-dark); }
.contact-cta .btn { margin-top: 18px; }

/* ==========================================================================
   PAGE: Extensions & loft conversions
   ========================================================================== */
.ext-intro { padding: 42px 0 40px; background: var(--ivory-soft); }
.ext-intro__grid { display: grid; grid-template-columns: 53% 1fr; align-items: center; }
.ext-intro h2 { font-size: clamp(32px, 3.75vw, 54px); color: var(--ink-navy); }
.ext-intro__copy { margin: 14px 0 0; padding-right: 50px; font-size: 19px; line-height: 1.62; color: var(--body-ink); }
.ext-intro .icon-grid { padding: 30px 0 30px 30px; border-left: 1px solid var(--hairline); --ig-size: 72px; }
.ext-intro .icon-grid__label { font-size: 10.5px; margin-top: 14px; }

.ext-duo { padding: 30px 0 40px; background: linear-gradient(180deg, #f6f2ea, #f9f6ef); }
.ext-duo .grid-2 { --grid-gap: 34px; }
.ext-duo .card__media { --card-ar: 1.86; }
.ext-duo .card__title { --card-title-fs: clamp(32px, 3.75vw, 54px); color: var(--ink-navy); }
.ext-duo .card__text { --card-text-fs: 20px; max-width: 610px; }
.ext-duo .card__body { margin-top: 22px; }

.ext-turnkey { display: grid; grid-template-columns: 49% 51%; min-height: 619px; background: var(--charcoal); color: var(--on-dark); }
.ext-turnkey__text { padding: 34px 34px 40px var(--edge); display: flex; flex-direction: column; justify-content: center; }
.ext-turnkey h2 { font-size: clamp(36px, 4.45vw, 64px); line-height: 1.06; color: var(--white); }
.ext-turnkey h2 .accent { color: var(--gold-bright); }
.ext-turnkey__text > p:not(.eyebrow) { margin: 22px 0 18px; max-width: 590px; font-size: 19.5px; line-height: 1.6; }
.ext-turnkey .check-list { margin: 4px 0 34px; }
.ext-turnkey__media { position: relative; margin: 28px 0 24px; }
.ext-turnkey__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }

.ext-help { padding: 34px 0 30px; background: var(--ivory-soft); }
.ext-help .sec-head { margin-bottom: 24px; }
.ext-help .sec-head h2 { font-size: clamp(34px, 4vw, 58px); color: var(--ink-navy); }
.ext-help .grid-3 { --grid-gap: 34px 26px; }
.ext-help .card__media { --card-ar: 2.6; }
.ext-help .card__body { border-left: 0; padding: 0; margin-top: 16px; }
.ext-help .card__title { --card-title-fs: 28px; margin-bottom: 8px; }
.ext-help .card__text { --card-text-fs: 18.5px; margin-bottom: 14px; max-width: 360px; }

.ext-recent { padding: 22px 0 30px; background: var(--ivory-soft); }
.ext-recent .sec-head { margin-bottom: 22px; align-items: center; }
.ext-recent .sec-head h2 { font-size: clamp(32px, 3.75vw, 54px); color: var(--ink-navy); }
.ext-recent__track { display: grid; grid-template-columns: 1fr 1.2fr 1fr 1fr; gap: 6px; }
.ext-recent__track .thumb__media { aspect-ratio: auto; height: clamp(130px, 13.3vw, 192px); }
.ext-recent__more { display: flex; justify-content: flex-end; margin-top: 18px; }

.ext-process { background: var(--ivory-soft); padding-top: 34px; }
.ext-process .sec-head h2 { color: var(--ink-navy); }

.faq { padding: 44px 0 40px; }
.faq__grid { display: grid; grid-template-columns: 1.15fr 1fr 1fr 1fr; gap: 0; align-items: start; }
.faq h2 { font-size: clamp(34px, 3.7vw, 53px); line-height: 1.06; }
.faq__item { padding: 0 28px; border-left: 1px solid var(--hairline); }
.faq__q {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  width: 100%; padding: 0; margin: 0 0 12px;
  background: none; border: 0; cursor: pointer; text-align: left;
  font: 600 clamp(19px, 1.6vw, 23.5px)/1.25 var(--serif);
  color: var(--white);
}
.faq__q .icon { width: 28px; height: 28px; color: var(--gold-bright); stroke-width: 1.4; transition: transform .25s ease; }
.faq__q[aria-expanded="false"] .icon { transform: rotate(90deg); opacity: .8; }
.faq__a { font-size: 16.2px; line-height: 1.6; color: var(--on-dark); max-width: 300px; }
.faq__a[hidden] { display: none; }

.ext-cta { --cta-h: 280px; --cta-img-w: 58%; --cta-pos: 50% 58%; padding: 34px 0;
  --cta-shade: linear-gradient(90deg, #6b1117 0%, #741219 38%, rgba(116, 18, 25, .82) 46%, rgba(100, 15, 20, .25) 60%, rgba(70, 10, 14, 0) 72%); }

.svc-more .card__text { --card-text-fs: 17px; }
.home-services .card__text { --card-text-fs: 16.5px; }
/* Extensions page tuning */
.ext-turnkey h2 { white-space: nowrap; }
.ext-help .sec-head__intro, .ext-recent .sec-head__intro { max-width: 640px; }
.ext-cta h2 { font-size: clamp(36px, 4vw, 58px); }
.ext-cta p { margin: 10px 0 20px; }
.hero--ext .hero__sub { font-weight: 500; }

/* ==========================================================================
   Lightbox
   ========================================================================== */
.lightbox {
  width: min(1100px, 92vw); max-height: 92vh;
  padding: 0; border: 1px solid var(--gold);
  background: var(--charcoal-deep); color: var(--on-dark);
}
.lightbox::backdrop { background: rgba(10, 8, 6, 0.86); }
.lightbox__figure { margin: 0; }
.lightbox__img { width: 100%; max-height: 74vh; object-fit: contain; background: #0d0b09; }
.lightbox__cap { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px 20px; }
.lightbox__cap h2 { color: var(--white); font-size: 24px; margin-bottom: 4px; }
.lightbox__cap p { margin: 0; font-size: 16.2px; color: var(--on-dark-muted); }
.lightbox__controls { display: flex; gap: 10px; flex: none; }
.lightbox__close { position: absolute; top: 12px; right: 12px; background: rgba(20,16,13,.75); color: var(--white); }
.lightbox .arrow-btn { color: var(--gold-bright); border-color: var(--gold); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1240px) {
  .site-header__inner { gap: 20px; }
  .brand__name { font-size: 18px; }
  .brand__mark { width: 54px; height: 54px; }
  .site-nav__list { gap: 18px; }
  .home-intro__grid { grid-template-columns: 1fr 1fr; gap: 26px 40px; }
  .home-intro .icon-grid { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--hairline); padding: 24px 0 0; }
  .home-intro h2, .feature-band h2, .process-red__title { white-space: normal; }
  .process-red__head { grid-template-columns: 1fr; }
  .footer-bar { flex-wrap: wrap; }
  .footer-nav { margin-left: 0; order: 3; width: 100%; }
  .footer-tags { margin-left: auto; }
  .faq__grid { grid-template-columns: 1fr 1fr 1fr; gap: 30px 0; }
  .ext-intro .icon-grid { padding-left: 22px; }
  .svc-intro .icon-grid { padding-left: 26px; }
  .svc-intro .icon-grid__label { font-size: 9.5px; letter-spacing: 0.07em; }
  .ext-intro .icon-grid__label { font-size: 9.5px; letter-spacing: 0.07em; }
  .faq__grid > header { grid-column: 1 / -1; }
  .faq__item:nth-child(2) { border-left: 0; padding-left: 0; }
}

@media (max-width: 1040px) {
  :root { --header-h: 70px; }
  .nav-toggle { display: inline-flex; }
  .site-header__cta { display: none; }
  .site-nav {
    position: absolute; top: 100%; left: 0; right: 0;
    margin: 0;
    background: var(--charcoal-deep);
    border-top: 1px solid var(--hairline-soft);
    border-bottom: 1px solid var(--hairline-soft);
    padding: 10px var(--gutter) 26px;
    display: none;
  }
  .nav-open .site-nav { display: block; }
  .site-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .site-nav__link { display: block; padding: 15px 0; font-size: 16px; border-bottom: 1px solid rgba(255,255,255,.07); }
  .site-nav__link.is-active::after { left: 0; bottom: 8px; width: 24px; min-width: 0; transform: none; }
  .site-nav__cta { display: block; margin-top: 20px; }
  .site-nav__cta .btn { width: 100%; justify-content: center; }

  .split, .svc-feature, .home-about, .about-who, .contact-about { --split-cols: 1fr; --split-h: 0; }
  .split__text, .split--reverse .split__text { order: 0; padding: 50px var(--gutter); }
  .split__media { min-height: 0; aspect-ratio: 1.5; }
  .about-who { padding: 0; }
  .svc-feature .split__media { margin: 0; }
  .grid-4, .home-services .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 38px; }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .process-red .step:nth-child(3), .process-split .step:nth-child(3) { border-left: 0; padding-left: 0; }
  .process-compact .step__arrow { display: none; }
  .process-compact .steps { row-gap: 32px; }
  .process-split__grid { grid-template-columns: 1fr; }
  .process-split .step:first-child { padding-left: 0; }
  .values-strip__grid, .pillars { grid-template-columns: 1fr; gap: 28px; }
  .value, .pillar { padding: 0; }
  .value + .value, .pillar + .pillar { border-left: 0; border-top: 1px solid var(--hairline); padding-top: 28px; }
  .work-strip__track { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .about-work__grid { grid-template-columns: 1fr 1fr; }
  .about-work__text { grid-column: 1 / -1; padding: 0 0 10px; }
  .svc-intro__grid, .ext-intro__grid { grid-template-columns: 1fr; gap: 34px; }
  .svc-intro .icon-grid, .ext-intro .icon-grid { border-left: 0; border-top: 1px solid var(--hairline); padding: 28px 0 0; }
  .svc-team__grid { grid-template-columns: 1fr; gap: 40px; }
  .svc-team__left { padding: 0; }
  .svc-team__right { padding: 36px 0 0; border-left: 0; border-top: 1px solid var(--hairline); }
  .proj-featured__grid { grid-template-columns: 1fr; }
  .proj-featured { padding: 46px 0; }
  .cat-strip__list { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 28px; }
  .cat-strip__list li:nth-child(4) { border-left: 0; }
  .consult__grid { grid-template-columns: 1fr 1fr; }
  .consult__intro { grid-column: 1 / -1; padding-top: 10px; }
  .next-steps__grid { grid-template-columns: 1fr; gap: 34px; }
  .next-step, .next-step:first-child { padding: 0; }
  .next-step + .next-step { border-left: 0; border-top: 1px solid var(--hairline); padding-top: 34px; }
  .next-step__arrow { display: none; }
  .ext-turnkey { grid-template-columns: 1fr; min-height: 0; }
  .ext-turnkey h2 { white-space: normal; }
  .ext-turnkey__text { padding: 50px var(--gutter); }
  .ext-turnkey__media { margin: 0; aspect-ratio: 1.5; }
  .ext-help .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ext-recent__track { grid-template-columns: 1fr 1fr; }
  .footer-expanded { grid-template-columns: 1fr 1fr; gap: 40px 0; }
  .footer-expanded__brand { grid-column: 1 / -1; }
  .footer-col:nth-child(2) { padding-left: 0; }
  .footer-col:nth-child(3) { border-right: 0; }
  .footer-col:last-child { grid-column: 1 / -1; padding-left: 0; }
  .feature-band__media { width: 100%; }
  .feature-band::before { background: linear-gradient(90deg, rgba(30,23,19,.95) 0%, rgba(30,23,19,.85) 60%, rgba(30,23,19,.55) 100%); }
  .feature-band__row { flex-wrap: wrap; gap: 26px; }
  .cta--red .cta__grid, .cta--cream .cta__grid, .contact-cta .cta__grid { grid-template-columns: 1fr; }
  .cta--red .cta__text { margin-top: 0; }
  .cta--photo { --cta-img-w: 100%; }
  .cta--photo::before { background: linear-gradient(90deg, rgba(20,16,13,.94) 0%, rgba(20,16,13,.8) 60%, rgba(20,16,13,.55) 100%); }
  .ext-cta::before { background: linear-gradient(90deg, rgba(107,17,23,.96) 0%, rgba(107,17,23,.86) 60%, rgba(107,17,23,.6) 100%) !important; }
  .hero { --hero-img-w: 100%; min-height: 0; padding-bottom: 64px; }
  .hero::before { background: linear-gradient(90deg, rgba(20,16,13,.94) 0%, rgba(20,16,13,.82) 55%, rgba(20,16,13,.45) 100%); }
}

@media (max-width: 680px) {
  body { font-size: 15.5px; }
  .brand__name { font-size: 15px; letter-spacing: 0.1em; }
  .brand__mark { width: 46px; height: 46px; }
  .hero h1 { font-size: clamp(40.3px, 11.8vw, 53.8px); }
  .hero__sub { font-size: 20.2px; }
  .br-desktop { display: none; }
  .sec-head, .proj-gallery__head { grid-template-columns: 1fr; }
  .sec-head__intro { justify-self: start; }
  .grid-4, .home-services .grid-4, .grid-3, .grid-2, .ext-help .grid-3 { grid-template-columns: 1fr; }
  .home-intro__grid { grid-template-columns: 1fr; }
  .home-intro__copy { padding: 0; }
  .icon-grid, .home-intro .icon-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps { grid-template-columns: 1fr; }
  .step, .step:first-child, .process-red .step:nth-child(3), .process-split .step:first-child { padding: 0; border-left: 0; }
  .step + .step { border-left: 0; border-top: 1px solid var(--hairline); padding-top: 32px; }
  .process-compact .step + .step { border-top: 0; padding-top: 0; }
  .process-split .step { align-items: flex-start; text-align: left; }
  .work-strip__head { flex-direction: column; align-items: flex-start; }
  .work-strip__aside { width: 100%; justify-content: space-between; }
  .tagline-rule { gap: 12px; font-size: 9.5px; letter-spacing: .16em; }
  .tagline-rule::before { width: 20px; }
  .work-strip__track, .ext-recent__track { grid-template-columns: 1fr 1fr; gap: 12px; }
  .work-strip__track .thumb__media, .ext-recent__track .thumb__media { height: 130px; }
  .label-rule { font-size: 9.5px; letter-spacing: .14em; gap: 8px; }
  .label-rule::before { width: 14px; }
  .about-work__grid { grid-template-columns: 1fr; }
  .cat-strip__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cat-strip__list li:nth-child(odd) { border-left: 0; }
  .cat-strip__list li:nth-child(4) { border-left: 1px solid var(--hairline); }
  .proj-grid { grid-template-columns: 1fr; }
  .proj-card { grid-column: 1 / -1 !important; }
  .proj-card .proj-card__media, .proj-card--wide .proj-card__media { height: auto; aspect-ratio: 1.5; }
  .proj-gallery__nav { padding-bottom: 0; }
  .proj-gallery__nav::before { width: 40px; }
  .consult__grid { grid-template-columns: 1fr; }
  .form-card { padding: 26px 20px; }
  .faq__grid { grid-template-columns: 1fr; }
  .faq__item, .faq__item:nth-child(2) { border-left: 0; border-top: 1px solid var(--hairline); padding: 22px 0 0; }
  .footer-bar { flex-direction: column; align-items: flex-start; gap: 22px; }
  .footer-bar .brand__mark, .footer-expanded .brand__mark { width: 64px; height: 64px; }
  .footer-bar .brand__name, .footer-expanded .brand__name { font-size: 16px; }
  .footer-tags { flex-direction: column; align-items: flex-start; }
  .footer-tags span + span { padding-left: 0; border-left: 0; }
  .footer-tags { margin-left: 0; padding-left: 0; border-left: 0; flex-wrap: wrap; gap: 12px 18px; }
  .footer-tags span + span { padding-left: 18px; }
  .footer-expanded { grid-template-columns: 1fr; gap: 30px; }
  .footer-col, .footer-col:nth-child(2) { padding: 0; border-right: 0; }
  .footer-copy__inner { flex-direction: column; align-items: flex-start; justify-content: center; padding: 20px 0; }
  .footer-copy__tags { flex-wrap: wrap; }
  .btn { white-space: normal; text-align: left; }
  .value { gap: 18px; }
  .value .icon { width: 46px; height: 46px; }
  .lightbox__cap { flex-direction: column; align-items: flex-start; }
  .feature-band h2 { font-size: 34px; }
  .ext-turnkey h2 { font-size: clamp(28px, 8.6vw, 40px); }
}