/* KEG Executive Management — production stylesheet
   Tokens: ink navy / ledger green / amber (score only)
   Type: Archivo (display) · Source Serif 4 (body) · IBM Plex Mono (labels, prices) */

:root{
  --ink:#061D37;          /* live brand navy (deep) */
  --navy:#061D37;
  --navy-2:#0B2540;       /* lighter navy for section variation */
  --navy-3:#0E2C4F;
  --slate:#554F3E;        /* warm slate from live */
  --line:rgba(216,176,101,.22);  /* gold-tinted hairline */
  --line-navy:rgba(255,255,255,.12);
  --bg:#EBEEF2;           /* live light section */
  --bg-warm:#F5F5F5;
  --card:#FFFFFF;
  --gold:#D8B065;         /* live brand gold */
  --gold-lt:#FCD47C;      /* live gold light */
  --gold-deep:#8A6F33;    /* AA text on white */
  --gold-dark:#7E6430;
  --amber:#D8B065;
  --text:#0B1220;
  --light:#6B7280;
  --white:#FFFFFF;
  --green:#8A6F33;
  --green-dark:#7E6430;
  --maxw:1120px;
  --radius:6px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  font-family:"Inter",-apple-system,sans-serif;
  font-size:1.075rem;line-height:1.65;
  color:var(--slate);background:var(--bg);
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3{font-family:"Playfair Display",Georgia,serif;color:var(--ink);line-height:1.12;letter-spacing:-0.015em}
h1{font-size:clamp(2.1rem,4.6vw,3.3rem);font-weight:800}
h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800}
h3{font-size:1.15rem;font-weight:700}
p+p{margin-top:.9rem}
a{color:var(--gold-deep)}
strong{color:var(--ink)}
img{max-width:100%;display:block}

.mono{font-family:"IBM Plex Mono",Menlo,monospace}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 1.25rem}
section{padding:4.25rem 0}
section.tight{padding:3rem 0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
@media (max-width:820px){.grid2,.grid3{grid-template-columns:1fr}}

/* ---------- report label (eyebrow) ---------- */
.eyebrow{
  font-family:"IBM Plex Mono",monospace;
  font-size:.74rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-deep);display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;
}
.eyebrow::before{content:"";width:2rem;height:2px;background:var(--gold)}

/* ---------- nav ---------- */
header.site{
  background:var(--card);border-bottom:2px solid var(--gold);
  position:sticky;top:0;z-index:50;
}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1.25rem;max-width:var(--maxw);margin:0 auto}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.logo-mark{width:40px;height:40px;display:block}
.logo-text{font-family:"Inter",sans-serif;font-weight:800;font-size:1.1rem;color:var(--ink);letter-spacing:-0.01em;line-height:1;display:flex;flex-direction:column}
.logo-text em{font-family:"Inter",sans-serif;font-style:italic;font-weight:400;font-size:.62rem;color:var(--gold-deep);letter-spacing:.02em;margin-top:2px}
.foot-logo{width:56px;height:56px;margin-bottom:.9rem}
@media (max-width:520px){.logo-text{display:none}}
nav.main{display:flex;align-items:center;gap:1.35rem}
nav.main a{font-family:"Inter",sans-serif;font-size:.92rem;font-weight:600;color:var(--ink);text-decoration:none}
nav.main a:hover{color:var(--green-dark)}
nav.main a.cta{background:var(--ink);color:#fff;padding:.5rem .95rem;border-radius:var(--radius)}
nav.main a.cta:hover{background:var(--navy)}
.menu-toggle{display:none}
@media (max-width:900px){
  .menu-toggle{display:block;font-family:"Inter",sans-serif;font-weight:700;background:none;border:2px solid var(--ink);border-radius:var(--radius);padding:.35rem .7rem;cursor:pointer;color:var(--ink)}
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--card);border-bottom:2px solid var(--ink);flex-direction:column;align-items:flex-start;padding:1rem 1.25rem;gap:.9rem}
  nav.main.open{display:flex}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;font-family:"Inter",sans-serif;font-weight:700;font-size:1rem;
  background:var(--gold);color:var(--ink);text-decoration:none;
  padding:.85rem 1.5rem;border-radius:var(--radius);border:2px solid var(--gold);
  cursor:pointer;
}
.btn:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff}
.btn-ghost{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--gold)}
.btn-row{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center}
.fastlane{font-family:"IBM Plex Mono",monospace;font-size:.85rem}

