:root {
  --ink:    #0f172a;
  --text:   #2d3748;
  --muted:  #64748b;
  --light:  #94a3b8;
  --paper:  #FAF8F4;
  --tint:   #f6f3ec;
  --rule:   #e8e4d8;
  --gold:   #B8860B;
  --gold-l: #FAF6E8;
  --gold-bg:#FCFAF1;
  --orange: #E8640A;
  --navy:   #1E3264;
  --code:   #0a0e1a;
  --fh:     'Instrument Serif', Georgia, serif;
  --fb:     'DM Sans', system-ui, sans-serif;
  --fm:     'JetBrains Mono', ui-monospace, monospace;
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--fb); background:var(--paper); color:var(--text); overflow-x:hidden; -webkit-font-smoothing:antialiased; font-weight:300; }

/* Progress */
#prog { position:fixed; top:0; left:0; z-index:999; height:1px; width:0%; background:var(--gold); }

/* Nav */
nav{
    background: #15203b;
}

@media (max-width: 768px){
  nav{
    background: #ffffff;
  }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HERO — REFERENCE DOC STYLE
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.briefing-hero {
  max-width:980px;
  margin:0 auto;
  padding:140px 32px 56px;
  border-bottom:1px solid var(--rule);
}

.brief-tag {
  display:inline-block;
  font-family:var(--fm);
  font-size:.66rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold);
  background:var(--gold-bg);
  border:1px solid var(--gold);
  border-radius:3px;
  padding:4px 10px;
  margin-bottom:24px;
}

.brief-title {
  font-family:var(--fh);
  font-size:clamp(2.6rem,5vw,4.4rem);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--ink);
  margin-bottom:24px;
}
.brief-title em { font-style:italic; color:var(--gold); }

.brief-deck {
  font-size:1.15rem;
  color:var(--muted);
  line-height:1.7;
  font-weight:300;
  max-width:780px;
  margin-bottom:40px;
}

