/* ============================================================
   TOKENS — deliberate, subject-derived palette. Single warm
   editorial theme by design: this is a brand identity for a
   real-estate capital group, not a utility surface, and the
   reference direction (warm parchment / deep ink / brass gold)
   is the brand — a light/dark toggle would undercut it.
   ============================================================ */
:root{
  /* ink (dark) */
  --ink:#10192b;
  --ink-soft:#1c2a40;
  --ink-line:#33415a;
  --ink-mute:#616b80;

  /* canvas (light) */
  --canvas:#f4efe3;
  --canvas-deep:#e9dfc7;
  --canvas-light:#faf7ef;
  --paper:#fbf8f1;

  /* brass gold — primary accent (capital / finish) */
  --gold:#b4863d;       /* buttons, borders, icons, text-on-dark */
  --gold-deep:#8a6529;  /* text-on-light (AA safe), links */
  --gold-soft:#d9bc84;

  /* clay — secondary material accent, renovation-tagged content only */
  --clay:#a35d3f;
  --clay-deep:#833f27;  /* text-on-light (AA safe) */

  --rule:#d8cfb6;
  --rule-soft:#e7dfc9;
  --ok:#4a7c59;

  --display:'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:'Inter Tight', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono:'Space Mono', ui-monospace, 'Courier New', monospace;

  --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem; --sp-5:1.5rem;
  --sp-6:2rem; --sp-7:3rem; --sp-8:4rem; --sp-9:6rem; --sp-10:8rem;

  --container:1320px;
  --container-narrow:760px;
  --container-wide:1480px;

  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* ============================================================
   RESET + BASE
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
img,svg{ display:block; max-width:100%; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
input,textarea{ font:inherit; }

body{
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  color:var(--ink);
  background:var(--canvas);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.5;
  background-image:radial-gradient(rgba(16,25,43,.05) .6px, transparent .6px);
  background-size:3px 3px;
}

::selection{ background:var(--gold); color:var(--canvas-light); }

.skip-link{
  position:absolute; left:-999px; top:0;
  background:var(--ink); color:var(--canvas);
  padding:.75rem 1.25rem; z-index:200;
}
.skip-link:focus{ left:var(--sp-4); top:var(--sp-4); }

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

h1,h2,h3,h4{ font-family:var(--display); font-weight:500; color:var(--ink); text-wrap:balance; line-height:1.08; letter-spacing:-.01em; }
p{ text-wrap:pretty; }

em, .accent-italic{ font-style:italic; font-weight:500; color:var(--gold-deep); }
.on-dark em, .on-dark .accent-italic{ color:var(--gold); }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(1.25rem,4vw,2.5rem); }
.container--narrow{ max-width:var(--container-narrow); }
.container--wide{ max-width:var(--container-wide); }

.eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-deep); font-weight:700;
}
.on-dark .eyebrow{ color:var(--gold); }
.eyebrow::before{ content:""; width:1.4em; height:1px; background:currentColor; display:inline-block; }

.section-head{ max-width:44rem; margin-bottom:var(--sp-8); }
.section-head.center{ margin-inline:auto; text-align:center; }
.section-head h2{ font-size:clamp(2rem,4vw,2.9rem); margin-top:var(--sp-3); }
.section-head p{ margin-top:var(--sp-4); color:var(--ink-mute); font-size:1.05rem; max-width:38rem; }
.section-head.center p{ margin-inline:auto; }

.rule{ height:1px; background:var(--rule); border:0; }
.on-dark .rule{ background:var(--ink-line); }

section{ position:relative; z-index:1; }

/* ============================================================
   SAMPLE-DATA TAGGING
   Every illustrative figure on this page carries a visible
   "SAMPLE" marker, and bracketed [ ] text marks identity fields
   (names, addresses, licensing) that must be replaced before
   this site goes live. See disclosure in the footer.
   ============================================================ */
.sample-tag{
  display:inline-flex; align-items:center;
  font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase;
  font-weight:700; color:var(--gold-deep);
  border:1px solid var(--gold-deep); border-radius:999px;
  padding:.18em .6em; white-space:nowrap;
  vertical-align:middle;
}
.on-dark .sample-tag{ color:var(--gold-soft); border-color:var(--gold-soft); }
.bracket{ color:var(--ink-mute); font-style:italic; }
.on-dark .bracket{ color:#93a0b8; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family:var(--sans); font-weight:700; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase;
  padding:1.05em 1.7em; min-height:44px;
  border-radius:2px; border:1px solid transparent;
  transition:transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
  white-space:nowrap;
}
.btn--primary{ background:var(--gold); color:var(--ink); }
.btn--primary:hover{ background:var(--gold-deep); color:var(--canvas-light); transform:translateY(-2px); }
.btn--outline{ border-color:var(--ink); color:var(--ink); }
.btn--outline:hover{ background:var(--ink); color:var(--canvas); transform:translateY(-2px); }
.on-dark .btn--outline{ border-color:var(--canvas); color:var(--canvas); }
.on-dark .btn--outline:hover{ background:var(--canvas); color:var(--ink); }
.btn-row{ display:flex; flex-wrap:wrap; gap:var(--sp-3); }

/* ============================================================
   PLACEHOLDER IMAGE BLOCKS
   Deliberately architectural / blueprint in style: diagonal
   hairline hatch, brass corner ticks, mono caption. Reads as
   "reserved for real photography," not a broken image.
   ============================================================ */
