/* Balanced reading: retain the opening narrative; keep practical content in flow. */
.balanced-reading .process-stage{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8%}
.balanced-reading .process-dial{display:none}
.balanced-reading .process-list{display:block;padding:0}
.balanced-reading .process-list li{position:relative;top:auto;min-height:0!important;transform:none!important;opacity:1!important;background:none;box-shadow:none;border:0;border-top:1px solid #bfb9a9;padding:28px 0;gap:24px}
.balanced-reading .process-list h3{font-size:27px;line-height:1.5}
.balanced-reading .process-list p{font-size:17px;line-height:1.85;margin:12px 0}
.balanced-reading .process-list small{font-size:14px;color:#64605a}
.balanced-reading .effect-meter i:after{display:none}
.balanced-reading .faq .typed-char{opacity:1!important}
.balanced-reading .faq h2.is-typing:after{display:none}
@media(max-width:999px){.balanced-reading .process-stage{grid-template-columns:1fr;gap:36px}}
@media(max-width:600px){.balanced-reading .process-list h3{font-size:23px}.balanced-reading .process-list p{font-size:16px}.balanced-reading.motion-on .film-intro-foot{display:flex;flex-direction:column;align-items:flex-start;bottom:23%;max-width:86%;gap:16px}.balanced-reading.motion-on .film-intro-foot p{font:16px/1.8 var(--sans)}.balanced-reading.motion-on .film-intro-foot p>span{font:13px/1.7 var(--sans);margin-top:10px;white-space:normal}.balanced-reading.motion-on .film-intro-foot .button{font-size:15px;min-height:44px}}
/* v7: desktop reading scale and an editorial interaction collection. */
/* 首屏定位與摘要後聯絡入口；沿用既有品牌與動畫。 */
.film-intro-foot p{max-width:27em;font-size:20px;line-height:1.7}
.film-intro-foot p>span{display:block;font:14px/1.8 var(--sans);letter-spacing:0;margin-top:12px}
.film-intro-foot>.button{flex-shrink:0}
.motion-on .film-intro-foot{flex-direction:column;align-items:flex-start;gap:18px;max-width:46%;bottom:12%}
@media(max-width:800px){.motion-on .film-intro-foot{max-width:86%;gap:12px}.motion-on .film-intro-foot .button{margin-top:0}}
.brief-contact-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px;margin:24px 0 12px}
.brief-contact-actions .button{margin:0}
#copy-line,#copy-brief{min-height:44px}
#brief-output{scroll-margin-top:110px}
#brief-output .form-note,#line-status{overflow-wrap:anywhere}
.contact-copy>.text-link{display:inline-flex;min-height:44px;align-items:center;margin-top:18px}
@media(max-width:800px){.film-intro-foot p{font-size:17px;max-width:26em}.film-intro-foot p>span{font-size:13px}.brief-contact-actions{align-items:stretch;flex-direction:column}.brief-contact-actions .button{justify-content:space-between}}
@media(min-width:601px) and (max-width:800px){.motion-on .film-intro-foot{max-width:38%}.film-intro-foot p{font-size:17px}.film-intro-foot p>span{font-size:13px}}
:root{--ink:#262626;--muted:#64605a;--red:#ad382a}
.cinema{--film-ink:#262626}
.site-header nav{font-size:18px;gap:30px}#motion-toggle{font-size:16px;min-height:44px}.button.small{font-size:18px}.brand-descriptor{font-size:12px}
footer{flex-wrap:wrap;gap:26px}footer>span{font-size:18px}footer small{font-size:15px}footer>a:last-child,footer #replay-logo{font-size:16px;min-height:44px;display:inline-flex;align-items:center}footer .brand-footer{margin-right:20px}
.scene-logo{width:clamp(160px,15vw,240px);height:auto;display:block}.film-brand-nav>span:first-child{letter-spacing:0}.film-brand-nav>span:nth-child(2){font-size:16px;letter-spacing:2px}.film-brand-nav>small{font-size:14px}
.film-brand-photo,.landing-screen-photo,.landing-phone-photo{background-image:url('assets/studio-design-v7.webp');background-size:cover;background-position:52% center}
.film-brand-photo>span{font-size:24px;writing-mode:horizontal-tb;letter-spacing:3px;right:auto;left:7%;bottom:7%;background:#221e1bcc;padding:12px 20px}
.film-brand-photo:after{background:linear-gradient(0deg,#221a1855,transparent 45%)}
.film-brand-description{font-size:20px;line-height:1.9}.film-brand-copy .text-link{font-size:18px}.film-brand-bottom span{font-size:13px}.film-brand-bottom strong{font-size:26px}
.film-system{background:#252323;color:#f6f0e6}.film-system:before{background:linear-gradient(120deg,#74372b33,transparent 65%)}.film-system-heading h2 span{color:#edbdac}.film-system-heading>p:last-child,.film-system-bottom>p{color:#e0d8cd;font-size:18px}.film-system-bottom .text-link{font-size:18px}.landing-desktop{border-color:#aca398}.landing-screen-bar{background:#e5ded2}.landing-screen-bar>span:last-child{font-size:13px}.landing-screen-copy{color:#272424}.landing-screen-copy p{font-size:16px}.landing-screen-copy a{background:#a33b2d;font-size:14px}.landing-screen-foot{font-size:13px}.landing-phone{border-color:#252323}.landing-phone-camera,.landing-phone-home{background:#252323}.landing-phone-nav{color:#272424}.landing-phone-copy{color:#272424}.landing-phone-copy>span{background:#a33b2d;color:#fff8ef}.film-stage[data-tone=dark] .film-nav button:not([aria-current]){background:#322a28;color:#f4eee4}
.film-paper-drawing{gap:18px;right:7%;bottom:27%;font-family:var(--sans)}.film-paper-drawing>span{padding:0;width:clamp(110px,10vw,164px);height:clamp(110px,10vw,164px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;border-color:#9c8b7a;background:color-mix(in srgb,#b33425 calc(var(--circle-focus,0)*100%),#f3edde);color:color-mix(in srgb,#fff9ef calc(var(--circle-focus,0)*100%),#292523);transform:scale(calc(1 + var(--circle-focus,0)*.25));box-shadow:0 14px 30px rgb(126 45 30 / calc(var(--circle-focus,0)*.18));position:relative}.film-paper-drawing b{font:34px var(--serif);font-weight:600}.film-paper-drawing small{font-size:16px;letter-spacing:0}.film-paper-drawing i{width:36px;background:#a88e76}.film-paper-drawing>span[data-complete=true]{border-color:#b33425}.film-paper-drawing>span[data-active=true]{border-color:#b33425;z-index:1}.film-paper>p{max-width:38%;font-size:24px}.film-paper>strong{font-size:clamp(58px,6.3vw,100px);margin-top:4%;line-height:1.3}.film-paper-head{letter-spacing:2px}.film-paper-sign small{font-size:16px}
.film-bottom,.motion-on .film-bottom{font-size:14px}.film-nav button{font-size:14px;min-height:44px;padding:10px 14px}.film-nav button>span{font-size:14px}
/* Distinct component scope keeps the older preview rules out of the new theatre. */
.effects{background:#eee9df}.effects-stage{position:relative;min-width:0}.effects-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:38px}.effects-heading .eyebrow{font-size:13px;letter-spacing:2px;margin-bottom:20px}.effects-heading h2{font:clamp(38px,3.4vw,64px)/1.25 var(--serif);margin:0}.effects-heading em{font-style:normal;color:var(--red)}.effects-heading>p{font-size:18px;line-height:1.8;color:#625c53;max-width:28em}
.effects-layout{display:grid;grid-template-columns:27% minmax(0,1fr);gap:4%;min-width:0}.effect-tabs{display:flex;flex-direction:column;justify-content:center}.effect-tabs button{display:flex;align-items:center;gap:20px;padding:22px 14px;min-height:78px;background:transparent;border:0;border-top:1px solid #c7beae;text-align:left;color:#292523;position:relative}.effect-tabs button:last-child{border-bottom:1px solid #c7beae}.effect-number{font:16px Georgia;color:#9c3a2d}.effect-tabs strong{display:block;font:27px var(--serif)}.effect-tabs small{font-size:15px;color:#655d53;display:block;margin-top:7px}.effect-tabs button>span:last-child{margin-left:auto;color:#847464}.effect-tabs button[aria-selected=true]{background:#dfd4c1;box-shadow:inset 3px 0 #b33425}.effect-tabs button[aria-selected=true] strong{color:#a32d22}.effect-tabs button:hover{background:#e5ddce}
.effect-workbench{background:#f7f3eb;border:1px solid #bbb1a1;box-shadow:14px 18px 0 #d6cdbd;min-width:0;display:flex;flex-direction:column}.effect-toolbar{display:flex;justify-content:space-between;gap:16px;padding:16px 24px;background:#292625;color:#f4ede2;font-size:12px;letter-spacing:1.4px;flex-shrink:0}.effect-viewport{position:relative;min-width:0}.effects-ready .effect-viewport{height:480px;overflow:hidden}.effect-panel{position:relative;overflow:hidden;min-height:460px}.effects-ready .effect-panel{height:100%;min-height:0}.effect-panel[hidden]{display:none!important}.effect-panel:focus-visible{outline-offset:-5px}.effect-eyebrow{font:13px var(--sans);letter-spacing:2px}.type-demo{padding:7% 7%;display:flex;flex-direction:column;justify-content:center;background:#f8f4ec}.reveal-title{font:clamp(42px,4.6vw,78px)/1.35 var(--serif);letter-spacing:-.04em;margin:22px 0}.reveal-title>span{display:block;overflow:hidden;padding-bottom:.08em}.reveal-title>span:last-child{color:#b13728}.reveal-title i{display:inline-block;font-style:normal}.effect-detail{font-size:18px;color:#655c52;margin-top:12px}.type-rule{height:2px;width:28%;background:#a93226;margin-top:24px}
.mask-demo{background:#2c2723}.mask-demo>img{width:100%;height:100%;object-fit:cover;display:block;min-height:460px}.effects-ready .mask-demo>img{min-height:0}.mask-caption{position:absolute;bottom:9%;left:6%;background:#f5efe8ee;padding:22px 28px;max-width:85%}.mask-caption small{font-size:12px;letter-spacing:2px}.mask-caption h3{font:clamp(30px,3vw,48px)/1.3 var(--serif);margin-top:12px}.image-corner{position:absolute;right:5%;top:7%;font-size:12px;letter-spacing:2px;color:white;text-shadow:0 2px 10px #000}
.depth-demo{background:#ddd3c3;isolation:isolate}.depth-photo{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover;filter:brightness(.7)}.depth-word{position:absolute;top:3%;left:-3%;font:clamp(70px,11vw,180px)/1 Georgia;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px #fff9;white-space:nowrap}.depth-paper{position:absolute;right:9%;bottom:8%;width:45%;background:#f7f0e3;padding:32px;box-shadow:15px 28px 35px #25160e50}.depth-paper>img{width:145px;height:auto}.depth-paper>small{display:block;font-size:10px;letter-spacing:1px;margin:24px 0 14px}.depth-paper h3{font:clamp(28px,3vw,46px)/1.3 var(--serif)}.depth-paper p{font-size:16px;line-height:1.8;margin-top:16px}
.gallery-track{display:flex;width:255%;height:100%;will-change:transform}.gallery-page{width:33.3333%;height:100%;flex-shrink:0;position:relative;padding:40px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border-right:10px solid #f6f0e6}.gallery-page small{font-size:15px;letter-spacing:2px}.gallery-page h3{font:clamp(35px,4vw,64px)/1.3 var(--serif);margin:25px 0}.gallery-page p{font-size:17px;margin-top:20px}.gallery-intro{background:#e0d3bb}.gallery-intro>img{position:absolute;right:8%;bottom:12%;width:120px;height:120px;opacity:.8}.gallery-work{padding:0;color:#fff8e8}.gallery-work>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.46)}.gallery-work>div{position:relative;padding:40px}.gallery-next{background:#a33728;color:#fff5e7}.gallery-next .button{background:#f6efe2;color:#302523;font-size:18px;padding:18px 24px}.gallery-next p{opacity:.8}
.pointer-demo{background:#ded5c6;padding:26px 6%;display:flex;align-items:center;justify-content:center;flex-direction:column;perspective:1000px}.pointer-demo>.effect-eyebrow{align-self:flex-start;font-size:12px}.pointer-card{position:relative;isolation:isolate;overflow:hidden;background:#f9f5ec;border:1px solid #bfae96;padding:28px 36px;box-shadow:12px 22px 30px #47332326;width:min(90%,520px);margin:22px auto;transform-style:preserve-3d}.pointer-card>img{width:180px;height:auto}.pointer-card h3{font:clamp(30px,3vw,48px)/1.35 var(--serif);margin:22px 0}.magnetic-cta{background:#aa3426;color:#fff8ef;padding:17px 21px;display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:18px;position:relative;z-index:2;transition:background .2s}.magnetic-cta:hover,.magnetic-cta:focus-visible{background:#78271f}.magnetic-cta span{transition:transform .2s}.magnetic-cta:hover span{transform:translate(3px,-3px)}.pointer-shine{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at var(--shine-x,50%) 0%,#fff,transparent 65%)}.pointer-hint{font-size:15px;line-height:1.6;text-align:center;max-width:38em}
.effect-controls{display:flex;align-items:center;gap:20px;min-height:68px;padding:12px 24px;border-top:1px solid #c6bbab;background:#f5f0e6;flex-shrink:0}.effect-controls[hidden]{display:none}.effect-controls button{background:transparent;border:0;border-bottom:1px solid #a23728;color:#892f24;padding:10px 0;font-size:16px;min-height:44px;white-space:nowrap}.effect-controls label{display:flex;align-items:center;gap:15px;flex:1;font-size:15px;margin:0;white-space:nowrap}.effect-controls input{min-width:50px;width:100%;accent-color:#ac3527;height:30px}.effect-controls output{font:16px var(--sans);text-align:right;font-variant-numeric:tabular-nums;min-width:3em}.effect-controls button:disabled{color:#79726a;border-color:#b8aea0;cursor:default}.effect-explanation{display:flex;align-items:center;justify-content:space-between;gap:35px;margin-top:32px}.effect-explanation p{font-size:17px;line-height:1.7;max-width:45em}.effect-explanation a{font-size:16px;flex-shrink:0}.effect-meter{display:flex;gap:28px;align-items:center;margin-top:28px;font-size:13px;letter-spacing:1px;color:#6c6254}.effect-meter i{height:1px;background:#c9bcaa;flex:1;position:relative}.effect-meter i:after{content:"";position:absolute;inset:0;background:#b13c2a;transform:scaleX(var(--section-progress,0));transform-origin:left}
.lower-pinned .effects{height:460svh;padding:0}.lower-pinned .effects-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));padding:28px 5% 20px;display:flex;flex-direction:column;overflow:clip}.lower-pinned .effects-heading{margin-bottom:24px;flex-shrink:0}.lower-pinned .effects-heading .eyebrow{margin-bottom:12px;font-size:12px}.lower-pinned .effects-heading h2{font-size:clamp(36px,3vw,52px)}.lower-pinned .effects-heading>p{font-size:17px}.lower-pinned .effects-layout{flex:1;min-height:0}.lower-pinned .effect-workbench{min-height:0}.lower-pinned .effect-viewport{height:auto;flex:1;min-height:0}.lower-pinned .effect-tabs button{padding:16px 14px;min-height:0;flex:1;max-height:102px}.lower-pinned .effect-tabs strong{font-size:25px}.lower-pinned .effect-tabs small{font-size:14px}.lower-pinned .effect-explanation{margin-top:25px;gap:30px;flex-shrink:0}.lower-pinned .effect-explanation p,.lower-pinned .effect-explanation a{font-size:16px}.lower-pinned .effect-meter{margin-top:16px;font-size:12px;flex-shrink:0}
/* The process maintains a consistent landing position while each paper arrives differently. */
.lower-pinned .process{height:320svh}.lower-pinned .process-stage{grid-template-columns:40% minmax(0,1fr);gap:5%;padding-left:5%;padding-right:5%}.lower-pinned .process-list{height:410px}.lower-pinned .process-list li{padding:36px;background:#f8f2e6}.lower-pinned .process-list p{font-size:19px}.lower-pinned .process-list small{font-size:15px;color:#696052}.lower-pinned .process-list li>span:after{font-size:11px}.lower-pinned .process-intro>p{font-size:19px}.lower-pinned .process-intro .eyebrow{font-size:13px}.process-skip{font-size:17px}.lower-pinned .process-watermark{opacity:.45}
.faq{grid-template-columns:1fr 1.1fr;gap:8%}.faq h2{font-size:clamp(36px,3.4vw,56px);line-height:1.45}.faq .eyebrow{font-size:14px}.faq-list summary{font-size:21px;line-height:1.7;min-height:44px;align-items:center}.faq-list p{font-size:18px;line-height:1.9}.typed-char{display:inline}.faq h2.is-typing:after{content:"";display:inline-block;width:2px;height:.8em;background:#ac3527;margin-left:6px}
.contact{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5%;padding:105px 5%}.contact h2{font-size:clamp(42px,4vw,72px);line-height:1.45}.contact-copy>p:not(.eyebrow){font-size:22px;line-height:1.9}.contact-copy .eyebrow{font-size:14px}.contact #brief-form{padding:40px;align-self:center}.contact label{font-size:19px;margin-bottom:12px}.contact select,.contact textarea,.contact #brief-text{font-size:20px;line-height:1.7;padding:16px;min-width:0}.contact textarea{min-height:140px}.contact .button{font-size:21px;min-height:60px}.contact .form-note{font-size:16px;line-height:1.9}.contact #copy-status,.contact #copy-brief{font-size:17px}.contact .contact-mark{margin-top:35px;opacity:.9}
/* Tablet and phone are flowing editorial layouts, not a scaled-down desktop stage. */
@media(max-height:850px) and (min-width:1000px){.lower-pinned .effects-stage{padding-top:20px}.lower-pinned .effects-heading{margin-bottom:16px}.lower-pinned .effects-heading h2{font-size:34px}.lower-pinned .effects-heading>p{font-size:16px}.lower-pinned .effects-heading .eyebrow{font-size:11px}.lower-pinned .effect-toolbar{padding:11px 20px}.lower-pinned .effect-controls{padding:8px 20px;min-height:56px}.lower-pinned .effect-tabs strong{font-size:22px}.lower-pinned .effect-tabs small{font-size:13px}.lower-pinned .effect-tabs button{padding:9px 12px}.lower-pinned .effect-explanation{margin-top:20px}.lower-pinned .effect-explanation p,.lower-pinned .effect-explanation a{font-size:14px}.lower-pinned .effect-meter{margin-top:10px}.reveal-title{font-size:clamp(38px,4vw,62px);margin:16px 0}.type-demo{padding:20px 6%}.effect-detail{font-size:16px}.pointer-demo{padding:16px 5%}.pointer-card{padding:18px 28px;margin:12px auto}.pointer-card>img{width:145px}.pointer-card h3{font-size:30px;margin:14px 0}.pointer-hint{font-size:13px}.depth-paper{padding:22px}.depth-paper>small{margin:15px 0 10px}.depth-paper h3{font-size:32px}.depth-paper p{font-size:14px;margin-top:10px}.lower-pinned .process-list{height:350px}.lower-pinned .process-list p{font-size:17px}.lower-pinned .process-list h3{font-size:32px}.film-brand-description{font-size:18px}.film-brand-copy h2{font-size:clamp(44px,4.6vw,68px)}}
@media(min-width:1800px){.site-header nav{font-size:20px}#motion-toggle{font-size:18px}.film-paper-drawing b{font-size:40px}.film-paper-drawing small{font-size:20px}.effect-tabs strong,.lower-pinned .effect-tabs strong{font-size:30px}.effect-tabs small,.lower-pinned .effect-tabs small{font-size:17px}.effect-explanation p,.lower-pinned .effect-explanation p{font-size:19px}.effect-controls label,.effect-controls button{font-size:18px}.effect-toolbar{font-size:14px}.effect-detail{font-size:21px}}
@media(max-width:1100px){.site-header nav{gap:18px;font-size:16px}.button.small{font-size:16px}#motion-toggle{font-size:14px}.brand-descriptor{display:none}.effect-tabs small{font-size:14px}.effects-layout{grid-template-columns:27% minmax(0,1fr);gap:3%}.effects-heading>p{font-size:16px}.effect-explanation{display:block}.effect-explanation a{margin-top:10px}.contact h2{font-size:42px}.contact #brief-form{padding:30px}.contact select,.contact textarea{font-size:18px}.contact-copy>p:not(.eyebrow){font-size:20px}.film-brand-description{font-size:17px}.film-brand-bottom strong{font-size:20px}.film-brand-nav>span:nth-child(2){font-size:14px}}
@media(max-width:999px){.effects-layout{grid-template-columns:1fr;gap:24px}.effects-heading{display:block}.effects-heading>p{margin-top:24px;font-size:18px}.effect-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}.effect-tabs button{display:block;padding:14px 10px;min-height:100px;border-bottom:1px solid #c7beae}.effect-tabs strong{font-size:21px;margin-top:9px}.effect-tabs small,.effect-tabs button>span:last-child{display:none}.effect-tabs button[aria-selected=true]{box-shadow:inset 0 -3px #b33425}.effects-ready .effect-viewport{height:440px}.reveal-title{font-size:clamp(40px,7vw,70px)}.effect-explanation{margin-top:30px}.effect-explanation p{font-size:17px}.effect-explanation a{margin-top:16px}.process-list p{font-size:18px}.process-list small{font-size:14px}.process-list h3{font-size:30px}.faq{grid-template-columns:1fr;gap:36px}.contact{grid-template-columns:1fr;gap:36px;padding:75px 7%}.contact h2{font-size:clamp(38px,6vw,58px)}.contact .contact-mark{display:none}.contact #brief-form{padding:32px}.film-brand-nav>small{font-size:11px}.film-brand-nav>span:nth-child(2){font-size:12px}.film-brand-bottom span{font-size:10px}.film-brand-bottom strong{font-size:18px}.film-paper-drawing{right:7%;gap:12px}.film-paper-drawing>span{width:100px;height:100px}.film-paper-drawing b{font-size:28px}.film-paper-drawing small{font-size:12px}.film-paper-drawing i{width:20px}.film-paper>strong{font-size:58px;margin-top:10%}.film-paper>p{font-size:20px}.film-system-heading>p:last-child,.film-system-bottom>p{font-size:14px}.landing-screen-copy p{font-size:13px}.landing-screen-copy a{font-size:12px}.landing-screen-bar>span:last-child{font-size:10px}}
@media(max-width:600px){.site-header nav{gap:12px}#motion-toggle{font-size:13px}.button.small{font-size:14px}.site-header{padding-left:5%;padding-right:5%}.effects{padding:60px 6%}.effects-heading h2{font-size:36px}.effects-heading .eyebrow{font-size:10px;letter-spacing:1px}.effects-heading>p{font-size:16px}.effect-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.effect-tabs button{min-height:82px;padding:12px 10px}.effect-tabs strong{font-size:19px}.effect-tabs .effect-number{font-size:13px}.effect-tabs button:nth-child(4),.effect-tabs button:nth-child(5){border-top:0}.effect-toolbar{padding:13px 15px;font-size:10px;letter-spacing:.8px}.effects-ready .effect-viewport{height:390px}.effect-controls{padding:10px 14px;gap:12px;flex-wrap:wrap}.effect-controls button{font-size:14px}.effect-controls label{font-size:13px;gap:8px}.effect-controls output{font-size:13px;min-width:3em}.effect-eyebrow{font-size:10px;letter-spacing:1px}.reveal-title{font-size:clamp(33px,8vw,45px);letter-spacing:-.05em;margin:26px 0}.effect-detail{font-size:15px;max-width:15em}.type-demo{padding:30px 7%}.mask-caption{padding:18px;bottom:9%;left:6%}.mask-caption h3{font-size:30px}.mask-caption small{font-size:10px}.image-corner{font-size:10px}.depth-paper{width:70%;right:5%;bottom:5%;padding:22px}.depth-paper h3{font-size:33px}.depth-paper>small{margin:18px 0 12px;font-size:9px}.depth-paper p{font-size:15px}.depth-word{font-size:80px;top:5%}.gallery-track{width:285%}.gallery-page{padding:24px;border-right-width:8px}.gallery-work>div{padding:24px}.gallery-page h3{font-size:35px}.gallery-page small{font-size:12px}.gallery-page p{font-size:14px}.gallery-intro>img{width:70px;height:70px;bottom:8%}.gallery-next .button{font-size:15px;padding:15px}.pointer-demo{padding:20px 6%}.pointer-demo>.effect-eyebrow{font-size:9px}.pointer-card{width:100%;padding:23px;margin:22px 0}.pointer-card>img{width:145px}.pointer-card h3{font-size:32px}.magnetic-cta{font-size:15px;padding:15px}.pointer-hint{font-size:13px}.effect-explanation p{font-size:16px}.effect-explanation a{font-size:15px}.effect-meter{font-size:11px;gap:15px;line-height:1.5}.effect-meter span{max-width:14em}.effect-workbench{box-shadow:7px 9px 0 #d6cdbd}
.film-paper{padding:8%}.film-paper-head{font-size:10px;letter-spacing:1px}.film-paper>strong{font-size:38px;margin-top:12%;line-height:1.45}.film-paper>p{position:absolute;bottom:17%;left:8%;max-width:84%;font:15px/1.8 var(--sans);margin:0}.film-paper-drawing{left:8%;right:8%;bottom:37%;gap:10px;justify-content:space-between}.film-paper-drawing>span{width:75px;height:75px;flex-shrink:0;gap:5px}.film-paper-drawing b{font-size:23px}.film-paper-drawing small{font-size:10px}.film-paper-drawing i{width:auto;flex:1}.film-paper-sign{font-size:24px;bottom:7%;padding-top:15px}.film-paper-sign small{font-size:10px;letter-spacing:0}.film-brand-nav .scene-logo{width:145px}.film-brand-nav>small{font-size:10px}.film-brand-photo>span{font-size:15px;padding:8px 12px}.motion-on .film-brand-copy h2{font-size:34px}.film-brand-description{font-size:14px!important;line-height:1.8}.film-brand-copy .text-link{font-size:14px}.film-brand-bottom strong{font-size:13px}.film-brand-bottom span{font-size:8px}.motion-on .film-brand-bottom strong{font-size:13px}.motion-on .film-brand-bottom span{font-size:8px}.motion-on .film-bottom{font-size:11px;bottom:76px}.film-nav button{font-size:12px;min-height:40px;padding:9px 10px}.film-nav button>span{font-size:12px}.film-system-heading>p:last-child{font-size:13px!important}.film-system-bottom>p{font-size:12px!important}.film-system-bottom .text-link{font-size:14px}.landing-screen-bar .scene-logo{width:135px}.landing-screen-copy p{font-size:12px}.landing-screen-copy a{font-size:12px}.landing-screen-foot{font-size:10px}.landing-screen-bar>span:last-child{font-size:9px}.landing-screen-copy{column-gap:8px}.landing-screen-copy h3{font-size:24px}
.process-list p{font-size:16px}.process-list small{font-size:13px}.process-list h3{font-size:25px}.process-list li{min-height:260px!important}.faq h2{font-size:34px}.faq .eyebrow{font-size:12px}.faq-list summary{font-size:18px}.faq-list p{font-size:16px}.contact h2{font-size:35px}.contact-copy>p:not(.eyebrow){font-size:18px}.contact #brief-form{padding:26px 20px}.contact label{font-size:17px}.contact select,.contact textarea,.contact #brief-text{font-size:16px;padding:13px}.contact .button{font-size:18px}.contact .form-note{font-size:14px}.contact #copy-status{font-size:15px}footer{display:flex;flex-direction:column;align-items:flex-start;gap:16px}footer>span{font-size:17px}footer small{font-size:14px;line-height:1.8}footer>a:last-child,footer #replay-logo{font-size:16px}}
@media(max-width:360px){.site-header nav{gap:8px}#motion-toggle{font-size:12px}.button.small{font-size:12px}.effects-heading h2{font-size:31px}.effect-controls label{order:3;flex-basis:75%}.effect-controls output{margin-left:auto}.effect-controls{gap:4px 12px}.effects-ready .effect-viewport{height:365px}.effect-tabs strong{font-size:17px}.pointer-card{padding:20px}.pointer-card h3{font-size:28px}.film-paper-drawing{gap:7px;left:6%;right:6%}.film-paper-drawing>span{width:67px;height:67px}.film-paper-drawing small{font-size:9px}.film-paper>strong{font-size:32px}.film-paper>p{font-size:14px}.contact h2{font-size:30px}.contact #brief-form{padding:22px 16px}.faq h2{font-size:30px}.contact .button{font-size:16px}}
/* No-script readers get every sample in ordinary flow. */
.effects:not(.effects-ready) .effect-tabs,.effects:not(.effects-ready) .effect-meter{display:none}.effects:not(.effects-ready) .effects-layout{display:block}.effects:not(.effects-ready) .gallery-track{width:100%;height:auto;display:block;transform:none}.effects:not(.effects-ready) .gallery-page{width:100%;min-height:380px}.effects:not(.effects-ready) .effect-panel{border-bottom:1px solid #b9ad9c}.effects:not(.effects-ready) .effect-toolbar{display:none}
html:not(.motion-on) .effect-panel *{transition:none!important}
/* Fit the interactive content to the actual theatre, including shorter desktops. */
.effects-ready .effect-viewport{container-type:size}.pointer-card{flex-shrink:0}.type-demo{padding-top:24px;padding-bottom:24px}.type-rule{flex-shrink:0}
@container (max-height: 440px){.type-demo .reveal-title{font-size:clamp(36px,6.4cqw,62px);margin:16px 0}.type-demo .effect-detail{font-size:16px;margin-top:10px}.type-demo .type-rule{margin-top:18px}.pointer-demo{padding:16px 5%}.pointer-card{display:grid;grid-template-columns:125px 1fr;align-items:center;column-gap:26px;width:min(96%,630px);margin:12px auto;padding:22px}.pointer-card>img{width:125px}.pointer-card h3{font-size:34px;margin:0;line-height:1.35}.magnetic-cta{grid-column:1/-1;margin-top:18px;padding:13px 20px;font-size:17px}.pointer-hint{font-size:13px}.depth-paper{padding:20px;width:47%;bottom:10%}.depth-paper>img{width:115px}.depth-paper>small{font-size:10px;margin:14px 0 10px}.depth-paper h3{font-size:34px;line-height:1.25}.depth-paper p{font-size:15px;line-height:1.6;margin-top:12px}}
@container (max-width: 500px){.pointer-card{display:block;width:100%;padding:20px}.pointer-card>img{width:130px}.pointer-card h3{font-size:30px;margin:14px 0;line-height:1.3}.magnetic-cta{font-size:15px;margin-top:0}.depth-paper{width:70%;padding:22px}.type-demo .reveal-title{font-size:clamp(29px,9.3cqw,42px)}.type-demo .effect-detail{font-size:15px}}
@container (max-height: 330px) and (min-width: 501px){.pointer-card{grid-template-columns:100px 1fr;padding:15px 22px;margin:8px auto}.pointer-card>img{width:100px}.pointer-card h3{font-size:28px}.magnetic-cta{margin-top:12px;padding:11px 16px;font-size:16px}.pointer-demo>.effect-eyebrow{font-size:10px}.pointer-hint{font-size:12px}.depth-paper{padding:18px}.depth-paper>img{width:100px}.depth-paper>small{margin:10px 0 8px;font-size:9px}.depth-paper h3{font-size:29px}.depth-paper p{font-size:13px;margin-top:8px}.type-demo .reveal-title{font-size:44px;margin:12px 0}.type-demo .effect-eyebrow{font-size:11px}.type-demo .effect-detail{font-size:15px}.type-demo .type-rule{margin-top:12px}}
html:not(.motion-on) .effects-ready .effect-viewport:has(.gallery-demo:not([hidden])){height:auto;container-type:normal}html:not(.motion-on) .gallery-demo{height:auto}html:not(.motion-on) .gallery-track{display:block;width:100%;transform:none!important}html:not(.motion-on) .gallery-page{width:100%;min-height:350px}html:not(.motion-on) .depth-photo{transform:scale(1.2)!important}html:not(.motion-on) .depth-word,html:not(.motion-on) .depth-paper{transform:none!important}
@media(max-width:600px){.motion-on .film-brand-bottom{padding-top:14px;padding-bottom:100px}.motion-on .film-brand-bottom>div>span{display:none}.motion-on .film-brand-bottom strong{font-size:13px;line-height:1.5;margin-top:0}.motion-on .film-brand-bottom>div{padding-top:10px}}
@media(max-width:360px){.site-header .brand-svg{width:106px}.site-header #motion-toggle{font-size:12px}.site-header .button.small{font-size:12px;padding:9px}.site-header nav{gap:9px}.site-header .button.small span{display:none}}
/* v7.1: one page identity, and a readable pace for each effect. */
.film-brand-nav>span.scene-label{font:14px var(--sans);letter-spacing:2px;color:#746a5d}
#effect-play-status{font-size:13px;color:#6a5d50;min-width:10em}.effect-controls{gap:15px}.effect-controls label{min-width:100px}.effect-skip{font-size:14px;letter-spacing:0;color:#7f3027;min-height:32px;display:flex;align-items:center;border-bottom:1px solid #a99983}.effect-meter a{flex-shrink:0}
@media(max-width:1100px){#effect-play-status{font-size:12px;min-width:0}.effect-controls{flex-wrap:wrap}.effect-controls label{min-width:120px}}
@media(max-width:600px){.film-brand-nav>span.scene-label{font-size:11px;letter-spacing:1px}#effect-play-status{font-size:12px;margin-left:auto}.effect-controls label{order:3;flex-basis:65%}.effect-controls output{order:4}.effect-controls{gap:8px 12px}.effect-meter{flex-wrap:wrap}.effect-meter span{max-width:none}.effect-meter i{min-width:35px}}
/* Touch theatre: a complete scene fits the phone, with deliberate swipe navigation. */
.mobile-showcase.effects{height:460svh;padding:0}
.mobile-showcase .effects-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));padding:14px 5% 10px;display:flex;flex-direction:column;overflow:clip}
.mobile-showcase .effects-heading{margin:0 0 12px;flex-shrink:0}
.mobile-showcase .effects-heading .eyebrow{font-size:9px;margin:0 0 8px;letter-spacing:1px}
.mobile-showcase .effects-heading h2{font-size:28px;line-height:1.25}
.mobile-showcase .effects-heading>p{display:none}
.mobile-showcase .effects-layout{display:flex;flex-direction:column;gap:12px;flex:1;min-height:0}
.mobile-showcase .effect-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));flex-shrink:0}
.mobile-showcase .effect-tabs button{min-height:62px;padding:7px 4px;text-align:center}
.mobile-showcase .effect-tabs strong{font-size:15px;line-height:1.3;margin-top:5px;letter-spacing:0}
.mobile-showcase .effect-tabs .effect-number{font-size:12px}
.mobile-showcase .effect-workbench{flex:1;min-height:0}
.mobile-showcase .effect-toolbar{padding:10px 12px;font-size:9px;flex-shrink:0}
.mobile-showcase .effect-viewport{height:auto;flex:1;min-height:0}
.mobile-showcase .effect-controls{padding:4px 12px;gap:0 10px;min-height:0}
.mobile-showcase .effect-controls button{font-size:13px;min-height:36px;padding:6px 0}
.mobile-showcase #effect-play-status{font-size:11px}
.mobile-showcase .effect-controls label{font-size:12px;order:3;flex-basis:65%;min-width:0}
.mobile-showcase .effect-controls input{height:28px;margin:0}
.mobile-showcase .effect-controls output{font-size:12px;order:4}
.mobile-showcase .effect-explanation{margin-top:12px;flex-shrink:0}
.mobile-showcase .effect-explanation p{font-size:13px;line-height:1.5;margin:0}
.mobile-showcase .effect-explanation>a{display:none}
.mobile-showcase .effect-meter{margin-top:6px;gap:8px;flex-wrap:nowrap;font-size:10px;letter-spacing:0;flex-shrink:0}
.mobile-showcase .effect-skip{font-size:12px;min-height:32px}
.mobile-showcase .effect-meter i{min-width:8px}
.mobile-showcase .pointer-card{touch-action:none;user-select:none}
.mobile-showcase .pointer-demo{padding:12px 5%}
.mobile-showcase .pointer-demo>.effect-eyebrow{display:none}
.mobile-showcase .pointer-card{margin:8px auto;padding:16px}
.mobile-showcase .pointer-card>img{width:110px}
.mobile-showcase .pointer-card h3{font-size:28px;margin:10px 0}
.mobile-showcase .pointer-hint{font-size:12px;margin:6px 0}
.mobile-showcase .magnetic-cta{font-size:14px;padding:12px}
.mobile-showcase .depth-paper{padding:16px;bottom:12%;width:74%}
.mobile-showcase .depth-paper h3{font-size:28px}
.mobile-showcase .depth-paper>small{margin:8px 0;font-size:9px}
.mobile-showcase .depth-paper p{font-size:13px;margin-top:8px}
.mobile-showcase .gallery-page h3{font-size:30px}
.mobile-showcase .gallery-page{padding:20px}
@media(max-height:780px){
.mobile-showcase .effects-stage{padding-top:10px}
.mobile-showcase .effects-heading .eyebrow{display:none}
.mobile-showcase .effects-heading h2{font-size:23px}
.mobile-showcase .effects-heading{margin-bottom:8px}
.mobile-showcase .effects-layout{gap:8px}
.mobile-showcase .effect-tabs button{min-height:54px;padding:5px 3px}
.mobile-showcase .effect-tabs strong{font-size:14px}
.mobile-showcase .effect-explanation{margin-top:8px}
.mobile-showcase .type-demo{padding:14px 7%}
.mobile-showcase .type-demo .reveal-title{font-size:30px;margin:12px 0}
.mobile-showcase .type-demo .effect-detail{font-size:14px}
.mobile-showcase .depth-paper>img{width:90px}
.mobile-showcase .depth-paper h3{font-size:25px}
.mobile-showcase .pointer-card h3{font-size:25px}
.mobile-showcase .pointer-card{padding:12px;margin:4px auto}
.mobile-showcase .pointer-card>img{width:90px}
}
@media(max-width:360px){.mobile-showcase .effect-tabs strong{display:block;width:2em;margin:5px auto 0;word-break:normal}}

/* Studio contact details: desktop columns, independent mobile rows. */
.studio-footer .footer-contact{flex:0 0 100%;width:100%;display:grid;grid-template-columns:1fr 1fr 1fr 1.35fr;gap:28px;padding:12px 0 38px;margin:0 0 10px;border-bottom:1px solid #c9c1b3;font-style:normal}
.footer-contact>div,.footer-contact>a{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:10px;text-decoration:none;color:var(--ink)}
.footer-contact span{font:14px var(--sans);letter-spacing:.12em;color:var(--red)}
.footer-contact strong{font:500 clamp(18px,1.4vw,25px)/1.5 var(--sans);overflow-wrap:anywhere}
.footer-contact .footer-contact-intro strong{font:28px/1.5 var(--serif)}
.footer-contact small{font:15px/1.7 var(--sans);color:var(--muted)}
.footer-contact a:hover strong{color:var(--red);text-decoration:underline;text-underline-offset:6px}
.footer-contact a:focus-visible{outline:2px solid var(--red);outline-offset:8px}
@media(max-width:1000px){.studio-footer .footer-contact{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:600px){.studio-footer .footer-contact{grid-template-columns:1fr;gap:0;padding-bottom:24px}.footer-contact>div,.footer-contact>a{padding:20px 0;border-bottom:1px solid #d8d1c5}.footer-contact>:last-child{border-bottom:0}.footer-contact strong{font-size:21px}.footer-contact small{font-size:14px}}