/* Subscription: a restrained first screen, with the showreel after the benefits. */
.sub-hero{background:#08152f;border-bottom:1px solid #2a426b;overflow:hidden}
.sub-hero:before,.sub-hero:after,.sub-hero-stage:before{display:none}
.sub-hero-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(54px,6.3vw,110px);align-items:center;min-height:620px;padding:84px 0 93px}
.sub-hero-copy{display:block;max-width:600px}
.sub-hero h1{display:block;max-width:620px;margin:0 0 28px;font-size:clamp(3.6rem,4.65vw,5.35rem);line-height:1.035;letter-spacing:-.078em}
.sub-hero h1 span{display:block;padding-right:.1em;background:linear-gradient(100deg,#ffb454 0%,#ff7058 28%,#de49a6 59%,#9270ef 94%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:none}
.sub-hero-lead{max-width:520px;margin:0;color:#c8d6ed;font-size:15px;line-height:1.74}
.sub-hero-actions{display:flex;flex-direction:row;align-items:center;gap:23px;width:auto;margin-top:32px}
.sub-hero-actions .sub-button{width:auto;min-width:164px;max-width:none;background:#3260ed;color:#fff;box-shadow:0 10px 28px #0d2c9169}
.sub-hero-actions .sub-button:hover,.sub-hero-actions .sub-button:focus-visible{background:#fff;color:#143783;box-shadow:0 15px 32px #0005}
.sub-hero-actions>span{color:#aebfdd;font-size:11px;font-weight:700;line-height:1.5}
.sub-hero-actions>span i{font-style:normal;margin:0 7px;color:#718ebf}
.sub-hero-stage{display:block;position:relative;width:100%;max-width:none;min-width:0;min-height:0;padding:0;margin:0;align-self:center}
.sub-hero-motion{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #758fbc;border-radius:10px;background:#1b315c;box-shadow:0 25px 62px #02091873}
.sub-hero-motion video{display:block;width:100%;height:100%;object-fit:cover}

.sub-examples{background:#163462;border-top:1px solid #5675a46b;border-bottom:1px solid #5675a46b;padding:clamp(85px,7vw,110px) 0}
.sub-examples-grid{display:grid;grid-template-columns:minmax(265px,.55fr) minmax(0,1.45fr);align-items:center;gap:clamp(48px,6vw,95px)}
.sub-examples h2{max-width:440px;margin:0;color:#fff;font-size:clamp(2.55rem,3.8vw,4.7rem);line-height:1.06;letter-spacing:-.07em}
.sub-example-player{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #90abda;border-radius:10px;background:#071633;box-shadow:0 24px 60px #02102f75}
.sub-example-player .studio-poster,.sub-example-player .studio-mount,.sub-example-player .studio-mount iframe,.sub-example-player .studio-hitarea{border-radius:inherit}
.sub-example-player .studio-poster img{object-fit:cover}
.sub-example-player .studio-poster-play{width:70px;height:70px}
.sub-example-player .studio-controls{opacity:0;pointer-events:none}
.sub-example-player.is-started .studio-controls{opacity:1;pointer-events:auto}
.sub-example-player.is-playing .studio-controls{opacity:0;pointer-events:none}
.sub-example-player.is-playing.controls-visible .studio-controls{opacity:1;pointer-events:auto}

.sub-final{background:#f5f7fb;color:#0c1d3c;border-top:1px solid #dae2ee}
.sub-final .sub-eyebrow{color:#2456b7}
.sub-final h2{color:#0c1d3c;max-width:930px}
.sub-final-grid>div:first-child p{color:#4a5d79}
.sub-final-action{border-top-color:#9dafca}
.sub-final-action p{color:#253f64}
.sub-final-action .sub-button-primary{background:#194ac7;color:#fff;box-shadow:0 13px 28px #123b9b36}
.sub-final-action .sub-button-primary:hover,.sub-final-action .sub-button-primary:focus-visible{background:#102d6c;color:#fff}
.sub-final-action span{color:#526988}

@media(max-width:1100px){
  .sub-hero-grid{gap:42px;min-height:0;padding:78px 0 86px}
  .sub-hero h1{font-size:clamp(3.2rem,5vw,4.7rem)}
  .sub-hero-lead{font-size:14px}
  .sub-examples-grid{gap:42px}
}
@media(max-width:800px){
  .sub-hero-grid{grid-template-columns:1fr;gap:46px;padding:66px 0 76px}
  .sub-hero-copy{max-width:700px}
  .sub-hero h1{max-width:710px;font-size:clamp(3.5rem,7.6vw,5.2rem)}
  .sub-hero-lead{max-width:660px}
  .sub-hero-stage{max-width:none}
  .sub-examples-grid{grid-template-columns:1fr;gap:32px}
  .sub-examples h2{max-width:660px}
}
@media(max-width:600px){
  .sub-hero-grid{gap:37px;padding:49px 0 62px}
  .sub-hero h1{font-size:clamp(2.75rem,10.25vw,4.2rem);line-height:1.045;margin-bottom:23px}
  .sub-hero-lead{font-size:13px;line-height:1.7}
  .sub-hero-actions{align-items:flex-start;flex-direction:column;gap:15px;margin-top:25px}
  .sub-hero-actions .sub-button{min-width:152px}
  .sub-hero-motion{border-radius:8px}
  .sub-examples{padding:76px 0}
  .sub-examples-grid{gap:26px}
  .sub-examples h2{font-size:clamp(2.35rem,8.7vw,3.5rem)}
  .sub-example-player{border-radius:8px}
  .sub-example-player .studio-poster-play{width:54px;height:54px}
}
