/* The approved PDF frame and Base-inspired media rhythm, with the original films. */
:root{--paper:#fff;--ink:#111;--dark:#000;--red:#ed190b;--muted:#626262;--line:#222;--header:64px;--footer:56px;--micro-duration:150ms;--font:-apple-system,BlinkMacSystemFont,Inter,"Segoe UI",Arial,sans-serif;background:#fff;color:#000}
html{scroll-padding-top:84px}
body{padding:var(--header) 8px var(--footer);background:#fff}
.site-header{position:fixed;inset:0 8px auto;padding:0;height:var(--header);display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid #222;background:#fff;z-index:20}
.wordmark{font-size:19px;font-weight:750;letter-spacing:-.06em;color:#000}
.header-actions{display:flex;align-items:center;gap:18px}
.review-label{font-size:12px;color:#666;white-space:nowrap}
body[data-gallery="true"] .review-label{display:none}
main,body[data-gallery="true"] main{display:block;padding:0;flex:1;width:100%;min-width:0}
.view{animation:arrive .2s ease-out both}
.intro{display:grid;place-items:center;max-width:none;min-height:calc(100svh - var(--header) - var(--footer));padding:28px 16px 42px}
.name-form{width:min(550px,100%)}
.sticker,.small-sticker{position:relative;width:100%;height:auto;aspect-ratio:618/451;container-type:inline-size;border:0;border-radius:0;box-shadow:none;background:transparent url('/assets/name-sticker.png') center / contain no-repeat;overflow:visible}
.sticker .sticker-top,.small-sticker .sticker-top{position:absolute;top:13.4%;left:8%;width:78%;height:auto;display:block;transform:rotate(.65deg);color:#fff;text-align:center}
.sticker .hello,.small-sticker .hello{display:block;font-size:12.2cqw;font-weight:850;letter-spacing:-.025em;line-height:.88}
.sticker .my-name,.small-sticker .my-name{display:block;font-size:5.45cqw;font-weight:750;letter-spacing:-.035em;line-height:1.05;margin-top:.45cqw}
.sticker .sticker-space,.small-sticker .sticker-space{position:absolute;top:44%;left:9%;width:76%;height:28%;min-height:0;display:flex;align-items:center;justify-content:center;padding:0;background:transparent;transform:rotate(.65deg)}
.sticker-space:focus-within{box-shadow:none}
.sticker-bottom{display:none}
.name-entry{height:100%;display:flex;align-items:center}
.sticker-space input,.written-name,.small-sticker .written-name{padding:0 8px;font-family:"Noteworthy","Bradley Hand","Segoe Print",var(--font);font-style:italic;font-size:11cqw;font-weight:650;letter-spacing:-.065em;line-height:1.05;color:#000}
.small-sticker .written-name[data-long-name="true"]{font-size:7.5cqw}
.name-prompt{font-size:11cqw;gap:0}
.name-caret{height:1em;width:2px;flex-basis:2px;background:var(--red)}
.instruction{margin:0;font-size:14px}
.text-button{font-size:16px;font-weight:500;margin-top:5px;gap:22px}
.text-button:hover{color:var(--red)}
.site-footer{position:fixed;inset:auto 8px 0;z-index:20;height:var(--footer);padding:0;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:12px;background:#fff;border-top:1px solid #222;color:#000}
.frame-button{border:1px solid #222;border-radius:0;background:#fff;color:#000;padding:5px 10px;font-size:14px;min-width:64px;min-height:32px;font-weight:400}
.frame-button:hover{background:#000;color:#fff}
.site-footer nav{display:flex;align-items:center;gap:14px}
.site-footer nav button{position:relative;border:0;background:none;padding:12px 0;font-size:14px;color:#777}
.site-footer nav button[aria-current="page"]{color:#000}
.site-footer nav button[aria-current="page"]::after{content:"";position:absolute;bottom:8px;left:0;right:0;height:1px;background:#000}
.site-footer nav button:hover{color:var(--red)}
.contact{position:relative;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:24px;width:100%;max-width:1600px;min-height:calc(100svh - var(--header) - var(--footer));margin:auto;padding:32px clamp(20px,6vw,90px) 34px}
.contact-body{grid-column:1;grid-row:1;min-width:0}
.eyebrow{font-size:clamp(36px,5vw,76px);font-weight:650;letter-spacing:-.065em;line-height:1.04;color:#000;margin:0 0 8px}
.eyebrow[data-long-name="true"]{font-size:clamp(30px,3.4vw,56px)}
.contact h1{font-size:clamp(64px,8.2vw,145px);font-weight:730;letter-spacing:-.07em;line-height:.9;margin:0 0 22px;color:#000}
.contact h1 span{display:block;white-space:nowrap}
.your-sticker{grid-column:2;grid-row:1;padding:32px 0 0;text-align:center;min-width:0;display:block}
.small-sticker{width:100%;min-width:0;max-width:540px;margin:auto}
.quiet-button{font-size:14px;padding:6px 10px;margin-top:-12px;position:relative}
.intent-group{margin:0;border:0}
.intent-options{gap:4px 24px;margin:0}
.intent-choice{min-height:44px;font-size:16px;gap:8px}
.intent-choice input{width:18px;height:18px;accent-color:var(--red)}
.contact-form{max-width:500px}
#contact-form{max-width:490px}
.field{margin-top:12px}
.field input,.field textarea{border-color:#555;color:#000;font-size:16px;padding:8px 0;line-height:1.4}
.field textarea{min-height:90px;max-height:240px}
.note-field{margin-top:12px;font-size:14px;color:#555}
.note-field summary{cursor:pointer;padding:6px 0}
.note-field .field{margin-top:0}
.form-bottom{margin-top:12px;gap:14px;flex-direction:row-reverse;flex-wrap:nowrap;justify-content:flex-start}
.solid-button{border-radius:0;background:var(--red);font-size:14px;min-height:38px;padding:9px 14px;gap:22px;font-weight:500}
.delivery-note{font-size:12px;max-width:240px;text-align:right;color:#666}
.skip-work{position:absolute;right:clamp(20px,6vw,90px);bottom:38px;border-bottom:1px solid #000;text-decoration:none;padding:4px 0;margin:0;color:#000;font-weight:650;font-size:clamp(20px,2.1vw,30px);letter-spacing:-.045em;gap:26px}
.skip-work:hover{color:var(--red);border-color:var(--red)}
.complete.gallery-page{width:100%;max-width:none;padding:24px 0 32px}
.gallery-page .work-media{border:1px solid #222;overflow:hidden;transition:border-color var(--micro-duration)}
.gallery-page .work-media::after{inset:0;border:0;transition:opacity var(--micro-duration)}
.gallery-page .work-media video{aspect-ratio:auto;object-fit:cover;background:#eee}
.gallery-page .work-item{scroll-margin-top:88px}
.gallery-page .work-gallery{margin:0}
.playback-control{display:flex;gap:7px;border:1px solid #222;padding:0 9px;height:34px;color:#000;font-size:14px}
.disco-label{order:1;margin:0}
.disco-state{display:none}
#playback-toggle{width:26px;height:32px;border:0;border-radius:0;padding:0;order:0}
#playback-toggle::before{inset:10px 0;border-radius:8px;border:1px solid #000;background:#fff;transition:background var(--micro-duration)}
#playback-toggle>span{width:7px;height:7px;margin-left:3px;background:#000;transition:transform var(--micro-duration)}
#playback-toggle[aria-checked="true"]::before{background:var(--red);border-color:var(--red)}
#playback-toggle[aria-checked="true"]>span{transform:translateX(12px);background:#fff}
.playback-control:has([aria-checked="true"]){border-color:var(--red)}
.gallery-page .clients-section{margin:36px 0 0;border-top:1px solid #222;padding-top:22px}
.gallery-page .clients-section .gallery-heading{padding:0 10px;margin-bottom:20px;gap:16px;flex-wrap:wrap}
.gallery-page .clients-section h2{font-size:24px;letter-spacing:-.045em}
.gallery-page .gallery-heading>span{font-size:14px;color:#666;margin-left:auto}
#jump-clients{font-size:14px;text-decoration:none;margin-left:12px}
.gallery-page .client-list{border-color:#bbb}
.gallery-page .client-list li{flex-basis:16.666667%;max-width:16.666667%;border-color:#bbb}
.gallery-page .client-button{background:#fff;min-height:132px;padding:24px;transition:background var(--micro-duration),color var(--micro-duration)}
.gallery-page .client-logo img{transition:filter var(--micro-duration)}
.gallery-page .client-list li:last-child{border-right:1px solid #bbb}
.gallery-empty{border:1px solid #222;margin:0}
.gallery-page .campaign-note .work-media{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:18px;padding:18px;background:#fff;color:#000}
.campaign-note h2{font-size:clamp(20px,2.2vw,40px);font-weight:500;letter-spacing:-.045em;line-height:1.02;max-width:290px;margin:0;white-space:pre-line;transition:transform var(--micro-duration)}
.campaign-note p{font-size:12px;line-height:1.3;margin:0}
.gallery-page .campaign-note-red .work-media{background:var(--red);color:#fff}
.campaign-note-red h2{font-weight:670}
.campaign-note:hover h2{transform:translateY(-3px)}
body[data-disco="true"] .campaign-note h2{animation:note-drift 3.5s ease-in-out infinite alternate}
@keyframes note-drift{from{transform:translateY(-3px)}to{transform:translateY(3px)}}
.playback-control{cursor:pointer}
@keyframes arrive{from{opacity:0}to{opacity:1}}
@media(min-width:1800px){.contact{padding-top:48px}.contact h1{font-size:145px}}
@media(max-width:1000px){.contact{grid-template-columns:1.4fr 1fr;gap:14px;padding:32px 24px}.contact h1{font-size:8.4vw}.eyebrow{font-size:5.2vw}.intent-options{gap:2px 16px}.intent-choice{font-size:14px}.your-sticker{padding-top:45px}.skip-work{right:24px;font-size:22px;bottom:32px}.gallery-page .client-list li{flex-basis:25%;max-width:25%}.gallery-page .client-button{padding:20px;min-height:120px}}
@media(max-width:640px){:root{--header:56px;--footer:54px}body{padding-inline:5px}.site-header,.site-footer{left:5px;right:5px}.wordmark{font-size:17px}.header-actions{gap:8px}.review-label{font-size:12px}.intro{padding:24px 5px 36px}.instruction{margin-top:8px}.text-button{font-size:16px}.site-footer{gap:8px}.site-footer nav{gap:10px}.site-footer nav button{font-size:13px}.frame-button{min-width:56px;min-height:34px;font-size:14px;padding:5px 8px}.contact{display:block;padding:24px 14px 30px;min-height:calc(100svh - var(--header) - var(--footer))}.contact-body{width:100%;position:relative;z-index:1}.eyebrow{font-size:clamp(30px,8.5vw,47px);max-width:53%;margin-bottom:14px;line-height:1.05}.eyebrow[data-long-name="true"]{font-size:clamp(24px,6.3vw,34px)}.contact h1{font-size:15.5vw;line-height:.94;letter-spacing:-.06em;margin-bottom:20px}.contact h1 span{white-space:normal}.your-sticker{position:absolute;z-index:2;top:22px;right:0;width:43%;padding:0;display:block;text-align:center}.small-sticker{width:100%;min-width:0}.quiet-button{font-size:12px;min-height:32px;margin-top:-7px;padding:4px 8px}.intent-options{gap:0 13px}.intent-choice{font-size:14px;gap:6px}.intent-choice input{width:17px;height:17px;flex-basis:17px}.field{margin-top:10px}.field input{font-size:16px}.note-field{margin-top:8px}.form-bottom{gap:12px;align-items:center;justify-content:space-between;margin-top:12px}.delivery-note{font-size:12px;max-width:180px;text-align:left}.solid-button{min-height:42px;font-size:14px}.skip-work{position:static;display:flex;justify-content:space-between;width:max-content;margin:28px 0 0 auto;font-size:22px;gap:18px;min-height:44px}.complete.gallery-page{padding-top:14px}.playback-control{font-size:14px;height:32px;padding:0 7px;gap:6px}.gallery-page .work-media::after{border-width:4px}.gallery-page .clients-section{margin-top:26px;padding-top:20px}.gallery-page .clients-section .gallery-heading{padding:0 8px;margin-bottom:18px;gap:8px}.gallery-page .clients-section h2{font-size:22px}.gallery-page .gallery-heading>span{font-size:12px;max-width:none}.gallery-page .gallery-heading #jump-clients{display:none}.gallery-page .client-list li{flex-basis:33.333333%;max-width:33.333333%}.gallery-page .client-button{padding:18px 12px;min-height:110px}.gallery-page .client-logo img{height:42px;max-width:100%}.gallery-page .client-logo{height:48px}}
@media(max-width:350px){.site-footer nav{gap:8px}.site-footer nav button{font-size:12px}.intent-options{gap:0 9px}.intent-choice{font-size:13px}.gallery-page .client-button{padding:16px 10px}.gallery-page .clients-section .gallery-heading>span{width:100%;margin:0;text-align:left}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Compact, framed feed and tactile campaign panels. */
body[data-gallery="true"]{--header:56px;--footer:50px}
body[data-gallery="true"] .complete.gallery-page{padding-top:20px}
.gallery-page .work-media{border-color:#111}
.gallery-page .work-item{transition:width 250ms ease,height 250ms ease,left 250ms ease,top 250ms ease}
.gallery-page .campaign-note .work-media{gap:12px;padding:14px 10px;container-type:size}
.campaign-note h2{font-size:clamp(20px,17cqw,44px);font-weight:440;line-height:1.02;letter-spacing:-.055em}
.campaign-note p{font-size:clamp(10px,6.5cqw,12px);line-height:1.2}
.gallery-page .campaign-note-red h2{font-size:clamp(28px,24cqw,56px);font-weight:730;transform:translate(var(--type-x,0px),var(--type-y,0px));transition:transform 220ms cubic-bezier(.2,.8,.2,1)}
.gallery-page .scroll-note .work-media{display:block;position:relative;text-align:center}
.scroll-cue{position:absolute;top:10px;left:10px;right:10px;text-align:left;font-size:11px;line-height:1}
.scroll-note .scroll-window{position:absolute;inset:28px 10px 32px;overflow:hidden}
.scroll-reel{height:300%;transform:translateY(var(--reel-y,0px));transition:transform 260ms cubic-bezier(.2,.75,.2,1);will-change:transform}
.scroll-page{display:flex;align-items:center;justify-content:center;height:33.333333%;font-size:clamp(22px,21cqw,46px);line-height:.94;font-weight:450;letter-spacing:-.06em;white-space:pre-line}
.scroll-page:nth-child(2){color:var(--red);font-weight:760;font-size:clamp(24px,24cqw,54px);letter-spacing:-.075em}
.scroll-note .work-media>p{position:absolute;bottom:10px;left:8px;right:8px}
.scroll-rail{position:absolute;top:28px;right:5px;bottom:32px;width:1px;background:#ddd}
.scroll-rail::after{content:"";position:absolute;left:-1px;top:calc(var(--reel-progress,0) * 75%);height:25%;width:3px;background:var(--red);transition:top 260ms cubic-bezier(.2,.75,.2,1)}
body[data-disco="true"] .campaign-note h2{animation:none}
body[data-disco="true"] .campaign-note-red h2{animation:note-drift 2.8s ease-in-out infinite alternate}
body[data-disco="true"] .scroll-reel{animation:reel-disco 7s cubic-bezier(.5,0,.3,1) infinite alternate}
@keyframes reel-disco{0%,15%{transform:translateY(0)}45%,55%{transform:translateY(-33.333333%)}85%,100%{transform:translateY(-66.666667%)}}
@media(min-width:900px){body[data-gallery="true"] .site-header{gap:20px}body[data-gallery="true"] #header-playback{position:absolute;left:50%;transform:translateX(-50%)}.gallery-page .clients-section{margin-top:28px}.gallery-page .client-button{min-height:112px}}
@media(max-width:899px){.gallery-page .work-item{transition:none}}
@media(max-width:640px){body[data-gallery="true"]{--header:56px;--footer:54px}body[data-gallery="true"] .complete.gallery-page{padding-top:10px}}
@media(prefers-reduced-motion:reduce){.scroll-reel{animation:none!important;transform:none!important}.scroll-rail::after{top:0!important}.campaign-note-red h2{transform:none!important}}
.footer-tools,.feed-sizing{display:flex;align-items:center;gap:4px}
.feed-sizing button{width:34px;height:32px;border:1px solid #222;background:#fff;color:#000;font-size:23px;line-height:1;font-weight:300;padding:0}
.feed-sizing button:hover:not(:disabled){background:#000;color:#fff}
.feed-sizing button:disabled{cursor:default;opacity:.2}
@media(min-width:900px){.site-footer nav{position:absolute;left:50%;transform:translateX(-50%)}}
@media(max-width:899px){.feed-sizing{display:none}}
@media(prefers-reduced-motion:reduce){.scroll-note .scroll-window{display:none}.scroll-note .scroll-rail{display:none}.gallery-page .scroll-note h2.sr-only{position:absolute;inset:30px 10px;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;display:flex;align-items:center;justify-content:center;font-size:22px}}

/* Films lift into focus; the full-length player floats above the faded feed. */
html{scrollbar-gutter:stable}
body[data-gallery="true"] #header-playback{position:static;left:auto;transform:none}
.gallery-page .video-panel{display:block;padding:0;text-align:left;cursor:pointer;color:#fff;isolation:isolate;transform:perspective(900px) rotateX(0deg) rotateY(0deg);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .2s}
.gallery-page .video-panel::after{display:none!important}
.gallery-page .video-panel video{transition:transform .65s cubic-bezier(.2,.8,.2,1)}
.film-card-info{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding:14px;background:linear-gradient(transparent 10%,#0009 55%,#000c);opacity:0;transition:opacity .2s;pointer-events:none}
.film-card-info strong{font-size:clamp(14px,1.2vw,20px);font-weight:600;line-height:1.13;letter-spacing:-.03em;max-width:95%;transform:translateY(7px);transition:transform .25s}
.film-card-services{font-size:12px;line-height:1.3;margin-top:6px;color:#fff;transform:translateY(7px);transition:transform .3s}
.film-card-action{font-size:12px;line-height:1.2;margin-top:14px;text-decoration:underline;text-underline-offset:3px}
.film-play-mark{position:absolute;right:10px;top:10px;z-index:3;display:flex;width:28px;height:28px;align-items:center;justify-content:center;border:1px solid #fff9;background:#0003;color:#fff;border-radius:50%;font-size:18px;opacity:0;transition:opacity .2s}
.gallery-page .work-item:has(.video-panel:hover),.gallery-page .work-item:focus-within{z-index:5}
@media(hover:hover) and (pointer:fine){.gallery-page .video-panel:hover,.gallery-page .video-panel:focus-visible{border-color:#111;box-shadow:0 8px 18px #0003;transform:perspective(900px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg)) translateY(-2px)}.video-panel:hover video,.video-panel:focus-visible video{transform:scale(1.055)}}
.video-panel:hover .film-card-info,.video-panel:focus-visible .film-card-info,.video-panel:hover .film-play-mark,.video-panel:focus-visible .film-play-mark{opacity:1}
.video-panel:hover .film-card-info strong,.video-panel:focus-visible .film-card-info strong,.video-panel:hover .film-card-services,.video-panel:focus-visible .film-card-services{transform:translateY(0)}
.gallery-page .video-panel:focus-visible{outline:2px solid #000;outline-offset:2px}
.gallery-page .work-item[data-client-target] .video-panel{border-color:#000;box-shadow:0 0 0 2px #000}
.film-viewer{width:min(1080px,calc(100vw - 64px));max-width:none;max-height:calc(100dvh - 40px);margin:auto;padding:0;border:0;background:transparent;color:#000;overflow:visible}
.film-viewer::backdrop{background:#ffffffe0;backdrop-filter:blur(5px)}
.film-viewer-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding:0 0 16px}
.film-viewer h2{font-size:clamp(22px,3vw,40px);font-weight:600;letter-spacing:-.05em;line-height:1.05;margin:0}
#film-services{margin:8px 0 0;font-size:14px;line-height:1.4}
#film-services[data-pending="true"]{color:#666}
#film-close{width:44px;height:44px;flex:0 0 44px;border:1px solid #000;background:#fff;color:#000;font-size:30px;font-weight:300;line-height:1;padding:0}
#film-close:hover{background:#000;color:#fff}
#full-film{display:block;max-width:100%;width:100%;height:auto;max-height:calc(100dvh - 150px);object-fit:contain;background:#000;margin:0 auto;box-shadow:0 18px 70px #0002}
#film-status{background:#fff;border:1px solid #ccc;padding:30px;font-size:16px;line-height:1.4}
body.film-open{overflow:hidden}
@media(hover:none),(pointer:coarse){.film-play-mark{opacity:1;width:22px;height:22px;right:6px;top:6px;font-size:16px}.film-card-info{display:none}}
@media(max-width:640px){.film-viewer{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.film-viewer-heading{gap:12px;padding-bottom:12px}.film-viewer h2{font-size:25px}#film-services{font-size:13px}#full-film{max-height:calc(100dvh - 160px)}}
@media(prefers-reduced-motion:reduce){.gallery-page .video-panel,.gallery-page .video-panel video{transform:none!important;transition:none!important}}

/* Six campaign stories weave actual stills and verified on-screen copy into the feed. */
.gallery-page .campaign-story .story-frame{position:relative;padding:0;background:#111;color:#fff;container-type:size;border:1px solid #111;overflow:hidden}
.gallery-page .campaign-story .story-frame::after{display:none}
.story-window{position:absolute;inset:0;overflow:hidden}
.story-track{position:absolute;inset:0;will-change:transform;transition:transform .35s cubic-bezier(.2,.75,.2,1)}
.story-track img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0;aspect-ratio:auto;background:#111}
.story-cue,.story-credit{position:absolute;z-index:3;font-size:12px;line-height:1.2;margin:0!important;color:#fff;letter-spacing:0;font-weight:400;text-shadow:0 1px 12px #000}
.story-cue{top:10px;left:10px}.story-credit{left:10px;right:10px;bottom:10px}
.story-quote{position:absolute;z-index:2;left:18px;right:18px;top:50%;transform:translateY(-50%);margin:0;font-size:clamp(21px,8.5cqw,39px);font-weight:550;letter-spacing:-.045em;line-height:1.05;pointer-events:none;text-shadow:0 2px 20px #0005}
.story-stack .story-track{height:300%;transform:translateY(calc(var(--story-progress,0) * -66.666667%))}
.story-stack .story-track img{height:33.333333%}
.story-stack:has(.story-quote) .story-window::after,.story-pan .story-window::after{content:"";position:absolute;inset:0;background:#0005;pointer-events:none}
.story-stack:has(.story-quote) .story-quote{font-size:clamp(18px,6.5cqw,31px)}
.story-pan .story-track{display:flex;width:200%;transform:translateX(calc(var(--story-progress,0) * -50%))}
.story-pan .story-track img{width:50%;flex:0 0 50%}
.story-wipe .story-track img+img{position:absolute;inset:0;clip-path:inset(0 calc((1 - var(--story-progress,0)) * 100%) 0 0);transition:clip-path .35s ease}
.story-wipe:has(.story-quote) .story-quote{inset:0;transform:none;display:flex;align-items:center;justify-content:center;padding:25px;color:#000;background:#fff;text-shadow:none;text-align:center;clip-path:inset(0 0 calc((1 - var(--story-progress,0)) * 100%) 0);transition:clip-path .35s ease;font-size:clamp(26px,12cqw,54px)}
.story-wipe:has(.story-quote) .story-credit,.story-wipe:has(.story-quote) .story-cue{mix-blend-mode:difference}
.story-marquee .story-frame{background:var(--red)!important}
.story-marquee .story-track{inset:22px -10% 26px;display:flex;flex-direction:column;justify-content:center;gap:0;transform:translateX(calc((var(--story-progress,0) - .5) * 9%))}
.story-line{font-size:clamp(28px,13cqw,66px);font-weight:700;line-height:.98;letter-spacing:-.055em;white-space:nowrap;text-align:center}
.story-line:nth-child(2){transform:translateX(calc((var(--story-progress,0) - .5) * -18%))}
.story-marquee .story-cue,.story-marquee .story-credit{text-shadow:none}
body[data-disco="true"] .story-stack .story-track{animation:reel-disco 11s ease-in-out infinite alternate}
body[data-disco="true"] .story-pan .story-track{animation:story-pan 12s ease-in-out infinite alternate}
@keyframes story-pan{0%,15%{transform:translateX(0)}85%,100%{transform:translateX(-50%)}}
@media(max-width:899px){.story-quote{font-size:30px}.story-stack:has(.story-quote) .story-quote{font-size:28px}.story-credit,.story-cue{font-size:12px}.story-line{font-size:14cqw}}
@media(prefers-reduced-motion:reduce){.story-track,.story-track img,.story-quote{animation:none!important;transition:none!important}}
.film-format{font-size:12px;color:#555;margin:9px 0 0;line-height:1.3}
#full-film{max-height:calc(100dvh - 185px)}
.film-viewer{width:min(1080px,calc(100vw - 24px),calc((100dvh - 185px) * var(--film-ratio,1.777778)));overflow:auto}
.story-line{font-size:clamp(24px,min(13cqw,24cqh),66px)}
body.film-open .story-track,body.film-open .scroll-reel,body.film-open .campaign-note h2{animation-play-state:paused!important}
@media(max-width:899px){.film-card-info{padding:6px}.film-card-info strong{font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.film-card-services{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}.film-card-action{display:none}}
