/* EXECUTIVE ORDERS LLC — v4, 2026-08-12 */

:root{
  --bone:#F5F3F0;
  --bone-2:#EDEAE5;
  --white:#FFFFFF;
  --black:#0D0D0D;
  --soft:#3A3A3A;
  --dim:#6A6A6A;
  --line:#CFCBC5;
  --hair:#0B0B0B;
  --red:#F05A28;          /* signal red — the stamp */
  --red-deep:#C8410F;
  --wrap:1240px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bone);color:var(--black);
  font:400 17px/1.62 "DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
p{margin:0 0 1.05em}

/* ---------- display type: the pop ---------- */
h1,h2,h3{margin:0 0 .35em;font-family:"DM Sans",sans-serif;font-weight:900;
  font-weight:800;line-height:.92;letter-spacing:-.025em;text-transform:uppercase}
h1{font-size:clamp(3.2rem,10.5vw,9rem)}
h2{font-size:clamp(2.3rem,6vw,4.6rem)}
h3{font-size:clamp(1.1rem,1.7vw,1.35rem);letter-spacing:.01em;font-stretch:100%}

/* ---------- mono: the document voice ---------- */
.mono,.kicker,.tag,.badge,label,.metrics span,.rung .price small,.q .num,footer h4,.fbot,.hero-note,.opt kbd{
  font-family:"DM Sans",sans-serif;font-weight:600;
}
.kicker{
  display:block;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--red);margin-bottom:20px;
}
.kicker.dark{color:var(--red)}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 30px}
.narrow{max-width:780px}
.mid{max-width:1000px}
.center{text-align:center}
.dim{color:var(--dim)}
.sm{font-size:.9rem}
.xs{font-size:.78rem}
.gold,.accent{color:var(--red)}
.serif{font-family:"DM Sans",sans-serif}

/* ---------- nav: a document header ---------- */
header.site{position:sticky;top:0;z-index:80;background:var(--bone);border-bottom:2px solid var(--black)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 0}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;
  font-family:"DM Sans",sans-serif;text-transform:uppercase;letter-spacing:-.02em;font-size:1.02rem}
.mark{width:22px;height:22px;flex:none}
.nav nav{display:flex;gap:26px}
.nav nav a{text-decoration:none;font-family:"DM Sans",sans-serif;font-size:.75rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--soft);transition:color .15s}
.nav nav a:hover,.nav nav a[aria-current]{color:var(--red)}
@media(max-width:900px){.nav nav{display:none}}

/* ---------- buttons: hard-edged, no pills ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;background:var(--black);color:var(--bone);
  font-family:"DM Sans",sans-serif;font-weight:700;font-size:.8rem;letter-spacing:.1em;
  text-transform:uppercase;padding:17px 26px;border-radius:0;text-decoration:none;border:0;
  cursor:pointer;transition:.14s;
}
.btn:hover{background:var(--red)}
.btn.line{background:transparent;color:var(--black);box-shadow:inset 0 0 0 2px var(--black)}
.btn.line:hover{background:var(--black);color:var(--bone)}
.btn.dark{background:var(--bone);color:var(--black)}
.btn.dark:hover{background:var(--red);color:var(--bone)}
.btn.sm{padding:11px 16px;font-size:.7rem}
.btn.big{padding:21px 34px;font-size:.86rem}
.btn.block{display:flex;width:100%;justify-content:center}

/* ---------- sections as numbered orders ---------- */
section{padding:96px 0;position:relative}
section.tight{padding:64px 0}
.paper{background:var(--bone-2)}
.paper-2{background:var(--white)}
.rule{height:2px;background:var(--black);border:0;margin:0}
.paper .rule{background:var(--black)}

.order-no{
  font-family:"DM Sans",sans-serif;font-weight:900;font-size:clamp(4rem,13vw,11rem);
  line-height:.8;color:transparent;-webkit-text-stroke:2px var(--line);
  display:block;margin-bottom:-.12em;pointer-events:none;user-select:none;
}
.order-head{display:flex;align-items:flex-end;gap:26px;flex-wrap:wrap;margin-bottom:8px}

/* ---------- hero ---------- */
.hero{padding:70px 0 78px;position:relative;overflow:hidden}
.hero h1{max-width:13ch;margin-bottom:0;font-size:clamp(2.5rem,6.4vw,5.1rem)}
.hero h1 em{font-style:normal;color:var(--red)}
.hero-lead{font-size:clamp(1.22rem,2.1vw,1.62rem);color:var(--ink);max-width:26ch;margin:28px 0 0;line-height:1.28;font-weight:600;letter-spacing:-.01em}
.hero.stage .hero-lead{color:#F3EFE7}
.hero .sub{font-size:clamp(1.05rem,1.6vw,1.22rem);color:var(--soft);max-width:46ch;margin:16px 0 30px;line-height:1.5}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.hero-note{margin-top:22px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}

.hero-grid{display:grid;grid-template-columns:1fr 360px;gap:56px;align-items:center}

/* duotone portrait: black + signal red, no stock-photo look */
.hero-portrait{margin:0;position:relative}
.duo{position:relative;overflow:hidden;background:var(--black)}
.duo img{width:100%;filter:grayscale(1) contrast(1.12) brightness(1.02)}
.duo:after{content:"";position:absolute;inset:0;background:var(--red);mix-blend-mode:multiply;opacity:.62}
.hero-portrait figcaption{
  margin-top:12px;font-family:"DM Sans",sans-serif;font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;display:flex;flex-direction:column;gap:3px;
}
.hero-portrait figcaption span{color:var(--dim)}
@media(max-width:960px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-portrait{max-width:230px;order:-1}
}

/* the stamp */
.stamp{
  display:inline-block;border:2px solid var(--red);color:var(--red);
  font-family:"DM Sans",sans-serif;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  padding:8px 14px;transform:rotate(-3deg);margin-bottom:26px;
}

/* ---------- story ---------- */
.story-body{max-width:62ch;margin-top:26px}
.story-body p{font-size:1.06rem;color:var(--soft)}
.story-body p b{color:var(--black);font-weight:700}
.story-body .lede{font-size:1.3rem;color:var(--black);line-height:1.42;font-weight:500}

.sources{list-style:none;margin:26px 0 0;padding:0;border-top:1px solid var(--line)}
.sources li{
  font-size:1.08rem;color:var(--black);font-weight:500;line-height:1.4;
  padding:13px 0;border-bottom:1px solid var(--line);
}
/* .story-body p sets size and colour at (0,1,1), so the selector here has to carry the element too or the question renders at body size in the dim ink and reads like a footnote instead of the payoff. */
.story-body p.ask,.ask{
  font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;
  font-size:clamp(1.5rem,3.2vw,2.15rem);line-height:1.18;color:var(--black);
  max-width:26ch;margin:36px 0 0;
}
@media(max-width:700px){
  .sources li{font-size:1rem;padding:11px 0}
  .story-body p.ask,.ask{margin-top:28px;max-width:22ch}
}
.pull-quote{
  font-family:"DM Sans",sans-serif;font-weight:900;font-weight:800;text-transform:uppercase;
  font-size:clamp(1.6rem,3.4vw,2.7rem);line-height:1;color:var(--black);max-width:24ch;
  margin:60px 0 0;padding:34px 0 0;border-top:2px solid var(--red);
}
.pull-quote b{color:var(--red);font-weight:900}

/* ---------- the eight pieces ---------- */
.pieces{list-style:none;counter-reset:p;margin:44px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:0;border-top:2px solid var(--black)}
.pieces li{counter-increment:p;padding:22px 24px 26px 0;border-bottom:1px solid var(--line)}
.pieces li:before{
  content:counter(p,decimal-leading-zero);display:block;font-family:"DM Sans",sans-serif;
  font-size:.72rem;letter-spacing:.16em;color:var(--red);margin-bottom:14px;
}
.pieces b{display:block;font-size:1.02rem;font-weight:700;margin-bottom:5px}
.pieces span{font-size:.9rem;color:var(--dim);line-height:1.5}

/* ---------- proof strip ---------- */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));border-top:2px solid var(--black)}
.metrics div{padding:20px 20px 0;border-right:1px solid var(--line)}
.metrics div:last-child{border-right:0}
.metrics b{display:block;font-family:"DM Sans",sans-serif;font-weight:900;font-weight:800;
  font-size:clamp(1.9rem,3.4vw,2.9rem);letter-spacing:-.03em;line-height:1}
.metrics span{display:block;margin-top:9px;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);line-height:1.5}
@media(max-width:700px){.metrics div{border-right:0;border-bottom:1px solid var(--line);padding-bottom:18px}}

/* ---------- contrast columns ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:0;border:2px solid var(--black);border-radius:0;overflow:hidden;background:var(--bone)}
.split > div{padding:32px 28px}
.split > div:first-child{border-right:2px solid var(--black)}

.split h3{
  font-family:"DM Sans",sans-serif;
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--dim);
  margin-bottom:18px;
}
.split h3 em{
  font-family:var(--serif);
  font-style:italic;
  text-transform:none;
  letter-spacing:.01em;
  font-weight:600;
  font-size:1.85rem;
  display:block;
  margin-top:2px;
  color:var(--black);
}
.split .rent h3 em{color:var(--red)}
.split .own  h3 em{color:var(--gold-ink)}

.split ul{list-style:none;margin:0;padding:0}
.split li{padding:11px 0;border-bottom:1px solid var(--line);font-size:.98rem;display:flex;gap:12px}
.split li:last-child{border-bottom:0}
.split li i{font-style:normal;flex:none;width:13px;color:var(--red)}
.split .own li i{color:var(--gold-ink)}

/* ---------- the VS divider ---------- */
.split{position:relative}
.split .vs{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:2;
  width:64px;height:64px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--bone);
  border:2px solid var(--black);
  font-family:var(--serif);font-style:italic;font-weight:600;
  font-size:1.5rem;line-height:1;color:var(--black);
}

@media(max-width:760px){
  .split{grid-template-columns:1fr}
  .split>div:first-child{border-right:0;border-bottom:2px solid var(--black)}
  
  .split > div{padding:24px 20px}
  .split h3 em{font-size:1.55rem}
  .split li{padding:9px 0;font-size:.94rem;gap:10px;line-height:1.35}
  .split .vs{
    top:50%;width:52px;height:52px;font-size:1.25rem;
  }
}

