/*
Theme Name: Quorumm
Theme URI: https://example.com/quorumm
Author: Quorumm
Author URI: https://example.com
Description: A single-page marketing theme for Quorumm — digital PR, brand mentions and search presence. Four numbered chapters, live canvas instruments (corroboration tally, format fan-out, page-one resolve, premium roll call) and a scroll-linked tally spine. Set a static front page to use the homepage layout.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: quorumm
Tags: one-column, custom-menu, custom-logo, editor-style, full-width-template, translation-ready
*/

/* ================================================================
   QUORUMM — Track A content + tally instruments, Track D weight class.
   Accent stays a SEMANTIC PAIR, never decoration:
     --claim  (oxide red)    = asserted, unverified, uncounted, refused
     --record (forest green) = corroborated, live, on the record
   ================================================================ */
:root{
  color-scheme: light;

  --paper:#F2F3EF;
  --paper-2:#E7E9E2;
  --card:#FAFBF7;
  --card-2:#F3F5EF;

  --ink:#131714;
  --ink-2:#5D6459;
  --ink-3:#8D9488;
  --dim:#A6AC9F;

  --rule:#D5D9CE;
  --rule-2:#E3E6DC;

  --record:#0E6B3D;
  --record-2:#0B5732;
  --record-soft:#DEEEE5;
  --record-line:#B4D6C3;
  --record-lift:#45BE7D;

  --claim:#C02F22;
  --claim-2:#96241A;
  --claim-soft:#F8E4E1;
  --claim-line:#EDB9B2;
  --claim-lift:#E8584A;

  --onink:#EDF0EA;
  --onink-2:#9AA396;
  --onink-3:#6E776B;
  --onink-rule:rgba(237,240,234,.13);

  --spine:0px;
  --pad:26px;
  --maxw:1320px;
}
@media(min-width:1140px){:root{--spine:74px}}
@media(max-width:640px){:root{--pad:18px}}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;padding-left:var(--spine);
  background:var(--paper);color:var(--ink);
  font-family:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--claim);outline-offset:3px}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.mono{font-family:'Spline Sans Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
.g{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2vw,28px)}
@media(max-width:900px){.g{grid-template-columns:1fr}.g>*{grid-column:1/-1!important}}

/* ---------- shared display type ---------- */
.kick{color:var(--ink-3);display:flex;align-items:center;gap:14px;margin-bottom:22px}
.kick::after{content:"";flex:1;height:1px;background:var(--rule)}
.dark .kick{color:var(--onink-3)}
.dark .kick::after{background:var(--onink-rule)}

.h2{font-size:clamp(30px,4.8vw,62px);font-weight:800;letter-spacing:-.044em;line-height:.99;max-width:17ch}
.h2 .c{color:var(--claim)}
.h2 .r{color:var(--record)}
.dark .h2 .c{color:var(--claim-lift)}
.dark .h2 .r{color:var(--record-lift)}

.lede{font-size:clamp(16px,1.6vw,19px);line-height:1.62;color:var(--ink-2);max-width:62ch;margin-top:22px}
.dark .lede{color:var(--onink-2)}

section[id],main[id]{scroll-margin-top:78px}
.pad{padding-block:clamp(58px,7.2vw,110px)}
.band{border-top:1px solid var(--rule)}
.dark{background:var(--ink);color:var(--onink);border-top-color:var(--ink)}

