/* R04: readable three-step explainer alongside the original looping video. */
.s-hero{padding-top:44px;padding-bottom:34px}
.s-hero-benefits{column-gap:26px;row-gap:13px}
.s-how-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:44px;align-items:center}
.s-how-intro{font-size:18px;line-height:1.65;color:var(--muted);margin-top:17px;max-width:440px}
.s-how .s-steps{grid-template-columns:1fr;gap:21px;margin-top:24px}
.s-how .s-steps li{display:grid;grid-template-columns:30px 1fr;column-gap:14px}
.s-how .s-step-number{grid-row:1/3;font-size:16px;line-height:1.6;margin:0}
.s-how .s-steps h3{font-size:20px;line-height:1.35}
.s-how .s-steps p{grid-column:2;font-size:17px;line-height:1.6;margin-top:5px}
.s-loop-video{min-width:0}
.s-loop-frame{position:relative;aspect-ratio:1500/844;background:var(--dark);border-radius:8px;overflow:hidden;border:1px solid #2c333e}
.s-loop-frame video{display:block;width:100%;height:100%;object-fit:contain}
.s-loop-print{display:none}
.s-loop-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:13px;font-size:16px;line-height:1.5;font-weight:600}
.s-loop-duration{font-weight:400;color:var(--muted);white-space:nowrap}
.s-motion-toggle{flex:none;font-size:14px;font-weight:600;line-height:1.5;padding:8px 12px;min-height:40px;border:1px solid #9ca6b2;background:transparent;color:var(--ink);border-radius:5px;cursor:pointer}
.s-motion-toggle:hover{background:white;border-color:var(--ink)}
.s-loop-video figcaption{font-size:14px;line-height:1.65;color:var(--muted);margin-top:12px;max-width:650px}
@media(max-width:1100px) and (min-width:981px){.s-how-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:30px}.s-how h2{font-size:32px}.s-loop-controls{font-size:15px;gap:12px}.s-loop-duration{display:block}.s-how-intro{font-size:17px}}
@media(max-width:980px){.s-how-grid{grid-template-columns:1fr;gap:32px}.s-how-intro{max-width:680px}.s-how .s-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.s-how .s-steps li{display:block}.s-how .s-step-number{margin-bottom:12px}.s-how .s-steps p{font-size:17px}.s-loop-video{width:100%}}
@media(max-width:700px){.s-hero{padding-top:36px;padding-bottom:30px}.s-hero-benefits{max-width:100%;display:grid;justify-content:center;gap:10px}.s-hero-benefits li{align-items:flex-start}.s-hero-benefits li>span{line-height:1.6}.s-hero-benefits li:last-child{max-width:310px}.s-how-intro{font-size:16px;line-height:1.7}.s-how .s-steps{grid-template-columns:1fr;gap:22px}.s-how .s-steps li{display:grid;grid-template-columns:30px 1fr}.s-how .s-steps h3{font-size:20px}.s-how .s-steps p{font-size:16px}.s-how .s-step-number{margin-bottom:0}.s-loop-controls{font-size:16px;align-items:flex-start;gap:12px}.s-loop-duration{display:block;font-size:14px}.s-motion-toggle{font-size:14px;min-height:42px;padding:8px 10px}.s-loop-video figcaption{font-size:14px;line-height:1.7}}
@media print{.s-loop-frame video{display:none}.s-loop-print{display:block;width:100%;height:100%;object-fit:contain}.s-motion-toggle{display:none}.s-loop-controls{margin-top:14px}}