/* ════════════════════════════════════════════════════════════════
   GREENBERG ADVISORY — BRAND TOKENS · v4.5.3
   Single source of truth. Every artifact in the Materials Package
   links this file. Drift between artifacts = bug, not preference.
   ──────────────────────────────────────────────────────────────
   Type system  : Outfit (display) · Montserrat (body) — brand canon
   Palette      : Coastal Emerald (5 core + 2 status only)
   Status colors: Slate / Brick Red — STATUS USE ONLY, never decorative
   ════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Outfit:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600&family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&display=swap');

:root{
  /* ── Coastal Emerald · core 5 ──────────────────────────────── */
  --ga-emerald:#1B4D3E;
  --ga-emerald-deep:#0F3329;
  --ga-emerald-mist:#3A6B5C;
  --ga-gold:#CC9D3B;
  --ga-gold-faded:#E8D9B0;
  --ga-charcoal:#2C2C2C;
  --ga-ivory:#F5F0E8;
  --ga-seafoam:#D4E8E0;

  /* ── Coastal Emerald · support tints ──────────────────────── */
  --ga-emerald-tint:#E8F0EC;
  --ga-gold-soft:#E5C77A;
  --ga-seafoam-soft:#EAF3EE;
  --ga-paper:#EAE4D6;
  --ga-grey:#EFEEEA;
  --ga-grey-rule:#C9C5BB;
  --ga-rule:#D9D2C2;
  --ga-white:#FFFFFF;
  --ga-ink:#1A1815;

  /* ── Charcoal scale (semantic) ─────────────────────────────── */
  --ga-charcoal-80:rgba(44,44,44,0.82);
  --ga-charcoal-70:rgba(44,44,44,0.72);
  --ga-charcoal-60:rgba(44,44,44,0.62);
  --ga-charcoal-40:rgba(44,44,44,0.42);
  --ga-charcoal-20:rgba(44,44,44,0.20);

  /* ── Status only · never decorative ────────────────────────── */
  --ga-slate:#5A6A7C;
  --ga-red:#B94040;

  /* ── Type families · brand canon ───────────────────────────── */
  --ga-display:'Outfit','Causten','Calibri',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ga-body:'Montserrat','Calibri',-apple-system,sans-serif;
  --ga-mono:'Montserrat','Calibri',-apple-system,sans-serif; /* tracked-caps tabular substitute for monospace */

  /* ── Motion ────────────────────────────────────────────────── */
  --ga-ease:cubic-bezier(0.32,0.72,0,1);

  /* ── Hairline widths (drafting register) ───────────────────── */
  --ga-hair:0.5pt;
  --ga-hair-bold:0.75pt;
  --ga-hair-heavy:1pt;
}

/* ── Base resets — applied universally ──────────────────────── */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--ga-body);
  color:var(--ga-charcoal);
  background:var(--ga-ivory);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"ss01","kern","tnum";
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; }
a{
  color:var(--ga-emerald);
  text-decoration:none;
  transition:color .35s var(--ga-ease);
}
a:hover{ color:var(--ga-gold); }

/* ── Display + body utility classes ─────────────────────────── */
.ga-display{ font-family:var(--ga-display); font-weight:300; letter-spacing:-0.014em; }
.ga-display em, .ga-display .ital{ font-style:italic; color:var(--ga-emerald); font-weight:400; }
.ga-body{ font-family:var(--ga-body); }
.ga-tab-nums{ font-variant-numeric:tabular-nums; letter-spacing:0.02em; }

/* ── Editorial italics (A-mode emphasis device) ─────────────── */
.ga-em{ font-style:italic; color:var(--ga-emerald); font-weight:400; }

/* ── Tracked-caps utility (eyebrows, drafting registers) ────── */
.ga-eyebrow{
  font-family:var(--ga-body);
  font-weight:600;
  font-size:9.5px;
  letter-spacing:0.30em;
  text-transform:uppercase;
  color:var(--ga-emerald);
}
.ga-eyebrow .cite{
  font-family:var(--ga-body);
  font-weight:500;
  letter-spacing:0.14em;
  color:var(--ga-slate);
  font-variant-numeric:tabular-nums;
}

