/* Sections (strips) share the header container width and their inner blocks fill it; no scaling */
/* Readability: no text below 12px */
small,.gx-chip{font-size:max(12px,.8em)}
@media (max-width:640px){.wa-m{font-size:max(12px,1em)}}
/* Posts: readable code blocks, clearer heading hierarchy, bigger card titles, lighter popup on small screens */
article pre,.prose pre{overflow-x:auto;white-space:pre;direction:ltr;text-align:left;unicode-bidi:plaintext;max-width:100%;-webkit-overflow-scrolling:touch}
@media (max-width:900px){
  article h2{font-size:max(1.75rem,28px)}
  article h3{font-size:1.2rem}
  .dtpop{max-height:38vh}
}
.post-card h3,.pc h3,.bl-card h3,.cat-card h3{font-size:max(1.05rem,17px)}
/* 08.11c: roomier desktop strips, stat cards, compact cookie card instead of a full-width strip */
@media (min-width:1100px){
  main:not([data-lean]) section.sx.sx:not(.rel-sec){padding-block:clamp(72px,6.2vw,112px)}
  .stats{gap:clamp(20px,2vw,32px)}
  .stat{padding:clamp(32px,3vw,48px) 28px}
  .stat span{font-size:clamp(18px,1.25vw,21px)}
  .stat-note{margin-top:28px}
}
/* 08.11d: clearly visible section bands, strong rhythm, full-width stat strip (desktop) */
@media (min-width:1100px){
  main:not([data-lean]) section.sx.sx:not(.rel-sec){padding-block:clamp(96px,7.6vw,120px)}
  main section.sx.sx.b0{background:#050c1f!important;border-top:1px solid rgba(143,176,255,.14)}
  main section.sx.sx.b1{background:linear-gradient(180deg,#1b3d82 0%,#12306b 100%)!important;border-top:1px solid rgba(143,176,255,.35);border-bottom:1px solid rgba(143,176,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
  main section.sx.sx.b0+section.sx.sx.b0,main section.sx.sx.b1+section.sx.sx.b1{border-top-color:rgba(255,110,0,.45)}
  main section.sx.proof{background:linear-gradient(180deg,#0e2250 0%,#17408a 100%)!important;border-top:3px solid #FF6E00;border-bottom:1px solid rgba(143,176,255,.3)}
  .proof .stats{max-width:1320px;grid-template-columns:1fr 1fr;gap:28px}
  .proof .stat{background:#F3F6FB;border:0;border-radius:28px;padding:clamp(44px,4vw,64px) 40px;box-shadow:0 30px 60px -24px rgba(0,8,30,.7)}
  .proof .stat b{font-size:clamp(72px,7vw,120px);line-height:1;color:#FF6E00;display:block;margin-bottom:12px}
  .proof .stat span{color:#0b1f3a;font-size:clamp(19px,1.4vw,24px);font-weight:600;line-height:1.5}
}

/* 08.11e: fluid wide layout (27" 2560 screens), compact cookie card that never moves the floating icons, text rhythm */
@media (min-width:1240px){.sx>.wrap{max-width:min(100%,1240px)}}
@media (min-width:1500px){
  :root{--dtw:clamp(1240px,70vw,1860px)}
  .wrap,.sx>.wrap,.s26-flow,.s26-calc,.stats,.shw,.sp2,.ar,.proof .stats{max-width:var(--dtw)}
  .s26-flow3{max-width:calc(var(--dtw) * .88)}
  .stats,.shw,.sp2,.ar{margin-inline:auto}
  .ar>a{max-width:none}
  header.hero nav.nav-fixed{padding-inline:max(20px,calc((100vw - var(--dtw))/2 + 20px))}
  header.hero .hgrid2{min-height:clamp(560px,52vh,860px);padding-block:clamp(28px,4vh,72px);gap:clamp(40px,4vw,96px)}
  .hh h1{font-size:clamp(64px,3.7vw,100px)}
  header.hero .hgrid2{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
  .hh h1 .h1k{font-size:clamp(22px,1.5vw,40px)}
  .hh .sub{font-size:clamp(26px,1.6vw,42px);max-width:none}
  .hcta .pill{font-size:clamp(19px,1.25vw,32px);padding:.7em 1.4em}
  header.hero nav .l a{font-size:clamp(16px,.95vw,24px)}
  header.hero nav .navcta{font-size:clamp(15px,.95vw,24px)}
  main:not([data-lean]) section.sx h2{font-size:clamp(40px,2.9vw,76px)}
  .sx p,.sx li{font-size:clamp(18px,1.15vw,28px)}
}
@media (min-width:1100px){
  main:not([data-lean]) section.sx.sx:not(.rel-sec){padding-block:clamp(96px,7.6vw,200px)}
  .stats{gap:clamp(20px,2vw,48px)}
  .proof .stat{padding:clamp(44px,4vw,110px) 40px}
  .proof .stat b{font-size:clamp(72px,7vw,190px)}
  .proof .stat span{font-size:clamp(19px,1.4vw,36px)}
  .stat-note{margin-top:clamp(28px,2vw,48px);font-size:clamp(15px,1.05vw,26px);max-width:none}
}
/* cookie: small card, never feeds the floating icons offset */
html{--cbo:0px!important}
body{padding-bottom:0!important}
body .cb,body:has(#cb:not([hidden])) .cb{left:0!important;right:0!important;margin:0 auto!important;bottom:20px!important;width:min(560px,calc(100vw - 340px))!important;max-width:none!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:18px!important;padding:14px 16px!important;gap:12px!important;flex-wrap:wrap;box-shadow:0 18px 50px rgba(0,0,0,.5)!important;max-height:none;overflow:visible}
body .cb .cbt{flex:1 1 100%;display:block}
body .cb .cbt b{display:block;margin-bottom:4px}
body .cb .cba{flex:1 1 100%;display:flex;gap:8px}
body .cb .cba button{flex:1 1 0!important;min-height:40px!important;padding:6px 10px!important;font-size:15px!important}
@media (max-width:900px){
  body .cb,body:has(#cb:not([hidden])) .cb{width:calc(100vw - 16px)!important;bottom:78px!important;padding:10px 12px!important;max-height:34vh;overflow:auto}
  body .cb .cbt b{display:none}
}
/* text rhythm: no lone last word, balanced short blocks, paired cards wrap alike */
h1,h2,h3,h4,.stat span,.stat-note,figcaption,.hh .sub{text-wrap:balance}
p,li,dd,blockquote{text-wrap:pretty}
.stat{display:flex;flex-direction:column;align-items:center;text-align:center}
.stats{align-items:stretch}
.stat-note{line-height:1.7}
.proof .stat span,.stat span{max-width:19em;margin-inline:auto}