/* ---------- hero ---------- */
.hero{background:var(--card);border-bottom:1px solid var(--line);padding:5rem 0 4.5rem}
.hero .sub{font-size:1.2rem;max-width:38rem;margin:1.2rem 0 1.8rem}

/* signature: the score chip */
.score-chip{
  display:inline-flex;align-items:center;gap:.9rem;margin-bottom:1.6rem;
  font-family:"IBM Plex Mono",monospace;font-size:.82rem;letter-spacing:.03em;
  border:2px solid var(--ink);border-radius:var(--radius);background:var(--bg);
  padding:.55rem .9rem;color:var(--ink);
}
.score-chip .score{font-weight:700;color:var(--ink);background:var(--gold);padding:.1rem .5rem;border-radius:2px}

/* ---------- cards ---------- */
.card{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--ink);border-radius:var(--radius);padding:1.6rem}
.card.accent{border-top-color:var(--gold);border:2px solid var(--gold);box-shadow:0 14px 40px rgba(216,176,101,.28);position:relative;z-index:2}@media(min-width:760px){.card.accent{transform:scale(1.05)}}
.card h3{margin-bottom:.5rem}
.card ul{margin:.8rem 0 0 1.1rem}
.card li{margin:.35rem 0}
.card .btn{margin-top:1.2rem}

.price{font-family:"IBM Plex Mono",monospace;font-weight:700;color:var(--ink);font-size:1.05rem}
.meta{font-family:"IBM Plex Mono",monospace;font-size:.78rem;color:var(--slate);letter-spacing:.02em}

.badge{
  display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:.68rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;background:var(--gold);color:var(--ink);
  padding:.25rem .6rem;border-radius:2px;margin-bottom:.8rem;
}

/* ---------- the ladder ---------- */
.ladder{list-style:none;border-left:2px solid var(--navy);margin-left:.4rem}
.ladder li{position:relative;padding:0 0 1.5rem 1.6rem}
.ladder li:last-child{padding-bottom:0}
.ladder li::before{
  content:"";position:absolute;left:-7px;top:.45rem;width:12px;height:12px;
  background:var(--card);border:2px solid var(--gold);border-radius:50%;
}
.ladder .rung-name{font-family:"Inter",sans-serif;font-weight:700;color:var(--ink)}
.ladder .price{margin-left:.5rem}
.ladder p{font-size:.98rem;margin-top:.15rem}

/* ---------- problem strip ---------- */
.strip{background:var(--ink);color:#C9D3DE;padding:2.6rem 0}
.strip .grid3 p{font-size:1rem}
.strip strong{color:#fff}
.strip .eyebrow{color:var(--amber)}
.strip .eyebrow::before{background:var(--amber)}

/* ---------- FAQ ---------- */
details.faq{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:.7rem}
details.faq summary{font-family:"Inter",sans-serif;font-weight:700;color:var(--ink);padding:1rem 1.25rem;cursor:pointer;list-style:none}
details.faq summary::after{content:"+";float:right;color:var(--gold-deep);font-weight:800}
details.faq[open] summary::after{content:"–"}
details.faq .a{padding:0 1.25rem 1.1rem}

/* ---------- forms ---------- */
form.capture{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--radius);padding:1.75rem;max-width:34rem}
form.capture label{display:block;font-family:"Inter",sans-serif;font-weight:600;font-size:.9rem;color:var(--ink);margin:.9rem 0 .3rem}
form.capture input,form.capture select,form.capture textarea{
  width:100%;padding:.65rem .8rem;font:inherit;font-size:1rem;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);color:var(--ink);
}
form.capture input:focus,form.capture select:focus,form.capture textarea:focus{outline:2px solid var(--gold-deep);outline-offset:1px}
form.capture .btn{margin-top:1.3rem;width:100%}
.form-note{font-family:"IBM Plex Mono",monospace;font-size:.74rem;margin-top:.8rem;color:var(--slate)}

