/*
 * Housing Network — platform stylesheet.
 *
 * Design direction: premium real-estate intelligence + research/discovery
 * platform + high-trust advisory brand. Editorial, calm, information-rich,
 * generous whitespace, restrained cards, serif display + system sans body.
 *
 * No web fonts, no framework, no icon font. One breakpoint system, mobile-first.
 * Microsite components live in microsite.css (loaded only where needed).
 */

/* ============================================================= TOKENS ===== */
:root {
  /* Approved HousingNetwork brand palette (Task 13) — the five physical
     brand colours. Everything else below maps onto these; change the
     brand here, not at each call site. */
  --color-graphite: #1F2930;
  --color-teal: #2F6F6A;
  --color-teal-ink: #2a5a59;        /* darkened teal for hover/active states */
  --color-warm-paper: #F6F1E8;
  --color-stone: #B7B3AA;
  --color-copper: #B8734E;

  /* Brand + surface (semantic aliases onto the physical tokens above) */
  --color-bg: var(--color-warm-paper);
  --color-surface: #ffffff;
  --color-surface-2: #ebe6dd;       /* warm paper tinted with stone */
  --color-ink: var(--color-graphite);
  --color-ink-2: #39444b;           /* lightened graphite — secondary text */
  --color-muted: #5f6b74;           /* graphite-family muted text, AA on bg */
  --color-border: #e6e2d9;          /* warm paper tinted lightly with stone */
  --color-border-strong: var(--color-stone);

  --color-primary: var(--color-teal);
  --color-primary-ink: var(--color-teal-ink);
  --color-primary-contrast: #ffffff;
  --color-accent: var(--color-copper); /* editorial highlight, non-text only */
  --color-link: var(--color-teal);
  --color-link-hover: var(--color-teal-ink);

  /* Dark surfaces (footer, dark CTA bands) — on-graphite text tokens */
  --color-on-dark-bg: var(--color-graphite);
  --color-on-dark-fg: var(--color-warm-paper);
  --color-on-dark-muted: var(--color-stone);

  /* Evidence / verification (calm, never alarming) */
  --color-verified-fg: #1c6b4a;
  --color-verified-bg: #e9f4ee;
  --color-indicative-fg: #7a5f16;
  --color-indicative-bg: #faf2dd;
  --color-awaiting-fg: #55595d;
  --color-awaiting-bg: #eeece8;

  /* Status (project lifecycle) */
  --color-status-fg: #33506b;
  --color-status-bg: #e9eff4;

  /* Typography */
  --font-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, ui-serif, serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, Consolas, monospace;

  --step--1: clamp(0.83rem, 0.80rem + 0.12vw, 0.90rem);
  --step-0:  clamp(1rem, 0.96rem + 0.18vw, 1.08rem);
  --step-1:  clamp(1.20rem, 1.12rem + 0.40vw, 1.42rem);
  --step-2:  clamp(1.45rem, 1.30rem + 0.75vw, 1.90rem);
  --step-3:  clamp(1.75rem, 1.48rem + 1.35vw, 2.60rem);
  --step-4:  clamp(2.10rem, 1.60rem + 2.50vw, 3.60rem);

  /* Spacing scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6.5rem;

  /* Radius + shadow */
  --radius-1: 4px;
  --radius-2: 8px;
  --radius-3: 14px;
  --shadow-1: 0 1px 2px rgba(26, 28, 30, 0.05), 0 1px 3px rgba(26, 28, 30, 0.06);
  --shadow-2: 0 6px 20px rgba(26, 28, 30, 0.08);

  /* Widths */
  --width-prose: 42rem;
  --width-content: 62rem;
  --width-wide: 82.5rem; /* ~1320px — broad editorial canvas (Task 13 final pass) */

  --header-h: 4rem;
}

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

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

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-ink);
  font-family: var(--font-sans);
  font-size: var(--step-0);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4 {
  font-family: var(--font-serif);
  font-weight: 600;
  line-height: 1.15;
  color: var(--color-ink);
  margin: 0 0 var(--space-4);
  letter-spacing: -0.01em;
}
h1 { font-size: var(--step-3); }
h2 { font-size: var(--step-2); }
h3 { font-size: var(--step-1); }
h4 { font-size: var(--step-0); font-family: var(--font-sans); font-weight: 700; }

p { margin: 0 0 var(--space-4); }

a { color: var(--color-link); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--color-link-hover); }

:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: 2px;
}

hr { border: 0; border-top: 1px solid var(--color-border); margin: var(--space-7) 0; }

/* ============================================================ LAYOUT ====== */
.container { width: 100%; max-width: var(--width-content); margin-inline: auto; padding-inline: var(--space-4); }
.container--wide { max-width: var(--width-wide); }
.container--prose { max-width: var(--width-prose); }

.section { padding-block: var(--space-7); }
.section + .section { border-top: 1px solid var(--color-border); }
.section--tint { background: var(--color-surface-2); }
.section--tight { padding-block: var(--space-4); }
.section__head { max-width: var(--width-prose); margin-bottom: var(--space-6); }
.page-section--projects .section__head { max-width: 66rem; }
.section__eyebrow {
  display: inline-flex; align-items: center; gap: 0.65em;
  font-family: var(--font-sans);
  font-size: var(--step--1);
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--color-primary);
  margin: 0 0 var(--space-2);
}
.section__eyebrow::before {
  content: ""; display: inline-block; width: 1.5rem; height: 1px;
  background: var(--color-copper); flex: none;
}
.lede { font-size: var(--step-1); line-height: 1.5; color: var(--color-ink-2); }
.muted { color: var(--color-muted); }
.stack > * + * { margin-top: var(--space-4); }

main { display: block; }

/* Skip link */
.skip-link {
  position: absolute; left: var(--space-3); top: -4rem;
  background: var(--color-surface); color: var(--color-ink);
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-1);
  z-index: 100; transition: top 0.15s ease;
}
.skip-link:focus { top: var(--space-3); }

/* ============================================================ HEADER ====== */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--color-bg) 92%, transparent);
  backdrop-filter: saturate(1.4) blur(8px);
  border-bottom: 1px solid var(--color-border);
}
.site-header__inner {
  display: flex; align-items: center; gap: var(--space-4);
  min-height: var(--header-h);
}
.brand { display: inline-flex; align-items: center; text-decoration: none; }
.brand__logo { height: 2.5rem; width: auto; display: block; }
@media (max-width: 60rem) { .brand__logo { height: 2.15rem; } }

.header-actions { margin-left: auto; display: flex; align-items: center; gap: var(--space-3); }

.nav-toggle {
  margin-left: auto;
  display: inline-flex; align-items: center; gap: var(--space-2);
  background: transparent; border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-1); padding: var(--space-2) var(--space-3);
  font: inherit; font-size: var(--step--1); color: var(--color-ink); cursor: pointer;
  min-height: 44px;
}
.nav-toggle__bars { width: 18px; height: 2px; background: currentColor; position: relative; display: block; }
.nav-toggle__bars::before, .nav-toggle__bars::after {
  content: ""; position: absolute; left: 0; width: 18px; height: 2px; background: currentColor;
}
.nav-toggle__bars::before { top: -5px; } .nav-toggle__bars::after { top: 5px; }

.primary-nav ul { list-style: none; margin: 0; padding: 0; }
.primary-nav a {
  display: block; text-decoration: none; color: var(--color-ink-2);
  font-size: var(--step--1); font-weight: 600;
  padding: var(--space-3) 0;
}
.primary-nav a:hover { color: var(--color-primary); }
.primary-nav a[aria-current="page"] { color: var(--color-primary); }

@media (max-width: 60rem) {
  .primary-nav {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--color-surface); border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-2);
  }
  .primary-nav.is-open { display: block; }
  .primary-nav ul { padding: var(--space-2) var(--space-4) var(--space-4); }
  .primary-nav li + li { border-top: 1px solid var(--color-border); }
  .primary-nav a { padding: var(--space-4) 0; font-size: var(--step-0); }
  .header-actions { display: none; }
}
@media (min-width: 60.01rem) {
  .nav-toggle { display: none; }
  .site-header__inner { gap: var(--space-6); }
  .primary-nav { margin-left: auto; }
  .primary-nav ul { display: flex; gap: var(--space-5); }
}

/* ======================================================= BUTTONS / CTA ==== */
.btn {
  --_bg: var(--color-surface); --_fg: var(--color-ink); --_bd: var(--color-border-strong);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: 44px; padding: var(--space-3) var(--space-5);
  background: var(--_bg); color: var(--_fg);
  border: 1px solid var(--_bd); border-radius: var(--radius-1);
  font: inherit; font-size: var(--step--1); font-weight: 700;
  text-decoration: none; cursor: pointer; text-align: center;
  transition: transform 0.06s ease, background-color 0.15s ease;
}
.btn:hover { color: var(--_fg); }
.btn:active { transform: translateY(1px); }
.btn--primary { --_bg: var(--color-primary); --_fg: var(--color-primary-contrast); --_bd: var(--color-primary); }
.btn--primary:hover { --_bg: var(--color-primary-ink); }
.btn--ghost { --_bg: transparent; --_bd: transparent; text-decoration: underline; }
.btn--lg { min-height: 52px; padding: var(--space-4) var(--space-6); font-size: var(--step-0); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; }
.btn-row { display: flex; flex-wrap: wrap; gap: var(--space-3); }

/* ============================================= HOMEPAGE COMPOSITION ====== */
/* The homepage is deliberately an editorial sequence: open spread, compact
   positioning strip, feature story, evidence clarity, then corridor imagery.
   Its elements use the shared tokens and media/badge primitives, but layout
   remains local to this page so project microsites never inherit its look. */
.hero--hn {
  display: grid;
  width: min(100%, 100rem);
  margin-inline: auto;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-warm-paper);
}
.hero__text { padding-block: 1.5rem; display: flex; align-items: center; height: 100%; overflow: hidden; }
.hero__text-inner {
  max-width: 46rem;
  padding-inline: clamp(var(--space-4), 4vw, var(--space-7));
}
.hero__title { font-size: clamp(2.3rem, 1.5rem + 2.15vw, 4.35rem); line-height: 1.01; margin-bottom: var(--space-3); white-space: normal; letter-spacing: -0.04em; }
.hero__sub { font-size: var(--step-0); line-height: 1.5; color: var(--color-ink-2); max-width: 42ch; margin-bottom: 0; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); margin-top: var(--space-4); }
.hero__link {
  display: inline-flex; align-items: center; gap: 0.4em;
  font-weight: 700; font-size: var(--step--1); color: var(--color-ink-2);
  text-decoration: none; border-bottom: 1px solid var(--color-border-strong);
  padding-bottom: 0.2rem;
}
.hero__link:hover { color: var(--color-primary); border-color: var(--color-primary); }

