/* Articles (Coach's notes): the explainer template. Flat: no shadow, no gradient. */
.hdr{padding-bottom:0}
.article-hero{padding:72px 0 84px;max-width:900px}
.article-hero .k{color:rgba(255,255,255,.85);margin:0}
.article-hero h1{font-size:clamp(52px,9.2vw,118px);line-height:.92;margin:18px 0 26px;color:#fff;text-transform:uppercase}
.article-hero .dashes{display:flex;margin-bottom:28px}
.article-hero .lede{font-size:clamp(18px,2.2vw,22px);line-height:1.5;max-width:720px;color:#fff;margin:0}
.article{max-width:740px;margin:0 auto;padding:84px 20px 20px}
.article h2{font-family:'Big Shoulders','Big Shoulders Display',Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(34px,6vw,50px);line-height:.95;margin:64px 0 20px;color:#fff}
.article h2:first-child{margin-top:0}
.article p{font-size:19px;line-height:1.55;margin:0 0 18px}
.article p.muted{color:var(--t2)}
.fig{border:1.5px solid var(--b);border-radius:22px;padding:30px 32px 26px;margin:34px 0 10px}
.fig .k{display:block;margin-bottom:18px}
.row{display:grid;grid-template-columns:130px 1fr 110px;align-items:center;gap:22px;padding:10px 0;border-top:1.5px solid var(--b)}
.row:first-of-type{border-top:0}
.row .lab{font-family:'Compound Mono',monospace;font-size:15px;color:var(--t2);line-height:1.35}
.row .lab b{display:block;color:#fff;font-size:20px}
.row .pct{font-family:'Compound Mono',monospace;font-weight:700;font-size:34px;text-align:right;color:#fff}
.fbar{--u:.62px;overflow:hidden;min-width:0}
.fbar .hplates{height:calc(var(--u)*76);margin:0}
.fbar .hsleeve{background:var(--b);margin-right:calc(var(--u)*-60);margin-left:calc(var(--u)*8);margin-bottom:0}
.fig .cap2{font-size:15px;color:var(--m);margin:14px 0 0}
ol.help{list-style:none;margin:8px 0 0;padding:0}
ol.help li{display:grid;grid-template-columns:56px 1fr;gap:6px;padding:22px 0;border-top:1.5px solid var(--b)}
ol.help li .n{font-family:'Compound Mono',monospace;color:var(--block);font-size:18px;font-weight:700;padding-top:4px}
ol.help h3{font-family:'Big Shoulders','Big Shoulders Display',Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:30px;line-height:1;margin:0 0 10px;color:#fff}
ol.help p{margin:0}
.compound{max-width:1120px;margin:56px auto 0;padding:0 20px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:56px;align-items:start}
.compound h2{font-family:'Big Shoulders','Big Shoulders Display',Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(34px,6vw,50px);line-height:.95;margin:0 0 18px;color:#fff}
.compound>div>p{font-size:19px;margin:0 0 26px;line-height:1.55}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card{border:1.5px solid var(--b);border-radius:22px;padding:22px 24px}
.card .k{display:block;margin-bottom:10px}
.card h3{font-family:'Big Shoulders','Big Shoulders Display',Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:27px;line-height:1;margin:0 0 10px;color:#fff}
.card p{font-size:16px;color:var(--t2);margin:0;line-height:1.5}
.compound>div{min-width:0}
.pshot{min-width:0;overflow:hidden;border-radius:40px;background:#0E1012;padding:12px}
.pshot img{display:block;width:100%;max-width:100%;height:auto;border-radius:30px}
.pshot .cap3{font-family:'Compound Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--m);padding:12px 6px 2px;text-align:center}
.band{background:var(--block);color:#fff;border-radius:40px;margin:88px 20px 0;padding:72px 0 76px}
.band .k{color:rgba(255,255,255,.85)}
.band h2{font-size:clamp(52px,9vw,104px);margin:0 0 22px;text-transform:uppercase;line-height:.92}
.band p{font-size:22px;max-width:640px;margin:0 0 32px}
.band .url{font-size:15px;letter-spacing:.1em;text-transform:uppercase;margin-top:26px}
.band .line{font-size:34px;margin-top:40px;text-transform:uppercase}
.notes{padding:72px 20px 20px}
.notelist{list-style:none;margin:0;padding:0;max-width:760px}
.notelist a{display:block;border:1.5px solid var(--b);border-radius:22px;padding:28px 30px;text-decoration:none;color:inherit}
.notelist h2{font-size:clamp(30px,5vw,44px);line-height:.98;margin:8px 0 12px;text-transform:uppercase}
.notelist p{margin:0 0 14px;color:var(--t2);font-size:17px;line-height:1.5}
.notelist .more{color:#fff;font-size:14px}
@media (max-width:860px){
  .article-hero{padding:48px 0 60px}
  .article{padding-top:56px}
  .compound{grid-template-columns:1fr;gap:32px}
  .cards{grid-template-columns:1fr}
  .pshot{max-width:340px}
  .row{grid-template-columns:1fr auto;gap:8px 16px}
  .row .lab{grid-column:1}.row .pct{grid-column:2;grid-row:1;font-size:28px}
  .row .fbar{grid-column:1/-1}
  .fig{padding:22px 18px 20px}
  .band{margin:64px 12px 0;padding:48px 0 52px}
}