/* ============================================================
   Executive Brief Cloud — FROZEN design system
   Black Ledger Ventures · boardroom / annual-report grade
   Do NOT redesign. Evolutionary changes only, on explicit approval.
   ============================================================ */

:root{
  /* Exact tokens synced from Three/css/styles-kk.css (AnchorWorks live site) */
  --charcoal:#0F1214; --charcoal-2:#0a0c0d; --panel:#181C1E; --ocean:#1F2326; --ocean-2:#23282b;
  --gold:#C6A66A; --gold-bright:#e3c98c; --gold-deep:#a8884f; --bone:#EAE6DF; --steel:#9AA1A6;
  --bone-dim:rgba(234,230,223,.66); --bone-faint:rgba(234,230,223,.40);
  --hairline:rgba(234,230,223,.10); --hairline-soft:rgba(234,230,223,.06);
  --gold-tint:rgba(198,166,106,.08); --gold-glow:rgba(198,166,106,.22);
  --serif:"DM Serif Display",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans); color:var(--bone); background:#06080a; padding:32px 0; -webkit-font-smoothing:antialiased}

/* ---- the sheet (8.5 x 11) ---- */
.page{
  position:relative; width:8.5in; min-height:11in; margin:0 auto 30px; overflow:hidden;
  background:
    radial-gradient(120% 70% at 50% -5%, rgba(198,166,106,.07), transparent 55%),
    radial-gradient(100% 60% at 50% 105%, rgba(0,0,0,.5), transparent 60%),
    linear-gradient(180deg,var(--charcoal),var(--charcoal-2));
  box-shadow:0 30px 80px -30px rgba(0,0,0,.85);
  padding:0.85in 0.9in 1in;
  display:flex; flex-direction:column;
}
.page::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.5) 0 1px, transparent 1px 2px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.4) 0 1px, transparent 1px 3px); }
.page::after{ content:""; position:absolute; inset:0.4in; border:1px solid var(--hairline-soft); border-radius:6px; pointer-events:none; }
.page > *{position:relative; z-index:1}

/* ---- running header / footer ---- */
.rh{display:flex; justify-content:space-between; align-items:center; font-size:8.5pt; letter-spacing:.18em;
    text-transform:uppercase; color:var(--bone-faint); padding-bottom:.5rem; border-bottom:1px solid var(--hairline); margin-bottom:.7in}
.rh .mk{display:flex; align-items:center; gap:.5rem; color:var(--gold); font-weight:600}
.rh .mk .hdr-icon{width:15px;height:15px;background:url(assets/icon-gold.png) center/contain no-repeat;display:inline-block}
.ft{position:absolute; left:0.9in; right:0.9in; bottom:0.55in; display:flex; justify-content:space-between; align-items:center;
    font-size:8pt; letter-spacing:.16em; text-transform:uppercase; color:var(--bone-faint);
    padding-top:.5rem; border-top:1px solid var(--hairline); z-index:1}
.ft .pg b{color:var(--gold)}

/* ---- type ---- */
.eyebrow{font-size:9pt; letter-spacing:.28em; text-transform:uppercase; color:var(--gold); font-weight:600; margin-bottom:1rem}
h1{font-family:var(--serif); font-weight:400; line-height:1.0; letter-spacing:-.5px; font-size:46pt; margin-bottom:1rem}
h2{font-family:var(--serif); font-weight:400; line-height:1.04; font-size:30pt; margin-bottom:.7rem}
h1 em,h2 em{font-style:italic; color:var(--gold-bright)}
p.lead{font-size:13.5pt; color:var(--bone-dim); line-height:1.55; max-width:54ch}
p.body{font-size:11.5pt; color:var(--bone-dim); line-height:1.6; max-width:60ch; margin-top:.5rem}
p.body b{color:var(--gold-bright);font-weight:600}
.secnum{font-family:var(--serif); font-size:15pt; color:var(--gold); letter-spacing:.05em}
.rule{height:1px; background:linear-gradient(90deg,var(--gold),transparent); margin:.9rem 0 1.2rem; max-width:120px}
.partmark{font-size:9pt;letter-spacing:.3em;text-transform:uppercase;color:var(--bone-faint)}
.partmark b{color:var(--gold)}
.spacer{flex:1 1 auto}

/* ---- lists ---- */
ul.checks{list-style:none; display:grid; gap:.7rem; margin-top:1rem; max-width:62ch}
ul.checks li{display:flex; gap:.7rem; align-items:flex-start; font-size:12pt; line-height:1.45; color:var(--bone)}
ul.checks svg{width:18px;height:18px;flex:none;stroke:var(--gold);fill:none;margin-top:2px}
ul.checks b{color:var(--gold-bright); font-weight:600}