.ph{
  position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-3);
  overflow:hidden;
  text-align:center;
  padding:var(--sp-5);
}
.ph--dark{
  background:
    repeating-linear-gradient(135deg, rgba(180,134,61,.10) 0 1px, transparent 1px 15px),
    linear-gradient(160deg, var(--ink-soft), var(--ink));
  color:var(--gold-soft);
  border:1px solid rgba(180,134,61,.35);
}
.ph--light{
  background:
    repeating-linear-gradient(135deg, rgba(16,25,43,.06) 0 1px, transparent 1px 15px),
    var(--canvas-deep);
  color:var(--ink-mute);
  border:1px solid var(--rule);
}
.ph .ph-icon{ width:34px; height:34px; opacity:.85; }
.ph .ph-label{
  font-family:var(--mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700;
  max-width:16rem;
}
.ph .ph-tag{
  font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase;
  opacity:.7;
}
.ph-corners::before,.ph-corners::after,.ph-corners .c2::before,.ph-corners .c2::after{ content:""; }
.corner{ position:absolute; width:16px; height:16px; border:0; }
.corner-tl{ top:8px; left:8px; border-top:1.5px solid var(--gold); border-left:1.5px solid var(--gold); }
.corner-tr{ top:8px; right:8px; border-top:1.5px solid var(--gold); border-right:1.5px solid var(--gold); }
.corner-bl{ bottom:8px; left:8px; border-bottom:1.5px solid var(--gold); border-left:1.5px solid var(--gold); }
.corner-br{ bottom:8px; right:8px; border-bottom:1.5px solid var(--gold); border-right:1.5px solid var(--gold); }

.ph-caption{
  position:absolute; left:0; bottom:0; right:0;
  background:rgba(16,25,43,.88);
  color:var(--canvas);
  padding:var(--sp-4) var(--sp-5);
  text-align:left;
}
.ph-caption .cap-title{ font-family:var(--display); font-style:italic; font-size:1.15rem; color:var(--canvas); }
.ph-caption .cap-sub{ font-size:.8rem; color:#c3cbdb; margin-top:.2rem; }

/* real photo variant — same frame language (corners + caption), actual image */
.ph-photo{ position:relative; overflow:hidden; border:1px solid rgba(180,134,61,.35); padding:0; }
.ph-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ph-photo .corner{ z-index:2; }

/* crossfade slideshow — same frame, rotating photos + labels */
.hero-slideshow .slide{ position:absolute; inset:0; opacity:0; transition:opacity 1.1s var(--ease); }
.hero-slideshow .slide.is-active{ opacity:1; z-index:1; }
.hero-slideshow .slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* aspect ratios */
.ph.ar-hero{ aspect-ratio:6/5; }
.ph.ar-square{ aspect-ratio:1/1; }
.ph.ar-wide{ aspect-ratio:16/10; }
.ph.ar-tall{ aspect-ratio:3/4; }
.ph.ar-card{ aspect-ratio:4/3; }

/* ============================================================
   REVEAL ANIMATION — one considered load/scroll moment
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease-out), transform .7s var(--ease-out); }
  .reveal.is-visible{ opacity:1; transform:translateY(0); }
}

/* ============================================================
   HEADER
   ============================================================ */
.topbar{
  background:var(--ink); color:#c3cbdb;
  font-family:var(--mono); font-size:.7rem; letter-spacing:.06em;
}
.topbar .container{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); padding-block:.55rem; }
.topbar a{ color:var(--gold-soft); font-weight:700; }
.topbar a:hover{ color:var(--gold); }
.topbar .tb-left{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

header.site{
  position:sticky; top:0; z-index:100;
  background:var(--canvas-light);
  border-bottom:1px solid var(--rule);
}
.nav-row{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-5); padding-block:var(--sp-3); }

.logo{ display:flex; align-items:center; gap:.7rem; }
.logo-mark-img{ height:46px; width:auto; flex:none; display:block; }
.logo-word{ line-height:1.15; }
.logo-word .l1{ font-family:var(--display); font-weight:600; font-size:1.15rem; letter-spacing:.01em; }
.logo-word .l2{ font-family:var(--mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); }

.main-nav{ display:none; }
.main-nav ul{ display:flex; align-items:center; gap:var(--sp-6); }
.main-nav a{
  font-size:.88rem; font-weight:600; color:var(--ink-soft);
  padding-block:.4rem; border-bottom:2px solid transparent;
  transition:border-color .18s var(--ease), color .18s var(--ease);
}
.main-nav a:hover{ color:var(--ink); border-color:var(--gold); }

.nav-cta{ display:none; }

.nav-toggle{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; border:1px solid var(--rule); border-radius:2px;
}
.nav-toggle .bars{ position:relative; width:18px; height:12px; }
.nav-toggle .bars span{ position:absolute; left:0; right:0; height:1.5px; background:var(--ink); transition:transform .25s var(--ease), opacity .25s var(--ease); }
.nav-toggle .bars span:nth-child(1){ top:0; }
.nav-toggle .bars span:nth-child(2){ top:50%; margin-top:-.75px; }
.nav-toggle .bars span:nth-child(3){ bottom:0; }
.nav-toggle[aria-expanded="true"] .bars span:nth-child(1){ transform:translateY(5.25px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .bars span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .bars span:nth-child(3){ transform:translateY(-5.25px) rotate(-45deg); }

.mobile-panel{
  position:fixed; inset:0; top:var(--headerH,105px);
  background:var(--canvas-light);
  z-index:99;
  padding:var(--sp-7) var(--sp-5);
  transform:translateX(100%);
  transition:transform .32s var(--ease-out);
  overflow-y:auto;
}
.mobile-panel.is-open{ transform:translateX(0); }
.mobile-panel ul{ display:flex; flex-direction:column; gap:var(--sp-2); }
.mobile-panel a{ display:block; font-family:var(--display); font-size:1.6rem; padding-block:var(--sp-3); border-bottom:1px solid var(--rule); }
.mobile-panel .btn-row{ margin-top:var(--sp-6); flex-direction:column; }

@media (min-width:960px){
  .main-nav{ display:block; }
  .nav-cta{ display:inline-flex; }
  .nav-toggle{ display:none; }
  .mobile-panel{ display:none; }
}

/* ============================================================
   HERO
   ============================================================ */
.hero{ padding-block:clamp(2.5rem,6vw,4.5rem); overflow:hidden; }
.hero-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-8); align-items:center; }
.hero-copy .eyebrow{ margin-bottom:var(--sp-4); }
.hero-copy h1{ font-size:clamp(2.4rem,6.4vw,3.9rem); }
.hero-copy .lede-list{ margin-top:var(--sp-5); display:flex; flex-direction:column; gap:.5rem; }
.hero-copy .lede-list li{ display:flex; gap:.7em; color:var(--ink-soft); font-size:1.02rem; }
.hero-copy .lede-list li::before{ content:"—"; color:var(--gold-deep); flex:none; }
.hero-copy .lede-list b{ font-weight:700; }

.tile-grid{ margin-top:var(--sp-6); display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--rule); border:1px solid var(--rule); }
.tile{ background:var(--paper); padding:var(--sp-4); }
.tile .t-num{ font-family:var(--mono); font-size:1.3rem; font-weight:700; font-variant-numeric:tabular-nums; display:flex; align-items:baseline; gap:.5em; flex-wrap:wrap; }
.tile .t-label{ margin-top:.3rem; font-size:.78rem; color:var(--ink-mute); line-height:1.4; }