/* TLDR Card */
.tldr {
  display:grid;
  grid-template-columns:160px 1fr;
  gap:32px;
  background:#fff;
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  border-radius:8px;
  padding:28px 32px;
  margin-top:36px;
}
.tldr-label {
  font-family:var(--fm);
  font-size:.7rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold);
  padding-top:4px;
}
.tldr-content { }
.tldr-content p {
  font-size:.96rem;
  color:var(--text);
  line-height:1.75;
  font-weight:300;
}
.tldr-content p + p { margin-top:10px; }
.tldr-content strong { color:var(--ink); font-weight:500; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DEFINITIONS BAND
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.defs-section {
  background:var(--tint);
  padding:64px 32px;
  border-bottom:1px solid var(--rule);
}
.defs-inner { max-width:980px; margin:0 auto; }
.defs-label {
  font-family:var(--fm);
  font-size:.66rem;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
}
.defs-title {
  font-family:var(--fh);
  font-size:1.6rem;
  color:var(--ink);
  margin-bottom:32px;
  letter-spacing:-.012em;
}
.defs-title em { font-style:italic; color:var(--gold); }

.defs-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:2px;
  background:var(--rule);
  border-radius:8px;
  overflow:hidden;
}
.def {
  background:#fff;
  padding:24px 24px 28px;
}
.def-acronym {
  font-family:var(--fm);
  font-size:.95rem;
  font-weight:500;
  color:var(--gold);
  margin-bottom:6px;
  letter-spacing:.02em;
}
.def-name {
  font-family:var(--fh);
  font-size:1rem;
  font-style:italic;
  color:var(--ink);
  margin-bottom:10px;
  line-height:1.3;
}
.def-desc {
  font-size:.85rem;
  color:var(--muted);
  line-height:1.7;
  font-weight:300;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECTION BASE
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.section {
  max-width:980px;
  margin:0 auto;
  padding:80px 32px;
  border-bottom:1px solid var(--rule);
}

.section-num {
  font-family:var(--fm);
  font-size:.7rem;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
  display:flex;
  align-items:center;
  gap:10px;
}
.section-num::before {
  content:'§';
  font-family:var(--fh);
  font-style:italic;
  font-size:.95rem;
  text-transform:none;
}

.section-h {
  font-family:var(--fh);
  font-size:clamp(1.8rem,3vw,2.6rem);
  font-weight:400;
  line-height:1.2;
  letter-spacing:-.012em;
  color:var(--ink);
  margin-bottom:28px;
}
.section-h em { font-style:italic; color:var(--gold); }

.body-p {
  font-size:1rem;
  color:var(--text);
  line-height:1.85;
  font-weight:300;
  margin-bottom:18px;
}
.body-p strong { color:var(--ink); font-weight:500; }
.body-p em { font-style:italic; color:var(--ink); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   QUERY EXAMPLE BOX
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.query-box {
  background:var(--code);
  border-radius:8px;
  padding:24px 28px;
  margin:32px 0;
  position:relative;
  overflow:hidden;
}
.query-box::before {
  content:'';
  position:absolute; top:0; left:0; right:0;
  height:32px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), transparent);
}
.query-label {
  font-family:var(--fm);
  font-size:.62rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
  display:flex;
  align-items:center;
  gap:8px;
}
.query-label::before {
  content:'>';
  color:var(--gold);
  font-weight:600;
}
.query-text {
  font-family:var(--fm);
  font-size:.92rem;
  color:#fff;
  line-height:1.7;
  font-weight:400;
}
.query-text em {
  color:var(--gold);
  font-style:normal;
}
.query-result {
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:.85rem;
  color:rgba(255,255,255,.55);
  font-weight:300;
  line-height:1.7;
}
.query-result-label {
  font-family:var(--fm);
  font-size:.6rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(184,134,11,.7);
  margin-bottom:6px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   COMPARISON TABLE
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.comp-table {
  margin:32px 0;
  border:1px solid var(--rule);
  border-radius:8px;
  overflow:hidden;
}
.comp-row {
  display:grid;
  grid-template-columns:200px 1fr 1fr;
  border-bottom:1px solid var(--rule);
}
.comp-row:last-child { border-bottom:none; }
.comp-row.header {
  background:var(--tint);
  font-family:var(--fm);
  font-size:.66rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.comp-row.header .comp-cell { color:var(--gold); font-weight:500; padding:14px 20px; }
.comp-cell { padding:18px 20px; font-size:.9rem; line-height:1.6; }
.comp-cell:first-child {
  background:var(--tint);
  font-weight:500;
  color:var(--ink);
  border-right:1px solid var(--rule);
}
.comp-cell.muted { color:var(--muted); font-weight:300; border-right:1px solid var(--rule); }
.comp-cell.us { background:var(--gold-bg); color:var(--ink); font-weight:400; }
.comp-cell.us em { font-style:italic; color:var(--gold); font-weight:500; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FAQ-STYLE Q&A BLOCK (AI-friendly)
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.qa-list {
  display:flex;
  flex-direction:column;
  gap:0;
}
.qa-item {
  padding:28px 0;
  border-bottom:1px solid var(--rule);
}
.qa-item:first-child { border-top:1px solid var(--rule); }
.qa-q {
  font-family:var(--fh);
  font-size:1.2rem;
  font-style:italic;
  color:var(--ink);
  margin-bottom:14px;
  line-height:1.4;
  display:flex;
  gap:12px;
  align-items:baseline;
}
.qa-q::before {
  content:'Q.';
  font-family:var(--fm);
  font-size:.78rem;
  font-weight:500;
  font-style:normal;
  color:var(--gold);
  letter-spacing:.05em;
  flex-shrink:0;
}
.qa-a {
  font-size:.97rem;
  color:var(--text);
  line-height:1.85;
  font-weight:300;
  padding-left:28px;
}
.qa-a strong { color:var(--ink); font-weight:500; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CHECKLIST / FRAMEWORK
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.framework {
  background:#fff;
  border:1px solid var(--rule);
  border-radius:8px;
  margin:32px 0;
  overflow:hidden;
}
.fw-header {
  background:var(--gold-bg);
  padding:18px 28px;
  border-bottom:1px solid var(--rule);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.fw-title {
  font-family:var(--fh);
  font-size:1.05rem;
  font-style:italic;
  color:var(--ink);
}
.fw-tag {
  font-family:var(--fm);
  font-size:.62rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold);
}
.fw-list { padding:8px 0; }
.fw-step {
  display:grid;
  grid-template-columns:60px 1fr;
  gap:20px;
  padding:18px 28px;
  border-bottom:1px solid var(--rule);
  align-items:start;
}
.fw-step:last-child { border-bottom:none; }
.fw-step-num {
  font-family:var(--fh);
  font-style:italic;
  font-size:1.4rem;
  color:var(--gold);
  opacity:.7;
  line-height:1;
}
.fw-step-name {
  font-family:var(--fb);
  font-size:.95rem;
  font-weight:500;
  color:var(--ink);
  margin-bottom:4px;
}
.fw-step-desc {
  font-size:.85rem;
  color:var(--muted);
  line-height:1.7;
  font-weight:300;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━
   END NOTE / CTA
━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cta-section {
  max-width:780px;
  margin:0 auto;
  padding:96px 32px 120px;
  text-align:center;
}
.cta-mark {
  font-family:var(--fm);
  font-size:.66rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:28px;
}
.cta-h {
  font-family:var(--fh);
  font-size:clamp(2rem,3.5vw,3rem);
  font-weight:400;
  color:var(--ink);
  line-height:1.2;
  margin-bottom:20px;
  letter-spacing:-.012em;
}
.cta-h em { font-style:italic; color:var(--gold); }
.cta-deck {
  font-size:1rem;
  color:var(--muted);
  line-height:1.85;
  font-weight:300;
  margin-bottom:36px;
  max-width:640px;
  margin-left:auto;
  margin-right:auto;
}
.cta-row {
  display:flex;
  gap:24px;
  justify-content:center;
  flex-wrap:wrap;
  align-items:center;
}
.cta-primary {
  font-family:var(--fb);
  font-size:.82rem;
  font-weight:500;
  color:var(--ink);
  text-decoration:none;
  border-bottom:2px solid var(--gold);
  padding:6px 2px;
  transition:color .2s;
}
.cta-primary:hover { color:var(--gold); }
.cta-secondary {
  font-size:.78rem;
  color:var(--light);
  text-decoration:none;
  padding:6px 0;
  transition:color .2s;
}
.cta-secondary:hover { color:var(--ink); }

/* Reveal */
.reveal { opacity:0; transform:translateY(12px); transition:opacity .7s ease, transform .7s ease; }
.reveal.on { opacity:1; transform:none; }

/* Responsive */
@media(max-width:900px) {
  nav { padding:18px 32px; }
  .nav-links { display:none; } .hbg { display:flex; }
  .briefing-hero { padding:120px 24px 48px; }
  .tldr { grid-template-columns:1fr; gap:12px; padding:24px; }
  .defs-section { padding:48px 24px; }
  .defs-grid { grid-template-columns:1fr; }
  .section { padding:64px 24px; }
  .comp-row { grid-template-columns:1fr; }
  .comp-cell:first-child { border-right:none; border-bottom:1px solid var(--rule); }
  .comp-cell.muted { border-right:none; border-bottom:1px solid var(--rule); }
  .cta-section { padding:80px 24px 96px; }
  footer { padding:56px 32px 36px; }
  .ft-top { grid-template-columns:1fr 1fr; gap:36px; }
}
@media(max-width:540px) {
  .qa-q { font-size:1.05rem; }
  .qa-a { padding-left:0; }
  footer { padding:48px 24px 32px; }
  .ft-top { grid-template-columns:1fr; gap:28px; }
  .ft-bot { flex-direction:column; align-items:flex-start; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BUYER JOURNEY DIAGRAM
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.journey-wrap {
  background:#fff;
  border:1px solid var(--rule);
  border-radius:8px;
  padding:36px 28px 28px;
  margin:32px 0;
}
.journey-cap {
  font-family:var(--fm); font-size:.62rem;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); text-align:center;
  margin-bottom:6px;
}
.journey-title {
  font-family:var(--fh); font-size:1rem;
  font-style:italic; color:var(--ink);
  text-align:center; margin-bottom:24px;
  line-height:1.4;
}
.journey-figlabel {
  font-family:var(--fh); font-size:.78rem;
  font-style:italic; color:var(--muted);
  text-align:center; margin-top:18px;
  letter-spacing:.04em;
}

@media(max-width:540px){
}

