/* CG157 · The Culture Group, compressed. Additions only: published CSS files stay as they are.
   One rhythm on every page: blue opens, paper carries, blue closes. Sections share one background
   and one spacing, so a page reads as one piece. */

/* ---------- 0 · rhythm ---------- */
:root{--cg-sec:clamp(64px,7vw,104px);--cg-gap:clamp(28px,3.4vw,48px)}
main .px-sec.cg-sec{padding-top:var(--cg-sec);padding-bottom:var(--cg-sec);background:var(--paper,var(--px-paper))}
main .px-sec.cg-sec+.px-sec.cg-sec{padding-top:0}
main .px-sec.cg-sec+.px-sec.cg-sec>.px-wrap{border-top:1px solid var(--px-line);padding-top:var(--cg-sec)}
.cg-more{display:flex;flex-wrap:wrap;gap:10px 28px;margin:28px 0 0}
.cg-sec h2{font:400 clamp(36px,3.9vw,56px)/1.04 var(--px-serif);letter-spacing:-.025em;color:var(--px-ink);margin:0 0 18px;text-wrap:balance}
.cg-sec .tg-num{margin-bottom:22px}

/* ---------- 1 · home: the hero and the receipts are one blue piece ---------- */
.cg-home .tg-sky.cg-sky{min-height:min(84svh,760px);padding-bottom:24px}
.cg-home .tg-proof.cg-proof{padding-bottom:clamp(56px,6vw,88px)}
.cg-home .cg-proof .tg-proof-p{margin-bottom:28px}

/* the letter: the headline and the podcast on the left, the letter on the right */
.cg-lgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cg-gap) clamp(40px,5.5vw,88px);align-items:start}
.cg-llead{position:sticky;top:110px;display:flex;flex-direction:column}
.cg-llead .tg-big{font-size:clamp(34px,3.6vw,52px);line-height:1.06;margin:0 0 32px}
.cg-letter .tg-listen{margin:0;grid-template-columns:84px minmax(0,1fr);grid-template-areas:"art tx" "f f" "two two";gap:14px 20px;padding:20px}
.cg-letter .tg-listen .tg-ep-art img{width:84px;height:84px}
.cg-letter .tg-lcard .tg-lmore{display:flex;flex-wrap:wrap;gap:10px 24px}

/* what we buy, and the five questions beside it */
.cg-bgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cg-gap) clamp(40px,5.5vw,88px);align-items:start}
.cg-blead .px-sub{margin:0 0 26px;max-width:44ch}
.cg-crit{margin:0;border-top:1px solid var(--px-line)}
.cg-crit>div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--px-line)}
.cg-crit dt{font:500 12px/1.7 var(--px-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--px-blue)}
.cg-crit dd{margin:0;font:400 15.5px/1.55 var(--px-sans);color:var(--px-char)}
.cg-bfit .tg-fit.cg-fit{margin:0}

/* Do we fit? one question at a time */
.js .cg-step .tg-qw{display:none}
.js .cg-step .tg-qw.cg-open{display:block}
.js .cg-step .tg-qw.cg-open.cg-swap{animation:cg-in .32s var(--ease-out,ease)}
.js .cg-step .tg-qw.cg-open .tg-q{border:0;padding:0;margin:0}
.js .cg-step .tg-fit-qs{min-height:0}
.cg-qnav{display:flex;align-items:center;gap:12px;margin-top:22px;padding-left:0}
.cg-qk{font:500 11px/1 var(--px-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--px-mute);margin-right:auto}
.cg-qnav button{font:500 14px/1 var(--px-sans);border-radius:999px;padding:11px 18px;cursor:pointer;border:1px solid var(--px-line2);background:transparent;color:var(--px-ink);transition:background .2s,border-color .2s,color .2s,opacity .2s}
.cg-qnav .cg-qnext{background:var(--px-blue);border-color:var(--px-blue);color:#fff}
.cg-qnav .cg-qnext:disabled{opacity:.38;cursor:default}
.cg-qnav button:not(:disabled):hover{border-color:var(--px-ink)}
.cg-qnav .cg-qnext:not(:disabled):hover{background:var(--px-blue-ink);border-color:var(--px-blue-ink)}
.cg-qnav button:focus-visible{outline:2px solid var(--px-blue);outline-offset:3px}
.js .cg-step.cg-all .tg-fit-qs .tg-fit-prog{margin-bottom:0}
.cg-step .tg-fit-board li[data-q]{cursor:pointer}
.js .cg-step:not(.cg-all) .tg-fv{display:none}
@keyframes cg-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.js .cg-step .tg-qw.cg-open.cg-swap,.js .cg-tabs-on .cg-panel.cg-swap{animation:none}}

/* Ask the firm: the words on the left, the panel on the right */
.cg-agrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cg-gap) clamp(40px,5.5vw,88px);align-items:start}
.cg-alead .px-sub{margin:0;max-width:42ch}
.cg-ask .tg-askwrap{margin:0}

@media (width<=980px){
  .cg-lgrid,.cg-bgrid,.cg-agrid{grid-template-columns:minmax(0,1fr)}
  .cg-llead{position:static}
}