.hero-copy .btn-row{ margin-top:var(--sp-6); }

.hero-visual{ position:relative; }
.hero-visual .touchmark{ position:absolute; top:-40px; right:-40px; width:180px; height:180px; opacity:.5; pointer-events:none; }

.hero-thumbs{ margin-top:var(--sp-4); display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-3); }
.hero-thumbs .ph{ padding:var(--sp-3); }
.hero-thumbs .ph .ph-label{ font-size:.6rem; }
.hero-thumbs .ph .ph-icon{ width:22px; height:22px; }

@media (min-width:960px){
  .hero-grid{ grid-template-columns:1fr 1fr; gap:var(--sp-9); }
  .tile-grid{ grid-template-columns:1fr 1fr; }
}

/* ============================================================
   STATS BAND (dark)
   ============================================================ */
.stats-band{ background:var(--ink); color:var(--canvas); padding-block:var(--sp-8); }
.stats-band .grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-6); text-align:center; }
.stats-band .stat h3{ font-family:var(--display); font-size:clamp(1.8rem,3.4vw,2.6rem); color:var(--canvas); display:flex; align-items:baseline; justify-content:center; gap:.5em; flex-wrap:wrap; }
.stats-band .stat .gold-part{ color:var(--gold); }
.stats-band .stat p{ margin-top:.5rem; font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; color:#93a0b8; }
@media (min-width:720px){ .stats-band .grid{ grid-template-columns:repeat(5,1fr); } }

/* ============================================================
   LEAD STRIP
   ============================================================ */
.lead-strip{ background:var(--canvas-deep); padding-block:var(--sp-7); border-block:1px solid var(--rule); }
.lead-strip .row{ display:flex; flex-direction:column; gap:var(--sp-5); align-items:flex-start; }
.lead-strip .book{
  flex:none; width:74px; height:96px;
  background:linear-gradient(160deg,var(--ink-soft),var(--ink));
  border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold-soft); font-family:var(--mono); font-size:.55rem; text-align:center; padding:.4rem;
}
.lead-strip .text h3{ font-size:1.3rem; }
.lead-strip .text p{ margin-top:.4rem; color:var(--ink-mute); max-width:34rem; }
@media (min-width:820px){
  .lead-strip .row{ flex-direction:row; align-items:center; justify-content:space-between; }
  .lead-strip .text{ display:flex; align-items:center; gap:var(--sp-5); flex:1; }
}

/* ============================================================
   TWO COL (opportunity / generic editorial)
   ============================================================ */
.two-col{ padding-block:var(--sp-10); }
.two-col .grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-7); }
.two-col h2{ font-size:clamp(2rem,4.2vw,2.8rem); margin-top:var(--sp-3); }
.two-col .body-copy p{ color:var(--ink-soft); margin-top:var(--sp-4); }
.two-col .body-copy p:first-of-type{ margin-top:var(--sp-5); }

.glance-panel{
  border:1px solid var(--gold); padding:var(--sp-6);
  background:var(--paper);
  position:relative;
}
.glance-panel::before,.glance-panel::after{ content:""; position:absolute; width:22px; height:22px; }
.glance-panel::before{ top:-1px; left:-1px; border-top:2px solid var(--gold); border-left:2px solid var(--gold); }
.glance-panel::after{ bottom:-1px; right:-1px; border-bottom:2px solid var(--gold); border-right:2px solid var(--gold); }
.glance-panel .g-eyebrow{ font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; }
.glance-row{ margin-top:var(--sp-5); padding-top:var(--sp-4); border-top:1px solid var(--rule); }
.glance-row:first-of-type{ border-top:0; margin-top:var(--sp-4); padding-top:0; }
.glance-row .g-label{ font-family:var(--mono); font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); }
.glance-row .g-value{ font-family:var(--display); font-size:1.7rem; margin-top:.15rem; display:flex; align-items:baseline; gap:.6em; flex-wrap:wrap; }

@media (min-width:960px){ .two-col .grid{ grid-template-columns:1.1fr .9fr; align-items:start; } }

/* ============================================================
   STRATEGY FEATURES (numbered — genuinely three strategies)
   ============================================================ */