/* ---------- terms / ladder ---------- */
.ladder{display:grid;gap:0;border-top:2px solid var(--black);margin-top:38px}
.rung{display:grid;grid-template-columns:180px 1fr auto;gap:24px;padding:26px 0;border-bottom:1px solid var(--line);align-items:baseline}
.rung .price{font-family:"DM Sans",sans-serif;font-weight:900;font-weight:800;font-size:1.9rem;letter-spacing:-.03em}
.rung .price small{display:block;font-size:.66rem;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-top:7px}
.rung .what b{display:block;font-size:1.06rem;font-weight:700;margin-bottom:4px;text-transform:uppercase;letter-spacing:-.01em}
.rung .what p{margin:0;font-size:.93rem;color:var(--dim)}
.rung .tag{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.rung.feature{background:var(--black);color:var(--bone);padding:30px 24px;border-bottom:0}
.rung.feature p{color:#A8A49C}
.rung.feature .price small{color:#A8A49C}
.rung.feature .tag{color:var(--red)}
@media(max-width:780px){.rung{grid-template-columns:1fr;gap:10px}.rung .tag{display:none}}

/* ---------- work ---------- */
.work{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0;border-top:2px solid var(--black)}
.tile{
  background:transparent;border-bottom:1px solid var(--line);border-right:1px solid var(--line);
  overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:.16s;
}
.tile:hover{background:var(--white)}
.tile .shot{aspect-ratio:16/10;background:var(--bone-2);position:relative;overflow:hidden}
.tile .shot img{width:100%;height:100%;object-fit:cover;object-position:top;filter:grayscale(1) contrast(1.1);transition:.2s}
.tile:hover .shot img{filter:none}
.tile .meta{padding:20px 22px 26px}
.tile .meta b{display:block;font-size:1.04rem;font-weight:700;margin-bottom:5px;text-transform:uppercase}
.tile .meta p{margin:0;font-size:.89rem;color:var(--dim)}
.badge{
  position:absolute;top:0;left:0;background:var(--red);color:var(--bone);
  font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:6px 11px;
}

/* ---------- audit ---------- */
.audit-shell{background:var(--white);border:2px solid var(--black);overflow:hidden}
.audit-head{padding:22px 28px;border-bottom:2px solid var(--black);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.progress{height:4px;background:var(--line);flex:1 1 200px;min-width:120px}
.progress i{display:block;height:100%;background:var(--red);width:0;transition:width .35s cubic-bezier(.4,0,.2,1)}
.q{padding:40px 28px}
.q .num{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.q h3{font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:10px;font-weight:900;font-weight:800;line-height:1}
.q .why{color:var(--dim);font-size:.94rem;margin-bottom:24px;max-width:56ch}
.opts{display:grid;gap:8px}
.opt{
  display:flex;align-items:center;gap:13px;padding:15px 18px;background:var(--bone);
  border:1px solid var(--line);border-radius:0;cursor:pointer;text-align:left;
  font:inherit;color:inherit;transition:.12s;width:100%;
}
.opt:hover{border-color:var(--black);background:var(--white);transform:translateX(3px)}
.opt kbd{flex:none;width:24px;height:24px;background:var(--white);border:1px solid var(--line);
  display:grid;place-items:center;font-size:.68rem;color:var(--dim)}
.opt:hover kbd{border-color:var(--red);color:var(--red)}
.audit-foot{padding:16px 28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--dim)}
.linkbtn{background:none;border:0;color:var(--dim);font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}
.linkbtn:hover{color:var(--red)}

.score-hero{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;padding:38px 28px;border-bottom:2px solid var(--black)}
.dial{position:relative;width:144px;height:144px;flex:none}
.dial svg{transform:rotate(-90deg)}
.dial .val{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.dial .val b{font-family:"DM Sans",sans-serif;font-weight:900;font-size:2.7rem;line-height:1}
.dial .val span{display:block;font-family:"DM Sans",sans-serif;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:5px}
@media(max-width:640px){.score-hero{grid-template-columns:1fr;justify-items:start}}

.finding{padding:24px 28px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;gap:18px}
.finding:last-child{border-bottom:0}
.sev{flex:none;width:38px;height:38px;display:grid;place-items:center;font-family:"DM Sans",sans-serif;font-weight:700;font-size:.72rem}
.sev.hi{background:var(--red);color:var(--bone)}
.sev.md{background:var(--black);color:var(--bone)}
.sev.ok{background:var(--line);color:var(--black)}
.finding b{display:block;font-size:1.04rem;font-weight:700;margin-bottom:5px}
.finding p{margin:0 0 9px;font-size:.94rem;color:var(--dim)}
.fix{font-size:.86rem;color:var(--red);display:flex;gap:8px;align-items:flex-start}
.fix i{font-style:normal;flex:none}

/* ---------- forms ---------- */
.capture{padding:32px 28px;background:var(--bone-2);border-top:2px solid var(--black)}
input,select,textarea{
  width:100%;padding:14px 16px;background:var(--white);border:1px solid var(--black);border-radius:0;
  color:var(--black);font:inherit;font-size:1rem;
}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
input::placeholder{color:#A9A59D}
label{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:0 0 7px;font-weight:700}
.row{display:grid;gap:14px;grid-template-columns:1fr 1fr}
@media(max-width:620px){.row{grid-template-columns:1fr}}

/* ---------- bio ---------- */
.pull{font-size:clamp(1.8rem,4vw,3rem);line-height:1;max-width:20ch}
.attrib{margin-top:20px;font-family:"DM Sans",sans-serif;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.bio{display:grid;grid-template-columns:320px 1fr;gap:52px;align-items:start}
.bio img{width:100%;filter:grayscale(1) contrast(1.15)}
@media(max-width:820px){.bio{grid-template-columns:1fr;gap:28px}.bio img{max-width:250px}}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{padding:0 0 24px 26px;position:relative;border-left:2px solid var(--line);margin-left:5px}
.timeline li:last-child{border-left-color:transparent;padding-bottom:0}
.timeline li:before{content:"";position:absolute;left:-5px;top:8px;width:8px;height:8px;background:var(--red)}
.timeline b{display:block;font-size:1rem;font-weight:700;margin-bottom:3px;text-transform:uppercase}
.timeline span{color:var(--dim);font-size:.92rem}

/* ---------- faq ---------- */
details{border-bottom:1px solid var(--line);padding:20px 0}
summary{cursor:pointer;font-weight:700;font-size:1.02rem;list-style:none;display:flex;justify-content:space-between;gap:20px;text-transform:uppercase;letter-spacing:-.01em}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";font-family:"DM Sans",sans-serif;color:var(--red);font-size:1.2rem;line-height:1.2}
details[open] summary:after{content:"–"}
details p{margin:14px 0 0;color:var(--dim);font-size:.95rem;max-width:66ch}

/* ---------- footer ---------- */
footer.site{background:var(--black);color:#8E8A82;padding:60px 0 28px;font-size:.9rem}
footer.site a{color:var(--bone);text-decoration:none}
footer.site a:hover{color:var(--red)}
footer.site .logo{color:var(--bone)}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}
@media(max-width:820px){.fgrid{grid-template-columns:1fr 1fr}}
footer h4{font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:14px;font-weight:700}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin-bottom:9px}
.fbot{border-top:1px solid #262523;margin-top:44px;padding-top:20px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}

.hidden{display:none !important}
.fade{animation:fade .35s ease both}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;scroll-behavior:auto}}

/* back-compat aliases for inline styles left in the other pages */
:root{
  --gold:var(--red);--gold-2:var(--red-deep);--text:var(--black);--text-dim:var(--dim);
  --text-dark:var(--black);--text-dark-dim:var(--dim);--ink:var(--black);--ink-2:var(--bone-2);
  --ink-3:var(--white);--paper:var(--bone);--paper-2:var(--bone-2);--accent:var(--red);
  --sig:var(--black);--warn:var(--red);--r:0;
}

/* v6 — THE SITE IS THE DEMO */

/* ---------- inverted hero ---------- */
.hero.stage{background:var(--black);color:var(--bone);padding:74px 0 84px;border-bottom:2px solid var(--black)}
.hero.stage h1{color:var(--bone);max-width:14ch}
.hero.stage h1 em{color:var(--red);font-style:normal}
.hero.stage .sub{color:#A8A49C;max-width:44ch}
.hero.stage .hero-note{color:#6E6A63}
.hero.stage .stamp{border-color:var(--red);color:var(--red)}
.hero.stage .btn{background:var(--red);color:var(--bone)}
.hero.stage .btn:hover{background:var(--bone);color:var(--black)}
.hero.stage .btn.line{background:transparent;color:var(--bone);box-shadow:inset 0 0 0 2px #3A3A38}
.hero.stage .btn.line:hover{background:var(--bone);color:var(--black);box-shadow:inset 0 0 0 2px var(--bone)}
.hero.stage .hero-grid{grid-template-columns:1fr 470px;align-items:center}
@media(max-width:1000px){.hero.stage .hero-grid{grid-template-columns:1fr;gap:44px}}

/* ---------- the calendar that fills itself ---------- */
.cal{background:var(--bone);color:var(--black);padding:20px;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.cal-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;
  font-family:"DM Sans",sans-serif;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase}
.cal-top b{font-weight:700}
.cal-live{display:inline-flex;align-items:center;gap:7px;color:var(--red)}
.cal-live i{width:7px;height:7px;background:var(--red);border-radius:50%;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.cal-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.cal-col{display:grid;gap:5px}
.cal-day{font-family:"DM Sans",sans-serif;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);text-align:center;padding-bottom:3px}
.slot{height:30px;background:#E2DED4;border:1px dashed #C7C1B4;transition:.45s cubic-bezier(.2,.8,.2,1);
  display:grid;place-items:center;font-family:"DM Sans",sans-serif;font-size:.56rem;
  letter-spacing:.06em;color:transparent;text-transform:uppercase}
.slot.booked{background:var(--red);border:1px solid var(--red);color:#fff;transform:scale(1.02)}
.cal-foot{margin-top:16px;display:flex;justify-content:space-between;align-items:baseline;
  font-family:"DM Sans",sans-serif;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.cal-foot b{font-family:"DM Sans",sans-serif;font-weight:900;font-size:1.5rem;letter-spacing:-.02em;color:var(--black)}

/* booking toast */
.toast{position:absolute;left:-18px;bottom:-30px;background:var(--black);color:var(--bone);
  padding:11px 15px;box-shadow:0 12px 34px rgba(0,0,0,.5);opacity:0;transform:translateY(8px);
  transition:.3s;max-width:250px;pointer-events:none}
.toast.show{opacity:1;transform:none}
.toast b{display:block;font-family:"DM Sans",sans-serif;font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--red);margin-bottom:3px}
.toast span{font-size:.82rem;line-height:1.35;display:block}

/* ---------- live ticker ---------- */
.ticker{background:var(--red);color:#fff;overflow:hidden;padding:11px 0;white-space:nowrap;
  border-top:2px solid var(--black);border-bottom:2px solid var(--black)}
.ticker-track{display:inline-block;animation:slide 34s linear infinite;font-family:"DM Sans",sans-serif;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.ticker-track span{padding:0 26px}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- the follow-up sequence player ---------- */
.seq{margin-top:44px;border-top:2px solid var(--black)}
.seq-row{display:grid;grid-template-columns:120px 1fr auto;gap:22px;padding:18px 0;
  border-bottom:1px solid var(--line);align-items:center;opacity:.28;transition:.5s}
.seq-row.on{opacity:1}
.seq-row .when{font-family:"DM Sans",sans-serif;font-size:.68rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--red)}
.seq-row .what b{display:block;font-weight:700;font-size:1rem}
.seq-row .what span{font-size:.88rem;color:var(--dim)}
.seq-row .chan{font-family:"DM Sans",sans-serif;font-size:.6rem;letter-spacing:.12em;
  text-transform:uppercase;border:1px solid var(--line);padding:5px 9px;white-space:nowrap}
.seq-row.on .chan{border-color:var(--red);color:var(--red)}
.seq-row.hit .chan{background:var(--black);color:var(--bone);border-color:var(--black)}
@media(max-width:700px){.seq-row{grid-template-columns:90px 1fr;gap:14px}.seq-row .chan{display:none}}
/* The section 03 opening beats borrow the sequence look but are not played, so they sit at full opacity. */
.seq.beats .seq-row{opacity:1}

/* ---------- interactive pieces ---------- */
.pieces li{transition:.2s;position:relative}
.pieces li:hover{background:var(--white)}
.pieces li:hover:before{color:var(--black)}

/* ---------- scroll reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(18px)}
[data-reveal].in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none}}

/* ---------- big statement block ---------- */
.statement{background:var(--black);color:var(--bone);padding:88px 0}
.statement h2{color:var(--bone);max-width:15ch}
.statement em{font-style:normal;color:var(--red)}
.statement .dim{color:#8E8A82}

/* ---------- Powered by Azimuth — the platform band ---------- */
.platform{background:var(--black);color:var(--bone);padding:74px 0;border-top:2px solid var(--red)}
.platform h2{color:var(--bone);max-width:14ch}
.platform em{font-style:normal;color:var(--red)}
.platform .dim{color:#8E8A82}
.az-grid{display:grid;grid-template-columns:180px 1fr;gap:52px;align-items:center}
@media(max-width:820px){.az-grid{grid-template-columns:1fr;gap:30px}}
.az-mark{width:150px;height:150px}
.az-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:0;
  margin-top:34px;border-top:1px solid #2A2926}
.az-facts div{padding:18px 20px 0 0;border-right:1px solid #2A2926}
.az-facts div:last-child{border-right:0}
.az-facts b{display:block;font-family:"DM Sans",sans-serif;font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red);margin-bottom:8px}
.az-facts span{font-size:.92rem;color:#8E8A82;line-height:1.5}
@media(max-width:700px){.az-facts div{border-right:0;border-bottom:1px solid #2A2926;padding-bottom:16px}}
.fbot .az{display:inline-flex;align-items:center;gap:8px;color:var(--bone)}
.fbot .az svg{width:15px;height:15px}

/* ---------- the team ---------- */
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0;
  margin-top:44px;border-top:2px solid var(--black)}
.team-card{padding:26px 24px 30px 0;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}
.team-card:last-child{border-right:0}
.team-face{width:96px;height:96px;background:var(--black);margin-bottom:18px;
  display:grid;place-items:center;overflow:hidden;position:relative}
.team-face img{width:100%;height:100%;object-fit:cover}
.team-face.initial{font-family:"DM Sans",sans-serif;font-weight:900;font-size:2.6rem;
  color:var(--red);line-height:1}
.team-card .role{font-family:"DM Sans",sans-serif;font-size:.64rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red);margin-bottom:7px}
.team-card b{display:block;font-size:1.16rem;font-weight:900;font-weight:800;
  text-transform:uppercase;letter-spacing:-.02em;margin-bottom:8px}
.team-card p{margin:0;font-size:.9rem;color:var(--dim);line-height:1.55}
.team-card .kind{display:inline-block;margin-top:12px;font-family:"DM Sans",sans-serif;
  font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
  border:1px solid var(--line);padding:4px 8px}
@media(max-width:640px){.team-card{border-right:0}}

/* long-version disclosure on About Us */
details summary{outline:none}
.paper-2 details{border-bottom:1px solid var(--line)}
.paper-2 details p{font-size:.95rem;color:var(--dim);line-height:1.65;margin:0 0 1em}

/* v8 contrast pass: yellow is a LIGHT accent, so anything sitting */
.btn:hover{background:var(--red);color:var(--black)}
.btn.dark:hover{background:var(--red);color:var(--black)}
.hero.stage .btn{background:var(--red);color:var(--black)}
.hero.stage .btn:hover{background:var(--bone);color:var(--black)}
.ticker{background:var(--red);color:var(--black);border-top:2px solid var(--black);border-bottom:2px solid var(--black)}
.badge{background:var(--red);color:var(--black)}
.sev.hi{background:var(--red);color:var(--black)}
.progress i{background:var(--red)}
.team-face.initial{color:var(--red)}
footer.site a:hover{color:var(--red)}
.platform{border-top:2px solid var(--red)}

/* duotone reads warm graphite instead of sickly yellow */
.duo{background:#12161C}
.duo img{filter:grayscale(1) contrast(1.08) brightness(1.04)}
.duo:after{background:#F2C037;mix-blend-mode:multiply;opacity:.42}

/* Bricolage tops out at 800, drop the leftover 900s */
h1,h2,h3,.order-no,.metrics b,.pull-quote,.rung .price,.logo{font-weight:800}
.pull-quote b{font-weight:800}

/* yellow is unreadable as text on cream: darken it for light backgrounds */
:root{--gold-ink:#C8410F}
.kicker{color:var(--gold-ink)}
.statement .kicker,.platform .kicker,.hero.stage .kicker,.inkblock .kicker{color:var(--red)}
.pieces li:before,.q .num,.fix{color:var(--gold-ink)}
.nav nav a:hover,.nav nav a[aria-current]{color:var(--black);box-shadow:inset 0 -2px 0 var(--red)}
.slot.booked{color:var(--black);font-weight:700}
.cal-live{color:var(--gold-ink)}
.cal-live i{background:var(--red)}
summary:after{color:var(--gold-ink)}
.timeline li:before{background:var(--gold-ink)}
.pull-quote{border-top-color:var(--gold-ink)}
.pull-quote b{color:var(--gold-ink)}
.stamp{border-color:var(--gold-ink);color:var(--gold-ink)}
.hero.stage .stamp{border-color:var(--red);color:var(--red)}
a[style*="var(--red)"]{color:var(--gold-ink) !important}
.statement a[style*="var(--red)"],.platform a[style*="var(--red)"]{color:var(--red) !important}
.statement b[style*="var(--red)"]{color:var(--red)}

/* v9: Azimuth Sales house style. Sentence case, rounded corners */
h1,h2,h3{text-transform:none;letter-spacing:-.03em;font-weight:800}
h1{line-height:1.02}
h2{line-height:1.05}
.pull-quote,.rung .what b,.pieces b,.team-card b,.tile .meta b,.timeline b,
.metrics b,.finding b,summary{text-transform:none;letter-spacing:-.02em}
.btn{border-radius:8px;letter-spacing:0;text-transform:none;font-size:.95rem;font-weight:600;
     background:var(--red);color:#fff}
.btn:hover{background:#FF7A4D;color:#fff}
.btn.big{font-size:1rem;padding:18px 30px}
.btn.sm{font-size:.85rem;padding:11px 18px}
.btn.line{background:transparent;color:var(--black);box-shadow:inset 0 0 0 1.5px #CFCBC5}
.btn.line:hover{background:var(--black);color:#fff;box-shadow:none}
.hero.stage .btn{background:var(--red);color:#fff}
.hero.stage .btn:hover{background:#FF7A4D}
.hero.stage .btn.line{background:#1A1A1A;color:#fff;box-shadow:none}
.hero.stage .btn.line:hover{background:#262626}
.cal,.tile,.audit-shell,.team-face,.duo,.split,.opt,input,select,textarea{border-radius:10px}
.stamp{border-radius:6px;transform:none;border-width:1px;letter-spacing:.14em}
.rung.feature{border-radius:10px}
.badge{border-radius:6px}
.order-no{-webkit-text-stroke:1.5px var(--line)}
.kicker{letter-spacing:.14em;font-weight:700}
.ticker,.slot.booked{color:#fff}
.toast{border-radius:10px}
.statement,.platform,.hero.stage{background:#0D0D0D}
footer.site{background:#0A0A0A}
.duo:after{background:#F05A28;opacity:.34}

/* v10 — NAVY & GOLD. Palette and type lifted from the original */

:root{
  --bone:#0D1F35;        /* page ground */
  --bone-2:#132A44;      /* paper */
  --white:#17304C;       /* raised panel */
  --black:#F0F4F8;       /* ink, now light on navy */
  --soft:#C3CEDC;
  --dim:#8FA0B4;
  --line:rgba(201,167,94,.26);
  --hair:#0A1728;
  --red:#C9A75E;         /* gold — the single accent */
  --red-deep:#B8972A;
  --gold-ink:#E0C176;    /* brighter gold for small text */
  --deep:#0A1728;        /* deepest ground, for inverted bands */
  --serif:"Cormorant Garamond",Georgia,serif;
}

/* ---------- type ---------- */
body{font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
h1,h2,h3,.pull,.pull-quote,.order-no,.metrics b,.rung .price,.dial .val b,
.cal-foot b,.team-card b,.serif{font-family:var(--serif)}
h1,h2,h3{font-weight:300;letter-spacing:-.01em;text-transform:none}
h1{font-size:clamp(2.5rem,6.6vw,4.8rem);line-height:1.08}
h2{font-size:clamp(2rem,4.2vw,3.1rem);line-height:1.12}
h3{font-size:1.5rem;line-height:1.2;font-weight:400}
.hero h1,.hero.stage h1{font-size:clamp(2.4rem,5.6vw,4.4rem);max-width:15ch}
.pull-quote,.metrics b,.rung .price,.order-no,.logo{font-weight:300}
.pull-quote{font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.18;letter-spacing:-.01em}
.pull-quote b{font-weight:400;color:var(--gold-ink)}
.dial .val b,.cal-foot b{font-weight:400}
.team-card b,.tile .meta b,.rung .what b,.pieces b,.timeline b,.finding b,summary{
  font-family:"DM Sans",sans-serif;font-weight:600;letter-spacing:-.01em}
.logo{font-family:var(--serif);font-weight:400;letter-spacing:.02em;text-transform:uppercase;font-size:1.15rem}
.kicker,.mono,.tag,.badge,label,.metrics span,.q .num,footer h4,.fbot,.hero-note{
  font-family:"DM Sans",sans-serif}
.kicker{color:var(--gold-ink);letter-spacing:.18em;font-weight:500}
.statement .kicker,.platform .kicker,.hero.stage .kicker{color:var(--gold-ink)}

/* ---------- inverted bands and dark grounds ---------- */
.statement,.platform,.hero.stage{background:var(--deep)}
footer.site{background:var(--deep);color:var(--soft)}
.hero.stage .sub{color:var(--soft)}
.hero.stage .hero-note{color:var(--dim)}
.statement .dim,.platform .dim,.az-facts span{color:var(--soft)}
.az-facts,.az-facts div{border-color:rgba(201,167,94,.22)}
.fbot{border-top-color:rgba(201,167,94,.22)}
.toast{background:var(--deep);color:var(--black)}
.rung.feature{background:var(--white);color:var(--black)}
.rung.feature p,.rung.feature .price small{color:var(--soft)}
.team-face{background:var(--white)}
.sev.md{background:var(--white);color:var(--black)}
.sev.ok{background:rgba(201,167,94,.18);color:var(--black)}
.seq-row.hit .chan{background:var(--red);color:var(--deep);border-color:var(--red)}
.duo{background:#0A1728}
.duo:after{background:#C9A75E;mix-blend-mode:multiply;opacity:.34}

/* ---------- gold surfaces need navy text, never light ---------- */
.badge,.sev.hi,.ticker,.slot.booked{color:var(--deep)}
.btn{background:var(--red);color:var(--deep);font-family:"DM Sans",sans-serif;font-weight:600}
.btn:hover{background:var(--gold-ink);color:var(--deep)}
.btn.line{background:transparent;color:var(--black);box-shadow:inset 0 0 0 1.5px rgba(201,167,94,.5)}
.btn.line:hover{background:var(--red);color:var(--deep);box-shadow:none}
.btn.dark{background:var(--red);color:var(--deep)}
.btn.dark:hover{background:var(--gold-ink);color:var(--deep)}
.hero.stage .btn{background:var(--red);color:var(--deep)}
.hero.stage .btn:hover{background:var(--gold-ink);color:var(--deep)}
.hero.stage .btn.line{background:transparent;color:var(--black);box-shadow:inset 0 0 0 1.5px rgba(201,167,94,.5)}
.hero.stage .btn.line:hover{background:var(--red);color:var(--deep);box-shadow:none}

/* ---------- rules, borders and hairlines go gold, not black ---------- */
header.site{background:rgba(13,31,53,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(201,167,94,.28)}
.rule,.paper .rule{background:rgba(201,167,94,.28);height:1px}
.pieces,.metrics,.ladder,.work,.team,.seq,.sources{border-top:1px solid rgba(201,167,94,.28)}
.sources li{border-bottom:1px solid rgba(201,167,94,.28)}
.story-body p.ask,.ask{color:var(--black)}
.split{border:1px solid rgba(201,167,94,.28);background:var(--bone-2)}
.split > div:first-child{border-right:1px solid rgba(201,167,94,.28)}
.audit-shell{background:var(--bone-2);border:1px solid rgba(201,167,94,.28)}
.audit-head,.score-hero{border-bottom:1px solid rgba(201,167,94,.28)}
.capture{background:var(--white);border-top:1px solid rgba(201,167,94,.28)}
.ticker{border-top:0;border-bottom:0}
.order-no{-webkit-text-stroke:1px rgba(201,167,94,.35)}
@media(max-width:760px){.split>div:first-child{border-right:0;border-bottom:1px solid rgba(201,167,94,.28)}}

/* ---------- calendar keeps its light card so the fill still reads ---------- */
.cal{background:var(--white);color:var(--black);box-shadow:0 24px 60px rgba(0,0,0,.5)}
.cal-foot b{color:var(--black)}
.slot{background:rgba(255,255,255,.05);border:1px dashed rgba(201,167,94,.3)}
.slot.booked{background:var(--red);border:1px solid var(--red);font-weight:600}
.cal-live,.cal-live i{color:var(--gold-ink)}
.cal-live i{background:var(--gold-ink)}

/* ---------- forms and inputs ---------- */
input,select,textarea{background:var(--deep);border:1px solid rgba(201,167,94,.35);color:var(--black)}
input::placeholder{color:var(--dim)}
input:focus,select:focus,textarea:focus{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.opt{background:var(--deep);border:1px solid rgba(201,167,94,.28);color:var(--black)}
.opt:hover{background:var(--white);border-color:var(--red);transform:translateX(3px)}
.opt kbd{background:var(--bone-2);border:1px solid rgba(201,167,94,.35);color:var(--gold-ink)}
.progress{background:rgba(201,167,94,.18)}

/* ---------- small accents ---------- */
.tile:hover{background:var(--white)}
.pieces li:hover{background:rgba(255,255,255,.03)}
.pieces li:hover:before{color:var(--gold-ink)}
.nav nav a{color:var(--soft)}
.nav nav a:hover,.nav nav a[aria-current]{color:var(--gold-ink);box-shadow:inset 0 -1px 0 var(--red)}
.stamp,.hero.stage .stamp{border-color:rgba(201,167,94,.5);color:var(--gold-ink)}
.pieces li:before,.q .num,.fix,summary:after,.cal-live{color:var(--gold-ink)}
.timeline li:before{background:var(--red)}
.timeline li{border-left-color:rgba(201,167,94,.28)}
.pull-quote{border-top-color:var(--red)}
footer.site a{color:var(--black)}
footer.site a:hover{color:var(--gold-ink)}
footer h4{color:var(--gold-ink)}
.fbot .az{color:var(--black)}
.platform{border-top:1px solid var(--red)}
a[style*="var(--red)"]{color:var(--gold-ink) !important}
.story-body p b,.story-body .lede{color:var(--black)}
.hero.stage h1,.statement h2,.platform h2{color:var(--black)}
.hero.stage h1 em,.statement em,.platform em{color:var(--gold-ink);font-style:normal}
.hero h1 em{color:var(--gold-ink)}
.rung.feature .tag,.seq-row.on .chan{color:var(--gold-ink);border-color:rgba(201,167,94,.5)}
.seq-row .when{color:var(--gold-ink)}
footer.site .logo,.fbot .az{color:var(--black)}

/* v11 */

/* the accent word */
.hero h1 em,.hero.stage h1 em{
  font-style:italic;text-transform:uppercase;letter-spacing:.01em;
  color:var(--red);font-weight:400;display:inline-block;
}
.statement em,.platform em{font-style:italic;color:var(--gold-ink)}

/* the banner behind the logo: light */
header.site{background:#F5F3F0;border-bottom:1px solid rgba(13,31,53,.14);backdrop-filter:none}
header.site .logo{color:#0D1F35}
header.site .logo .dim{color:#6E7A8A}
header.site .mark{color:var(--red)}
header.site nav a{color:#3A4A5C}
header.site nav a:hover,header.site nav a[aria-current]{color:#0D1F35;box-shadow:inset 0 -2px 0 var(--red)}
header.site .btn{background:var(--red);color:#0A1728}
header.site .btn:hover{background:var(--gold-ink);color:#0A1728}

/* the calendar card: whites and greys, gold only on booked */
.cal{background:#F7F5F1;color:#1A2A3C;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.cal-top,.cal-top b{color:#1A2A3C}
.cal-day{color:#8A8F96}
.slot{background:#E4E1DA;border:1px dashed #C9C4BA;color:transparent}
.slot.booked{background:var(--red);border:1px solid var(--red);color:#0A1728;font-weight:700}
.cal-foot{color:#6E7A8A}
.cal-foot b{color:#0D1F35}
.cal-live,.cal-live i{color:var(--red-deep)}
.cal-live i{background:var(--red-deep)}
/* booked slots need the deeper gold to read on a near-white card */
.slot.booked{background:#A8862F;border-color:#A8862F;color:#FFF8E6}
/* Cormorant renders lining numerals oddly at small sizes: keep counters in DM Sans */
.cal-foot b,.metrics b,.dial .val b{font-family:"DM Sans",sans-serif;font-weight:700;letter-spacing:-.02em}
/* the booking toast was landing on top of the JOBS BOOKED row */
.toast{left:-10px;bottom:-58px}
@media(max-width:1000px){.toast{left:0;bottom:-64px}}

/* v12 — VERTICAL LANDING PAGES */

/* the magnet card. */
.magnet-card{
  background:#F7F5F1;color:#1A2A3C;border-radius:10px;
  padding:26px 24px 24px;box-shadow:0 24px 60px rgba(0,0,0,.5);margin:0;
}
.magnet-card .mk{
  font-family:"DM Sans",sans-serif;font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:#A8862F;font-weight:600;margin-bottom:12px;
}
.magnet-card h3,.magnet-card .magnet-name{
  font-family:var(--serif);font-weight:400;font-size:1.55rem;line-height:1.15;
  color:#0D1F35;margin:0 0 10px;letter-spacing:-.01em;
}
.magnet-card p.mb{font-size:.92rem;color:#4A5A6C;margin:0 0 16px;line-height:1.5}
.magnet-card ul{list-style:none;margin:0 0 20px;padding:0;border-top:1px solid rgba(13,31,53,.14)}
.magnet-card li{
  font-size:.87rem;color:#2A3A4C;line-height:1.45;padding:10px 0 10px 21px;
  border-bottom:1px solid rgba(13,31,53,.10);position:relative;
}
.magnet-card li:before{content:"\2192";position:absolute;left:0;top:10px;color:#A8862F}
.magnet-card label{color:#6E7A8A;font-weight:600}
.magnet-card input{background:#fff;border:1px solid rgba(13,31,53,.28);color:#0D1F35}
.magnet-card input::placeholder{color:#9AA3AF}
.magnet-card input:focus{border-color:#A8862F;box-shadow:inset 0 0 0 1px #A8862F}
.magnet-card .btn{margin-top:12px;background:#A8862F;color:#FFF8E6}
.magnet-card .btn:hover{background:#8D6F22;color:#FFF8E6}
.magnet-card .gate-note{font-size:.72rem;color:#6E7A8A;margin:11px 0 0;text-align:center;line-height:1.45}

/* the magnet again, as a full band lower down the page */
.magnet-band{display:grid;grid-template-columns:1fr 420px;gap:52px;align-items:center}
@media(max-width:900px){.magnet-band{grid-template-columns:1fr;gap:32px}}

/* secondary routes: the brochure and the free question, for the people who are never going to click the primary CTA today */
.routes{
  display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:34px;
  border:1px solid rgba(201,167,94,.28);border-radius:10px;overflow:hidden;background:var(--bone-2);
}
.routes > div{padding:30px 28px}
.routes > div:first-child{border-right:1px solid rgba(201,167,94,.28)}
.routes h3{
  font-family:"DM Sans",sans-serif;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;font-weight:600;color:var(--gold-ink);margin-bottom:12px;
}
.routes p{font-size:.95rem;color:var(--soft);margin:0 0 20px;max-width:44ch}
@media(max-width:760px){
  .routes{grid-template-columns:1fr}
  .routes > div:first-child{border-right:0;border-bottom:1px solid rgba(201,167,94,.28)}
}

/* the hub. routing built for nine verticals, not four. */
.vgrid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:0;
  border-top:1px solid rgba(201,167,94,.28);margin-top:38px;
}
.vcard{
  display:block;padding:28px 26px 30px 0;text-decoration:none;transition:.16s;
  border-bottom:1px solid rgba(201,167,94,.28);border-right:1px solid rgba(201,167,94,.28);
}
.vcard:hover{background:var(--white)}
.vcard .vn{
  font-family:"DM Sans",sans-serif;font-size:.64rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-ink);margin-bottom:11px;font-weight:600;
}
.vcard b{
  display:block;font-family:var(--serif);font-weight:400;font-size:1.55rem;
  line-height:1.14;color:var(--black);margin-bottom:9px;letter-spacing:-.01em;
}
.vcard p{margin:0;font-size:.92rem;color:var(--dim);line-height:1.5}
.vcard.soon{opacity:.42;pointer-events:none}
.vcard.soon .vn{color:var(--dim)}
@media(max-width:640px){.vcard{border-right:0;padding-right:0}}

/* v12 */
.statement{padding:104px 0}
.statement h2{
  max-width:20ch;
  font-size:clamp(2.6rem,7.4vw,5.4rem);
  line-height:1.04;
  letter-spacing:-.015em;
}
.statement .wrap,.statement .narrow,.statement .mid{max-width:1100px}
.statement p,.statement .dim{font-size:clamp(1.02rem,1.5vw,1.2rem);max-width:52ch}
@media(max-width:620px){
  .statement{padding:76px 0}
  .statement h2{font-size:clamp(2.3rem,10.4vw,3.4rem);max-width:14ch}
}

/* v13 — the vignette. One buyer, one hour, one closing door */
.vignette{
  margin:34px 0 0;padding:24px 28px;border-left:2px solid var(--red);
  background:rgba(201,167,94,.05);border-radius:0 10px 10px 0;max-width:60ch;
}
.vignette p{
  margin:0 0 12px;font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.4;color:var(--black);
}
.vignette figcaption{
  font-family:"DM Sans",sans-serif;font-size:.95rem;line-height:1.5;
  color:var(--gold-ink);font-weight:500;
}
@media(max-width:620px){.vignette{padding:20px 20px}}

/* the playbook page */
.pb-table{width:100%;border-collapse:collapse;margin-top:26px;font-size:.95rem}
.pb-table th{
  text-align:left;font-family:"DM Sans",sans-serif;font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-ink);font-weight:600;
  padding:0 18px 12px 0;border-bottom:1px solid rgba(201,167,94,.28);vertical-align:bottom;
}
.pb-table td{
  padding:16px 18px 16px 0;border-bottom:1px solid rgba(201,167,94,.16);
  color:var(--soft);line-height:1.5;vertical-align:top;
}
.pb-table td:first-child{color:var(--black);font-weight:500;white-space:nowrap}
.pb-table td:last-child{color:var(--gold-ink)}
@media(max-width:760px){
  .pb-table,.pb-table tbody,.pb-table tr,.pb-table td{display:block;width:100%}
  .pb-table thead{display:none}
  .pb-table tr{border-bottom:1px solid rgba(201,167,94,.28);padding:14px 0}
  .pb-table td{border:0;padding:3px 0}
  .pb-table td:first-child{white-space:normal;font-size:1.05rem}
}
.pb-block{
  border:1px solid rgba(201,167,94,.28);border-radius:10px;padding:26px 28px;
  margin-top:22px;background:var(--bone-2);
}
.pb-block .pb-tag{
  font-family:"DM Sans",sans-serif;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-ink);font-weight:600;margin-bottom:14px;display:block;
}
.pb-block p{color:var(--soft);max-width:62ch}
.pb-block p.line{
  font-family:var(--serif);font-size:1.25rem;color:var(--black);font-style:italic;
}
.pb-rule{
  border-left:2px solid var(--red);padding:4px 0 4px 20px;margin:22px 0;
  color:var(--black);max-width:62ch;
}

/* v14 */
.hero h1,.hero.stage h1{
  font-size:clamp(2.6rem,7vw,5.4rem);
  line-height:1.04;
  letter-spacing:-.015em;
  max-width:16ch;
}
/* the home hero shares its row with the calendar, so it gets the full scale only once the card drops below it */
@media(min-width:1001px){
  .hero.stage .hero-grid h1{font-size:clamp(2.6rem,5.4vw,4.6rem)}
}
@media(max-width:620px){
  .hero h1,.hero.stage h1{font-size:clamp(2.5rem,11vw,3.6rem);max-width:12ch}
}

/* v15 */
:root{
  --bone:#0E2440;        /* page ground */
  --bone-2:#143154;      /* paper */
  --white:#1A3A61;       /* raised panel */
  --deep:#0B1D34;        /* footer, the only truly deep value */
  --line:rgba(201,167,94,.28);
}
.statement,.platform,.hero.stage{background:#112B4C}
footer.site{background:var(--deep)}
.toast{background:#0B1D34}
.duo{background:#0B1D34}
.rung.feature,.team-face,.sev.md{background:var(--white)}
.opt,input,select,textarea{background:#0B1D34}
.opt:hover{background:var(--white)}
.pieces li:hover,.tile:hover,.vcard:hover{background:rgba(255,255,255,.045)}

/* v16 — THE PROOF BLOCK */
.proof-lines{
  display:grid;grid-template-columns:1.35fr 1fr;gap:0;margin-top:34px;
  border:1px solid rgba(201,167,94,.28);border-radius:10px;overflow:hidden;
  background:var(--bone-2);
}
.proof-line{padding:30px 30px 32px}
.proof-line:first-child{border-right:1px solid rgba(201,167,94,.28)}
.proof-line .pl-tag{
  display:block;font-family:"DM Sans",sans-serif;font-size:.64rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-bottom:14px;
}
.proof-line p{
  margin:0;font-family:var(--serif);font-weight:400;font-style:normal;
  font-size:clamp(1.08rem,1.6vw,1.32rem);line-height:1.42;color:var(--black);
  letter-spacing:-.005em;max-width:44ch;
}
.proof-foot{margin-top:22px;max-width:62ch;line-height:1.6}
@media(max-width:760px){
  .proof-lines{grid-template-columns:1fr}
  .proof-line:first-child{border-right:0;border-bottom:1px solid rgba(201,167,94,.28)}
  .proof-line{padding:26px 22px 28px}
}

/* v16 */
.order-no{
  -webkit-text-stroke:0;
  color:var(--red);
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2.6rem,5vw,4.2rem);
  line-height:1;
  letter-spacing:-.02em;
  margin-bottom:0;
  opacity:.92;
  position:relative;
  padding-bottom:10px;
}
.order-no:after{
  content:"";position:absolute;left:0;bottom:0;
  width:100%;height:2px;background:var(--red);opacity:.55;
}
.order-head{align-items:flex-end;gap:22px}
/* on the light bands the brighter gold washes out, drop to the ink gold */
.paper .order-no,.paper-2 .order-no{color:var(--red)}
@media(max-width:620px){
  .order-no{font-size:2.4rem}
  .order-head{gap:14px}
}

/* v17 — the counter line. "You can never have too many leads" */

.counter{
  font-family:var(--serif);
  font-style:italic;
  font-weight:600;
  font-size:clamp(1.7rem,3.6vw,2.7rem);
  line-height:1.16;
  letter-spacing:-.01em;
  color:var(--gold-ink);
  max-width:26ch;
  margin:18px 0 0;
}
.paper .counter,.paper-2 .counter{color:var(--red-deep)}

/* v18 — the one sourced statistic on the site. It is designed */
.statcite{
  display:grid;grid-template-columns:auto 1fr;gap:0 24px;align-items:start;
  margin-top:30px;padding:22px 26px;max-width:62ch;
  border-left:2px solid var(--red);background:rgba(201,167,94,.05);border-radius:0 10px 10px 0;
}
.statcite > b{
  font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,4.4vw,3.4rem);
  line-height:.9;color:var(--red);grid-row:span 2;
}
.statcite p{margin:0;color:var(--black);font-size:1.02rem;line-height:1.5}
.statcite p b{color:var(--gold-ink);font-weight:600}
.statcite span{
  display:block;margin-top:10px;font-size:.78rem;line-height:1.5;color:var(--dim);
  grid-column:2;
}
@media(max-width:620px){
  .statcite{grid-template-columns:1fr;gap:10px;padding:18px 20px}
  .statcite > b{grid-row:auto}
  .statcite span{grid-column:1}
}

/* references block. one place every future citation lands. */
.refs{list-style:none;counter-reset:r;margin:22px 0 0;padding:0;max-width:70ch}
.refs li{
  counter-increment:r;position:relative;padding-left:34px;margin-bottom:20px;
  font-size:.92rem;line-height:1.6;color:var(--soft);
}
.refs li:before{
  content:counter(r) ".";position:absolute;left:0;top:0;
  font-family:var(--serif);font-size:1.1rem;color:var(--red);
}
.refs a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:3px}
.refs li span{display:block;margin-top:8px;color:var(--dim);font-size:.86rem;font-style:italic}
/* .plain — the speed-to-lead claim reads as a sentence now, not a display figure, so the big-number column comes off and the block runs full width. */
.statcite.plain{grid-template-columns:1fr}
.statcite.plain p + p{margin-top:12px}
.statcite sup{font-size:.62em;line-height:0;vertical-align:super}
.statcite sup a{color:var(--gold-ink);text-decoration:none}
.statcite sup a:hover{text-decoration:underline}

/* v19 — the wordmark. "Executive Orders LLC" wrapped to two */
.logo .wordmark{display:flex;flex-direction:column;line-height:1}
.logo .wordmark small{
  font-family:"DM Sans",sans-serif;font-size:.44em;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
  margin-top:5px;white-space:nowrap;
}
header.site .logo .wordmark small{color:#6E7A8A}
@media(max-width:480px){
  .logo .wordmark small{font-size:.4em;letter-spacing:.1em}
}

/* v20 */
.logo .wordmark{display:block;line-height:1;white-space:nowrap}
.logo .wordmark small{display:none}
.hero .stamp,.hero.stage .stamp{
  font-size:clamp(.82rem,1.5vw,1rem);
  letter-spacing:.16em;
  padding:12px 20px;
  margin-bottom:30px;
}
@media(max-width:620px){
  .hero .stamp,.hero.stage .stamp{font-size:.78rem;padding:10px 16px;letter-spacing:.12em}
  .logo .wordmark{font-size:.92em}
}

/* ---------- capture: success + failure states ---------- */
.cap-done{border:1px solid var(--line);border-left:3px solid var(--gold-ink,#C9A75E);
  background:rgba(201,167,94,.07);padding:18px 20px;border-radius:8px;max-width:46ch}
.cap-done b{display:block;font-size:1.02rem;margin-bottom:5px}
.cap-done span{display:block;font-size:.92rem;color:var(--dim);line-height:1.5}
.cap-err{margin:10px 0 0;font-size:.84rem;color:#C25A4B;line-height:1.45}

/* ---------- inline capture block ---------- */
.cap{border:1px solid var(--line);border-radius:10px;padding:24px 24px 22px;background:var(--white,#fff);max-width:46ch}
.hero.stage .cap,.statement .cap{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16)}
.cap h3{font-size:1.12rem;margin:0 0 6px}
.cap .cap-sub{font-size:.94rem;color:var(--dim);line-height:1.5;margin:0 0 16px}
.cap .row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cap label{display:block;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:5px}
.cap input,.cap textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:6px;
  padding:10px 12px;font:inherit;font-size:.95rem;background:transparent;color:inherit;outline:none}
.cap input:focus,.cap textarea:focus{border-color:var(--gold-ink,#C9A75E)}
.cap .fld{margin-bottom:12px}
.cap .gate-note,.cap .cap-note{font-size:.76rem;color:var(--dim);line-height:1.45;margin:12px 0 0}
@media(max-width:560px){.cap .row{grid-template-columns:1fr}}

/* ---------- booking embed ---------- */
.booking{border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-top:26px;background:#fff}
.booking iframe{display:block;width:100%;height:720px;border:0}
@media(max-width:700px){.booking iframe{height:900px}}

/* Optional-field hint on capture forms (added 2026-08-13 with address/ZIP). */
.fldhint{font-weight:400;opacity:.55;text-transform:none;letter-spacing:0;margin-left:5px}

/* v21 — 2026-08-16. Google presence is the spine, and the PDF */

/* ---------- the chain band: Get Found › Get Qualified › Get Paid ---------- */
.chain{background:var(--deep);border:1px solid rgba(201,167,94,.28);border-radius:10px;
  padding:22px 26px;text-align:center;margin-bottom:38px}
.chain b{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,2.6vw,1.9rem);
  letter-spacing:-.01em;display:block}
.chain b i{color:var(--red);font-style:normal;margin:0 .5em;font-size:.8em;vertical-align:.08em}
.chain b em{color:var(--gold-ink);font-style:normal}
.chain span{display:block;margin-top:10px;font-size:.9rem;color:var(--soft);line-height:1.55}

/* ---------- the four tiers ---------- */
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px;align-items:stretch}
@media(max-width:1080px){.tiers{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.tiers{grid-template-columns:1fr}}
.tier{display:flex;flex-direction:column;border:1px solid rgba(201,167,94,.28);border-radius:10px;
  background:var(--bone-2)}

.tier-top{border-radius:9px 9px 0 0}
.tier-body,.tier-foot{border-radius:0 0 9px 9px}
.tier.pick{border:2px solid var(--red)}
.tier-top{background:var(--deep);padding:20px 20px 18px}
.tier.pick .tier-top{background:var(--red);color:var(--deep)}
.tier-name{font-family:"DM Sans",sans-serif;font-size:.7rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-ink)}
.tier.pick .tier-name{color:var(--deep)}
.tier-price{font-family:var(--serif);font-weight:400;font-size:2.4rem;line-height:1.05;
  letter-spacing:-.02em;margin-top:4px;white-space:nowrap}
.tier-price em{font-style:normal;font-size:.42em;opacity:.72;margin-right:.25em;letter-spacing:0}
.tier-price small{font-size:.34em;opacity:.7;letter-spacing:.04em}
.tier-line{font-size:.88rem;line-height:1.45;margin-top:9px;color:var(--soft)}
.tier.pick .tier-line{color:rgba(13,23,40,.82)}
.tier-body{padding:16px 20px 20px;flex:1}
.tier-prev{font-size:.78rem;color:var(--gold-ink);letter-spacing:.02em;padding-bottom:11px;
  margin-bottom:11px;border-bottom:1px dashed rgba(201,167,94,.3)}
.tier-body ul{list-style:none;margin:0;padding:0}
.tier-body li{position:relative;padding:0 0 9px 16px;font-size:.9rem;line-height:1.4}
.tier-body li:before{content:"\203A";position:absolute;left:0;top:-1px;color:var(--red);font-weight:700}
.tier-foot{padding:0 20px 18px;font-size:.74rem;color:var(--dim);letter-spacing:.02em}
.tier-foot b{color:var(--black);font-weight:600}
.tier-tag{position:absolute;top:-12px;left:50%;z-index:2;transform:translateX(-50%);background:var(--red);
  color:var(--deep);font-family:"DM Sans",sans-serif;font-size:.6rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:20px;white-space:nowrap}
.tier{position:relative}
.tiers{padding-top:12px}   /* room for the badge to hang above the first card */
.setupline{margin-top:20px;border:1px solid rgba(201,167,94,.28);border-radius:8px;
  padding:14px 18px;text-align:center;font-size:.9rem;color:var(--soft);line-height:1.6}
.setupline b{color:var(--black);font-weight:600}
.setupline em{color:var(--gold-ink);font-style:italic;font-family:var(--serif);font-size:1.08em}

/* ---------- the priced add-on menu ---------- */
.addons{margin-top:52px}
.addon-grp{margin-top:26px}
.addon-grp h3{font-family:"DM Sans",sans-serif;font-size:.68rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-ink);margin:0 0 10px}
.addon-grp ul{list-style:none;margin:0;padding:0;border-top:1px solid rgba(201,167,94,.22)}
.addon-grp li{display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:11px 0;border-bottom:1px solid rgba(201,167,94,.16);font-size:.96rem}
.addon-grp li b{font-weight:500}
.addon-grp li span{font-family:"DM Sans",sans-serif;font-weight:600;font-size:.9rem;
  color:var(--gold-ink);white-space:nowrap;text-align:right}
.addon-grp li span s{display:block;text-decoration:none;font-weight:400;font-size:.76rem;color:var(--dim)}

/* ---------- ownership: the strongest trust copy we have ---------- */
.ownblock{margin-top:44px;border:1.5px solid var(--red);border-radius:10px;padding:26px 28px}
.ownblock h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,2.6vw,1.85rem);
  line-height:1.22;margin:0 0 12px;max-width:26ch}
.ownblock h3 em{font-style:normal;color:var(--gold-ink)}
.ownblock p{margin:0 0 .7em;font-size:1rem;color:var(--soft);line-height:1.6}
.ownblock p b{color:var(--black);font-weight:600}
.ownblock .fine{font-size:.86rem;color:var(--dim);line-height:1.6;margin:14px 0 0}

/* ---------- dashboard proof: real screens, client data blurred ---------- */
.proof{display:grid;grid-template-columns:1fr 300px;gap:28px;align-items:end;margin-top:36px}
@media(max-width:900px){.proof{grid-template-columns:1fr;justify-items:center}}
.proof figure{margin:0}
.proof img{width:100%;border-radius:10px;border:1px solid rgba(201,167,94,.28);
  box-shadow:0 24px 60px rgba(0,0,0,.45);display:block}
.proof .phone img{border-radius:22px}
.proof figcaption{font-family:"DM Sans",sans-serif;font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dim);margin-top:12px;text-align:center}

/* ---------- the geo-grid ask ---------- */
.gridform .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.gridform .row2{grid-template-columns:1fr}}

/* ---------- the contractor score ---------- */
.partbars{padding:22px 28px;border-bottom:1px solid var(--line)}
.partbar{display:grid;grid-template-columns:14ch 1fr 3ch;gap:14px;align-items:center;margin-bottom:10px}
.partbar:last-of-type{margin-bottom:0}
.partbar b{font-family:"DM Sans",sans-serif;font-size:.68rem;letter-spacing:.08em;
  text-transform:uppercase;font-weight:700;color:var(--dim)}
.partbar i{display:block;height:6px;background:var(--line);border-radius:3px;overflow:hidden}
.partbar u{display:block;height:100%;background:var(--gold-ink,#C9A75E);text-decoration:none;
  transition:width .5s cubic-bezier(.4,0,.2,1)}
.partbar span{font-family:"DM Sans",sans-serif;font-weight:700;font-size:.9rem;text-align:right}
@media(max-width:560px){.partbar{grid-template-columns:1fr;gap:5px}.partbar span{text-align:left}}

/* the score form reuses the standard .cap capture plumbing, but inside the capture panel it should read as part of the report, not as a card on top of one */
.capture .cap{max-width:none;border:0;border-radius:0;padding:0;background:transparent}
.capture .cap .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.capture .cap .row2{grid-template-columns:1fr}}

/* the score tool is embedded in a section on a dark page as well as on its own page, so the shell must not assume a light background */
.score-embed{margin-top:34px}

/* v16 — 2026-08-16 PM. The contractor pass */
.hero.stage h1.hero-statement{
  font-size:clamp(1.95rem,4.15vw,3.45rem);
  line-height:1.08;
  max-width:23ch;
}
@media(max-width:620px){
  .hero.stage h1.hero-statement{font-size:clamp(1.75rem,7.4vw,2.4rem);max-width:20ch}
}

/* v17 — hero */
.hero.stage:has(.hero-statement){padding-bottom:84px}
/* one paragraph, sharing the row with the card, so it sets to the column rather than to the old full-width measure */
.hero.stage .hero-grid .sub{max-width:46ch}
/* the sentence headline in a shared row: same voice, one step down in scale so it doesn't shred itself against the 470px card */
@media(min-width:1001px){
  .hero.stage .hero-grid h1.hero-statement{
    font-size:clamp(1.8rem,3.05vw,2.6rem);
    max-width:none;          /* the grid column is the measure now */
  }
}
/* stacked, the card follows the copy with breathing room and still no divider between them */
@media(max-width:1000px){
  .hero.stage .hero-grid{gap:46px}
  .hero.stage:has(.hero-statement){padding-bottom:72px}
}

/* v22 — 2026-08-16 night. TYPOGRAPHY AND DENSITY */

/* ---------- 1. THE HERO, REORDERED ---------- */
.hero.stage h1.hero-statement{
  font-size:clamp(1.6rem,3.6vw,2.95rem);
  line-height:1.12;
  letter-spacing:-.012em;
  max-width:26ch;
  margin-bottom:0;
}
@media(min-width:1001px){
  /* sharing the row with the 470px card, so the column is the measure */
  .hero.stage .hero-grid h1.hero-statement{
    font-size:clamp(1.62rem,2.62vw,2.28rem);
    max-width:none;
  }
}
@media(max-width:620px){
  .hero.stage h1.hero-statement{font-size:clamp(1.3rem,5.95vw,1.62rem);max-width:none;line-height:1.16}
}
/* the supporting beat. */
.hero-beat{
  margin:16px 0 0;
  max-width:52ch;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(1rem,1.35vw,1.1rem);
  line-height:1.5;
  color:var(--soft);
}
.hero.stage .hero-beat{color:var(--soft)}
.hero-beat em{
  font-style:italic;text-transform:uppercase;letter-spacing:.045em;
  font-weight:600;color:var(--red);
}
@media(max-width:620px){
  .hero-beat{font-size:.98rem;margin-top:13px;max-width:none}
}

/* ---------- 2. MEASURE ---------- */
@media(max-width:620px){
  .wrap{padding:0 18px}
}
@media(min-width:1560px){
  :root{--wrap:1360px}
  .mid{max-width:1090px}
  .narrow{max-width:840px}
}

/* prose that was running past 75 characters on a wide screen. */
.statcite{max-width:615px}
.refs{max-width:585px}
.ownblock p{max-width:600px}
.ownblock .fine{max-width:565px}
.setupline{max-width:760px;margin-left:auto;margin-right:auto}
.q .why{max-width:560px}
.lede-dim{font-size:1.04rem;line-height:1.6}
@media(max-width:620px){
  .lede-dim{font-size:.99rem;line-height:1.55}
}

/* prose that was running under 40 characters on a phone: the two big ledes carry the section and were set at phone-hostile sizes */
@media(max-width:620px){
  .story-body{max-width:none}
  .story-body p{font-size:1rem}
  .story-body .lede{font-size:1.1rem;line-height:1.46}
  .statcite p{font-size:.97rem;line-height:1.52}
  .statcite{padding:16px 18px}
  .sources li{font-size:.98rem}
  details p{font-size:.92rem}
  .refs li{font-size:.88rem}
}

/* ---------- 3. VERTICAL SPACE ---------- */
section{padding:64px 0}
section.tight{padding:42px 0}
.hero.stage{padding:52px 0 58px}
.hero.stage:has(.hero-statement){padding-bottom:58px}
.statement{padding:68px 0}
.platform{padding:56px 0}
@media(max-width:760px){
  section{padding:46px 0}
  section.tight{padding:32px 0}
  .statement{padding:50px 0}
  .platform{padding:44px 0}
}
@media(max-width:620px){
  .hero.stage{padding:34px 0 42px}
  .hero.stage:has(.hero-statement){padding-bottom:42px}
  .hero.stage .hero-grid{gap:30px}
  .statement{padding:48px 0}
}
@media(max-width:1000px){
  .hero.stage .hero-grid{gap:34px}
  .hero.stage:has(.hero-statement){padding-bottom:48px}
}

/* the stamp and the hero furniture were spending 80px on three words */
.hero .stamp,.hero.stage .stamp{padding:9px 15px;margin-bottom:18px;font-size:clamp(.74rem,1.2vw,.86rem)}
@media(max-width:620px){.hero .stamp,.hero.stage .stamp{font-size:.72rem;padding:8px 13px;margin-bottom:14px}}
.hero-actions{margin-top:24px}
.hero-note{margin-top:14px}
.btn.big{padding:15px 26px;font-size:.95rem}

/* the order numerals: a stamp, not a billboard */
.order-no{font-size:clamp(2rem,3.4vw,3rem);padding-bottom:7px}
.order-head{gap:18px;margin-bottom:4px}
@media(max-width:620px){.order-no{font-size:1.9rem}.order-head{gap:11px}}
.kicker{margin-bottom:12px}
h1,h2,h3{margin-bottom:.24em}
h2{line-height:1.08}
@media(max-width:620px){
  /* every display heading on a phone was breaking past four lines */
  h2{font-size:clamp(1.6rem,6.6vw,2rem);line-height:1.13}
  h3{font-size:1.24rem}
  .counter{font-size:clamp(1.35rem,5.4vw,1.7rem);margin-top:12px}
  .story-body p.ask,.ask{font-size:clamp(1.25rem,5vw,1.55rem);margin-top:20px;max-width:none}
  .q h3{font-size:1.28rem;line-height:1.18}
}

/* the story blocks */
.story-body{margin-top:18px}
.sources{margin-top:18px}
.sources li{padding:9px 0}
.story-body p.ask,.ask{margin-top:24px}
.split{margin-top:30px !important}
.split > div{padding:22px 24px}
.split h3{margin-bottom:12px}
.split li{padding:8px 0}
@media(max-width:760px){.split > div{padding:18px 16px}.split li{padding:7px 0}}

/* the follow-up sequence: eight rows at 18px of padding each */
.seq{margin-top:26px}
.seq-row{padding:12px 0}
.statcite{margin-top:22px;padding:18px 22px}
.statcite p + p{margin-top:9px}

/* what gets built */
.pieces{margin-top:28px}
.pieces li{padding:16px 18px 18px 0}
.pieces b{margin-bottom:4px}

/* the dashboard proof */
.proof{margin-top:24px;gap:22px}
.proof figcaption{margin-top:8px}

/* ---------- 4. PRICING, 22% OF THE PAGE ---------- */
.chain{padding:15px 22px;margin-bottom:26px}
.chain span{margin-top:7px}
.tiers{margin-top:24px;gap:13px}
.tier-top{padding:15px 17px 14px}
.tier-price{font-size:2rem;margin-top:2px}
.tier-line{font-size:.86rem;line-height:1.38;margin-top:7px}
.tier-body{padding:13px 17px 15px}
.tier-prev{padding-bottom:8px;margin-bottom:8px}
.tier-body li{padding:0 0 6px 15px;font-size:.875rem;line-height:1.36}
.tier-foot{padding:0 17px 14px;line-height:1.4}
.setupline{margin-top:16px;padding:12px 16px}
@media(max-width:620px){
  /* one column on a phone means four full-height cards. */
  .tiers{gap:11px}
  .tier-body li{padding-bottom:5px;font-size:.9rem;line-height:1.34}
  .tier-price{font-size:1.85rem}
}

/* the add-on menu: 103 words were taking 9% of the page as one stacked column. */
.addons{margin-top:34px}
.addon-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 44px;align-items:start}
.addon-grp{margin-top:18px}
.addon-grp h3{margin-bottom:7px}
.addon-grp li{padding:7px 0}
@media(max-width:700px){
  .addon-cols{grid-template-columns:1fr;gap:0}
  .addon-grp{margin-top:16px}
}

.ownblock{margin-top:30px;padding:22px 24px}
.ownblock h3{margin-bottom:9px}
.ownblock p{margin-bottom:.55em}
.ownblock .fine{margin-top:11px}

/* the platform band and the FAQ */
.az-facts{margin-top:24px}
.az-facts div{padding:14px 18px 0 0}
details{padding:15px 0}
details p{margin-top:10px}
.refs li{margin-bottom:14px}

/* the score tool */
.score-embed{margin-top:24px}
.q{padding:28px 24px}
.q .why{margin-bottom:18px}
.audit-head{padding:16px 24px}
.partbars{padding:18px 24px}
.opt{padding:12px 16px}
@media(max-width:620px){.q{padding:22px 18px}.audit-head{padding:14px 18px}}

/* ---------- 5. THE CTA GAP ---------- */
.cta-inline{
  margin:26px 0 0;font-family:"DM Sans",sans-serif;font-size:.98rem;
  display:flex;flex-wrap:wrap;gap:10px 28px;align-items:baseline;
}
.cta-inline a{
  color:var(--gold-ink);text-decoration:none;font-weight:600;
  display:inline-flex;align-items:baseline;gap:8px;
  border-bottom:1px solid rgba(201,167,94,.4);padding-bottom:2px;transition:.14s;
}
.cta-inline a:hover{color:var(--red);border-bottom-color:var(--red)}
.cta-inline a i{font-style:normal;transition:transform .14s}
.cta-inline a:hover i{transform:translateX(3px)}
.cta-inline a.alt{color:var(--soft);font-weight:500;border-bottom-color:rgba(201,167,94,.22)}
.cta-inline a.alt:hover{color:var(--gold-ink)}
.paper .cta-inline a,.paper-2 .cta-inline a{color:var(--red-deep)}
.paper .cta-inline a.alt,.paper-2 .cta-inline a.alt{color:var(--soft)}

.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px;align-items:center}
@media(max-width:620px){
  .cta-inline{margin-top:20px;font-size:.94rem;gap:9px 20px}
  .cta-row{margin-top:16px;gap:10px}
  .cta-row .btn{flex:1 1 auto;justify-content:center}
}

/* ---------- 6. */

section{padding:54px 0}
section.tight{padding:36px 0}
@media(max-width:760px){
  section{padding:38px 0}
  section.tight{padding:28px 0}
}

/* the dashboard proof: 36 words were spending 9% of the page, almost all of it in the phone render */
.proof{max-width:840px;grid-template-columns:1fr 208px;gap:20px;margin-top:20px}
@media(max-width:900px){
  .proof{grid-template-columns:1fr}
  .proof .phone img{max-width:208px;margin:0 auto}
}

/* the add-on rows: price and period on one line instead of two */
.addon-grp li{padding:6px 0;font-size:.93rem}
.addon-grp li span s{display:inline;margin-left:.35em;font-size:.82em}
.addon-grp li span{font-size:.86rem}
@media(max-width:620px){
  .addon-grp li{font-size:.9rem}
  .addon-grp li span{font-size:.84rem}
}

/* display scale: the section headings were set for a 1920 billboard and were pushing every section a line taller than it needed to be */
h2{font-size:clamp(1.85rem,3.4vw,2.7rem)}
.statement h2{font-size:clamp(2.1rem,5vw,3.8rem);line-height:1.06}
@media(max-width:620px){
  .statement h2{font-size:clamp(1.9rem,8.2vw,2.6rem);max-width:13ch}
  .statement p,.statement .dim{font-size:1rem}
}

/* the sequence rows, the split and the closing furniture */
.seq-row{padding:10px 0}
.seq{margin-top:22px}
.split li{padding:7px 0}
.pieces li{padding:14px 18px 16px 0}
.az-facts{margin-top:20px}
.az-facts div{padding:12px 18px 0 0}
.refs li{margin-bottom:12px}
details{padding:13px 0}

/* the score tool */
.q{padding:22px 22px}
.opt{padding:11px 15px}
.audit-head{padding:14px 22px}
.audit-foot{padding:12px 22px}

/* the footer was 376px desktop / 642px mobile of link list */
footer.site{padding:40px 0 22px}
.fbot{margin-top:28px;padding-top:16px}
footer li{margin-bottom:7px}
@media(max-width:620px){footer.site{padding:32px 0 20px}.fbot{margin-top:20px}}

/* ---------- 7. THIRD PASS ---------- */

section{padding:48px 0}
section.tight{padding:32px 0}
@media(max-width:760px){
  section{padding:32px 0}
  section.tight{padding:24px 0}
}

/* the two dashboard renders stacked on a phone were 750px of picture for 36 words. */
@media(max-width:900px){
  .proof{grid-template-columns:1fr 130px;gap:16px;align-items:end;justify-items:stretch}
  .proof .phone img{max-width:130px;margin:0}
}

/* the short bands — recent builds, references — were running the full section display scale for one line of copy */
.tight h2{font-size:clamp(1.6rem,2.5vw,2.05rem)}
.tight p{margin-top:18px !important}
#references{padding:34px 0 !important}
.refs{margin-top:16px}

/* the platform mark is a graphic, not a headline */
.az-mark{width:118px;height:118px}
@media(max-width:820px){.az-mark{width:86px;height:86px}}

/* the calendar card on a phone */
@media(max-width:620px){
  .cal{padding:16px}
  .slot{height:25px}
  .cal-top{margin-bottom:12px}
  .cal-foot{margin-top:12px}
}

/* the tier bullets are 28 rows on a phone; the row is the height */
@media(max-width:620px){
  .tier-top{padding:13px 15px 12px}
  .tier-body{padding:12px 15px 13px}
  .tier-body li{padding-bottom:4px;line-height:1.32}
  .tier-foot{padding:0 15px 12px}
}

/* ---------- 8. FOURTH PASS — desktop only ---------- */

@media(min-width:761px){
  section{padding:44px 0}
  section.tight{padding:30px 0}
  .statement{padding:56px 0}
  .platform{padding:48px 0}
  h2{font-size:clamp(1.85rem,3.05vw,2.5rem)}
  .kicker{margin-bottom:10px}
  .proof{grid-template-columns:1fr 176px;max-width:800px}
  /* a balanced flow, so the eight-row column stops setting the height of a menu whose other column has four */
  .addon-cols{display:block;column-count:2;column-gap:44px}
  .addon-grp{break-inside:avoid;margin-top:0;margin-bottom:20px}
  .addon-grp:first-child{margin-top:0}
  .addons{margin-top:30px}
  .addons h2{margin-bottom:.2em}
  .seq-row .what span{line-height:1.4}
  .ownblock{margin-top:26px}
}

/* ---------- 9. LAST 100px ON DESKTOP ---------- */
@media(min-width:761px){
  .hero.stage{padding:46px 0 50px}
  .hero.stage:has(.hero-statement){padding-bottom:50px}
  .chain{margin-bottom:20px}
  .tiers{margin-top:18px}
  .setupline{margin-top:12px}
  .split{margin-top:24px !important}
  .story-body{margin-top:14px}
  .statcite{margin-top:18px}
  .score-embed{margin-top:18px}
  .proof{margin-top:16px}
  .pieces{margin-top:22px}
  .statement{padding:48px 0}
}
@media(min-width:761px){#references{padding:28px 0 !important}}

/* the gap under a display line was set at .35em when the type was uppercase sans and never came down when it went serif; at 2.5rem that is 12px of nothing, twelve times down the page */
@media(min-width:761px){
  h1,h2,h3{margin-bottom:.18em}
  .counter{margin-top:14px}
  .hero-actions{margin-top:20px}
  .seq-row{padding:9px 0}
  .split li{padding:6px 0}
  .pieces li{padding:12px 18px 14px 0}
}

/* the last blocks running past 75 characters on a wide screen */
.ownblock p{max-width:560px}
.ownblock .fine{max-width:520px}
.setupline{max-width:700px}
@media(max-width:620px){.statcite{padding:14px 16px}}

/* ---------- 10. THE ANCHORS THE NEW CTAs USE ---------- */
section[id],div[id]{scroll-margin-top:86px}
@media(max-width:900px){section[id],div[id]{scroll-margin-top:74px}}

/* the ownership block was a full-width gold box with a half-width paragraph in it once the measure came down. */
.ownblock{max-width:640px}
.ownblock p,.ownblock .fine{max-width:none}
.ownblock .fine{font-size:.9rem;line-height:1.62}

/* ABOUT US — the founder column */
.bio-founder{grid-template-columns:260px 1fr;gap:52px;align-items:start}
@media(max-width:820px){.bio-founder{grid-template-columns:1fr;gap:30px}}

.markplate{
  background:var(--deep);border:1px solid rgba(201,167,94,.28);
  display:grid;place-items:center;padding:30px 26px;aspect-ratio:26/17;
}
.bio .markplate img{
  width:100%;max-width:150px;height:auto;display:block;
  filter:none;   /* .bio img greyscales photographs. The mark is not one. */
}
.nameplate{
  margin-top:16px;padding-top:14px;border-top:1px solid rgba(201,167,94,.28);
  font-family:"DM Sans",sans-serif;font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;line-height:1.9;
}
.nameplate b{display:block;font-weight:600;color:var(--black)}
@media(max-width:820px){
  .bio .markplate{max-width:300px}
  .bio .markplate img{max-width:150px}
}

/* About Us pull-quote contrast fix */
.statement,.platform{color:var(--soft)}

/* ---------- the team grid, now six cards ---------- */
.team{grid-template-columns:repeat(3,1fr)}
.team-card:nth-child(3n){border-right:0}
@media(max-width:900px){
  .team{grid-template-columns:repeat(2,1fr)}
  .team-card:nth-child(3n){border-right:1px solid var(--line)}
  .team-card:nth-child(2n){border-right:0}
}
@media(max-width:560px){
  .team{grid-template-columns:1fr}
  .team-card{border-right:0}
}

/* ---------- the work grid, four samples ---------- */
.work{grid-template-columns:repeat(2,1fr)}
.work .tile:nth-child(2n){border-right:0}
@media(max-width:760px){
  .work{grid-template-columns:1fr}
  .work .tile{border-right:0}
}

/* phone: the two hero CTAs stack, so make them one even column, not ragged */
@media(max-width:620px){
  .hero-actions{flex-direction:column;align-items:stretch;gap:10px}
  .hero-actions .btn{width:100%;text-align:center;justify-content:center}
  .hero-note{margin-top:16px}
}

/* Legal pages: privacy policy, terms. Long-form prose, no marketing furniture. */
.legal h2{font-size:1.18rem;margin:38px 0 10px;padding-top:20px;border-top:1px solid rgba(255,255,255,.10)}
.legal h2:first-child{border-top:0;padding-top:0;margin-top:0}
.legal p{max-width:62ch;margin:0 0 13px;line-height:1.72}
.legal ul{max-width:62ch;margin:0 0 16px;padding-left:22px}
.legal li{margin-bottom:7px;line-height:1.7}

/* A2P SMS consent checkbox. Must render as a real, unticked box the user
   actively selects, per carrier requirements. */
.consent{display:flex;gap:10px;align-items:flex-start;margin:6px 0 16px;cursor:pointer}
.consent input[type=checkbox]{margin-top:3px;width:17px;height:17px;flex:0 0 auto;accent-color:var(--gold,#C9A75E);cursor:pointer}
.consent span{font-size:.82rem;line-height:1.55;opacity:.72}
.consent a{text-decoration:underline}