/* Tempol home without JavaScript: the story is not run; the same content reads as one static document.
   Every rule is scoped to html:not(.motion): it applies only while the story is not running. */
html:not(.motion) #run{display:none}
html:not(.motion) #after{visibility:visible}
html:not(.motion) #doc{position:static;width:auto;height:auto;margin:0;overflow:visible;clip-path:none;white-space:normal}
html:not(.motion) #doc .docHead{display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 80px;color:var(--dim);font-size:15px}
html:not(.motion) #doc .docHead .brand{color:var(--bone);display:flex}
html:not(.motion) #doc .docHead .brand svg{height:26px;width:auto;display:block}
html:not(.motion) #doc .docHead nav{display:flex;gap:26px}
html:not(.motion) #doc .docHead nav a{color:inherit;text-decoration:none}
html:not(.motion) .docSec{max-width:1104px;margin:0 auto;padding:96px 24px;box-sizing:border-box}
html:not(.motion) .docSec h1{font:700 56px/1.03 'Space Grotesk',sans-serif;letter-spacing:-.035em;color:var(--bone);margin:14px 0 12px}
html:not(.motion) .docSec h2{font:700 34px/1.08 'Space Grotesk',sans-serif;letter-spacing:-.03em;color:var(--bone);margin:8px 0 6px}
html:not(.motion) .docSec p{color:var(--dim);font-size:15px;line-height:1.5;margin:0}
html:not(.motion) .docSec p.eyebrow{font:500 12px/16px 'Geist Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
html:not(.motion) .docSec .cta{display:flex;gap:12px;justify-content:center;margin-top:18px}
html:not(.motion) .docHero{text-align:center;padding-top:64px}
html:not(.motion) .docHero .lead{max-width:540px;margin:0 auto;font-size:16px}
html:not(.motion) .docEm{display:block;margin:56px auto 0;height:180px;width:auto;overflow:visible}
html:not(.motion) .docStack .copy{max-width:760px;margin:0 auto 18px}
html:not(.motion) .docStack .docPanel{margin:0 auto}
html:not(.motion) .docSplit{display:grid;grid-template-columns:600px 440px;gap:64px;align-items:center;justify-content:center}
html:not(.motion) .docMirror{grid-template-columns:440px 460px}
html:not(.motion) .docPayoff{text-align:center}
html:not(.motion) .docPayoff .docEm{height:116px;margin:0 auto 32px}
html:not(.motion) .docPayoff h2{font-size:60px;line-height:1.04;letter-spacing:-.035em}
html:not(.motion) .docPayoff p{max-width:500px;margin:16px auto 0;font-size:17px}
html:not(.motion) .docPayoff .cta{margin-top:28px}
html:not(.motion) .docPayoff p.ctx{font:500 12px/16px 'Geist Mono',monospace;letter-spacing:.02em;color:rgba(162,158,148,.75);margin-top:18px}
html:not(.motion) .docPanel{position:relative}
html:not(.motion) .docPanel .frag{position:relative!important;margin:0!important;transform:none!important;width:auto!important}
html:not(.motion) .docPanel.m{display:none}
@media (max-width:759px){
  html:not(.motion) .docPanel.d{display:none}
  html:not(.motion) .docPanel.m{display:block}
  html:not(.motion) #doc .docHead{height:56px;padding:0 16px}
  html:not(.motion) #doc .docHead nav{display:none}
  html:not(.motion) #doc .docHead .brand svg{height:20px}
  html:not(.motion) .docSec{padding:56px 16px}
  html:not(.motion) .docSec h1{font-size:30px;margin:10px 0}
  html:not(.motion) .docSec h2{font-size:27px}
  html:not(.motion) .docSec p{font-size:14px}
  html:not(.motion) .docSplit, html:not(.motion) .docMirror{grid-template-columns:1fr;gap:20px}
  html:not(.motion) .docSplit .docPanel{order:2}
  html:not(.motion) .docMirror .docPanel{order:-1}
  html:not(.motion) .docEm{height:140px;margin-top:40px}
  html:not(.motion) .docPayoff .docEm{height:76px;margin:0 auto 22px}
  html:not(.motion) .docPayoff h2{font-size:33px}
  html:not(.motion) .docPayoff p{font-size:15px;max-width:350px;margin-top:12px}
  html:not(.motion) .docPayoff .cta{margin-top:24px}
  html:not(.motion) #after{flex-direction:column;align-items:flex-start;justify-content:center;height:auto;padding:28px 16px 36px;gap:14px}
  html:not(.motion) .docPanel.m .imAct .bt{font-size:13.5px;padding:0 14px}
  html:not(.motion) .docPanel.m .sr b{font-size:13px}
  html:not(.motion) .docPanel.m .frag .bar{height:44px}
  html:not(.motion) .docPanel.m .frag .body{padding:12px}
  html:not(.motion) .docPanel.m .grid{gap:8px}
  html:not(.motion) .docPanel.m .tile b{font-size:12px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  html:not(.motion) .docPanel.m .tile i{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  html:not(.motion) .docPanel.m .tile .th [style*="26px Space"]{font-size:14px!important}
  html:not(.motion) .docPanel.m .tile .th [style*="11px Instrument"]{font-size:7px!important;padding:2px 5px!important}
  html:not(.motion) .docPanel.m .tile .th [style*="width:46px"]{transform:scale(.6)}
  html:not(.motion) .docPanel.m .tile .th .tc{font-size:7.5px;left:6px;top:5px}
  html:not(.motion) .docPanel.m .tile .th .nd{width:6px;height:6px;right:5px;top:5px}
}
html:not(.motion) #doc,html:not(.motion) #after{animation:docRescue 1ms linear 3s both}
@keyframes docRescue{from{visibility:hidden}to{visibility:visible}}
@media (scripting: none){html:not(.motion) #doc,html:not(.motion) #after{animation:none;visibility:visible}}