.strategies{ padding-block:var(--sp-10); background:var(--canvas-light); }
.strategy{ display:grid; grid-template-columns:1fr; gap:var(--sp-6); padding-block:var(--sp-9); }
.strategy:not(:last-child){ border-bottom:1px solid var(--rule); }
.strategy .num{ font-family:var(--display); font-style:italic; font-size:2.6rem; color:var(--gold-soft); line-height:1; }
.strategy .loc{ display:flex; align-items:center; gap:.5em; font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); margin-top:var(--sp-2); }
.strategy h3{ font-size:clamp(1.7rem,3vw,2.3rem); margin-top:var(--sp-2); }
.strategy h3 .strand{ color:var(--clay-deep); font-style:italic; font-weight:500; }
.strategy .desc{ margin-top:var(--sp-3); color:var(--ink-soft); max-width:38rem; }
.strategy .ret-row{ display:flex; align-items:baseline; gap:var(--sp-4); margin-top:var(--sp-5); padding-top:var(--sp-5); border-top:1px solid var(--rule); flex-wrap:wrap; }
.strategy .ret-num{ font-family:var(--display); font-size:2.8rem; color:var(--ink); display:flex; align-items:baseline; }
.strategy .ret-num sup{ font-size:1.1rem; color:var(--gold-deep); }
.strategy .ret-meta p{ font-size:.78rem; color:var(--ink-mute); text-transform:uppercase; letter-spacing:.05em; }
.strategy .ret-meta .term{ font-family:var(--display); font-style:italic; color:var(--ink-soft); font-size:.95rem; margin-top:.2rem; text-transform:none; letter-spacing:0; }

.stat-mini-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); margin-top:var(--sp-5); }
.stat-mini .m-label{ font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); }
.stat-mini .m-value{ font-family:var(--display); font-size:1.15rem; margin-top:.2rem; }

.tag-row{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:var(--sp-5); }
.tag{ font-family:var(--mono); font-size:.66rem; letter-spacing:.05em; text-transform:uppercase; border:1px solid var(--rule); padding:.4em .8em; color:var(--ink-soft); }
.tag--clay{ border-color:var(--clay); color:var(--clay-deep); }

.strategy .btn-row{ margin-top:var(--sp-6); }
.strategy .visual{ position:relative; }
.strategy.reverse .visual{ order:-1; }

@media (min-width:960px){
  .strategy{ grid-template-columns:1fr .85fr; gap:var(--sp-9); align-items:start; }
  .strategy.reverse{ grid-template-columns:.85fr 1fr; }
  .strategy.reverse .visual{ order:1; }
}

/* ============================================================
   PIPELINE CAROUSEL
   ============================================================ */
.pipeline{ padding-block:var(--sp-10); background:var(--canvas-deep); }
.pipeline-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:var(--sp-5); flex-wrap:wrap; margin-bottom:var(--sp-6); }
.pipeline-controls{ display:flex; gap:.5rem; }
.pipeline-controls button{ width:44px; height:44px; border:1px solid var(--ink); display:flex; align-items:center; justify-content:center; transition:background .18s var(--ease), color .18s var(--ease); }
.pipeline-controls button:hover{ background:var(--ink); color:var(--canvas); }
.pipeline-controls svg{ width:16px; height:16px; }

.pipeline-track{ display:flex; gap:var(--sp-5); overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:var(--sp-3); scrollbar-width:thin; }
.pipeline-card{ scroll-snap-align:start; flex:0 0 min(320px,80vw); background:var(--paper); border:1px solid var(--rule); display:flex; flex-direction:column; }
.pipeline-card .ph{ border-radius:0; }
.pipeline-card .pc-status{
  position:absolute; top:10px; left:10px; z-index:2;
  background:var(--ink); color:var(--gold-soft);
  font-family:var(--mono); font-size:.6rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.35em .7em;
}
.pipeline-card .pc-body{ padding:var(--sp-5); flex:1; display:flex; flex-direction:column; }
.pipeline-card .pc-loc{ font-family:var(--mono); font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-mute); }
.pipeline-card h4{ font-size:1.25rem; margin-top:.3rem; }
.pipeline-card h4 .strand{ color:var(--gold-deep); font-style:italic; font-weight:500; }
.pipeline-card p.pc-desc{ margin-top:.5rem; color:var(--ink-soft); font-size:.9rem; flex:1; }
.pipeline-card .pc-foot{ margin-top:var(--sp-4); padding-top:var(--sp-3); border-top:1px solid var(--rule); display:flex; justify-content:space-between; align-items:baseline; }

/* ============================================================
   LEDGER PANELS (dark)
   ============================================================ */
