@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;600;700&display=swap');
:root{--paper:#faf9f6;--ink:#181818;--muted:#6a6861;--line:#c9c6be;--soft:#eeece7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;padding:14px 22px 0;background:var(--paper);color:var(--ink);font-family:var(--font)}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid #190615;outline-offset:5px}.skip{position:fixed;top:-80px;background:var(--ink);color:white;padding:16px;z-index:100}.skip:focus{top:10px}header{display:flex;align-items:center;gap:12px;background:var(--soft);padding:6px 10px;border-radius:4px;position:sticky;top:12px;z-index:2;font-size:12px}.name{white-space:nowrap;background:var(--paper);padding:4px 8px}.star{font-size:15px;margin-left:12px}.role{font-size:10px}nav{margin-left:auto;display:flex;gap:26px}nav a{padding:6px 0}nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:4px}.menu{display:none}.hand{font-family:Caveat,'Bradley Hand',cursive;font-weight:600}.home{min-height:calc(100svh - 105px);position:relative;display:grid;grid-template-columns:1.5fr 1fr;gap:6vw;align-items:center;padding:55px 4vw 60px}.hello{font-size:40px;margin:0 0 18px;transform:rotate(-3deg);width:fit-content}h1{font-size:clamp(58px,7.6vw,112px);line-height:.99;letter-spacing:-.06em;margin:0;font-weight:600}.underlined{position:relative}.underlined:after{content:'';position:absolute;bottom:-5px;left:0;width:100%;height:9px;border-top:3px solid var(--ink);border-radius:50%;transform:rotate(-2deg)}.punctuation{font-size:1.15em;line-height:0;display:inline-block;margin-left:12px;transform:rotate(12deg)}.intro-bottom{display:flex;gap:35px;align-items:end;margin-top:35px}.intro-bottom p{font-size:14px;line-height:1.5;margin:0}.arrow-link{font-size:13px;border-bottom:1px solid var(--ink);padding-bottom:7px;white-space:nowrap}.arrow-link span{padding-left:20px}.portrait-wrap{position:relative;justify-self:end;width:min(100%,350px);transform:rotate(3deg);margin-bottom:30px}.portrait{aspect-ratio:4/5;overflow:hidden;background:#edece7}.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;mix-blend-mode:multiply}.portrait-note{font-size:30px;text-align:center;margin:12px 0;transform:rotate(-6deg)}.portrait-link{position:absolute;inset:0}.home-note{position:absolute;bottom:12px;left:4vw;right:4vw;display:flex;justify-content:space-between;font-size:10px;line-height:1.4;color:var(--muted)}.home-note .hand{font-size:24px;color:var(--ink)}footer{border-top:1px solid var(--line);padding:18px 0;display:flex;justify-content:space-between;font-size:10px}.footer-note{color:var(--muted)}section:not(.home){padding:60px 4vw 80px;min-height:calc(100svh - 105px)}[hidden]{display:none!important}.eyebrow{display:block;font-size:27px;margin-bottom:22px}.page-heading{max-width:850px;margin-bottom:55px}.page-heading h1{font-size:clamp(55px,7vw,98px)}.page-heading p{max-width:440px;font-size:15px;line-height:1.5;margin-top:30px}.filters{display:flex;flex-wrap:wrap;gap:9px;margin:25px 0}.filters button{background:none;border:1px solid var(--line);padding:8px 12px;border-radius:0;cursor:pointer;font-size:12px}.filters button.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.project-row{width:100%;background:none;border:0;border-top:1px solid var(--line);display:grid;grid-template-columns:55px 1fr auto;align-items:center;padding:18px 0;text-align:left;color:var(--ink);cursor:pointer}.project-row:last-child{border-bottom:1px solid var(--line)}.project-row h2{font-size:clamp(30px,4vw,58px);line-height:1;letter-spacing:-.04em;margin:0;font-weight:500}.project-row .number{font-size:12px;color:var(--muted)}.project-row .category{font-size:15px;color:var(--muted)}.big-link{display:flex;justify-content:space-between;align-items:center;margin-top:45px;font-size:20px}.big-link .hand{font-size:38px}.strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px}.strategy-grid article,.lab-list article{border-top:1px solid var(--line);padding:25px 0}.strategy-grid article .hand,.lab-list article .hand{font-size:26px}.strategy-grid h2,.lab-list h2{font-size:38px;letter-spacing:-.035em;margin:20px 0 8px;font-weight:500}.strategy-grid p,.lab-list p{font-size:14px;line-height:1.5;color:var(--muted)}.lab-word{font-size:1.1em;letter-spacing:-.03em}.lab-list{max-width:850px}.draft-note{color:var(--muted);font-size:12px;line-height:1.5;margin-top:35px;max-width:550px}.search{display:block;font-size:12px;max-width:500px}.search input{display:block;width:100%;margin-top:10px;border:0;border-bottom:1px solid var(--ink);padding:12px 0;background:none;color:var(--ink);border-radius:0}.index-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--line);padding:18px 0;font-size:20px}.index-row span:last-child{font-size:13px;color:var(--muted);text-align:right}.profile-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:8vw;align-items:start}.profile-grid h1{font-size:clamp(50px,6vw,90px)}.profile-grid p{max-width:460px;line-height:1.55;font-size:16px}.profile-grid .profile-lead{font-size:38px;line-height:1.2;letter-spacing:-.025em}.profile-grid img{width:100%;max-height:570px;object-fit:cover;transform:rotate(2deg);mix-blend-mode:multiply}.profile-capabilities{display:flex;flex-wrap:wrap;gap:20px;border-top:1px solid var(--line);padding-top:25px;margin-top:60px;font-size:14px}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:55px;width:min(90vw,800px);max-height:85svh}dialog::backdrop{background:#0007}dialog h2{font-size:60px;letter-spacing:-.05em;margin:25px 0}dialog p,dialog li{line-height:1.6}dialog .hand{font-size:26px}.close{float:right;background:none;border:0;border-bottom:1px solid;cursor:pointer;padding:8px}.detail-plan{border-top:1px solid var(--line);padding-top:25px;margin-top:30px}button{transition:transform 180ms cubic-bezier(.23,1,.32,1)}button:active{transform:scale(.98)}@media(hover:hover){.project-row:hover h2{transform:translateX(12px)}.project-row h2{transition:transform 220ms cubic-bezier(.23,1,.32,1)}nav a:hover,.arrow-link:hover{opacity:.65}}@media(min-width:1600px){body{max-width:1800px;margin:auto}}@media(max-width:760px){body{padding:12px 14px 0}header{flex-wrap:wrap}.role{display:none}.menu{display:block;margin-left:auto;background:none;border:0;padding:8px;font-size:12px;cursor:pointer}nav{display:none;width:100%;margin:0;gap:0;justify-content:space-between;padding:10px 5px}nav.open{display:flex}.home{grid-template-columns:1fr;padding:40px 7px 70px;gap:40px;align-items:start}.hello{font-size:33px}h1{font-size:clamp(46px,12vw,82px)}.intro-bottom{flex-wrap:wrap;gap:22px;margin-top:30px}.portrait-wrap{width:52%;justify-self:end;margin-right:15px;margin-bottom:45px}.portrait-note{font-size:25px}.home-note{left:7px;right:7px}.home-note .hand{font-size:22px}section:not(.home){padding:40px 7px 65px}.page-heading{margin-bottom:35px}.page-heading h1{font-size:clamp(44px,12vw,74px)}.project-row{grid-template-columns:30px 1fr;gap:6px}.project-row .category{grid-column:2;font-size:12px}.project-row h2{font-size:39px}.strategy-grid,.profile-grid{grid-template-columns:1fr}.strategy-grid{gap:10px}.strategy-grid h2,.lab-list h2{font-size:30px}.profile-grid img{max-width:300px;justify-self:end}.big-link{font-size:14px}.big-link .hand{font-size:29px}.index-row{font-size:17px}.footer-note{display:none}dialog{padding:25px}dialog h2{font-size:44px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.project-row:hover h2{transform:none}}
/* Visual collections and image-led project stories. */
.case-grid,.lab-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px 30px}.case-card{display:block}.image-slot{margin:0;min-width:0}.slot-art{aspect-ratio:16/10;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:30px;overflow:hidden;color:#57544c;text-align:center}.slot-art:before,.slot-art:after{content:'';position:absolute;inset:16%;border:1px solid #ffffff80;transform:rotate(-8deg);pointer-events:none}.slot-art:after{inset:24%;transform:rotate(8deg)}.slot-cross{font-size:42px;font-family:Caveat,cursive;position:absolute;top:12%;right:12%;transform:rotate(12deg)}.slot-label{font-size:10px;letter-spacing:.2em;z-index:1}.slot-art strong{font-weight:400;font-size:clamp(15px,2vw,27px);letter-spacing:-.02em;margin:15px 0;max-width:80%;z-index:1}.slot-line{width:40px;height:1px;background:currentColor}.image-slot figcaption{display:flex;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted);padding-top:10px}.image-slot figcaption span{white-space:nowrap}.card-line{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-top:20px}.card-line h2,.lab-card h2{font-size:32px;font-weight:500;letter-spacing:-.035em;margin:0}.case-card p,.strategy-card p,.lab-card p{font-size:14px;line-height:1.5;max-width:480px}.case-card small,.lab-card small{font-size:10px;color:var(--muted)}.case-card .card-line>span{transition:transform 220ms ease-out}.case-card:hover .card-line>span{transform:translate(3px,-3px)}.case-card .slot-art{transition:transform 220ms ease-out}.case-card:hover .slot-art{transform:translateY(-3px)}.visual-grid{gap:65px 30px}.strategy-grid .strategy-card{border:0;padding:0}.strategy-card .hand{font-size:27px}.strategy-card details,.lab-card details{border-top:1px solid var(--line);padding-top:16px;margin-top:20px;font-size:14px}.strategy-card details h3{font-size:20px;font-weight:500}.strategy-card summary,.lab-card summary{cursor:pointer;list-style:none;padding:8px 0}.strategy-card summary:focus-visible,.lab-card summary:focus-visible{outline:2px solid #190615;outline-offset:3px}.flag{font-size:10px!important;line-height:1.6;color:#80633c!important}.lab-banner{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin-bottom:45px;font-family:Caveat,cursive;font-size:29px}.lab-card .lab-number{font-size:24px;display:block;margin:20px 0 10px}.lab-card h2{font-size:28px}.lab-card small{display:block;margin:10px 0}.text-link{display:inline-block;margin-top:20px;border-bottom:1px solid;font-size:12px;padding-bottom:5px}.index-feature{display:grid;grid-template-columns:1fr 2fr;gap:35px;border-top:1px solid var(--line);padding:35px 0 50px}.index-copy .hand{font-size:23px}.index-copy h2{font-size:32px;letter-spacing:-.035em;font-weight:500;margin:20px 0}.index-copy p{font-size:14px;line-height:1.5;max-width:330px}.index-images{display:grid;grid-template-columns:1fr 1fr;gap:16px}.index-images .slot-art{aspect-ratio:4/5}.index-images .slot-art strong{font-size:17px}.case-page{padding:30px 4vw 70px}.case-page>.image-slot .slot-art{aspect-ratio:16/8}.case-title{padding:55px 0 35px}.case-title .hand{font-size:26px}.case-title h1{font-size:clamp(50px,7vw,100px);margin:20px 0}.case-title p{font-size:24px;max-width:760px;line-height:1.35;letter-spacing:-.025em}.credentials{display:grid;grid-template-columns:1fr 1.4fr 1fr 1.3fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:25px 0;gap:25px;margin:0}.credentials dt{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:12px}.credentials dd{margin:0;font-size:13px;line-height:1.5}.review-flag{font-size:10px;line-height:1.5;color:var(--muted);padding:20px 0;max-width:650px}.story-block{display:grid;grid-template-columns:1fr 2fr;gap:30px;padding:65px 0 35px}.story-block>.hand{font-size:32px}.story-block h2{font-size:clamp(28px,3.5vw,47px);font-weight:500;line-height:1.05;letter-spacing:-.035em;margin:0 0 25px;max-width:690px}.story-block p{font-size:16px;line-height:1.6;max-width:640px}.lorem{color:var(--muted)}.story-image-pair{display:grid;grid-template-columns:1fr 1fr;gap:25px}.next-case{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:30px;margin-top:70px;font-size:13px}.next-case a:last-child{text-align:right}.next-case strong{display:block;font-weight:500;font-size:34px;margin-top:15px}.next-case .hand{font-size:24px}.reveal{opacity:1}.reveal:not(.visible){transform:translateY(10px)}.reveal.visible{transform:none;transition:transform 450ms cubic-bezier(.23,1,.32,1)}.portrait-wrap{transition:transform 230ms cubic-bezier(.23,1,.32,1)}
@media(max-width:760px){nav{font-size:10px}.case-grid,.lab-grid,.visual-grid{grid-template-columns:1fr;gap:40px}.card-line h2{font-size:28px}.lab-banner{font-size:22px;flex-wrap:wrap;justify-content:flex-start;gap:12px 25px}.index-feature{grid-template-columns:1fr;gap:20px;padding:30px 0 40px}.index-copy h2{margin:12px 0;font-size:29px}.index-images{gap:12px}.index-images .slot-art strong{font-size:13px}.slot-art{padding:15px}.image-slot figcaption{font-size:10px}.image-slot figcaption span{display:none}.case-page{padding:25px 7px 60px}.case-page>.image-slot .slot-art{aspect-ratio:4/3}.case-title{padding:35px 0 20px}.case-title p{font-size:21px}.credentials{grid-template-columns:1fr 1fr;gap:25px 15px}.story-block{grid-template-columns:30px 1fr;gap:15px;padding:40px 0 20px}.story-block p{font-size:15px}.story-image-pair{gap:12px}.story-image-pair .slot-art{aspect-ratio:3/4}.story-image-pair .slot-art strong{font-size:14px}.next-case strong{font-size:25px}}@media(prefers-reduced-motion:reduce){.reveal:not(.visible){transform:none}.portrait-wrap{transition:none}.case-card:hover .slot-art,.case-card:hover .card-line>span{transform:none}}
.more-index{background:var(--ink);color:var(--paper);border:0;padding:12px 20px;cursor:pointer;margin-top:25px;font-size:13px}main:focus{outline:none}
/* Latest review: quiet case rows and immersive strategy images. */
.case-grid{display:block}.case-grid .case-card{display:grid}.case-grid .card-line{margin:0}.case-grid .project-row h2{font-size:clamp(30px,4vw,58px)}
[data-page="strategy"] .visual-grid{display:block}.strategy-panel{display:block;position:relative;width:100%;margin-bottom:24px;overflow:hidden;background:#c9c4ba;aspect-ratio:16/10}.strategy-panel>img,.strategy-panel>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.pixel-layer{pointer-events:none;opacity:0;transition:opacity 120ms linear}.strategy-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:55px;background:linear-gradient(transparent,#000b);color:#fff;opacity:0;transition:opacity 220ms ease-out;z-index:2}.strategy-overlay h2{font-size:clamp(32px,4vw,60px);line-height:1.05;letter-spacing:-.04em;font-weight:500;max-width:800px;margin:15px 0}.strategy-overlay p{font-size:15px;line-height:1.5;max-width:550px}.strategy-overlay small{font-size:10px;letter-spacing:.03em}.strategy-overlay>span{font-size:12px;border-bottom:1px solid #fff;padding-bottom:6px;margin-top:15px}.strategy-panel:hover .strategy-overlay,.strategy-panel:focus-visible .strategy-overlay{opacity:1}.image-caption,.panel-hint{position:absolute;z-index:1;bottom:25px;color:white;font-size:12px}.image-caption{left:30px}.panel-hint{right:30px}.strategy-panel:hover .image-caption,.strategy-panel:focus-visible .image-caption{opacity:0}.strategy-panel:hover .panel-hint,.strategy-panel:focus-visible .panel-hint{opacity:0}
/* Independent sections release their sticky text at their own boundary. */
.case-page .sticky-story-section{display:grid;grid-template-columns:minmax(230px,1fr) minmax(0,1.8fr);gap:5vw;padding:70px 0 35px;min-height:0;align-items:start}.sticky-story-copy{position:sticky;top:105px;align-self:start;display:block;padding:0}.sticky-story-copy>.hand{font-size:28px;display:block;margin-bottom:20px}.sticky-story-copy h2{font-size:clamp(28px,3vw,44px);line-height:1.06;letter-spacing:-.035em;font-weight:500;margin:0 0 25px}.sticky-story-copy p{font-size:15px;line-height:1.6;margin:0}.scroll-story-images{display:grid;gap:35px}.scroll-story-images .slot-art{aspect-ratio:4/3}.scroll-story-images .slot-art strong{font-size:25px}.case-page .sticky-story-section+ .sticky-story-section{border-top:1px solid var(--line);margin-top:35px}
@media(max-width:760px){.strategy-panel{aspect-ratio:4/5}.strategy-overlay{opacity:1;padding:25px;background:linear-gradient(transparent 25%,#000b)}.strategy-overlay h2{font-size:31px}.strategy-overlay p{font-size:13px}.image-caption,.panel-hint{display:none}.case-page .sticky-story-section{display:block;padding:40px 0}.sticky-story-copy{position:static;margin-bottom:30px}.scroll-story-images{gap:25px}.scroll-story-images .slot-art strong{font-size:19px}}@media(prefers-reduced-motion:reduce){.pixel-layer{display:none}.strategy-overlay{transition:none}}
.slot-art>.pixel-layer,.portrait>.pixel-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;object-fit:cover;z-index:3}.portrait{position:relative}.pixel-layer{transition:none!important}
.project-footer{margin-left:0;width:100%;display:flex;gap:30px;align-items:flex-start}.next-project-link{max-width:75%}.next-project-link strong{line-height:1.15}.next-project-link strong span{display:inline-block;transition:transform 200ms ease-out}@media(hover:hover){.next-project-link:hover strong span{transform:translateX(8px)}}@media(max-width:760px){.project-footer{flex-direction:column;gap:30px}.project-footer .next-project-link{max-width:100%;text-align:left}.next-project-link strong{font-size:29px}}@media(prefers-reduced-motion:reduce){.next-project-link:hover strong span{transform:none}}
/* Index is a continuous sequence of category sections and image-first projects. */
#index-list .index-category{padding:45px 0 0;min-height:0}.index-category-heading{display:flex;align-items:baseline;gap:22px;border-top:1px solid var(--ink);padding:25px 0 35px}.index-category-heading .hand{font-size:28px}.index-category-heading h2{font-size:clamp(36px,5vw,65px);line-height:1;letter-spacing:-.04em;font-weight:500;margin:0}.index-feature{display:block;border-top:0;padding:0 0 65px}.index-copy{margin-bottom:25px;max-width:700px}.index-copy h2{font-size:30px;margin:10px 0}.index-copy p{max-width:620px;margin:12px 0}.index-copy>.hand{display:none}.index-images{width:100%;gap:25px}.index-images .slot-art{aspect-ratio:16/11}.index-images .slot-art strong{font-size:23px}@media(max-width:760px){#index-list .index-category{padding-top:25px}.index-category-heading{padding:20px 0 30px}.index-copy h2{font-size:27px}.index-images{grid-template-columns:1fr;gap:20px}.index-images .slot-art strong{font-size:20px}.index-feature{padding-bottom:45px}}
.index-images{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.index-images .slot-art{aspect-ratio:4/3;padding:15px}.index-images .slot-art strong{font-size:18px}.index-images .slot-cross{font-size:28px}.index-images .slot-label{font-size:8px;letter-spacing:.12em}.index-images figcaption{font-size:9px}.index-feature{padding-bottom:75px}@media(max-width:760px){.index-images{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.index-images .slot-art strong{font-size:14px}.index-images .slot-label{font-size:6px}.index-images .slot-cross{font-size:21px}.index-feature{padding-bottom:50px}}
.profile-cv{margin-top:65px}.cv-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.cv-heading h2{font-size:40px;letter-spacing:-.035em;font-weight:500;margin:0}.cv-embed{display:block;width:100%;height:900px;border:1px solid var(--line);background:white}.cv-mobile-link{display:inline-block;margin-top:15px;font-size:12px;border-bottom:1px solid;padding-bottom:5px}@media(max-width:760px){.cv-embed{height:650px}.cv-heading h2{font-size:32px}.profile-cv{margin-top:40px}}
.cv-document{background:#eeece7;padding:20px;border:1px solid var(--line)}.cv-document img{display:block;width:100%;max-width:900px;height:auto;margin:0 auto 20px}.cv-document img:last-child{margin-bottom:0}@media(max-width:760px){.cv-document{padding:5px}}
/* Palette sampled from Mallika’s existing Framer site. */
:root{--paper:#EEF4F9;--ink:#190615;--muted:#6A5866;--line:#C8D3DF;--soft:#E2EBF4}body{background:var(--paper);color:var(--ink)}.portrait{background:var(--paper)}.slot-art{color:var(--ink)!important;background:#E2EBF4!important}.tone-1 .slot-art,.tone-4 .slot-art{background:#E2EBF4!important}.tone-2 .slot-art,.tone-5 .slot-art{background:#E2EBF4!important}.cv-document{background:#E2EBF4}.flag{color:#6A5866!important}.brand-ticker{padding:10px 4vw 35px;border-top:1px solid var(--line)}.ticker-heading{display:flex;justify-content:space-between;align-items:center;font-size:10px;gap:20px;margin:15px 0}.ticker-heading button{border:0;background:none;color:var(--ink);border-bottom:1px solid var(--line);padding:5px 0;font-size:10px;cursor:pointer}.ticker-window{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent)}.ticker-track{display:flex;width:max-content;animation:logo-travel 32s linear infinite}.logo-set{display:flex;align-items:center;gap:45px;padding-right:45px}.logo-set img{object-fit:contain;width:150px;height:75px;mix-blend-mode:multiply}.ticker-track.paused,.ticker-window:hover .ticker-track{animation-play-state:paused}@keyframes logo-travel{to{transform:translateX(-50%)}}@media(max-width:760px){.brand-ticker{padding:10px 7px 25px}.logo-set{gap:25px;padding-right:25px}.logo-set img{width:120px;height:60px}}@media(prefers-reduced-motion:reduce){.ticker-track{animation:none;width:100%}.logo-set{flex-wrap:wrap;justify-content:center;padding:0;width:100%}.logo-set[aria-hidden]{display:none}.ticker-heading button{display:none}.ticker-window{mask-image:none}}
/* Softer blue paper; portraits retain their original colour. */
:root{--paper:#EEF4F9;--soft:#E2EBF4;--line:#C8D3DF}.portrait{background:#fff}.portrait img,.profile-grid img{mix-blend-mode:normal}.slot-art{background:#E2EBF4!important}.tone-1 .slot-art,.tone-4 .slot-art{background:#E2EBF4!important}.tone-2 .slot-art,.tone-5 .slot-art{background:#E2EBF4!important}.cv-document{background:#E2EBF4}

/* Exact colours sampled from Mallika’s supplied swatches. */
:root{--paper:#EEF4F9;--ink:#190615;--soft:#EEF4F9}body{background:#EEF4F9;color:#190615}header,.name{background:#EEF4F9}.portrait img,.profile-grid img{mix-blend-mode:normal}
/* Consistent burgundy typography and a more inset page frame. */
:root{--ink:#190615;--muted:#190615}body{width:80%;margin-inline:auto;padding-left:0;padding-right:0;max-width:1600px}body,button,input,summary,a,p,small,figcaption,h1,h2,h3,dt,dd,.flag,.draft-note,.slot-art,.index-row span:last-child,.strategy-overlay,.image-caption,.panel-hint{color:#190615!important}input::placeholder{color:#190615;opacity:.65}header{font-size:15.6px;gap:15px;flex-wrap:wrap}header nav{font-size:15.6px;gap:22px}header .name{padding:5px 8px}.menu{font-size:15.6px}.capability-menu{font-size:14.3px;position:relative}.capability-menu summary{list-style:none;cursor:pointer;padding:9px 0}.capability-menu summary::-webkit-details-marker{display:none}.capability-menu summary>span{display:inline-block;margin-left:7px}.capability-panel{position:absolute;top:100%;left:0;background:var(--paper);border:1px solid var(--line);padding:25px;box-shadow:0 10px 25px #19061512;width:520px;display:grid;grid-template-columns:1fr 1fr;gap:25px;z-index:20}.capability-panel h3{font-family:Caveat,cursive;font-size:25px;margin:0 0 12px;font-weight:600;letter-spacing:0}.capability-panel a{display:block;font-size:12px;line-height:1.4;padding:6px 0}.capability-panel a:hover{text-decoration:underline;text-underline-offset:3px}.filters button.active,.more-index{background:rgba(25,6,21,.05);color:var(--ink)!important;border:1px solid var(--ink)}.strategy-overlay{background:linear-gradient(transparent 10%,#eef4f9ed 70%)}.strategy-overlay>span{border-color:var(--ink)}.image-caption,.panel-hint{background:#eef4f9d9;padding:7px 10px}.slot-art strong{color:var(--ink)}@media(max-width:1100px){header nav{gap:15px}.capability-menu{font-size:13px}header,header nav{font-size:14px}}@media(max-width:760px){body{width:auto;margin:0;padding:12px 20px 0}.capability-menu{order:3;width:100%;font-size:13px}.capability-menu summary{padding:6px 8px}.capability-panel{position:relative;width:100%;box-shadow:none;padding:20px;gap:20px}header nav{font-size:13px}.menu{font-size:15.6px}.strategy-overlay{background:linear-gradient(transparent,#eef4f9f0 65%)}}
.brand-ticker{border-top:0;border-bottom:0}.ticker-heading p{font-weight:700;text-transform:uppercase;letter-spacing:.06em}.logo-set img{width:105px;height:53px}.brand-ticker+footer,body:has(.brand-ticker:not([hidden]))>footer{border-top:0}@media(max-width:760px){.logo-set img{width:85px;height:43px}}
/* Homepage: one introduction, one invitation, and a connected brand strip. */
.home{min-height:0;padding:70px 4vw 55px;align-items:center;gap:5vw}.home h1{font-size:clamp(56px,6.3vw,96px)}.home .punctuation{font-size:.8em;margin-left:10px;vertical-align:top;line-height:1}.intro-bottom{display:block;margin-top:35px}.intro-bottom p{font-size:16px;line-height:1.55;max-width:360px}.home-cta{display:inline-flex;align-items:center;gap:20px;font-size:30px;margin-top:23px;padding-bottom:4px;border-bottom:1px solid var(--ink);transform:rotate(-2deg)}.home-cta span{transition:transform 200ms ease-out}.home-cta:hover span{transform:translate(3px,-3px)}.home .portrait-wrap{margin:0;width:min(100%,320px)}.brand-ticker{padding:15px 4vw 30px;margin-top:0}.ticker-heading{margin:0 0 12px}.ticker-heading p{font-size:10px;letter-spacing:.12em}.ticker-window{padding:5px 0}.logo-set{gap:40px;padding-right:40px}.logo-set img{width:105px;height:53px}@media(min-width:1100px) and (min-height:850px){.home{padding-top:95px;padding-bottom:75px}}@media(max-width:760px){.home{padding:40px 7px 25px;grid-template-columns:1fr;gap:32px}.home h1{font-size:clamp(46px,11vw,74px)}.home .portrait-wrap{width:45%;justify-self:end;margin:0 10px 0 0;grid-row:2}.intro-bottom{margin-top:28px}.intro-bottom p{font-size:14px}.home-cta{font-size:27px;margin-top:20px}.brand-ticker{padding:22px 7px 25px}.logo-set{gap:25px;padding-right:25px}.logo-set img{width:85px;height:43px}}@media(prefers-reduced-motion:reduce){.home-cta:hover span{transform:none}}
/* White header with square upper corners. */
header{background:#fff;border-top-left-radius:0;border-top-right-radius:0}header .name{background:transparent}
/* Additional header inset and rounded upper corners. */
header{padding-left:13px;padding-right:13px;border-top-left-radius:12px;border-top-right-radius:12px}
@media(max-width:760px){header .capability-menu{display:none}}
.strategy-panel{aspect-ratio:16/9}.strategy-panel>img{object-fit:cover}@media(max-width:760px){.strategy-panel{aspect-ratio:4/5}.strategy-panel>img{object-fit:cover}}
/* Cover imagery stays quiet until its story is revealed. */
.strategy-panel .image-caption,.strategy-panel .panel-hint{display:none}
/* Keep Index categories within reach while browsing the continuous collection. */
#index-filters{position:sticky;top:var(--index-filter-top,72px);z-index:5;background:var(--paper);padding:12px 0;margin:20px 0 25px;border-bottom:1px solid var(--line)}
@media(max-width:760px){#index-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;top:var(--index-filter-top,70px);padding:10px 0}#index-filters button{flex-shrink:0}}
/* Only the opening project hero fills the viewport. Story imagery stays in its column. */
.case-page>.image-slot:first-child{position:relative;width:100vw;max-width:none;left:50%;margin-left:-50vw;margin-top:-30px}
.case-page>.image-slot:first-child .slot-art{width:100%;height:calc(100svh - var(--index-filter-top,76px));min-height:420px;aspect-ratio:auto}
.case-page>.image-slot:first-child figcaption{position:absolute;bottom:15px;left:4vw;right:4vw;z-index:4;padding:0}
.case-page>.image-slot:first-child>.slot-art>img{width:100%;height:100%;object-fit:cover}
@media(max-width:760px){.case-page>.image-slot:first-child{margin-top:-25px}.case-page>.image-slot:first-child .slot-art{height:calc(100svh - var(--index-filter-top,70px));min-height:360px}.case-page>.image-slot:first-child figcaption{left:20px;right:20px}}
/* Approved full-screen cover scope: project opening heroes and Strategy listing covers only. */
[data-page="strategy"] .strategy-panel{width:100vw;max-width:none;left:50%;margin-left:-50vw;aspect-ratio:auto;height:100svh;margin-bottom:0}
[data-page="strategy"] .strategy-panel>img,[data-page="strategy"] .strategy-panel>canvas{width:100%;height:100%;object-fit:cover}
[data-page="strategy"] .strategy-overlay{padding:clamp(25px,7vw,110px)}
.case-page>.image-slot:first-child .slot-art{height:100svh;min-height:0}
@media(max-width:760px){[data-page="strategy"] .strategy-panel{height:100svh;aspect-ratio:auto}.case-page>.image-slot:first-child .slot-art{height:100svh;min-height:0}}
/* Header capabilities: compact, stacked typography matching the supplied reference. */
.capability-panel{display:block;width:360px;max-width:calc(100vw - 40px);padding:22px 25px;background:#eaeaea;border:0;border-radius:0 0 8px 8px;box-shadow:none;max-height:calc(100svh - 100px);overflow-y:auto}.capability-panel>div+div{margin-top:24px}.capability-panel h3{font-family:var(--font);font-size:20px;font-weight:700;line-height:1.2;margin:0 0 7px;letter-spacing:-.025em}.capability-panel a{font-family:var(--font);font-size:16px;font-weight:400;line-height:1.3;padding:2px 0;letter-spacing:-.02em}.capability-menu summary{background:#fff;border-radius:7px;padding:7px 9px}
/* Original embedded PDF artwork, shown as individual assets without page furniture. */
.portfolio-image{position:relative;overflow:hidden;background:transparent;isolation:isolate}.portfolio-image>img{display:block;width:100%;height:auto;object-fit:contain}.portfolio-image>.pixel-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;z-index:2}.extracted-image figcaption{padding-top:12px;font-size:10px;line-height:1.4}.case-page>.extracted-image:first-child .portfolio-image{height:100svh;width:100%;background:var(--paper)}.case-page>.extracted-image:first-child .portfolio-image>img{width:100%;height:100%;object-fit:contain}.index-images .portfolio-image{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:#e2ebf4}.index-images .portfolio-image>img{height:100%;width:100%;object-fit:contain}.painting-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px 30px}.paintings-section{border-top:1px solid var(--line);padding-top:60px;margin-top:80px}.paintings-section h2{font-size:clamp(40px,6vw,75px);font-weight:500;letter-spacing:-.045em;line-height:1.05;margin:0}.painting-grid h3{font-size:25px;font-weight:500;letter-spacing:-.025em;margin:20px 0 10px}.painting-grid small{font-size:10px}.painting-grid p{font-size:14px;line-height:1.5;max-width:450px}.painting-grid .portfolio-image{aspect-ratio:4/3;background:#e2ebf4;display:flex;align-items:center}.painting-grid .portfolio-image>img{height:100%;object-fit:contain}@media(max-width:760px){.painting-grid{grid-template-columns:1fr;gap:35px}.paintings-section{margin-top:50px;padding-top:40px}}
.index-images[data-image-count="1"]{grid-template-columns:minmax(0,1fr);max-width:850px}.index-images[data-image-count="2"],.index-images[data-image-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}.index-images[data-image-count="1"] .portfolio-image{aspect-ratio:auto;min-height:0;background:transparent}.index-images[data-image-count="1"] .portfolio-image>img{height:auto;max-height:650px;width:100%;object-fit:contain}@media(max-width:760px){.index-images[data-image-count="1"] .portfolio-image>img{max-height:500px}.index-images[data-image-count="2"],.index-images[data-image-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
.auro-poster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.auro-poster-grid .portfolio-image{aspect-ratio:4/5;background:#e2ebf4;display:flex;align-items:center}.auro-poster-grid .portfolio-image>img{height:100%;width:100%;object-fit:contain}.auro-menu-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}.auro-composite{position:relative}.auro-composite>img.brand-logo{position:absolute;z-index:3;height:auto!important;object-fit:contain!important;mix-blend-mode:normal;width:32%!important;left:8%;top:24%}.auro-composite.system-board>img.brand-logo{left:8%;top:12%;width:40%!important}.auro-composite.identity-use>img.brand-logo{left:13%;top:30%;width:28%!important}.case-page>.extracted-image:first-child .auro-composite{height:100svh;display:flex;align-items:center;justify-content:center}.case-page>.extracted-image:first-child .auro-composite .artwork-stage{position:relative;width:100%;aspect-ratio:16/9}.artwork-stage>img.base-artwork{display:block;width:100%;height:100%;object-fit:cover}.artwork-stage>img.brand-logo{position:absolute;width:32%;left:8%;top:24%;height:auto;z-index:3}@media(max-width:760px){.auro-poster-grid{gap:12px}.auro-menu-pair{gap:12px}.auro-poster-grid figcaption{font-size:10px}}

/* Auro: compact identity studies and original menu mockups. */
.auro-composite.system-board>img.brand-logo{left:8%;top:16%;width:45%!important;mix-blend-mode:multiply}.case-page.auro-page>.extracted-image:first-child .portfolio-image>img{object-fit:cover}.auro-menu-pair .portfolio-image{aspect-ratio:4/5}.auro-menu-pair .portfolio-image>img{width:100%;height:100%;object-fit:contain}.auro-menu-pair{align-items:start}
@media(max-width:760px){.case-page.auro-page>.extracted-image:first-child .portfolio-image{background:#EDE0D9}.case-page.auro-page>.extracted-image:first-child .portfolio-image>img{object-fit:contain}}

/* Art-directed Auro framing: preserve page artwork, crop empty mockup margins. */
.auro-page .auro-menu-pair{display:grid;grid-template-columns:minmax(0,1fr);gap:40px}
.auro-page .auro-menu-pair .portfolio-image{aspect-ratio:auto}
.auro-page .auro-menu-pair .portfolio-image>img{height:auto;object-fit:contain}
.auro-page .auro-book-first{aspect-ratio:4/3}
.auro-page .auro-book-first>img{height:100%;object-fit:cover;transform:scale(1.2);transform-origin:50% 58%}
.auro-page .auro-book-colours{aspect-ratio:4/3}
.auro-page .auro-book-colours>img{height:100%;object-fit:cover;transform:scale(1.16);transform-origin:57% 64%}
.case-page.auro-page>.extracted-image:first-child .auro-kv-collage{display:flex;align-items:center;background:#EDE0D9}
.auro-kv-stage{position:relative;width:100%;aspect-ratio:1672/941}
.auro-kv-stage>img:first-child{display:block;width:100%;height:100%;object-fit:contain}
.auro-kv-stage>img.auro-kv-logo{position:absolute;left:5.5%;top:33%;width:32%;height:auto;mix-blend-mode:multiply}
.auro-book-first .pixel-layer,.auro-book-colours .pixel-layer{display:none!important}

/* Match each poster frame to its artwork; no letterbox or clipped lettering. */
.auro-page .auro-poster-grid .portfolio-image{display:block;background:transparent}
.auro-page .auro-poster-grid figure:nth-child(1) .portfolio-image{aspect-ratio:1080/1080}
.auro-page .auro-poster-grid figure:nth-child(2) .portfolio-image{aspect-ratio:1080/1080}
.auro-page .auro-poster-grid figure:nth-child(3) .portfolio-image{aspect-ratio:1080/1080}
.auro-page .auro-poster-grid figure:nth-child(4) .portfolio-image{aspect-ratio:1080/1349}
.auro-page .auro-poster-grid .portfolio-image>img{width:100%;height:100%;object-fit:cover;object-position:center}

.auro-video video{display:block;width:100%;height:auto;background:#1E1106}.auro-video figcaption{padding-top:12px;font-size:10px;line-height:1.4}

.auro-kv-stage>img.auro-kv-logo{left:4%;top:11%;width:25%;height:auto;mix-blend-mode:multiply;z-index:3}

.auro-page .auro-poster-grid figure:nth-child(n) .portfolio-image{aspect-ratio:1/1}
/* Foundr: actual slide-by-slide browsing, native touch scrolling and keyboard controls. */
.foundr-carousel{min-width:0;max-width:100%}.foundr-carousel h3{font-size:21px;font-weight:500;margin:0 0 18px}.foundr-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:thin;width:100%;border-radius:0}.foundr-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}.foundr-slide img{display:block;width:100%;height:auto}.foundr-carousel-controls{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.foundr-carousel-controls button{background:transparent;border:1px solid var(--ink);color:var(--ink);width:46px;height:40px;font:inherit;font-size:24px;cursor:pointer}.foundr-carousel-controls button:disabled{opacity:.3;cursor:default}.foundr-carousel-controls span{font-size:12px}.foundr-film>div{position:relative;aspect-ratio:16/9}.foundr-film iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.foundr-film figcaption{font-size:10px;padding-top:12px}
#index-list .index-images.index-slider{display:block;position:relative;width:100%;max-width:none} .index-slider-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}.index-slider-track::-webkit-scrollbar{display:none}#index-list .index-slider-track>figure{flex:0 0 100%;width:100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;margin:0}#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{height:clamp(320px,65vh,750px);aspect-ratio:auto;width:100%;display:flex;align-items:center;justify-content:center;background:transparent}#index-list .index-slider .portfolio-image>img{width:100%;height:100%;max-height:none;object-fit:contain}.index-slider-arrow{position:absolute;top:calc(clamp(320px,65vh,750px)/2);transform:translateY(-50%);z-index:4;border:0;border-radius:50%;background:#ffffffdf;color:#190615;width:34px;height:34px;padding:0;font:26px/30px Arial;cursor:pointer;box-shadow:0 1px 8px #19061512}.index-slider-arrow.previous{left:12px}.index-slider-arrow.next{right:12px}.index-slider-arrow:disabled{opacity:.25;cursor:default}@media(max-width:760px){#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{height:400px}.index-slider-arrow{top:200px;width:30px;height:30px}}

.ticker-track{animation-duration:90s}.logo-set img{object-fit:contain;flex-shrink:0}.ticker-heading p{font-weight:700}

/* Optical sizing across the complete client set, with room around each mark. */
.logo-set{gap:52px;padding-right:52px;min-height:64px}.logo-set img{width:var(--logo-width,85px);height:auto;max-height:64px;object-fit:contain;flex:none}.ticker-track{animation-duration:100s}
@media(max-width:760px){.logo-set{gap:34px;padding-right:34px;min-height:55px}.logo-set img{width:calc(var(--logo-width,85px)*.85);height:auto;max-height:55px}}

/* Slightly more space for case-study and strategy imagery. */
.logo-set img[alt="Google"]{filter:grayscale(1)}
@media(min-width:761px){.case-page .sticky-story-section{grid-template-columns:minmax(210px,.9fr) minmax(0,1.9fr)}}

/* Navigation must remain above project overlays, sliders and sticky filters. */
header{z-index:50}

/* Full résumé page: natural document flow without an embedded scrollbar. */
.cv-page-preview{width:100%;max-width:1100px;margin-inline:auto}.cv-page-preview a{display:block}.cv-page-preview img{display:block;width:100%;height:auto;max-width:none;transform:none;mix-blend-mode:normal}.profile-cv{scroll-margin-top:100px}

/* Header controls share the burgundy/blue hover treatment. */
header nav a,header .name,header .menu,header .capability-menu summary{border-radius:6px;padding:8px 10px}
header nav a:hover,header nav a:focus-visible,header .name:hover,header .name:focus-visible,header .menu:hover,header .menu:focus-visible,header .capability-menu summary:hover,header .capability-menu summary:focus-visible{background:#190615;color:#EEF4F9!important;opacity:1}
header .capability-menu summary:hover span{color:#EEF4F9!important}
/* Work images open in an accessible, project-scoped viewer. */
.portfolio-image[role="button"],.slot-art[role="button"]{cursor:zoom-in}
.portfolio-image[role="button"]:focus-visible,.slot-art[role="button"]:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
body.lightbox-open{overflow:hidden}
dialog.work-lightbox{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;border:0;padding:65px 75px 58px;background:#EEF4F9;color:#190615;overflow:hidden}
.work-lightbox::backdrop{background:#190615dc}
.work-lightbox .lightbox-stage{height:100%;width:100%;display:flex;align-items:center;justify-content:center;pointer-events:none}
.work-lightbox .lightbox-stage>.portfolio-image,.work-lightbox .lightbox-stage>.slot-art{width:100%;height:100%;min-height:0;aspect-ratio:auto;background:transparent;display:flex;align-items:center;justify-content:center}
.work-lightbox .lightbox-stage img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;transform:none}
.work-lightbox button{position:absolute;background:#190615;color:#EEF4F9!important;border:0;border-radius:6px;cursor:pointer;z-index:2}
.work-lightbox .lightbox-close{top:18px;right:24px;padding:10px 15px;font-size:14px}
.work-lightbox .lightbox-prev,.work-lightbox .lightbox-next{top:50%;transform:translateY(-50%);width:44px;height:52px;font-size:34px;line-height:1}
.work-lightbox .lightbox-prev{left:16px}.work-lightbox .lightbox-next{right:16px}.work-lightbox button:disabled{opacity:.25;cursor:default}
.work-lightbox .lightbox-caption{position:absolute;bottom:15px;left:70px;right:70px;text-align:center;font-size:12px;margin:0;line-height:1.4}
@media(max-width:760px){dialog.work-lightbox{padding:65px 42px 65px}.work-lightbox .lightbox-prev,.work-lightbox .lightbox-next{width:30px;height:44px}.work-lightbox .lightbox-prev{left:5px}.work-lightbox .lightbox-next{right:5px}.work-lightbox .lightbox-caption{left:30px;right:30px;font-size:10px}}

/* One portrait, on Profile; homepage awaits the next design direction. */
.home{grid-template-columns:1fr;min-height:65svh}.home>div{max-width:950px}
.profile-portrait{display:block;position:relative;align-self:start;width:100%;max-width:450px;justify-self:end;padding:0;border:0;background:transparent;cursor:pointer;aspect-ratio:883/960;isolation:isolate}
.profile-portrait-photo{display:block;width:100%;height:100%;overflow:hidden}
.profile-grid .profile-portrait img{display:block;width:100%;height:100%;max-height:none;max-width:none;object-fit:cover;transform:none;mix-blend-mode:normal}
.profile-credentials{position:absolute;inset:50% auto auto 50%;width:96%;aspect-ratio:1;border-radius:50%;background:#190615;color:#EEF4F9!important;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:22px;padding:30px;opacity:0;transform:translate(-50%,-46%) scale(.96);transition:opacity 220ms ease-out,transform 220ms ease-out;pointer-events:none}
.profile-credentials strong,.profile-credentials span{color:#EEF4F9!important}.profile-credentials strong{font-size:clamp(25px,3vw,43px);font-weight:700;line-height:1.05;letter-spacing:-.04em}.profile-credentials>span{font-size:clamp(14px,1.35vw,19px);font-weight:700;line-height:1.55}
.profile-portrait:hover .profile-credentials,.profile-portrait:focus-visible .profile-credentials,.profile-portrait[aria-expanded="true"] .profile-credentials{opacity:1;transform:translate(-50%,-50%) scale(1)}
/* Uniform Index frames align with category rules and retain the complete artwork. */
#index-list .index-feature,#index-list .index-images.index-slider{width:100%;max-width:none}
#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{width:100%;height:auto;aspect-ratio:3/2;overflow:hidden}
#index-list .index-slider .portfolio-image>img{display:block;width:100%;height:100%;max-height:none;object-fit:contain;object-position:50% 50%}
#index-list .index-slider-arrow{top:0;margin-top:calc(100% / 3);transform:translateY(-50%)}
@media(max-width:760px){.home{min-height:55svh}.profile-portrait{max-width:350px;margin-top:20px}.profile-credentials strong{font-size:32px}.profile-credentials>span{font-size:16px}.profile-credentials{gap:18px;padding:20px}#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{height:auto;aspect-ratio:3/2}#index-list .index-slider-arrow{top:0;margin-top:calc(100% / 3)}}
@media(prefers-reduced-motion:reduce){.profile-credentials{transition:none}.profile-portrait{transform:none!important}}

/* Individual credentials surround the photo instead of covering the face. */
.profile-grid{grid-template-columns:1.2fr 1fr;gap:10vw}
.profile-portrait{max-width:320px;margin:65px 45px 90px 30px;overflow:visible}
.profile-credentials-orbit{position:absolute;inset:0;pointer-events:none}
.credential-bubble{position:absolute;width:112px;aspect-ratio:1;border-radius:50%;background:#190615;color:#EEF4F9!important;display:flex;align-items:center;justify-content:center;text-align:center;font-size:15px;font-weight:700;line-height:1.15;padding:12px;opacity:0;transform:scale(.85);transition:opacity 200ms ease-out,transform 200ms ease-out}
.bubble-0{top:-58px;left:-60px;width:122px;font-size:20px}.bubble-1{top:-58px;right:-48px;width:114px;font-size:21px}.bubble-2{top:28%;left:-89px}.bubble-3{top:25%;right:-83px}.bubble-4{bottom:-32px;left:-78px}.bubble-5{bottom:-77px;left:calc(50% - 56px)}.bubble-6{bottom:-30px;right:-87px;font-size:13px}
.profile-portrait:hover .credential-bubble,.profile-portrait:focus-visible .credential-bubble,.profile-portrait[aria-expanded="true"] .credential-bubble{opacity:1;transform:scale(1)}
@media(max-width:1000px) and (min-width:761px){.profile-portrait{max-width:240px;margin-right:25px}.credential-bubble{width:92px;font-size:12px}.bubble-0,.bubble-1{width:100px;font-size:17px}.bubble-2{left:-68px}.bubble-3{right:-65px}.bubble-4{left:-60px}.bubble-6{right:-66px;font-size:10px}}
@media(max-width:760px){.profile-grid{grid-template-columns:1fr;gap:35px}.profile-portrait{width:calc(100% - 110px);max-width:280px;justify-self:center;margin:55px 55px 90px}.credential-bubble{width:88px;font-size:12px;padding:9px}.bubble-0{width:98px;font-size:17px;left:-40px;top:-48px}.bubble-1{width:94px;font-size:18px;right:-40px;top:-48px}.bubble-2{left:-55px}.bubble-3{right:-55px}.bubble-4{left:-45px;bottom:-30px}.bubble-5{left:calc(50% - 44px);bottom:-75px}.bubble-6{right:-48px;bottom:-30px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.credential-bubble{transition:none}}
/* Lab is an editorial horizontal shelf, sharing the site's typography and gutters. */
[data-page="lab"] .lab-banner{display:none}.lab-gallery-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:13px}.lab-gallery-controls button{background:transparent;border:1px solid var(--ink);border-radius:6px;padding:8px 14px;cursor:pointer;margin-left:8px}.lab-horizontal-gallery{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x proximity;overscroll-behavior-x:contain;padding:0 0 20px;scrollbar-width:thin}.lab-gallery-card{flex:0 0 min(65vw,720px);scroll-snap-align:start;position:relative;display:block}.lab-gallery-card>figure{margin:0}.lab-gallery-card .slot-art,.lab-gallery-card .portfolio-image{height:60svh;min-height:350px;aspect-ratio:auto;border-radius:8px;overflow:hidden}.lab-gallery-card figcaption{display:none}.lab-card-label{padding:18px 0}.lab-card-label small{font-size:12px}.lab-card-label h2{font-size:clamp(26px,3vw,42px);font-weight:500;letter-spacing:-.035em;margin:10px 0}.lab-gallery-card:hover h2{text-decoration:underline;text-underline-offset:6px}.lab-gallery-card:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.lab-detail-page>.lab-detail{margin-top:45px}.lab-detail .slot-art{min-height:400px}.lab-detail-page .lab-number,.lab-detail-page .lab-detail>h2{display:none}
[data-page="strategy"]{padding-top:25px!important}.heineken-cover{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#123c2d;color:white}.heineken-cover h2,.heineken-cover small{color:white!important}.heineken-cover h2{font-size:clamp(60px,10vw,140px);letter-spacing:-.05em;line-height:1;margin:0 0 25px}
@media(max-width:760px){.lab-horizontal-gallery{gap:16px}.lab-gallery-card{flex-basis:85vw}.lab-gallery-card .slot-art{height:55svh;min-height:300px}.lab-card-label h2{font-size:28px}}
[data-page="lab"] .painting-grid{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:20px;scrollbar-width:thin}[data-page="lab"] .painting-grid>article{flex:0 0 min(65vw,720px);scroll-snap-align:start}[data-page="lab"] .painting-grid .portfolio-image{height:55svh;aspect-ratio:auto}[data-page="lab"] .painting-grid .portfolio-image>img{height:100%;object-fit:contain}@media(max-width:760px){[data-page="lab"] .painting-grid>article{flex-basis:85vw}}
/* Vertical page scrolling drives each pinned horizontal Lab gallery. */
.lab-scroll-section{position:relative;min-height:0}.lab-scroll-pin{position:sticky;top:var(--index-filter-top,90px)}
.lab-scroll-pin .lab-horizontal-gallery,.lab-scroll-pin .painting-grid{overflow-x:hidden;scroll-snap-type:none}
.lab-scroll-pin .lab-gallery-card .slot-art,.lab-scroll-pin .lab-gallery-card .portfolio-image{height:clamp(230px,48svh,600px);min-height:0}
[data-page="lab"] .lab-scroll-pin .painting-grid .portfolio-image{height:clamp(230px,45svh,550px)}
@media(max-width:760px){.lab-scroll-pin .lab-gallery-card .slot-art,.lab-scroll-pin .lab-gallery-card .portfolio-image{height:42svh;min-height:0}}

/* Lab uses the same large, image-led hover presentation as Strategy. */
.lab-horizontal-gallery{gap:24px}
.lab-gallery-card{flex:0 0 100%;width:100%;min-width:0;overflow:hidden;border-radius:8px}
.lab-scroll-pin .lab-gallery-card .slot-art,.lab-scroll-pin .lab-gallery-card .portfolio-image{height:calc(100svh - var(--index-filter-top,90px) - 90px);min-height:400px;max-height:none;border-radius:8px}
.lab-card-label{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:clamp(25px,5vw,75px);background:linear-gradient(transparent 15%,#eef4f9ed 85%);opacity:0;transition:opacity 220ms ease-out;z-index:2}
.lab-card-label h2{font-size:clamp(34px,5vw,64px);line-height:1.05;max-width:850px;white-space:normal;margin:15px 0 0;text-decoration:none!important}.lab-card-label small{font-size:14px}
.lab-gallery-card:hover .lab-card-label,.lab-gallery-card:focus-visible .lab-card-label{opacity:1}
.lab-gallery-card .slot-art strong,.lab-gallery-card .slot-art .slot-label{opacity:.3}
@media(hover:none){.lab-card-label{opacity:1}}
@media(max-width:760px){.lab-gallery-card{flex-basis:100%}.lab-scroll-pin .lab-gallery-card .slot-art,.lab-scroll-pin .lab-gallery-card .portfolio-image{height:calc(100svh - var(--index-filter-top,70px) - 100px);min-height:350px}.lab-card-label{padding:25px}.lab-card-label h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){.lab-card-label{transition:none}}

/* Painting frames align edge-to-edge with the section divider. */
[data-page="lab"] .painting-grid>article{flex:0 0 100%;width:100%;min-width:0;position:relative;overflow:hidden;border-radius:8px}
[data-page="lab"] .lab-scroll-pin .painting-grid .portfolio-image{height:calc(100svh - var(--index-filter-top,90px) - 65px);min-height:400px;aspect-ratio:auto;width:100%;background:#E2EBF4}
[data-page="lab"] .painting-grid .portfolio-image>img{width:100%;height:100%;object-fit:cover}
[data-page="lab"] .painting-grid figcaption{display:none}
.painting-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:clamp(25px,5vw,75px);background:linear-gradient(transparent 15%,#eef4f9ed 85%);opacity:0;transition:opacity 220ms ease-out;pointer-events:none}
[data-page="lab"] .painting-grid .painting-overlay h3{font-size:clamp(34px,5vw,64px);line-height:1.05;margin:0 0 15px}[data-page="lab"] .painting-grid .painting-overlay p{font-size:15px;max-width:550px}
.painting-grid article:hover .painting-overlay,.painting-grid article:focus-within .painting-overlay{opacity:1}
@media(hover:none){.painting-overlay{opacity:1}}
@media(max-width:760px){[data-page="lab"] .painting-grid>article{flex-basis:100%}[data-page="lab"] .lab-scroll-pin .painting-grid .portfolio-image{height:calc(100svh - var(--index-filter-top,70px) - 65px);min-height:350px}.painting-overlay{padding:25px}}
@media(prefers-reduced-motion:reduce){.painting-overlay{transition:none}}

/* Paintings remain quiet: artwork and a small title only. */
[data-page="lab"] .painting-grid .painting-title{font-size:12px;font-weight:400;letter-spacing:0;line-height:1.4;margin:12px 0 0;padding:0;text-decoration:none}[data-page="lab"] .painting-grid>article{border-radius:0}.painting-grid .portfolio-image{border-radius:0}

/* Shared Strategy and Lab hover palette. */
[data-page="strategy"] .strategy-overlay,.lab-card-label{background:#190615;color:#EEF4F9!important}
[data-page="strategy"] .strategy-overlay *, .lab-card-label *{color:#EEF4F9!important;border-color:#EEF4F9!important}

/* Index category buttons match the header control shape and palette. */
#index-filters button{border-radius:6px;background:#fff;color:#190615!important;border:1px solid var(--line)}
#index-filters button.active,#index-filters button[aria-pressed="true"]{background:#190615;color:#EEF4F9!important;border-color:#190615}

/* Image remains visible above a burgundy fade behind the hover copy. */
[data-page="strategy"] .strategy-overlay,.lab-card-label{background:linear-gradient(transparent 10%,rgba(25,6,21,.93) 70%,#190615 100%)}
/* Project heading and gallery stay together while page scroll advances images. */
#index-list .index-feature{position:relative;padding:0;margin-bottom:70px;transform:none!important}
.index-project-pin{position:sticky;top:var(--index-project-top,140px);background:var(--paper)}
#index-list .index-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;align-items:start;max-width:none;width:100%;margin:0;padding:14px 0 18px;background:var(--paper)}
#index-list .index-copy h2{margin:0;font-size:clamp(24px,3vw,38px);line-height:1.08;letter-spacing:-.035em}
.index-project-meta{font-size:12px;line-height:1.45}.index-project-meta p{margin:0 0 7px!important;font-size:13px;line-height:1.45}.index-project-meta small{font-size:10px}.index-project-meta a{display:inline-block;margin-bottom:6px;font-size:11px}
#index-list .index-slider-track{overflow-x:hidden;scroll-snap-type:none}
#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{width:100%;height:clamp(220px,calc(100svh - var(--index-project-top,140px) - var(--index-copy-height,100px) - 45px),850px);aspect-ratio:auto}
#index-list .index-slider-arrow{top:calc(clamp(220px,calc(100svh - var(--index-project-top,140px) - var(--index-copy-height,100px) - 45px),850px)/2);margin-top:0}
#index-list .index-slider-track>figure{align-self:start}
@media(max-width:760px){#index-list .index-copy{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:15px;padding:12px 0 16px}#index-list .index-copy h2{font-size:23px}.index-project-meta p{font-size:11px;line-height:1.35}.index-project-meta small{font-size:9px}#index-list .index-feature{margin-bottom:45px}}
/* Selected work follows the introduction and client ticker on Home. */
.home-selected{min-height:0!important;padding-top:35px!important}.home-selected-heading{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:20px}.home-selected-heading .eyebrow{margin:0}.home-work-list{width:100%}.profile-contact{display:flex;flex-wrap:wrap;gap:20px 35px;margin-top:40px;font-size:16px}.profile-contact a{border-bottom:1px solid var(--ink);padding-bottom:6px}.profile-contact a:hover{opacity:.7}
/* Case Studies share Strategy's large cover and gradient treatment. */
[data-page="case-studies"]{padding-top:25px!important}.case-cover-grid{display:block}.case-cover{width:100vw;max-width:none;left:50%;margin-left:-50vw;height:100svh;aspect-ratio:auto;margin-bottom:0;overflow:hidden}.case-cover figure,.case-cover .portfolio-image,.case-cover .slot-art,.case-cover .case-cover-placeholder{width:100%;height:100%;margin:0;aspect-ratio:auto}.case-cover .portfolio-image>img{width:100%;height:100%;object-fit:cover}.case-cover .strategy-overlay{background:linear-gradient(transparent 10%,rgba(25,6,21,.93) 70%,#190615 100%);padding:clamp(25px,7vw,110px)}.case-cover .strategy-overlay *{color:#EEF4F9!important;border-color:#EEF4F9!important}.case-cover:hover{transform:none}.case-cover .slot-art{border-radius:0}.case-cover-filters{margin-top:0}.case-cover .artwork-stage{position:relative;width:100%;height:100%}.case-cover .artwork-stage>.base-artwork{display:block;width:100%;height:100%;object-fit:cover}.case-cover .artwork-stage>.brand-logo{position:absolute;left:4%;top:11%;width:25%;height:auto;object-fit:contain}
@media(max-width:760px){.home-selected-heading{align-items:center}.home-selected-heading .arrow-link{font-size:10px}.home-work-row.project-row h2{font-size:32px}.profile-contact{font-size:14px;gap:20px}.case-cover{height:85svh}#index-list .index-slider .portfolio-image>img{object-fit:contain}}

/* Index: optional galleries, normal page scrolling. */
#index-list .index-feature{height:auto!important;margin-bottom:75px;padding:0;transform:none!important}
#index-list .index-copy{position:sticky;top:var(--index-project-top,var(--index-filter-top,80px));z-index:6}
#index-list .index-slider-track{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
#index-list .index-slider-track>figure{scroll-snap-align:start;scroll-snap-stop:always}
#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{height:clamp(300px,60svh,720px);aspect-ratio:auto;padding:clamp(12px,1.5vw,24px)}
#index-list .index-slider-arrow{top:calc(clamp(300px,60svh,720px)/2);margin-top:0}
.index-gallery-controls{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-top:16px}.index-thumbnails{display:flex;gap:8px;overflow-x:auto;padding:3px;max-width:85%}.index-thumbnail{flex:0 0 58px;width:58px;height:42px;padding:0;border:1px solid var(--line);background:white;border-radius:4px;overflow:hidden;cursor:pointer}.index-thumbnail img{width:100%;height:100%;object-fit:contain;object-position:center}.index-thumbnail[aria-pressed="true"]{outline:2px solid #190615;outline-offset:1px}.index-image-count{font-size:12px;white-space:nowrap;padding-top:5px}
.profile-highlights{display:flex;flex-wrap:wrap;gap:15px 35px;margin-top:30px;font-size:15px;line-height:1.5}.profile-highlights strong{font-weight:600}
@media(max-width:760px){#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{height:clamp(240px,45svh,420px)}#index-list .index-slider .portfolio-image>img{object-fit:contain}#index-list .index-slider-arrow{top:calc(clamp(240px,45svh,420px)/2)}.index-thumbnail{flex-basis:46px;width:46px;height:34px}.index-gallery-controls{gap:12px}.index-copy{top:var(--index-project-top,var(--index-filter-top,80px))}}

/* Keep the project heading close to its artwork, including contained mobile images. */
#index-list .index-copy{padding-top:10px;padding-bottom:8px;min-height:0}
#index-list .index-slider .portfolio-image>img{object-position:center center}
/* Index artwork shares the placeholder frame, regardless of source proportions. */
#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{box-sizing:border-box;width:100%;height:clamp(300px,60svh,720px);aspect-ratio:auto;min-height:0;padding:clamp(12px,1.5vw,24px);display:flex;align-items:center;justify-content:center;overflow:hidden}
#index-list .index-slider .portfolio-image{background:var(--paper)}
#index-list .index-slider .portfolio-image>img{display:block;flex:0 1 auto;min-width:0;min-height:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center}
#index-list .index-slider-track{align-items:flex-start;overflow-y:hidden}
@media(max-width:760px){#index-list .index-copy{padding-top:8px;padding-bottom:8px}#index-list .index-slider .portfolio-image,#index-list .index-slider .slot-art{height:clamp(240px,45svh,420px)}}

/* Larger Profile portrait, with four separate credential circles around its edges. */
.profile-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:6vw}
.profile-portrait{width:calc(100% - 70px);max-width:440px;margin:65px 35px 75px;justify-self:center}
.profile-portrait .bubble-2{top:auto;bottom:-35px;left:-35px;font-size:19px}
.profile-portrait .bubble-3{top:auto;bottom:-35px;right:-35px;font-size:18px}
@media(min-width:761px) and (max-width:1000px){.profile-portrait{width:calc(100% - 40px);max-width:360px;margin-left:20px;margin-right:20px}.profile-portrait .bubble-0{left:-25px}.profile-portrait .bubble-1{right:-25px}.profile-portrait .bubble-2{left:-25px;font-size:16px}.profile-portrait .bubble-3{right:-25px;font-size:15px}}
@media(max-width:760px){.profile-grid{grid-template-columns:1fr;gap:30px}.profile-portrait{width:calc(100% - 56px);max-width:390px;margin:55px 28px 55px}.profile-portrait .bubble-0{left:-22px}.profile-portrait .bubble-1{right:-22px}.profile-portrait .bubble-2{left:-22px;bottom:-30px;font-size:15px}.profile-portrait .bubble-3{right:-22px;bottom:-30px;font-size:14px}}

/* Profile contact pills. */
.profile-contact{gap:12px;margin-top:32px}
.profile-contact a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 23px;border:1px solid #190615;border-radius:999px;background:#190615;color:#EEF4F9!important;font-size:14px;line-height:1.2}
.profile-contact a:hover,.profile-contact a:focus-visible{background:#fff;color:#190615!important;opacity:1}
.profile-grid .profile-personal{font-size:15px}

.l77-hero .portfolio-image{width:100%;background:transparent}.l77-hero img{display:block;width:100%;height:auto;object-fit:contain}.l77-results,.l77-press{min-height:0!important;padding:45px 0!important;border-top:1px solid var(--line)}.l77-results h2,.l77-press h2{font-size:clamp(30px,4vw,48px);font-weight:500;margin:0 0 28px}.launch-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.launch-metrics dt{font-size:13px;margin-bottom:12px}.launch-metrics dd{margin:0;font-size:clamp(28px,4vw,54px);letter-spacing:-.04em}.l77-results p{font-size:12px;max-width:700px;line-height:1.5}.l77-results p a{text-decoration:underline}.l77-press>a{display:block;border-top:1px solid var(--line);padding:22px 0}.l77-press>a span{display:block;font-size:12px;margin-bottom:10px}.l77-press>a strong{font-size:clamp(20px,2.6vw,32px);font-weight:500}@media(max-width:760px){.launch-metrics{grid-template-columns:1fr;gap:24px}}

.l77-contribution{min-height:0!important;padding:35px 0!important;max-width:780px}.l77-contribution h2{font-size:30px;font-weight:500;margin:0 0 15px}.l77-contribution p{font-size:17px;line-height:1.6}

.l77-video-hero{position:relative;width:100vw;left:50%;margin-left:-50vw;background:#190615}.l77-video-hero video{display:block;width:100%;height:min(82svh,860px);object-fit:contain;background:#190615}.l77-event-image .portfolio-image{height:auto!important;aspect-ratio:auto!important;background:transparent}.l77-event-image .portfolio-image img{display:block;width:100%;height:auto!important;object-fit:contain!important}.l77-event-image figcaption{font-size:12px;line-height:1.4}@media(max-width:760px){.l77-video-hero video{height:auto;aspect-ratio:16/9}}

/* L77 results and press: compact cards, without repeated rules. */
.l77-results,.l77-press{border:0;padding:35px 0!important}
.launch-metrics{margin:0;gap:16px}
.launch-metrics>div{display:flex;flex-direction:column;justify-content:center;gap:14px;background:#fff;border-radius:12px;padding:30px 26px;min-height:170px}
.launch-metrics dt{order:2;margin:0;font-size:13px;line-height:1.4}
.launch-metrics dd{order:1;font-size:clamp(30px,3.7vw,54px);line-height:1.1}
.l77-press{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.l77-press h2{grid-column:1/-1;margin-bottom:8px}
.l77-press>a{border:0;padding:24px 26px;border-radius:12px;background:#fff;display:block}
.l77-press>a span{font-size:12px;margin-bottom:12px}
.l77-press>a strong{font-size:clamp(21px,2.2vw,30px);line-height:1.2}
.l77-press>a:hover,.l77-press>a:focus-visible{background:#190615;color:#EEF4F9!important}
.l77-press>a:hover *,.l77-press>a:focus-visible *{color:#EEF4F9!important}
@media(max-width:760px){.launch-metrics{grid-template-columns:1fr}.launch-metrics>div{min-height:130px;padding:24px}.l77-press{grid-template-columns:1fr}.l77-press>a{padding:24px}}

.l77-video-hero iframe{display:block;width:100%;aspect-ratio:16/9;max-height:85svh;border:0;background:#190615}
/* Case Studies filters use the same rounded white and selected burgundy pills as Index. */
#case-filters button{border-radius:6px;background:#fff;color:#190615!important;border:1px solid var(--line);padding:8px 12px;transition:background-color 160ms ease-out,color 160ms ease-out,border-color 160ms ease-out}
#case-filters button:hover{background:#190615;color:#EEF4F9!important;border-color:#190615}
#case-filters button.active,#case-filters button[aria-pressed="true"]{background:#190615;color:#EEF4F9!important;border-color:#190615}
#case-filters button.active:hover,#case-filters button[aria-pressed="true"]:hover{background:#fff;color:#190615!important;border-color:#190615}



/* Home: compact image-led gateway to the four areas of work. */
.home-selected{padding-top:34px!important;padding-bottom:32px!important}.home-selected-heading{margin-bottom:18px}.home-selected-note{font-size:12px;letter-spacing:.02em;color:#190615!important}.home-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.home-feature-card{min-width:0;background:rgba(255,255,255,.54);border:1px solid #c8d3df;border-radius:10px;overflow:hidden;display:flex;flex-direction:column}.home-feature-link{display:block;min-width:0}.home-feature-media{position:relative;overflow:hidden;aspect-ratio:1.72;background:#E2EBF4}.home-feature-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(25,6,21,0) 38%,rgba(25,6,21,.77) 100%);opacity:0;transition:opacity .24s ease}.home-feature-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.home-feature-category,.home-feature-open{position:absolute;z-index:1;color:#eef4f9!important;background:#190615;padding:8px 12px;border-radius:7px;font-size:10px;line-height:1.1;letter-spacing:.015em}.home-feature-category{left:13px;top:13px}.home-feature-open{right:13px;bottom:13px;background:transparent;opacity:0;transform:translateY(4px);transition:opacity .2s ease,transform .2s ease}.home-feature-card:hover .home-feature-media:after,.home-feature-card:focus-within .home-feature-media:after{opacity:1}.home-feature-card:hover .home-feature-media img,.home-feature-card:focus-within .home-feature-media img{transform:scale(1.025)}.home-feature-card:hover .home-feature-open,.home-feature-card:focus-within .home-feature-open{opacity:1;transform:translateY(0)}.home-feature-copy{padding:12px 15px 10px}.home-feature-copy h2{font-size:clamp(18px,2vw,25px);line-height:1.1;letter-spacing:-.035em;font-weight:500;margin:0 0 5px;color:#190615!important}.home-feature-copy p{margin:0;color:#190615!important;font-size:12px;line-height:1.4}.home-feature-more{display:flex;justify-content:space-between;align-items:center;margin:auto 15px 13px;padding-top:10px;border-top:1px solid #c8d3df;color:#190615!important;font-size:10px;line-height:1.2}.home-feature-more:hover{color:#190615!important;text-decoration:underline;text-underline-offset:3px}.home-feature-link:focus-visible,.home-feature-more:focus-visible{outline:2px solid #190615;outline-offset:-3px;border-radius:6px}@media(max-width:760px){.home-selected{padding-top:28px!important}.home-selected-heading{margin-bottom:14px}.home-feature-grid{grid-template-columns:1fr;gap:14px}.home-feature-media{aspect-ratio:1.55}.home-feature-copy{padding:11px 13px 8px}.home-feature-more{margin:0 13px 12px}.home-feature-open{opacity:1;transform:none;background:#190615}.home-feature-media:after{display:none}}@media(prefers-reduced-motion:reduce){.home-feature-media img,.home-feature-media:after,.home-feature-open{transition:none}}

/* Case studies: compact reading columns and more room for the artwork. */
.case-page .case-title>p{max-width:560px}
.case-page .story-block p{max-width:52ch}
.case-page .l77-contribution{max-width:600px}
@media(min-width:761px){
  .case-page{padding-inline:2vw}
  .case-page .sticky-story-section{grid-template-columns:minmax(200px,260px) minmax(0,1fr);gap:clamp(28px,4vw,64px)}
  .case-page .sticky-story-copy{max-width:260px;min-width:0}
  .case-page .scroll-story-images{min-width:0}
}

/* Refined proportions for the compact copy and wider case-study imagery. */
.case-page .sticky-story-copy h2{font-size:30px;line-height:1.12;letter-spacing:-.03em;margin-bottom:20px}
.case-page .sticky-story-copy>.hand{font-size:24px;margin-bottom:16px}
.case-page .sticky-story-copy p{font-size:15px;line-height:1.6}
.case-page .story-block h2{font-size:30px;line-height:1.12}
@media(min-width:761px){
  body:has(>.case-page){width:94%;max-width:1800px}
  .case-page{padding-inline:0}
  .case-page .sticky-story-section{grid-template-columns:minmax(200px,260px) minmax(0,1fr);gap:clamp(28px,4vw,64px)}
}
[data-page="index"] .index-intro{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:30px}
[data-page="index"] .index-intro .page-heading{margin:0;max-width:none}
[data-page="index"] .index-intro h1{font-size:clamp(44px,5vw,72px);line-height:1.05;letter-spacing:-.045em}
[data-page="index"] .index-intro .search{width:320px;max-width:100%;flex-shrink:0;font-size:12px}
[data-page="index"] .index-intro .search input{font-size:14px;padding:12px 0 8px}
@media(max-width:760px){
  .case-page .sticky-story-copy h2,.case-page .story-block h2{font-size:27px}
  [data-page="index"] .index-intro{display:block;margin-bottom:24px}
  [data-page="index"] .index-intro .page-heading{margin-bottom:28px}
  [data-page="index"] .index-intro .search{width:100%}
}

/* Homepage curation: clear artwork, quiet links and a six-project Index ticker. */
.home-selected .home-feature-media:after{display:none}
.home-selected .home-feature-open,.home-selected .home-feature-more{display:none}
.home-feature-card:hover .home-feature-media img,.home-feature-card:focus-within .home-feature-media img{transform:none}
.home-playbook-covers{display:flex;align-items:center;justify-content:center;gap:5%;height:100%;padding:6% 8%;background:#ddd7ef}
.home-playbook-covers img{width:25%;height:100%;object-fit:contain;box-shadow:0 8px 14px #19061518}
.home-feature-card:last-child .home-feature-media{background:#000}
.home-feature-card:last-child .home-feature-media>img{object-fit:contain}
.home-feature-copy{padding:16px 18px 18px}
.home-feature-link:hover h2{text-decoration:underline;text-underline-offset:4px}
.home-index-strip{margin-top:30px;min-width:0}
.home-index-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.home-index-heading>a{font-size:25px;letter-spacing:-.035em}
.home-index-heading>a:hover{text-decoration:underline;text-underline-offset:4px}
.home-index-pause{background:none;border:1px solid var(--line);border-radius:6px;padding:7px 12px;color:var(--ink);font-size:11px;cursor:pointer}
.home-index-window{overflow:hidden}
.home-index-track{display:flex;width:max-content;animation:home-index-travel 60s linear infinite}
.home-index-set{display:flex;gap:18px;padding-right:18px}
.home-index-project{width:240px;display:block;flex:none}
.home-index-project img{display:block;width:100%;height:165px;object-fit:cover;border-radius:7px;background:#e2ebf4}
.home-index-project span{display:block;margin-top:10px;font-size:12px}
.home-index-project:hover span{text-decoration:underline;text-underline-offset:3px}
.home-index-strip:hover .home-index-track,.home-index-strip:focus-within .home-index-track,.home-index-strip.is-paused .home-index-track{animation-play-state:paused}
@keyframes home-index-travel{to{transform:translateX(-50%)}}
@media(max-width:760px){.home-index-project{width:200px}.home-index-project img{height:140px}.home-index-set{gap:14px;padding-right:14px}.home-feature-copy{padding:14px}.home-index-heading>a{font-size:23px}}
@media(prefers-reduced-motion:reduce){.home-index-track{animation:none;width:100%}.home-index-set{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;padding:0}.home-index-project{width:auto;min-width:0}.home-index-set[aria-hidden]{display:none}.home-index-pause{display:none}}
@media(prefers-reduced-motion:reduce) and (max-width:760px){.home-index-set{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Homepage opening: an interactive introduction with a fine paper grain. */
body:has(.interactive-home:not([hidden])){isolation:isolate}
body:has(.interactive-home:not([hidden]))::before{content:"";position:fixed;inset:-12%;z-index:-1;pointer-events:none;background:url('/assets/home-selected/paper-grain.png') repeat;opacity:.22;animation:paper-grain-drift 1.5s steps(6) infinite}
@keyframes paper-grain-drift{0%,100%{transform:translate(0,0)}20%{transform:translate(-2%,1%)}40%{transform:translate(1%,-2%)}60%{transform:translate(-1%,-1%)}80%{transform:translate(2%,2%)}}
.home.interactive-home{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(35px,5vw,80px);padding:60px 4vw 45px;min-height:min(780px,calc(100svh - 100px));align-items:center}
.interactive-home>div{max-width:none;min-width:0}
.interactive-home .hello{font-size:30px;margin:0 0 26px;transform:rotate(-3deg)}
.home .hero-statement{font-size:clamp(56px,6.4vw,96px);line-height:1.02;letter-spacing:-.055em;font-weight:500;margin:0}
.hero-prefix{display:block;font-size:23px;letter-spacing:-.02em;line-height:1.3;margin-bottom:12px}
.hero-word-row{display:block;white-space:nowrap}
.hero-word{position:relative;font:inherit;letter-spacing:inherit;color:var(--ink);background:none;border:0;padding:0;margin:0;cursor:pointer;line-height:inherit;text-align:left;transition:none}
.hero-word::after{content:"";position:absolute;left:0;right:0;bottom:0;border-bottom:2px solid var(--ink);transform:scaleX(0);transform-origin:left;transition:transform 180ms cubic-bezier(.23,1,.32,1)}
.hero-word.is-active::after{transform:scaleX(1)}
.hero-word:active{transform:none}.hero-word:focus-visible{outline-offset:6px;border-radius:3px}
.hero-amp{font-family:Caveat,cursive;font-weight:500;font-size:.75em;letter-spacing:-.02em}
.hero-description{max-width:360px;font-size:15px;line-height:1.6;margin:28px 0 20px}
.hero-work-link{display:inline-block;font-size:13px;border-bottom:1px solid var(--ink);padding-bottom:5px}
.hero-work-preview{position:relative;transform:rotate(2deg);padding-top:20px}
.hero-preview-link{display:block}
.hero-preview-art{position:relative;aspect-ratio:1/1.08;overflow:hidden;background:#eadfd9;border-radius:3px}
.hero-preview-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 220ms ease-out;pointer-events:none}
.hero-preview-image.is-active{opacity:1}
.hero-system-art{display:flex;align-items:center;justify-content:center;gap:5%;padding:10% 8%;background:#ddd7ef}
.hero-system-art img{width:25%;height:auto;box-shadow:0 8px 22px #19061522}
.hero-preview-caption{display:flex;justify-content:space-between;align-items:baseline;gap:15px;padding:14px 0;font-size:12px}
.hero-preview-name{font-size:17px;font-weight:500;letter-spacing:-.025em}
.hero-preview-type{text-align:right;color:var(--muted);font-size:10px}
.hero-hint{font-size:25px;margin:14px 0 0;text-align:center;transform:rotate(-4deg)}
#selected-work{scroll-margin-top:90px}
@media(min-width:761px) and (max-width:1050px){.home.interactive-home{padding-inline:0;gap:30px}.home .hero-statement{font-size:7vw}.hero-preview-caption{display:block}.hero-preview-type{display:block;text-align:left;margin-top:5px}}
@media(max-width:760px){.home.interactive-home{grid-template-columns:1fr;gap:30px;padding:40px 7px 35px;min-height:0}.home .hero-statement{font-size:clamp(55px,14vw,78px)}.interactive-home .hello{font-size:29px;margin-bottom:22px}.hero-prefix{font-size:21px;margin-bottom:10px}.hero-description{max-width:340px;font-size:14px;margin-top:24px}.hero-work-preview{transform:rotate(1deg);padding-top:0}.hero-preview-art{aspect-ratio:1.3}.hero-hint{font-size:23px;margin-top:6px}}
@media(prefers-reduced-motion:reduce){body:has(.interactive-home:not([hidden]))::before{animation:none}.hero-preview-image,.hero-word::after{transition:none}}

/* Selected projects: wide image-led rows, with concise context and a project fact. */
section.home-stories{display:grid;grid-template-columns:minmax(110px,.4fr) minmax(0,2.6fr);gap:25px;min-height:0;padding:65px 0 80px}
.home-stories-label{align-self:start;position:sticky;top:105px}
.home-stories-label h2{font-size:19px;letter-spacing:-.035em;font-weight:500;margin:0}
.home-stories-label h2::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ink);margin-right:9px;vertical-align:middle}
.home-stories-list{min-width:0}
.home-story-image{display:block;position:relative;aspect-ratio:1.3;overflow:hidden;background:#dcd8d1;border-radius:2px;min-width:0}
.home-story-image>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 250ms cubic-bezier(.23,1,.32,1)}
.home-story-image.story-image-3{background:#000}.home-story-image.story-image-3>img{object-fit:contain}
.story-playbook-art{height:100%;display:flex;justify-content:center;align-items:center;gap:5%;padding:9%;background:#ddd7ef;transition:transform 250ms cubic-bezier(.23,1,.32,1)}
.story-playbook-art img{width:26%;height:auto;box-shadow:0 8px 20px #19061524}
.story-view-cursor{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.3;width:86px;height:86px;border-radius:50%;background:#190615;color:#eef4f9;font-size:12px;opacity:0;pointer-events:none;transform:translate(-100%,-100%);transition:opacity 150ms ease-out}
@media(hover:hover){.home-story-image:hover>img,.home-story-image:hover .story-playbook-art{transform:scale(1.035)}.home-story-image:hover .story-view-cursor{opacity:1}.home-story-copy h3 a:hover{text-decoration:underline;text-underline-offset:5px}}
/* Capabilities follow the selected projects in a contrasting, textured band. */
section.home-capabilities{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2.1fr) minmax(0,.85fr);gap:30px;align-items:start;width:100vw;margin-left:calc((100% - 100vw)/2);padding:85px max(4vw,calc((100vw - 1600px)/2));min-height:0;background:#190615;color:#eef4f9}
.home-capabilities::before{content:"";position:absolute;inset:0;pointer-events:none;background:url('/assets/home-selected/paper-grain.png');opacity:.18;z-index:-1}
.capability-context{padding-top:5px}.capability-context>.hand{font-size:24px}.capability-context-title{font-size:15px;margin:35px 0 15px}
.capability-description{font-size:14px;line-height:1.6;max-width:230px;min-height:150px;margin:0}
.capability-context>a{font-size:12px;display:inline-block;margin-top:25px;padding-bottom:5px;border-bottom:1px solid #eef4f96b}
.capability-main h2{font-size:15px;font-weight:400;margin:4px 0 30px;color:#EEF4F9}
.capability-list{display:grid;gap:13px}
.capability-item{font-size:clamp(28px,3.8vw,60px);font-weight:500;letter-spacing:-.045em;line-height:1.1;text-align:left;border:0;padding:0;background:none;color:#a28a9b;cursor:pointer;transition:color 180ms ease-out}
.capability-item.is-active,.capability-item:hover,.capability-item:focus-visible{color:#eef4f9}
.capability-item:active{transform:none}.capability-item:focus-visible{outline-color:#eef4f9;outline-offset:5px}
.capability-preview{padding-top:55px;min-width:0}.capability-preview>a{display:block;position:relative;aspect-ratio:.8;background:#311e2b;overflow:hidden;border-radius:2px}
.capability-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 220ms ease-out,transform 220ms cubic-bezier(.23,1,.32,1);transform:translateY(8px) scale(.98)}
.capability-image.is-active{opacity:1;transform:none}.capability-image-3{object-fit:contain;padding:12px}.capability-image-4{object-fit:contain;background:#000}
.capability-preview-caption{font-size:10px;line-height:1.4;color:#EEF4F9;margin:12px 0 0}
section.home-index-section{min-height:0;padding:35px 0 65px}
@media(max-width:1100px){section.home-stories{grid-template-columns:1fr}.home-stories-label{position:static;margin-bottom:10px}section.home-capabilities{grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:25px}.capability-preview{grid-column:2;padding-top:0;max-width:260px}.capability-preview>a{aspect-ratio:1.3}.capability-context{grid-row:1/3}.capability-item{font-size:clamp(28px,4.4vw,50px)}}
@media(max-width:760px){section.home-stories{padding:40px 7px 45px;gap:18px}.story-view-cursor{display:none}section.home-capabilities{grid-template-columns:1fr;padding:45px 27px;gap:30px}.capability-main{grid-row:1}.capability-context{grid-row:3}.capability-context-title{margin:18px 0 10px}.capability-description{min-height:0;max-width:340px}.capability-preview{grid-column:1;grid-row:2;width:100%;max-width:none;padding:0}.capability-preview>a{aspect-ratio:1.4}.capability-list{gap:14px}.capability-item{font-size:clamp(28px,8vw,43px)}section.home-index-section{padding:25px 7px 45px}}
@media(prefers-reduced-motion:reduce){.home-story-image>img,.story-playbook-art,.capability-image,.capability-item{transition:none!important}.home-story-image:hover>img,.home-story-image:hover .story-playbook-art{transform:none}.story-view-cursor{display:none}}
/* Keep the dark capabilities band independent of the site's global text palette. */
.home-capabilities :is(h2,p,a,button){color:#eef4f9!important}
.home-capabilities .capability-item{color:#a28a9b!important}
.home-capabilities .capability-item.is-active,.home-capabilities .capability-item:hover,.home-capabilities .capability-item:focus-visible{color:#eef4f9!important}
.home-capabilities .capability-main h2,.home-capabilities .capability-preview-caption{color:#EEF4F9!important}

/* Full-screen opening: oversized type with a gentle, local liquid distortion. */
.home.type-home{--hero-burgundy:#48152d;--hero-cream:#EEF4F9;position:relative;isolation:isolate;width:100vw;margin-left:calc((100% - 100vw)/2);margin-top:-60px;min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;gap:35px;background:var(--hero-burgundy);color:var(--hero-cream);padding:clamp(115px,15svh,165px) max(5vw,calc((100vw - 1680px)/2)) 40px;overflow:hidden}
.type-home::before{content:"";position:absolute;inset:0;background:url('/assets/home-selected/paper-grain.png');opacity:.2;pointer-events:none;z-index:-1}
.home.type-home>div{max-width:none}
.type-home :is(h1,p,a,span){color:var(--hero-cream)!important}
.flow-filter-defs{position:absolute;overflow:hidden;pointer-events:none}
.type-hero-top{display:flex;justify-content:space-between;align-items:baseline;gap:25px}
.type-hero-top .hand{font-size:29px;margin:0;transform:rotate(-3deg)}
.type-hero-top>span{font-size:12px;line-height:1.5}
.home .flow-headline{font-size:clamp(70px,11.5vw,190px);line-height:.98;letter-spacing:-.06em;font-weight:600;margin:15px 0 30px;align-self:stretch;overflow:visible}
.flow-line{display:block;white-space:nowrap}
.flow-phrase{display:inline;white-space:pre}
.flow-char{display:inline-block;white-space:pre;transform-origin:50% 65%}
.type-hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
.type-hero-bottom>p{font-size:15px;line-height:1.6;max-width:420px;margin:0}
.type-hero-links{display:flex;flex-direction:column;align-items:flex-end;gap:20px}
.type-hero-hint{font-size:10px;opacity:.65}
.type-hero-links>a{display:inline-block;font-size:13px;border-bottom:1px solid #EEF4F980;padding-bottom:7px}
.type-home a:focus-visible{outline-color:#EEF4F9}
body:has(.type-home:not([hidden])) .brand-ticker{padding-top:25px}
@media(max-width:1050px) and (min-width:761px){.home .flow-headline{font-size:11.6vw}.home.type-home{padding-inline:5vw}.type-hero-bottom>p{max-width:360px}}
@media(max-width:760px){.home.type-home{margin-top:-58px;min-height:100svh;padding:110px 27px 30px;gap:30px}.type-hero-top{align-items:flex-start;flex-direction:column;gap:13px}.type-hero-top .hand{font-size:28px}.type-hero-top>span{font-size:10px}.home .flow-headline{font-size:clamp(46px,13.8vw,80px);line-height:1.03;letter-spacing:-.055em;margin:25px 0}.mobile-flow-line{display:block}.type-hero-bottom{flex-direction:column;align-items:flex-start;gap:25px}.type-hero-bottom>p{font-size:14px;max-width:340px}.type-hero-links{align-items:flex-start;gap:14px}.type-hero-hint{display:none}}
@media(prefers-reduced-motion:reduce){.flow-headline{filter:none!important}.flow-char{transform:none!important}.type-hero-hint{display:none}}

.home.type-home{align-items:stretch}.type-hero-top,.type-hero-bottom{width:100%}

/* Sampled from Mallika's supplied burgundy swatch. Typography stays still. */
.home.type-home{--hero-burgundy:#190615;background:#190615}
.type-home::before{opacity:.10}
.hero-halftone{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:-1;pointer-events:none}
.home .flow-headline{filter:none!important}
@media(max-width:760px){.home .flow-headline{font-size:clamp(37px,10.4vw,76px);line-height:1.08;white-space:nowrap}}

@media(max-width:760px){.home .flow-headline{font-size:clamp(46px,13.8vw,80px);line-height:1.03;white-space:normal}}

/* Monolog-inspired moving film grain, combined with a fluid typographic canvas. */
.home.type-home{background:#190615}
.type-home::before{inset:-20%;background-image:url('/assets/home-selected/film-static.png');background-size:240px 240px;mix-blend-mode:soft-light;opacity:.42;animation:hero-film-static .55s steps(1) infinite}
@keyframes hero-film-static{0%,100%{transform:translate(0,0)}16%{transform:translate(-37px,21px)}33%{transform:translate(19px,-43px)}50%{transform:translate(-51px,-12px)}66%{transform:translate(43px,32px)}83%{transform:translate(-13px,57px)}}
.hero-fluid-type{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0}
.type-hero-top,.type-hero-bottom{position:relative;z-index:2}
.home.type-home.fluid-type-ready .flow-headline,.home.type-home.fluid-type-ready .flow-headline *{color:transparent!important}
.fluid-type-ready .hero-fluid-type{opacity:1}
@media(prefers-reduced-motion:reduce){.type-home::before{animation:none}.hero-fluid-type{display:none}.home.type-home.fluid-type-ready .flow-headline,.home.type-home.fluid-type-ready .flow-headline *{color:#EEF4F9!important}}

/* Carry the hero's animated film grain into the burgundy practice section. */
section.home-capabilities{overflow:hidden}
.home-capabilities::before{inset:-20%;background-image:url('/assets/home-selected/film-static.png');background-size:240px 240px;mix-blend-mode:soft-light;opacity:.42;animation:hero-film-static .55s steps(1) infinite}
@media(prefers-reduced-motion:reduce){.home-capabilities::before{animation:none}}
/* An intentionally typographic placeholder until Oppo's project details arrive. */
.oppo-cover{width:100%;height:100%;min-height:380px;background:#e7eee6;color:#175a41;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:34px;box-sizing:border-box}.oppo-cover strong{font-size:clamp(70px,8vw,150px);font-weight:500;letter-spacing:-.07em;line-height:1}.oppo-cover>span{font-size:12px;letter-spacing:.08em}.oppo-detail{min-height:450px;justify-content:center;margin-bottom:70px}
/* Leegality cover: gradient loop with film grain */
.case-cover .portfolio-image>.cover-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#08023D}
.case-cover .cover-grain{position:absolute;inset:-60%;background:url(/assets/leegality-case/grain.png) 0 0/128px 128px;opacity:.3;mix-blend-mode:overlay;pointer-events:none;z-index:1;animation:coverGrain .5s steps(4) infinite}
@keyframes coverGrain{0%{transform:translate(0,0)}25%{transform:translate(-7%,4%)}50%{transform:translate(5%,-6%)}75%{transform:translate(-3%,-9%)}100%{transform:translate(8%,3%)}}
@media(prefers-reduced-motion:reduce){.case-cover .cover-grain{animation:none}}
/* homepage Leegality card: gradient loop with grain */
.home-story-image>.story-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#08023D;transition:transform 250ms cubic-bezier(.23,1,.32,1)}
.home-story-image>.cover-grain{position:absolute;inset:-60%;background:url(/assets/leegality-case/grain.png) 0 0/128px 128px;opacity:.3;mix-blend-mode:overlay;pointer-events:none;z-index:1;animation:coverGrain .5s steps(4) infinite}
.home-story-image .story-view-cursor{z-index:3}
@media(hover:hover){.home-story-image:hover>.story-video{transform:scale(1.035)}}
@media(prefers-reduced-motion:reduce){.home-story-image>.cover-grain{animation:none}.home-story-image:hover>.story-video{transform:none}}
/* homepage previews: consistent rounded rectangles */
.home-story-image{border-radius:16px!important;isolation:isolate}
.capability-preview,.capability-preview>a{border-radius:16px;overflow:hidden;isolation:isolate}
.home-index-project img{border-radius:12px}
/* L77 hero: launch film fills the frame, credit underneath */
.l77-video-hero video{width:100%;height:auto;aspect-ratio:16/9;max-height:88svh;object-fit:cover}
.l77-video-hero .film-credit{position:absolute;right:clamp(16px,3vw,40px);bottom:14px;margin:0;font-size:10px;color:#EEF4F9cc;letter-spacing:.02em}
.l77-video-hero .film-credit a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.l77-video-hero video{aspect-ratio:1920/896}
/* L77 concept-to-build clips */
.l77-sketch .portfolio-image{border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#fff}
.l77-sketch video{display:block;width:100%;height:100%;object-fit:cover}
/* L77 product pair */
.l77-pair-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
.l77-pair-grid img{width:100%;height:100%;aspect-ratio:1;object-fit:cover;border-radius:16px;display:block}
@media(max-width:760px){.l77-pair-grid{grid-template-columns:1fr}}
.l77-pair-grid img{aspect-ratio:4/3}
.case-page.bruma-page>.extracted-image:first-child .portfolio-image>img{object-fit:cover}
.bruma-pair{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:start}
.bruma-social-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bruma-social-grid .portfolio-image{aspect-ratio:4/5;background:#E9E3E0}
.bruma-social-grid .portfolio-image>img{width:100%;height:100%;object-fit:cover}
.bruma-social-grid figcaption{display:none}
@media(max-width:760px){.bruma-pair{gap:12px}.bruma-social-grid{grid-template-columns:1fr 1fr;gap:10px}.case-page.bruma-page>.extracted-image:first-child .portfolio-image{height:auto;aspect-ratio:1/1}}
.bruma-page .sticky-story-copy p+p{margin-top:1em}
.bruma-reels{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bruma-reel video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;background:#3F3A38}
.bruma-reel figcaption{padding-top:12px;font-size:10px;line-height:1.4}
@media(max-width:760px){.bruma-reels{gap:8px}.bruma-reel figcaption{display:none}}
/* Capability menu items are plain text, not links */
.capability-panel span{display:block;font-family:var(--font);font-size:16px;font-weight:400;line-height:1.3;padding:2px 0;letter-spacing:-.02em;cursor:default}
/* Case studies as a list: name left, category right, cover appears centred on hover */
#case-filters{display:none}
.case-cover-grid{display:block;border-top:1px solid #19061533;margin-top:clamp(20px,4vw,48px)}
.case-cover-grid .case-cover{position:relative;display:flex;align-items:baseline;justify-content:space-between;gap:24px;width:auto;left:auto;margin:0;height:auto;overflow:visible;padding:clamp(10px,1.4vw,18px) 0;border-bottom:1px solid #19061533;background:none;color:#190615;text-decoration:none}
.case-cover-grid .case-cover .strategy-overlay{position:static;display:contents;opacity:1;background:none;padding:0}
.case-cover-grid .case-cover .strategy-overlay *{color:inherit!important}
.case-cover-grid .case-cover .strategy-overlay h2{order:1;margin:0;font-size:clamp(34px,5.6vw,86px);font-weight:700;letter-spacing:-.045em;line-height:1;transition:opacity .2s ease}
.case-cover-grid .case-cover .strategy-overlay small{order:2;font-size:clamp(18px,2.6vw,40px);font-weight:400;letter-spacing:-.03em;line-height:1;color:#6A5866!important;text-align:right}
.case-cover-grid .case-cover figure{position:fixed;left:50%;top:50%;width:min(52vw,880px);height:auto!important;aspect-ratio:16/9!important;transform:translate(-50%,-50%) scale(.96);opacity:0;pointer-events:none;z-index:30;border-radius:14px;overflow:hidden;transition:opacity .25s ease,transform .35s cubic-bezier(.2,.7,.2,1);box-shadow:0 30px 80px rgba(25,6,21,.35)}
.case-cover-grid .case-cover figure .portfolio-image,.case-cover-grid .case-cover figure .slot-art{width:100%;height:100%;aspect-ratio:auto}
.case-cover-grid .case-cover:hover figure,.case-cover-grid .case-cover:focus-visible figure{opacity:1;transform:translate(-50%,-50%) scale(1)}
.case-cover-grid:hover .case-cover h2{opacity:.35}
.case-cover-grid .case-cover:hover h2{opacity:1}
@media(hover:none),(max-width:760px){
 .case-cover-grid .case-cover{flex-wrap:wrap}
 .case-cover-grid .case-cover figure{position:relative;left:auto;top:auto;order:0;width:100%;transform:none;opacity:1;box-shadow:none;margin-bottom:8px}
 .case-cover-grid:hover .case-cover h2{opacity:1}
}
/* List v2: smaller type, three columns, a small preview in the empty middle column */
.case-cover-grid .case-cover{display:grid;grid-template-columns:minmax(0,40%) 1fr minmax(0,26%);align-items:baseline;gap:0 24px;padding:clamp(9px,1vw,14px) 0}
.case-cover-grid .case-cover .strategy-overlay h2{grid-column:1;font-size:clamp(22px,2.6vw,40px);letter-spacing:-.035em;line-height:1.05}
.case-cover-grid .case-cover .strategy-overlay small{grid-column:3;font-size:clamp(13px,1.25vw,18px);letter-spacing:-.01em;line-height:1.3}
.case-cover-grid .case-cover figure{left:calc(50% + 2vw);width:min(24vw,360px);border-radius:10px;box-shadow:0 18px 40px rgba(25,6,21,.28)}
@media(hover:none),(max-width:760px){.case-cover-grid .case-cover{grid-template-columns:1fr auto}.case-cover-grid .case-cover figure{grid-column:1/-1;left:auto;width:100%}.case-cover-grid .case-cover .strategy-overlay small{grid-column:2}}
.case-cover-grid .case-cover figure{left:calc(50% + 5vw);width:min(20.5vw,300px)}
/* No pixel reveal animation inside the hover list */
.case-cover-grid canvas,.case-cover-grid .pixel-reveal{display:none!important}
/* Preview sits inside the hovered row (middle column, level with the row) instead of the centre of the screen */
.case-cover-grid .case-cover figure{position:absolute;top:50%;left:calc(40% + 24px + (34% - 48px - min(20.5vw,300px))/2);transform:translateY(-50%)!important;width:min(20.5vw,300px)}
.case-cover-grid .case-cover:hover{z-index:5}
.case-cover-grid .case-cover figure{transition:opacity .2s ease}
/* Case studies intro, then the work */
[data-page="case-studies"] .case-intro,[data-page="lab"] .case-intro{margin-bottom:clamp(28px,4vw,56px)}
[data-page="case-studies"] .case-intro h1,[data-page="lab"] .case-intro h1{font-size:clamp(40px,5vw,72px);line-height:1.02;letter-spacing:-.045em}
/* Names a touch bigger in the list */
.case-cover-grid .case-cover .strategy-overlay h2{font-size:clamp(24px,2.9vw,46px)}

/* Version B (?layout=bands): seven full-width rows, each filled with its cover */
.case-cover-grid.bands{border-top:0;margin-top:0;width:100vw;position:relative;left:50%;margin-left:-50vw}
.case-cover-grid.bands:hover .case-cover h2{opacity:1}
.case-cover-grid.bands .case-cover{display:flex;align-items:center;justify-content:space-between;gap:24px;height:clamp(120px,19vh,200px);padding:0 clamp(20px,5vw,80px);border:0;overflow:hidden;color:#EEF4F9;isolation:isolate}
.case-cover-grid.bands .case-cover figure{position:absolute!important;inset:0;left:0!important;top:0!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;transform:none!important;opacity:1;border-radius:0;box-shadow:none;z-index:-2;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.case-cover-grid.bands .case-cover figure .portfolio-image,.case-cover-grid.bands .case-cover figure .slot-art{clip-path:none;height:100%}
.case-cover-grid.bands .case-cover figure img,.case-cover-grid.bands .case-cover figure video{width:100%;height:100%;object-fit:cover}
.case-cover-grid.bands .case-cover::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(25,6,21,.62),rgba(25,6,21,.18) 55%,rgba(25,6,21,.5));transition:background .3s ease}
.case-cover-grid.bands .case-cover:hover::after{background:linear-gradient(90deg,rgba(25,6,21,.42),rgba(25,6,21,.05) 55%,rgba(25,6,21,.32))}
.case-cover-grid.bands .case-cover .strategy-overlay h2{color:#EEF4F9!important;opacity:1}
.case-cover-grid.bands .case-cover .strategy-overlay small{color:#EEF4F9!important;opacity:.8}
.case-cover-grid.bands .case-cover+.case-cover{border-top:1px solid rgba(238,244,249,.25)}
@media(hover:none),(max-width:760px){.case-cover-grid.bands .case-cover{flex-wrap:nowrap}.case-cover-grid.bands .case-cover figure{margin:0}}
.case-cover-grid.bands .case-cover .slot-art>*{display:none}
/* Wider name column so the longest name stays on one line */
.case-cover-grid:not(.bands) .case-cover{grid-template-columns:minmax(0,49%) 1fr minmax(0,24%)}
.case-cover-grid:not(.bands) .case-cover figure{width:min(18.5vw,265px);left:calc(49% + 24px + (27% - 48px - min(18.5vw,265px))/2)}
/* Case studies headline bigger and bolder, in the spirit of gorantrickovski.design */
[data-page="case-studies"] .case-intro,[data-page="lab"] .case-intro{max-width:none}
[data-page="case-studies"] .case-intro h1,[data-page="lab"] .case-intro h1{font-size:clamp(48px,7.4vw,116px);font-weight:700;line-height:.98;letter-spacing:-.05em}
[data-page="case-studies"] .case-intro p,[data-page="lab"] .case-intro p{font-size:15px;max-width:520px;margin-top:26px}
/* Case studies intro, closer to the reference: Inter, very large, tight, three lines; larger regular subheader */
[data-page="case-studies"] .case-intro h1,[data-page="lab"] .case-intro h1{font-family:Inter,system-ui,-apple-system,sans-serif;font-weight:700;font-size:clamp(52px,8.5vw,150px);line-height:.98;letter-spacing:-.055em;color:#000;margin:clamp(20px,4vw,60px) 0 0}
[data-page="case-studies"] .case-intro p,[data-page="lab"] .case-intro p{font-family:Inter,system-ui,-apple-system,sans-serif;font-weight:400;font-size:clamp(16px,1.45vw,22px);line-height:1.32;letter-spacing:-.01em;color:#000;max-width:min(640px,48vw);margin-top:clamp(28px,4.5vw,72px)}
[data-page="case-studies"] .case-intro,[data-page="lab"] .case-intro{margin-bottom:clamp(40px,6vw,96px)}
/* Case studies: the intro fills the first screen; the list starts after you scroll */
[data-page="case-studies"] .case-intro,[data-page="lab"] .case-intro{min-height:calc(100svh - 110px);margin-bottom:0;display:flex;flex-direction:column;justify-content:center;padding-bottom:6vh;box-sizing:border-box}
[data-page="case-studies"] .case-intro h1,[data-page="lab"] .case-intro h1{margin-top:0}

/* Fixed Index frame height; maximize the complete object group, not the empty source canvas. */
#index-list .index-slider .portfolio-image.index-fitted-art{padding:0;position:relative;background:var(--paper)}
#index-list .index-fitted-art::before,#index-list .index-fitted-art::after{content:"";position:absolute;top:0;bottom:0;width:50.1%;z-index:0;pointer-events:none;background-repeat:no-repeat;background-size:100% 100%}
#index-list .index-fitted-art::before{left:0;background-image:var(--extended-left)}
#index-list .index-fitted-art::after{right:0;background-image:var(--extended-right)}
#index-list .index-slider .index-fitted-art[data-framing="ready"]>img{position:absolute;z-index:1;left:var(--art-left);top:var(--art-top);width:var(--art-width);height:var(--art-height);max-width:none;max-height:none;object-fit:fill;flex:none}

/* Consistent 1920 x 1080 proportions across every Index listing. */
#index-list .index-feature .index-slider .portfolio-image,
#index-list .index-feature .index-slider .slot-art{box-sizing:border-box;width:100%;height:auto;aspect-ratio:16/9;min-height:0;padding:0;display:flex;align-items:center;justify-content:center;overflow:hidden;}
#index-list .index-feature .index-slider .portfolio-image>img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;}

/* Maximize complete Serendipity artwork inside the shared 16:9 frame. */
#index-list .index-feature .index-slider .portfolio-image.index-fitted-art[data-framing="ready"]>img{position:absolute;left:var(--art-left);top:var(--art-top);width:var(--art-width);height:var(--art-height);max-width:none;max-height:none;object-fit:fill;flex:none;}

/* Capulus Beans: fill every Index slide with a closer, proportional crop. */
#index-list .index-feature[data-search="capulus beans branding"] .index-slider .portfolio-image>img{object-fit:cover;object-position:center;}
#index-list .index-feature[data-search="capulus beans branding"] .index-slider .portfolio-image>img[src$="/01-logo.webp"]{transform:scale(1.06);}

/* Project details: light horizontal rules, without a surrounding card. */
.case-page .credentials{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;padding:18px 0}
.case-page .credentials dt{margin-bottom:8px}
@media(max-width:760px){.case-page .credentials{padding:16px 0;gap:20px 16px}}

/* homepage selected work: list that opens one project at a time as you scroll */
.home-stories-list{min-width:0}
.home-story{display:flex;flex-direction:column;border-top:1px solid var(--line);margin:0;min-height:0}
.home-story:last-child{border-bottom:1px solid var(--line)}
.home-story-head{margin:0;font:inherit}
.home-story-head button{all:unset;box-sizing:border-box;width:100%;display:grid;grid-template-columns:clamp(48px,4.4vw,70px) minmax(0,1fr) auto;align-items:baseline;gap:16px;padding:18px 0;cursor:pointer}
.home-story-head button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.home-story-index,.home-story-title{font-size:clamp(26px,2.6vw,38px);line-height:1.05;letter-spacing:-.035em;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}
.home-story-stat{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right}
.home-story.is-active .home-story-index,.home-story.is-active .home-story-title{color:var(--ink)}

@media(hover:hover){.home-story-head button:hover .home-story-title,.home-story-head button:hover .home-story-index{color:var(--ink)}}
.home-story-inner{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:28px;padding:0 0 24px;color:inherit;text-decoration:none;cursor:pointer}
.home-story-image{display:block;position:relative;overflow:hidden;background:#dcd8d1;min-width:0;aspect-ratio:1.5}
.home-story-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.home-story-category{font-size:12px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.home-story-description{font-size:16px;line-height:1.5;margin:0;color:var(--muted);max-width:40ch}
.home-story-fact{margin-top:auto;padding-top:0}
.home-story-fact>strong{display:block;font-size:clamp(34px,3.4vw,52px);font-weight:500;letter-spacing:-.045em;line-height:1}
.home-story-fact>strong>span{display:block}
.home-story-fact>strong:has(.fact-arrow){display:inline-flex;flex-direction:column;align-items:center}.home-story-fact>strong>.fact-arrow{font-size:.6em;line-height:1.2;margin:4px 0}
.home-story-fact.is-quote>strong{font-size:clamp(26px,2.4vw,36px);letter-spacing:-.035em;line-height:1.05}
.home-story-fact>p{font-size:16px;line-height:1.4;margin:12px 0 0;max-width:34ch}
@media(hover:hover){.home-story-inner:hover .home-story-image>img,.home-story-inner:hover .home-story-image>.story-video{transform:scale(1.03)}}
.home-story-inner:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
/* short screens: tap a title to open it */
.home-stories.is-accordion .home-story:not(.is-active) .home-story-body{display:none}
/* tall screens: the list stays pinned and scroll drives --open (0 to 1) on each project */
.home-stories.is-scroll .home-stories-list{height:calc(100svh - 110px + 3 * 60svh)}
.home-stories.is-scroll .home-stories-track{position:sticky;top:96px;height:calc(100svh - 116px);display:flex;flex-direction:column}
.home-stories.is-scroll .home-story{--open:0;flex:var(--open) 1 auto}
.home-stories.is-scroll .home-story-body{flex:1 1 0;min-height:0;overflow:hidden}
.home-stories.is-scroll .home-story-inner{height:var(--story-full,60vh);opacity:clamp(0,calc((var(--open) - .1) * 1.6),1)}
.home-stories.is-scroll .home-story-image{aspect-ratio:auto;height:100%}
.home-stories.is-scroll .home-story{will-change:flex-grow}
@media(max-width:1100px){.home-story-head button{grid-template-columns:clamp(44px,5vw,60px) minmax(0,1fr) auto}}
@media(max-width:760px){.home-story-head button{grid-template-columns:40px minmax(0,1fr);gap:4px 10px;padding:14px 0}.home-story-index,.home-story-title{font-size:26px}.home-story-stat{grid-column:2;font-size:12px;text-align:left}
.home-story-inner{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:14px}
.home-stories.is-scroll .home-story-description,.home-stories.is-scroll .home-story-category{display:none}
.home-stories.is-scroll .home-story-fact{padding-top:0}.home-story-fact>strong{font-size:32px}.home-story-fact.is-quote>strong{font-size:24px}.home-story-fact>p{font-size:15px;margin-top:8px}
.home-stories.is-scroll .home-stories-track{top:76px;height:calc(100svh - 92px)}
.home-stories:not(.is-scroll) .home-story-image{aspect-ratio:1.2}}
/* homepage: no text smaller than 12px */
.ticker-heading,.ticker-heading p,.ticker-heading button,.home-index-pause,.home-note,.capability-preview-caption{font-size:13px}
.ticker-heading p,.capability-preview-caption{text-transform:uppercase;letter-spacing:.08em}
.capability-preview{overflow:visible}
.capability-image-3{object-fit:contain!important;background:transparent!important}
.capability-preview>a:has(.capability-image-3.is-active){background:transparent}
.capability-context>a{font-size:16px;margin-top:32px;padding:12px 20px;border:1px solid #eef4f96b;border-radius:999px;transition:background 200ms ease,color 200ms ease}
@media(hover:hover){.capability-context>a:hover{background:#eef4f9;color:#190615}}
.home-story-inner,.home-story-inner:hover,.home-story-fact>strong{text-decoration:none}
.capability-image{transition:opacity 500ms cubic-bezier(.4,0,.2,1),transform 600ms cubic-bezier(.22,1,.36,1)}
.capability-item{transition:color 400ms ease}
/* Sip Society: day slides into night as you scroll */
.story-image-sip{--night:0}
.story-image-sip>.story-night{clip-path:inset(0 0 0 calc((1 - var(--night)) * 100%))}
.home-stories.is-accordion .story-image-sip>.story-night{clip-path:none;animation:dayNight 8s ease-in-out infinite alternate}
@keyframes dayNight{0%,35%{opacity:0}65%,100%{opacity:1}}
/* practice: no repeated title; About sits under the list */
.capability-context-title{display:none}
.capability-description{margin-top:35px}
.home-capabilities .capability-about{display:inline-block;margin-top:40px;font-size:16px;padding:12px 22px;border:1px solid #eef4f96b;border-radius:999px;color:#eef4f9!important;text-decoration:none;transition:background 250ms ease,color 250ms ease,border-color 250ms ease}
@media(hover:hover){.home-capabilities .capability-about:hover{background:#eef4f9;border-color:#eef4f9;color:#190615!important}}
.home-capabilities .capability-about:focus-visible{outline:2px solid #eef4f9;outline-offset:3px}