.hero__visual { position: relative; min-height: 14rem; background: var(--color-surface-2); }
.hero__media { margin: 0; height: 100%; }
.hero__media .hn-media__picture { height: 100%; }
.hero__media .hn-media__picture img { min-height: 14rem; }

/* Editorial overlay caption on the hero image — top-right, clear of the
   mandatory disclosure chip which stays bottom-left. Real, accurate copy
   only (no invented stats), same architectural poster voice as the brand
   mark itself. */
.hero__overlay {
  position: absolute; top: var(--space-4); right: var(--space-4); z-index: 1;
  max-width: 13rem; text-align: right; color: #fff;
  text-shadow: 0 1px 8px rgba(15, 20, 24, 0.45);
}
.hero__overlay p {
  margin: 0; text-transform: uppercase; letter-spacing: 0.1em;
  font-size: var(--step--1); font-weight: 700; line-height: 1.45;
}
.hero__overlay-primary { color: #fff; }
.hero__overlay-secondary {
  margin-top: 0.5em !important; padding-top: 0.5em;
  border-top: 1px solid rgba(255, 255, 255, 0.4);
  color: var(--color-warm-paper) !important;
}
@media (max-width: 40rem) { .hero__overlay { display: none; } }

@media (min-width: 64rem) {
  .hero--hn { grid-template-columns: minmax(34rem, 0.98fr) minmax(0, 1.02fr); height: clamp(29rem, 42vw, 43rem); border-bottom: none; }
  .hero__text { border-right: 1px solid var(--color-border); }
  .hero__visual { min-height: 0; height: 100%; }
  .hero__media .hn-media__picture img { min-height: 0; height: 100%; }
}
@media (min-width: 90rem) {
  .hero__text-inner { padding-inline: clamp(var(--space-6), 5vw, 5.5rem); }
  .hero__sub { max-width: 48ch; font-size: var(--step-1); }
}

/* --------------------------------------------------------- TRUST STRIP -- */
/* A compact evidence band directly under the hero: useful orientation without
   competing with the primary decision and project CTA. */
.trust-strip { border-bottom: 1px solid var(--color-border); background: var(--color-bg); }
.trust-strip__inner {
  max-width: 100rem;
  margin-inline: auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4) var(--space-4);
  padding-block: var(--space-4);
}
.trust-strip__item { padding-inline-start: var(--space-4); border-left: 1px solid var(--color-border); }
.trust-strip__item:nth-child(1) { border-left: none; padding-inline-start: 0; }
.trust-strip__label {
  margin: 0 0 0.2em; text-transform: uppercase; letter-spacing: 0.08em;
  font-size: 0.78rem; font-weight: 700; color: var(--color-ink);
}
.trust-strip__item p:last-child { margin: 0; color: var(--color-muted); font-size: 0.82rem; }
@media (max-width: 55.99rem) {
  /* 2-column mobile layout: item 3 starts the second row without a divider. */
  .trust-strip__item:nth-child(3) { border-left: none; padding-inline-start: 0; }
}
@media (min-width: 56rem) {
  .trust-strip__inner { grid-template-columns: repeat(3, 1fr); }
}

/* ---------------------------------------------------- SPEC BAND (evidence) */
.spec-band {
  display: grid; gap: 0; border: 1px solid var(--color-border); background: var(--color-surface);
}
.spec-band__item { padding: var(--space-5); }
.spec-band__item + .spec-band__item { border-top: 1px solid var(--color-border); }
.spec-band__item h3 { margin: 0 0 var(--space-2); font-size: var(--step-0); }
.spec-band__item p { margin: 0; color: var(--color-muted); }
.spec-band__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.75rem; height: 2.75rem; border-radius: 50%; color: #fff;
  margin-bottom: var(--space-3);
}
.spec-band__icon svg { width: 1.3em; height: 1.3em; }
.spec-band__icon--verified { background: var(--color-verified-fg); }
.spec-band__icon--indicative { background: var(--color-indicative-fg); }
.spec-band__icon--awaiting { background: var(--color-awaiting-fg); }
@media (min-width: 56rem) {
  .spec-band { grid-template-columns: repeat(3, 1fr); }
  .spec-band__item + .spec-band__item { border-top: none; border-left: 1px solid var(--color-border); }
}

/* ------------------------------------------------------ EVIDENCE STRIP -- */
/* Lean horizontal variant for the homepage — intro column + three plain
   (no card chrome) status items, matching the approved mockup's evidence
   band exactly. Deliberately tight — budgeted to ~120-150px total on
   desktop including its section padding. The fuller card-style .spec-band
   above remains available for other pages (e.g. About). */
.evidence-strip { display: grid; gap: var(--space-5); }
.evidence-strip__intro { max-width: 19rem; }
.evidence-strip__intro h2 { margin: 0; font-size: 1.6rem; line-height: 1.2; }
.evidence-strip__items {
  display: grid; gap: var(--space-4);
  border-top: 1px solid var(--color-border); padding-top: var(--space-4);
}
.evidence-strip__item h3 { margin: 0 0 0.2em; font-size: 0.95rem; }
.evidence-strip__item p { margin: 0; color: var(--color-muted); font-size: 0.82rem; line-height: 1.35; }
.evidence-strip__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2rem; height: 2rem; border-radius: 50%; color: #fff; margin-bottom: 0.4em;
}
.evidence-strip__icon svg { width: 1.1em; height: 1.1em; }
.evidence-strip__icon--verified { background: var(--color-verified-fg); }
.evidence-strip__icon--indicative { background: var(--color-indicative-fg); }
.evidence-strip__icon--awaiting { background: var(--color-awaiting-fg); }
@media (min-width: 56rem) {
  .evidence-strip { grid-template-columns: 0.85fr 2fr; align-items: center; }
  .evidence-strip__items { grid-template-columns: repeat(3, 1fr); border-top: none; padding-top: 0; border-left: 1px solid var(--color-border); padding-left: var(--space-6); }
}

/* -------------------------------------------------------- EDITORIAL LIST -- */
.editorial-list { border-top: 1px solid var(--color-border); list-style: none; margin: 0; padding: 0; }
.editorial-list__item {
  display: grid; grid-template-columns: 3rem 1fr; gap: var(--space-4);
  padding-block: var(--space-5); border-bottom: 1px solid var(--color-border);
}
.editorial-list__index { font-family: var(--font-mono); font-size: var(--step--1); color: var(--color-copper); font-weight: 700; padding-top: 0.2em; }
.editorial-list__item h3 { margin: 0 0 var(--space-2); font-size: var(--step-0); }
.editorial-list__item p { margin: 0; color: var(--color-muted); max-width: 42rem; }

/* On-dark variant — used inside the featured-project panel. Deliberately
   tight (small padding, small type): the whole featured-project section is
   budgeted to ~260px on desktop — see DEV_HANDOFF.md Task 13 final pass. */