.ledger-section{ background:var(--ink); color:var(--canvas); padding-block:var(--sp-10); }
.ledger-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-8); }
.ledger-copy h2{ color:var(--canvas); font-size:clamp(2rem,4vw,2.7rem); }
.ledger-copy .accent-italic{ color:var(--gold); }
.ledger-copy p{ margin-top:var(--sp-4); color:#c3cbdb; max-width:32rem; }
.ledger-copy .btn-row{ margin-top:var(--sp-6); }

.ledger-panel{ border:1px solid var(--ink-line); background:rgba(255,255,255,.02); }
.ledger-panel .lp-head{ padding:var(--sp-4) var(--sp-5); border-bottom:1px solid var(--ink-line); font-family:var(--mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-soft); display:flex; justify-content:space-between; gap:var(--sp-3); flex-wrap:wrap; }
.ledger-row{ display:flex; justify-content:space-between; align-items:baseline; padding:var(--sp-3) var(--sp-5); border-bottom:1px solid var(--ink-line); font-family:var(--mono); font-size:.85rem; }
.ledger-row .lr-label{ color:#c3cbdb; }
.ledger-row .lr-value{ font-variant-numeric:tabular-nums; }
.ledger-row.neg .lr-value{ color:#e08a8a; }
.ledger-row.total{ background:var(--gold); }
.ledger-row.total .lr-label,.ledger-row.total .lr-value{ color:var(--ink); font-weight:700; }
.ledger-note{ padding:var(--sp-4) var(--sp-5); font-size:.7rem; color:#93a0b8; font-style:italic; }

@media (min-width:960px){ .ledger-grid{ grid-template-columns:1fr 1fr; align-items:center; } }

/* scenarios */
.scenarios{ background:var(--ink-soft); padding-block:var(--sp-10); color:var(--canvas); }
.scenarios .section-head h2{ color:var(--canvas); }
.scenarios .section-head p{ color:#c3cbdb; }
.scenario-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--ink-line); border:1px solid var(--ink-line); max-width:640px; }
.scenario-row{ background:var(--ink-soft); padding:var(--sp-5); display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-4); }
.scenario-row .s-label{ font-family:var(--display); font-style:italic; font-size:1.1rem; color:var(--canvas); }
.scenario-row .s-value{ font-family:var(--display); font-size:2.3rem; color:var(--gold); display:flex; align-items:baseline; gap:.2em; }
.scenario-row .s-value sup{ font-size:1rem; }
.scenario-row .s-meta{ font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:#93a0b8; }

/* ============================================================
   REASON CARDS
   ============================================================ */
.why{ padding-block:var(--sp-10); }
.why-lede{ display:grid; grid-template-columns:1fr; gap:var(--sp-6); align-items:start; margin-bottom:var(--sp-8); }
.why-lede .roman{ font-family:var(--display); font-style:italic; font-size:4.5rem; color:var(--gold-soft); line-height:1; }
.why-lede h2{ font-size:clamp(2rem,4vw,2.8rem); }
.why-lede p{ margin-top:var(--sp-4); color:var(--ink-soft); }

.sample-stat-row{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-5); margin-top:var(--sp-6); }
.sample-stat h4{ font-family:var(--display); font-size:1.8rem; display:flex; align-items:baseline; gap:.5em; flex-wrap:wrap; }
.sample-stat p{ font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-mute); margin-top:.3rem; }

.reason-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-4); }
.reason-card{ border:1px solid var(--rule); padding:var(--sp-5); background:var(--paper); }
.reason-card .r-idx{ font-family:var(--mono); font-size:.68rem; color:var(--gold-deep); letter-spacing:.06em; display:flex; align-items:center; gap:.6em; }
.reason-card .r-idx::after{ content:""; flex:1; height:1px; background:var(--rule); }
.reason-card .r-icon{ width:26px; height:26px; margin-top:var(--sp-4); color:var(--gold-deep); }
.reason-card h4{ font-size:1.15rem; margin-top:var(--sp-3); }
.reason-card h4 .strand{ font-style:italic; font-weight:500; color:var(--gold-deep); }
.reason-card p{ margin-top:.5rem; color:var(--ink-mute); font-size:.92rem; }

@media (min-width:720px){ .reason-grid{ grid-template-columns:repeat(3,1fr); } .sample-stat-row{ grid-template-columns:repeat(4,1fr); } }
@media (min-width:960px){ .why-lede{ grid-template-columns:auto 1fr; gap:var(--sp-7); } }

/* signature statement panel */
.statement{ background:var(--ink); color:var(--canvas); padding-block:var(--sp-9); position:relative; overflow:hidden; }
.statement::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 15% 15%, rgba(180,134,61,.14), transparent 55%); pointer-events:none; }
.statement-grid{ position:relative; display:grid; grid-template-columns:1fr; gap:var(--sp-8); align-items:center; text-align:center; }
.statement h2{ color:var(--canvas); font-size:clamp(1.9rem,4.4vw,2.7rem); max-width:26rem; margin-inline:auto; }
.statement .accent-italic{ color:var(--gold); }
.statement p{ margin-top:var(--sp-4); color:#c3cbdb; max-width:34rem; margin-inline:auto; }
.statement-art{ display:flex; justify-content:center; }
.statement-art svg{ width:100%; max-width:360px; height:auto; }
.art-label{
  font-family:var(--mono); font-size:8.5px; letter-spacing:.06em; text-transform:uppercase; font-weight:700;
  fill:#c3cbdb; text-anchor:middle;
}
@media (min-width:900px){
  .statement-grid{ grid-template-columns:1fr 1fr; text-align:left; }
  .statement h2, .statement p{ margin-inline:0; }
  .statement-art svg{ max-width:420px; }
}

/* ============================================================
   WHY MANAV CHECKLIST
   ============================================================ */
.why-manav{ padding-block:var(--sp-10); background:var(--canvas-light); }
.wm-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-8); }
.wm-copy h2{ font-size:clamp(2rem,4vw,2.7rem); margin-top:var(--sp-3); }
.checklist{ margin-top:var(--sp-6); display:flex; flex-direction:column; }
.check-item{ display:flex; gap:var(--sp-4); padding-block:var(--sp-4); border-top:1px solid var(--rule); }
.check-item:last-child{ border-bottom:1px solid var(--rule); }
.check-item .c-icon{ flex:none; width:34px; height:34px; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center; color:var(--gold-deep); }
.check-item .c-icon svg{ width:16px; height:16px; }
.check-item h4{ font-size:1.05rem; }
.check-item h4 .accent-italic{ font-weight:500; }
.check-item p{ margin-top:.3rem; color:var(--ink-mute); font-size:.92rem; }

.wm-visuals{ display:flex; flex-direction:column; gap:var(--sp-4); }

@media (min-width:960px){ .wm-grid{ grid-template-columns:1.05fr .95fr; gap:var(--sp-9); } }

/* ============================================================
   PROCESS
   ============================================================ */