/* ---------- pills ---------- */
.pill{
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;
  font-family:'Spline Sans Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;font-weight:500;white-space:nowrap;
}
.pill::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.pill.good{color:var(--record);background:var(--record-soft)}
.pill.bad{color:var(--claim);background:var(--claim-soft)}
.pill.mut{color:var(--ink-3);background:var(--paper-2)}
.dark .pill.good{color:var(--record-lift);background:rgba(69,190,125,.14)}
.dark .pill.bad{color:var(--claim-lift);background:rgba(232,88,74,.15)}
.dark .pill.mut{color:var(--onink-2);background:rgba(237,240,234,.09)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 24px;border-radius:3px;font-size:14.5px;font-weight:700;letter-spacing:-.012em;
  text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:background .16s,border-color .16s,color .16s;
}
.btn .ar{transition:transform .18s}
.btn:hover .ar{transform:translateX(3px)}
.btn-solid{background:var(--record);color:#F3F8F4}
.btn-solid:hover{background:var(--record-2)}
.btn-ink{background:var(--ink);color:var(--onink)}
.btn-ink:hover{background:#232A24}
.btn-line{border-color:var(--rule);color:var(--ink);background:var(--card)}
.btn-line:hover{border-color:var(--ink)}
.dark .btn-line{border-color:var(--onink-rule);color:var(--onink);background:transparent}
.dark .btn-line:hover{border-color:var(--onink-2)}
.btn-sm{padding:9px 16px;font-size:13.5px}
.ctas{display:flex;flex-wrap:wrap;gap:11px;margin-top:32px}
@media(max-width:520px){.ctas{flex-direction:column;align-items:stretch}.ctas .btn{width:100%}}

/* ---------- THE SPINE — the tally is the scroll indicator ---------- */
.spine{
  position:fixed;left:0;top:0;bottom:0;width:var(--spine);z-index:70;
  border-right:1px solid var(--rule);background:var(--paper);
  display:none;flex-direction:column;align-items:center;padding:14px 0 16px;
}
@media(min-width:1140px){.spine{display:flex}}
.spine .cap{
  font-family:'Spline Sans Mono',monospace;font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);writing-mode:vertical-rl;
  transform:rotate(180deg);margin-bottom:12px;
}
.spine canvas{flex:1;width:100%;display:block}
.spine .cnt{
  font-family:'Spline Sans Mono',monospace;font-size:11px;font-weight:500;
  color:var(--record);font-variant-numeric:tabular-nums;margin-top:12px;letter-spacing:-.01em;
}

/* ---------- nav ---------- */
header.nav{position:sticky;top:0;z-index:60;background:rgba(242,243,239,.93);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--rule)}
.nav-in{display:flex;align-items:center;gap:26px;height:62px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand svg{display:block}
.brand .wm{font-weight:800;font-size:16.5px;letter-spacing:-.03em}
.nav-links{display:flex;gap:24px;margin-left:auto}
.nav-links a{text-decoration:none;color:var(--ink-2);font-size:13.5px;font-weight:500;transition:color .16s}
.nav-links a:hover{color:var(--record)}
@media(max-width:1020px){.nav-links{display:none}}

/* ---------- HERO ---------- */
.hero{padding-top:clamp(40px,5vw,72px);padding-bottom:clamp(44px,5.4vw,80px)}
.hero .lead{grid-column:1/8}
.hero .side{grid-column:8/13;align-self:center}
@media(max-width:1100px){
  .hero .lead{grid-column:1/13}
  .hero .side{grid-column:1/13;padding-top:30px}
}
.h1{font-size:clamp(42px,6.6vw,92px);line-height:.9;letter-spacing:-.05em;font-weight:800}
.h1 .l2{display:block}
.h1 .c{color:var(--claim)}
.h1 .r{color:var(--record)}
.hero .sub{font-size:clamp(16px,1.55vw,19px);line-height:1.58;color:var(--ink-2);max-width:50ch;margin-top:clamp(20px,2.2vw,28px)}
.hmeta{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:26px;color:var(--ink-3)}
.hmeta span{display:flex;align-items:center;gap:9px}
.hmeta span::before{content:"";width:10px;height:2px;border-radius:2px;background:var(--record);flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.22}}
.hero-canvas{display:block;width:100%;height:274px;max-width:100%}
@media(max-width:520px){.hero-canvas{height:232px}}