.num-list{list-style:none; display:grid; gap:1.05rem; margin-top:.4rem}
.num-list li{display:flex; gap:1rem; align-items:flex-start}
.num-list .n{font-family:var(--serif); font-size:20pt; color:var(--gold); line-height:1; width:1.6rem; flex:none}
.num-list .t{font-size:12.5pt; line-height:1.45; color:var(--bone)}
.num-list .t b{color:var(--gold-bright); font-weight:600}
.num-list .t span{display:block; color:var(--bone-faint); font-size:10.5pt; margin-top:.15rem}

/* ---- cards ---- */
.cards{display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.1rem}
.cards.three{grid-template-columns:1fr 1fr 1fr}
.card{background:linear-gradient(180deg,rgba(31,35,38,.5),rgba(15,18,20,.45)); border:1px solid var(--hairline); border-radius:12px; padding:1.1rem 1.15rem}
.card .tag{display:inline-block;font-size:7.5pt;letter-spacing:.18em;text-transform:uppercase;color:var(--gold); border:1px solid var(--gold-tint);border-radius:999px;padding:.25rem .65rem;margin-bottom:.6rem}
.card h3{font-family:var(--serif);font-weight:400;font-size:15pt;color:var(--bone);margin-bottom:.35rem}
.card p{color:var(--bone-dim);font-size:10.5pt;line-height:1.5}
.card p+p{margin-top:.4rem}

.pull{font-family:var(--serif); font-style:italic; font-size:15pt; color:var(--gold-bright); line-height:1.4; border-left:2px solid var(--gold); padding-left:1rem; margin-top:1.2rem; max-width:52ch}

.ba{display:flex;gap:.6rem;align-items:center;margin-top:1rem;font-size:9.5pt;color:var(--bone-faint);flex-wrap:wrap}
.ba .from{color:#7d8893}.ba .to{color:var(--gold-bright)}.ba .arr{color:var(--gold)}

.chain{display:flex; flex-wrap:wrap; align-items:center; gap:.5rem .6rem; margin-top:1.1rem; max-width:62ch; font-family:var(--serif); font-size:13.5pt; color:var(--bone)}
.chain.sm{font-size:12pt}
.chain .arr{color:var(--gold); font-family:var(--sans); font-size:12pt}
.chain .node{border-bottom:1px solid var(--gold-tint); padding-bottom:1px}

/* ---- stats ---- */
.stat-row{display:flex;gap:1.4rem;margin-top:1.6rem;flex-wrap:wrap}
.stat .big{font-family:var(--serif);font-size:26pt;color:var(--gold-bright);line-height:1}
.stat .lbl{font-size:8.5pt;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faint);margin-top:.3rem}

/* ---- COVER (photographic — official Brand Vault founder imagery) ---- */
.cover{padding:0; overflow:hidden}
.cover .photo{position:absolute; inset:0; z-index:0;
  background-image:linear-gradient(180deg, rgba(15,18,20,.38) 0%, rgba(31,35,38,.16) 34%, rgba(15,18,20,.74) 76%, rgba(10,12,13,.97) 100%), var(--cover-img, url(assets/cover-pillar.jpg));
  background-size:cover; background-position:center}
.cover .photo::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 140px 30px rgba(0,0,0,.55)}
.cover .inner{position:relative; z-index:1; display:flex; flex-direction:column; height:11in; padding:1in 1.05in 1.15in}
.cover .topmark{display:flex;align-items:center;gap:.6rem}
.cover .topmark img{height:34px;width:auto}
.cover .briefno{margin-top:.9rem;font-size:9.5pt;letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}
.cover h1{font-size:50pt;margin:.4rem 0 1rem;max-width:16ch;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.cover .sub{font-size:13.5pt;color:var(--bone-dim);line-height:1.5;max-width:46ch}
.cover .coverfoot .grule{height:1px;background:var(--gold);opacity:.55;margin-bottom:.9rem}
.cover .meta{display:flex;justify-content:space-between;align-items:flex-end;font-size:9.5pt;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-faint);gap:1rem}
.cover .meta .r{color:var(--gold-bright);text-align:right}
.cover .prepared{color:var(--bone);font-weight:600;letter-spacing:.14em}

/* ---- DECISION LOG (Executive Decisions — searchable one-liners) ---- */
.decisions{list-style:none;display:grid;gap:.55rem;margin-top:1rem;max-width:60ch}
.decisions li{display:flex;gap:.7rem;align-items:baseline;font-size:12.5pt;line-height:1.4;color:var(--bone);border-bottom:1px solid var(--hairline-soft);padding-bottom:.55rem}
.decisions li::before{content:"";width:7px;height:7px;flex:none;border-radius:2px;background:var(--gold);transform:translateY(-1px)}

/* ---- ACCOMPLISHMENT block (Problem/Decision/Implementation/Impact/Dependencies) ---- */
.acco{display:grid;gap:.55rem;margin-top:1rem}
.acco .field{display:grid;grid-template-columns:8.5rem 1fr;gap:.9rem;align-items:baseline}
.acco .field .k{font-size:8.5pt;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);padding-top:.15rem}
.acco .field .v{font-size:11.5pt;line-height:1.5;color:var(--bone-dim)}
.acco .field .v b{color:var(--gold-bright);font-weight:600}

