/* White typography and scroll choreography for the portfolio. */
:root{--paper:#fff;--ink:#171717;--muted:#686868;--line:#dedede;--accent:#2558ec;--serif:'Instrument Serif',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}
html{scroll-padding-top:90px}body{font-family:var(--sans);max-width:none;overflow-x:clip}em{font-family:var(--serif);font-weight:400}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.skip-link{position:fixed;top:12px;left:12px;z-index:200;background:var(--ink);color:white;padding:15px;translate:0 -160%}.skip-link:focus{translate:0 0}
header{position:fixed;left:0;right:0;top:0;height:86px;padding:0 5vw;border:0;background:#ffffffee;backdrop-filter:blur(12px);display:grid;grid-template-columns:1fr auto 1fr;z-index:40}.wordmark{font-family:var(--serif);font-size:42px;letter-spacing:-3px;line-height:1}.wordmark span{color:#3f8f52}.header-contact,.menu-toggle{font-size:12px;letter-spacing:-.2px}.header-contact{justify-self:start;display:flex;gap:25px;align-items:center}.header-contact span{font-size:19px}.menu-toggle{justify-self:end;display:flex;gap:20px;align-items:center;border:0;background:none;padding:12px 0 12px 12px;color:var(--ink)}.menu-icon{display:grid;gap:5px}.menu-icon i{display:block;width:22px;height:1px;background:currentColor}.reading-progress{height:1px;background:var(--ink)}
.is-loading{overflow:hidden}.site-loader{display:none}.js .site-loader{display:grid;place-items:center;position:fixed;inset:0;background:white;z-index:150;transition:clip-path .85s cubic-bezier(.76,0,.24,1);clip-path:inset(0 0 0 0)}.site-loader.is-leaving{clip-path:inset(0 0 100% 0);pointer-events:none}.loader-center{width:min(460px,78vw)}.loader-kicker,.loader-meta{font-size:9px;letter-spacing:1.5px}.loader-kicker{display:block;text-align:center;margin-bottom:30px;color:var(--muted)}.loader-name{font-size:clamp(45px,6vw,76px);font-weight:600;letter-spacing:-4px;text-align:center;line-height:.98;overflow:visible}.loader-name span{display:block}.loader-name span:last-child{font-family:var(--serif);font-size:1.2em;font-weight:400;letter-spacing:-2px}.loader-track{height:2px;background:#e4e4e4;margin-top:35px;overflow:hidden}.loader-fill{width:100%;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}.loader-meta{display:flex;justify-content:space-between;margin-top:12px;font-size:8px;letter-spacing:1px}.loader-count{font-variant-numeric:tabular-nums}
#site-menu{inset:0;margin:0 0 0 auto;width:min(760px,100%);height:100dvh;max-height:none;padding:36px 5vw;border:0;background:#fff;overflow:auto;box-shadow:none}#site-menu::backdrop{background:#17171744;backdrop-filter:blur(7px)}.menu-top{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1px;border-bottom:1px solid var(--line);padding-bottom:30px}.menu-close{background:none;border:0;padding:8px;font-size:12px}#site-menu nav{display:block;margin-top:55px}#site-menu nav a{display:flex;align-items:baseline;gap:20px;font-size:clamp(44px,6vw,80px);letter-spacing:-3px;line-height:1.3;border-bottom:1px solid var(--line);font-weight:500;text-decoration:none}#site-menu nav a small{font-family:monospace;font-size:10px;letter-spacing:0}#site-menu nav a span{margin-left:auto;font-size:.5em;transition:translate .3s}#site-menu nav a:hover span{translate:5px -5px}.menu-contact{display:block;margin-top:45px;font-size:13px}.menu-open{overflow:hidden}
.hero-runway{height:230svh;position:relative;background:white}.hero-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:white;isolation:isolate}.hero-compose{position:relative;margin:auto;height:100%;max-width:1800px;padding:115px 7vw 60px;transform-origin:50% 52%;will-change:transform,opacity}.hero-top-note{font-size:8px;letter-spacing:1px;line-height:1.6;position:absolute;left:7vw;top:128px}.hero-compose h1{font-family:var(--sans);font-weight:700;font-size:clamp(72px,10.8vw,172px);letter-spacing:-.075em;line-height:.94;margin:0;max-width:none;position:relative}.hero-row{display:flex;align-items:baseline;white-space:nowrap;transform-origin:50% 50%;will-change:transform}.hero-row>span{display:block}.hero-row em{font-size:1.2em;letter-spacing:-.035em;line-height:.86;font-style:normal}.row-one{padding-left:19%;padding-bottom:.03em}.row-two{padding-left:1%;padding-bottom:.03em}.row-three{padding-left:0;padding-bottom:.05em}.row-four{padding-left:7%;gap:25px}.row-four small{font-size:11px;font-weight:400;letter-spacing:0;margin-right:2vw}.hero-description{font-size:11px;line-height:1.8;position:absolute;left:66%;bottom:75px;max-width:250px;color:var(--muted);margin:0}.hero-project{position:absolute;right:7vw;top:115px;width:17vw;max-width:260px;transform:rotate(5deg);transform-origin:50% 100%;z-index:3}.hero-project-image{aspect-ratio:4/5;border-radius:100px 100px 20px 20px;overflow:hidden;border:1px solid #17171722;background:#e0e6d8}.hero-project img{height:100%;width:100%;object-fit:cover;display:block;transition:transform .7s}.hero-project:hover img{transform:scale(1.06)}.hero-project>span{display:flex;justify-content:space-between;font-size:7px;letter-spacing:.8px;margin-top:10px}.hero-project b{font-size:12px;font-weight:400}.hero-scroll{position:absolute;left:7vw;bottom:28px;display:flex;align-items:center;gap:24px;font-size:8px;letter-spacing:1px;color:var(--muted)}.scroll-arrow{font-size:21px;animation:scroll-nudge 2.2s infinite}.hero-portal{position:absolute;inset:0;pointer-events:none;display:grid;place-items:center;z-index:5;opacity:0}.portal-disc{width:80px;height:80px;border-radius:50%;background:var(--ink);color:white;display:grid;place-items:center;will-change:transform}.portal-disc>span{position:absolute;width:90vw;text-align:center;font-size:clamp(50px,10vw,150px);letter-spacing:-.065em;font-weight:600;line-height:.85;opacity:0;transform:scale(var(--portal-inverse,1))}.portal-disc em{font-size:1.25em;letter-spacing:-.025em}.portal-disc small{display:block;font-size:9px;letter-spacing:1px;font-weight:400;line-height:1.5;margin-top:35px}.is-loading .hero-row>span{opacity:0;translate:0 120px}.site-entered .hero-row>span{animation:hero-word-in 1.1s cubic-bezier(.16,1,.3,1) both}.site-entered .row-two>span{animation-delay:.08s}.site-entered .row-three>span{animation-delay:.16s}.site-entered .row-four>span{animation-delay:.24s}
.work-introduction{padding:90px 5vw 70px;position:relative;background:white;scroll-margin-top:0}.work-intro-top{display:flex;justify-content:space-between;gap:20px}.eyebrow{font-family:var(--sans);font-size:9px;font-weight:500;letter-spacing:1px}.work-introduction h2{font-size:clamp(48px,7.4vw,118px);line-height:.98;letter-spacing:-.065em;font-weight:600;margin:65px 0 50px}.work-introduction h2 em{font-size:1.2em;font-style:normal;letter-spacing:-.035em}.work-intro-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.work-intro-bottom p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.work-index{display:grid;grid-template-columns:1fr 1fr;gap:15px 40px}.work-index a{font-size:12px;display:flex;gap:15px}.work-index a span{font-size:8px;color:var(--muted);align-self:center}.work-index a:hover{text-decoration:underline;text-underline-offset:5px}
.work-section,#ads,#motion{padding:85px 5vw 75px;background:white;color:var(--ink);--muted:#686868;--line:#dedede;border-top:1px solid var(--line);scroll-margin-top:0}.section-head{margin-bottom:45px}.section-head h2{font-size:clamp(40px,5.2vw,84px);font-weight:600;letter-spacing:-.065em;line-height:.98;max-width:850px}.section-head h2 em{font-size:1.12em;letter-spacing:-.025em;font-style:normal}.section-head>p{font-size:12px;line-height:1.8;max-width:290px}.grid{gap:60px 35px}.card-meta{margin:20px 0 12px}.card h3{font-size:24px;font-weight:500;letter-spacing:-.8px}.card p{font-size:12px;line-height:1.8}.tag{font-size:8px;line-height:1.6;letter-spacing:.3px}.text-button{font-size:11px;letter-spacing:0;padding:9px 0;text-decoration:none;border-bottom:1px solid #aaa}.text-button:hover{letter-spacing:0;color:var(--accent);border-color:var(--accent)}.card .visual{background:#f2f2f2;border-radius:3px;box-shadow:none!important;transform:none!important;transition:none}.campaign-photo{will-change:transform}.image-campaign .visual{height:auto;aspect-ratio:4/5}.campaign-photo{height:100%;width:100%;object-fit:cover;display:block}.video-player{width:100%;display:block;object-fit:contain;background:#f4f4f4;border-radius:3px}#ads .video-player{height:auto;aspect-ratio:9/12;padding:0;background:#f3f3f3}#motion-grid{gap:25px}#motion-grid h3{font-size:21px}#motion-grid .video-player{height:auto;aspect-ratio:9/16}.motion-control{margin:0 0 28px}.motion-control button{color:var(--ink);font-size:9px;padding:10px 15px}.creator-film-intro,.creator-intro{margin-top:70px}.creator-film-intro>h3,.creator-intro h3{font-weight:500;letter-spacing:-1px}.creator-grid{gap:30px}.creator-preview{border-radius:3px}.real-card .visual{height:420px}.real-card .site-capture{object-position:top}.website-image-link{display:block;height:100%}.site-capture{width:100%;height:100%;object-fit:cover}.view-switch button{min-height:34px;padding:8px 16px}.process{padding:90px 5vw;border-top:1px solid var(--line)}.process h2{font-size:clamp(44px,6vw,92px);font-weight:600;line-height:1;letter-spacing:-.06em;margin:30px 0 50px}.process h2 em{font-style:normal;font-size:1.1em}.process-grid{gap:40px}.process-grid span{color:var(--muted)}.process-grid h3{font-weight:500}.closing{margin:0 5vw;padding:80px 0 100px}.closing h2{font-size:clamp(48px,7.5vw,120px);font-weight:600;letter-spacing:-.06em}.closing h2 em{color:var(--ink);font-style:normal;letter-spacing:-.025em}.closing-note{margin-top:30px}footer{padding:30px 5vw}.reveal-ready [data-reveal]{opacity:1;transform:none;transition:none}.scroll-word{display:inline-block;will-change:transform,opacity}.card{will-change:transform;opacity:var(--card-opacity,1);transform:translate3d(0,var(--card-lift,0px),0)}.card-media-reveal{clip-path:inset(var(--media-clip,0%) 0 0 0)}.concept-badge{display:block;font-size:8px;letter-spacing:.7px;color:var(--muted);margin-bottom:12px;text-transform:uppercase}#project-dialog{border-radius:4px;padding:45px}#project-dialog .close{width:40px;height:40px}#project-dialog h2{font-family:var(--sans);font-weight:500}#project-dialog .video-player{height:min(60vh,580px);aspect-ratio:auto}#project-dialog .visual{aspect-ratio:4/5;height:auto;max-height:60vh;background:#f2f2f2}#project-dialog .visual img{object-fit:contain;max-height:60vh}#project-dialog .detail-grid{margin-top:35px}.paused .scroll-arrow{animation-play-state:paused}
@keyframes hero-word-in{from{opacity:0;translate:0 110px}to{opacity:1;translate:0 0}}
#site-menu[open]{animation:menu-enter .55s cubic-bezier(.16,1,.3,1)}
@keyframes menu-enter{from{opacity:0;translate:80px 0}to{opacity:1;translate:0 0}}
.hero-compose h1 em{color:var(--ink)}
.image-campaign .visual,.creator-preview{clip-path:inset(0% 50% 0% 50%);will-change:clip-path}html:not(.js) .image-campaign .visual,html:not(.js) .creator-preview{clip-path:none}
html:not(.js) .hero-runway{height:auto}html:not(.js) .hero-stage{position:relative;min-height:740px}html:not(.js) .menu-toggle{display:none}html:not(.js) .work-index{display:grid}
@media(min-width:1600px){.hero-compose{padding-left:100px;padding-right:100px}.hero-top-note{left:100px}.hero-project{right:100px}.hero-scroll{left:100px}}
@media(min-width:701px) and (max-height:760px){.hero-compose{padding-top:105px}.hero-compose h1{font-size:min(10vw,18svh)}.hero-project{top:105px;width:16vw;max-width:210px}.hero-description{bottom:65px}.hero-top-note{top:115px}}
@media(max-width:1050px){.section-head>p{max-width:230px}.hero-description{left:64%;font-size:10px}.hero-top-note{font-size:7px}.hero-project{right:5vw}.real-card .visual{height:330px}}
@media(max-width:700px){header{height:74px;padding:0 6vw;align-items:center}.wordmark{font-size:36px}.header-contact,.menu-toggle{font-size:11px}.header-contact{gap:10px}.menu-toggle{gap:12px}.hero-runway{height:200svh}.hero-compose{padding:150px 6vw 90px}.hero-top-note{left:6vw;top:95px;font-size:8px}.hero-compose h1{font-size:12.3vw;letter-spacing:-.065em;line-height:1.03}.row-one{padding-left:10%;padding-bottom:.06em}.row-two{padding-left:0}.row-three{font-size:.94em;padding-bottom:.06em}.row-four{padding-left:4%;gap:15px}.row-four small{font-size:9px}.hero-project{top:auto;bottom:85px;right:8vw;width:28vw;max-width:150px}.hero-project-image{border-radius:65px 65px 14px 14px}.hero-project>span{font-size:6px}.hero-description{left:6vw;bottom:135px;font-size:10px;max-width:50%}.hero-scroll{left:6vw;bottom:32px}.work-introduction{padding:65px 6vw 55px}.work-intro-top{align-items:start}.work-intro-top>span:last-child{max-width:115px;text-align:right;font-size:7px;line-height:1.5}.work-introduction h2{font-size:11.4vw;margin:45px 0 35px}.work-intro-bottom{display:block}.work-index{margin-top:30px;justify-content:start;gap:15px 25px;max-width:none;font-size:12px;flex-wrap:nowrap}.work-section,#ads,#motion{padding:65px 6vw 55px}.section-head h2{font-size:11vw}.section-head>p{max-width:100%;font-size:12px;margin-top:24px}.grid{gap:42px}.card h3{font-size:22px}.tag{max-width:100px}#ads .video-player{aspect-ratio:9/13}#motion-grid{grid-template-columns:1fr 1fr;gap:35px 18px}#motion-grid h3{font-size:18px}#motion-grid .tag{max-width:100%;font-size:7px}#motion-grid .card p{font-size:10px}#motion-grid .text-button{font-size:9px}.motion-control{font-size:8px;gap:15px;line-height:1.5}.real-card .visual{height:300px}.process{padding:60px 6vw}.process h2{font-size:11vw}.process-grid{grid-template-columns:1fr;gap:28px}.process-grid>div{display:grid;grid-template-columns:80px 1fr;gap:0 15px;border-bottom:1px solid var(--line);padding-bottom:25px}.process-grid h3{margin:0 0 10px}.process-grid p{grid-column:2;margin:0}.closing{margin:0 6vw;padding:65px 0}.closing h2{font-size:12vw}.loader-name{letter-spacing:-2px}.creator-grid{grid-template-columns:1fr}.menu-top{padding-bottom:20px}#site-menu{padding:30px 6vw}#site-menu nav{margin-top:35px}#site-menu nav a{font-size:15vw;letter-spacing:-2px}#project-dialog{padding:45px 22px 25px}.portal-disc small{font-size:8px}}
@media(max-width:700px) and (max-height:650px){.hero-compose{padding-top:120px}.hero-top-note{top:88px}.hero-compose h1{font-size:11vw}.hero-project{width:24vw;bottom:62px}.hero-description{bottom:100px}.hero-scroll{bottom:20px}}
@media(max-width:700px) and (min-height:651px){.hero-compose h1{font-size:16vw}.row-three{font-size:.94em}}
@media(prefers-reduced-motion:reduce){.hero-runway{height:auto}.hero-stage{position:relative;min-height:740px;height:100svh}.hero-portal{display:none}.site-loader{transition:none!important}.site-entered .hero-row>span{animation:none;opacity:1;translate:0 0}.scroll-word,.card{transform:none!important;opacity:1!important}.card-media-reveal{clip-path:none!important}.campaign-photo{transform:none!important}}

/* Featured editorial motion film. */
#featured-motion{margin:0 0 65px}.motion-featured{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);gap:clamp(25px,4vw,60px);align-items:center;padding:24px;background:#f4f3ef;border:1px solid #e6e4de;border-radius:3px}.motion-featured>.video-player{width:100%;aspect-ratio:9/16;height:auto;max-height:427px;background:#e4e3df}.featured-motion-copy{max-width:540px}.featured-motion-copy .card-meta{display:block;margin:24px 0}.featured-motion-copy h3{font-size:clamp(25px,3vw,38px);line-height:1.08;margin:0 0 15px}.featured-motion-copy .tag{display:block;font-size:10px;line-height:1.8;text-align:left;max-width:none}.featured-motion-copy>p{font-size:13px;line-height:1.8}.featured-motion-copy .featured-motion-tools{margin-top:25px;font-size:11px;color:#686868}.featured-motion-copy .text-button{margin-top:15px}
@media(max-width:700px){.motion-featured{grid-template-columns:1fr;gap:25px;padding:18px}.motion-featured>.video-player{max-width:230px;max-height:none;margin:0 auto}.featured-motion-copy .card-meta{margin:18px 0}.featured-motion-copy>p{font-size:12px}.featured-motion-copy .tag{max-width:none}#featured-motion{margin-bottom:45px}}

/* Landscape motion project: preserve the complete 16:9 film. */
#motion-grid .motion-landscape{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(220px,1fr);column-gap:35px;align-items:start}#motion-grid .motion-landscape .video-player{aspect-ratio:16/9;grid-column:1;grid-row:1 / 5}#motion-grid .motion-landscape .card-meta,#motion-grid .motion-landscape p,#motion-grid .motion-landscape .text-button{grid-column:2}#motion-grid .motion-landscape .card-meta{margin-top:8px}#motion-grid .motion-landscape .text-button{justify-self:start;align-self:start}@media(max-width:700px){#motion-grid .motion-landscape{display:block}#motion-grid .motion-landscape .card-meta{margin-top:20px}}

#reel-motion{margin:0 0 65px}@media(max-width:700px){#reel-motion{margin-bottom:45px}}

/* Three seamless typography ribbons, matching the supplied moving-text reference. */
.disciplines-marquee{position:relative;padding:85px 0 95px;background:#171717;color:#fff;overflow:hidden}
.disciplines-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.discipline-rows{display:grid;gap:24px}
.discipline-row{overflow:hidden}
.discipline-track{display:flex;width:max-content;animation:disciplines-drift 40s linear infinite;animation-play-state:paused;will-change:transform}
.discipline-row:nth-child(2) .discipline-track{animation-duration:46s;animation-delay:-13s}
.discipline-row:nth-child(3) .discipline-track{animation-duration:43s;animation-delay:-22s}
.discipline-group{display:flex;align-items:center;flex-shrink:0;justify-content:space-around;gap:clamp(24px,3vw,58px);min-width:100vw;padding-right:clamp(24px,3vw,58px)}
.discipline-name,.discipline-dash{font-family:var(--sans);font-size:clamp(38px,5.6vw,90px);font-weight:400;line-height:1.2;letter-spacing:-.045em;white-space:nowrap}
.discipline-dash{font-weight:400;color:#d6d6d6}
.disciplines-marquee.is-visible:not(.is-paused) .discipline-track{animation-play-state:running}
.disciplines-marquee:hover .discipline-track,.disciplines-marquee:focus-within .discipline-track,.paused .disciplines-marquee .discipline-track{animation-play-state:paused}
.discipline-pause{position:absolute;right:5vw;bottom:24px;display:flex;align-items:center;gap:12px;border:0;border-bottom:1px solid #ffffff45;background:transparent;color:#d1d1d1;font-family:var(--sans);font-size:10px;padding:7px 0}
.discipline-pause:hover{color:#fff;border-color:#fff}
@keyframes disciplines-drift{to{transform:translate3d(-50%,0,0)}}
@media(max-width:700px){.disciplines-marquee{padding:60px 0 75px}.discipline-rows{gap:20px}.discipline-name,.discipline-dash{font-size:clamp(36px,7.5vw,52px)}.discipline-pause{right:6vw;bottom:18px}}
@media(prefers-reduced-motion:reduce){.disciplines-marquee{padding:45px 6vw}.discipline-track{animation:none;transform:none;width:100%;will-change:auto}.discipline-group{min-width:0;width:100%;justify-content:flex-start;flex-wrap:wrap;gap:10px 18px;padding:0}.discipline-group+.discipline-group,.discipline-pause{display:none}.discipline-name,.discipline-dash{font-size:clamp(26px,4vw,48px);white-space:normal}}
html:not(.js) .discipline-track{animation-play-state:running}html:not(.js) .discipline-pause{display:none}

/* A pinned process index accompanies the vertically scrolling glass steps. */
.process{overflow:visible;background:#fff;scroll-margin-top:90px}
.process-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,110px);align-items:start}
.process-intro{position:sticky;top:120px;padding:25px 0 35px;align-self:start}
.process-intro h2{font-size:clamp(38px,4.4vw,66px);line-height:1.04;letter-spacing:-.055em;margin:24px 0}
.process-intro h2 em{font-size:1.1em}
.process-description{font-size:12px;line-height:1.8;color:#686868;max-width:370px;margin:0}
.process-stages{display:grid;gap:8px;margin-top:40px}
.process-stage-link{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:baseline;gap:14px;color:#b0b0aa;text-decoration:none;padding:5px 0;transition:color .3s;max-width:400px}
.process-stage-link>span:nth-child(2){font-family:var(--sans);font-weight:500;font-size:clamp(30px,3.4vw,48px);line-height:1.12;letter-spacing:-1.6px;text-transform:uppercase}
.process-stage-number{font-size:10px;letter-spacing:0;font-family:var(--sans)}

.process-stage-link.is-current,.process-stage-link:hover,.process-stage-link:focus-visible{color:#171717}

.process .process-grid{display:flex;flex-direction:column;gap:0;border:0;padding:0 24px;position:relative;overflow:visible;background:none;box-shadow:none}


.process-grid>.process-tile{position:relative;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;min-height:65svh;padding:30px 0;border:0;--float-x:7px;--float-y:-13px;--tilt:-1.5deg;--orbit-time:10s;--orbit-delay:-2s}


.process-tile:nth-child(2){--float-x:-8px;--float-y:16px;--tilt:1.6deg;--orbit-time:12s;--orbit-delay:-6s}
.process-tile:nth-child(3){--float-x:6px;--float-y:-16px;--tilt:1.2deg;--orbit-time:11s;--orbit-delay:-8s}
.process-tile:nth-child(4){--float-x:-6px;--float-y:12px;--tilt:-1.3deg;--orbit-time:13s;--orbit-delay:-4s}
.process-tile-inner{position:relative;width:100%;max-width:470px;min-height:290px;padding:40px 35px;background:linear-gradient(135deg,#ffffffc4,#ffffff66);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border:1px solid #e7e9e5;border-radius:22px;box-shadow:0 25px 45px -24px #26352a30,inset 0 1px 0 #fff;transform-origin:center;animation:process-orbit var(--orbit-time) ease-in-out var(--orbit-delay) infinite;animation-play-state:paused;will-change:transform;opacity:.7;transition:opacity .4s,border-color .4s}
.process-tile-inner::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,#ffffff38,transparent 45%,#ffffff0a 75%)}
.process-tile-inner>*{position:relative}
.process-is-active .process-tile-inner{animation-play-state:running}
.process-tile.is-current .process-tile-inner{opacity:1;border-color:#bfc9c0}
.process-grid .process-step{display:block;font-size:10px;letter-spacing:1.4px;color:#3f8f52;margin-bottom:40px}
.process-grid .process-tile h3{font-size:clamp(26px,2.7vw,36px);line-height:1.12;letter-spacing:-1px;margin:0 0 20px;font-weight:500}
.process-grid .process-tile p{font-size:13px;line-height:1.8;margin:0;color:#535c56;grid-column:auto;max-width:340px}
@keyframes process-orbit{0%,100%{transform:translate3d(calc(var(--float-x)*-1),calc(var(--float-y)*-.45),0) rotate(calc(var(--tilt)*-1))}50%{transform:translate3d(var(--float-x),var(--float-y),0) rotate(var(--tilt))}}
.paused .process-tile-inner{animation-play-state:paused}
@media(max-height:760px) and (min-width:851px){.process-intro{top:105px;padding-top:10px}.process-intro h2{font-size:42px;margin:18px 0}.process-stages{margin-top:24px;gap:3px}.process-stage-link>span:nth-child(2){font-size:40px}}
@media(max-height:600px) and (min-width:851px){.process-intro{position:static}}
@media(max-width:850px){.process-layout{grid-template-columns:1fr;gap:25px}.process-intro{position:static;padding:0;max-width:620px}.process-intro h2{font-size:clamp(40px,7vw,60px)}.process-stages{grid-template-columns:1fr 1fr;gap:15px 25px;margin-top:30px}.process-stage-link{grid-template-columns:22px minmax(0,1fr);gap:8px}.process-stage-link>span:nth-child(2){font-size:clamp(21px,4vw,32px);letter-spacing:-1px}.process .process-grid{padding:0 14px}.process-grid>.process-tile{min-height:52svh}.process-tile-inner{max-width:550px}}
@media(max-width:700px){.process-tile-inner{padding:30px 24px;min-height:265px}.process-grid .process-step{margin-bottom:32px}.process-grid .process-tile h3{font-size:27px}.process-grid .process-tile p{font-size:12px}.process .process-grid{padding:0 14px}.process-grid>.process-tile{--float-x:3px;--float-y:-7px;--tilt:-.7deg}.process-tile:nth-child(2n){--float-x:-3px;--float-y:7px;--tilt:.7deg}}
@media(max-width:700px){.process-stages{grid-template-columns:1fr;gap:6px}.process-stage-link{max-width:340px}.process-stage-link>span:nth-child(2){font-size:30px}}
@media(prefers-reduced-motion:reduce){.process-tile-inner{animation:none!important;transform:none!important;will-change:auto;opacity:1;transition:none}.process-stage-link{transition:none}}

/* Reverse the opening portal: the white page contracts into a circle on black. */
.closing-runway{position:relative;height:200svh;background:#fff}
.closing{position:sticky;top:0;isolation:isolate;margin:0;height:100svh;padding:85px 5vw;display:grid;align-content:center;background:var(--closing-stage-bg,#171717);color:#fff;border:0;overflow:hidden}
.closing-iris{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:0}
.closing-disc{width:80px;height:80px;border-radius:50%;background:#fff;transform:scale(40);will-change:transform,opacity}
.closing-content{position:relative;z-index:1;color:#fff;mix-blend-mode:difference;transform-origin:50% 52%;will-change:transform}
.closing .closing-content h2,.closing .closing-content h2 em,.closing .closing-content .eyebrow,.closing .closing-content p{color:#fff}
.closing .closing-content p{opacity:1}
.closing h2{position:relative;margin:35px 0}
footer{position:relative;background:var(--closing-footer-bg,#fff);color:var(--closing-footer-ink,#686868);border:0}
footer a{color:inherit}
@media(max-width:700px){.closing-runway{height:180svh}.closing{margin:0;padding:65px 6vw}.closing h2{margin:30px 0}}
@media(max-height:600px){.closing{padding-top:35px;padding-bottom:35px}.closing h2{font-size:clamp(36px,9svh,64px);margin:20px 0}.closing-note{margin-top:18px}}
@media(prefers-reduced-motion:reduce){.closing-disc{display:none}.closing-content{transform:none!important;will-change:auto}}
html:not(.js) .closing-runway{height:auto}html:not(.js) .closing{position:relative;height:auto;background:#fff}html:not(.js) .closing-iris{display:none}
@media(forced-colors:active){.closing-iris{display:none}.closing-content{mix-blend-mode:normal;color:CanvasText}.closing .closing-content h2,.closing .closing-content h2 em,.closing .closing-content .eyebrow,.closing .closing-content p{color:CanvasText}}
#creator-toolkit{scroll-margin-top:20px}

/* Editorial service index: condensed type, a single sharp active line. */
.services-type{padding:65px 5vw 60px;border-top:1px solid var(--line);background:#f3f3f0;scroll-margin-top:86px;overflow:hidden}
.services-top{display:flex;justify-content:space-between;gap:24px;color:#686868}
.services-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.services-list{list-style:none;padding:0;margin:65px auto 55px;width:max-content;max-width:100%}
.services-list li{margin:0;padding:0}
.service-line{position:relative;display:block;color:#b7b9b3;text-align:center;text-decoration:none;transition:color .25s,transform .4s cubic-bezier(.16,1,.3,1);outline-offset:6px}
.service-name{display:block;font-family:'Anton','Impact','Arial Narrow',sans-serif;font-weight:400;font-size:clamp(40px,5.3vw,84px);line-height:1.1;letter-spacing:-.02em}
.service-line.is-active,.service-line:hover,.service-line:focus-visible{color:#111;transform:translateX(8px)}
.service-preview{position:absolute;left:-145px;top:50%;width:112px;height:122px;transform:translateY(-50%) rotate(-7deg) scale(.86);opacity:0;pointer-events:none;transition:opacity .25s,transform .4s cubic-bezier(.16,1,.3,1);z-index:2;background:#fff;padding:5px;box-shadow:0 8px 20px #1112}
.service-preview img{display:block;width:100%;height:100%;object-fit:cover}
.service-note{position:absolute;left:calc(100% + 28px);top:50%;width:125px;transform:translateY(-50%);font-family:var(--sans);font-size:7px;letter-spacing:.7px;line-height:1.8;text-align:left;color:#585f58;opacity:0;pointer-events:none;transition:opacity .25s}
.service-note>span{display:block;margin-top:10px;color:#3f8f52}
.service-line.is-active .service-preview{opacity:1;transform:translateY(-50%) rotate(-7deg) scale(1)}
.service-line.is-active .service-note{opacity:1}
.services-hint{font-size:11px;line-height:1.7;color:#686868;text-align:center;margin:0}
@media(max-width:1200px){.service-preview{left:-110px;width:85px;height:95px}.service-note{left:calc(100% + 20px);width:100px;font-size:6px}}
@media(max-width:850px){.service-preview,.service-note{display:none}.service-name{font-size:clamp(40px,7vw,64px)}}
@media(max-width:700px){.services-type{padding:45px 6vw;scroll-margin-top:74px}.services-top .eyebrow{font-size:7px;max-width:135px;line-height:1.6}.services-top>span:last-child{text-align:right}.services-list{margin:45px auto 35px}.service-name{font-size:10vw;line-height:1.18}.service-line.is-active,.service-line:hover,.service-line:focus-visible{transform:translateX(3px)}.services-hint{font-size:10px;max-width:240px;margin:auto}}
@media(prefers-reduced-motion:reduce){.service-line,.service-preview,.service-note{transition:none}.service-line.is-active,.service-line:hover,.service-line:focus-visible{transform:none}}

/* Glass campaign folder: tucked away, fanned preview, then a front row of films. */
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder){display:block;position:relative;isolation:isolate;height:var(--scene-height,610px);overflow:hidden;border-radius:30px;perspective:1400px;background:#fff;box-shadow:none;transition:height .9s cubic-bezier(.22,1,.36,1)}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder)::before{content:none}
.folder-stage-label{position:absolute;top:28px;left:30px;color:#686868;font-size:8px;letter-spacing:1.5px;z-index:50}
.folder-close{position:absolute;top:18px;right:22px;padding:12px 14px;border:1px solid #dedede;background:#ffffffd9;border-radius:30px;color:#315c3d;font-size:10px;z-index:60}
.folder-close[hidden]{display:none}
.folder-shell{position:absolute;left:50%;top:var(--shell-y,250px);width:var(--folder-width,500px);height:calc(var(--folder-width,500px)*.65);transform:translateX(-50%);transition:top .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1),opacity .6s;pointer-events:none;z-index:10;transform-style:preserve-3d}
.folder-back{position:absolute;inset:0 15px 0 15px;border-radius:28px;background:linear-gradient(160deg,#8be8a7,#39aa61 40%,#166a3b);border:1px solid #c0ffd0b3;box-shadow:inset 0 2px 3px #e5ffefae,inset 0 -4px 20px #07432366,0 28px 45px #0005;transform:rotateY(-9deg)}
.folder-back::before{content:"";position:absolute;left:0;top:-25px;width:45%;height:50px;border-radius:20px 20px 0 0;background:linear-gradient(#79de97,#49bb70);border-top:1px solid #ccffdab3}
.folder-front{position:absolute;left:50%;top:calc(var(--shell-y,250px) + 18px);width:calc(var(--folder-width,500px) + 24px);height:calc(var(--folder-width,500px)*.65 + 34px);transform-origin:50% 100%;transform:translateX(-50%) rotateY(-9deg) rotateX(-5deg);transition:top .9s cubic-bezier(.22,1,.36,1),opacity .6s,transform .8s cubic-bezier(.22,1,.36,1);filter:drop-shadow(0 12px 15px #06160d55);z-index:30;pointer-events:none}
.folder-front::before{content:"";position:absolute;inset:4% 2% 3%;clip-path:polygon(0 0,36% 0,48% 17%,100% 17%,100% 100%,0 100%);border-radius:26px;backdrop-filter:blur(9px) saturate(140%);-webkit-backdrop-filter:blur(9px) saturate(140%);background:#54c68014}
.folder-front svg{position:absolute;inset:0;width:100%;height:100%}
.folder-monogram{position:absolute;left:10%;bottom:13%;font-family:var(--serif);font-size:50px;letter-spacing:-3px;line-height:1;color:#e9ffee}
.folder-monogram span{color:#86f7a2}
.folder-front-label{position:absolute;left:29%;bottom:16%;color:#eaffef;font-size:9px;letter-spacing:1.8px}
.folder-deck{position:absolute;inset:0;pointer-events:none;z-index:auto}
.folder-ad-card{position:absolute;left:50%;top:var(--deck-y,150px);width:var(--closed-card-width,180px);height:var(--closed-card-height,286px);border-radius:16px;background:#fff;box-shadow:0 15px 28px #0004;overflow:hidden;transform:translateX(calc(-50% + var(--stack-x,0px))) translateY(0) rotate(var(--stack-angle,0deg));transition:transform .9s cubic-bezier(.22,1,.36,1),top .9s cubic-bezier(.22,1,.36,1),width .9s cubic-bezier(.22,1,.36,1),height .9s cubic-bezier(.22,1,.36,1),box-shadow .5s;z-index:calc(20 + var(--stack-order,1))}
.folder-card-cover{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;border-radius:inherit;transition:opacity .35s;pointer-events:auto;cursor:pointer}
.folder-card-cover:focus-visible{outline:3px solid #3f8f52;outline-offset:-4px}
.folder-card-cover img{width:100%;height:100%;object-fit:cover;display:block}
.folder-card-cover span{position:absolute;left:0;right:0;bottom:0;padding:22px 10px 12px;background:linear-gradient(transparent,#0008);text-align:center;color:#fff;font-size:14px;letter-spacing:1.2px;font-weight:600}
.folder-card-content{position:relative;visibility:hidden;opacity:0;transition:opacity .35s,visibility .35s;padding:14px}
:is(#ads,#motion) .folder-ad-card .video-player{width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:#111;border-radius:9px;padding:0}
.folder-card-copy{padding:18px 4px 6px;color:#202922}
.folder-ad-category{display:block;font-size:8px;color:#707a71;text-transform:uppercase;letter-spacing:.8px;line-height:1.5}
.folder-card-copy h3{font-size:25px;letter-spacing:-.8px;font-weight:600;margin:9px 0 4px}
.folder-card-copy h4{font-family:var(--serif);font-size:24px;line-height:1.05;font-weight:400;letter-spacing:-.4px;margin:0 0 10px}
.folder-ad-spec{font-size:8px;color:#707a71;letter-spacing:.4px}
.folder-card-copy p{font-size:10px;line-height:1.65;color:#606a62;margin:12px 0}
.folder-card-copy .text-button{font-size:10px;color:#315c3d;border-color:#769780;line-height:1.6;text-align:left}
.folder-trigger{position:absolute;z-index:15;top:var(--trigger-y,100px);left:50%;width:calc(var(--folder-width,500px) + 45px);height:calc(var(--folder-width,500px)*.82);transform:translateX(-50%);border:0;background:none;border-radius:35px;color:#315c3d}
.folder-trigger:focus-visible{outline:2px solid #3f8f52;outline-offset:10px}


:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-peeking .folder-ad-card{transform:translateX(calc(-50% + var(--fan-x))) translateY(var(--fan-y)) rotate(var(--fan-angle))}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-peeking .folder-front{transform:translateX(-50%) rotateY(-14deg) rotateX(-26deg)}

:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-shell{top:85px;transform:translateX(-50%) scale(.72);opacity:.65}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-front{top:103px;transform:translateX(-50%) scale(.72) rotateY(-9deg) rotateX(-32deg);opacity:.65}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-deck{z-index:40}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-ad-card{top:var(--row-y);width:var(--open-card-width);height:var(--open-card-height);transform:translateX(calc(-50% + var(--row-x))) rotate(0deg);pointer-events:auto;box-shadow:0 25px 45px #0005}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-card-cover{opacity:0;visibility:hidden;pointer-events:none}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-card-content{opacity:1;visibility:visible;transition-delay:.45s}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded .folder-trigger{display:none}

@media(max-width:700px){:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder){border-radius:22px}.folder-stage-label{top:25px;left:20px;font-size:6px;letter-spacing:1px}.folder-close{top:15px;right:14px;font-size:8px;padding:10px}.folder-front-label{font-size:7px;letter-spacing:1px;left:30%}.folder-monogram{font-size:37px}.folder-card-content{padding:10px}.folder-card-copy{padding:12px 2px 3px}.folder-card-copy h3{font-size:20px}.folder-card-copy h4{font-size:20px}.folder-ad-category{font-size:7px;letter-spacing:.3px}.folder-card-copy p{font-size:9px;line-height:1.6}.folder-card-copy .text-button{font-size:9px}.folder-card-cover span{font-size:10px}}
@media(prefers-reduced-motion:reduce){:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder),.folder-shell,.folder-front,.folder-ad-card,.folder-card-cover,.folder-card-content{transition:none!important;transition-delay:0s!important}}

/* Bring the chosen film forward, keeping the remaining covers behind it. */
.folder-enlarge{display:block;margin:0 0 12px;padding:4px 0;border:0;background:none;font-size:9px;color:#3f8f52;text-align:left}
.folder-back-to-films{position:absolute;left:30px;top:60px;z-index:60;border:1px solid #dedede;background:#ffffffed;color:#315c3d;border-radius:24px;padding:10px 14px;font-size:10px}
.folder-back-to-films[hidden]{display:none}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-ad-card{top:130px;width:var(--closed-card-width);height:var(--closed-card-height);transform:translateX(calc(-50% + var(--behind-x))) rotate(var(--behind-angle));z-index:var(--stack-order);pointer-events:auto}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-ad-card:not(.is-selected) .folder-card-cover{opacity:1;visibility:visible;pointer-events:auto}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-ad-card:not(.is-selected) .folder-card-content{opacity:0;visibility:hidden;transition-delay:0s}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-ad-card.is-selected{top:170px;width:var(--hero-width);height:var(--hero-height);transform:translateX(-50%) rotate(0deg);z-index:100;box-shadow:0 30px 65px #17271b35}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-content{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:center;padding:24px;opacity:1;visibility:visible}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy{padding:0}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy h3{font-size:38px}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy h4{font-size:34px}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy p{font-size:13px;line-height:1.8}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-ad-category,:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-ad-spec{font-size:10px}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-enlarge{display:none}
@media(max-width:700px){.folder-back-to-films{left:20px;top:58px;font-size:9px}:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-content{display:block;padding:18px}:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy{padding:20px 0 0}:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy h3{font-size:30px}:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy h4{font-size:28px}:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .is-selected .folder-card-copy p{font-size:11px}}

/* The collection pivots out of the folder into a floating, three-dimensional fan. */
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-arranging .folder-ad-card{transition:none!important;animation:none!important;transform-origin:50% 50%}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded:not(.has-focused-film) .folder-shell{top:var(--shell-y);transform:translateX(-50%) scale(.8);opacity:.48}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded:not(.has-focused-film) .folder-front{top:calc(var(--shell-y) + 18px);transform:translateX(-50%) scale(.8) rotateY(-9deg) rotateX(-38deg);opacity:.48}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded:not(.has-focused-film) .folder-ad-card{top:var(--row-y);width:var(--open-card-width);height:var(--open-card-height);border-radius:12px;transform:translateX(calc(-50% + var(--row-x))) translateZ(var(--spread-depth)) rotateY(var(--spread-turn)) rotateZ(var(--spread-angle)) scale(var(--spread-scale));transform-origin:50% 50%;box-shadow:0 24px 35px #17271b28;animation:folder-card-drift var(--float-time,7s) ease-in-out var(--float-delay) infinite;animation-play-state:paused}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded:not(.has-focused-film) .folder-card-cover{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded:not(.has-focused-film) .folder-card-content{opacity:0;visibility:hidden;pointer-events:none;transition-delay:0s}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-unfolded.folder-in-view:not(.has-focused-film):not(.is-arranging):not(.folder-hidden) .folder-ad-card{animation-play-state:running}
.paused :is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder) .folder-ad-card{animation-play-state:paused!important}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-ad-card{animation:none;translate:none;transform-origin:center}
@keyframes folder-card-drift{
 0%,100%{transform:translateX(calc(-50% + var(--row-x))) translateZ(var(--spread-depth)) rotateX(0deg) rotateY(var(--spread-turn)) rotateZ(var(--spread-angle)) scale(var(--spread-scale))}
 29%{transform:translateX(calc(-50% + var(--row-x) + var(--drift-x))) translateY(var(--drift-y)) translateZ(calc(var(--spread-depth) + 18px)) rotateX(var(--drift-pitch)) rotateY(calc(var(--spread-turn) + var(--drift-yaw))) rotateZ(calc(var(--spread-angle) + var(--drift-roll))) scale(var(--spread-scale))}
 63%{transform:translateX(calc(-50% + var(--row-x) - var(--drift-x)*.6)) translateY(calc(var(--drift-y)*-.7)) translateZ(calc(var(--spread-depth) - 12px)) rotateX(calc(var(--drift-pitch)*-.6)) rotateY(calc(var(--spread-turn) - var(--drift-yaw)*.7)) rotateZ(calc(var(--spread-angle) - var(--drift-roll)*.5)) scale(var(--spread-scale))}
 82%{transform:translateX(calc(-50% + var(--row-x) + var(--drift-x)*.3)) translateY(calc(var(--drift-y)*.4)) translateZ(calc(var(--spread-depth) + 8px)) rotateX(calc(var(--drift-pitch)*.3)) rotateY(calc(var(--spread-turn) + var(--drift-yaw)*.35)) rotateZ(calc(var(--spread-angle) + var(--drift-roll)*.65)) scale(var(--spread-scale))}
}
@media(prefers-reduced-motion:reduce){:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder) .folder-ad-card{animation:none!important;translate:none!important}}

/* The motion collection uses the same folder, preserving each film’s native proportions. */
.motion-collection-head{margin-top:65px}
#motion-folder{margin-bottom:50px}
#motion-folder .folder-card-cover span{font-size:clamp(10px,1.2vw,16px);letter-spacing:0;line-height:1.2}
.folder-landscape .folder-card-cover img{object-fit:contain;background:#f4f1ed}
:is(#ads,#motion) .folder-landscape .video-player{aspect-ratio:16/9}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-landscape.is-selected .folder-card-content{display:block}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-landscape.is-selected .folder-card-copy{padding:24px 0 0}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).has-focused-film .folder-landscape.is-selected .folder-card-copy p{max-width:70ch}
:is(#ad-grid,#motion-folder,#toolkit-folder,#explainer-video,#charts-folder).is-peeking:not(.is-unfolded) .folder-ad-card{transform:translateX(calc(-50% + var(--fan-x))) translateY(var(--fan-y)) translateZ(25px) rotateY(var(--spread-turn)) rotateZ(var(--fan-angle));transition-delay:var(--peek-delay,0s)}
@media(max-width:700px){.motion-collection-head{margin-top:45px}}

/* Live toolkit previews use the same folder interaction as the campaign films. */
#toolkit-folder{margin-top:25px}
#toolkit-folder .folder-front-label{font-size:8px;letter-spacing:1px}
#toolkit-folder .folder-card-cover>span{font-size:clamp(9px,1vw,14px);letter-spacing:0;line-height:1.2;padding:26px 8px 12px}
.toolkit-cover-art{position:absolute;inset:0}
.toolkit-cover-art .creator-preview{width:100%;height:100%;max-height:none;aspect-ratio:auto;padding:12%;border-radius:0}
.toolkit-cover-art .creator-preview *{animation:none!important}
.toolkit-cover-art .creator-top,.toolkit-cover-art .creator-preview small{display:none}
.toolkit-cover-art .hook-text{margin:auto 0;font-size:clamp(17px,2.5vw,36px);letter-spacing:-1px}
.toolkit-cover-art .hook-text span:first-child{font-size:7px;letter-spacing:1.2px;margin-bottom:7px}
.toolkit-cover-art .caption-text{margin:auto 0;font-size:clamp(16px,2.3vw,32px);letter-spacing:-.6px}
.toolkit-cover-art .creator-avatar{width:40%;height:auto;aspect-ratio:1;top:18%;font-size:clamp(16px,2vw,30px)}
.toolkit-cover-art .lower-third{bottom:28%;left:8%;right:8%;padding:7px 5px}
.toolkit-cover-art .lower-third strong{font-size:clamp(5px,.8vw,10px)}
.toolkit-cover-art .lower-third span{font-size:clamp(5px,.6vw,8px)}
.toolkit-cover-art .subscribe{bottom:15%;font-size:clamp(5px,.65vw,9px);padding:6px 9px}
.toolkit-cover-art .stat-head{gap:7px;margin:10% 0 0}
.toolkit-cover-art .stat-head b{font-size:clamp(30px,4vw,62px);letter-spacing:-2px}
.toolkit-cover-art .stat-head span{font-size:clamp(8px,1.2vw,15px)}
.toolkit-cover-art .creator-bars{height:38%;margin-bottom:30%;padding:0;gap:7px}
#toolkit-folder .folder-card-content>.creator-preview{width:100%;height:auto;max-height:none;aspect-ratio:9/16;border-radius:9px;padding:26px 20px;flex-shrink:0}
#toolkit-folder .folder-card-content .hook-text{font-size:clamp(42px,5vw,70px)}
#toolkit-folder .folder-card-content .caption-text{font-size:clamp(35px,4vw,52px)}
#toolkit-folder .folder-card-content .creator-preview *{animation-play-state:paused}
#toolkit-folder.folder-in-view:not(.folder-hidden) .is-selected .folder-card-content .creator-preview *{animation-play-state:running}
#toolkit-folder .creator-preview:focus-visible{outline:3px solid #3f8f52;outline-offset:-4px}
@media(max-width:700px){#toolkit-folder .folder-front-label{font-size:6px}#toolkit-folder .folder-card-content>.creator-preview{padding:24px 18px}}

/* Landscape SaaS explainer with a sound-enabled player. */
#explainer-video{margin:0 0 65px;scroll-margin-top:110px}.motion-explainer{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,1fr);gap:clamp(25px,4vw,50px);align-items:center;padding:24px;background:#f4f3ef;border:1px solid #e6e4de;border-radius:3px}#explainer-video .video-player{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#f7faff}.motion-explainer .card-meta{margin-top:20px}@media(max-width:700px){#explainer-video{margin-bottom:45px;scroll-margin-top:90px}.motion-explainer{grid-template-columns:1fr;gap:18px;padding:18px}.motion-explainer .featured-motion-copy{max-width:none}}

/* Project intent accompanies the description in every collection. */
.project-goal>span{display:block;font-family:var(--sans);font-size:9px!important;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:#3f8f52;margin-bottom:7px}
.website-device-card>.project-goal{margin:12px 0 14px;max-width:95%;color:#343b35}
.folder-card-copy .project-goal{color:#343b35;margin:18px 0 14px}
#project-dialog .project-goal{font-size:14px;line-height:1.7;margin:20px 0;color:#343b35}
#explainer-video .folder-card-cover>span{font-size:clamp(10px,1.2vw,17px);letter-spacing:0;line-height:1.2}

#toolkit-folder .toolkit-film-card .video-player{width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:#f7f6f3;border-radius:9px}

#toolkit-folder .creator-preview{clip-path:none!important}
#toolkit-folder .toolkit-cover-art .creator-preview span{position:static;padding:0;background:none;text-align:inherit;color:inherit;font-size:inherit;font-weight:inherit;letter-spacing:inherit}
#toolkit-folder .toolkit-cover-art .hook-text span:first-child{font-size:7px;letter-spacing:1.2px;margin-bottom:7px}
#toolkit-folder .toolkit-cover-art .stat-head span{font-size:clamp(8px,1.2vw,15px)}

/* Finished toolkit videos replace the matching earlier CSS previews. */
#toolkit-folder [data-film-id="toolkit-identity"] .video-player{aspect-ratio:16/9;background:#fff}
#toolkit-folder [data-film-id="toolkit-explainer"] .video-player{aspect-ratio:1;background:#f9f9f9}
#toolkit-folder [data-film-id="toolkit-identity"] .folder-card-cover img,
#toolkit-folder [data-film-id="toolkit-explainer"] .folder-card-cover img{object-fit:contain;background:#fff}

#ads .folder-square .video-player,.video-player.product-square{aspect-ratio:1}
#ad-grid .folder-square .folder-card-cover img{object-fit:contain;background:#b81008}