/* ---------- promises ---------- */
.promises{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--rule)}
.promise{padding:26px 24px 28px 0;border-right:1px solid var(--rule);font-size:14.4px;line-height:1.5;color:var(--ink-2)}
.promise+.promise{padding-left:24px}
.promise:last-child{border-right:0}
.promise b{display:block;color:var(--ink);font-weight:700;font-size:16.5px;letter-spacing:-.022em;line-height:1.2;margin-bottom:8px}
@media(max-width:880px){
  .promises{grid-template-columns:1fr 1fr}
  .promise{border-bottom:1px solid var(--rule);padding-left:24px}
  .promise:first-child,.promise:nth-child(3){padding-left:0}
  .promise:nth-child(2n){border-right:0}
  .promise:nth-last-child(-n+2){border-bottom:0}
}
@media(max-width:520px){
  .promises{grid-template-columns:1fr}
  .promise{border-right:0;padding-left:0!important;padding-right:0}
  .promise:last-child{border-bottom:0}
}

/* ---------- panels (drawn instruments) ---------- */
.panel{border:1px solid var(--rule);border-radius:9px;background:var(--card);overflow:hidden}
.pan-head{display:flex;align-items:center;gap:10px;padding:11px 15px;border-bottom:1px solid var(--rule-2);background:var(--card-2);color:var(--ink-3)}
.pan-head .st{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--record)}
.pan-head .st .dot{width:5px;height:5px;border-radius:50%;background:currentColor;animation:pulse 2.2s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.pan-head .st .dot{animation:none}}
.pan-foot{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule-2)}
.pan-cell{padding:13px 15px;border-right:1px solid var(--rule-2)}
.pan-cell:last-child{border-right:0}
.pan-cell .lbl{color:var(--ink-3);display:block;margin-bottom:6px}
.pan-cell .val{font-size:20px;font-weight:800;letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1}
.pan-cell .val.is-record{color:var(--record)}
.pan-cell .val.is-claim{color:var(--claim)}
.panel.dark-panel{background:var(--ink);border-color:var(--ink)}
.dark-panel .pan-head{background:#1A201B;border-bottom-color:var(--onink-rule);color:var(--onink-3)}
.dark-panel .pan-head .st{color:var(--record-lift)}
.dark-panel .pan-foot{border-top-color:var(--onink-rule)}
.dark-panel .pan-cell{border-right-color:var(--onink-rule)}
.dark-panel .pan-cell:last-child{border-right:0}
.dark-panel .pan-cell .lbl{color:var(--onink-3)}
.dark-panel .pan-cell .val{color:var(--onink)}
.dark-panel .pan-cell .val.is-record{color:var(--record-lift)}

.fan-canvas{display:block;width:100%;height:236px;max-width:100%}
@media(max-width:620px){.fan-canvas{height:280px}}

/* ---------- NUMBERED CHAPTERS — ghost numeral behind the opener ---------- */
.ch{position:relative;padding-block:clamp(58px,7vw,110px);overflow:hidden;border-top:1px solid var(--rule)}
.ch .ghost{
  position:absolute;left:calc(var(--pad) - .06em);top:clamp(22px,3.2vw,50px);
  font-size:clamp(150px,26vw,380px);font-weight:900;letter-spacing:-.06em;line-height:.78;
  color:var(--rule);z-index:0;pointer-events:none;user-select:none;
}
.ch .inner{position:relative;z-index:1}
.ch .chead{padding-top:clamp(52px,7.4vw,124px);max-width:66ch}
@media(max-width:700px){.ch .chead{padding-top:clamp(84px,22vw,150px)}}

/* dark chapters — the numeral steps up off the ink rather than down off paper */
.ch.dark{background:var(--ink);color:var(--onink);border-top-color:var(--ink)}
.ch.dark .ghost{color:#242C25}
.ch.dark + .band.dark{border-top-color:var(--onink-rule)}

/* ---------- 02 · the story ---------- */
.story-grid{margin-top:clamp(36px,4.4vw,58px);align-items:start}
.story-notes{grid-column:1/6}
.story-fig{grid-column:7/13}
@media(max-width:1000px){.story-notes{grid-column:1/13}.story-fig{grid-column:1/13;margin-top:30px}}
.snote{padding:20px 0;border-top:1px solid var(--rule-2)}
.snote:first-child{border-top:0;padding-top:0}
.snote h3{font-size:18px;font-weight:700;letter-spacing:-.024em;margin-bottom:8px;line-height:1.2}
.snote p{color:var(--ink-2);font-size:14.6px;line-height:1.56}
.doc{padding:20px}
.doc .dl{color:var(--ink-3);display:block;margin-bottom:12px}
.doc .hd{font-size:21px;font-weight:800;letter-spacing:-.03em;line-height:1.14;margin-bottom:14px}
.doc .ln{height:9px;border-radius:2px;background:var(--paper-2);margin-bottom:8px;width:0;transition:width .5s cubic-bezier(.22,1,.36,1)}
.doc .dq{border-left:2px solid var(--record);padding:3px 0 3px 14px;margin:15px 0;font-size:13.6px;color:var(--ink-2);line-height:1.5}
.stamp{
  display:inline-block;margin-top:10px;padding:6px 12px;border:1px solid var(--record);border-radius:3px;
  color:var(--record);font-family:'Spline Sans Mono',monospace;font-size:9.5px;letter-spacing:.15em;
  text-transform:uppercase;opacity:0;transform:translateY(4px);transition:opacity .4s ease,transform .4s ease;
}
.stamp.on{opacity:1;transform:none}
.pan-head .st.pending{color:var(--claim)}
@media(prefers-reduced-motion:reduce){.doc .ln,.stamp{transition:none}}

/* 02 on ink */
.dark .snote{border-top-color:var(--onink-rule)}
.dark .snote h3{color:var(--onink)}
.dark .snote p{color:var(--onink-2)}
.dark-panel .doc .dl{color:var(--onink-3)}
.dark-panel .doc .hd{color:var(--onink)}
.dark-panel .doc .ln{background:rgba(237,240,234,.13)}
.dark-panel .doc .dq{border-left-color:var(--record-lift);color:var(--onink-2)}
.dark-panel .stamp{border-color:var(--record-lift);color:var(--record-lift)}
.dark-panel .pan-head .st.pending{color:var(--claim-lift)}

/* ---------- anatomy rows ---------- */
.anat-lead{margin-top:clamp(40px,5vw,68px);font-size:clamp(20px,2.4vw,28px);font-weight:800;letter-spacing:-.032em}
.anat{margin-top:22px;border-top:1px solid var(--rule)}
.anat-row{display:grid;grid-template-columns:172px 1.05fr 1.25fr;gap:26px;padding:28px 0;border-bottom:1px solid var(--rule);align-items:start}
.anat-row .n{color:var(--claim);padding-top:6px;font-size:11px;letter-spacing:.18em}
.anat-row h3{font-size:clamp(21px,2.5vw,30px);font-weight:800;letter-spacing:-.034em;line-height:1.06}
.anat-row p{font-size:15px;line-height:1.58;color:var(--ink-2)}
.anat-row:last-child .n{color:var(--record)}
@media(max-width:880px){.anat-row{grid-template-columns:1fr;gap:11px}.anat-row .n{padding-top:0}}

/* ---------- THE SPLIT — full-bleed, hard seam ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule)}
@media(max-width:880px){.split{grid-template-columns:1fr}}
.half{padding:clamp(44px,5.4vw,84px) clamp(24px,4vw,64px)}
.half.dark{background:var(--ink);color:var(--onink)}
.half .hl{font-size:clamp(26px,3.3vw,44px);font-weight:800;letter-spacing:-.04em;line-height:1.02;margin:16px 0 6px}
.half .subhl{color:var(--ink-3);font-size:13.5px;margin-bottom:30px}
.half.dark .subhl{color:var(--onink-3)}
.half ul{list-style:none;padding:0;margin:0}
.half li{position:relative;padding:12px 0 12px 22px;border-top:1px solid var(--rule-2);font-size:14.6px;line-height:1.5;color:var(--ink-2)}
.half li::before{content:"";position:absolute;left:0;top:21px;width:10px;height:2px;background:var(--record);border-radius:2px}
.half li b{font-weight:700;color:var(--ink)}
.half.dark li{color:var(--onink-2);border-color:var(--onink-rule)}
.half.dark li::before{background:var(--claim-lift)}
.note{margin-top:20px;color:var(--ink-3);font-size:13.5px}
.half.dark .note{color:var(--dim)}
.count-note{
  font-size:clamp(24px,3.6vw,46px);font-weight:800;letter-spacing:-.042em;line-height:1.04;max-width:22ch;
}
.count-note .r{color:var(--record)}

/* ---------- 04 · PAGE ONE ---------- */
.po .copy{grid-column:1/6;padding-top:clamp(52px,7.4vw,124px)}
.po .fig{grid-column:6/13}
@media(max-width:1100px){.po .copy{grid-column:1/7}.po .fig{grid-column:7/13}}
@media(max-width:700px){.po .copy{padding-top:clamp(84px,22vw,150px)}}
.po p{color:var(--ink-2);font-size:15.5px;line-height:1.62;max-width:42ch;margin-top:16px}

/* ---------- SERP ---------- */
.serp-rows{padding:4px 0}
.serp-row{display:grid;grid-template-columns:22px 1fr;gap:12px;padding:11px 15px;border-bottom:1px solid var(--rule-2);align-items:start}
.serp-row:last-child{border-bottom:0}
.serp-row .rk{font-family:'Spline Sans Mono',monospace;font-size:10px;color:var(--dim);font-variant-numeric:tabular-nums;padding-top:2px;transition:color .45s ease}
.serp-bar{height:8px;border-radius:2px;background:var(--paper-2)}
.serp-url{height:6px;margin-top:6px;border-radius:2px;background:var(--rule-2)}
.serp-bar,.serp-url{transition:width .5s cubic-bezier(.22,1,.36,1),background-color .45s ease}
.serp-row .tag{
  display:block;margin-top:7px;font-family:'Spline Sans Mono',monospace;font-size:8.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--record);opacity:0;transition:opacity .45s ease;
}
.serp-row.lit .tag{opacity:1}
.serp-row.hit.lit .rk{color:var(--record)}
.serp-row.hit.lit .serp-bar{background:var(--record)}
.serp-row.hit.lit .serp-url{background:var(--record-line)}
@media(prefers-reduced-motion:reduce){.serp-bar,.serp-url,.serp-row .tag,.serp-row .rk{transition:none}}

/* 04 on ink */
.dark-panel .serp-row{border-bottom-color:var(--onink-rule)}
.dark-panel .serp-row:last-child{border-bottom:0}
.dark-panel .serp-row .rk{color:var(--onink-3)}
.dark-panel .serp-bar{background:rgba(237,240,234,.13)}
.dark-panel .serp-url{background:rgba(237,240,234,.08)}
.dark-panel .serp-row .tag{color:var(--record-lift)}
.dark-panel .serp-row.hit.lit .rk{color:var(--record-lift)}
.dark-panel .serp-row.hit.lit .serp-bar{background:var(--record-lift)}
.dark-panel .serp-row.hit.lit .serp-url{background:rgba(69,190,125,.32)}
.ch.dark.po p{color:var(--onink-2)}

/* ---------- trio + pull ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(36px,4.4vw,56px);border-top:1px solid var(--onink-rule)}
.tcol{padding:28px 26px 0 0;border-right:1px solid var(--onink-rule)}
.tcol+.tcol{padding-left:26px}
.tcol:last-child{border-right:0}
.tcol h3{font-size:clamp(19px,2.1vw,25px);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:16px 0 10px;color:var(--onink)}
.tcol p{font-size:14.6px;line-height:1.55;color:var(--onink-2)}
@media(max-width:880px){
  .trio{grid-template-columns:1fr}
  .tcol{border-right:0;border-bottom:1px solid var(--onink-rule);padding:24px 0}
  .tcol+.tcol{padding-left:0}
  .tcol:last-child{border-bottom:0}
}
.pull{
  margin-top:clamp(40px,5vw,64px);padding-top:34px;border-top:1px solid var(--onink-rule);
  font-size:clamp(24px,3.6vw,46px);font-weight:800;letter-spacing:-.04em;line-height:1.06;max-width:22ch;
}
.pull .r{color:var(--record-lift)}

/* ---------- pricing ---------- */
.mode{display:inline-flex;border:1px solid var(--rule);border-radius:4px;overflow:hidden;margin-top:28px;background:var(--card)}
.mode button{
  appearance:none;border:0;background:transparent;cursor:pointer;
  font-family:'Spline Sans Mono',monospace;font-size:10.5px;letter-spacing:.15em;
  text-transform:uppercase;font-weight:500;color:var(--ink-3);padding:12px 22px;transition:all .18s;
}
.mode button+button{border-left:1px solid var(--rule)}
.mode button[aria-pressed="true"]{background:var(--ink);color:var(--onink)}
.mode button:hover[aria-pressed="false"]{color:var(--ink)}
.mnote{margin-top:12px;color:var(--ink-3);font-size:13.5px;max-width:60ch}
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:32px}
@media(max-width:1040px){.tiers{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.tiers{grid-template-columns:1fr}}
.tier{border:1px solid var(--rule);border-radius:10px;padding:22px 20px;background:var(--card);display:flex;flex-direction:column}
.tier.feat{background:var(--ink);border-color:var(--ink);color:var(--onink)}
.tname{font-size:24px;font-weight:800;letter-spacing:-.036em;margin:14px 0 14px}
.amt{font-size:38px;font-weight:800;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.per{font-size:12.5px;color:var(--ink-3);margin-top:7px}
.tot{font-size:13.5px;color:var(--ink-2);margin-top:8px;font-variant-numeric:tabular-nums}
.tot b{font-weight:700;color:var(--ink)}
.tfor{color:var(--ink-3);font-size:13.5px;line-height:1.46;margin:17px 0;min-height:3.2em}
.tier ul{list-style:none;padding:0;margin:0 0 18px;flex:1}
.tier li{position:relative;padding:9px 0 9px 18px;border-top:1px solid var(--rule-2);font-size:13.4px;line-height:1.46;color:var(--ink-2)}
.tier li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:2px;background:var(--record);border-radius:2px}
.tier li b{font-weight:700;color:var(--ink)}
.tier.feat .tname,.tier.feat .amt,.tier.feat .tot b,.tier.feat li b{color:var(--onink)}
.tier.feat .per,.tier.feat .tot,.tier.feat .tfor,.tier.feat li{color:var(--onink-2)}
.tier.feat li{border-color:var(--onink-rule)}
.tier.feat li::before{background:var(--record-lift)}
.tier .btn{width:100%}
.pr-p,.li-p{display:none}
.tiers[data-mode="premium"] .pr-s{display:none}
.tiers[data-mode="premium"] .pr-p{display:block}
.tiers[data-mode="premium"] .li-p{display:list-item}
.terms{display:flex;flex-wrap:wrap;gap:10px 30px;margin-top:26px;color:var(--ink-2);font-size:14px}
.terms span{display:flex;align-items:center;gap:9px}
.terms span::before{content:"";width:10px;height:2px;background:var(--record);border-radius:2px;flex-shrink:0}

/* ---------- premium roll call ---------- */
.prem{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,60px);align-items:center;margin-top:clamp(56px,7vw,96px)}
@media(max-width:1000px){.prem{grid-template-columns:1fr;gap:36px}}
.roll-row{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:12px 15px;border-bottom:1px solid var(--onink-rule)}
.roll-row:last-child{border-bottom:0}
.roll-name{font-size:14.8px;font-weight:600;letter-spacing:-.015em;color:var(--onink)}
.roll-state{
  display:inline-flex;align-items:center;gap:7px;font-family:'Spline Sans Mono',monospace;
  font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--claim-lift);transition:color .16s ease;
}
.roll-state::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.roll-row.placed .roll-state{color:var(--record-lift)}

