/* Product footage is the proof: restrained chrome, generous space, real editor. */
.studio{background:#fff;border-block:1px solid var(--line)}
.studio-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:32px 80px;align-items:end;margin-bottom:34px}
.studio-heading h2{margin-top:18px;max-width:560px;font-size:clamp(38px,4.5vw,58px);letter-spacing:-.025em}
.studio-heading .lede{max-width:46ch;font-size:16px}
.studio-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:22px}
.studio-actions .btn{font-size:14px;padding:12px 18px}
.studio-demo{border:1px solid #22354c;border-radius:16px;overflow:hidden;background:#0b1b2e;box-shadow:0 24px 64px -36px #0b1b3366}
.studio-demo-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 20px;color:#d6dfeb;font-size:12px;letter-spacing:.01em}
.studio-demo-title{display:flex;align-items:center;gap:10px;font-weight:500}
.studio-demo-title::before{content:'';width:6px;height:6px;border-radius:50%;background:#a4bca8;box-shadow:0 0 0 4px #a4bca810}
.studio-demo-meta{color:#b2c0d1;font-size:12px}
.studio-screen{background:#f7f7fa;position:relative;aspect-ratio:8/5;overflow:hidden}
.studio-screen video{width:100%;height:100%;object-fit:contain;background:#f7f7fa}
.studio-play{position:absolute;inset:0;display:grid;place-items:center;width:100%;color:#fff;background:linear-gradient(transparent,#0b1b331a)}
.studio-play[hidden]{display:none}
.studio-play span{display:flex;align-items:center;gap:12px;border-radius:999px;padding:16px 24px;background:#0b1b2ef2;box-shadow:0 6px 28px #0b1b3330;font-size:15px;font-weight:600}
.studio-play svg{width:18px;height:18px}
.studio-timeline{height:2px;background:#33465b;overflow:hidden}
.studio-timeline-fill{height:100%;width:0;background:#d7bd7b}
.studio-controls{display:flex;align-items:center;gap:18px;padding:13px 20px;min-height:58px;color:#eaf0f7}
.studio-toggle{border:1px solid #4e5f73;border-radius:6px;color:#eaf0f7;padding:7px 11px;font-size:12px;min-width:86px;min-height:34px}
.studio-toggle:hover{background:#20334b}
.studio-chapter-status{font-size:13px;color:#d6dfeb;flex:1}
.studio-duration{font-size:12px;font-variant-numeric:tabular-nums;color:#afbed0}
.studio-fullscreen{padding:6px;color:#c3cfde;min-width:34px;min-height:34px}
.studio-fullscreen .ic{font-size:18px}
.studio-caption{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;line-height:1.5;color:var(--ink-2);margin-top:15px}
.studio-caption b{font-weight:500;color:var(--ink)}
.studio-chapters{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:32px}
.studio-chapter{display:grid;grid-template-columns:auto 1fr;gap:13px;text-align:left;padding:19px 0 0;border-top:1px solid var(--line-2);color:var(--ink-2);align-content:start}
.studio-chapter[aria-current="step"]{border-top-color:var(--blue);color:var(--ink)}
.studio-chapter:hover{border-top-color:var(--blue)}
.studio-step{font-size:12px;font-variant-numeric:tabular-nums;color:var(--gold);padding-top:3px}
.studio-chapter strong{display:block;font-size:15px;font-weight:600;margin-bottom:6px;letter-spacing:-.015em}
.studio-chapter small{display:block;font-size:14px;line-height:1.65;color:var(--ink-2)}
.studio-demo:fullscreen{display:flex;flex-direction:column;justify-content:center;border:0;border-radius:0}
.studio-demo:fullscreen .studio-screen{min-height:0;max-height:calc(100vh - 112px)}
.studio-error{padding:14px 20px;color:#fff;font-size:14px;background:#20334b}
.studio-error[hidden]{display:none}
@media(max-width:900px){.studio-heading{grid-template-columns:1fr;gap:22px}.studio-heading .lede{max-width:60ch}.studio-heading h2{max-width:580px}.studio-chapters{gap:18px}}
@media(max-width:600px){.studio{padding-block:56px}.studio-heading{margin-bottom:25px}.studio-actions{gap:9px}.studio-actions .btn{padding:11px 13px;font-size:13px}.studio-demo{border-radius:10px}.studio-demo-bar{padding:11px 12px}.studio-demo-meta{display:none}.studio-controls{padding:10px 12px;gap:10px}.studio-duration{display:none}.studio-chapter-status{font-size:12px}.studio-caption{font-size:12px}.studio-chapters{grid-template-columns:1fr;gap:0;margin-top:23px}.studio-chapter{padding:17px 0;gap:15px}.studio-chapter small{font-size:14px}.studio-play span{padding:12px 16px;font-size:13px}.studio-heading h2{font-size:40px}.studio-demo:fullscreen .studio-screen{width:100%;height:auto}}