/* ── Print color preservation ───────────────────────────────── */
@media print{
  *{ -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
}

/* ── Print page setup ──────────────────────────────────────── */
@page{ size:Letter; margin:0; }

/* ══════════════════════════════════════════════════════════════
   PAGE FRAME (8.5×11 print artifacts) — D-mode chrome
   Used by brochure + proposal. Website overrides with screen layout.
   ══════════════════════════════════════════════════════════════ */
.page{
  width:8.5in;
  height:11in;
  position:relative;
  overflow:hidden;
  background:var(--ga-ivory);
  page-break-after:always;
  break-after:page;
}
.page:last-child{ page-break-after:auto; break-after:auto; }

@media screen{
  body.print-stack{ padding:32px 0; background:#2a2a2a; }
  body.print-stack .page{
    margin:0 auto 28px;
    box-shadow:0 24px 60px rgba(0,0,0,0.45), 0 0 0 1px rgba(0,0,0,0.5);
  }
}

/* ── Drafting frame · sheet border ─────────────────────────── */
.sheet{
  position:absolute;
  inset:0.32in;
  border:var(--ga-hair) solid #555;
}
.sheet::before, .sheet::after,
.sheet > .tl, .sheet > .tr{
  content:"";
  position:absolute;
  width:10pt;
  height:10pt;
  background:var(--ga-ivory);
  border:var(--ga-hair) solid #555;
}
.sheet::before{ top:-5pt; left:-5pt; }
.sheet::after{ bottom:-5pt; right:-5pt; }
.sheet > .tl{ top:-5pt; right:-5pt; }
.sheet > .tr{ bottom:-5pt; left:-5pt; }

/* ── Drafting strip · top of page ──────────────────────────── */
.stripe{
  position:absolute;
  top:0.32in; left:0.32in; right:0.32in;
  height:22pt;
  border-bottom:var(--ga-hair) solid #555;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 14pt;
  background:var(--ga-ivory);
  font-family:var(--ga-body);
  font-weight:500;
  font-size:7.5pt;
  letter-spacing:0.14em;
  color:#444;
  text-transform:uppercase;
  font-variant-numeric:tabular-nums;
}
.stripe .scale{ display:inline-flex; align-items:center; gap:8pt; }
.stripe .scale .bar{
  display:inline-block; width:54pt; height:5pt;
  border:var(--ga-hair) solid #555;
  background:repeating-linear-gradient(90deg,#555 0,#555 0.5pt,transparent 0.5pt,transparent 7pt);
}
.stripe .gn{ color:var(--ga-emerald); font-weight:600; }

/* ── Drafting title block · bottom of page ─────────────────── */
.titleblock{
  position:absolute;
  left:0.32in; right:0.32in; bottom:0.32in;
  border-top:var(--ga-hair) solid #555;
  display:grid; grid-template-columns:2.4fr 1fr 1fr 0.7fr;
  background:var(--ga-ivory);
  font-family:var(--ga-body);
  font-weight:500;
  font-size:7pt;
  letter-spacing:0.10em;
  color:#333;
  text-transform:uppercase;
  font-variant-numeric:tabular-nums;
}
.titleblock .cell{
  padding:7pt 10pt 6pt;
  border-right:var(--ga-hair) solid #888;
}
.titleblock .cell:last-child{ border-right:none; }
.titleblock .cell .k{ color:#888; font-size:6.5pt; letter-spacing:0.18em; }
.titleblock .cell .v{ margin-top:3pt; font-weight:500; letter-spacing:0.06em; color:#222; }
.titleblock .cell.firm{ display:flex; align-items:center; gap:10pt; padding:6pt 12pt; }
.titleblock .cell.firm .gw{ display:flex; flex-direction:column; }
.titleblock .cell.firm .gn{
  font-family:var(--ga-display);
  font-weight:700;
  letter-spacing:0.08em;
  font-size:10pt;
  color:var(--ga-charcoal);
  line-height:1;
}
.titleblock .cell.firm .ad{ display:flex; align-items:center; gap:6pt; margin-top:3pt; }
.titleblock .cell.firm .ad .r{ width:14pt; height:0.5pt; background:var(--ga-gold); }
.titleblock .cell.firm .ad .a{
  font-family:var(--ga-display);
  font-weight:700;
  letter-spacing:0.22em;
  font-size:7pt;
  color:var(--ga-gold);
  line-height:1;
}
.titleblock .cell .v.gn{ color:var(--ga-emerald); }

/* ── Body region · sits inside frame ────────────────────────── */
.body-region{
  position:absolute;
  top:calc(0.32in + 22pt);
  left:0.32in; right:0.32in;
  bottom:calc(0.32in + 56pt);
  padding:0.36in 0.46in 0.32in;
  overflow:hidden;
}
.body-region > *{ position:relative; z-index:2; }

/* ══════════════════════════════════════════════════════════════
   A-MODE · EDITORIAL TYPOGRAPHY
   Used inside body-region for narrative pages
   ══════════════════════════════════════════════════════════════ */
.eb{
  font-family:var(--ga-body);
  font-weight:600;
  font-size:8.5pt;
  letter-spacing:0.30em;
  text-transform:uppercase;
  color:var(--ga-emerald);
  display:flex; justify-content:space-between; align-items:baseline;
  gap:18pt;
}
.eb .cite{
  font-family:var(--ga-body);
  font-weight:400;
  color:var(--ga-slate);
  letter-spacing:0.14em;
  font-size:8pt;
  font-variant-numeric:tabular-nums;
}
.eb .brackets{ letter-spacing:0.30em; }

h1.editorial, h2.editorial{
  font-family:var(--ga-display);
  font-weight:300;
  color:var(--ga-ink);
  letter-spacing:-0.014em;
  line-height:1.04;
  margin:14pt 0 0;
}
h1.editorial em, h2.editorial em{
  font-style:italic;
  color:var(--ga-emerald);
  font-weight:400;
}
h1.editorial{ font-size:38pt; max-width:7.2in; }
h2.editorial{ font-size:26pt; }

.rule-gold{
  height:1pt;
  background:var(--ga-gold);
  width:54pt;
  margin-top:18pt;
}

.deck{
  font-family:var(--ga-display);
  font-weight:300;
  font-size:11.5pt;
  line-height:1.55;
  color:var(--ga-charcoal);
  max-width:6.4in;
  margin-top:18pt;
  letter-spacing:-0.003em;
}
.deck em{ font-style:italic; color:var(--ga-emerald); font-weight:400; }
.deck b, .deck strong{ font-weight:600; color:var(--ga-ink); }

.subhead-a{
  font-family:var(--ga-body);
  font-weight:600;
  font-size:8.5pt;
  color:var(--ga-emerald);
  letter-spacing:0.28em;
  text-transform:uppercase;
  margin-top:18pt;
}
.subhead-a .cite{
  font-family:var(--ga-body);
  font-weight:400;
  color:var(--ga-slate);
  letter-spacing:0.14em;
  margin-left:10pt;
  font-variant-numeric:tabular-nums;
}

p.body-text{
  font-family:var(--ga-body);
  font-weight:400;
  font-size:10pt;
  line-height:1.6;
  color:var(--ga-charcoal);
  margin-top:9pt;
  max-width:6.6in;
}
p.body-text em{ font-style:italic; color:var(--ga-emerald); }
p.body-text b, p.body-text strong{ font-weight:600; color:var(--ga-ink); }

.anchor{
  margin:18pt 0 0;
  padding:0 0 0 16pt;
  border-left:1.5pt solid var(--ga-gold);
}
.anchor .text{
  font-family:var(--ga-display);
  font-weight:300;
  font-style:italic;
  font-size:17pt;
  line-height:1.28;
  letter-spacing:-0.006em;
  color:var(--ga-emerald);
  max-width:6in;
}
.anchor.sm .text{ font-size:14pt; }

.watermark{
  position:absolute;
  pointer-events:none;
  user-select:none;
  font-family:var(--ga-display);
  font-weight:300;
  color:var(--ga-emerald);
  opacity:0.06;
  line-height:0.85;
  letter-spacing:-0.04em;
  z-index:1;
}

/* ══════════════════════════════════════════════════════════════
   D-MODE COVER · drafting plate
   ══════════════════════════════════════════════════════════════ */
.cover{ background:var(--ga-grey); }
.cover .sheet{ border-color:#4a4a4a; }
.cover .sheet::before, .cover .sheet::after,
.cover .sheet > .tl, .cover .sheet > .tr{
  background:var(--ga-grey);
  border-color:#4a4a4a;
}
.cover .stripe{ background:var(--ga-grey); border-bottom-color:#4a4a4a; }
.cover .titleblock{ background:var(--ga-grey); border-top-color:#4a4a4a; }
.cover .body-region{ background:var(--ga-grey); }

/* ══════════════════════════════════════════════════════════════
   SECTION-OPENER STRIP
   ══════════════════════════════════════════════════════════════ */
.sec-open{
  display:grid;
  grid-template-columns:1.6in 1fr;
  gap:0.24in;
  align-items:start;
  padding-bottom:14pt;
  border-bottom:var(--ga-hair) solid var(--ga-rule);
}
.sec-open .dwg-num{
  font-family:var(--ga-body);
  font-weight:500;
  font-size:8pt;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:#444;
  line-height:1.6;
  font-variant-numeric:tabular-nums;
}
.sec-open .dwg-num b{ color:var(--ga-emerald); font-weight:600; }
.sec-open .dwg-num .big{
  display:block;
  margin-top:6pt;
  font-family:var(--ga-display);
  font-weight:300;
  font-size:68pt;
  line-height:0.85;
  color:var(--ga-emerald);
  letter-spacing:-0.03em;
  font-variant-numeric:tabular-nums;
}
.sec-open .head{ padding-top:6pt; }

/* ══════════════════════════════════════════════════════════════
   SWATCH UTILITY · for token displays in the master index
   ══════════════════════════════════════════════════════════════ */
.swatch{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--ga-white);
  padding:8px 12px;
  border:0.5px solid var(--ga-charcoal-20);
  border-radius:9999px;
  font-family:var(--ga-body);
  font-weight:500;
  font-size:10px;
  letter-spacing:0.10em;
  color:var(--ga-charcoal);
  font-variant-numeric:tabular-nums;
}
.swatch .dot{
  width:14px;
  height:14px;
  border-radius:50%;
  border:0.5px solid rgba(0,0,0,0.15);
  box-shadow:inset 0 1px 1px rgba(0,0,0,0.06);
}