/* ---------- limits ---------- */
.limgrid{columns:2;column-gap:clamp(28px,4vw,56px);margin-top:clamp(30px,3.6vw,50px)}
@media(max-width:860px){.limgrid{columns:1}}
.lim{break-inside:avoid;padding:20px 0;border-top:1px solid var(--rule-2)}
.lim h3{font-size:17.5px;font-weight:700;letter-spacing:-.022em;margin-bottom:8px;line-height:1.22}
.lim p{color:var(--ink-2);font-size:14.5px;line-height:1.56}

/* ---------- the question ---------- */
.qa{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(26px,4vw,56px);align-items:start}
@media(max-width:1000px){.qa{grid-template-columns:1fr}}
.qa h2{font-size:clamp(32px,5.2vw,68px);font-weight:800;letter-spacing:-.048em;line-height:.98;max-width:12ch}
.qa h2 .c{color:var(--claim-lift)}
.qa p{font-size:16px;line-height:1.68;color:var(--onink-2);margin-bottom:20px;max-width:62ch}
.qa p:last-child{margin-bottom:0}
.qa strong{color:var(--onink);font-weight:700}
.qa code{font-family:'Spline Sans Mono',monospace;font-size:.86em;color:var(--record-lift)}
.flag{
  border-left:3px solid var(--claim-lift);padding:5px 0 5px 20px;color:var(--onink)!important;
  font-weight:700;font-size:clamp(18px,2.2vw,24px)!important;line-height:1.3!important;letter-spacing:-.024em;
}