/* proof slot (pending assets) */
.proof{background:var(--card);border:1px dashed var(--line);border-radius:var(--radius);padding:1.5rem}
.proof .who{font-family:"IBM Plex Mono",monospace;font-size:.8rem;margin-top:.8rem;color:var(--ink)}

/* ---------- footer ---------- */
footer.site{background:var(--ink);color:#B9C4D0;padding:3.5rem 0 2rem;margin-top:2rem}
footer.site h3{color:#fff;font-size:.95rem;margin-bottom:.8rem}
footer.site a{color:#B9C4D0;text-decoration:none;display:block;margin:.35rem 0;font-size:.95rem}
footer.site a:hover{color:#fff}
.footgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem}
@media (max-width:820px){.footgrid{grid-template-columns:1fr 1fr}}
.footnote{border-top:1px solid #2A3A4E;margin-top:2.5rem;padding-top:1.2rem;font-family:"IBM Plex Mono",monospace;font-size:.72rem}
footer .newsletter input{width:100%;padding:.6rem .8rem;border:none;border-radius:var(--radius);font:inherit;margin:.5rem 0}
footer .newsletter .btn{width:100%;font-size:.9rem;padding:.6rem}

/* focus visibility */
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:3px solid var(--amber);outline-offset:2px}

/* utility */
.center{text-align:center}
.narrow{max-width:44rem}
.mt1{margin-top:1rem}.mt2{margin-top:2rem}.mt3{margin-top:3rem}
hr.rule{border:none;border-top:1px solid var(--line);margin:2.5rem 0}

/* ===== v2: hero two-column + photo ===== */
.hero-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:2.5rem;align-items:center}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr;gap:1.5rem}.hero-photo{order:-1;max-width:280px;margin:0 auto}}
.hero-photo{position:relative;text-align:center}
.hero-photo img{margin-left:auto;margin-right:auto;width:100%;max-width:340px;border-radius:8px;border:4px solid var(--gold);box-shadow:0 12px 34px rgba(13,27,42,.22)}
.hero-photo-cap{display:block;margin-top:.7rem;font-family:"IBM Plex Mono",monospace;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}