.process{ background:var(--ink); color:var(--canvas); padding-block:var(--sp-10); }
.process .section-head{ text-align:center; margin-inline:auto; }
.process .section-head h2{ color:var(--canvas); }
.process .section-head p{ color:#c3cbdb; }
.steps{ margin-top:var(--sp-8); display:flex; flex-direction:column; gap:var(--sp-6); counter-reset:step; }
.step{ display:flex; gap:var(--sp-5); }
.step .s-circle{
  flex:none; width:56px; height:56px; border-radius:50%; border:1px solid var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-style:italic; color:var(--gold);
}
.step .s-body h4{ color:var(--canvas); font-size:1.15rem; }
.step .s-body p{ margin-top:.3rem; color:#93a0b8; font-size:.92rem; max-width:30rem; }
.step-line{ display:none; }

@media (min-width:900px){
  .steps{ flex-direction:row; align-items:flex-start; gap:0; position:relative; }
  .steps::before{ content:""; position:absolute; top:28px; left:5%; right:5%; height:1px; background:var(--ink-line); }
  .step{ flex-direction:column; align-items:center; text-align:center; flex:1; padding-inline:var(--sp-3); position:relative; z-index:1; }
  .step .s-circle{ background:var(--ink); }
  .step .s-body p{ max-width:15rem; }
}

/* ============================================================
   TEAM
   ============================================================ */
.team{ padding-block:var(--sp-10); }
.team-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-7); align-items:start; }
.team-copy .eyebrow{ margin-bottom:var(--sp-3); }
.team-copy h2{ font-size:clamp(2rem,4vw,2.7rem); }
.team-quote{ margin-top:var(--sp-5); padding-left:var(--sp-5); border-left:3px solid var(--gold); font-family:var(--display); font-style:italic; font-size:1.25rem; color:var(--ink-soft); }
.credentials{ margin-top:var(--sp-6); display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); }
.credential{ display:flex; gap:.8rem; align-items:flex-start; }
.credential svg{ width:20px; height:20px; flex:none; color:var(--gold-deep); margin-top:.15rem; }
.credential h5{ font-size:.92rem; font-weight:700; }
.credential p{ font-size:.82rem; color:var(--ink-mute); }
.office-line{ margin-top:var(--sp-6); padding-top:var(--sp-5); border-top:1px solid var(--rule); }
.office-line .g-label{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; }
.office-line p{ margin-top:.4rem; color:var(--ink-soft); }

@media (min-width:960px){ .team-grid{ grid-template-columns:.8fr 1.2fr; } }

/* ============================================================
   PORTFOLIO
   ============================================================ */
.portfolio{ padding-block:var(--sp-10); background:var(--canvas-deep); }
.portfolio-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-4); }
.pf-card{ background:var(--paper); border:1px solid var(--rule); }
.pf-card .ph{ padding:var(--sp-4); }
.pf-body{ padding:var(--sp-4); }
.pf-body .pf-tag{ font-family:var(--mono); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); }
.pf-body h4{ font-size:1.05rem; margin-top:.25rem; }
.pf-body .pf-meta{ margin-top:.3rem; font-size:.82rem; color:var(--ink-mute); }

@media (min-width:640px){ .portfolio-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:960px){ .portfolio-grid{ grid-template-columns:repeat(3,1fr); } }

.portfolio-access{ margin-top:var(--sp-7); padding-top:var(--sp-6); border-top:1px solid var(--rule); display:flex; flex-direction:column; gap:var(--sp-4); align-items:flex-start; }
.portfolio-access p{ color:var(--ink-soft); max-width:42rem; }
.portfolio-access-login{ font-size:.85rem; font-weight:600; color:var(--gold-deep); align-self:center; }
.portfolio-access-login:hover{ color:var(--ink); }
@media (min-width:640px){ .portfolio-access{ flex-direction:row; align-items:center; justify-content:space-between; gap:var(--sp-6); } }

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testimonials{ padding-block:var(--sp-10); background:var(--canvas-deep); border-top:1px solid var(--rule); }
.testimonials .disclose{ font-size:.78rem; color:var(--ink-mute); font-style:italic; margin-top:.5rem; }
.t-grid{ margin-top:var(--sp-6); display:grid; grid-template-columns:1fr; gap:var(--sp-4); }
.t-card{ background:var(--paper); border:1px solid var(--rule); padding:var(--sp-5); display:flex; flex-direction:column; }
.t-card .quote-mark{ font-family:var(--display); font-size:2.4rem; color:var(--gold-soft); line-height:1; font-style:italic; }
.t-card p.q{ font-family:var(--display); font-style:italic; font-size:1.05rem; color:var(--ink-soft); flex:1; margin-top:-.5rem; }
.t-card .who{ margin-top:var(--sp-4); padding-top:var(--sp-3); border-top:1px solid var(--rule); }
.t-card .who .name{ font-weight:700; font-size:.9rem; }
.t-card .who .role{ font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-mute); margin-top:.15rem; }

@media (min-width:900px){ .t-grid{ grid-template-columns:repeat(3,1fr); } }

/* ============================================================
   FAQ
   ============================================================ */
.faq{ padding-block:var(--sp-10); }
.faq-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-7); }
.faq-copy h2{ font-size:clamp(2rem,4vw,2.7rem); }
.faq-copy p{ margin-top:var(--sp-4); color:var(--ink-mute); max-width:26rem; }
.faq-copy .btn-row{ margin-top:var(--sp-6); }

.faq-list details{ border-top:1px solid var(--rule); }
.faq-list details:last-child{ border-bottom:1px solid var(--rule); }
.faq-list summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4);
  padding-block:var(--sp-4);
  font-weight:600; font-size:1rem;
}
.faq-list summary::-webkit-details-marker{ display:none; }
.faq-list .chev{ flex:none; width:30px; height:30px; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center; transition:transform .25s var(--ease); color:var(--gold-deep); }
.faq-list details[open] .chev{ transform:rotate(45deg); }
.faq-list .a-body{ padding-bottom:var(--sp-4); color:var(--ink-mute); max-width:38rem; font-size:.95rem; }

@media (min-width:960px){ .faq-grid{ grid-template-columns:.8fr 1.2fr; } }