/* ---------- close ---------- */
.close{padding-block:clamp(66px,8.4vw,132px);border-top:1px solid var(--rule)}
.close .lhs{grid-column:1/7}
.close .rhs{grid-column:7/13;align-self:center}
@media(max-width:1000px){.close .lhs,.close .rhs{grid-column:1/13}}
.close h2{font-size:clamp(50px,10.5vw,152px);font-weight:900;letter-spacing:-.058em;line-height:.86}
.close h2 .r{color:var(--record)}
.close p{font-size:clamp(16px,1.6vw,19px);color:var(--ink-2);max-width:44ch;margin-top:clamp(22px,2.6vw,34px);line-height:1.58}
.close-canvas{display:block;width:100%;height:230px}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);padding-block:42px 34px}
.ft{display:flex;flex-wrap:wrap;gap:26px;justify-content:space-between;align-items:flex-start}
.fl{display:flex;flex-wrap:wrap;gap:10px 30px}
.fl a{text-decoration:none;color:var(--ink-2);font-size:14px;transition:color .16s}
.fl a:hover{color:var(--record)}
.fine{margin-top:34px;padding-top:18px;border-top:1px solid var(--rule-2);display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:baseline;color:var(--ink-3);font-size:12.5px;line-height:1.5}
.fine p{max-width:64ch}