/* ===== v2: client logo scroller ===== */
.logos{background:var(--navy);padding:1.8rem 0;overflow:hidden}
.logos-label{text-align:center;font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:1.1rem}
.logos-track{display:flex;gap:2.5rem;width:max-content;animation:logoscroll 32s linear infinite}
.logos:hover .logos-track{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.logos-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}}
.logo-chip{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:44px;min-width:130px;padding:0 1.2rem;
  font-family:"Inter",sans-serif;font-weight:700;font-size:.9rem;letter-spacing:.02em;color:#fff;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:4px;opacity:.85}
/* When real logos are added as <img>, style them instead: */
.logos-track img{height:38px;width:auto;object-fit:contain;filter:brightness(0) invert(1);opacity:.8}
@keyframes logoscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== v2: more blue — alternating section washes ===== */
.wash-navy{background:var(--navy);color:#D4DBE4}
.wash-navy h2,.wash-navy h3{color:#fff}
.wash-navy .eyebrow{color:var(--gold-lt)}
.wash-navy .eyebrow::before{background:var(--gold)}
.wash-tint{background:#EEF1F5} /* faint cool tint instead of pure white */

/* ===== v3: gold-on-navy dominant treatment ===== */
body{background:var(--navy);color:#C7D2E0}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif}
.wrap{max-width:var(--maxw)}
section{color:#C7D2E0}
section h1,section h2,section h3{color:#fff}
.on-light{background:var(--bg);color:var(--slate)}
.on-light h1,.on-light h2,.on-light h3{color:var(--navy)}
.on-white{background:var(--card);color:#3D4451}
.on-white h1,.on-white h2,.on-white h3{color:var(--navy)}
header.site{background:var(--navy);border-bottom:2px solid var(--gold)}
.logo b{color:#fff}
.logo em{color:var(--gold)}
nav.main a{color:#E8EDF3}
nav.main a:hover{color:var(--gold)}
nav.main a.cta{background:var(--gold);color:var(--navy)}
nav.main a.cta:hover{background:var(--gold-lt);color:var(--navy)}
.menu-toggle{color:#fff;border-color:var(--gold)}
@media(max-width:900px){nav.main{background:var(--navy);border-bottom:2px solid var(--gold)}}
.eyebrow{color:var(--gold)}
.eyebrow::before{background:var(--gold)}
.on-light .eyebrow,.on-white .eyebrow{color:var(--gold-deep)}
.on-light .eyebrow::before,.on-white .eyebrow::before{background:var(--gold)}
.btn{background:var(--gold);color:var(--navy);border-color:var(--gold);font-family:"Inter",sans-serif}
.btn:hover{background:var(--gold-lt);border-color:var(--gold-lt);color:var(--navy)}
.btn-ghost{background:transparent;color:#fff;border:2px solid var(--gold)}
.btn-ghost:hover{background:var(--gold);color:var(--navy)}
.on-light .btn-ghost,.on-white .btn-ghost{color:var(--navy);border-color:var(--navy)}
.on-light .btn-ghost:hover,.on-white .btn-ghost:hover{background:var(--navy);color:var(--gold)}
.hero{background:var(--navy);border-bottom:1px solid var(--line-navy)}
.hero .sub{color:#B4C1D2}
.fastlane{color:var(--gold-lt)}
.card{background:var(--navy-2);border:1px solid var(--line-navy);border-top:3px solid var(--gold);color:#B9C5D6}
.card h3{color:#fff}
.on-light .card,.on-white .card{background:#fff;border-color:var(--line);border-top-color:var(--gold);color:#3D4451}
.on-light .card h3{color:var(--navy)}
.price{color:var(--gold-lt)}
.on-light .price,.on-white .price{color:var(--gold-deep)}
.meta{color:#8CA0B8}
.on-light .meta{color:var(--light)}
.score-chip{border-color:var(--gold);background:rgba(216,176,101,.08);color:#E8EDF3}
.score-chip .score{background:var(--gold);color:var(--navy)}
.ladder{border-left-color:var(--gold)}
.ladder li::before{background:var(--navy);border-color:var(--gold)}
.ladder .rung-name{color:#fff}
.on-light .ladder .rung-name{color:var(--navy)}
.ladder p{color:#A9B7C9}
.on-light .ladder p{color:var(--slate)}
.badge{background:var(--gold);color:var(--navy)}
details.faq{background:var(--navy-2);border-color:var(--line-navy)}
details.faq summary{color:#fff}
details.faq summary::after{color:var(--gold)}
details.faq .a{color:#B9C5D6}
.on-light details.faq{background:#fff;border-color:var(--line)}
.on-light details.faq summary{color:var(--navy)}
.on-light details.faq .a{color:var(--slate)}
form.capture{background:var(--navy-2);border-color:var(--line-navy);border-top:3px solid var(--gold)}
form.capture label{color:#fff}
form.capture input,form.capture select,form.capture textarea{background:var(--navy-3);border-color:var(--line-navy);color:#fff}
.on-light form.capture{background:#fff}
.on-light form.capture label{color:var(--navy)}
.on-light form.capture input,.on-light form.capture select,.on-light form.capture textarea{background:var(--bg);color:var(--navy)}
.form-note{color:#8CA0B8}
.on-light .form-note{color:var(--light)}
.proof{background:var(--navy-2);border-color:var(--line-navy)}
.proof .who{color:var(--gold-lt)}
.on-light .proof{background:#fff}
.on-light .proof .who{color:var(--gold-deep)}
footer.site{background:#04121F;border-top:2px solid var(--gold)}
.strip{background:var(--navy-2)}
.clients{background:var(--navy-2);padding:2.2rem 0;overflow:hidden;border-top:1px solid var(--line-navy);border-bottom:1px solid var(--line-navy)}
.clients-label{text-align:center;font-family:"Inter",sans-serif;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:1.4rem}
.clients-track{display:flex;gap:3.5rem;width:max-content;animation:cscroll 34s linear infinite;align-items:center}
.clients:hover .clients-track{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.clients-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto;gap:2.5rem}}
.clients-track a{flex:0 0 auto;display:flex;align-items:center;height:46px;opacity:.85;transition:opacity .2s}
.clients-track a:hover{opacity:1}
.clients-track img{height:36px;width:auto;object-fit:contain}
@keyframes cscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.cred{background:var(--navy-2)}
.cred-facts{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.cred-facts span{font-family:"Inter",sans-serif;font-size:.82rem;color:var(--gold-lt);background:rgba(216,176,101,.1);border:1px solid rgba(216,176,101,.28);padding:.4rem .8rem;border-radius:20px}
.hero-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:2.5rem;align-items:center}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr;gap:1.5rem}.hero-photo{order:-1;max-width:280px;margin:0 auto}}
.hero-photo{position:relative;text-align:center}
.hero-photo img{margin-left:auto;margin-right:auto;width:100%;max-width:340px;border-radius:8px;border:4px solid var(--gold);box-shadow:0 12px 34px rgba(0,0,0,.35)}
.hero-photo-cap{display:block;margin-top:.7rem;font-family:"IBM Plex Mono",monospace;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-lt)}

/* ===== v3.1 fixes ===== */
/* CRITICAL: strong was navy-on-navy in dark sections */
strong{color:inherit;font-weight:700}
section strong,.card strong,.cred strong{color:#fff}
.on-light strong,.on-white strong{color:var(--navy)}
.strip strong{color:#fff}

/* eyebrows: drop robotic mono -> refined Inter, gold + white per live site */
.eyebrow,.clients-label,.meta,.fastlane,.form-note,.hero-photo-cap,.proof .who{font-family:"Inter",sans-serif}
.eyebrow{font-size:.8rem;font-weight:600;letter-spacing:.1em}
.price{font-family:"Inter",sans-serif;font-weight:700;letter-spacing:0}
.fastlane{font-size:.92rem;text-decoration:underline;text-underline-offset:3px}

/* logo: transparent file, show larger, no box */
.logo img,.logo-mark{width:46px;height:46px;background:none;border:none;border-radius:0}
.foot-logo{width:60px;height:60px}

/* card CTA alignment */
.card .btn,.card .btn-ghost{margin-top:1.2rem;display:inline-block}

/* about timeline */
.seat-list{list-style:none;margin-top:1.4rem}
.seat-list li{display:flex;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line-navy);align-items:baseline}
.on-light .seat-list li{border-bottom-color:var(--line)}
.seat-list .yrs{font-family:"Inter",sans-serif;font-weight:700;font-size:.85rem;color:var(--gold);min-width:110px}
.seat-list p{margin:0}

/* linkedin button */
.btn-li{display:inline-flex;align-items:center;gap:.5rem}

/* ---------- evidence strip (added: 2 sourced stats) ---------- */
.evidence{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;max-width:900px}
.evidence-item{border-left:3px solid var(--gold);padding:.2rem 0 .2rem 1.2rem}
.evidence-num{display:block;font-family:"Playfair Display",serif;font-weight:800;font-size:2.6rem;line-height:1;color:var(--navy)}
.evidence-item p{margin:.5rem 0 .55rem;font-size:1rem;line-height:1.5}
.evidence-src{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.03em;color:var(--slate);text-transform:uppercase}
@media(max-width:820px){.evidence{grid-template-columns:1fr;gap:1.4rem}}

/* ---------- two ladders (added) ---------- */
.ladders{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem}
.ladder-col{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1.8rem 1.6rem;display:flex;flex-direction:column}
.ladder-head{font-family:"Playfair Display",serif;font-weight:700;font-size:1.35rem;color:var(--navy);margin:0}
.ladder-sub{font-size:.92rem;color:var(--slate);margin:.3rem 0 1.3rem}
.ladder-col .ladder{margin-bottom:1.4rem}
.ladder-col .ladder:last-of-type{flex:1 0 auto}
.ladder-col .btn{margin-top:auto}
.ladder-col .btn{width:100%;text-align:center}
@media(max-width:820px){.ladders{grid-template-columns:1fr;gap:1.6rem}}

/* ---------- cred-facts balance (added) ---------- */
.hero-copy .cred-facts{justify-content:flex-start}

/* ---------- fix: ladder text/buttons must be dark on white ladder cards ---------- */
.ladder-col .rung-name{color:var(--ink) !important}
.ladder-col .ladder .price{color:var(--gold-deep) !important}
.ladder-col .ladder p{color:var(--slate) !important}
.ladder-col .btn-ghost{color:var(--ink) !important;border-color:var(--ink)}
.ladder-col .btn-ghost:hover{color:var(--gold) !important;background:var(--ink)}