.editorial-list--on-dark { border-top-color: rgba(255, 255, 255, 0.18); }
.editorial-list--on-dark .editorial-list__item {
  grid-template-columns: 1.75rem 1fr; gap: var(--space-3);
  border-bottom-color: rgba(255, 255, 255, 0.18); padding-block: 0.4rem;
}
.editorial-list--on-dark .editorial-list__index { font-size: 0.72rem; }
.editorial-list--on-dark .editorial-list__item h3 { color: #fff; margin: 0; font-size: 0.85rem; font-weight: 600; }

/* ------------------------------------------------------ FEATURED PROJECT -- */
/* Premium image-led "lead story" treatment for the primary featured project;
   additional projects (once there are more) fall back to the plain
   .project-card grid below this block — see templates/pages/home.php. A
   fixed desktop height (not aspect-ratio-driven) keeps this a wide,
   cinematic band rather than a tall block — the image is deliberately
   letterboxed via object-fit: cover. */
.feature-project {
  display: grid; gap: var(--space-3); background: transparent;
}
.feature-project__media {
  position: relative; min-height: 0; aspect-ratio: 4 / 3;
  overflow: hidden; border: 1px solid var(--color-border);
}
.feature-project__picture-host { position: absolute; inset: 0; margin: 0; }
.feature-project__media .hn-media__picture, .feature-project__media .hn-media__picture img { height: 100%; }
.feature-project__badge { position: absolute; top: var(--space-3); right: var(--space-3); z-index: 2; }
.feature-project__scrim {
  position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; justify-content: flex-end;
  /* Extra bottom padding reserves room for the disclosure chip
     (.hn-media__disclosure, positioned absolute bottom-left, z-index 2) so it
     never overlaps the CTA button below the project name/meta. */
  padding: var(--space-4); padding-bottom: calc(var(--space-4) + 2.25rem); color: #fff;
  background: linear-gradient(0deg, rgba(15, 20, 24, 0.86) 0%, rgba(15, 20, 24, 0.25) 60%, transparent 85%);
}
.feature-project__eyebrow {
  text-transform: uppercase; letter-spacing: 0.09em; font-weight: 700;
  font-size: 0.75rem; color: var(--color-stone); margin: 0 0 0.3em;
}
.feature-project__scrim h2 { color: #fff; margin: 0 0 0.3em; font-size: 1.85rem; line-height: 1.08; }
.feature-project__meta {
  display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4);
  font-size: 0.82rem; color: rgba(255, 255, 255, 0.88); margin: 0 0 var(--space-3);
}
.feature-project__panel {
  background: var(--color-teal); color: var(--color-warm-paper);
  padding: var(--space-5) var(--space-6); display: flex; flex-direction: column; justify-content: center;
}
.feature-project__panel .section__eyebrow { color: var(--color-copper); margin-bottom: 0.4em; }
.feature-project__panel h2 { color: var(--color-warm-paper); font-size: clamp(1.7rem, 1.3rem + 0.7vw, 2.1rem); line-height: 1.08; margin-bottom: 0.45em; }
.feature-project__panel > p { color: color-mix(in srgb, var(--color-warm-paper) 78%, transparent); font-size: 0.9rem; line-height: 1.4; margin-bottom: 0.8em; max-width: 35ch; }
.feature-project__scrim .btn--primary { --_bg: var(--color-warm-paper); --_fg: var(--color-graphite); --_bd: var(--color-warm-paper); }
.feature-project__scrim .btn--primary:hover { --_bg: var(--color-stone); --_bd: var(--color-stone); }
@media (min-width: 56rem) {
  .feature-project {
    grid-template-columns: minmax(0, 58%) minmax(0, 42%);
    gap: 14px; height: 300px;
  }
  .feature-project__media { min-height: 0; height: 100%; aspect-ratio: auto; }
  .feature-project__panel { padding: var(--space-4) var(--space-6); overflow: hidden; }
}

/* ------------------------------------------------- CORRIDOR DISCOVERY -- */
.corridor-discovery { display: grid; gap: var(--space-6); }
.corridor-discovery__intro { max-width: 20rem; }
.corridor-discovery__intro p:not(.section__eyebrow) { color: var(--color-muted); }
.corridor-discovery__coverage { font-size: var(--step--1); font-weight: 700; color: var(--color-ink-2) !important; }
.corridor-discovery__grid {
  display: grid; gap: var(--space-4); grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none;
}
.corridor-card { position: relative; border: 1px solid var(--color-border); overflow: hidden; background: var(--color-surface); }
.corridor-card__media { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; }
.corridor-card__media .hn-media__picture { height: 100%; }
.corridor-card__body { padding: var(--space-3); }
.corridor-card__label {
  display: block; text-transform: uppercase; letter-spacing: 0.08em;
  font-size: 0.7rem; font-weight: 700; color: var(--color-copper); margin-bottom: 0.3em;
}
.corridor-card__body h3 { margin: 0; font-size: 0.95rem; line-height: 1.25; }
.corridor-discovery__disclosure { grid-column: 1 / -1; margin: var(--space-3) 0 0; font-size: 0.8rem; color: var(--color-muted); }
@media (max-width: 39.99rem) {
  .corridor-discovery__grid {
    display: flex; gap: 14px; overflow-x: auto; overflow-y: hidden;
    padding-bottom: var(--space-2); scroll-snap-type: x mandatory;
    scroll-padding-inline: 1px; -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .corridor-discovery__grid::-webkit-scrollbar { display: none; }
  .corridor-card { flex: 0 0 82vw; max-width: 82vw; scroll-snap-align: start; }
  .corridor-card__media { aspect-ratio: 16 / 10; }
  .corridor-discovery__disclosure { margin-top: var(--space-2); }
}
@media (min-width: 40rem) { .corridor-discovery__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 64rem) {
  .corridor-discovery { grid-template-columns: minmax(13rem, 0.85fr) minmax(0, 2.4fr); align-items: start; }
  .corridor-discovery__grid { grid-template-columns: repeat(4, 1fr); }
}

.hn-media { margin: 0; min-width: 0; }
.hn-media__picture, .hn-media__picture img { display: block; width: 100%; height: 100%; }
.hn-media__picture img { object-fit: cover; }
.hn-media__disclosure {
  display: table; max-width: calc(100% - (var(--space-4) * 2));
  margin: var(--space-3); padding: 0.28rem 0.65rem;
  border: 1px solid var(--color-border); border-radius: 999px;
  background: color-mix(in srgb, var(--color-surface) 94%, transparent); color: var(--color-ink-2);
  font-size: 0.78rem; line-height: 1.3;
}
.hn-media--fallback {
  min-height: 15rem; padding: var(--space-5); display: grid; place-items: center;
  background: linear-gradient(150deg, var(--color-surface-2), var(--color-surface));
  color: var(--color-muted); text-align: center; font-size: var(--step--1);
}
.hero__media .hn-media__picture { height: 100%; }
.hero__media .hn-media__picture img { min-height: 15rem; }
.hero__media .hn-media__disclosure,
.project-card__media .hn-media__disclosure,
.feature-project__media .hn-media__disclosure,
.corridor-card__media .hn-media__disclosure {
  position: absolute; left: var(--space-3); right: auto; bottom: var(--space-3); z-index: 2;
  margin: 0; border-color: rgba(255,255,255,0.20);
  background: rgba(18, 24, 29, 0.82); color: #fff;
  box-shadow: 0 0.2rem 0.65rem rgba(0,0,0,0.16);
}
/* ============================================================= CARDS ====== */
.card-grid { display: grid; gap: var(--space-5); grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none; }
@media (min-width: 40rem) { .card-grid--2 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 56rem) { .card-grid--3 { grid-template-columns: repeat(3, 1fr); } }

.card {
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: var(--radius-2); padding: var(--space-5);
  display: flex; flex-direction: column; gap: var(--space-2);
}
.card--link { transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.card--link:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-1); }
.card h3 { margin: 0; }
.card h3 a { text-decoration: none; }
.card h3 a::after { content: ""; position: absolute; inset: 0; }
.card { position: relative; }
.card p { margin: 0; color: var(--color-muted); font-size: var(--step--1); }
.card__meta { font-size: var(--step--1); color: var(--color-muted); margin-top: auto; padding-top: var(--space-3); }
.project-card { padding: 0; overflow: hidden; }
.project-card__media { position: relative; aspect-ratio: 16 / 9; }
.project-card__media .hn-media__picture, .project-card__media .hn-media__picture img { height: 100%; }
.project-card__body { display: flex; flex: 1; flex-direction: column; gap: var(--space-2); padding: var(--space-5); }
.project-card__body h2, .project-card__body h3 { margin: 0; }
.project-card__labels { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); }
.project-card__type {
  display: inline-flex; align-items: center; min-height: 1.8rem; padding-inline: 0.65em;
  border: 1px solid var(--color-border); border-radius: 999px; color: var(--color-ink-2);
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
}
.project-card__cta {
  display: inline-flex; align-items: center; gap: var(--space-2); margin-top: var(--space-3);
  color: var(--color-primary); font-size: var(--step--1); font-weight: 700; text-decoration: none;
}
.project-card__cta:hover { color: var(--color-primary-ink); text-decoration: underline; }
.project-category-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin: var(--space-6) 0 var(--space-7); }
.project-category-nav button { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-height: 4.4rem; padding: var(--space-4); border: 1px solid var(--color-border-strong); border-radius: var(--radius-2); background: var(--color-surface); color: var(--color-ink); font: inherit; text-align: left; cursor: pointer; }
.project-category-nav button:hover, .project-category-nav button:focus-visible { border-color: var(--color-primary); box-shadow: var(--shadow-1); }
.project-category-nav button[aria-selected="true"] { border-color: var(--color-primary); background: var(--color-primary); color: #fff; }
.project-category-nav button[aria-selected="true"] span,
.project-category-nav button[aria-selected="true"] strong { color: #fff; }
.project-category-nav span { font-family: var(--font-serif); font-size: var(--step-1); }
.project-category-nav strong { color: var(--color-primary); font-size: var(--step--1); white-space: nowrap; }
.project-category[hidden] { display: none; }
.project-category { scroll-margin-top: 6rem; padding-top: var(--space-7); border-top: 1px solid var(--color-border); }
.project-category + .project-category { margin-top: var(--space-8); }
.project-category__head { margin-bottom: var(--space-5); }
.project-category__head h2 { margin: 0; }
@media (max-width: 30rem) { .project-category-nav button { align-items: flex-start; flex-direction: column; justify-content: center; } }
@media (min-width: 64rem) {
  /* Residential and commercial share one project-grid system — commercial
     must never get its own narrower/differently-columned grid. */
  .card-grid--projects { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .card-grid--projects > :last-child:nth-child(3n + 1) { grid-column: 2; }
}

/* A restrained route into the seven-record launch portfolio: deliberately a
   single editorial signpost, never a duplicate project directory. */
.home-project-discovery { border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.home-project-discovery__inner { display: grid; gap: var(--space-4); align-items: end; }
.home-project-discovery h2 { max-width: 25ch; margin: 0; font-size: clamp(1.55rem, 1.2rem + 1.4vw, 2.35rem); line-height: 1.12; }
.home-project-discovery__action { display: grid; gap: var(--space-3); justify-items: start; }
.home-project-discovery__action p { max-width: 35ch; margin: 0; color: var(--color-muted); }
@media (min-width: 56rem) {
  .home-project-discovery__inner { grid-template-columns: minmax(0, 1.25fr) minmax(16rem, 0.75fr); gap: var(--space-7); }
  .home-project-discovery__action { justify-items: end; text-align: right; }
}

/* Editorial visual pairs retain generous space; imagery never supplies facts. */
.methodology-layout { display: grid; gap: var(--space-5); }
.methodology-layout__media { overflow: hidden; border-radius: var(--radius-2); border: 1px solid var(--color-border); }
.methodology-layout__media .hn-media__picture { aspect-ratio: 3 / 2; }
@media (min-width: 56rem) {
  .methodology-layout { grid-template-columns: 0.86fr 1.14fr; align-items: start; gap: var(--space-6); }
  .methodology-layout .card-grid { grid-template-columns: 1fr; gap: var(--space-3); }
}

/* Value props */
.feature { display: flex; flex-direction: column; gap: var(--space-2); }
.feature h3 { font-family: var(--font-sans); font-size: var(--step-0); font-weight: 700; margin: 0; }
.feature p { margin: 0; color: var(--color-muted); }

/* ===================================================== EVIDENCE BADGES ==== */
.badge {
  display: inline-flex; align-items: center; gap: var(--space-2);
  font-family: var(--font-sans); font-size: var(--step--1); font-weight: 700;
  letter-spacing: 0.02em; padding: 0.2em 0.7em; border-radius: 999px;
  border: 1px solid transparent;
}
.badge svg { width: 1em; height: 1em; flex: none; }
.badge--verified { color: var(--color-verified-fg); background: var(--color-verified-bg); }
.badge--indicative { color: var(--color-indicative-fg); background: var(--color-indicative-bg); }
.badge--awaiting { color: var(--color-awaiting-fg); background: var(--color-awaiting-bg); }
.badge--status { color: var(--color-status-fg); background: var(--color-status-bg); }

/* ========================================================== TOOLBAR ======= */
.toolbar {
  display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center;
  padding: var(--space-4); background: var(--color-surface);
  border: 1px solid var(--color-border); border-radius: var(--radius-2);
  margin-bottom: var(--space-6);
}
.toolbar input[type="search"] {
  flex: 1 1 16rem; min-height: 44px; padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-1);
  font: inherit; background: var(--color-bg);
}
.toolbar__note { font-size: var(--step--1); color: var(--color-muted); }

/* ====================================================== EMPTY STATE ======= */
.empty-state {
  padding: var(--space-6); text-align: center;
  border: 1px dashed var(--color-border-strong); border-radius: var(--radius-2);
  background: var(--color-surface); color: var(--color-muted);
}
.empty-state strong { display: block; color: var(--color-ink-2); font-family: var(--font-serif); font-size: var(--step-1); margin-bottom: var(--space-2); }

/* ======================================================= BREADCRUMBS ===== */
.breadcrumbs { padding-block: var(--space-4) 0; }
.breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); font-size: var(--step--1); color: var(--color-muted); }
.breadcrumbs li + li::before { content: "/"; margin-right: var(--space-2); color: var(--color-border-strong); }
.breadcrumbs a { color: var(--color-muted); }
.breadcrumbs [aria-current="page"] { color: var(--color-ink-2); }

/* ============================================================= PROSE ====== */
.prose { max-width: var(--width-prose); }
.prose h2 { margin-top: var(--space-7); }
.prose h3 { margin-top: var(--space-6); }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose li + li { margin-top: var(--space-2); }
.source-tier, .source-context { font-size: var(--step--1); color: var(--color-muted); }
.source-context { display: inline-block; margin-top: var(--space-1); }
.prose .todo-placeholder {
  padding: var(--space-4); border-radius: var(--radius-2);
  background: var(--color-indicative-bg); border: 1px solid color-mix(in srgb, var(--color-indicative-fg) 35%, transparent);
  font-size: var(--step--1); color: var(--color-indicative-fg);
}

/* ============================================================ FOOTER ===== */
/* Single compact row — identity left, links centre, brand line right.
   Task 13 final pass: the previous multi-row footer (logo + long tagline
   paragraph + two stacked nav columns + a separately-bordered copyright
   line) was explicitly rejected as too tall for the homepage; this replaces
   it everywhere the platform footer is used. Legal links stay reachable,
   just inline rather than in their own column. */
.site-footer {
  background: var(--color-on-dark-bg); color: var(--color-on-dark-fg);
  padding-block: var(--space-4); margin-top: var(--space-7);
  font-size: 0.85rem;
}
.site-footer__row {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6);
}
.site-footer__logo { height: 1.75rem; width: auto; display: block; }
.site-footer__brand-link { display: inline-flex; }
.site-footer__links { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin-right: auto; }
.site-footer a { color: var(--color-on-dark-fg); text-decoration: none; }
.site-footer a:hover { color: var(--color-teal); text-decoration: underline; }
.site-footer__social { display: flex; gap: var(--space-1); margin: 0; padding: 0; list-style: none; }
.site-footer__social a { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; }
.site-footer__social a:hover { text-decoration: none; }
.site-footer__tagline { margin: 0; color: var(--color-on-dark-muted); line-height: 1.4; text-align: right; }
@media (max-width: 47.99rem) {
  .site-footer__tagline { text-align: left; width: 100%; }
}

