.sp-clip{--review-accent:#c6dc87}.sp-clip-overview>h2,.sp-clip .sp-review-flow>h2{letter-spacing:-.04em;font-size:clamp(30px,4.2vw,60px);line-height:1.5}.sp2 .sp-clip-overview{background:#101010;padding-top:40px}.sp-clip-diagram{grid-template-columns:1fr .45fr 1.35fr;align-items:center;gap:30px;margin:56px 0 28px;display:grid}.sp-clip-diagram p{color:#b7bbc1;margin:20px 0 0;font-size:14px;line-height:1.9}.sp-clip-source>span,.sp-clip-output>span{letter-spacing:.08em;color:var(--review-accent);margin-bottom:18px;font-size:14px;display:block}.sp-clip-landscape{aspect-ratio:16/9;background:#1b1d20;border:1px solid #ffffff50;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.sp-clip-landscape strong{font-size:24px;font-weight:400}.sp-clip-landscape span{color:#afb4ba;font-size:12px}.sp-clip-select{text-align:center}.sp-clip-select>span{color:var(--review-accent);margin-bottom:16px;font-size:40px;display:block}.sp-clip-select strong{font-size:18px;font-weight:400}.sp-clip-select p{margin-top:10px}.sp-clip-portraits{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.sp-clip-portrait{aspect-ratio:9/16;text-align:center;background:#232a1a;border:1px solid #c6dc8750;flex-direction:column;justify-content:space-between;align-items:center;gap:10px;min-width:0;padding:18px 8px 14px;display:flex}.sp-clip-portrait small{letter-spacing:.06em;font-size:12px}.sp-clip-portrait strong{font-size:clamp(12px,1.2vw,18px);font-weight:500;line-height:1.6}.sp-clip-portrait>div{aspect-ratio:16/9;color:#c6dc87;background:#141610;place-items:center;width:calc(100% + 16px);font-size:12px;display:grid}.sp-clip-portrait>span{color:#171c11;background:#c6dc87;width:100%;padding:4px 5px;font-size:12px}.sp-clip-note{color:#aeb4ba;max-width:65em;font-size:14px;line-height:1.9}@media (max-width:900px){.sp-clip-diagram{grid-template-columns:1fr;gap:20px;max-width:540px;margin-inline:auto}.sp-clip-select>span{margin:0;transform:rotate(90deg)}.sp-clip-select p{margin:0}.sp-clip-landscape{max-width:380px;margin:auto}.sp-clip-portrait strong{font-size:clamp(12px,3.5vw,20px)}.sp-clip-source>p,.sp-clip-output>p{text-align:center}.sp-clip-portraits{gap:12px}.sp-clip-portrait{padding-top:22px;padding-bottom:20px}.sp-clip-landscape span{font-size:12px}}.sp-clip-integration-lead{color:#b7bbc1;max-width:58em;margin:28px 0 0;font-size:16px;line-height:2}.sp-clip-integration .sp-clip-note{margin-bottom:24px}.sp-clip-integration{scroll-margin-top:90px}.sp2 .sp-clip-back{padding-top:0}.sp-clip .sp-clip-youtube-demo{margin:48px 0 32px;scroll-margin-top:100px}.sp-clip-youtube-demo figcaption{margin-top:20px}
