/* The how-to video is first in both reading and visual order. */
.hero.howto-first .hero-shell{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)!important;gap:38px!important;align-items:center;width:min(1180px,calc(100% - 40px))!important;padding:26px 0 76px!important}
.howto-first .hero-media{width:100%;min-width:0;max-width:520px;margin:0 auto}
#howto-video{scroll-margin-top:100px}
.howto-first .video-wrap{aspect-ratio:1/1}
.howto-first video{display:block;width:100%;height:100%;object-fit:contain;background:#080605}
.howto-first .video-copy{gap:12px;padding:18px 20px}
.howto-first .video-copy>div,.howto-first .hero-copy{min-width:0}
.howto-first .video-copy h2{margin:0;color:#fff2d8;font-size:clamp(18px,1.8vw,23px);font-weight:800;line-height:1.55;text-wrap:balance}
.howto-first .video-copy p{font-size:13px;line-height:1.8;text-wrap:pretty}
.howto-first .hero-title-primary{font-size:clamp(30px,2.9vw,42px);white-space:normal;line-height:1.3}
.howto-first .hero-title-primary strong,.howto-first .hero-title-primary em{display:inline-block;white-space:nowrap}
.howto-first .hero-title-secondary{font-size:clamp(30px,3.1vw,44px);white-space:normal;line-height:1.35}
.howto-first .hero-title-unit{display:inline-block}
.howto-first .hero-actions .button{white-space:normal;text-align:center}
#live .video-grid{grid-template-columns:minmax(0,1fr);max-width:600px;margin-inline:auto}
.p9-reading-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.p9-reading-card{display:flex;min-width:0;flex-direction:column;gap:14px;padding:27px;border:1px solid rgba(235,183,72,.25);border-radius:20px;background:linear-gradient(145deg,#1c110be6,#0e0a08e6)}
.p9-reading-card>span{align-self:flex-start;color:#e9bc61;font-size:12px;font-weight:700}
.p9-reading-card h3{margin:0;color:#fff3dd;font-size:23px;line-height:1.55;font-weight:800;text-wrap:balance}
.p9-reading-card h3 a{color:inherit;text-decoration:none}
.p9-reading-card p{margin:0 0 8px;color:#c0b1a5;font-size:14px;line-height:1.9;text-wrap:pretty}
.p9-reading-more{align-self:flex-start;margin-top:auto;padding-block:7px;color:#ffda77;font-size:14px;font-weight:700;text-decoration:none}
.p9-reading-card a:hover{text-decoration:underline;text-underline-offset:4px}
.p9-reading-card a:focus-visible{outline:2px solid #f4cd75;outline-offset:5px;border-radius:3px}
@media(max-width:1050px){.p9-reading-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
  .hero.howto-first .hero-shell{grid-template-columns:minmax(0,1fr)!important;gap:30px!important;width:min(700px,calc(100% - 32px))!important;padding:20px 0 62px!important}
  .howto-first .hero-media{max-width:500px}
  .howto-first .hero-title-primary{font-size:clamp(28px,5.4vw,42px)}
  .howto-first .hero-title-secondary{font-size:clamp(30px,5.8vw,44px)}
}
@media(max-width:680px){
  .p9-reading-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .p9-reading-card{gap:11px;padding:22px}
  .p9-reading-card h3{font-size:22px}
  .howto-first .video-copy{padding:14px;gap:10px}
  .howto-first .hero-title-primary{font-size:clamp(26px,7.3vw,38px)}
  .howto-first .hero-title-secondary{font-size:clamp(29px,8vw,40px)}
  .howto-first .hero-actions .button{width:100%}
}