/* Editorial motion system: precise, tactile, and restrained. */
:root{--acid:#ffc20e;--paper:#f4f1e9;--ink:#20201e;--cursor-x:50%;--cursor-y:50%}
::selection{background:var(--acid);color:var(--ink)}
body{background:radial-gradient(ellipse at 50% -35%,#38352d 0,transparent 48%),var(--ink)}
.top{transition:background .35s,border-color .35s}.brand{display:inline-flex;align-items:center;gap:8px}.brand i{display:inline-block;transition:transform .55s cubic-bezier(.2,.8,.2,1)}.brand:hover i{transform:rotate(135deg) scale(1.2)}
.contact-link{position:relative;overflow:hidden}.contact-link:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#fff9 50%,transparent 70%);transform:translateX(-130%);transition:transform .65s}.contact-link:hover:after{transform:translateX(130%)}
.cover{padding-top:110px}.cover-kicker{display:flex;align-items:center;gap:9px}.cover-kicker:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--acid);box-shadow:0 0 0 4px #ffc20e20,0 0 16px #ffc20e90;animation:signal 2s ease-in-out infinite}@keyframes signal{50%{box-shadow:0 0 0 8px #ffc20e08,0 0 22px #ffc20e55}}
.cover-grid{isolation:isolate;box-shadow:0 25px 80px #0006;transform:translateZ(0)}.cover-grid:before{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;background:radial-gradient(360px circle at var(--cursor-x) var(--cursor-y),#ffffff18,transparent 72%);mix-blend-mode:screen}.cover-grid:after{content:"";position:absolute;z-index:3;left:0;right:0;top:var(--scan-y,0%);height:1px;background:linear-gradient(90deg,transparent,#ffc20eaa 18%,#fff 50%,#ffc20eaa 82%,transparent);opacity:.45;box-shadow:0 0 14px #ffc20e80;pointer-events:none;animation:scanline 7s cubic-bezier(.42,0,.58,1) infinite}@keyframes scanline{0%,100%{top:9%;opacity:0}12%,75%{opacity:.55}88%{top:91%;opacity:0}}
.cover-tile{transition:transform .85s cubic-bezier(.2,.75,.15,1),filter .8s;filter:saturate(.88)}.cover-grid:hover .cover-tile{filter:saturate(1.08)}.cover-tile:before{content:"";position:absolute;z-index:1;inset:-50%;background:linear-gradient(112deg,transparent 43%,#ffffff18 49%,transparent 55%);transform:translateX(-75%) rotate(8deg);transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}.cover-grid:hover .cover-tile:before{transform:translateX(75%) rotate(8deg)}.cover-title{mix-blend-mode:normal}.cover-title h1{animation:title-arrive .9s cubic-bezier(.16,1,.3,1) both}.cover-title h1 span{display:inline-block;color:var(--acid);text-shadow:0 0 32px #ffc20e30;animation:word-settle 1s .14s cubic-bezier(.16,1,.3,1) both}@keyframes title-arrive{from{opacity:0;transform:translateY(26px) skewY(2deg);filter:blur(9px)}to{opacity:1;transform:translateY(0) skewY(0);filter:blur(0)}}@keyframes word-settle{from{opacity:0;transform:translateY(18px);clip-path:inset(100% 0 0)}to{opacity:1;transform:translateY(0);clip-path:inset(0)}}.cover-foot{padding-top:6px}.cover-scroll{color:#e2dfd7}.cover-scroll i{box-shadow:0 0 12px #ffc20e66}
.project{isolation:isolate;transition:background .8s}.project-pin:before{content:"";position:absolute;z-index:-1;inset:0;opacity:.5;pointer-events:none;background:radial-gradient(520px circle at var(--cursor-x) var(--cursor-y),#ffffff0b,transparent 68%)}.project-top{position:relative;align-items:center}.project-top:after{content:"";height:1px;flex:1;margin-left:20px;background:linear-gradient(90deg,#ffffff2e,transparent)}.project-top span:last-child{position:relative;color:#dedbd2}.project-top span:last-child:before{content:"↘";color:var(--acid);margin-right:8px;font-size:12px}.project-copy .number{display:flex;align-items:center;gap:10px}.project-copy .number:before{content:"";height:1px;width:26px;background:var(--acid)}.project-copy h2{position:relative;transform-origin:left center}.project-copy p{letter-spacing:.16em}.project-copy .index{display:flex;align-items:center;gap:9px}.project-copy .index:before{content:"";height:1px;width:22px;background:#777670}.project.is-live .project-copy h2{animation:heading-enter .45s cubic-bezier(.2,.8,.2,1) both}@keyframes heading-enter{from{opacity:.75;transform:translate3d(0,6px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.poster{border-color:#ffffff45;box-shadow:0 18px 48px #0008;transition:border-color .25s}.project.is-live .poster{border-color:#ffffff80;box-shadow:0 18px 48px #0008}.project.scroll-active .project-copy,.project.scroll-active .poster{will-change:transform,opacity}.poster:after{content:"";position:absolute;z-index:2;inset:12px;pointer-events:none;border:1px solid #ffffff20;opacity:0;transform:scale(.985);transition:opacity .45s,transform .65s cubic-bezier(.2,.8,.2,1)}.project.is-live .poster:after{opacity:1;transform:scale(1)}.poster.has-video:before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;background:radial-gradient(280px circle at var(--cursor-x) var(--cursor-y),#ffffff1b,transparent 72%);opacity:0;transition:opacity .35s}.poster.has-video:hover:before{opacity:1}.poster.has-video.hovering .brand-video{filter:none;transform:scale(1)}.brand-video{transition:opacity .35s,transform .8s cubic-bezier(.2,.7,.2,1),filter .4s}.brand-cover{transition:opacity .45s,filter .5s}.poster.has-video:not(.hovering):hover .brand-cover{filter:brightness(1.12)}.poster.has-video:not(.sound-enabled) .sound-toggle{width:auto;min-width:132px;height:42px;padding:0 13px;display:flex;align-items:center;justify-content:center;gap:9px;background:#ffc20e;color:#171716;border:1px solid #ffe27e;box-shadow:0 7px 28px #0008,0 0 0 5px #ffc20e20;font:800 9px var(--mono);letter-spacing:.1em}.sound-toggle svg{width:17px;height:17px;flex:none}.poster.has-video:not(.sound-enabled) .sound-toggle:after{content:"ACTIVER LE SON";white-space:nowrap}.poster.has-video:not(.sound-enabled) .sound-toggle:hover{background:#ffe078;transform:scale(1.045)!important}.poster.has-video.sound-enabled .sound-toggle{opacity:0!important;transform:scale(.7)!important}.video-hint{display:flex;align-items:center;gap:8px}.video-hint:before{content:"";width:18px;height:1px;background:var(--acid)}.poster.has-video:not(.hovering) .brand-lockup{animation:logo-float 3.8s ease-in-out infinite}@keyframes logo-float{50%{transform:translateY(-4px)}}.poster-caption{z-index:6}.frame-no{transition:transform .35s,background .35s}.poster:hover .frame-no{transform:rotate(90deg);background:#fff}
.archive{position:relative;overflow:hidden}.archive:before{content:"";position:absolute;top:0;left:7vw;right:7vw;height:1px;background:linear-gradient(90deg,transparent,#ffc20e80,transparent)}.archive-head h2{position:relative}.archive-head h2:after{content:"";display:block;width:52px;height:2px;margin-top:14px;background:var(--acid);transform-origin:left;transition:transform .4s}.archive-head:hover h2:after{transform:scaleX(1.7)}.archive-card{border-color:#ffffff24;background:#242421}.archive-card:after{content:"+";position:absolute;z-index:3;right:13px;top:7px;color:#ffffffa8;font:300 24px Arial,sans-serif;transition:transform .35s,color .35s}.archive-card:hover:after{color:var(--acid);transform:rotate(90deg)}.archive-card .archive-name span:first-child{color:#eeece4}.archive-card:hover .archive-name span:first-child{color:var(--acid)}
.outro{background:radial-gradient(ellipse at 50% 20%,#423726,#191a18 65%)}.outro:before{font-weight:800;letter-spacing:-.13em;transform:translate(-50%,-50%) scaleX(.94);transition:transform 1s cubic-bezier(.2,.8,.2,1),color .8s}.outro:hover:before{transform:translate(-50%,-50%) scaleX(1);color:#ffffff08}.outro small{display:inline-flex;align-items:center;gap:8px}.outro small:before,.outro small:after{content:"";width:22px;height:1px;background:var(--acid)}.outro h2{animation:outro-breathe 5s ease-in-out infinite}@keyframes outro-breathe{50%{text-shadow:0 0 36px #ffc20e1c}}.outro a{position:relative;overflow:hidden;box-shadow:0 8px 26px #0003}.outro a:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#fff9 50%,transparent 70%);transform:translateX(-130%);transition:transform .7s}.outro a:hover:after{transform:translateX(130%)}.footer{display:flex;justify-content:center;gap:9px}.footer:before{content:"✳";color:var(--acid)}
@media(max-width:760px){.cover{padding-top:82px}.cover-grid:before{display:none}.cover-grid:after{animation-duration:9s}.cover-title h1{font-size:clamp(36px,10.5vw,76px)}.project-top:after{margin-left:10px}.project-copy h2{animation:none!important}.poster:after{inset:7px}.poster.has-video:not(.sound-enabled) .sound-toggle{min-width:120px;height:39px;right:9px;bottom:39px}.archive-card:after{right:8px;top:3px;font-size:21px}.outro:before{font-size:clamp(76px,21vw,180px)}}
@media(prefers-reduced-motion:reduce){.cover-kicker:before,.cover-grid:after,.cover-title h1,.cover-title h1 span,.poster.has-video:not(.hovering) .brand-lockup,.outro h2{animation:none!important}.cover-grid:before,.cover-grid:after{display:none}.cover-tile:before{display:none}}

/* Five client panels become one full, uncropped video canvas on hover. */
.cover-grid.brand-stage{display:flex;gap:4px;width:min(1250px,100%);height:auto;min-height:0;max-height:none;aspect-ratio:16/9;margin-inline:auto;perspective:none;background:#080909;box-shadow:0 30px 100px #000a}
.brand-stage .brand-tile{position:relative;flex:1 1 0%;height:100%;min-width:0;overflow:hidden;isolation:isolate;transform:none!important;filter:none;transition:flex .75s cubic-bezier(.2,.72,.12,1),opacity .45s,filter .5s;background:#111;cursor:pointer}
.brand-stage .brand-tile:after{z-index:2;background:linear-gradient(180deg,#05060721,transparent 35%,#050607a8 100%)}
.brand-stage .brand-video{z-index:0;opacity:1;object-fit:cover;object-position:center;transition:filter .5s,object-fit .2s}
.brand-stage .brand-tile.is-active .brand-video{object-fit:contain;background:#050607;filter:saturate(1.04)}
.brand-stage .brand-tile:not(.is-active):hover .brand-video{filter:brightness(1.14) saturate(1.12)}
.brand-tint{position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(140deg,#07120b20,transparent 45%,#0007)}
.brand-stage .brand-branding{position:absolute;z-index:6;inset:19px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none;color:#fff}
.brand-number{font:8px var(--mono);letter-spacing:.15em;color:#ffffffd6;text-shadow:0 2px 8px #000}
.brand-mark{position:absolute;left:0;right:0;top:50%;display:flex;justify-content:center;align-items:center;gap:10px;transform:translateY(-50%);font-size:clamp(18px,2.4vw,32px);font-weight:750;letter-spacing:-.06em;text-shadow:0 3px 20px #000b;transition:all .55s cubic-bezier(.2,.72,.12,1)}
.brand-mark svg{width:clamp(28px,3.4vw,44px);height:auto;flex:none;filter:drop-shadow(0 3px 10px #0007)}
.brand-mark.revolut-mark{letter-spacing:-.07em}
.brand-hint{display:flex;align-items:center;gap:7px;align-self:flex-start;color:#ffffffc9;font:8px var(--mono);letter-spacing:.13em;text-shadow:0 2px 8px #000;text-transform:uppercase}
.brand-hint:before{content:"";width:16px;height:1px;background:var(--acid)}
.brand-placeholder.tile-c{background:linear-gradient(145deg,#241b25,#58384a 48%,#171719)}
.brand-placeholder.tile-d{background:linear-gradient(135deg,#132729,#3c6764 52%,#111817)}
.brand-placeholder.tile-e{background:linear-gradient(145deg,#29231a,#735c32 50%,#141411)}
.placeholder-mark{font:700 clamp(34px,7vw,84px)/1 var(--mono);letter-spacing:-.12em;color:#ffffffce}
.brand-placeholder.tile-c .placeholder-mark{color:#e8aac7}
.brand-placeholder.tile-d .placeholder-mark{color:#a5d8cf}
.brand-placeholder.tile-e .placeholder-mark{color:#e8cb8c}
.placeholder-mark:before{content:"";position:absolute;inset:-.22em -.3em;border:1px solid currentColor;transform:rotate(-13deg);opacity:.42}
.brand-stage.has-active .brand-tile:not(.is-active){flex:0 0 0%;opacity:0;pointer-events:none;filter:blur(4px)}
.brand-stage.has-active .brand-tile.is-active{z-index:5;flex:1 1 100%;filter:none}
.brand-stage.has-active .brand-tile.is-active .brand-branding{justify-content:flex-start}
.brand-stage.has-active .brand-tile.is-active .brand-mark{top:0;left:0;right:auto;transform:none;font-size:clamp(18px,2vw,26px);text-shadow:0 2px 10px #000}
.brand-stage.has-active .brand-tile.is-active .brand-mark svg{width:30px}
.brand-stage.has-active .brand-tile.is-active .brand-hint{margin-top:auto}
.brand-stage.has-active .cover-title{opacity:0;visibility:hidden;transform:translate(-50%,-44%) scale(.97);transition:opacity .2s,transform .4s,visibility 0s .3s}
.brand-stage.has-active .cover-title h1,.brand-stage.has-active .cover-title h1 span{animation:none}
.brand-stage.has-active .brand-tile.is-active:not(.sound-enabled) .sound-toggle{opacity:1!important;pointer-events:auto!important;transform:scale(1)!important;width:auto;min-width:132px;height:42px;padding:0 13px;display:flex;align-items:center;justify-content:center;gap:9px;background:#ffc20e;color:#171716;border:1px solid #ffe27e;box-shadow:0 7px 28px #0008,0 0 0 5px #ffc20e20;font:800 9px var(--mono);letter-spacing:.1em}
.brand-stage.has-active .brand-tile.is-active:not(.sound-enabled) .sound-toggle:after{content:"ACTIVER LE SON";white-space:nowrap}
.brand-stage.has-active .brand-tile.sound-enabled .sound-toggle{opacity:0!important;pointer-events:none!important;transform:scale(.8)!important}
.brand-stage.has-active .brand-placeholder.is-active .brand-mark{font-size:clamp(68px,16vw,180px);opacity:.6}
.brand-stage .brand-number,.brand-stage .brand-hint{padding:7px 9px;background:#10110ff2;border:1px solid #ffffff3d;border-radius:4px;box-shadow:0 6px 20px #0008;color:#fff;text-shadow:none;backdrop-filter:blur(8px)}
.brand-stage .brand-mark:not(.placeholder-mark){width:max-content;max-width:100%;margin-inline:auto;padding:12px 18px;background:#080909d9;border:1px solid #ffffff4a;border-radius:6px;box-shadow:0 9px 28px #0009;backdrop-filter:blur(10px)}
.brand-stage.has-active .brand-tile.is-active .brand-mark:not(.placeholder-mark){margin:0;padding:8px 12px;background:#080909df;border-color:#ffffff55}
.brand-stage .brand-placeholder .brand-mark{text-shadow:0 4px 18px #000,0 1px 3px #000}
.project-copy .index{color:#aaa8a2}
.scroll-label{color:#b5b2aa}
.footer{color:#a6a49e}
@media(max-width:760px){.cover-grid.brand-stage{display:flex;flex-direction:column;gap:3px;width:100%;height:auto;min-height:0;aspect-ratio:16/9;grid-template-columns:none;grid-template-rows:none}.cover-grid.brand-stage:not(.has-active){height:clamp(255px,72vw,360px);aspect-ratio:auto}.cover-grid.brand-stage.has-active{height:clamp(180px,56.25vw,420px);aspect-ratio:auto}.brand-stage .brand-tile{width:100%;min-height:0}.brand-stage .brand-branding{inset:8px 12px}.brand-number,.brand-hint{font-size:7px}.brand-mark{gap:6px;font-size:15px}.brand-mark svg{width:23px}.brand-stage.has-active .brand-tile.is-active .brand-branding{inset:12px}.brand-stage.has-active .brand-tile.is-active .brand-mark{font-size:17px}.brand-stage.has-active .brand-tile.is-active .brand-mark svg{width:24px}.brand-stage.has-active .brand-placeholder.is-active .brand-mark{font-size:60px}.brand-stage.has-active .brand-tile.is-active:not(.sound-enabled) .sound-toggle{min-width:120px;height:39px;right:9px;bottom:16px}}
@media(prefers-reduced-motion:reduce){.brand-stage .brand-tile,.brand-stage .brand-mark{transition-duration:.01ms!important}.brand-stage .brand-video{transition:none}}
.cover-title-above{position:relative;left:auto;top:auto;transform:none;width:min(1250px,100%);margin:0 auto 18px;text-align:center;pointer-events:none;text-shadow:none}
.cover-title-above h1{font-size:clamp(38px,5.5vw,78px);line-height:.84}
@media(max-width:760px){.cover-title-above{margin-bottom:14px}.cover-title-above h1{font-size:clamp(34px,9vw,58px)}}
.project-copy h2{color:#f5f3ed;text-shadow:0 2px 24px #0009}
.project-copy p{color:#c9c6be}
.project-copy .index{color:#b9b6ae}
.outro-content h2{color:#f5f3ed!important;text-shadow:0 3px 28px #000b,0 0 1px #fff}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,[data-video]:focus-visible{outline:2px solid var(--acid);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.project-copy h2{animation:none!important}}
.brand-stage .tile-c .brand-tint{background:linear-gradient(140deg,#13060730,#52121b68 50%,#1006079c)}
.brand-mark.tinder-mark,.tinder-lockup{background:linear-gradient(95deg,#ff795d,#ff3c72);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 3px 20px #0008}
.brand-cover.tinder{background:linear-gradient(135deg,#16090b,#351015 52%,#0d080a)}
.brand-cover.tinder .brand-lockup{font-size:clamp(32px,5vw,58px);font-weight:800;letter-spacing:-.075em}
.brand-stage .brand-mark.tinder-mark{background:#080909d9;color:#ff735f;-webkit-background-clip:border-box;background-clip:border-box}
.brand-stage .brand-mark.tinder-mark span,.tinder-lockup span{display:inline-block;background:linear-gradient(95deg,#ff795d,#ff3c72);-webkit-background-clip:text;background-clip:text;color:transparent}
.tinder-lockup{background:none;color:#fff;text-shadow:none}
.brand-stage .brand-mark.tinder-mark svg{width:28px;height:auto;flex:none;color:#ff6b6b;filter:drop-shadow(0 2px 8px #ff6b6b55)}
.brand-cover .tinder-lockup svg{width:38px;height:auto;flex:none;color:#ff6b6b;filter:drop-shadow(0 2px 8px #ff6b6b55)}
.cover-title-above h1{color:#f5f3ed!important}
.brand-stage .basic-fit-logo{display:block;width:clamp(100px,13vw,170px);height:auto;max-width:100%}
.brand-cover.basic-fit{background:linear-gradient(135deg,#191815,#2b241b 58%,#120f0b)}
.brand-cover .basic-fit-lockup{width:min(66%,480px);justify-content:center}
.brand-cover .basic-fit-lockup img{display:block;width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 8px 26px #0009)}


.archive-card.has-video{aspect-ratio:16/9;isolation:isolate;background:#080909;cursor:pointer}.archive-card.has-video:after{display:none}.archive-card.has-video .brand-video{z-index:0;opacity:0;object-fit:contain;object-position:center;background:#070807;transition:opacity .4s,transform .7s}.archive-card.has-video.hovering .brand-video{opacity:1;transform:scale(1)}.archive-brand-logo{position:absolute;z-index:1;inset:0;display:grid;place-items:center;background:var(--archive-brand-bg);transition:opacity .35s,transform .6s cubic-bezier(.2,.7,.2,1)}.archive-card.has-video.hovering .archive-brand-logo{opacity:0;transform:scale(1.08);pointer-events:none}.archive-brand-lockup{display:flex;align-items:center;justify-content:center;gap:13px;padding:12px 18px;color:#f7f5ef;font:750 clamp(19px,2.2vw,30px)/1 Arial,sans-serif;letter-spacing:-.06em;text-shadow:0 3px 18px #0009}.archive-brand-lockup svg{width:clamp(28px,3.2vw,42px);height:auto;flex:none;filter:drop-shadow(0 3px 10px #0007)}.claude-logo{--archive-brand-bg:radial-gradient(circle at 50% 50%,#53382d,#171412 72%)}.claude-logo .archive-brand-lockup svg{color:#e58f61}.tinder-logo{--archive-brand-bg:radial-gradient(circle at 50% 48%,#531d28,#170d11 72%)}.tinder-logo .archive-brand-lockup{color:#ff6c70}.youtube-logo{--archive-brand-bg:radial-gradient(circle at 50%,#3b1819,#151111 72%)}.youtube-logo .archive-brand-lockup svg{width:42px;color:#f22}.deezer-logo{--archive-brand-bg:radial-gradient(circle at 50%,#252039,#100f16 72%)}.deezer-logo .archive-brand-lockup svg{width:42px;fill:#a652ef}.archive-card.has-video .sound-toggle{top:12px;right:12px;bottom:auto;width:38px;height:38px;opacity:1!important;pointer-events:auto!important;transform:scale(1)!important;background:#171716db;color:#fff;border-color:#ffffff8c}.archive-card.has-video .sound-toggle:hover{background:var(--yellow);color:#171716;border-color:var(--yellow)}.archive-card.has-video.sound-enabled .sound-toggle{opacity:0!important;pointer-events:none!important;transform:scale(.8)!important}.archive-card.has-video .archive-no{z-index:2;text-shadow:0 2px 9px #000}.archive-card.has-video .archive-name{z-index:2;left:13px;right:13px;bottom:12px;text-shadow:0 2px 9px #000}.archive-card.has-video.hovering .archive-name span:last-child{color:var(--acid)}

.brand-stage .chatgpt-tile{background:linear-gradient(145deg,#203c32,#11231d 58%,#101211)}.brand-stage .chatgpt-mark{color:#e8fff3}.brand-stage .chatgpt-mark svg{color:#b5f5d5}.brand-stage .deezer-mark{gap:7px;color:#f7f4ff}.brand-stage .deezer-mark svg{width:clamp(24px,2.8vw,36px)}
.brand-mark.chatgpt-mark img{display:block;width:44px;height:36px;object-fit:contain;background:#fff;border-radius:3px}.brand-stage.has-active .brand-tile.is-active .brand-mark.chatgpt-mark img{width:32px;height:28px}.brand-stage .deezer-mark{padding:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none;overflow:hidden}.brand-stage .deezer-mark img{display:block;width:clamp(102px,14vw,180px);height:auto}.brand-stage.has-active .brand-tile.is-active .brand-mark.deezer-mark{padding:0;background:transparent;border:0;box-shadow:none}.brand-stage.has-active .brand-tile.is-active .brand-mark.deezer-mark img{width:clamp(90px,10vw,132px)}.brand-stage.has-active .brand-tile.is-active .basic-fit-logo{width:54px}.brand-cover .basic-fit-lockup{width:min(26%,210px);justify-content:center}.brand-cover .basic-fit-lockup img{display:block;width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 8px 26px #0009)}.archive-brand-logo.deezer-logo{background:#a52cff}.deezer-logo-image{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:760px){.brand-stage.has-active .brand-tile.is-active .basic-fit-logo{width:42px}.brand-stage .deezer-mark img{width:clamp(112px,55vw,180px)}.brand-stage.has-active .brand-tile.is-active .brand-mark.deezer-mark img{width:clamp(100px,46vw,145px)}}
.brand-stage .chatgpt-mark img{display:block;width:40px;height:40px;object-fit:contain;background:#fff;border-radius:3px}.brand-stage .basic-fit-mark .basic-fit-logo{display:block;width:27px;height:42px;object-fit:contain;max-width:none}.brand-stage.has-active .brand-tile.is-active .basic-fit-mark .basic-fit-logo{width:25px;height:38px}.brand-stage .deezer-mark .deezer-symbol,.archive-brand-lockup .deezer-symbol{display:block;flex:none;width:42px;height:46px;overflow:hidden;border-radius:4px;background-image:url("deezer-brand-logo.png");background-repeat:no-repeat;background-position:center top;background-size:110px 62px}.brand-stage.has-active .brand-tile.is-active .deezer-mark .deezer-symbol{width:32px;height:36px;background-size:88px 50px}.brand-stage .deezer-mark{gap:9px;padding:12px 18px;background:#080909d9;border:1px solid #ffffff4a;box-shadow:0 9px 28px #0009;backdrop-filter:blur(10px)}.brand-stage.has-active .brand-tile.is-active .brand-mark.deezer-mark{padding:8px 12px;background:#080909df;border:1px solid #ffffff55;box-shadow:0 9px 28px #0009}.brand-cover .basic-fit-lockup{width:max-content;max-width:84%;justify-content:center;gap:14px}.brand-cover .basic-fit-lockup img{display:block;width:34px;height:58px;object-fit:contain;filter:drop-shadow(0 8px 18px #0009)}.archive-brand-logo.deezer-logo{background:radial-gradient(circle at 50%,#6728a0,#17121e 74%)}.deezer-logo .archive-brand-lockup{color:#f7f4ff}.deezer-logo .archive-brand-lockup .deezer-symbol{width:42px;height:46px;background-size:110px 62px}
@media(max-width:760px){.brand-stage .basic-fit-mark .basic-fit-logo{width:23px;height:36px}.brand-cover .basic-fit-lockup img{width:28px;height:48px}.brand-stage .deezer-mark .deezer-symbol{width:30px;height:36px;background-size:88px 50px}}
/* Keep every logo capsule in the hero band the same size. */
.brand-stage .brand-mark:not(.placeholder-mark){width:clamp(154px,15vw,190px);max-width:calc(100% - 20px);height:64px;box-sizing:border-box;padding:8px 12px;gap:9px;justify-content:center;align-items:center}
.brand-stage .brand-mark:not(.placeholder-mark) img,.brand-stage .brand-mark:not(.placeholder-mark) svg{flex:none}
.brand-stage .deezer-mark .deezer-symbol{width:40px;height:44px;background-size:105px 59px}
.brand-stage.has-active .brand-tile.is-active .brand-mark.deezer-mark .deezer-symbol{width:30px;height:36px;background-size:88px 50px}
@media(max-width:760px){.brand-stage .brand-mark:not(.placeholder-mark){width:154px;height:48px;padding:6px 10px;gap:7px}.brand-stage .brand-mark.chatgpt-mark img{width:28px;height:28px}.brand-stage .basic-fit-mark .basic-fit-logo{width:22px;height:34px}.brand-stage .deezer-mark .deezer-symbol{width:28px;height:32px;background-size:82px 46px}.brand-stage.has-active .brand-tile.is-active .brand-mark.deezer-mark .deezer-symbol{width:28px;height:32px;background-size:82px 46px}}
/* Shared alignment across the hero band and project chapters. */
.cover-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.cover-grid .cover-tile{--lift:0px}
.project-top{width:min(1420px,100%);margin-inline:auto}.project-layout{grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:clamp(28px,4vw,64px)}.project-copy{width:min(100%,360px);justify-self:center}
.archive-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.archive-card.has-video{aspect-ratio:16/9}.archive-card.has-video .sound-toggle{width:42px;height:42px}
@media(max-width:760px){.cover-grid.brand-stage:not(.has-active) .brand-tile{flex:1 1 0;min-height:0}.cover-grid.brand-stage.has-active .brand-tile:not(.is-active){flex:0 0 0%}.cover-grid.brand-stage.has-active .brand-tile.is-active{flex:1 1 100%}.project-layout,.project:nth-of-type(even) .project-layout{grid-template-columns:minmax(0,1fr);gap:17px}.project-copy,.project:nth-of-type(even) .project-copy{width:100%;justify-self:stretch}.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.archive-card.has-video .sound-toggle{width:38px;height:38px}}
/* Keep every cover video as a softly blurred backdrop from first paint. */
.brand-stage .brand-video{filter:blur(8px) brightness(.7) saturate(.78);transform:scale(1.08);transition:filter .55s,transform .55s,object-fit .2s}
.brand-stage .brand-tile.is-active .brand-video{filter:none;transform:scale(1)}
.brand-stage .brand-tile:not(.is-active):hover .brand-video{filter:none;transform:scale(1)}
/* A soft, staggered fade for the portfolio headline. */
.cover-title h1{animation:hero-line-fade .9s cubic-bezier(.2,.75,.25,1) both}
.cover-title h1 span{animation:hero-line-fade .9s .18s cubic-bezier(.2,.75,.25,1) both}
@keyframes hero-line-fade{from{opacity:0;filter:blur(10px);transform:translateY(22px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.cover-title h1,.cover-title h1 span{animation:none!important}}

/* Project-specific brand covers. */
.brand-cover.claude{background:radial-gradient(circle at 52% 46%,#53382d,#171412 72%)}.claude-lockup svg{color:#e58f61}.brand-cover.tinder{background:radial-gradient(circle at 50% 48%,#531d28,#170d11 72%)}.tinder-lockup{color:#ff6c70}.brand-cover.youtube{background:radial-gradient(circle at 50%,#3b1819,#151111 72%)}.youtube-lockup svg{width:clamp(44px,5vw,64px);color:#f22}.brand-cover.uber-eats{background:radial-gradient(ellipse at 50% 42%,#124b35,#07130e 72%)}.uber-eats-lockup{flex-direction:column;gap:3px;font-size:clamp(42px,6vw,76px);line-height:.8;letter-spacing:-.09em}.uber-eats-lockup span:last-child{color:#06c167}.uber-eats-poster{cursor:default;background:#07130e}
/* Lightweight scroll and media rendering. */
.grain{background-image:radial-gradient(#ffffff16 .45px,transparent .6px);background-size:4px 4px;opacity:.08;contain:strict}
.cover-grid:before{display:none!important}
.cover-grid:after{animation:none!important;opacity:.2;top:50%!important}
.cover-tile:before{display:none}
.brand-stage .brand-video{filter:blur(5px) brightness(.76) saturate(.82);transform:scale(1.04);transition:filter .35s ease,transform .35s ease,opacity .25s ease;will-change:auto}
.brand-stage .brand-tile.is-active .brand-video,.brand-stage .brand-tile:hover .brand-video{filter:none;transform:translateZ(0) scale(1)}
.brand-stage .brand-tile:not(.is-active):hover .brand-video{filter:none;transform:translateZ(0) scale(1)}
.brand-stage .brand-tile:not(.is-active){transition:flex .5s cubic-bezier(.2,.72,.12,1),opacity .25s ease}
.brand-stage .brand-mark,.brand-stage .brand-hint,.brand-stage .brand-number{backdrop-filter:none!important}
.poster,.brand-video,.project-copy{backdrop-filter:none}
.poster.has-video{contain:paint;backface-visibility:hidden}
.project-copy,.poster{transition:opacity .35s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
.project-copy{will-change:auto}
.project.scroll-active .project-copy{opacity:1;transform:translate3d(0,0,0)}
.project.scroll-active .poster{opacity:1;transform:translate3d(0,0,0) scale(1)}
.project .poster-sheen{display:none}
.poster.has-video:not(.hovering) .brand-lockup{animation:none!important}
.outro h2{animation:none!important}
@media(prefers-reduced-motion:reduce){.project-copy,.poster,.brand-stage .brand-tile{transition:none!important}.project-copy,.poster{opacity:1!important;transform:none!important}}