/* ---------- 1b · home, tightened ---------- */
:root{--cg-sec:clamp(56px,6vw,88px)}
.cg-home .tg-sky.cg-sky{min-height:min(78svh,700px)}

/* the fit card: one column, the question on top, where you stand underneath */
.cg-fit .tg-fit-head{display:block;padding:clamp(22px,2.6vw,32px) clamp(22px,2.6vw,32px) 0}
.cg-fit .tg-fit-head .tg-h3{font:400 clamp(26px,2.4vw,32px)/1.1 var(--px-serif);letter-spacing:-.02em;margin:0 0 6px!important}
.cg-fit .tg-fit-sub{margin:0;font:400 15px/1.5 var(--px-sans);color:var(--px-char)}
.tg-sky-home .cg-fit .tg-fit-grid{grid-template-columns:minmax(0,1fr)}
.cg-fit .tg-fit-qs{padding:20px clamp(22px,2.6vw,32px) clamp(22px,2.6vw,28px)!important}
.cg-fit .tg-fit-card{padding:clamp(20px,2.4vw,26px) clamp(22px,2.6vw,32px)!important}
.cg-fit .tg-fit-top{display:none}
.cg-fit .tg-fit-board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0}
.cg-fit .tg-fit-board li{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:0;padding:12px 0 0;border-top:2px solid #ffffff33}
.cg-fit .tg-fit-board li.is-yes,.cg-fit .tg-fit-board li.is-no,.cg-fit .tg-fit-board li.is-open{border-top-color:#fff}
.cg-fit .tg-fit-board .tg-fb-v{font-size:13px;line-height:1.3}
.cg-fit .tg-fit-board i{order:-1;width:18px;height:18px}
.cg-fit .tg-fit-foot{margin-top:14px}
.cg-fit .tg-fv{margin-top:18px}
.js .cg-step .tg-fit-board li[data-q]:not(.is-yes):not(.is-no):not(.is-open) .tg-fb-v{opacity:.55}

/* Ask: the panel no taller than it needs to be */
.cg-ask #px-askpage{min-height:0}
.cg-ask .px-askp.inline{height:clamp(420px,52vh,500px)}

/* the close: tighter, and the footer stops repeating it */
.cg-home .tg-close,.tg-pg .tg-close{padding:clamp(56px,6.5vw,92px) 0 clamp(56px,6vw,84px)}
.tg-close .tg-coins2{margin-bottom:24px;gap:10px}
.tg-close .tg-coins2 .tg-coin.lg{width:96px;height:96px}
.tg-close .tg-coins2 .tg-coin.md,.tg-close .tg-coins2 .tg-coin.seat{width:84px;height:84px}
.tg-close h2{font-size:clamp(36px,4.6vw,64px)}
.tg-close-more{margin-top:24px}
body:has(main .tg-close) .tg-ft-sell{display:none}
body:has(main .tg-close) .tg-ft-top{grid-template-columns:minmax(0,1fr)}

@media (width<=820px){
  /* the receipts: two across, not five rows */
  .cg-home .cg-proof .tg-glass{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
  .cg-home .cg-proof .tg-glass>div{display:block!important;padding:16px 0!important}
  .cg-home .cg-proof .tg-glass>.lead{grid-column:1/-1}
  .cg-home .cg-proof .tg-glass dd{margin-top:6px!important;font-size:13.5px!important}
  .cg-home .cg-proof .tg-glass dt,.cg-home .cg-proof .tg-glass>.lead dt{font-size:32px!important}
  .cg-fit .tg-fit-board{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
  .cg-fit .tg-fit-board .tg-fb-k{font-size:9.5px;letter-spacing:.04em}
  .cg-fit .tg-fit-board .tg-fb-v{display:none}
}

/* one counter, not three */
.js .cg-step .tg-fit-prog .tg-fit-pk,.js .cg-step .tg-fit-prog .tg-fit-pn{display:none}
.js .cg-step .tg-fit-prog{margin:0 0 22px}
.js .cg-step:not(.cg-all) .tg-fit-n{display:none}
.cg-qnav .cg-qnext{margin-left:auto}
.cg-proof .tg-glass>div:last-child{grid-column:auto!important}
@media (width<=820px){
  .cg-fit .tg-fit-board .tg-fb-v{display:none!important}
  .cg-fit .tg-fit-board .tg-fb-k{font-size:9px!important;letter-spacing:.02em!important}
  .cg-lgrid .cg-llead{display:contents}
  .cg-lgrid .tg-listen{order:3}
  .cg-lgrid{gap:28px}
  .cg-lgrid .tg-num{margin-bottom:-6px}
}

/* ---------- 1c · letter wider, close shorter, footer in one row ---------- */
@media (width>980px){.cg-lgrid{grid-template-columns:minmax(0,4fr) minmax(0,7fr)}}
.cg-letter .tg-lcard{padding:clamp(26px,3vw,40px) clamp(26px,3.2vw,44px)}
.cg-home .tg-close,.tg-pg .tg-close{padding-bottom:clamp(56px,6vw,84px)!important}
.tg-close h2{max-width:22ch}
body:has(main .tg-close) .tg-ft-top>div:first-child{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;column-gap:32px}
body:has(main .tg-close) .tg-ft-top>div:first-child>.px-brand{grid-column:1}
body:has(main .tg-close) .tg-ft-top>div:first-child>.px-motto{grid-column:1;margin-bottom:0}
body:has(main .tg-close) .tg-ft-top>div:first-child>.px-follow{grid-column:2;grid-row:1/span 2;margin:0}
body:has(main .tg-close) .tg-ft-top{padding-bottom:clamp(28px,3.4vw,40px)}
body:has(main .tg-close) .tg-ft-grid{padding-top:clamp(28px,3.4vw,40px)}
@media (width<=640px){
  body:has(main .tg-close) .tg-ft-top>div:first-child{grid-template-columns:minmax(0,1fr)}
  body:has(main .tg-close) .tg-ft-top>div:first-child>.px-follow{grid-column:1;grid-row:auto;margin-top:18px}
}

/* ---------- 1d · one notch tighter ---------- */
:root{--cg-sec:clamp(52px,5.2vw,76px)}
.cg-home .tg-sky.cg-sky{min-height:min(74svh,650px)}
.cg-home .tg-proof.cg-proof{padding-bottom:clamp(48px,5vw,72px)}
.cg-letter .tg-lcard .tg-lp{font-size:18px;line-height:1.62}
.cg-letter .tg-lcard .tg-salute{font-size:22px}
.cg-home .tg-close,.tg-pg .tg-close{padding-top:clamp(52px,5.6vw,80px)}
.tg-close .tg-coins2 .tg-coin.lg{width:88px;height:88px}
.tg-close .tg-coins2 .tg-coin.md,.tg-close .tg-coins2 .tg-coin.seat{width:76px;height:76px}
.cg-letter .tg-lcard .tg-lmore{gap:0 22px}
.cg-alead h2{margin-bottom:0}
@media (width<=820px){
  .cg-ask .px-askp.inline{height:540px}
  .cg-letter .tg-lcard .tg-lp{font-size:17px;line-height:1.6}
  .cg-letter .tg-listen{grid-template-columns:64px minmax(0,1fr);padding:18px;gap:12px 16px}
  .cg-letter .tg-listen .tg-ep-art img{width:64px;height:64px}
  .tg-close .tg-coins2{flex-wrap:nowrap;gap:8px}
  .tg-close .tg-coins2 .tg-coin.lg,.tg-close .tg-coins2 .tg-coin.md,.tg-close .tg-coins2 .tg-coin.seat{width:62px;height:62px}
  .tg-close .tg-coins2 .tg-coin.seat small{font-size:8.5px}
}
@media (width<=820px){.cg-home .tg-sky.cg-sky{padding-top:330px;min-height:0}}

/* the hero and the receipts: one blue field, no seam between them */
.cg-sky.tg-blue{background:radial-gradient(110% 80% at 12% -10%,#5b95ff 0%,#1559f500 58%),radial-gradient(70% 55% at 50% 48%,#6aa0ff2b 0%,#6aa0ff00 70%),linear-gradient(180deg,#1d63ff 0%,#1559f5 100%)}
.cg-proof.tg-blue{background:radial-gradient(90% 100% at 88% 125%,#072f9c 0%,#1559f500 62%),linear-gradient(180deg,#1559f5 0%,#0f4bdc 100%)}
.cg-proof.tg-blue:after,.cg-proof>.tg-bl{display:none}
.cg-sky>.tg-bl{-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}
.cg-sky .tg-sky-in{z-index:5}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .cg-sky.tg-blue{background:radial-gradient(120% 90% at 18% 0%,#2a63d8 0%,#0f3f9e00 55%),linear-gradient(180deg,#1348b4 0%,#0f3f9e 100%)}
  :root:not([data-theme="light"]) .cg-proof.tg-blue{background:radial-gradient(90% 100% at 85% 120%,#061f5c 0%,#0f3f9e00 60%),linear-gradient(180deg,#0f3f9e 0%,#0b2f78 100%)}
}

/* ---------- 2 · How we invest ---------- */
svg.tg-map{border-radius:0;padding:0;background:none;box-shadow:none}
body.tg-pg main .px-sec.cg-sec{padding-top:var(--cg-sec);padding-bottom:var(--cg-sec)}
body.tg-pg main .px-sec.cg-sec+.px-sec.cg-sec{padding-top:0}
.cg-sec .px-sechead{margin-bottom:clamp(28px,3vw,40px);align-items:end}
.cg-sec .px-sechead .px-sub{margin:0}
.cg-sec .px-sechead h2{margin-bottom:0}

/* tabs: one row of pills, the count beside each name */
.cg-tablist{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 clamp(24px,2.6vw,32px)}
.cg-tablist[hidden]{display:none}
.cg-tablist [role=tab]{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--px-line2);background:var(--px-card);color:var(--px-ink);font:500 15px/1 var(--px-sans);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.cg-tablist [role=tab] span{font:500 12px/1 var(--px-mono);color:var(--px-mute);padding:4px 7px;border-radius:999px;background:var(--px-paper2)}
.cg-tablist [role=tab]:hover{border-color:var(--px-ink)}
.cg-tablist [role=tab][aria-selected=true]{background:var(--px-ink);border-color:var(--px-ink);color:var(--px-paper)}
.cg-tablist [role=tab][aria-selected=true] span{background:#ffffff26;color:var(--px-paper)}
.cg-tablist [role=tab]:focus-visible,.cg-panel:focus-visible{outline:2px solid var(--px-blue);outline-offset:3px}
.cg-panel{border-radius:4px}
.js .cg-tabs-on .cg-panel[hidden]{display:none}
.cg-panel+.cg-panel{margin-top:40px}
.js .cg-tabs-on .cg-panel+.cg-panel{margin-top:0}
.js .cg-tabs-on .cg-panel.cg-swap{animation:cg-in .32s var(--ease-out,ease)}
.cg-ph{font:400 clamp(24px,2.2vw,30px)/1.15 var(--px-serif);letter-spacing:-.015em;color:var(--px-ink);margin:0 0 20px}
.cg-psub{margin:-8px 0 20px!important;max-width:60ch}

/* the rules */
.cg-rhead{display:flex;flex-direction:column}
.cg-rules .tg-rules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(20px,2.4vw,32px);margin:0;padding:0}
.cg-rules .tg-rules>li{padding:20px 0 22px;border-top:1px solid var(--px-line);margin:0}
.cg-rules .tg-rules h3{font:400 20px/1.22 var(--px-serif);letter-spacing:-.01em;margin:0 0 10px}
.cg-rules .tg-rules p{font:400 15px/1.55 var(--px-sans);color:var(--px-char);margin:0}
.cg-rules .tg-nevers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,3vw,48px);margin:0;padding:0;counter-reset:nv}
.cg-rules .tg-nevers>li{border-top:1px solid var(--px-line);padding:16px 0;margin:0;font:400 19px/1.35 var(--px-serif);color:var(--px-ink)}

/* what we buy */
.cg-pbuy .tg-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}
.cg-pbuy .tg-calc{margin-top:16px}
.cg-fitgo{margin-top:24px}

/* after we buy */
.cg-days{margin:0 0 clamp(32px,3.4vw,48px)}
.cg-days .tg-h3,.cg-after .tg-clocks .tg-h3{margin-bottom:6px}
.cg-after .tg-clocks{margin:0}
.cg-after2{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cg-gap) clamp(40px,5vw,72px);margin-top:clamp(32px,3.4vw,48px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--px-line);align-items:start}
.cg-after2 .tg-rec{margin:0;padding:0;border:0}
.cg-hs ul{list-style:none;margin:12px 0 0;padding:0}
.cg-hs li{font:400 15.5px/1.5 var(--px-sans);color:var(--px-char);padding:10px 0 10px 22px;border-top:1px solid var(--px-line);position:relative}
.cg-hs li:before{content:"";position:absolute;left:2px;top:19px;width:9px;height:1.5px;background:var(--px-mute)}
.cg-hsgo{margin:10px 0 0}

/* the platform: the layers beside one screen at a time */
.cg-pgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cg-gap) clamp(40px,5vw,72px);align-items:start}
.cg-layers .tg-h3{margin:0 0 8px}
.cg-layers .tg-lyrs{margin:0;padding:0;list-style:none}
.cg-layers .tg-lyrs>li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px;padding:14px 0;border-top:1px solid var(--px-line);color:var(--px-ink)}
.cg-layers .tg-lyn{font:500 12px/1.9 var(--px-mono);color:var(--px-blue)}
.cg-layers .tg-lyrs h3{font:500 16.5px/1.3 var(--px-sans);color:var(--px-ink);margin:0 0 4px}
.cg-layers .tg-lyrs p{font:400 14.5px/1.55 var(--px-sans);color:var(--px-char);margin:0}
.cg-layers .tg-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 0;padding:0;list-style:none}
.cg-layers .tg-chips li{font:500 12.5px/1 var(--px-sans);padding:7px 10px;border-radius:999px;background:var(--px-card);border:1px solid var(--px-line);color:var(--px-char)}
.cg-dev{background:var(--px-paper2);border-radius:24px;padding:20px;min-height:100%}
.cg-dev .cg-tablist{justify-content:center;margin-bottom:20px}
.cg-dev .cg-one{margin:0;display:flex;justify-content:center}
.cg-dev .tg-phones.cg-one{grid-template-columns:none}
.cg-dev .tg-pc.cg-one{grid-template-columns:none}
.cg-dev .tg-pc.cg-one>figure{width:100%;max-width:640px;margin:0}
.cg-plat .tg-os{margin-top:clamp(36px,4vw,56px)}

@media (width<=980px){
  .cg-rules .tg-rules{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cg-pbuy .tg-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cg-after2,.cg-pgrid{grid-template-columns:minmax(0,1fr)}
}
@media (width<=640px){
  .cg-rules .tg-rules,.cg-rules .tg-nevers{grid-template-columns:minmax(0,1fr)}
  .cg-pbuy .tg-tiles{grid-template-columns:minmax(0,1fr)}
  .cg-tablist [role=tab]{padding:0 14px;font-size:14px}
  .cg-dev{padding:14px;border-radius:18px;margin:0 calc(var(--px-gut)*-.4)}
}
.cg-layers .tg-lyrs{display:block}
.cg-sec .px-sechead>div>.tg-num{margin-bottom:18px}
/* the market: the reading and the method side by side under the map */
@media (width>980px){
  .cg-mkt>.px-wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(40px,5vw,72px)}
  .cg-mkt>.px-wrap>*{grid-column:1/-1}
  .cg-mkt>.px-wrap>.tg-prose{grid-column:1;grid-row:3;margin-top:28px}
  .cg-mkt>.px-wrap>.tg-mdata{grid-column:2;grid-row:3;margin-top:28px;align-self:start}
}
.cg-mkt .tg-prose.tg-after{background:none;border:0;box-shadow:none;padding:0;max-width:none}
.cg-mkt .tg-prose p{font:400 17px/1.6 var(--px-sans);color:var(--px-char);margin:0 0 12px}
body.tg-pg .tg-pghero{padding-bottom:clamp(48px,5vw,72px)}
@media (width>640px){
  .cg-rules .tg-rules>li{display:block;border-bottom:0}
  .cg-rules .tg-rules>li:before{display:block;margin:0 0 12px}
}
.cg-rules .tg-rules{border-top:0}
.cg-rules .tg-rules>li{border-bottom:0}
.cg-rules .tg-rules>li:nth-child(-n+4){border-top:1px solid var(--px-ink)}
@media (width<=980px){.cg-rules .tg-rules>li:nth-child(-n+4){border-top:1px solid var(--px-line)}.cg-rules .tg-rules>li:nth-child(-n+2){border-top:1px solid var(--px-ink)}}
@media (width<=640px){.cg-rules .tg-rules>li:nth-child(2){border-top:1px solid var(--px-line)}}

/* Day 1 to year 30: one timeline, us above, private equity below */
.cg-clock{margin:0;position:relative}
.cg-stops{list-style:none;margin:0;padding:0}
.cg-ch{font:400 clamp(20px,1.7vw,24px)/1.2 var(--px-serif);letter-spacing:-.01em;color:var(--px-ink);margin:0}
.cg-stop b{font:500 11.5px/1 var(--px-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--px-blue)}
.cg-us{font:400 14.5px/1.5 var(--px-sans);color:var(--px-ink);margin:0}
.cg-pe{font:400 14.5px/1.5 var(--px-sans);color:var(--px-mute);margin:0}
.cg-end .cg-us{font-weight:600}
.cg-lane{font:500 11px/1.45 var(--px-mono);letter-spacing:.08em;text-transform:uppercase;margin:0}
.cg-lu{color:var(--px-ink)}
.cg-lp{color:var(--px-mute)}
.cg-cap{margin:22px 0 0;font:400 14px/1.5 var(--px-sans);color:var(--px-mute)}
.cg-cap p{margin:0}
@media (width>900px){
  .cg-clock{display:grid;grid-template-columns:150px repeat(8,minmax(0,1fr));column-gap:clamp(12px,1.4vw,20px);row-gap:0}
  .cg-stops,.cg-stop{display:contents}
  .cg-ch{grid-row:1;padding-bottom:14px}
  .cg-ch1{grid-column:2/7}
  .cg-ch2{grid-column:7/10;padding-left:16px;border-left:1px solid var(--px-line)}
  .cg-stop b{grid-row:2;position:relative;padding:22px 0 12px;border-top:2px solid var(--px-blue)}
  .cg-stop b:before{content:"";position:absolute;left:0;top:-7px;width:12px;height:12px;border-radius:50%;background:var(--px-paper);border:2px solid var(--px-blue);box-sizing:border-box}
  .cg-stop:first-child b:before,.cg-end b:before{background:var(--px-blue)}
  .cg-us{grid-row:3;padding:0 0 22px}
  .cg-pe{grid-row:4;padding:16px 0 0;border-top:1px dashed var(--px-line2)}
  .cg-pk{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .cg-lu{grid-column:1;grid-row:3;padding-top:2px}
  .cg-lp{grid-column:1;grid-row:4;padding-top:16px;border-top:1px dashed var(--px-line2)}
  .cg-cap{grid-column:2/-1;grid-row:5}
  .cg-y b,.cg-y .cg-us,.cg-y .cg-pe{padding-left:16px;border-left:1px solid var(--px-line)}
  .cg-y b:before{left:16px}
  .cg-y b{border-top-color:var(--px-blue)}
}
@media (width<=900px){
  .cg-clock{display:flex;flex-direction:column}
  .cg-stops,.cg-lane{display:contents}
  .cg-lane{display:none}
  .cg-ch1{order:0;margin-bottom:6px}
  .cg-ch2{order:2;margin:26px 0 6px}
  .cg-stop{order:1;display:block;position:relative;padding:12px 0 14px 26px;border-left:2px solid var(--px-blue);margin-left:5px}
  .cg-stop.cg-y{order:3}
  .cg-stop:before{content:"";position:absolute;left:-7px;top:13px;width:12px;height:12px;border-radius:50%;background:var(--px-paper);border:2px solid var(--px-blue);box-sizing:border-box}
  .cg-stop:first-of-type:before,.cg-end:before{background:var(--px-blue)}
  .cg-stop b{display:block;margin-bottom:6px}
  .cg-pe:not(.cg-none){margin-top:8px;padding-left:12px;border-left:2px dashed var(--px-line2)}
  .cg-pk{font-weight:500;color:var(--px-char)}
  .cg-cap{order:4}
}

/* what we buy: the size screen beside the four tests */
@media (width>980px){
  .cg-buy2{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:16px;align-items:stretch}
  .cg-pbuy .cg-buy2 .tg-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cg-calcw{display:flex;flex-direction:column}
  .cg-calcw .tg-calc{margin:0;flex:1}
}
.cg-calcw .cg-fitgo{margin-top:16px}

/* the screens: centered in their panel */
.cg-dev{display:flex;flex-direction:column}
.cg-dev .cg-panel{flex:1;display:flex;align-items:center;justify-content:center}
.cg-dev .cg-panel>.cg-one{width:100%}
@media (width>900px){
  .cg-clock{grid-template-columns:repeat(8,minmax(0,1fr))}
  .cg-ch1{grid-column:1/6}
  .cg-ch2{grid-column:6/9}
  .cg-us,.cg-pe{font-size:14px;line-height:1.48}
  .cg-cap{grid-column:1/-1;grid-row:5;display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px}
  .cg-cap .cg-lane{display:inline-flex;align-items:center;gap:10px}
  .cg-cap .cg-lane:before{content:"";width:28px;height:0;border-top:2px solid var(--px-blue)}
  .cg-cap .cg-lp:before{border-top:2px dashed var(--px-line2)}
  .cg-cap p{margin-left:auto}
}
@media (width<=900px){.cg-cap .cg-lane{display:none}}
.cg-after2 .tg-h3{font:400 clamp(22px,2vw,26px)/1.2 var(--px-serif)!important;letter-spacing:-.01em;margin:0 0 6px}
.cg-after2 .tg-rec-t{font-size:clamp(18px,1.5vw,21px)!important}
.cg-after2{margin-top:clamp(28px,3vw,40px)}
.cg-cap .cg-lp{border-top:0!important;padding-top:0!important}
@media (width<=640px){
  .cg-rules .tg-rules>li{padding:16px 0 18px;grid-template-columns:34px minmax(0,1fr)}
  .cg-rules .tg-rules h3{font-size:18.5px}
  .cg-rules .tg-rules p{font-size:14.5px;margin-top:6px}
  .cg-rules .tg-nevers>li{font-size:17px;padding:13px 0}
  .tg-os li{padding:18px 0!important}
  .cg-layers .tg-lyrs>li{padding:12px 0}
}
@media (width<=640px){
  .cg-after2{gap:36px}
  .cg-dev .cg-tablist{gap:6px;flex-wrap:nowrap;justify-content:space-between}
  .cg-dev .cg-tablist [role=tab]{padding:0 11px;font-size:13px;min-height:40px}
  .tg-os{margin-top:28px!important}
}

/* ---------- 3 · the founder ---------- */
.cg-fhero{padding-bottom:clamp(48px,5vw,72px)}
.cg-fhgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--cg-gap) clamp(40px,5vw,72px);align-items:end}
.cg-fhero .tg-fone{margin:0}
.cg-fhero .tg-shot.hero{margin:0}
.cg-fhero .tg-shot.hero img{aspect-ratio:4/3}
.cg-fhero .cg-fhtx .px-dek{margin-bottom:0}
.tg-fdhero.cg-fhero+.px-sec{padding-top:var(--cg-sec)}
/* the career */
.cg-cgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--cg-gap) clamp(40px,5vw,72px);align-items:start}
.cg-clead .px-sub{margin:0 0 24px}
.cg-career .tg-rail{margin:0}
.cg-career .tg-fgo{margin:0}
/* on stage and off: one strip */
.cg-stage{overflow:hidden}
.cg-strip{position:relative}
.cg-strip-sc{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;outline-offset:-3px;scroll-padding-left:max(var(--px-gut),calc((100% - var(--px-max))/2 + var(--px-gut)))}
.cg-strip-sc::-webkit-scrollbar{display:none}
.cg-strip-sc:focus-visible{outline:2px solid var(--px-blue)}
.cg-strip-in{display:flex;gap:12px;width:max-content;padding:0 max(var(--px-gut),calc((100vw - var(--px-max))/2 + var(--px-gut)))}
.cg-shot{margin:0;flex:none;scroll-snap-align:start;display:flex;flex-direction:column;gap:10px}
.cg-shot img{display:block;height:clamp(300px,30vw,400px);width:auto;border-radius:14px;object-fit:cover;background:var(--px-paper2)}
.cg-shot figcaption{font:500 11px/1.4 var(--px-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--px-mute);max-width:36ch}
.cg-strip-ctl{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.cg-strip-ctl[hidden]{display:none}
.cg-strip-ctl button{width:44px;height:44px;border-radius:50%;border:1px solid var(--px-line2);background:var(--px-card);color:var(--px-ink);font:500 18px/1 var(--px-sans);cursor:pointer;transition:border-color .2s,opacity .2s}
.cg-strip-ctl button:hover:not(:disabled){border-color:var(--px-ink)}
.cg-strip-ctl button:focus-visible{outline:2px solid var(--px-blue);outline-offset:3px}
.cg-strip-ctl button:disabled{opacity:.35;cursor:default}
/* writing */
.cg-writing .tg-whead h2{font-size:clamp(34px,3.4vw,48px)!important}
.cg-wmore{margin-top:0}
.cg-wmore summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;min-height:52px;border-bottom:1px solid var(--px-line);font:500 15px/1.3 var(--px-sans);color:var(--px-ink)}
.cg-wmore summary::-webkit-details-marker{display:none}
.cg-wmore summary:after{content:"+";font:400 22px/1 var(--px-sans);color:var(--px-blue);transition:transform .25s}
.cg-wmore[open] summary:after{transform:rotate(45deg)}
.cg-wmore summary:hover{color:var(--px-blue)}
.cg-wmore summary:focus-visible{outline:2px solid var(--px-blue);outline-offset:3px}
/* in print */
.cg-prgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--cg-gap) clamp(40px,5vw,72px);align-items:start}
.cg-essay{border-radius:22px;padding:clamp(26px,3vw,36px);margin:0 0 24px;color:#fff;box-shadow:var(--sh-2)}
.cg-essay-in{position:relative;z-index:1}
.cg-essay h3{font:400 clamp(26px,2.4vw,32px)/1.12 var(--px-serif);letter-spacing:-.02em;color:#fff;margin:0 0 14px;text-wrap:balance}
.cg-essay .tg-essay-by{font:400 14px/1.5 var(--px-sans);color:#ffffffd9;margin:0 0 20px;text-align:left}
.cg-essay p{margin:0}
.cg-essay .tg-num{justify-content:flex-start}
.cg-prlist h2{font:400 clamp(30px,3vw,42px)/1.08 var(--px-serif);letter-spacing:-.02em;margin:0 0 20px}
.cg-pressline{margin:24px 0 0;font:400 15.5px/1.55 var(--px-sans);color:var(--px-char)}
.cg-pressline span{font-weight:600;color:var(--px-ink)}
.cg-pressline .px-link{margin-left:4px}
@media (width<=980px){
  .cg-fhgrid,.cg-cgrid,.cg-prgrid{grid-template-columns:minmax(0,1fr)}
}
@media (width<=640px){
  .cg-shot img{height:280px}
  .cg-strip-in{gap:10px}
}

/* ---------- 4 · contact ---------- */
.px-chero.tg-pghero.cg-chero,.tg-pg .px-chero.tg-pghero{padding-bottom:84px}
.cg-lift .px-ways{gap:16px}
.cg-lift .px-way{gap:10px;padding:clamp(22px,2.4vw,30px)}
.cg-lift .px-map{margin-top:16px}
main .cg-lanes.px-sec{padding-top:clamp(40px,4vw,56px)!important;padding-bottom:var(--cg-sec)!important}
.cg-lanes .px-lanes{gap:16px}
.cg-lanes .px-lane{min-height:0;gap:18px;padding:clamp(22px,2.6vw,32px)}
.cg-lanes .px-lane .px-lt{font-size:clamp(20px,1.8vw,24px)}
@media (width<=640px){
  .cg-lift .px-mapsvg{aspect-ratio:4/3;height:auto!important}
  .cg-lift .px-way{padding:20px 20px 18px;gap:8px}
  .cg-lift .px-way .px-wbig{font-size:24px!important}
  .cg-lift .px-way p{font-size:15px}
  .cg-lift .px-ways{gap:12px}
  .cg-lanes .px-lanes{gap:12px}
}

/* ---------- 5 · the letter: the words as written, the layout tighter ---------- */
.px-art .article-hero.px-ahero{padding:clamp(128px,11vw,156px) 0 clamp(44px,4.4vw,60px)}
.px-art .article-body{padding-bottom:clamp(56px,6vw,80px)}
.px-art .prose{line-height:1.64}
.px-art .prose h2{margin-top:clamp(48px,5vw,64px)}
.px-art .px-aend{margin-top:40px}
.px-art .postnav{margin-bottom:12px}
.px-art .morecard{margin-bottom:16px}
.px-art .convo{margin-bottom:0;padding:clamp(22px,2.4vw,28px)}
.px-art .convo-t{margin-bottom:16px}
.cg-author{margin-top:16px}
body.tg-pg .cg-author .px-author-in{grid-template-columns:72px minmax(0,1fr);column-gap:22px;padding:clamp(22px,2.6vw,28px)}
.cg-author .px-author-ph{width:72px;height:72px}
.cg-author .px-author-n{font-size:clamp(22px,2vw,26px)}
@media (width<=900px){
  .px-art .article-hero.px-ahero{padding:104px 0 36px}
  .px-art .prose{line-height:1.62}
  body.tg-pg .cg-author .px-author-in{grid-template-columns:64px minmax(0,1fr);column-gap:16px}
  .cg-author .px-author-ph{width:64px;height:64px}
}

/* ---------- pass 1 fixes ---------- */
/* 2 · dividers run the content width */
main .px-sec.cg-sec+.px-sec.cg-sec>.px-wrap{border-top:0;position:relative}
main .px-sec.cg-sec+.px-sec.cg-sec>.px-wrap:before{content:"";position:absolute;top:0;left:var(--px-gut);right:var(--px-gut);border-top:1px solid var(--px-line)}
/* 3 · phones: one gap between sections, about 80px */
@media (width<=820px){
  :root{--cg-sec:40px}
  main .px-sec.cg-sec,body.tg-pg main .px-sec.cg-sec{padding-top:var(--cg-sec)!important;padding-bottom:var(--cg-sec)!important}
  main .px-sec.cg-sec+.px-sec.cg-sec,body.tg-pg main .px-sec.cg-sec+.px-sec.cg-sec{padding-top:0!important}
  .tg-fdhero.cg-fhero+.px-sec{padding-top:48px!important}
}
/* 4 · the orbit fades into the receipts */
.cg-sky.tg-blue:after{display:block;content:"";position:absolute;left:0;right:0;bottom:0;top:auto;height:140px;background:linear-gradient(180deg,#1559f500,#1559f5 92%);z-index:2;pointer-events:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cg-sky.tg-blue:after{background:linear-gradient(180deg,#0f3f9e00,#0f3f9e 92%)}}
/* 5 · the letter headline, about five lines */
@media (width>980px){.cg-llead .tg-big{font-size:clamp(32px,3vw,44px)}}
/* 6 · the podcast card in a narrow column */
.cg-letter .tg-listen .px-follow{justify-content:flex-start;flex-wrap:wrap;gap:8px}
.cg-letter .tg-listen .px-fl{width:100%;margin:0}
/* 7 · the fit footer names the tests and stays quiet until they are answered */
.cg-fit .tg-fit-board li:not(.is-yes):not(.is-no):not(.is-open) .tg-fb-v{visibility:hidden}
/* 8 · Ask: the words centred against the panel */
@media (width>980px){.cg-agrid{align-items:center}}
/* 9 · the letter card's links share rows on a phone */
@media (width<=640px){
  .cg-letter .tg-lcard{padding:24px 20px}
  .cg-letter .tg-lcard .tg-lmore{gap:0 16px}
  .cg-letter .tg-lcard .tg-lmore .px-link{font-size:15px}
}
/* 10 · Ask on a phone shows all four starters */
@media (width<=820px){.cg-ask .px-askp.inline{height:620px}}
/* 11 · short tab names on a phone */
.cg-tablist .cg-ts{display:none;font-weight:inherit}
.cg-tablist .cg-tl{font-weight:inherit}
@media (width<=640px){
  .cg-rtabs .cg-tablist{flex-wrap:nowrap}
  .cg-rtabs .cg-tablist .cg-tl{display:none}
  .cg-rtabs .cg-tablist .cg-ts{display:inline}
  .cg-rtabs .cg-tablist [role=tab]{flex:1;justify-content:center}
}
/* 12 · the platform points on a phone */
@media (width<=640px){.cg-plat .tg-os{gap:0}.cg-plat .tg-os li,.cg-plat .tg-os li+li{padding:16px 0!important;border-left:0!important;border-top:1px solid var(--px-line)}.cg-plat .tg-os li:first-child{border-top:0}}
/* 13 · one gap between the timeline and the row under it */
.cg-after2{margin-top:clamp(28px,3vw,40px);padding-top:clamp(24px,2.6vw,32px)}
/* 15 · the author card on a phone: the photo beside the name, the bio full width */
@media (width<=640px){
  body.tg-pg .cg-author .px-author-in{display:block}
  .cg-author .px-author-ph{float:left;width:56px;height:56px;margin:0 14px 8px 0}
  .cg-author .px-author-bio{clear:both;padding-top:6px}
}

/* ---------- pass 2 fixes ---------- */
.cg-fit .tg-fit-board{background:none!important;box-shadow:none!important;border:0!important;padding:0!important;border-radius:0!important}
.cg-fit .tg-fit-board li{padding-left:0!important;padding-right:0!important}
.cg-fit .tg-fit-board .tg-fb-k,.cg-fit .tg-fit-board .tg-fb-v{margin:0;padding:0;text-align:left}
.cg-plat .tg-os li{margin:0!important}
.cg-fit .tg-fit-board li.is-yes .tg-fb-v,.cg-fit .tg-fit-board li.is-no .tg-fb-v,.cg-fit .tg-fit-board li.is-open .tg-fb-v{transform:none}

/* ---------- pass 3 ---------- */
@media (width>820px){:root{--cg-sec:clamp(52px,4.6vw,66px)}}
.cg-home .tg-sky.cg-sky{min-height:min(70svh,610px)}
.cg-home .tg-close,.tg-pg .tg-close{padding-top:clamp(48px,4.6vw,66px);padding-bottom:clamp(48px,4.6vw,66px)!important}
@media (width>820px){.cg-ask .px-askp.inline{height:clamp(400px,46vh,440px)}}
@media (width<=820px){.cg-ask .px-askp.inline{height:700px}}