/* =========================================================== FORM SHELL == */
.field { display: flex; flex-direction: column; gap: var(--space-2); margin-bottom: var(--space-4); }
.field > label { font-size: var(--step--1); font-weight: 700; }
.field input, .field select, .field textarea {
  min-height: 44px; padding: var(--space-3); font: inherit;
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-1);
  background: var(--color-surface);
}
.field input[aria-invalid="true"] { border-color: #b23c2e; }
.field--check label {
  display: flex; gap: var(--space-3); align-items: flex-start;
  font-size: var(--step--1); font-weight: 400; line-height: 1.45;
}
.field--check input { min-height: 0; width: 1.15rem; height: 1.15rem; margin-top: 0.15rem; flex: none; }
.form-note { font-size: var(--step--1); color: var(--color-muted); }
.form-note a { color: var(--color-link); }
.form-error {
  padding: var(--space-3) var(--space-4); border-radius: var(--radius-1);
  background: #fbeae7; border: 1px solid #e3a89f; color: #8a2f22;
  font-size: var(--step--1); margin-bottom: var(--space-4);
}
/* Honeypot — kept in the layout, kept out of sight and the tab order. */
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ========================================================= UTILITIES ===== */
.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;
}
.text-center { text-align: center; }
.mt-0 { margin-top: 0; }

/* ==================================================== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important; animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important; scroll-behavior: auto !important;
  }
}

/* =================================================== HOME MOCKUP PASS ==== */
/* Homepage-only art direction. Kept separate from the platform and microsite
   surfaces so the supplied reference does not leak into project pages. */
