/* Three compositions, one shared purchase flow. No duplicate forms or player. */
.hero-sound,.look-switch,dialog::backdrop{backdrop-filter:none}

/* 02 / CINEMA — immersive film, offset typography, portrait movie as the stage. */
html[data-look=cinema]{--bg:#10241d;--ink:#f3efe3;--accent:#c5d09f;--border:#ffffff35;--paper:#fffdf7;color-scheme:dark}
[data-look=cinema] body{background:#10241d}
[data-look=cinema] .ambient{background:radial-gradient(ellipse at 10% 80%,#617a4338,transparent 60%);z-index:1}
[data-look=cinema] .ambient span{opacity:.08}
[data-look=cinema] #snow{z-index:3;opacity:.18}
[data-look=cinema] .header{position:relative;z-index:6;border-bottom:1px solid #ffffff16}
[data-look=cinema] .brand{color:#f5f0de}
[data-look=cinema] .brand>span{color:#c4cba2}
[data-look=cinema] .header-actions>button{color:#d4ddc8}
[data-look=cinema] .look-switch{background:#10241df2;border-color:#ffffff26}
[data-look=cinema] .look-switch button{color:#becab7}
[data-look=cinema] .look-switch button[aria-pressed=true]{background:#d6dfba;color:#203828}
[data-look=cinema] .hero{position:static;align-items:flex-start;justify-content:center;width:100%;padding:65px 7vw 80px;margin:0;flex:1;min-height:calc(100svh - 130px);pointer-events:none}
[data-look=cinema] .hero-copy,[data-look=cinema] .conversion{pointer-events:auto}
[data-look=cinema] .hero-copy{position:relative;text-align:left;width:47%;z-index:4;padding:0}
[data-look=cinema] .hero-copy .eyebrow{color:#c5ccad;letter-spacing:2px;font-size:9px}
[data-look=cinema] h1{font:400 clamp(58px,5.5vw,88px)/.97 var(--serif);letter-spacing:-2.5px;margin:27px 0 25px;color:#f7f0de}
[data-look=cinema] h1 em{color:#dfbe92}
[data-look=cinema] .subtitle{max-width:300px;margin:0;color:#c0cdb9;font-size:13px;line-height:1.9}
[data-look=cinema] .examples{position:absolute;inset:0;margin:0;width:100%;height:100svh;overflow:hidden;z-index:0;pointer-events:none}
[data-look=cinema] .examples:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#10241d 0%,#10241d 30%,#10241ddd 42%,#10241d21 68%,#10241d12 100%);z-index:2;pointer-events:none}
[data-look=cinema] .main-example{position:absolute;inset:0 0 0 auto;width:65%;height:100%;max-width:none;padding:0;transform:none;pointer-events:auto;z-index:1}
[data-look=cinema] .video-frame{width:100%;height:100%;aspect-ratio:auto;border-radius:0;box-shadow:none;background:#10241d}
[data-look=cinema] #hero-video{object-fit:cover;object-position:58% 35%;opacity:.94}
[data-look=cinema] .video-kicker{display:none}
[data-look=cinema] .hero-sound{left:auto;right:32px;top:110px;bottom:auto;transform:none;background:#10241dce;color:#fff6dc;border:1px solid #ffffff4d;font-size:10px;padding:8px 13px}
[data-look=cinema] .hero-play{right:170px;top:113px;background:#10241dce;color:#fff6dc}
[data-look=cinema] .example-caption{left:auto;right:33px;bottom:177px;width:auto;gap:35px;color:#fff6dc;font:italic 22px var(--serif);text-shadow:0 2px 15px #000}
[data-look=cinema] .sample{top:auto;bottom:55px;width:73px!important;height:auto;border:1px solid #ffffff45;border-radius:3px;background:#122b22;padding:3px;transform:none;box-shadow:0 7px 25px #0004;pointer-events:auto;z-index:4}
[data-look=cinema] .sample>img{aspect-ratio:3/4;height:auto;border-radius:1px}
[data-look=cinema] .sample>span{display:none}
[data-look=cinema] .sample-a{left:auto;right:207px}
[data-look=cinema] .sample-b{left:auto;right:120px}
[data-look=cinema] .sample-c{left:auto;right:33px}
[data-look=cinema] .sample-d,[data-look=cinema] .gallery-star{display:none}
[data-look=cinema] .sample:hover{transform:translateY(-7px);border-color:#f9e2bb}
[data-look=cinema] .conversion{position:relative;z-index:4;width:43%;align-items:flex-start;padding:0;margin-top:33px}
[data-look=cinema] .main-buttons{flex-direction:column;align-items:stretch;width:300px;gap:11px}
[data-look=cinema] .cta{width:100%;min-width:0;border-radius:3px;min-height:54px;padding:14px 18px;font-size:12px}
[data-look=cinema] .cta-photo{background:#11271fc9;border-color:#7f90725c;color:#edf1dc}
[data-look=cinema] .cta-photo:hover{background:#244133}
[data-look=cinema] .cta-video{background:#dfbe92;border-color:#dfbe92;color:#183326;box-shadow:none}
[data-look=cinema] .cta-video:hover{background:#f1d2ab}
[data-look=cinema] .under-cta{color:#b4c1a6;text-align:left;max-width:300px;font-size:9px;line-height:1.8;margin-top:16px}
[data-look=cinema] .under-cta>span{color:#dfbe92}
[data-look=cinema] .preview-notice{color:#9db18f;text-align:left;max-width:300px;font-size:8px}
[data-look=cinema] .footer{position:relative;z-index:5;color:#9eae91}
[data-look=cinema] .footer>p{color:#d1d9c8;text-shadow:0 1px 8px #10241d}
[data-look=cinema] dialog{--ink:#304336;--accent:#96383d;--border:#dedfd2;--paper:#fffdf7;color-scheme:light}
[data-look=cinema] dialog::backdrop{background:#06140fe8}

/* 03 / POSTER — strict grid, oversized sans type, red editorial punctuation. */
html[data-look=poster]{--bg:#faf9f6;--ink:#252b23;--accent:#cc3e2f;--border:#dcdcd2;--paper:#fffefa;color-scheme:light}
[data-look=poster] body{background:#faf9f6}
[data-look=poster] .ambient{background:linear-gradient(90deg,transparent calc(50% - .5px),#252b2312 50%,transparent calc(50% + .5px))}
[data-look=poster] .ambient span{display:none}
[data-look=poster] #snow{opacity:.14}
[data-look=poster] .header{height:88px;border-bottom:1px solid #292e2526}
[data-look=poster] .brand{font:800 30px/1 var(--sans);letter-spacing:-1.5px;color:#252b23}
[data-look=poster] .brand>span{font-size:32px;color:#cc3e2f}
[data-look=poster] .look-switch{border-radius:0;background:#faf9f6;border:1px solid #292e2526;padding:0}
[data-look=poster] .look-switch button{border-radius:0;padding:9px 15px;letter-spacing:0;font-size:10px}
[data-look=poster] .look-switch button[aria-pressed=true]{background:#cc3e2f;color:white}
[data-look=poster] .header-actions>button{color:#454b3f}
[data-look=poster] .hero{width:min(1180px,calc(100% - 120px));margin:auto;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;align-content:center;align-items:start;gap:30px 55px;padding:32px 0;flex:1}
[data-look=poster] .hero-copy{grid-column:1;grid-row:1;text-align:left;padding-top:22px}
[data-look=poster] .hero-copy .eyebrow{color:#5e6755;font-size:8px;letter-spacing:1.7px}
[data-look=poster] h1{font:750 clamp(47px,4.8vw,73px)/1.02 var(--sans);letter-spacing:-4px;margin:28px 0 25px}
[data-look=poster] h1 em{font-style:normal;color:#cc3e2f}
[data-look=poster] .subtitle{max-width:310px;margin:0;font-size:12px;color:#6c7464;line-height:1.9}
[data-look=poster] .examples{grid-column:2;grid-row:1/3;position:relative;width:100%;height:570px;margin:0;overflow:visible}
[data-look=poster] .main-example{position:absolute;top:0;height:100%;left:65%;width:70%;max-width:350px;padding-top:22px;padding-bottom:30px;transform:translateX(-50%);z-index:2}
[data-look=poster] .video-frame{width:100%;height:100%;border-radius:0;box-shadow:none;background:#e9e7df}
[data-look=poster] .video-frame:before{content:"";position:absolute;inset:0;border:1px solid #292e251a;pointer-events:none;z-index:2}
[data-look=poster] #hero-video{object-fit:cover}
[data-look=poster] .video-kicker{top:0;left:0;transform:none;text-align:left;font-size:7px;letter-spacing:1px;color:#777d70}
[data-look=poster] .video-kicker i{background:#cc3e2f}
[data-look=poster] .hero-sound{border-radius:0;border:0;bottom:14px;font-size:10px;background:#fffdf4f0}
[data-look=poster] .hero-play{border-radius:0;background:#fffdf4f0}
[data-look=poster] .example-caption{font:500 10px/1.6 var(--sans);color:#777d70;bottom:0;padding:0}
[data-look=poster] .example-caption>span:last-child{font-size:20px;color:#cc3e2f}
[data-look=poster] .sample{left:0;right:auto;width:82px!important;padding:0;border-radius:0;transform:none;background:transparent;box-shadow:none;z-index:3}
[data-look=poster] .sample>img{height:auto;aspect-ratio:3/4;border-radius:0;filter:saturate(.6)}
[data-look=poster] .sample>span{white-space:normal;font:400 8px/1.5 var(--sans);padding:6px 0;color:#7e8578}
[data-look=poster] .sample i{display:none}
[data-look=poster] .sample-a{top:42px}
[data-look=poster] .sample-b{top:221px}
[data-look=poster] .sample-c{top:400px}
[data-look=poster] .sample-d,[data-look=poster] .gallery-star{display:none}
[data-look=poster] .sample:hover{transform:translateX(5px)}
[data-look=poster] .sample:hover>img{filter:none}
[data-look=poster] .conversion{grid-column:1;grid-row:2;width:100%;align-items:flex-start;margin-top:4px;padding:0}
[data-look=poster] .main-buttons{flex-direction:column;align-items:stretch;width:min(100%,360px);gap:0;border-top:1px solid #252b23}
[data-look=poster] .cta{min-width:0;width:100%;border:0;border-bottom:1px solid #252b23;border-radius:0;background:none;box-shadow:none;color:#252b23;padding:18px 0;min-height:68px;font-size:13px}
[data-look=poster] .cta-video{color:#cc3e2f}
[data-look=poster] .cta:hover{background:none;transform:translateX(5px)}
[data-look=poster] .cta b{font-weight:700;font-size:15px}
[data-look=poster] .cta i{font-size:23px;margin-left:18px}
[data-look=poster] .under-cta,[data-look=poster] .preview-notice{text-align:left;max-width:340px}
[data-look=poster] .under-cta{margin-top:18px;font-size:9px;line-height:1.9}
[data-look=poster] .preview-notice{font-size:8px;color:#919787}
[data-look=poster] .footer{border-top:1px solid #292e2526;padding-top:10px;min-height:46px}
[data-look=poster] dialog,[data-look=poster] .button,[data-look=poster] .plan-tabs>button{border-radius:0}
[data-look=poster] h2{font:650 30px/1.15 var(--sans);letter-spacing:-1.2px}

@media(min-width:701px) and (max-height:780px){
 [data-look=cinema] .hero{padding-block:30px 45px}
 [data-look=cinema] h1{font-size:64px;margin-block:18px}
 [data-look=cinema] .conversion{margin-top:22px}
 [data-look=poster] .hero{padding-block:17px;gap:15px 50px}
 [data-look=poster] .hero-copy{padding-top:4px}
 [data-look=poster] h1{font-size:56px;margin-block:20px}
 [data-look=poster] .examples{height:490px}
 [data-look=poster] .sample{width:69px!important}
 [data-look=poster] .sample-a{top:30px}[data-look=poster] .sample-b{top:184px}[data-look=poster] .sample-c{top:338px}
 [data-look=poster] .cta{min-height:58px;padding-block:13px}
}
@media(min-width:701px) and (max-width:1050px){
 [data-look=cinema] .hero{padding-left:5vw}
 [data-look=cinema] .hero-copy{width:53%}
 [data-look=cinema] h1{font-size:65px}
 [data-look=poster] .hero{width:calc(100% - 70px);gap:25px 35px}
 [data-look=poster] h1{font-size:49px;letter-spacing:-2.8px}
 [data-look=poster] .sample{width:59px!important}
 [data-look=poster] .main-example{left:67%;width:66%}
}
@media(max-width:700px){
 [data-look=cinema] .header{border:0;height:66px}
 [data-look=cinema] .brand{font-size:29px}
 [data-look=cinema] .look-switch{bottom:12px;border:1px solid #8a9a7059;box-shadow:0 4px 20px #0004;white-space:nowrap}
 [data-look=cinema] .look-switch button{font-size:9px;padding-inline:12px}
 [data-look=cinema] .hero{min-height:0;padding:20px 26px 20px;justify-content:flex-end;flex:1;position:relative}
 [data-look=cinema] .hero-copy{width:100%;padding:0;margin-top:185px}
 [data-look=cinema] .hero-copy .eyebrow{font-size:6px;letter-spacing:1.3px}
 [data-look=cinema] h1{font-size:54px;letter-spacing:-1.9px;line-height:1;margin:17px 0 13px}
 [data-look=cinema] .subtitle{font-size:11px;max-width:245px;color:#c2cdb6;line-height:1.8;margin:0}
 [data-look=cinema] .examples{position:fixed;inset:0;height:100svh;width:100%;z-index:0}
 [data-look=cinema] .main-example{width:100%;height:74%;inset:0 0 auto;max-width:none;padding:0}
 [data-look=cinema] #hero-video{object-position:52% 28%;object-fit:cover;opacity:.9}
 [data-look=cinema] .examples:after{z-index:2;background:linear-gradient(0deg,#10241d 3%,#10241d 13%,#10241df0 29%,#10241da6 47%,#10241d00 73%,#10241d99 100%)}
 [data-look=cinema] .hero-sound{right:19px;top:80px;font-size:9px;padding:6px 10px}
 [data-look=cinema] .hero-play{right:auto;left:20px;top:83px}
 [data-look=cinema] .example-caption,[data-look=cinema] .sample-d{display:none}
 [data-look=cinema] .sample{display:block;top:299px;bottom:auto;width:38px!important;padding:2px;background:#10241dbb;border-color:#ffffff55}
 [data-look=cinema] .sample-a{left:auto;right:115px}[data-look=cinema] .sample-b{left:auto;right:67px}[data-look=cinema] .sample-c{left:auto;right:19px}
 [data-look=cinema] .conversion{width:100%;padding:0;margin-top:22px;align-items:flex-start}
 [data-look=cinema] .main-buttons{width:100%;flex-direction:row;gap:8px}
 [data-look=cinema] .cta{padding:12px 11px;min-height:52px;font-size:10px;border-radius:3px}
 [data-look=cinema] .cta b{font-size:11px}
 [data-look=cinema] .under-cta{font-size:8px;margin-top:12px;max-width:100%}
 [data-look=cinema] .preview-notice{font-size:8px;max-width:100%;margin-top:5px}
 [data-look=cinema] .footer{margin:0 auto;width:calc(100% - 50px);padding-bottom:63px;min-height:102px;align-content:flex-start}
 [data-look=cinema] .footer>p{font-size:7px;max-width:170px}
 [data-look=cinema] .footer>button{font-size:8px;color:#c3cdb6}
 [data-look=poster] .header{height:66px;width:calc(100% - 36px)}
 [data-look=poster] .brand{font-size:25px}
 [data-look=poster] .brand>span{font-size:25px}
 [data-look=poster] .look-switch{bottom:12px;border-radius:0;background:#faf9f6;white-space:nowrap}
 [data-look=poster] .look-switch button{padding:7px 12px;font-size:9px;min-height:34px}
 [data-look=poster] .ambient{background:none}
 [data-look=poster] .hero{width:calc(100% - 42px);display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;gap:17px 0;padding:22px 0 16px;align-content:center;min-height:0}
 [data-look=poster] .hero-copy{grid-column:1/3;grid-row:1;padding:0}
 [data-look=poster] .hero-copy .eyebrow{font-size:6px;letter-spacing:1.2px}
 [data-look=poster] h1{font-size:40px;letter-spacing:-2.4px;line-height:1.02;margin:16px 0 12px}
 [data-look=poster] h1 br:nth-of-type(2){display:none}
 [data-look=poster] h1 em:before{content:" "}
 [data-look=poster] .subtitle{font-size:9px;max-width:280px;line-height:1.8}
 [data-look=poster] .examples{grid-column:1/3;grid-row:2;height:275px;width:100%;margin:0;overflow:visible}
 [data-look=poster] .main-example{left:auto;right:0;top:0;width:72%;height:100%;max-width:none;padding:0 0 19px;transform:none}
 [data-look=poster] .video-kicker{display:none}
 [data-look=poster] .video-frame{width:100%;height:100%}
 [data-look=poster] #hero-video{object-fit:cover;object-position:50% 42%}
 [data-look=poster] .hero-sound{font-size:8px;padding:5px 9px;bottom:8px}
 [data-look=poster] .example-caption{font-size:7px}
 [data-look=poster] .example-caption>span:last-child{font-size:17px}
 [data-look=poster] .sample{width:62px!important;left:0;right:auto;top:auto;bottom:auto;transform:none}
 [data-look=poster] .sample>img{aspect-ratio:1;height:auto}
 [data-look=poster] .sample>span{font-size:6px;line-height:1.3;padding:3px 0 0}
 [data-look=poster] .sample-a{top:0}[data-look=poster] .sample-b{top:90px}[data-look=poster] .sample-c{top:180px}
 [data-look=poster] .conversion{grid-column:1/3;grid-row:3;width:100%;margin:0;padding:0}
 [data-look=poster] .main-buttons{width:100%;flex-direction:row;gap:16px}
 [data-look=poster] .cta{min-height:52px;padding:12px 0;font-size:10px;border-bottom:1px solid #252b23;gap:6px}
 [data-look=poster] .cta b{font-size:11px}
 [data-look=poster] .cta svg{display:none}
 [data-look=poster] .under-cta{font-size:8px;margin-top:11px;line-height:1.7}
 [data-look=poster] .preview-notice{font-size:8px;margin-top:4px}
 [data-look=poster] .footer{width:calc(100% - 42px);min-height:93px;padding-top:10px;padding-bottom:60px}
 [data-look=poster] .footer>p{font-size:7px;max-width:165px}
 [data-look=poster] .footer>button{font-size:8px}
 [data-look=poster] h2{font-size:25px}
}
@media(max-width:700px) and (max-height:740px){
 [data-look=cinema] .hero-copy{margin-top:115px}
 [data-look=cinema] h1{font-size:47px}
 [data-look=poster] .hero{padding-top:15px;gap:12px}
 [data-look=poster] h1{font-size:34px}
 [data-look=poster] .examples{height:230px}
 [data-look=poster] .sample{width:48px!important}
 [data-look=poster] .sample-b{top:76px}[data-look=poster] .sample-c{top:152px}
}
@media(prefers-reduced-motion:reduce){.sample:hover,.cta:hover{transform:none!important}}