/* ================================================================
   WORDPRESS CHROME
   The admin bar is fixed at the top of the viewport for logged-in
   users, so the sticky nav and the fixed spine have to sit below it.
   ================================================================ */
.admin-bar header.nav{top:32px}
.admin-bar .spine{top:32px}
.admin-bar section[id],.admin-bar main[id]{scroll-margin-top:110px}
@media screen and (max-width:782px){
  .admin-bar header.nav{top:46px}
  .admin-bar .spine{top:46px}
}
@media screen and (max-width:600px){
  .admin-bar header.nav{top:0}
  .admin-bar .spine{top:0}
}

/* skip link */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--ink);color:var(--onink);padding:12px 18px;border-radius:0 0 3px 0;
  font-size:14px;font-weight:700;text-decoration:none;
}
.skip-link:focus{left:0}

/* ---------- posts, pages, archives, 404 ---------- */
.entry{padding-block:clamp(52px,6.4vw,96px)}
.entry-head{max-width:24ch;margin-bottom:clamp(26px,3.2vw,44px)}
.entry-title{font-size:clamp(32px,5vw,64px);font-weight:800;letter-spacing:-.044em;line-height:1}
.entry-meta{color:var(--ink-3);margin-top:16px}
.entry-content{max-width:68ch;font-size:16.5px;line-height:1.68;color:var(--ink-2)}
.entry-content > * + *{margin-top:20px}
.entry-content h2{font-size:clamp(24px,3vw,34px);font-weight:800;letter-spacing:-.034em;line-height:1.1;color:var(--ink);margin-top:44px}
.entry-content h3{font-size:clamp(19px,2.2vw,24px);font-weight:700;letter-spacing:-.026em;color:var(--ink);margin-top:34px}
.entry-content a{color:var(--record);text-underline-offset:3px}
.entry-content strong,.entry-content b{color:var(--ink);font-weight:700}
.entry-content blockquote{border-left:3px solid var(--claim);padding:4px 0 4px 20px;margin-left:0;font-size:19px;color:var(--ink);font-weight:600;letter-spacing:-.018em}
.entry-content code,.entry-content pre{font-family:'Spline Sans Mono',ui-monospace,monospace;font-size:.9em}
.entry-content pre{background:var(--card);border:1px solid var(--rule);border-radius:8px;padding:18px;overflow:auto;line-height:1.5}
.entry-content img,.entry-content iframe{max-width:100%;height:auto;border-radius:8px}
.entry-content ul,.entry-content ol{padding-left:20px}
.entry-content li+li{margin-top:9px}
.entry-content table{width:100%;border-collapse:collapse;font-size:14.5px}
.entry-content th,.entry-content td{border-bottom:1px solid var(--rule-2);padding:10px 12px;text-align:left}
.post-list{border-top:1px solid var(--rule);margin-top:clamp(28px,3.4vw,44px)}
.post-row{display:grid;grid-template-columns:172px 1fr;gap:26px;padding:26px 0;border-bottom:1px solid var(--rule);align-items:start}
.post-row .n{color:var(--ink-3);padding-top:6px}
.post-row h2{font-size:clamp(21px,2.4vw,28px);font-weight:800;letter-spacing:-.032em;line-height:1.08}
.post-row h2 a{text-decoration:none}
.post-row h2 a:hover{color:var(--record)}
.post-row p{color:var(--ink-2);font-size:15px;line-height:1.56;margin-top:9px;max-width:62ch}
@media(max-width:820px){.post-row{grid-template-columns:1fr;gap:10px}.post-row .n{padding-top:0}}
.pager{display:flex;gap:11px;flex-wrap:wrap;margin-top:34px}
.pager a,.pager span{padding:9px 15px;border:1px solid var(--rule);border-radius:3px;text-decoration:none;font-size:14px;font-weight:600;background:var(--card)}
.pager .current{background:var(--ink);color:var(--onink);border-color:var(--ink)}

/* let the editor drop in wide/full blocks without breaking the grid */
.entry-content .alignwide{max-width:min(1040px,92vw)}
.entry-content .alignfull{max-width:none;width:100vw;margin-left:calc(50% - 50vw - (var(--spine) / 2))}
.entry-content .aligncenter{margin-inline:auto;display:block}

/* menus rendered as lists by wp_nav_menu */
.nav-in > nav{margin-left:auto}
ul.nav-links,ul.fl{list-style:none;padding:0;margin:0}
ul.nav-links{margin-left:0}
ul.fl li{margin:0}
.nav-links li{display:block}
.ft-tagline{font-size:14px;color:var(--ink-2);max-width:32ch;margin-top:12px;line-height:1.5}

/* custom logo, when one is uploaded in Appearance > Customize */
.custom-logo-link{display:inline-flex;align-items:center;text-decoration:none}
.custom-logo{display:block;height:auto;max-height:40px;width:auto}
footer .custom-logo{max-height:32px}
