:root{--charcoal:#101312;--electric:#254cfa;--paper:#f4f2e9}body.studio-home{background:var(--charcoal)}.scroll-progress{position:fixed;left:0;top:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;background:#7893ff;z-index:100;pointer-events:none}.studio-home header{position:absolute;top:0;left:0;right:0;height:110px;background:transparent;z-index:10;color:white;padding:0 4%}.studio-home header .brand{color:white}.studio-home header .brand>span{color:white}.studio-home header .brand img{filter:brightness(0) invert(1);width:76px;height:84px}.studio-home nav{font-size:12px;gap:27px}.studio-home .hero{margin:0;height:100svh;min-height:700px}.hero video{object-position:center}.hero-shade{background:linear-gradient(90deg,#08110f70,transparent 80%),linear-gradient(0deg,#101312bd,transparent 70%)}.hero-top{top:145px;left:4%;right:4%;font-size:9px}.hero-copy{left:6%;right:6%;bottom:110px}.hero-kicker{font-size:10px;letter-spacing:2px;margin-bottom:25px}.studio-home .hero-copy h1{font-size:clamp(46px,5.2vw,80px);line-height:1;letter-spacing:-3px;font-weight:500;max-width:1100px}.hero-copy h1 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-5px}.hero-bottom{margin-top:38px}.hero-bottom p{font-size:14px}.hero-actions .pill{border-radius:50px;padding:16px 25px}.hero-stamp{position:absolute;top:24%;right:6%;width:110px;opacity:.9}.hero-stamp img{width:100%}.film-corner{position:absolute;width:30px;height:30px;opacity:.6}.top-left{left:24px;top:125px;border-left:1px solid white;border-top:1px solid white}.bottom-right{right:24px;bottom:60px;border-right:1px solid white;border-bottom:1px solid white}.hero-index{left:6%;bottom:35px;font-size:8px}#video-toggle{bottom:25px;right:6%}.logo-scene{position:relative;isolation:isolate;color:var(--paper);min-height:145vh;background:#101312;overflow:clip}.studio-light{position:absolute;inset:0;background:radial-gradient(ellipse at var(--light-x,30%) 48%,#4057a43d 0%,#1c253325 30%,transparent 65%);pointer-events:none}.scene-number{position:absolute;top:65px;left:6%;font-size:10px;letter-spacing:2px;color:#9ba8cb}.studio-home .intro{position:sticky;top:0;min-height:100svh;align-items:center;grid-template-columns:1fr 1.25fr;gap:9%;padding:130px 7%}.intro-brand{align-items:center;position:relative}.intro-brand .eyebrow{align-self:start;color:#b9c8ff}.studio-home .signature-art{width:min(100%,470px);filter:drop-shadow(0 0 45px #2c59fd25);transform:translateY(var(--art-y,20px)) rotate(var(--art-turn,-3deg));transition:filter .4s;will-change:transform}.intro-brand:before{content:'';position:absolute;inset:10% -10%;border:1px solid #8393c425;border-radius:50%;transform:rotate(-25deg);pointer-events:none}.intro-brand:after{content:'BLUEBLOTS / THE ART OF COMMUNICATION';position:absolute;bottom:20%;left:-25px;writing-mode:vertical-rl;font-size:7px;letter-spacing:2px;color:#9cace3}.art-caption{color:#8da3ff;font-size:8px}.intro h2{font-size:clamp(38px,4vw,65px);line-height:1.12}.intro .muted{color:#9babd0}.intro-bottom{display:block;margin-top:30px}.intro-bottom p{font-size:15px;line-height:1.95;color:#c0c5c0;max-width:530px}.intro-bottom .text-link{display:inline-block;margin-top:26px;color:white}.scene-bottom{position:absolute;bottom:35px;left:6%;right:6%;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.8px;color:#a2aecb}.service-overview{background:var(--paper);margin:0;padding:45px 6%;border:0;color:var(--ink)}.studio-home .work{background:var(--paper);padding-top:100px;padding-bottom:120px}.work h2{font-size:clamp(45px,5.5vw,85px)}h2 em{font-family:Georgia,serif;font-weight:400}.filters{position:relative;z-index:6;background:var(--paper)}.studio-home .projects{display:flex;flex-direction:column;gap:32px;isolation:isolate}.featured-note{margin:0 0 8px}.studio-home .projects .project,.studio-home .projects .project:first-of-type{display:block;position:sticky;top:30px;min-height:75svh;height:75svh;overflow:hidden;background:#17251e;isolation:isolate;color:white;border-radius:3px;box-shadow:0 -12px 40px #10131218;transform-origin:center top}.studio-home .projects .project .project-image{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}.studio-home .projects .project .project-image:after{background:linear-gradient(0deg,#07100ee8,transparent 75%)}.studio-home .projects .project .project-info{position:absolute;bottom:45px;left:45px;right:80px;padding:0;z-index:2}.studio-home .projects .project h3,.studio-home .projects .project:first-of-type h3{font-family:Manrope,sans-serif;font-size:clamp(30px,4vw,62px);font-weight:500;line-height:1.13;max-width:800px;letter-spacing:-2px}.project-count{display:block!important;font-size:9px!important;letter-spacing:2px;color:#d0d8e5!important;margin-bottom:22px}.studio-home .project-info>span:last-child{color:#ddd;font-size:12px;margin-top:22px}.studio-home .image-label{top:30px;bottom:auto;left:35px}.project-open{width:55px;height:55px;top:25px;right:25px;font-size:30px}.project img{filter:saturate(.88)}.studio-home .clients{background:var(--paper);padding-bottom:100px}.studio-home .approach{background:#e6e7df}.studio-home .approach-image{transform:rotate(-2deg);box-shadow:12px 15px 0 #17369315}.studio-home .services{background:#1839c5;padding-top:110px;padding-bottom:110px}.services h2{font-size:clamp(48px,6vw,90px)}.studio-home .services-brand-art{opacity:.13;width:650px;right:-100px;top:-100px}.service-grid h3{font-size:28px}.service-grid article{position:relative;padding-bottom:25px}.services .service-grid article:after{content:'↗';display:block;margin-top:28px;font-size:32px;color:#aebeff}.studio-home .collective{background:var(--paper)}.collective h2{font-size:clamp(43px,5vw,75px)}.team-person:hover{border-top-color:#173693}.studio-home .contact{background:#101312;color:var(--paper);padding-top:130px}.contact-art{position:absolute;width:650px;right:-170px;top:50px;opacity:.06;pointer-events:none}.contact>*:not(.contact-art):not(.art-divider){position:relative;z-index:1}.contact-title{font-size:clamp(70px,10vw,160px)}.contact-title span{color:#8299ff}.contact .art-divider{filter:brightness(0) invert(1);opacity:.2}.contact .form-fields input,.contact .form-fields textarea{background:#ffffff06;border-color:#ffffff35;color:white}.contact .form-fields input::placeholder,.contact .form-fields textarea::placeholder{color:#8c948c}.contact .pill.primary{background:#3456eb}.contact .contact-bottom,.contact .enquiry-form{border-color:#ffffff28}.studio-home footer{background:#101312;color:#a9b2a9;border-top:1px solid #ffffff20}.studio-home footer .footer-brand{color:white}.studio-home footer img{filter:brightness(0) invert(1)}.reveal{transition:opacity .8s,transform .8s}.js-motion .reveal:not(.in-view){opacity:.25;transform:translateY(24px)}
@media(max-width:900px){.studio-home nav{gap:16px}.studio-home header .brand-sub{display:none}.studio-home .intro{gap:6%;padding:120px 6%}.hero-stamp{width:80px;top:25%}.studio-home .hero-copy h1{font-size:clamp(48px,7vw,68px);letter-spacing:-3px}.intro-bottom p{font-size:13px}.hero-bottom{flex-direction:row;align-items:end}.hero-actions{max-width:200px}.studio-home .projects .project,.studio-home .projects .project:first-of-type{height:65svh;min-height:500px}}
@media(max-width:600px){.studio-home header{height:90px}.studio-home header .brand img{width:53px;height:63px}.studio-home .menu{color:white}nav.open{background:#101312;color:white;top:90px}.studio-home .hero{height:100svh;min-height:650px}.hero-top{top:118px;font-size:7px}.hero-copy{bottom:100px}.hero-stamp{top:24%;right:8%;width:75px}.studio-home .hero-copy h1{font-size:48px;letter-spacing:-2.5px}.hero-copy h1 em{letter-spacing:-2.5px}.hero-kicker{font-size:8px;letter-spacing:1.2px;max-width:220px}.hero-bottom{flex-direction:column;align-items:start;gap:25px}.hero-actions{max-width:none}.hero-top span:first-child{max-width:230px}.hero-index{font-size:6px}.logo-scene{min-height:auto}.studio-home .intro{position:relative;display:flex;flex-direction:column;gap:40px;padding:120px 7% 100px;min-height:auto}.intro-brand{display:flex;width:100%}.studio-home .signature-art{width:260px;grid-column:auto;grid-row:auto}.intro-brand .eyebrow{align-self:center}.intro-brand:before{inset:15% 0}.intro-brand:after{left:8px;bottom:25%}.intro h2{font-size:39px}.intro-bottom p{font-size:14px}.scene-number{top:35px;font-size:8px}.scene-bottom{font-size:6px;line-height:1.8}.scene-bottom span{max-width:45%}.art-caption{font-size:7px}.service-overview{padding:35px 7%}.studio-home .work{padding:70px 5%}.work h2{font-size:45px}.studio-home .projects{gap:25px}.studio-home .projects .project,.studio-home .projects .project:first-of-type{position:relative;top:auto;height:540px;min-height:0}.studio-home .projects .project .project-info{left:24px;right:24px;bottom:30px}.studio-home .projects .project h3,.studio-home .projects .project:first-of-type h3{font-size:33px;letter-spacing:-1px}.studio-home .image-label{left:24px;top:25px;font-size:8px;max-width:220px}.project-open{width:38px;height:38px;right:17px;top:17px;font-size:23px}.studio-home .services{padding:75px 6%}.services h2{font-size:50px}.service-grid h3{font-size:22px}.studio-home .services-brand-art{width:420px;right:-170px;top:0}.studio-home .contact{padding-top:100px}.contact-title{font-size:64px}.contact-art{width:450px;right:-190px}.studio-home .approach-image{transform:none}.collective h2{font-size:43px}}
@media(prefers-reduced-motion:reduce){.logo-scene{min-height:auto}.studio-home .intro{position:relative}.studio-home .signature-art{transform:none}.studio-home .projects .project,.studio-home .projects .project:first-of-type{position:relative;top:auto}.js-motion .reveal:not(.in-view){opacity:1;transform:none}.scroll-progress{display:none}}
.studio-light{z-index:-1}.studio-home .intro{z-index:1}.scene-number,.scene-bottom{z-index:2}.logo-scene{overflow:visible}.studio-home .intro-brand,.studio-home .intro>div{visibility:visible;opacity:1}
.logo-scene{min-height:100svh}.studio-home .intro{position:relative;top:auto}.studio-home .projects .project{z-index:calc(2 + var(--project-index))}

/* A graphic shelf of the studio's four crafts. */
.studio-home .services{background:#1536b8}.services .section-heading{align-items:end;margin-bottom:60px}.services .services-brand-art{opacity:.045}.craft-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.craft-card{display:flex;flex-direction:column;position:relative;min-height:590px;padding:24px;background:#f1efdf;color:#17261f;overflow:hidden;transition:transform .35s,box-shadow .35s}.craft-card:nth-child(2){background:#d9e3f0;margin-top:35px;margin-bottom:-35px}.craft-card:nth-child(3){background:#dce5bd}.craft-card:nth-child(4){background:#222b5e;color:#f7f3e6;margin-top:35px;margin-bottom:-35px}.craft-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:8px;letter-spacing:1.3px;font-weight:600}.craft-arrow{font-size:23px;font-weight:400}.craft-art{height:210px;position:relative;display:grid;place-items:center;margin:20px -5px 25px}.craft-card h3{font-size:clamp(23px,2.1vw,34px);line-height:1.1;letter-spacing:-1.1px;font-weight:500;margin:0 0 20px}.craft-card>p{font-size:12px;line-height:1.85;opacity:.8;margin-bottom:28px}.craft-bottom{display:flex;justify-content:space-between;align-items:center;font-size:11px;padding:17px 0;border-top:1px solid #17261f40;margin-top:auto}.craft-design .craft-bottom{border-color:#ffffff40}.craft-meta{font-size:6px;letter-spacing:1.2px;opacity:.65;padding-top:12px}.craft-card:hover,.craft-card:focus-visible{transform:translateY(-12px);box-shadow:0 25px 45px #080e2738}.reel-circle{width:165px;height:165px;border:1px solid #17369350;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 7px,#1736931c 8px 9px);position:absolute}.reel-circle:after{content:'';position:absolute;inset:25px;border:1px dashed #17369370;border-radius:50%}.play-triangle{width:0;height:0;border-top:23px solid transparent;border-bottom:23px solid transparent;border-left:35px solid #173693;position:relative;margin-left:10px;transition:transform .4s}.frame-tick{position:absolute;left:4px;top:22px;border-left:1px solid #173693;border-top:1px solid #173693;padding:8px;font-size:8px;letter-spacing:1px;color:#173693}.craft-film:hover .reel-circle{transform:rotate(35deg);transition:transform 1s}.craft-film:hover .play-triangle{transform:scale(1.15)}.photo-print{width:165px;height:185px;background:#fff9e9;padding:9px 9px 28px;transform:rotate(-9deg);box-shadow:0 8px 20px #17261f25;transition:transform .4s}.photo-print img{width:100%;height:100%;object-fit:cover}.photo-cross{position:absolute;bottom:3px;right:4px;font-size:37px;color:#173693;font-weight:400}.craft-photo:hover .photo-print{transform:rotate(2deg) scale(1.04)}.speech{position:absolute;background:#173693;color:#f1efdf;font-size:30px;letter-spacing:-1px;font-weight:700;padding:10px 20px;transform:rotate(-8deg);box-shadow:4px 5px 0 #17369325;transition:transform .4s}.speech:after{content:'';position:absolute;bottom:-10px;left:15px;border-top:12px solid #173693;border-right:15px solid transparent}.speech.one{top:10px;left:6px}.speech.two{top:70px;right:0;transform:rotate(6deg);background:#f1efdf;color:#173693}.speech.two:after{border-top-color:#f1efdf}.speech.three{bottom:0;left:24px;transform:rotate(-3deg)}.craft-campaign:hover .speech.one{transform:rotate(2deg) translateX(8px)}.craft-campaign:hover .speech.two{transform:rotate(-3deg) translateX(-8px)}.craft-logo{height:205px;width:205px;object-fit:contain;transform:rotate(6deg);opacity:.9;transition:transform .5s}.design-star{position:absolute;font-size:65px;right:-3px;bottom:-8px;color:#dce5bd;transition:transform .7s}.craft-design:hover .craft-logo{transform:rotate(-3deg)}.craft-design:hover .design-star{transform:rotate(90deg)}
@media(min-width:1400px){.craft-card{padding:28px;min-height:620px}.craft-art{height:230px}.craft-top{font-size:9px}.craft-card>p{font-size:13px}.craft-meta{font-size:7px}}@media(max-width:1050px){.craft-grid{grid-template-columns:1fr 1fr;gap:24px}.craft-card{min-height:570px}.craft-card:nth-child(2),.craft-card:nth-child(4){margin:25px 0 -25px}.craft-card h3{font-size:32px}.craft-art{height:220px}}@media(max-width:600px){.services .section-heading{margin-bottom:35px}.craft-grid{grid-template-columns:1fr;gap:20px}.craft-card,.craft-card:nth-child(2),.craft-card:nth-child(4){margin:0;min-height:0;padding:26px}.craft-art{height:190px;margin-top:15px;margin-bottom:20px}.craft-card h3{font-size:35px}.craft-card>p{font-size:14px;max-width:350px}.craft-top{font-size:9px}.craft-bottom{font-size:12px}.craft-meta{font-size:7px}.craft-logo{height:190px}.speech.one{left:15%}.speech.two{right:12%}.speech.three{left:25%}.frame-tick{left:15px}}@media(prefers-reduced-motion:reduce){.craft-card,.craft-card *{transition:none!important}.craft-card:hover,.craft-card:hover *{transform:none!important}}

/* Keep the spotlight above the section's dark background and the artwork in view during the reveal. */
.studio-light{z-index:0;background:radial-gradient(ellipse at var(--light-x,30%) 48%,#4057a45c 0%,#1c253340 34%,transparent 70%)}
.studio-home .intro{position:sticky;top:0;z-index:1;min-height:100svh}
.scene-number,.scene-bottom{position:absolute;z-index:2}
.logo-scene{min-height:150svh;overflow:clip}
.studio-home .intro-brand{will-change:transform;transform:translateY(var(--art-y,0px)) rotate(var(--art-turn,0deg))}
.studio-home .signature-art{transform:none;will-change:filter;filter:drop-shadow(0 0 34px #526cff55)}

.capability-flow{position:relative;overflow:hidden;padding:110px 0 35px;background:#101312;color:#f4f2e9;border-top:1px solid #ffffff1c;border-bottom:1px solid #ffffff1c}.capability-heading{position:relative;z-index:2;padding:0 7% 70px;display:grid;grid-template-columns:1.4fr 1fr;align-items:end;gap:15px 6%}.capability-heading .eyebrow{grid-column:1/-1;color:#9eb1ff;margin-bottom:0}.capability-heading h2{grid-column:1;font-size:clamp(46px,6vw,90px);line-height:1.02}.capability-heading h2 em{font-weight:400;color:#9eb1ff}.capability-heading p{grid-column:2;grid-row:2;font-size:14px;color:#c1c8d3;line-height:1.7;margin-bottom:8px}.capability-bands{display:grid;gap:8px;transform:rotate(-2deg) scale(1.04);padding:15px 0 45px}.cap-band{overflow:hidden;width:100%;border-block:1px solid #ffffff23;background:#182a80;padding:12px 0}.band-2{background:#e9e6d7;color:#16203a}.band-3{background:#9babd7;color:#101a3d}.cap-track{width:max-content;display:flex;gap:12px;animation:capability-drift 48s linear infinite}.band-2 .cap-track{animation-name:capability-drift-reverse;animation-duration:54s}.band-3 .cap-track{animation-duration:44s}.cap-band:hover .cap-track{animation-play-state:paused}.cap-chip{display:flex;align-items:center;gap:15px;padding:13px 20px;border:1px solid currentColor;border-radius:50px;font-size:clamp(14px,1.35vw,20px);white-space:nowrap}.cap-chip b{font-size:8px;letter-spacing:1px;opacity:.65}.capability-foot{display:flex;justify-content:space-between;padding:28px 7% 0;font-size:8px;letter-spacing:1.5px;color:#aab4d4}@keyframes capability-drift{to{transform:translateX(-50%)}}@keyframes capability-drift-reverse{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@media(max-width:700px){.logo-scene{min-height:140svh}.studio-home .intro{min-height:100svh;display:flex;flex-direction:column;justify-content:center;gap:28px;padding:90px 7%}.studio-home .intro-brand{display:grid;grid-template-columns:1fr 100px;align-items:center}.studio-home .signature-art{width:100px}.studio-home .intro-brand:after{display:none}.studio-home .intro .eyebrow{grid-column:1}.studio-home .art-caption{font-size:6px}.studio-home .intro>div:last-child h2{font-size:37px}.studio-home .intro-bottom p{font-size:13px}.capability-flow{padding-top:75px}.capability-heading{grid-template-columns:1fr;padding:0 7% 42px}.capability-heading .eyebrow,.capability-heading h2,.capability-heading p{grid-column:1;grid-row:auto}.capability-heading h2{font-size:48px}.capability-heading p{font-size:12px}.capability-bands{gap:6px;padding-bottom:25px}.cap-chip{font-size:14px;padding:11px 16px}.capability-foot{font-size:6px;letter-spacing:.8px}}
@media(prefers-reduced-motion:reduce){.studio-home .intro{position:relative}.studio-home .intro-brand{transform:none!important}.cap-track{animation:none!important;flex-wrap:wrap;width:100%;justify-content:center}.cap-band{overflow:visible}.capability-bands{transform:none}.studio-home .signature-art{filter:none}}
.studio-home .intro{position:sticky;top:0;min-height:100svh;z-index:1}.logo-scene{isolation:isolate}.studio-light{z-index:0;pointer-events:none}.studio-home .intro{z-index:1}.scene-number,.scene-bottom{z-index:2}

.studio-home .hero-copy h1 .blue-period{color:#7893ff}

/* BlueBlots hero: a shorter moving studio stage with its own follow-focus light. */
@media(min-width:601px){.studio-home .hero{height:min(88svh,940px);min-height:640px}.studio-home .hero-copy h1{font-size:clamp(70px,8.5vw,145px);letter-spacing:-6px}}
@media(max-width:600px){.studio-home .hero{height:88svh;min-height:600px}.studio-home .hero-copy h1{font-size:57px;letter-spacing:-3px}}
.studio-home .hero-shade{background:radial-gradient(ellipse 34% 50% at var(--focus-x,72%) var(--focus-y,42%),#7893ff21,transparent 100%),linear-gradient(90deg,#08110f70,transparent 80%),linear-gradient(0deg,#101312bd,transparent 70%);transition:background-position .15s linear}
.studio-home .hero-stamp{will-change:transform;filter:drop-shadow(0 0 24px #8ca2ff55)}

/* Pointer-only camera focus marker; native touch and keyboard behavior stays intact. */
@media (hover:hover) and (pointer:fine){
  body.studio-home{cursor:none}
  body.studio-home a,body.studio-home button{cursor:none}
  .cursor-focus{position:fixed;left:0;top:0;z-index:120;width:42px;height:42px;pointer-events:none;opacity:0;transform:translate3d(var(--cursor-x,-100px),var(--cursor-y,-100px),0) translate(-50%,-50%);transition:opacity .18s ease,transform .08s linear;display:grid;place-items:center;color:#a9bbff;mix-blend-mode:screen}
  .cursor-focus.is-visible{opacity:1}
  .focus-reticle{position:relative;width:38px;height:38px;border:1px solid #a9bbff;border-radius:50%;display:grid;place-items:center;transition:transform .2s ease,border-color .2s ease}
  .focus-reticle:before,.focus-reticle:after{content:'';position:absolute;background:#a9bbff;opacity:.85}
  .focus-reticle:before{width:1px;height:50px}.focus-reticle:after{height:1px;width:50px}
  .focus-reticle i{width:4px;height:4px;border-radius:50%;background:#7893ff;z-index:1;box-shadow:0 0 9px #7893ff}
  .focus-label{position:absolute;left:30px;top:29px;padding:7px 10px;background:#101312e8;color:#f4f2e9;font-size:8px;letter-spacing:1.2px;white-space:nowrap;opacity:0;transform:translate(5px,5px);transition:opacity .18s ease,transform .18s ease}
  .cursor-focus[data-active="true"] .focus-reticle{transform:scale(1.18);border-color:#fff}
  .cursor-focus[data-active="true"] .focus-label{opacity:1;transform:translate(0,0)}
}
@media (hover:none),(pointer:coarse){.cursor-focus{display:none}}
/* A tiny wandering BlueBlots mascot, drawn in SVG with soft dimensional shading. */
.blot-fish{position:absolute;left:0;top:0;width:66px;height:44px;z-index:70;pointer-events:none;opacity:.86;transform:translate3d(78vw,42vh,0);transition:transform 7s cubic-bezier(.22,.7,.2,1),opacity .5s ease;filter:drop-shadow(0 8px 12px #06133c55) drop-shadow(0 0 12px #5478ff55)}
.blot-fish svg{display:block;width:100%;height:100%;overflow:visible;animation:blot-fish-bob 2.8s ease-in-out infinite}
#fish-tail{transform-box:fill-box;transform-origin:90% 50%;animation:blot-fish-tail .9s ease-in-out infinite alternate}
@keyframes blot-fish-bob{50%{translate:0 -5px;rotate:-3deg}}
@keyframes blot-fish-tail{to{rotate:12deg}}
@media(max-width:600px){.blot-fish{width:48px;height:32px;opacity:.72}}
@media(prefers-reduced-motion:reduce){.blot-fish,.blot-fish svg,#fish-tail{animation:none!important;transition:none!important}}
/* Layered faces let the fish bank in perspective and show its other side on a turn. */
.blot-fish{width:88px;height:58px;perspective:650px;transform-style:preserve-3d;filter:none;will-change:transform;transition:none}
.blot-fish svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;transform-style:preserve-3d;backface-visibility:hidden;animation:blot-fish-bob 2.8s ease-in-out infinite}
.blot-fish .fish-front{transform:translateZ(7px);filter:drop-shadow(1px 2px 0 #102878) drop-shadow(2px 3px 0 #102878) drop-shadow(0 8px 9px #06133c66)}
.blot-fish .fish-back{transform:rotateY(180deg) scaleX(-1) translateZ(7px);filter:brightness(.78) saturate(.9) drop-shadow(1px 2px 0 #102878) drop-shadow(2px 3px 0 #102878) drop-shadow(0 8px 9px #06133c66)}
.blot-fish .fish-front #fish-tail,.blot-fish .fish-back #fish-tail-back{transform-box:fill-box;transform-origin:90% 50%;animation:blot-fish-tail .9s ease-in-out infinite alternate}
@keyframes blot-fish-bob{50%{translate:0 -4px}}
@keyframes blot-fish-tail{to{rotate:14deg}}
@media(max-width:600px){.blot-fish{width:62px;height:42px}}
@media(prefers-reduced-motion:reduce){.blot-fish,.blot-fish svg,.blot-fish #fish-tail,.blot-fish #fish-tail-back{animation:none!important;transition:none!important}}

@media(max-width:800px){.film-preview-grid{grid-template-columns:1fr}}
/* Give each work card a more compact, easier-to-scan frame. */
.studio-home .projects .project,.studio-home .projects .project:first-of-type{height:min(58svh,610px);min-height:420px;top:76px}
.studio-home .projects .project .project-info{left:36px;bottom:34px}
.studio-home .projects .project h3,.studio-home .projects .project:first-of-type h3{font-size:clamp(28px,3.5vw,54px);max-width:720px}
.studio-home .work{padding-top:76px;padding-bottom:90px}
.studio-home .work h2{font-size:clamp(42px,4.8vw,70px)}
/* Present every CREA carousel as its own clearly separated, ordered row. */
.carousel-story{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:26px;padding:34px 0;border-top:1px solid #bfc7b7;align-items:center}
.carousel-story-heading{display:block;margin:0}
.carousel-story-heading .eyebrow{margin-bottom:18px}
.carousel-story-heading h3{font-size:28px}
.carousel-story-heading p{margin-top:9px;line-height:1.5}
.carousel-slides{min-width:0;gap:12px}
.carousel-slides figure{flex-basis:clamp(180px,20vw,270px)}
@media(max-width:800px){.studio-home .projects .project,.studio-home .projects .project:first-of-type{height:52svh;min-height:390px;top:58px}.carousel-story{grid-template-columns:1fr;gap:18px}.carousel-story-heading{display:grid;grid-template-columns:1fr 2fr;align-items:end;gap:8px 18px}.carousel-story-heading .eyebrow{grid-column:1/-1;margin-bottom:3px}.carousel-story-heading p{grid-column:2;margin:0}.carousel-slides figure{flex-basis:min(52vw,260px)}}
@media(max-width:600px){.studio-home .projects .project,.studio-home .projects .project:first-of-type{height:430px;min-height:0;top:auto}.studio-home .projects .project .project-info{left:22px;right:22px;bottom:24px}.studio-home .projects .project h3,.studio-home .projects .project:first-of-type h3{font-size:30px}.studio-home .work{padding:60px 5%}.carousel-slides figure{flex-basis:72vw}}
/* Keep the portfolio cards in a compact, stable grid rather than a tall stack. */
.studio-home .projects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;align-items:stretch}
.studio-home .projects .project,.studio-home .projects .project:first-of-type{position:relative;top:auto;height:clamp(360px,42vw,520px);min-height:0;overflow:hidden;transform:none}
.studio-home .projects .project .project-image{position:absolute;inset:0}
.studio-home .projects .project .project-info{left:30px;right:30px;bottom:28px}
.studio-home .projects .project h3,.studio-home .projects .project:first-of-type h3{font-size:clamp(28px,3.1vw,46px);max-width:620px}
@media(max-width:800px){.studio-home .projects .project,.studio-home .projects .project:first-of-type{height:430px}}
@media(max-width:600px){.studio-home .projects{grid-template-columns:1fr;gap:20px}.studio-home .projects .project,.studio-home .projects .project:first-of-type{height:400px}.studio-home .projects .project .project-info{left:22px;right:22px;bottom:24px}}
.studio-home .featured-note{grid-column:1 / -1}
/* Documentary portfolio thumbnail treatment inspired by editorial film grids. */
.studio-home .projects .project .project-image:after{background:linear-gradient(0deg,#07100e9c,transparent 62%),linear-gradient(180deg,#07100e22,transparent 38%)}
.studio-home .projects .project .project-image img{filter:saturate(.94) contrast(1.04);transition:filter .5s,transform .7s}
.studio-home .projects .project:hover .project-image img{filter:saturate(1.04) contrast(1.06);transform:scale(1.025)}
.studio-home .projects .project .image-label{top:50%;left:50%;bottom:auto;transform:translate(-50%,-50%);max-width:80%;padding:7px 10px;text-align:center;font-size:clamp(11px,.95vw,15px);letter-spacing:2px;line-height:1.5;text-shadow:0 2px 12px #000b}
.craft-art.craft-photo-art{display:block;overflow:hidden;background:#d9e3f0;border:7px solid #ffffff70;box-shadow:0 8px 18px #101c1830}
.craft-photo-art img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform .55s,filter .55s}
.craft-card:hover .craft-photo-art img{transform:scale(1.045);filter:saturate(1)}
.studio-home .work .project-image:after{background:linear-gradient(0deg,#07100e9c,transparent 62%),linear-gradient(180deg,#07100e22,transparent 38%),rgba(0,0,0,.22)}
.studio-home .work .project-image img{transition:filter .5s,transform .7s;filter:saturate(.86) brightness(.76) contrast(1.05)}
.studio-home .work .project:hover .project-image img{filter:saturate(.96) brightness(.9) contrast(1.05)}
.carousel-slides img{filter:brightness(.88) saturate(.9) contrast(1.03);transition:filter .35s}
.carousel-slides figure:hover img{filter:brightness(.96) saturate(1) contrast(1.04)}
.studio-home .hero-copy{bottom:112px}
.studio-home .hero-statement{max-width:1300px;font-size:clamp(58px,7vw,112px);line-height:1.02;letter-spacing:-.055em}
@media(max-width:600px){.studio-home .hero-statement{font-size:48px;letter-spacing:-2.5px}.studio-home .hero-statement br{display:none}}
.service-overview.usp-band{margin:0 6% 80px;display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);gap:clamp(36px,7vw,110px);align-items:center;padding:clamp(48px,7vw,88px) clamp(28px,5vw,72px);border:0;background:#e6e7df;position:relative}
.service-overview.usp-band:before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:#173a9a}
.service-overview.usp-band>div{grid-row:auto}
.usp-head .eyebrow{color:#173a9a;margin:0 0 18px}
.usp-head h2{font-size:clamp(42px,5vw,70px);line-height:1.02;letter-spacing:-.05em}
.service-overview.usp-band .usp-copy{max-width:680px;margin:0;padding-left:clamp(22px,3vw,44px);border-left:1px solid #173a9a55;font-size:clamp(16px,1.35vw,19px);line-height:1.8}
@media(max-width:800px){.service-overview.usp-band{grid-template-columns:1fr;gap:24px;margin:0 6% 55px;padding:46px 28px}.service-overview.usp-band .usp-copy{max-width:none}}
.studio-home .clients{padding:clamp(76px,9vw,126px) 6% clamp(54px,7vw,88px);overflow:hidden}
.client-wall-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin:0 auto 44px;max-width:1350px}
.client-wall-heading .eyebrow{margin:0 0 12px;color:var(--blue)}
.client-wall-heading h2{font-size:clamp(40px,5.5vw,76px);line-height:.98;letter-spacing:-.055em}
.client-wall-heading h2 em{color:var(--blue)}
.studio-home .client-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;width:min(100%,1350px);margin:0 auto;align-items:stretch}
.client-tile{position:relative;min-width:0;height:clamp(180px,19vw,250px);overflow:hidden;display:flex;align-items:center;justify-content:center;border-radius:2px;isolation:isolate;transition:transform .35s,box-shadow .35s}
.client-tile:hover{transform:translateY(-6px);box-shadow:0 16px 34px #17251e1c}
.client-tile:before{content:"";position:absolute;z-index:-1;width:190px;height:190px;border:1px solid currentColor;border-radius:50%;opacity:.12;right:-75px;bottom:-105px;box-shadow:0 0 0 18px transparent,0 0 0 19px currentColor,0 0 0 38px transparent,0 0 0 39px currentColor}
.client-tile:after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:5px;background:currentColor;opacity:.9}
.tile-crea{background:#e7eaf8;color:#173a9a}.tile-c3{background:#f2e2d1;color:#b64f27}.tile-mantra{background:#dceff0;color:#087da3}.tile-medha{background:#e4edda;color:#158c76}
.client-index{position:absolute;top:18px;left:18px;font-size:8px;font-weight:700;letter-spacing:1.25px;color:#17251e;z-index:1}.client-index i{font-style:normal;color:currentColor}
.client-tile img{width:70%;height:68%;object-fit:contain;mix-blend-mode:multiply;filter:none;opacity:1;position:relative;z-index:1;transition:transform .4s}
.client-tile:hover img{transform:scale(1.04)}
.client-tile:nth-child(2) img{width:78%;height:60%}.client-tile:nth-child(3) img{width:74%;height:58%}.client-tile:nth-child(4) img{width:76%;height:78%}
.client-cross{position:absolute;right:18px;bottom:13px;color:currentColor;font-size:27px;line-height:1;z-index:1}
.client-wall-foot{max-width:1350px;margin:18px auto 0;padding-top:13px;border-top:1px solid #17251e2b;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.35px;color:#5d675e}
.client-wall-foot b{color:var(--blue);font-size:12px;margin:0 4px}
@media(max-width:800px){.client-wall-heading{align-items:start;flex-direction:column;gap:0;margin-bottom:30px}.studio-home .client-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.client-tile{height:clamp(175px,32vw,230px)}}
@media(max-width:520px){.studio-home .clients{padding-top:62px}.client-wall-heading h2{font-size:42px}.client-wall-foot{font-size:7px;letter-spacing:.8px}.client-index{top:13px;left:13px;font-size:7px}.client-cross{right:12px;bottom:10px;font-size:21px}}
.studio-home .services{padding:clamp(78px,8vw,125px) 6%;}
.services .section-heading{align-items:end;gap:40px;margin-bottom:52px}
.services .section-heading h2{max-width:850px;font-size:clamp(44px,5.5vw,78px);line-height:1.02;letter-spacing:-.055em}
.services .section-heading>p{max-width:390px;font-size:16px;line-height:1.7}
.craft-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.craft-card,.craft-card:nth-child(2),.craft-card:nth-child(4){display:grid;grid-template-columns:minmax(150px,.82fr) minmax(0,1.18fr);grid-template-rows:auto auto 1fr auto;column-gap:26px;row-gap:0;align-items:stretch;min-height:365px;margin:0;padding:30px}
.craft-top{grid-column:1/-1;grid-row:1;margin-bottom:23px}
.craft-top span:first-child{font-size:9px;letter-spacing:1.2px}
.craft-art{grid-column:1;grid-row:2/5;height:auto;min-height:225px;margin:0;align-self:stretch}
.craft-art.craft-photo-art{min-height:225px}
.craft-photo-art img{min-height:225px}
.craft-card h3{grid-column:2;grid-row:2;align-self:start;font-size:clamp(29px,3vw,42px);line-height:1.04;letter-spacing:-.045em;margin:0 0 15px}
.craft-card>p{grid-column:2;grid-row:3;font-size:15px;line-height:1.7;opacity:.9;margin:0 0 20px}
.craft-bottom{grid-column:2;grid-row:4;align-self:end;font-size:13px;padding:13px 0;margin:0}
.craft-meta{display:none}
.craft-design .craft-art{display:grid;place-items:center;background:#17245a;border:1px solid #ffffff24}
.craft-design .craft-logo{width:min(100%,220px);height:210px}
@media(max-width:850px){.craft-grid{grid-template-columns:1fr}.craft-card,.craft-card:nth-child(2),.craft-card:nth-child(4){min-height:330px}}
@media(max-width:600px){.studio-home .services{padding:68px 6%}.services .section-heading{align-items:start;gap:20px;margin-bottom:32px}.services .section-heading h2{font-size:clamp(42px,11vw,58px)}.services .section-heading>p{font-size:14px}.craft-grid{grid-template-columns:1fr;gap:16px}.craft-card,.craft-card:nth-child(2),.craft-card:nth-child(4){display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto;min-height:0;padding:23px}.craft-top{grid-column:1;grid-row:1;margin-bottom:17px}.craft-art,.craft-art.craft-photo-art,.craft-design .craft-art{grid-column:1;grid-row:2;height:175px;min-height:175px;margin:0 0 20px}.craft-photo-art img{min-height:175px}.craft-card h3{grid-column:1;grid-row:3;font-size:34px;margin-bottom:12px}.craft-card>p{grid-column:1;grid-row:4;font-size:14px;margin-bottom:14px}.craft-bottom{grid-column:1;grid-row:5;font-size:12px;padding:12px 0}.craft-design .craft-logo{height:165px}}
/* Readability and contact refinements */
.team-person{padding-bottom:38px}
.team-number{font-size:11px;color:#586459;letter-spacing:.35px}
.team-person h3{font-size:21px;margin:22px 0 10px}
.team-person p{font-size:14px;line-height:1.72;color:#465248}
.team-person .team-bio{margin-top:9px}
.experience p{font-size:14px;line-height:1.75;color:#465248}
.experience-logos{gap:24px 28px;justify-content:flex-start}
.experience-logos img{width:112px;height:58px;opacity:.82}
.contact-bottom{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) minmax(260px,1.3fr);align-items:start;gap:24px}
.contact-bottom a{display:inline-flex;align-items:center;gap:10px;width:max-content;max-width:100%;min-height:44px;padding:7px 0;color:#f4f2e9;font-size:clamp(16px,1.4vw,20px);font-weight:600;line-height:1.3;border-bottom:1px solid #8299ff;text-underline-offset:5px;transition:color .2s,border-color .2s}
.contact-bottom a:after{content:"↗";font-size:13px;color:#9aabff}
.contact-bottom a:hover{color:#b8c6ff;border-color:#b8c6ff}
.contact-bottom>span{max-width:360px;font-size:14px;line-height:1.7;color:#d3d8d2}
@media(max-width:900px){.experience-logos{gap:20px 24px}.experience-logos img{width:105px;height:56px}}
@media(max-width:700px){.team-person p{font-size:14px}.experience-logos{gap:18px 20px}.experience-logos img{width:clamp(92px,25vw,115px);height:56px}.contact-bottom{grid-template-columns:1fr;gap:14px}.contact-bottom a{font-size:18px}.contact-bottom>span{max-width:100%;margin-top:5px}}
@media(max-width:420px){.experience-logos{gap:14px}.experience-logos img{width:calc((100% - 28px)/2);height:54px}}