/* ---- METRICS grid ---- */
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem;margin-top:1.1rem}
.metric{border:1px solid var(--hairline);border-radius:10px;padding:.9rem 1rem;background:linear-gradient(180deg,rgba(31,35,38,.4),rgba(15,18,20,.35))}
.metric .v{font-family:var(--serif);font-size:22pt;color:var(--gold-bright);line-height:1}
.metric .k{font-size:8pt;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faint);margin-top:.4rem}

/* progress bars (website progress / launch readiness) */
.bars{display:grid;gap:.85rem;margin-top:1.2rem;max-width:56ch}
.bar .barlbl{display:flex;justify-content:space-between;font-size:10.5pt;color:var(--bone-dim);margin-bottom:.35rem}
.bar .barlbl b{color:var(--gold-bright);font-weight:600;font-family:var(--serif)}
.bar .track{height:7px;background:var(--hairline);border-radius:99px;overflow:hidden}
.bar .fill{height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright));border-radius:99px}

/* ---- COMPANY STAGE tracker ---- */
.stages{display:flex;align-items:stretch;gap:.5rem;margin-top:1.3rem}
.stages .st{flex:1;text-align:center;border:1px solid var(--hairline);border-radius:10px;padding:.9rem .4rem;color:var(--bone-faint)}
.stages .st .lbl{font-size:9.5pt;letter-spacing:.14em;text-transform:uppercase}
.stages .st .no{font-family:var(--serif);font-size:13pt;color:var(--bone-faint);margin-bottom:.3rem}
.stages .st.active{border-color:var(--gold);background:var(--gold-tint);color:var(--bone)}
.stages .st.active .lbl{color:var(--gold-bright)}
.stages .st.active .no{color:var(--gold)}

/* appendix / ledger (commits) */
.ledger{display:grid;gap:.5rem;margin-top:.4rem}
.ledger .row{display:flex;gap:.6rem;align-items:baseline;font-size:10pt;color:var(--bone-dim);line-height:1.4}
.ledger code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:8.5pt;color:var(--gold-bright); background:var(--gold-tint);border:1px solid var(--gold-tint);border-radius:5px;padding:.1rem .42rem;flex:none}
.ledger b{color:var(--bone);font-weight:600}

/* ---- version chip ---- */
.vchip{display:inline-flex;gap:.5rem;align-items:center;font-size:8pt;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faint);
  border:1px solid var(--hairline);border-radius:999px;padding:.3rem .7rem}
.vchip b{color:var(--gold)}

/* ---- save button (screen only) ---- */
.pdfbar{position:fixed;top:18px;right:18px;z-index:50}
.pdfbar button{font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--gold);background:rgba(24,28,30,.92);border:1px solid var(--gold-tint);border-radius:10px; padding:.7rem 1.1rem;cursor:pointer;box-shadow:0 10px 30px -10px #000}
.pdfbar button:hover{background:var(--gold-tint);border-color:var(--gold)}

/* ---- responsive: phone/tablet screens (print layout below is untouched) ---- */
@media screen and (max-width: 820px){
  html{overflow-x:hidden}
  body{padding:0;overflow-x:hidden;max-width:100vw}
  .page{width:100%; min-height:0; margin:0; padding:32px 22px 42px; box-shadow:none; border-bottom:1px solid var(--hairline)}
  .page::after{inset:14px; border-radius:8px}
  h1{font-size:30pt}
  h2{font-size:22pt}
  .rh{flex-wrap:wrap; gap:.35rem; margin-bottom:30px}
  .ft{position:static; left:auto; right:auto; bottom:auto; margin-top:30px}
  .cards, .cards.three, .metrics{grid-template-columns:1fr}
  .acco .field{grid-template-columns:1fr; gap:.15rem; margin-bottom:.55rem}
  .acco .field .k{padding-top:0}
  .stages{flex-wrap:wrap; gap:.45rem}
  .stages .st{flex:1 1 44%}
  .chain{font-size:12pt}
  .cover{min-height:0}
  .cover .inner{height:auto; min-height:90vh; padding:40px 24px 46px}
  .cover h1{font-size:clamp(30pt,9vw,44pt)}
  .cover .topmark img{height:28px}
}
@media screen and (max-width: 430px){
  .page{padding:26px 18px 36px}
  h1{font-size:26pt}
  h2{font-size:19pt}
  .cover .inner{padding:34px 20px 42px}
}

@media print{
  @page{size:8.5in 11in; margin:0}
  html,body{background:#fff;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pdfbar{display:none !important}
  .page{margin:0; box-shadow:none; width:8.5in; min-height:11in; page-break-after:always; break-after:page}
  .page:last-child{page-break-after:auto}
}