/* ============================================================
   FINAL CTA / CONTACT
   ============================================================ */
.final-cta{
  background:var(--ink); color:var(--canvas);
  position:relative; overflow:hidden; text-align:center;
  padding:clamp(5rem,9vw,8rem) 0;
}
.final-cta::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 50% 0%, rgba(184,146,76,.16), transparent 55%);
  pointer-events:none;
}
.final-cta .touchmark{ position:absolute; left:50%; top:50%; width:640px; height:640px; transform:translate(-50%,-50%); opacity:.12; pointer-events:none; }
.final-cta .container{ position:relative; }
.final-cta h2{ color:var(--canvas); font-size:clamp(2.2rem,6vw,3.8rem); max-width:38rem; margin-inline:auto; }
.final-cta .accent-italic{ color:var(--gold); }
.final-cta > .container > p{ margin-top:var(--sp-4); color:#c3cbdb; max-width:34rem; margin-inline:auto; }
.final-cta .btn-row{ margin-top:var(--sp-6); justify-content:center; }
.final-cta .contact-lines{ margin-top:var(--sp-7); display:flex; flex-direction:column; gap:.4rem; font-family:var(--mono); font-size:.85rem; color:#c3cbdb; }
.final-cta .contact-lines a{ color:var(--gold-soft); }
.final-cta .contact-lines a:hover{ color:var(--gold); }

/* ============================================================
   FOOTER
   ============================================================ */
footer.site{ background:var(--canvas-deep); padding-top:var(--sp-9); }
.footer-grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-7); }
.footer-brand p{ margin-top:var(--sp-3); color:var(--ink-mute); max-width:26rem; font-size:.92rem; }
.footer-col h5{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; margin-bottom:var(--sp-3); }
.footer-col p, .footer-col a{ display:block; color:var(--ink-soft); font-size:.92rem; margin-bottom:.5rem; }
.footer-col a:hover{ color:var(--gold-deep); }

.social-row{ display:flex; gap:.6rem; margin-top:var(--sp-5); }
.social-row a{ width:38px; height:38px; border:1px solid var(--ink-mute); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:.72rem; font-weight:700; color:var(--ink-soft); transition:background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease); }
.social-row a:hover{ background:var(--ink); color:var(--canvas); border-color:var(--ink); }

.footer-bottom{ margin-top:var(--sp-8); padding-block:var(--sp-5); border-top:1px solid var(--rule); }
.disclosure{ font-size:.78rem; color:var(--ink-mute); max-width:70ch; line-height:1.6; }
.disclosure strong{ color:var(--ink-soft); }
.legal-line{ margin-top:var(--sp-3); font-size:.75rem; color:var(--ink-mute); }

@media (min-width:720px){ .footer-grid{ grid-template-columns:1.4fr .8fr .8fr; } }

/* ============================================================
   ACCESS GATE + ARCHIVE (projects.html)
   ============================================================ */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.gate{ padding-block:clamp(4rem,10vw,7rem); min-height:60vh; display:flex; align-items:center; }
.gate-card{ max-width:30rem; margin-inline:auto; text-align:center; }
.gate-icon{ display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; border-radius:50%; border:1px solid var(--gold); color:var(--gold-deep); margin-bottom:var(--sp-5); }
.gate-card .eyebrow{ justify-content:center; }
.gate-card h1{ font-size:clamp(2rem,5vw,2.8rem); margin-top:var(--sp-3); }
.gate-card > p{ margin-top:var(--sp-4); color:var(--ink-mute); }
.gate-card form{ margin-top:var(--sp-6); display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center; }
.gate-card input{
  flex:1; min-width:12rem; min-height:44px;
  padding:0 1em; border:1px solid var(--rule); border-radius:2px;
  background:var(--paper); color:var(--ink); font-size:1rem;
  letter-spacing:.08em;
}
.gate-card input:focus-visible{ outline:2px solid var(--gold-deep); outline-offset:2px; }
.gate-card p a{ color:var(--gold-deep); font-weight:600; }
.gate-card p a:hover{ color:var(--ink); }
.gate-error{ margin-top:var(--sp-4); color:#a8460b; font-size:.9rem; }

.archive{ padding-block:var(--sp-9); }
.archive-grid{ margin-top:var(--sp-7); display:grid; grid-template-columns:1fr; gap:var(--sp-4); }
@media (min-width:640px){ .archive-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:960px){ .archive-grid{ grid-template-columns:repeat(3,1fr); } }

.pf-link{
  font-family:inherit; font-size:inherit; color:var(--gold-deep); font-weight:600;
  text-decoration:underline; text-underline-offset:2px; cursor:pointer;
}
.pf-link:hover{ color:var(--ink); }

/* ============================================================
   PROJECT DETAILS MODAL (archive.html)
   ============================================================ */
.project-modal{
  border:0; padding:0; max-width:640px; width:calc(100% - 2.5rem);
  background:var(--paper); color:var(--ink);
  box-shadow:0 20px 60px rgba(16,25,43,.35);
  /* our global reset zeroes the UA margin:auto dialogs rely on for
     centering, so position it explicitly instead */
  position:fixed; top:50%; left:50%; margin:0; transform:translate(-50%,-50%);
}
.project-modal::backdrop{ background:rgba(16,25,43,.72); }
.pm-inner{ position:relative; max-height:85vh; overflow-y:auto; }
.pm-close{
  position:absolute; top:var(--sp-4); right:var(--sp-4); z-index:2;
  width:36px; height:36px; border-radius:50%; background:var(--canvas-light);
  border:1px solid var(--rule); display:flex; align-items:center; justify-content:center;
  color:var(--ink); transition:background .18s var(--ease), color .18s var(--ease);
}
.pm-close:hover{ background:var(--ink); color:var(--canvas); }
.pm-photo{ aspect-ratio:16/9; background:var(--canvas-deep); overflow:hidden; }
.pm-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.pm-body{ padding:var(--sp-6); }
.pm-body h3{ font-size:1.5rem; margin-top:.35rem; }
.pm-loc{ font-family:var(--mono); font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-mute); margin-top:.3rem; }

