.cinema-hero{position:relative;isolation:isolate;grid-template-columns:1fr 1.12fr;gap:34px;min-height:690px;padding-block:72px 70px}.cinema-hero .hero-copy{position:relative;z-index:3}.cinema-hero h1{font-size:clamp(46px,4.7vw,74px)}.cinema-hero .intro{max-width:540px}.cinema-art{position:relative;height:490px;min-width:0;perspective:1200px;isolation:isolate}.cinema-beam{position:absolute;inset:-180px -40px -40px -100px;z-index:-1;background:linear-gradient(119deg,transparent 38%,#f5cb8b08 43%,#efb56e29 49%,#ffdca65c 54%,#efb56e1a 62%,transparent 69%);filter:blur(22px);transform-origin:80% 0;animation:cinema-light 12s ease-in-out infinite}.cinema-floor{position:absolute;left:-28%;right:-5%;height:170px;bottom:-65px;background:radial-gradient(ellipse at 63% 35%,#e4ae6852,transparent 64%);transform:rotate(-4deg);filter:blur(14px)}.cinema-desktop{position:absolute;left:0;top:45px;width:91%;border:1px solid #d2ac6e;border-radius:14px 14px 8px 8px;overflow:hidden;background:#29251d;box-shadow:0 22px 40px #0008,2px -1px 2px #ffe3b980;transform:rotateY(-8deg) rotateZ(-3deg);animation:cinema-arrive 1.5s cubic-bezier(.2,.7,.2,1) both}.cinema-chrome{height:32px;padding:7px 17px;background:linear-gradient(110deg,#24221c,#342d21);font-size:9px;letter-spacing:4px;color:#e3bf87}.cinema-page{background:#e7dbc4;color:#24221b}.cinema-nav{padding:20px 22px;display:flex;justify-content:space-between;font-size:11px;gap:10px}.cinema-nav>span{font-size:9px;color:#5e5545}.cinema-content{display:grid;grid-template-columns:48% 52%;height:300px}.cinema-copy{padding:40px 0 25px 22px;z-index:1}.cinema-copy>strong{font:clamp(28px,2.7vw,42px)/1.08 Fraunces;letter-spacing:-.055em;display:block}.cinema-copy p{font-size:12px;color:#5c5142;line-height:1.65;margin-top:18px}.cinema-demo-cta{display:inline-block;background:#25231d;color:#f6eddb;font-size:11px;padding:12px 19px;margin-top:20px;position:relative;overflow:hidden}.cinema-demo-cta:after{content:'';position:absolute;inset:0;transform:translateX(-150%);background:linear-gradient(110deg,transparent,#fff5db38,transparent);animation:cinema-cta 9s ease-in-out 2s infinite}.cinema-image{overflow:hidden;margin:0 18px 0 0;position:relative}.cinema-image img{height:100%;width:100%;object-fit:cover;animation:cinema-image-reveal 1.8s cubic-bezier(.2,.7,.2,1) both}.cinema-edge{position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(125deg,transparent 40%,#fff7d820 49%,transparent 58%);background-size:300% 100%;animation:cinema-polish 12s ease-in-out infinite}.cinema-mobile{position:absolute;right:0;bottom:4px;width:153px;padding:6px;border:1px solid #d1a15f;border-radius:28px;background:#22221b;box-shadow:9px 12px 25px #0008,2px -1px 2px #ffe4b8;transform:rotateZ(2deg);animation:cinema-phone-arrive 1.6s .2s cubic-bezier(.2,.7,.2,1) both}.cinema-mobile-page{background:#eee3ce;border-radius:21px;overflow:hidden;padding:17px 11px 14px;color:#27231c}.cinema-mobile-nav{display:flex;justify-content:space-between;font-size:8px;gap:4px;margin:8px 0 13px}.cinema-mobile-page img{width:100%;height:148px;object-fit:cover}.cinema-mobile-page strong{display:block;font:23px/1.05 Fraunces;letter-spacing:-.055em;margin-top:13px}.cinema-mobile-page p{font-size:7px;color:#514838;margin-top:10px;line-height:1.5}.cinema-mobile-page .cinema-demo-cta{font-size:8px;padding:8px 12px;margin-top:12px}.cinema-controls{grid-column:2;display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:-22px;color:#b7ac99;font-size:11px;position:relative;z-index:3}.cinema-pause{background:none;border:0;color:#c7baa5;font-size:11px;text-decoration:underline;text-underline-offset:4px;padding:10px 0;cursor:pointer}.cinema-stopped .cinema-art *,.cinema-stopped .cinema-art *:after,.cinema-offscreen .cinema-art *,.cinema-offscreen .cinema-art *:after{animation-play-state:paused!important}
@keyframes cinema-arrive{from{opacity:0;transform:translateY(25px) rotateY(-8deg) rotateZ(-3deg)}to{opacity:1;transform:translateY(0) rotateY(-8deg) rotateZ(-3deg)}}@keyframes cinema-phone-arrive{from{opacity:0;transform:translateY(35px) rotateZ(2deg)}to{opacity:1;transform:translateY(0) rotateZ(2deg)}}@keyframes cinema-image-reveal{from{clip-path:inset(0 0 100% 0);transform:scale(1.07)}to{clip-path:inset(0);transform:scale(1)}}@keyframes cinema-light{0%,100%{opacity:.55;transform:rotate(-3deg) translateX(-12px)}50%{opacity:1;transform:rotate(3deg) translateX(12px)}}@keyframes cinema-polish{0%,20%{background-position:100% 0}70%,100%{background-position:0 0}}@keyframes cinema-cta{0%,60%{transform:translateX(-150%)}90%,100%{transform:translateX(150%)}}
@media(min-width:901px) and (max-height:650px){.cinema-hero{padding-top:38px;min-height:540px;padding-bottom:35px}.cinema-art{height:400px}.cinema-content{height:255px}.cinema-copy{padding-top:25px}.cinema-mobile{width:132px}.cinema-mobile-page img{height:116px}.cinema-mobile-page strong{font-size:21px}.cinema-hero .hero-note{margin-top:22px}.cinema-controls{margin-top:-15px}}
@media(max-width:1100px) and (min-width:901px){.cinema-hero{gap:24px}.cinema-content{height:270px}.cinema-copy{padding-top:25px;padding-left:16px}.cinema-copy>strong{font-size:29px}.cinema-copy p{font-size:10px}.cinema-mobile{width:128px}.cinema-mobile-page img{height:120px}.cinema-mobile-page strong{font-size:20px}.cinema-art{height:440px}}
@media(max-width:900px){.cinema-hero{grid-template-columns:1fr;gap:20px;padding-block:42px 45px;min-height:0}.cinema-art{width:min(640px,100%);height:480px;margin:auto}.cinema-controls{grid-column:1;width:min(640px,100%);margin:0 auto}.cinema-copy>strong{font-size:38px}.cinema-hero .hero-note{display:block;margin-top:22px}.cinema-beam{inset:-70px 0 -40px -20px}.cinema-floor{left:0;right:0}.cinema-content{height:300px}}
@media(max-width:550px){.cinema-hero{gap:15px;padding-top:32px}.cinema-hero h1{font-size:42px}.cinema-hero .intro{font-size:16px;line-height:1.7;margin-top:22px}.cinema-hero .actions{margin-top:24px}.cinema-hero .hero-note{font-size:11px;margin-top:18px}.cinema-art{height:325px;margin-top:8px}.cinema-desktop{top:27px;width:92%;border-radius:9px}.cinema-chrome{height:22px;padding:4px 10px;font-size:7px}.cinema-nav{padding:13px 12px;font-size:8px}.cinema-nav>span{font-size:6px}.cinema-content{height:213px;grid-template-columns:49% 51%}.cinema-copy{padding:22px 0 15px 12px}.cinema-copy>strong{font-size:25px}.cinema-copy p{font-size:8px;margin-top:13px}.cinema-demo-cta{font-size:8px;padding:8px 11px;margin-top:14px}.cinema-image{margin-right:9px}.cinema-mobile{width:104px;padding:4px;border-radius:20px;right:2px;bottom:0}.cinema-mobile-page{padding:11px 7px 10px;border-radius:15px}.cinema-mobile-nav{font-size:5px;margin:5px 0 9px}.cinema-mobile-page img{height:91px}.cinema-mobile-page strong{font-size:16px;margin-top:9px}.cinema-mobile-page p{font-size:5px;margin-top:7px}.cinema-mobile-page .cinema-demo-cta{font-size:6px;padding:6px 8px;margin-top:8px}.cinema-controls{font-size:10px;gap:8px}.cinema-pause{font-size:10px;min-height:44px}.cinema-beam{filter:blur(15px)}.cinema-floor{bottom:-20px;height:100px}}
@media(max-width:360px){.cinema-copy>strong{font-size:22px}.cinema-content{height:197px}.cinema-art{height:306px}.cinema-mobile{width:94px}.cinema-mobile-page img{height:80px}.cinema-mobile-page strong{font-size:15px}.cinema-hero h1{font-size:38px}}
.cinema-stopped .cinema-desktop,.cinema-stopped .cinema-mobile,.cinema-stopped .cinema-image img{animation:none!important;opacity:1;clip-path:none}
.cinema-mobile-page strong{font-size:19px}.cinema-image img{object-position:center}.cinema-hero .cinema-mobile-page img{max-width:100%}.cinema-hero:before{content:'';position:absolute;inset:0 -20px;z-index:-2;background:radial-gradient(ellipse at 85% 65%,#8c673215,transparent 55%);pointer-events:none}
@media(max-width:1100px) and (min-width:901px){.cinema-mobile-page strong{font-size:16px}}
@media(min-width:901px) and (max-height:650px){.cinema-mobile-page strong{font-size:16px}.cinema-hero{padding-top:24px;gap:20px 34px}.cinema-art{height:365px}.cinema-hero h1{font-size:56px}.cinema-hero .intro{font-size:16px;margin-top:20px}.cinema-hero .actions{margin-top:23px}.cinema-controls{margin-top:0}.cinema-desktop{top:28px}}
@media(max-width:550px){.cinema-mobile-page strong{font-size:13px}}
@media(max-width:360px){.cinema-mobile-page strong{font-size:11px}}
@media(prefers-reduced-motion:reduce){.cinema-art *,.cinema-art *:after{animation:none!important}.cinema-pause{display:none}.cinema-beam{opacity:.75}}