.page-home { background: #fbfaf7; }
.page-home .site-header { position: relative; background: #fffdf9; border-bottom-color: #e5e1d8; backdrop-filter: none; }
.page-home .site-header__inner { min-height: 3.65rem; max-width: 94rem; gap: 1.35rem; }
.page-home .brand__logo { height: 2.25rem; }
.page-home .primary-nav { margin-left: auto; margin-right: .6rem; }
.page-home .primary-nav ul { gap: 1.45rem; }
.page-home .primary-nav a { color: #17262b; font-size: .72rem; font-weight: 600; padding-block: 1.25rem; }
.page-home .primary-nav a[aria-current="page"] { color: #123f3c; border-bottom: 2px solid #b27932; }
.header-actions { gap: .65rem; }
.page-home .header-actions { margin-left: 0; }
.header-search, .header-expert, .header-signin { min-height: 2.45rem; display: inline-flex; align-items: center; justify-content: center; font: inherit; font-size: .72rem; font-weight: 700; text-decoration: none; cursor: pointer; }
.header-search { width: 2.25rem; color: #0f2427; border: 0; background: transparent; }
.header-search svg { width: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.8; }
.header-expert { padding-inline: .85rem; border: 1px solid #0d463f; border-radius: .2rem; background: #0d463f; color: #fff; }
.header-signin { padding-inline: .95rem; color: #774b15; border: 1px solid #b88743; border-radius: .2rem; }

.page-home svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.page-home h1, .page-home h2, .page-home h3 { font-family: var(--font-serif); color: #111f22; }
.page-home .site-footer { margin-top: 0; background: #102327; padding-block: 1.45rem; }
.hn-kicker { margin: 0 0 .7rem; font-size: .62rem; font-weight: 800; letter-spacing: .17em; line-height: 1.4; text-transform: uppercase; color: #143f3b; }
.hn-home-hero { position: relative; min-height: 22rem; overflow: hidden; isolation: isolate; background: #ece5d8; }
.hn-home-hero__media, .hn-home-hero__media .hn-media__picture, .hn-home-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hn-home-hero__media img { object-fit: cover; object-position: center 55%; }
.hn-home-hero__wash { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,252,246,.96) 0%, rgba(255,252,246,.87) 27%, rgba(255,252,246,.20) 53%, rgba(255,252,246,.02) 75%); z-index: 1; }
.hn-home-hero__inner { position: relative; z-index: 2; min-height: 22rem; display: flex; align-items: center; justify-content: space-between; padding-block: 2.2rem; }
.hn-home-hero__copy { max-width: 31rem; }
.hn-home-hero h1 { margin: 0 0 .7rem; font-size: clamp(2.25rem, 3.4vw, 3.85rem); line-height: .98; letter-spacing: -.04em; }
.hn-home-hero__copy > p:not(.hn-kicker) { max-width: 30rem; margin-bottom: 1.1rem; font-size: .84rem; line-height: 1.55; color: #182b2d; }
.hn-home-hero__script { align-self: flex-start; margin: 1.25rem 3rem 0 0; font-family: "Segoe Script", "Bradley Hand", cursive; font-size: 1.8rem; font-style: italic; line-height: 1.08; text-align: center; color: rgba(20, 29, 31, .88); }
.hn-home-actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.hn-btn { min-height: 2.55rem; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .7rem 1rem; border: 1px solid transparent; border-radius: .18rem; font: inherit; font-size: .7rem; font-weight: 800; text-decoration: none; cursor: pointer; }
.hn-btn svg { width: 1rem; }
.hn-btn--dark { border-color: #0d463f; background: #0d463f; color: #fff; }
.hn-btn--dark:hover { color: #fff; background: #083a34; }
.hn-btn--paper { border-color: #a88a58; background: #fffdf9; color: #13292a; }
.hn-btn--paper:hover { color: #13292a; background: #f4eee5; }
.hn-btn--outline-light { border-color: rgba(255,255,255,.65); background: transparent; color: #fff; }
.hn-btn--outline-light:hover { color: #fff; background: rgba(255,255,255,.1); }

.hn-explore-split { position: relative; z-index: 3; margin-top: -1.15rem; }
.hn-explore-split__grid { display: grid; gap: .9rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hn-explore-card { position: relative; min-height: 9.25rem; overflow: hidden; border: 1px solid rgba(201,191,171,.95); border-radius: .25rem; color: #fff; text-decoration: none; box-shadow: 0 .3rem 1rem rgba(20,29,27,.14); }
.hn-explore-card__media, .hn-explore-card__media .hn-media__picture, .hn-explore-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hn-explore-card__media img { object-fit: cover; }
.hn-explore-card__veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,48,43,.96), rgba(5,48,43,.77) 46%, rgba(5,48,43,.2)); }
.hn-explore-card--commercial .hn-explore-card__veil { background: linear-gradient(90deg, rgba(255,253,248,.95), rgba(255,253,248,.7) 48%, rgba(255,253,248,.04)); }
.hn-explore-card--commercial { color: #11262a; }
.hn-explore-card__body { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; min-height: 9.25rem; padding: 1.25rem 1.5rem; }
.hn-card-kicker { display: inline-flex; align-items: center; gap: .5rem; font-size: .61rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hn-card-kicker svg { width: 1.65rem; height: 1.65rem; padding: .25rem; border-radius: 50%; color: #d7a44d; }
.hn-explore-card__body strong { display: flex; align-items: center; gap: .65rem; margin: .3rem 0; font-family: var(--font-serif); font-size: 1.55rem; line-height: 1; }
.hn-explore-card__body strong svg { width: 1.2rem; }
.hn-explore-card__body small { font-size: .73rem; }
.hn-explore-card__body em { margin-top: auto; font-size: .64rem; font-style: normal; white-space: nowrap; }
.hn-explore-card__body em i { margin-inline: .45rem; color: #d5b379; font-style: normal; }

.hn-purpose { padding: 1rem 0 .8rem; background: #fffdf9; }
.hn-section-line, .hn-section-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.hn-section-line h2, .hn-section-head h2 { margin: 0; font-size: clamp(1.45rem, 1.65vw, 2.05rem); line-height: 1.1; }
.hn-section-line > span { padding-bottom: .25rem; font-size: .55rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #77807b; }
.hn-purpose__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; margin-top: .65rem; }
.hn-purpose-card { min-height: 4.75rem; display: grid; grid-template-columns: 3rem 1fr auto; align-items: center; gap: .8rem; padding: .6rem 1rem; text-align: left; border: 1px solid #ece7de; border-radius: .25rem; background: linear-gradient(100deg, #faf9f6, #f4f0e9); color: #132628; cursor: pointer; }
.hn-purpose-card__icon { width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: 50%; background: #eee8d6; color: #b17a2c; }
.hn-purpose-card__icon svg { width: 1.3rem; height: 1.3rem; }
.hn-purpose-card strong, .hn-purpose-card small { display: block; }
.hn-purpose-card strong { font-family: var(--font-serif); font-size: 1.2rem; line-height: 1.1; }
.hn-purpose-card small { margin-top: .25rem; font-size: .68rem; color: #425154; }
.hn-purpose-card b { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: #ebe4cf; font-weight: 400; }

.hn-proof-strip { padding-block: .8rem; border-block: 1px solid #e5e1d9; background: #fff; }
.hn-proof-strip__grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.hn-proof-item { min-width: 0; display: flex; align-items: center; gap: .55rem; padding: .2rem .8rem; border-left: 1px solid #d8dad6; }
.hn-proof-item:first-child { border-left: 0; padding-left: 0; }
.hn-proof-item > span { flex: 0 0 auto; color: #0d463f; }
.hn-proof-item > span svg { width: 1.65rem; height: 1.65rem; }
.hn-proof-item p { margin: 0; line-height: 1.22; }
.hn-proof-item strong, .hn-proof-item small { display: block; }
.hn-proof-item strong { font-size: .62rem; }
.hn-proof-item small { margin-top: .17rem; font-size: .52rem; color: #566064; }

.hn-featured, .hn-corridors, .hn-insights { padding-block: 1.35rem; background: #fffdf9; }
.hn-section-head { margin-bottom: .75rem; }
.hn-section-head p { margin: .25rem 0 0; font-size: .72rem; color: #405052; }
.hn-section-head > a { display: inline-flex; align-items: center; gap: .5rem; padding-bottom: .15rem; color: #18383a; font-size: .67rem; font-weight: 700; }
.hn-section-head > a svg { width: 1rem; }
.hn-filters { display: flex; flex-wrap: wrap; gap: .7rem; margin: .8rem 0; }
.hn-filters button { min-width: 4.25rem; padding: .4rem .75rem; border: 0; border-radius: .25rem; background: #f0eee9; color: #1e3436; font: inherit; font-size: .63rem; cursor: pointer; }
.hn-filters button.is-active { background: #0e4b44; color: #fff; }
.hn-project-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .9rem; }
.hn-project-card { min-width: 0; position: relative; overflow: hidden; border: 1px solid #e7e2d8; border-radius: .25rem; background: #fff; }
.hn-project-card__image { position: relative; display: block; aspect-ratio: 1.72 / 1; overflow: hidden; background: #dfe8e5; }
.hn-project-card__image .hn-media, .hn-project-card__image .hn-media__picture, .hn-project-card__image img { width: 100%; height: 100%; }
.hn-project-card__image img { object-fit: cover; }
.hn-project-card__tag { position: absolute; top: .55rem; left: .55rem; padding: .28rem .45rem; border-radius: .15rem; background: #0e4b44; color: #fff; font-size: .5rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hn-project-card__editorial { position: absolute; right: .45rem; bottom: .35rem; padding: .12rem .28rem; border-radius: .12rem; background: rgba(12,28,29,.72); color: #fff; font-size: .43rem; }
.hn-project-card__body { position: relative; padding: .7rem; }
.hn-project-card h3 { margin: 0 0 .38rem; font-family: var(--font-serif); font-size: .9rem; line-height: 1.12; }
.hn-project-card h3 a { color: #132426; text-decoration: none; }
.hn-project-card__location, .hn-project-card__config { display: flex; align-items: flex-start; gap: .28rem; margin: .16rem 0; font-size: .59rem; line-height: 1.35; color: #4a5a5b; }
.hn-project-card__location svg { flex: 0 0 auto; width: .75rem; margin-top: .03rem; }
.hn-project-card__price { display: flex; align-items: end; justify-content: space-between; gap: .3rem; margin-top: .55rem; }
.hn-project-card__price strong { font-family: var(--font-serif); font-size: .92rem; line-height: 1; }
.hn-project-card__price span { max-width: 6.5rem; padding: .18rem .32rem; border-radius: .14rem; background: #e7efeb; color: #285a4e; font-size: .43rem; font-weight: 700; line-height: 1.1; text-align: right; }
.hn-round-arrow { position: absolute; right: .7rem; top: 1.1rem; width: 1.45rem; height: 1.45rem; display: grid; place-items: center; border-radius: 50%; background: #edf1ec; color: #35524d; }
.hn-round-arrow svg { width: .8rem; }

.hn-map-section { padding: 1.5rem 0; border-block: 1px solid #e2dfd7; background: #f7f5ef; }
.hn-map-section__grid { display: grid; grid-template-columns: minmax(15rem,.82fr) minmax(25rem,1.55fr) minmax(13rem,.72fr); gap: .9rem; align-items: stretch; }
.hn-map-section__copy { padding: .35rem 0; }
.hn-map-section__copy h2 { margin: 0 0 .65rem; font-size: clamp(1.85rem, 2.4vw, 2.9rem); line-height: .98; letter-spacing: -.035em; }
.hn-map-section__copy h2 em { color: #9a682d; font-style: normal; }
.hn-map-section__copy > p:not(.hn-kicker) { max-width: 20rem; margin-bottom: .8rem; font-size: .72rem; line-height: 1.45; }
.hn-map-section__map { min-height: 20rem; overflow: hidden; }
.hn-map-section__map, .hn-map-section__map .hn-media, .hn-map-section__map .hn-media__picture, .hn-map-section__map img { height: 100%; }
.hn-map-section__map img { width: 100%; object-fit: cover; object-position: center; }
.hn-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem; margin-top: .9rem; }
.hn-stats span { min-width: 0; padding-right: .35rem; border-right: 1px solid #c9c8c1; font-size: .49rem; line-height: 1.25; color: #536062; }
.hn-stats span:last-child { border: 0; }
.hn-stats b { display: block; margin-bottom: .15rem; color: #17282a; font-family: var(--font-serif); font-size: .95rem; }
.hn-insight-card { display: flex; flex-direction: column; justify-content: center; min-height: 20rem; padding: 1.35rem; overflow: hidden; border-radius: .25rem; color: #fff; background: linear-gradient(145deg, rgba(7,52,46,.98), rgba(10,55,47,.83)), var(--hn-insight-bg, url('../images/homepage/insights-night-skyline.png')) center / cover; }
.hn-insight-card h2 { margin: .9rem 0 1.15rem; color: #fff; font-size: 1.65rem; line-height: 1.05; }
.hn-insight-card .hn-card-kicker { color: #e0bb75; }
.hn-insight-card__play { display: inline-flex; align-items: center; gap: .55rem; padding: 0; border: 0; background: transparent; color: #fff; font: inherit; font-size: .62rem; text-align: left; cursor: pointer; }
.hn-insight-card__play > span { width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border: 1px solid #c99543; border-radius: 50%; color: #fff; }
.hn-insight-card__play svg { width: .85rem; }

.hn-corridors { padding-top: 1.15rem; }
.hn-corridor-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.hn-corridor-card { min-width: 0; display: grid; grid-template-columns: 4.55rem minmax(0,1fr) 1rem; gap: .55rem; align-items: center; padding: .42rem; border: 1px solid #deded9; border-radius: .2rem; color: #1b3334; text-decoration: none; }
.hn-corridor-card .hn-media, .hn-corridor-card .hn-media__picture, .hn-corridor-card img { width: 4.55rem; height: 3.35rem; }
.hn-corridor-card img { object-fit: cover; }
.hn-corridor-card strong, .hn-corridor-card small { display: block; }
.hn-corridor-card strong { font-family: var(--font-serif); font-size: .78rem; line-height: 1.1; }
.hn-corridor-card small { margin-top: .25rem; font-size: .55rem; line-height: 1.3; color: #435457; }
.hn-corridor-card b svg { width: .85rem; }
.hn-insights { padding-top: .25rem; }
.hn-insights-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.hn-insight-link { min-width: 0; display: grid; grid-template-columns: 2.45rem minmax(0,1fr) 1rem; gap: .5rem; align-items: center; padding: .6rem; border: 1px solid #e3dfd6; border-radius: .22rem; color: #1a3434; text-decoration: none; }
.hn-insight-link > span { width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border-radius: .18rem; background: #f3efe5; color: #ae7629; }
.hn-insight-link > span svg { width: 1.25rem; height: 1.25rem; }
.hn-insight-link p { margin: 0; line-height: 1.2; }
.hn-insight-link strong, .hn-insight-link small { display: block; }
.hn-insight-link strong { font-size: .66rem; }
.hn-insight-link small { margin-top: .16rem; font-size: .52rem; color: #526061; }
.hn-insight-link b svg { width: .85rem; }

.hn-cta-band { position: relative; padding-block: 1.25rem; color: #fff; background: linear-gradient(90deg, rgba(5,50,43,.96), rgba(5,50,43,.96)), var(--hn-cta-bg, url('../images/homepage/noida-sunset-corridor.png')) center / cover; }
.hn-cta-band__inner { display: grid; grid-template-columns: 1.1fr auto 8.5rem; gap: 1.5rem; align-items: center; }
.hn-cta-band h2 { margin: 0 0 .3rem; color: #fff; font-size: 1.35rem; }
.hn-cta-band p { margin: 0; font-size: .66rem; color: rgba(255,255,255,.86); }
.hn-cta-band__actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.hn-cta-band__mantra { padding-left: 1.4rem; border-left: 1px solid rgba(221,181,107,.7); font-size: .53rem !important; font-weight: 700; letter-spacing: .11em; line-height: 1.45; text-transform: uppercase; }

.hn-expert-dialog { width: min(48rem, calc(100% - 1.5rem)); max-height: min(90vh, 49rem); padding: 0; border: 0; border-radius: .45rem; background: #fffdf9; box-shadow: 0 1.5rem 5rem rgba(0,0,0,.35); color: #152629; }
.hn-expert-dialog::backdrop { background: rgba(7,24,26,.68); backdrop-filter: blur(2px); }
.hn-expert-dialog__shell { position: relative; padding: 1.75rem; overflow-y: auto; max-height: min(90vh, 49rem); }
.hn-expert-dialog h2 { margin: 0 0 .45rem; font-size: 2rem; }
.hn-expert-dialog__shell > p:not(.hn-kicker) { max-width: 43rem; margin-bottom: 1.25rem; font-size: .78rem; line-height: 1.5; color: #455558; }
.hn-expert-dialog__close { position: absolute; top: .8rem; right: .8rem; width: 2.35rem; height: 2.35rem; display: grid; place-items: center; border: 1px solid #d9d6cc; border-radius: 50%; background: #fff; color: #1c3333; cursor: pointer; }
.hn-expert-dialog__close svg { width: 1rem; }
.hn-expert-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 .85rem; }
.hn-expert-form .field { margin-bottom: .7rem; }
.hn-expert-form .field > label { font-size: .68rem; }
.hn-expert-form .field input, .hn-expert-form .field select, .hn-expert-form .field textarea { min-height: 2.55rem; padding: .55rem .65rem; font-size: .78rem; }
.hn-expert-form__message { grid-column: 1 / -1; }
.hn-expert-form__message textarea { min-height: 4.75rem !important; resize: vertical; }
.hn-expert-form__submit { margin-top: .15rem; }
.hn-expert-form .form-consent { margin: .65rem 0 0; font-size: .62rem; line-height: 1.45; color: #566567; }
body.hn-modal-open { overflow: hidden; }
.hn-expert-dialog[open] { animation: hn-modal-in .18s ease-out; }
@keyframes hn-modal-in { from { opacity: 0; transform: translateY(.7rem) scale(.985); } to { opacity: 1; transform: none; } }

@media (max-width: 70rem) {
  .page-home .primary-nav ul { gap: .85rem; }
  .page-home .primary-nav a { font-size: .65rem; }
  .header-expert { padding-inline: .6rem; font-size: .64rem; }
  .hn-map-section__grid { grid-template-columns: minmax(15rem,.9fr) minmax(23rem,1.35fr); }
  .hn-insight-card { grid-column: 1 / -1; min-height: 12rem; }
  .hn-insight-card h2 { margin-block: .5rem .85rem; }
}
@media (max-width: 60rem) {
  .page-home .site-header__inner { min-height: 3.5rem; }
  .page-home .header-actions { display: flex; }
  .page-home .header-signin { display: none; }
  .page-home .nav-toggle { order: 3; margin-left: 0; }
  .page-home .primary-nav { margin-left: 0; }
  .page-home .primary-nav ul { padding-inline: 1rem; }
  .hn-proof-strip__grid { grid-template-columns: repeat(3, 1fr); row-gap: .7rem; }
  .hn-proof-item:nth-child(4) { border-left: 0; padding-left: 0; }
  .hn-project-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .hn-corridor-grid, .hn-insights-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .hn-cta-band__inner { grid-template-columns: 1fr auto; }
  .hn-cta-band__mantra { display: none; }
}
@media (max-width: 42rem) {
  .page-home .brand__logo { height: 1.85rem; }
  .header-search { width: 2rem; }
  .header-expert { min-height: 2.2rem; padding-inline: .45rem; font-size: .56rem; }
  .hn-home-hero { min-height: 27rem; }
  .hn-home-hero__inner { min-height: 27rem; align-items: flex-start; padding-top: 2rem; }
  .hn-home-hero__wash { background: linear-gradient(180deg, rgba(255,252,246,.98) 0%, rgba(255,252,246,.9) 58%, rgba(255,252,246,.35) 100%); }
  .hn-home-hero__media img { object-position: 55% center; }
  .hn-home-hero h1 { font-size: clamp(2.3rem, 11vw, 3rem); }
  .hn-home-hero__copy > p:not(.hn-kicker) { font-size: .78rem; }
  .hn-home-hero__script { display: none; }
  .hn-explore-split { margin-top: -.55rem; }
  .hn-explore-split__grid, .hn-purpose__grid, .hn-project-grid, .hn-map-section__grid, .hn-corridor-grid, .hn-insights-grid { grid-template-columns: 1fr; }
  .hn-explore-card { min-height: 10.4rem; }
  .hn-explore-card__body { min-height: 10.4rem; }
  .hn-section-line, .hn-section-head { align-items: flex-start; flex-direction: column; }
  .hn-section-line > span { display: none; }
  .hn-section-head > a { margin-top: -.25rem; }
  .hn-proof-strip__grid { grid-template-columns: 1fr 1fr; }
  .hn-proof-item { padding-inline: .4rem; border-left: 0; }
  .hn-proof-item:nth-child(odd) { padding-left: 0; }
  .hn-proof-item:last-child { grid-column: 1 / -1; }
  .hn-map-section__map { min-height: 14.5rem; }
  .hn-map-section__copy { order: 1; }
  .hn-map-section__map { order: 2; }
  .hn-insight-card { order: 3; min-height: 13rem; }
  .hn-stats { grid-template-columns: 1fr 1fr; row-gap: .6rem; }
  .hn-stats span:nth-child(2) { border-right: 0; }
  .hn-cta-band__inner { grid-template-columns: 1fr; gap: .9rem; }
  .hn-expert-dialog { width: calc(100% - 1rem); max-height: 94vh; }
  .hn-expert-dialog__shell { max-height: 94vh; padding: 1.35rem 1rem; }
  .hn-expert-dialog h2 { font-size: 1.75rem; }
  .hn-expert-form__grid { grid-template-columns: 1fr; }
}

/* ===================================== HOMEPAGE TYPE + RHYTHM SYSTEM =====
   Task 17C keeps the approved composition intact while making its editorial
   hierarchy, reading measure and desktop scale explicit. These tokens are
   deliberately local to the homepage: project microsites retain their own
   evidence-led visual systems. */
.page-home {
  --hn-space-1: .5rem;
  --hn-space-2: .75rem;
  --hn-space-3: 1rem;
  --hn-space-4: 1.5rem;
  --hn-space-5: 2rem;
  --hn-space-6: clamp(2.5rem, 3vw, 4rem);
  --hn-section-space: clamp(4.75rem, 4.4vw, 7.25rem);
  --hn-copy: clamp(1rem, .95rem + .16vw, 1.125rem);
  --hn-intro: clamp(1.0625rem, 1rem + .2vw, 1.1875rem);
  --hn-card-copy: clamp(.9375rem, .9rem + .12vw, 1rem);
  --hn-label: clamp(.75rem, .72rem + .08vw, .875rem);
  --hn-title: clamp(2.125rem, 1.75rem + 1.15vw, 2.75rem);
  --hn-card-title: clamp(1.25rem, 1.08rem + .46vw, 1.5rem);
  --hn-rule: #dfddd4;
  --hn-deep: #102e2c;
}
.page-home .container--wide { max-width: 100rem; }
.page-home .site-header__inner { min-height: 4.5rem; max-width: 100rem; }
.page-home .brand__logo { height: 2.45rem; }
.page-home .primary-nav ul { gap: clamp(1rem, 1.5vw, 1.75rem); }
.page-home .primary-nav a { padding-block: 1.55rem; font-size: .9375rem; letter-spacing: .005em; }
.page-home .header-actions { gap: .75rem; }
.header-search, .header-expert { min-height: 3rem; font-size: .9375rem; }
.header-search { width: 3rem; }
.header-expert { padding-inline: 1.1rem; }
.page-home :is(a, button, input, select, textarea):focus-visible { outline: 3px solid #b27932; outline-offset: 3px; }

.hn-kicker { margin-bottom: var(--hn-space-2); font-size: var(--hn-label); line-height: 1.35; letter-spacing: .15em; }
.hn-home-hero { min-height: clamp(37rem, 30vw, 50rem); }
.hn-home-hero__inner { min-height: inherit; padding-block: clamp(4.5rem, 8vw, 8.5rem); }
.hn-home-hero__copy { max-width: 50rem; }
.hn-home-hero h1 { max-width: 18ch; margin-bottom: var(--hn-space-3); font-size: clamp(3rem, 2.1rem + 2.1vw, 4.75rem); line-height: 1.02; letter-spacing: -.045em; text-wrap: balance; }
.hn-home-hero__copy > p:not(.hn-kicker) { max-width: 37rem; margin-bottom: var(--hn-space-4); font-size: clamp(1.125rem, 1.04rem + .28vw, 1.25rem); line-height: 1.58; }
.hn-home-hero__script { margin: 2rem 5rem 0 0; font-size: clamp(2rem, 1.5rem + 1vw, 2.8rem); }
.hn-home-actions { gap: .875rem; }
.hn-btn { min-height: 3.125rem; padding: .8rem 1.2rem; font-size: .9375rem; letter-spacing: .005em; }

.hn-explore-split { margin-top: -2rem; }
.hn-explore-split__grid { gap: 1.25rem; }
.hn-explore-card { min-height: clamp(18rem, 19vw, 23rem); border-radius: .4rem; }
.hn-explore-card__body { min-height: inherit; padding: clamp(1.75rem, 3vw, 3rem); }
.hn-card-kicker { gap: .625rem; font-size: var(--hn-label); letter-spacing: .13em; }
.hn-card-kicker svg { width: 1.9rem; height: 1.9rem; }
.hn-explore-card__body strong { gap: .8rem; margin: .5rem 0 .4rem; font-size: clamp(2rem, 1.5rem + 1vw, 2.75rem); line-height: 1.03; }
.hn-explore-card__body strong svg { width: 1.4rem; }
.hn-explore-card__body small { font-size: var(--hn-intro); line-height: 1.45; }
.hn-explore-card__body em { font-size: var(--hn-label); line-height: 1.45; white-space: normal; }

.hn-purpose { padding-block: var(--hn-section-space) calc(var(--hn-section-space) * .78); }
.hn-section-line, .hn-section-head { gap: var(--hn-space-4); }
.hn-section-line h2, .hn-section-head h2 { font-size: var(--hn-title); line-height: 1.08; letter-spacing: -.025em; text-wrap: balance; }
.hn-section-line > span { padding-bottom: .35rem; font-size: var(--hn-label); letter-spacing: .12em; }
.hn-purpose__grid { gap: 1.25rem; margin-top: var(--hn-space-4); }
.hn-purpose-card { min-height: 8rem; grid-template-columns: 4.25rem 1fr auto; gap: 1.25rem; padding: 1.25rem 1.4rem; border-radius: .4rem; }
.hn-purpose-card__icon { width: 3.5rem; height: 3.5rem; }
.hn-purpose-card__icon svg { width: 1.65rem; height: 1.65rem; }
.hn-purpose-card strong { font-size: var(--hn-card-title); line-height: 1.12; }
.hn-purpose-card small { margin-top: .45rem; font-size: var(--hn-card-copy); line-height: 1.48; }
.hn-purpose-card b { width: 2.6rem; height: 2.6rem; }

.hn-proof-strip { padding-block: 1.25rem; }
.hn-proof-item { gap: .7rem; padding: .4rem 1rem; }
.hn-proof-item > span svg { width: 1.85rem; height: 1.85rem; }
.hn-proof-item p { line-height: 1.35; }
.hn-proof-item strong { font-size: .875rem; }
.hn-proof-item small { margin-top: .22rem; font-size: .8125rem; line-height: 1.4; }

.hn-featured, .hn-corridors, .hn-insights { padding-block: var(--hn-section-space); }
.hn-section-head { margin-bottom: var(--hn-space-5); }
.hn-section-head .hn-kicker { margin-bottom: .55rem; }
.hn-section-head p { max-width: 42rem; margin-top: .7rem; font-size: var(--hn-intro); line-height: 1.55; }
.hn-section-head > a { gap: .7rem; padding-bottom: .3rem; font-size: .9375rem; }
.hn-section-head > a svg { width: 1.125rem; }
.hn-project-grid { gap: clamp(1rem, 1.35vw, 1.5rem); }
.hn-project-card { display: flex; min-height: 100%; flex-direction: column; border-radius: .4rem; box-shadow: 0 1px 2px rgba(16,46,44,.04); transition: box-shadow .18s ease, transform .18s ease; }
.hn-project-card:hover { box-shadow: 0 .75rem 1.75rem rgba(16,46,44,.13); transform: translateY(-2px); }
.hn-project-card__image { aspect-ratio: 1.55 / 1; }
.hn-project-card__tag { top: .8rem; left: .8rem; padding: .4rem .62rem; border-radius: .18rem; font-size: .75rem; letter-spacing: .08em; }
.hn-project-card__tag--commercial { background: #183f62; }
.hn-project-card__tag--plotted { background: #7d6332; }
.hn-project-card__editorial { right: .7rem; bottom: .55rem; padding: .22rem .38rem; font-size: .6875rem; }
.hn-project-card__body { display: flex; flex: 1; flex-direction: column; padding: 1.15rem 1.15rem 1.25rem; }
.hn-project-card h3 { margin-bottom: .6rem; font-size: clamp(1.25rem, 1.08rem + .38vw, 1.5rem); line-height: 1.12; }
.hn-project-card__location, .hn-project-card__config { gap: .4rem; margin: .25rem 0; font-size: var(--hn-card-copy); line-height: 1.45; }
.hn-project-card__location svg { width: 1rem; }
.hn-project-card__price { align-items: flex-end; gap: .65rem; margin-top: auto; padding-top: 1.15rem; }
.hn-project-card__price strong { font-size: clamp(1.25rem, 1.12rem + .35vw, 1.5rem); line-height: 1.1; }
.hn-project-card__price span { min-width: 0; max-width: 10rem; padding: .3rem .45rem; overflow-wrap: anywhere; font-size: .75rem; line-height: 1.3; }
.hn-round-arrow { position: static; width: 2.45rem; height: 2.45rem; margin-top: 1.1rem; border: 1px solid #d3ddd6; }
.hn-round-arrow svg { width: 1rem; }

.hn-map-section { padding-block: var(--hn-section-space); }
.hn-map-section__grid { grid-template-columns: minmax(18rem, .95fr) minmax(29rem, 1.45fr) minmax(17rem, .75fr); gap: clamp(1rem, 1.7vw, 2rem); }
.hn-map-section__grid > * { min-width: 0; }
.hn-map-section__copy { display: flex; flex-direction: column; justify-content: center; padding: 1rem 0; }
.hn-map-section__copy h2 { margin-bottom: var(--hn-space-3); font-size: clamp(2.5rem, 1.8rem + 1.8vw, 4rem); line-height: 1.02; text-wrap: balance; }
.hn-map-section__copy > p:not(.hn-kicker) { max-width: 32rem; margin-bottom: var(--hn-space-4); font-size: var(--hn-intro); line-height: 1.58; }
.hn-map-section__map { width: 100%; height: auto; min-height: auto; align-self: center; aspect-ratio: 16 / 9; background: #e9ebe6; }
.hn-map-section__map img { object-fit: contain; }
.hn-stats { gap: .75rem; margin-top: 1.5rem; }
.hn-stats span { padding-right: .65rem; font-size: .8125rem; line-height: 1.4; }
.hn-stats b { margin-bottom: .25rem; font-size: 1.25rem; }
.hn-insight-card { min-height: auto; padding: clamp(1.5rem, 2.1vw, 2.5rem); border-radius: .4rem; }
.hn-insight-card h2 { margin: 1rem 0 1.4rem; font-size: clamp(2rem, 1.5rem + .9vw, 2.75rem); line-height: 1.05; }
.hn-insight-card__play { gap: .7rem; font-size: .9375rem; }
.hn-insight-card__play > span { width: 2.75rem; height: 2.75rem; }
.hn-insight-card__play svg { width: 1rem; }

.hn-corridors { padding-top: calc(var(--hn-section-space) * .85); }
.hn-corridor-grid, .hn-insights-grid { gap: 1.1rem; }
.hn-corridor-card { grid-template-columns: 7.25rem minmax(0, 1fr) 1.25rem; gap: .85rem; min-height: 8rem; padding: .7rem; border-radius: .35rem; }
.hn-corridor-card .hn-media, .hn-corridor-card .hn-media__picture, .hn-corridor-card img { width: 7.25rem; height: 5.5rem; }
.hn-corridor-card strong { font-size: 1.125rem; line-height: 1.15; }
.hn-corridor-card small { margin-top: .35rem; font-size: var(--hn-card-copy); line-height: 1.45; }
.hn-corridor-card b svg { width: 1rem; }
.hn-insights { padding-top: calc(var(--hn-section-space) * .3); }
.hn-insight-link { grid-template-columns: 3.25rem minmax(0, 1fr) 1.25rem; gap: .8rem; min-height: 7.5rem; padding: 1rem; border-radius: .35rem; transition: border-color .18s ease, box-shadow .18s ease; }
.hn-insight-link:hover { border-color: #b6bcb6; box-shadow: 0 .5rem 1.25rem rgba(16,46,44,.08); }
.hn-insight-link > span { width: 3rem; height: 3rem; }
.hn-insight-link > span svg { width: 1.45rem; height: 1.45rem; }
.hn-insight-link p { line-height: 1.35; }
.hn-insight-link strong { font-size: 1rem; line-height: 1.25; }
.hn-insight-link small { margin-top: .28rem; font-size: var(--hn-card-copy); line-height: 1.42; }
.hn-insight-link b svg { width: 1rem; }

.hn-cta-band { padding-block: clamp(4rem, 5.2vw, 7rem); }
.hn-cta-band__inner { grid-template-columns: minmax(20rem, 1.1fr) auto 10rem; gap: clamp(1.5rem, 3vw, 3.5rem); }
.hn-cta-band h2 { margin-bottom: .7rem; font-size: clamp(2.25rem, 1.8rem + 1.1vw, 3.25rem); line-height: 1.06; }
.hn-cta-band p { max-width: 38rem; font-size: var(--hn-intro); line-height: 1.55; }
.hn-cta-band__actions { gap: .8rem; }
.hn-cta-band__mantra { font-size: .8125rem !important; line-height: 1.5; }
.page-home .site-footer { padding-block: 2rem; }
.page-home .site-footer__links { gap: .75rem 1.25rem; }
.page-home .site-footer a, .page-home .site-footer__tagline { font-size: .875rem; line-height: 1.5; }

.hn-expert-dialog__shell { padding: clamp(1.5rem, 3vw, 2.5rem); }
.hn-expert-dialog h2 { font-size: clamp(2rem, 1.7rem + .75vw, 2.5rem); }
.hn-expert-dialog__shell > p:not(.hn-kicker) { font-size: 1rem; line-height: 1.58; }
.hn-expert-form .field { margin-bottom: 1rem; }
.hn-expert-form .field > label { font-size: .875rem; }
.hn-expert-form .field input, .hn-expert-form .field select, .hn-expert-form .field textarea { min-height: 3rem; padding: .65rem .8rem; font-size: 1rem; }
.hn-expert-form .form-consent { font-size: .8125rem; line-height: 1.5; }

/* Task 17C final correction: keep desktop form content in one readable card.
   Narrow handsets may scroll the dialog itself; the inner form panel never
   becomes a second, competing scroll region. */
.hn-home-hero__script { color: #fff; text-shadow: 0 .12em .45em rgba(7, 24, 26, .5); }
.hn-expert-dialog { width: min(56rem, calc(100% - 2rem)); max-height: none; overflow: visible; }
.hn-expert-dialog__shell { padding: clamp(1.25rem, 2vw, 2rem); max-height: none; overflow: visible; }
.hn-expert-dialog h2 { margin-bottom: .35rem; }
.hn-expert-dialog__shell > p:not(.hn-kicker) { margin-bottom: .85rem; }
.hn-expert-form__grid { gap: .7rem 1rem; }
.hn-expert-form .field { margin-bottom: 0; }
.hn-expert-form .field input, .hn-expert-form .field select, .hn-expert-form .field textarea { min-height: 2.75rem; }
.hn-expert-form__message textarea { min-height: 3.75rem !important; }
.hn-expert-form__submit { margin-top: .7rem; }
.hn-expert-form .form-consent { margin-top: .55rem; }

@media (min-width: 110rem) {
  .page-home .container--wide, .page-home .site-header__inner { max-width: 112rem; }
  .hn-home-hero__copy { max-width: 50rem; }
  .hn-project-card__body { padding: 1.4rem; }
}
@media (max-width: 70rem) {
  .page-home .primary-nav a { font-size: .8125rem; }
  .header-expert { font-size: .875rem; }
  .hn-project-grid, .hn-corridor-grid, .hn-insights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hn-map-section__grid { grid-template-columns: minmax(18rem, .9fr) minmax(24rem, 1.2fr); }
  .hn-insight-card { grid-column: 1 / -1; min-height: 15rem; }
}
@media (max-width: 60rem) {
  .page-home .site-header__inner { min-height: 4.25rem; }
  .page-home .header-actions { display: flex; }
  .page-home .primary-nav ul { padding-inline: 1.25rem; }
  .page-home .primary-nav a { font-size: 1rem; }
  .header-search { width: 2.75rem; }
  .hn-home-hero { min-height: 35rem; }
  .hn-home-hero__inner { padding-block: 4.5rem 3rem; }
  .hn-home-hero h1 { max-width: 15ch; font-size: clamp(2.5rem, 8.5vw, 3.5rem); }
  .hn-home-hero__copy > p:not(.hn-kicker) { font-size: 1rem; }
  .hn-explore-card { min-height: 16rem; }
  .hn-explore-card__body { padding: 1.5rem; }
  .hn-explore-card__body strong { font-size: 1.8rem; }
  .hn-purpose-card { min-height: 7.5rem; grid-template-columns: 3.75rem 1fr auto; padding: 1rem; }
  .hn-proof-strip__grid { grid-template-columns: repeat(3, 1fr); row-gap: 1rem; }
  .hn-project-grid, .hn-corridor-grid, .hn-insights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hn-map-section__grid { grid-template-columns: 1fr; }
  .hn-map-section__copy, .hn-map-section__map, .hn-insight-card { grid-column: auto; }
  .hn-map-section__map { min-height: auto; }
  .hn-insight-card { min-height: 22rem; }
  .hn-cta-band__inner { grid-template-columns: 1fr; }
  .hn-cta-band__mantra { display: none; }
}
@media (max-width: 42rem) {
  .page-home .site-header__inner { gap: .5rem; padding-inline: .75rem; }
  .page-home .brand__logo { height: 2.05rem; }
  .header-search { display: none; }
  .header-expert { min-height: 2.75rem; padding-inline: .7rem; font-size: .875rem; white-space: nowrap; }
  .hn-home-hero { min-height: 34rem; }
  .hn-home-hero__inner { padding-block: 3.5rem 2.5rem; }
  .hn-home-hero__copy { max-width: 100%; }
  .hn-home-hero h1 { max-width: 15ch; font-size: clamp(2.4rem, 10.5vw, 3rem); }
  .hn-home-actions, .hn-cta-band__actions { align-items: stretch; flex-direction: column; }
  .hn-home-actions .hn-btn, .hn-cta-band__actions .hn-btn { width: 100%; }
  .hn-explore-split { margin-top: -1rem; }
  .hn-explore-split__grid, .hn-purpose__grid, .hn-project-grid, .hn-corridor-grid, .hn-insights-grid { grid-template-columns: 1fr; }
  .hn-explore-card { min-height: 17rem; }
  .hn-section-line, .hn-section-head { align-items: flex-start; flex-direction: column; }
  .hn-section-line > span { display: none; }
  .hn-section-head > a { margin-top: -.5rem; }
  .hn-proof-strip__grid { grid-template-columns: 1fr 1fr; }
  .hn-proof-item { padding: .5rem; border-left: 0; }
  .hn-proof-item:nth-child(odd) { padding-left: 0; }
  .hn-proof-item:last-child { grid-column: 1 / -1; }
  .hn-proof-item strong { font-size: .8125rem; }
  .hn-proof-item small { font-size: .75rem; }
  .hn-project-card__body { padding: 1.15rem; }
  .hn-map-section__map { min-height: auto; }
  .hn-insight-card { min-height: 18rem; }
  .hn-map-section__copy h2 { font-size: clamp(2.15rem, 9vw, 2.75rem); }
  .hn-stats { grid-template-columns: 1fr 1fr; }
  .hn-stats span:nth-child(2) { border-right: 0; }
  .hn-corridor-card { grid-template-columns: 6rem minmax(0, 1fr) 1.25rem; }
  .hn-corridor-card .hn-media, .hn-corridor-card .hn-media__picture, .hn-corridor-card img { width: 6rem; height: 4.75rem; }
  .hn-expert-dialog { width: calc(100% - 1rem); }
  .hn-expert-dialog__shell { padding: 1.5rem 1.15rem; }
}

@media (max-width: 42rem) {
  .hn-expert-dialog { width: 100%; max-width: none; max-height: 100dvh; margin: 0; overflow-y: auto; border-radius: 0; box-sizing: border-box; }
  .hn-expert-dialog__shell { padding: 1.25rem 1.15rem; }
}

/* Insight article — shared public Insight presentation (Authority Sprint A3.1). */
.insight-article__hero { margin-block: var(--space-5) var(--space-6); }
.insight-article__hero-media { border-radius: var(--radius-2); overflow: hidden; border: 1px solid var(--color-border); }
.insight-article__hero-media .hn-media__picture img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; height: auto; }
.insight-article__broad-relevance { color: var(--color-muted); font-style: italic; }
.insight-article__cta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4);
  margin-block: var(--space-7) var(--space-5); padding: var(--space-5);
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-2); background: var(--color-surface-2);
}
.insight-article__cta h2 { margin: 0 0 var(--space-1); }
.insight-article__cta p { margin: 0; color: var(--color-muted); }
.insight-disclosure { font-size: var(--step--1); color: var(--color-muted); border-top: 1px solid var(--color-border); padding-top: var(--space-4); margin-top: var(--space-2); }
.prose .source-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.prose .source-list li { padding-block: var(--space-2); border-bottom: 1px solid var(--color-border); }
.prose .source-list li:last-child { border-bottom: 0; }

@media (max-width: 42rem) {
  .insight-article__cta { flex-direction: column; align-items: flex-start; }
  .insight-article__cta a.btn { width: 100%; text-align: center; }
}

/* Developer Authority (DA-1) — shared public Developer detail presentation. */
.developer-hero__inner { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-6); }
.developer-hero__identity { flex: 1 1 28rem; min-width: 0; }
.developer-hero__mark { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 8rem; height: 8rem; padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-2); background: var(--color-surface); }
.developer-hero__logo { width: 100%; }
.developer-hero__logo .hn-media__picture img { object-fit: contain; width: 100%; height: auto; }
.developer-hero__wordmark { font-family: var(--font-serif); font-weight: 600; font-size: var(--step-3); color: var(--color-muted); }
.developer-hero__disclosure { font-size: var(--step--1); color: var(--color-muted); margin-top: var(--space-4); margin-bottom: 0; }

.developer-snapshot { padding-block: var(--space-6); }
.developer-snapshot__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--space-4); list-style: none; margin: var(--space-5) 0 0; padding: 0; }
.developer-snapshot__stat { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-2); background: var(--color-surface); display: flex; flex-direction: column; gap: var(--space-1); }
.developer-snapshot__stat strong { font-family: var(--font-serif); font-size: var(--step-1); color: var(--color-ink); }
.developer-snapshot__stat span { font-size: var(--step--1); color: var(--color-muted); }

.promoter-table-wrap { overflow-x: auto; border: 1px solid var(--color-border); border-radius: var(--radius-2); }
.promoter-table { width: 100%; border-collapse: collapse; font-size: var(--step--1); }
.promoter-table th, .promoter-table td { padding: var(--space-3) var(--space-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--color-border); }
.promoter-table thead th { background: var(--color-surface-2); font-family: var(--font-sans); font-weight: 700; white-space: nowrap; }
.promoter-table tbody tr:last-child th, .promoter-table tbody tr:last-child td { border-bottom: 0; }
.promoter-table tbody th { font-weight: 600; }

.section__note { color: var(--color-muted); font-size: var(--step--1); font-style: italic; margin-top: var(--space-5); }

@media (max-width: 42rem) {
  .developer-hero__inner { flex-direction: column-reverse; }
  .developer-hero__mark { width: 6rem; height: 6rem; }
  .promoter-table th, .promoter-table td { padding: var(--space-2) var(--space-3); }
}

/* Location Authority (LA-1) — shared public Location detail presentation. */
.location-hero__inner { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-6); }
.location-hero__identity { flex: 1 1 28rem; min-width: 0; }
.location-hero__media { margin-top: var(--space-5); }
.location-hero__media .hn-media { border-radius: var(--radius-2); overflow: hidden; }
.location-hero__media img { width: 100%; height: auto; display: block; object-fit: cover; max-height: 22rem; }
.location-hero__disclosure { font-size: var(--step--1); color: var(--color-muted); margin-top: var(--space-4); margin-bottom: 0; }
.location-aliases { font-size: var(--step--1); color: var(--color-muted); }

.location-snapshot { padding-block: var(--space-6); }
.location-snapshot__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--space-4); list-style: none; margin: var(--space-5) 0 0; padding: 0; }
.location-snapshot__stat { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-2); background: var(--color-surface); display: flex; flex-direction: column; gap: var(--space-1); }
.location-snapshot__stat strong { font-family: var(--font-serif); font-size: var(--step-1); color: var(--color-ink); }
.location-snapshot__stat span { font-size: var(--step--1); color: var(--color-muted); }

.location-infra-list { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.location-infra-list__item { padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-2); background: var(--color-surface); }
.location-infra-list__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.location-infra-list__item p { margin: var(--space-2) 0 0; color: var(--color-muted); font-size: var(--step--1); }

.location-card__type { color: var(--color-muted); font-size: var(--step--1); text-transform: uppercase; letter-spacing: 0.04em; margin: 0 0 var(--space-1); }

@media (max-width: 42rem) {
  .location-hero__media img { max-height: 14rem; }
}