.pm-specs{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-3); margin-top:var(--sp-5); padding:var(--sp-4) 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
.pm-spec{ display:flex; flex-direction:column; align-items:center; gap:.35rem; text-align:center; color:var(--gold-deep); }
.pm-spec span{ font-family:var(--display); font-size:1.3rem; color:var(--ink); }
.pm-spec label{ font-family:var(--mono); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); }

.pm-section{ margin-top:var(--sp-5); }
.pm-section h5{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; }
.pm-placeholder{ margin-top:.4rem; color:var(--ink-mute); font-style:italic; font-size:.92rem; }

/* ============================================================
   BLOG — index (blog.html) + article pages
   ============================================================ */
.blog-hero{ padding-block:clamp(3rem,7vw,5rem); border-bottom:1px solid var(--rule); }
.blog-hero .section-head{ margin-bottom:0; }

.blog-grid{ padding-block:var(--sp-9); }
.blog-grid .grid{ display:grid; grid-template-columns:1fr; gap:var(--sp-5); }
@media (min-width:720px){ .blog-grid .grid{ grid-template-columns:repeat(2,1fr); } }

.blog-card{ display:flex; flex-direction:column; background:var(--paper); border:1px solid var(--rule); }
.blog-card-hero{
  position:relative; aspect-ratio:16/9; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(160deg, var(--ink-soft), var(--ink));
}
.blog-card-hero::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 30%, rgba(180,134,61,.22), transparent 60%); }
.blog-card-hero .bc-icon{ position:relative; width:56px; height:56px; border-radius:50%; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center; color:var(--gold); }
.blog-card-hero .bc-icon svg{ width:26px; height:26px; }
.blog-card-body{ padding:var(--sp-5); display:flex; flex-direction:column; flex:1; }
.blog-card .bc-meta{ font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-deep); }
.blog-card h3{ font-size:1.35rem; margin-top:.5rem; }
.blog-card p.bc-excerpt{ margin-top:.6rem; color:var(--ink-mute); font-size:.94rem; flex:1; }
.blog-card .bc-foot{ margin-top:var(--sp-4); padding-top:var(--sp-3); border-top:1px solid var(--rule); display:flex; justify-content:space-between; align-items:center; font-size:.82rem; }
.blog-card .bc-read{ font-weight:700; color:var(--gold-deep); }
.blog-card .bc-read:hover{ color:var(--ink); }
.blog-card .bc-date{ color:var(--ink-mute); font-family:var(--mono); font-size:.72rem; }

/* article pages */
.article-hero{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg, var(--ink-soft), var(--ink));
  padding-block:clamp(3.5rem,9vw,6rem);
  display:flex; align-items:center; justify-content:center;
}
.article-hero::before{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 20%, rgba(180,134,61,.2), transparent 60%); pointer-events:none; }
.article-hero .ah-icon{ position:relative; width:96px; height:96px; border-radius:50%; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center; color:var(--gold); }
.article-hero .ah-icon svg{ width:44px; height:44px; }
.article-hero .ah-rings{ position:absolute; left:50%; top:50%; width:420px; height:420px; transform:translate(-50%,-50%); opacity:.14; pointer-events:none; }

.article-header{ padding-block:var(--sp-7) var(--sp-6); border-bottom:1px solid var(--rule); }
.article-header .eyebrow{ justify-content:center; }
.article-header h1{ text-align:center; font-size:clamp(2rem,5vw,3rem); margin-top:var(--sp-3); max-width:44rem; margin-inline:auto; }
.article-header .byline{ text-align:center; margin-top:var(--sp-4); font-family:var(--mono); font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-mute); }

.article-body{ padding-block:var(--sp-9); }
.article-body .prose{ max-width:42rem; margin-inline:auto; }
.prose h2{ font-size:1.6rem; margin-top:var(--sp-8); }
.prose h2:first-child{ margin-top:0; }
.prose p{ margin-top:var(--sp-4); color:var(--ink-soft); font-size:1.05rem; }
.prose ul{ margin-top:var(--sp-4); display:flex; flex-direction:column; gap:.6rem; }
.prose ul li{ display:flex; gap:.7em; color:var(--ink-soft); font-size:1.02rem; }
.prose ul li::before{ content:"—"; color:var(--gold-deep); flex:none; }

.pull-quote{ margin-block:var(--sp-7); padding:var(--sp-6); background:var(--ink); color:var(--canvas); position:relative; }
.pull-quote p{ font-family:var(--display); font-style:italic; font-size:1.35rem; line-height:1.4; }
.pull-quote cite{ display:block; margin-top:var(--sp-4); font-style:normal; font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-soft); }

.insight-box{ margin-block:var(--sp-7); padding:var(--sp-5); border:1px solid var(--gold); background:var(--paper); }
.insight-box .ib-label{ font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; }
.insight-box p{ margin-top:.6rem; color:var(--ink-soft); }
.insight-box p:first-of-type{ margin-top:.6rem; }

.article-sources{ margin-top:var(--sp-8); padding-top:var(--sp-5); border-top:1px solid var(--rule); }
.article-sources h4{ font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; }
.article-sources ul{ margin-top:var(--sp-3); display:flex; flex-direction:column; gap:.4rem; }
.article-sources li{ font-size:.85rem; }
.article-sources a{ color:var(--gold-deep); }
.article-sources a:hover{ color:var(--ink); }

.article-nav{ padding-block:var(--sp-7); border-top:1px solid var(--rule); background:var(--canvas-light); }
.article-nav .grid{ max-width:42rem; margin-inline:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); flex-wrap:wrap; }
