/* ATI's blue / cyan / violet identity, with richer light and motion. */
#hero-title{font-size:clamp(34.375px,4.0625vw,56.875px);letter-spacing:-.5px;word-spacing:3px;line-height:1.16;translate:0 15%}
.hero-heading{display:flow-root;transform:translateY(-50%);margin-bottom:-17px}
.hero .lead{translate:0 -30%}
@media(max-width:850px){#hero-title{font-size:40.625px;letter-spacing:-.3px;word-spacing:2px}}
@media(max-width:480px){#hero-title{font-size:33.75px}}
body{background:#ecf1ff;background-image:radial-gradient(ellipse at 5% 10%,#c1eaff88,transparent 35%),radial-gradient(ellipse at 95% 30%,#d8caff88,transparent 40%);overflow-x:hidden}
.wrap{position:relative;isolation:isolate}
header{position:relative;z-index:5;background:#ffffffc4;border-radius:0 0 22px 22px;padding:0 22px;box-shadow:0 12px 45px #365abc0b;backdrop-filter:blur(16px)}
header>a{display:flex;align-items:center;flex-shrink:0}
header .logo{width:312px;height:104px;object-fit:contain;display:block}
@media(max-width:850px){header .logo{width:240px;height:80px}}
@media(max-width:480px){header .logo{width:180px;height:60px}}
.hero{position:relative;padding:90px 28px 85px;isolation:isolate}
.hero:before{content:'';position:absolute;inset:0 -48px;z-index:-2;background:linear-gradient(125deg,#d4edff,#efe1ff 40%,#d5fbfa 75%,#dce3ff);background-size:250% 250%;animation:aurora 18s ease-in-out infinite;pointer-events:none}
.hero:after{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#507adb33 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(90deg,transparent,#0006);pointer-events:none}
h1{font-weight:600}.gradient{background-image:linear-gradient(95deg,#215be8,#007a92 40%,#7240db 70%,#215be8);background-size:220% auto;animation:colourflow 9s linear infinite}
.art{overflow:visible;background:radial-gradient(ellipse at center,#64d5ff77,#7376ff26 45%,transparent 70%)}
.art:before{border-color:#6e8dfa66;animation:orbitpulse 8s ease-in-out infinite}
.art:after{border-color:#537fe077;animation:ringturn 45s linear infinite}
.orb{box-shadow:inset -24px -25px 25px #060d3d66,inset 14px 12px 20px #ffffff88,0 0 85px #257bff55,25px 40px 50px #213e8d38}
.orb{border-radius:50%;transform:rotate(-12deg);animation:globefloat 9s ease-in-out infinite}.orb:after{z-index:3;pointer-events:none}
.globe-window{position:absolute;inset:0;border-radius:50%;overflow:hidden;perspective:800px;isolation:isolate}
.globe-axis{position:absolute;inset:0;transform:rotate(-14deg);transform-style:preserve-3d}
.globe-surface{position:absolute;inset:0;transform-style:preserve-3d;animation:globespin 18s linear infinite}
.globe-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;transform:translateZ(120px);padding:25px;pointer-events:none}
.globe-face img{width:100%;height:auto;background:#ecfaffdd;border:1px solid #a5efff99;border-radius:12px;padding:12px 8px;box-shadow:0 6px 24px #02113944}
.globe-back{transform:rotateY(180deg) translateZ(120px)}
.globe-meridian{position:absolute;inset:4%;border:1px solid #b0ffff55;border-radius:50%;transform:rotateY(0deg);backface-visibility:visible;pointer-events:none}.m-two{transform:rotateY(60deg)}.m-three{transform:rotateY(120deg)}
.globe-equator{position:absolute;inset:38% 0;border:1px solid #b0ffff44;border-radius:50%;pointer-events:none;z-index:2}
.orb{width:324px;height:324px}
.globe-window{perspective:none;transform:rotate(-10deg)}
.globe-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}.globe-canvas.is-ready{opacity:1}
.orb>.globe-canvas{inset:-25%;width:150%;height:150%;z-index:4}
.orb.has-spherical-rings:after{display:none}
.brand-tagline{font:500 20px/1.5 Arial,Helvetica,sans-serif;color:#2842a0;letter-spacing:-.3px}
.orbit-tagline{left:0!important;right:0;bottom:5px;text-align:center;font:500 13px/1.7 Arial,Helvetica,sans-serif;letter-spacing:.3px;color:#24387e;animation:none}
.footer-tagline{display:block;margin-bottom:9px;color:#2842a0;font-size:12px}
.purpose-line{font-size:18.75px;line-height:1.8;color:#fff;margin:10px 0 0;font-weight:600;transform:translateY(45%);text-shadow:0 1px 2px #163c75,0 0 5px #163c7580}
.purpose-claim{display:block;font-size:16px;font-weight:600;line-height:1.5;color:#a8f4ff;margin-bottom:15px;letter-spacing:.2px}
.contact-details{font-style:normal;display:grid;gap:12px;margin-top:28px;max-width:440px}
.contact-details a{display:flex;align-items:center;gap:15px;background:#ffffffd9;border:1px solid #b7caed;border-radius:12px;padding:15px 18px;transition:background .25s,border-color .25s;min-width:0}
.contact-details a:hover{background:#eefaff;border-color:#5389eb}
.contact-details svg{width:24px;height:24px;flex-shrink:0;color:#315eda}
.contact-details .whatsapp-brand-icon{width:28px;height:28px;object-fit:contain;flex-shrink:0;display:block}
.contact-details span{font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.contact-details small{display:block;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#5a6c8b;margin-bottom:4px}
.art{height:600px}
.service-tab{z-index:6;display:flex;align-items:center;gap:9px;padding:13px 15px;border-radius:13px;color:#183767;font-size:12px;font-weight:500;white-space:nowrap;box-shadow:0 10px 30px #17336d19;border:1px solid #ffffffcc;background:#ffffffeb;animation:tagfloat 7s ease-in-out infinite}
.service-tab svg{width:21px;height:21px;flex-shrink:0;color:#4264d5}.service-tab:hover,.service-tab:focus-visible{background:#edfaff;border-color:#7db8ee;box-shadow:0 14px 35px #17336d30;transform:scale(1.05)}
.service-tab{isolation:isolate;overflow:hidden}
.service-tab:before{content:'';position:absolute;inset:0;z-index:-1;background-image:var(--tech-art);background-position:right center;background-repeat:no-repeat;background-size:105px auto;opacity:.22;pointer-events:none}
.service-tab-1,.service:nth-child(1){--tech-art:url('assets/tech-website.svg')}
.service-tab-2,.service:nth-child(2){--tech-art:url('assets/tech-brand.svg')}
.service-tab-3{--tech-art:url('assets/tech-photography.svg')}
.service-tab-4,.service:nth-child(3){--tech-art:url('assets/tech-content.svg')}
.service-tab-5,.service:nth-child(4){--tech-art:url('assets/tech-automation.svg')}
.service-tab-6,.service:nth-child(5){--tech-art:url('assets/tech-tools.svg')}
.service-tab-7,.service:nth-child(6){--tech-art:url('assets/tech-assistant.svg')}
.service-photography{--tech-art:url('assets/tech-photography.svg');grid-column:1/-1}
.service-photography:after{background-size:260px auto!important}
.service{isolation:isolate}
.service:after{content:'';position:absolute;inset:0;z-index:-1;background-image:var(--tech-art);background-repeat:no-repeat;background-position:right 5px bottom 45px;background-size:95% auto;opacity:.075;pointer-events:none}
.service-tab-1{top:20px;left:calc(4% + 36px)}.service-tab-2{top:25px;right:1%;animation-delay:-2s}.service-tab-3{top:160px;left:0;animation-delay:-4s}.service-tab-4{top:175px;right:0;animation-delay:-1s}.service-tab-5{bottom:115px;left:0;animation-delay:-3s}.service-tab-6{bottom:100px;right:0;animation-delay:-5s}.service-tab-7{bottom:15px;left:calc(50% - 73px);animation-delay:-2.5s}
@media(max-width:850px){.art{height:570px;overflow:visible}.service-tab-1{left:calc(5% + 30px)}.service-tab-2{right:5%}}
@media(max-width:480px){.art{height:530px;overflow:hidden}.service-tab{font-size:10px;padding:10px;gap:6px}.service-tab svg{width:18px;height:18px}.service-tab-1{top:20px;left:24px}.service-tab-2{top:25px;right:0}.service-tab-3{top:120px}.service-tab-4{top:135px}.service-tab-5{bottom:90px}.service-tab-6{bottom:80px}.service-tab-7{left:calc(50% - 60px);bottom:10px}}
.orb:after{border-left-color:#f5fcff;border-top-color:#8bddff;border-right-color:#8bddff;border-bottom-color:#091740;animation:counterorbit 18s linear infinite}
@keyframes counterorbit{from{transform:rotate(30deg)}to{transform:rotate(390deg)}}
.globe-logo-fallback{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain;background:transparent;border:0;box-shadow:none;padding:0}
.globe-logo-fallback[hidden]{display:none}
.globe-logo-fallback{filter:drop-shadow(0 0 6px #a4f9ff) drop-shadow(0 0 15px #00d9ff99)}
@keyframes globespin{from{transform:rotateY(0deg)}to{transform:rotateY(360deg)}}@keyframes globefloat{50%{transform:translateY(-16px) rotate(-12deg)}}
@media(max-width:480px){.orb{width:260px;height:260px}}
.art-tag{transition:transform .8s cubic-bezier(.2,.8,.2,1);animation:tagfloat 7s ease-in-out infinite}.tag-two{animation-delay:-3s}
.pixels i{animation:pixeldance 4s ease-in-out infinite}.pixels i:nth-child(2n){animation-delay:-1s}.pixels i:nth-child(3n){animation-delay:-2s}
.ribbon{position:relative;color:white;border:0;background:linear-gradient(105deg,#204ed5,#5939bd 50%,#087b9f);padding:27px 24px;box-shadow:0 18px 40px #353cb822;border-radius:14px}.ribbon span:before{color:#87f5ff;display:inline-block;animation:starspin 16s linear infinite}
.section{position:relative}.section-head h2{max-width:700px}
#services{padding-left:22px;padding-right:22px}
.service{position:relative;overflow:hidden;background:linear-gradient(145deg,#ffffffeb,#e9f0ff);border:1px solid #a5bcec88;box-shadow:0 12px 26px #335ab409;transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s,border-color .6s}
.service:nth-child(3n+2){background:linear-gradient(145deg,#fff,#ede4ff)}.service:nth-child(3n){background:linear-gradient(145deg,#fff,#d9f8f5)}
.service:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,#fff9 46%,transparent 62%);transform:translateX(-130%);transition:transform .95s ease;pointer-events:none}
.service:hover:before{transform:translateX(130%)}
.service:hover{transform:translateY(-12px);box-shadow:0 26px 45px #3158bc22;border-color:#5587ff}
.service .eyebrow{color:#315ce0}.service a span{transition:transform .4s}.service:hover a span{transform:translate(4px,-4px)}
.industries{padding:35px 18px 18px}.industries .eyebrow{color:#3258bc}
#photography{padding:65px 35px;margin:10px -10px 30px;background:linear-gradient(130deg,#091b45,#202575 55%,#4e268e);color:#fff;border-radius:28px;overflow:hidden;isolation:isolate;box-shadow:0 30px 75px #27268926}
#photography:before{content:'';position:absolute;width:560px;height:560px;right:-250px;top:-180px;border-radius:50%;background:radial-gradient(circle,#16e0ef38,transparent 65%);animation:halo 12s ease-in-out infinite;z-index:-1}
#photography .section-head p,#photography .photo-list p{color:#c7d4f1}#photography .eyebrow{color:#88e6f4}#photography .photo-list article{border-color:#8090c840}
.photo-art{position:relative;background:radial-gradient(ellipse at 20% 30%,#07bedc55,transparent 55%),linear-gradient(145deg,#102e65,#6241c0);box-shadow:inset 0 0 90px #0004;border:1px solid #8ca8f744;overflow:hidden}
.photo-art:before{content:'';position:absolute;inset:-100%;background:conic-gradient(from 0deg,transparent 65%,#94eaff22 80%,transparent 95%);animation:ringturn 18s linear infinite;pointer-events:none}
.photo-art{padding:28px}
.viewfinder{padding:20px;perspective:900px}
.photo-cosmos{position:relative;width:100%;max-width:360px;aspect-ratio:1;margin:25px auto;isolation:isolate;perspective:700px}
.photo-halo{position:absolute;inset:-8%;border-radius:50%;background:radial-gradient(circle,#49edff55 10%,#6257fd44 42%,transparent 68%);animation:photo-halo-pulse 6s ease-in-out infinite}
.photo-sphere{position:absolute;inset:10%;border-radius:50%;background:radial-gradient(circle at 28% 22%,#dcffff,#22d3ee 18%,#1772cd 39%,#2b248c 68%,#090c32 92%);box-shadow:inset -18px -22px 30px #050c3477,inset 8px 9px 22px #c2fdff99,0 0 35px #27ddff77,0 0 70px #713dff55;animation:photo-sphere-breathe 7s ease-in-out infinite}
.photo-sphere:before{content:'';position:absolute;inset:0;border:1px solid #b0ffff55;border-radius:50%;background:repeating-radial-gradient(ellipse at 50% 50%,transparent 0 27px,#b6ffff22 28px 29px,transparent 30px 48px);opacity:.6;pointer-events:none}
.photo-orbit{position:absolute;inset:0;border:3px solid #86f8ff;border-left-color:#fff;border-bottom-color:#7950f5;border-radius:50%;box-shadow:0 0 12px #5ccfff77;pointer-events:none;z-index:2;transform-style:preserve-3d}
.photo-orbit-one{animation:photo-orbit-spin 12s linear infinite}
.photo-orbit-two{inset:5%;border-width:2px;border-color:#a799ff;border-top-color:#fff;animation:photo-orbit-cross 17s linear infinite reverse}
.photo-orbit-three{inset:-4%;border:1px dashed #96ddff99;box-shadow:none;animation:ringturn 28s linear infinite}
.photo-badge{position:absolute;display:grid;place-items:center;width:49px;height:49px;border-radius:14px;background:linear-gradient(145deg,#ffffffed,#bdf7ffdf);border:1px solid #d9ffff;color:#154d99;box-shadow:0 8px 18px #07184b66,0 0 12px #4ee7ff55;z-index:4;animation:photo-icon-bounce 4.8s cubic-bezier(.45,0,.25,1) infinite}
.photo-badge svg{width:27px;height:27px}
.photo-badge-1{left:9%;top:18%;animation-delay:-.8s}.photo-badge-2{right:7%;top:13%;animation-delay:-2.5s}.photo-badge-3{left:40%;top:38%;animation-delay:-1.6s}.photo-badge-4{left:9%;bottom:17%;animation-delay:-3.2s}.photo-badge-5{right:8%;bottom:18%;animation-delay:-4.1s}.photo-badge-6{left:41%;bottom:-2%;animation-delay:-.1s}
.photo-badge-7{left:40%;top:-3%;animation-delay:-2.1s}
@keyframes photo-icon-bounce{0%,100%{translate:0 7px;transform:rotate(-5deg) scale(.96)}35%{translate:0 -20px;transform:rotate(6deg) scale(1.08)}65%{translate:0 11px;transform:rotate(-3deg) scale(.94)}82%{translate:0 -6px;transform:rotate(2deg) scale(1.02)}}
@keyframes photo-orbit-spin{from{transform:rotateZ(-25deg) rotateX(66deg) rotateZ(0deg)}to{transform:rotateZ(-25deg) rotateX(66deg) rotateZ(360deg)}}
@keyframes photo-orbit-cross{from{transform:rotateZ(48deg) rotateX(62deg) rotateZ(0deg)}to{transform:rotateZ(48deg) rotateX(62deg) rotateZ(360deg)}}
@keyframes photo-halo-pulse{50%{transform:scale(1.12);opacity:.65}}
@keyframes photo-sphere-breathe{50%{transform:scale(1.035);filter:brightness(1.12)}}
@media(max-width:480px){.photo-art{padding:22px}.viewfinder{padding:14px}.photo-badge{width:37px;height:37px;border-radius:11px}.photo-badge svg{width:22px;height:22px}.photo-cosmos{margin:25px auto}}
.viewfinder{z-index:1}.lens{animation:lensbreath 8s ease-in-out infinite}
.photo-list article{transition:transform .5s,background .5s;border-radius:9px}.photo-list article:hover{transform:translateX(8px);background:#ffffff08}
.brand-card{transition:transform .6s,box-shadow .6s;box-shadow:0 15px 40px #274a9310}.brand-card:hover{transform:translateY(-8px);box-shadow:0 28px 50px #274a9325}
.brand-stage{background:radial-gradient(circle at 75% 20%,#d2d0ff,transparent 55%),radial-gradient(circle at 0 100%,#bcefff,transparent 60%),#ffffff}
.palette-stage{background:linear-gradient(130deg,#153c96,#492c9c,#096f86);background-size:220% 220%;animation:aurora 16s ease-in-out infinite}
.swatches div{transition:transform .4s}.swatches div:hover{transform:translateY(-8px) scale(1.05)}
.vision{background:linear-gradient(120deg,#134eaa,#3926a3 55%,#7834bc);box-shadow:0 25px 60px #3926a326;isolation:isolate}.vision:after{content:'';position:absolute;inset:-80% -20%;z-index:-1;background:linear-gradient(115deg,transparent 35%,#6af5ff22 50%,transparent 65%);animation:lightsweep 10s ease-in-out infinite;pointer-events:none}.vision small{color:#d2def9}
#brief{padding-left:22px;padding-right:22px;background:radial-gradient(ellipse at 0 60%,#b9e9ff77,transparent 60%),radial-gradient(ellipse at 100% 80%,#dbbdff66,transparent 60%)}
.form-panel{box-shadow:0 25px 65px #3458af17;border-color:#bcccec;background:#ffffffed}.primary{background:linear-gradient(100deg,#2559ed,#603bd8);box-shadow:0 8px 25px #3955db33;position:relative;overflow:hidden;transition:transform .45s,box-shadow .45s}.primary:hover{transform:translateY(-4px);box-shadow:0 15px 35px #3955db55}.primary span{transition:transform .4s}.primary:hover span{transform:translate(3px,-3px)}
.primary:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent,#ffffff55,transparent);transform:translateX(-120%);transition:transform .8s}.primary:hover:after{transform:translateX(120%)}
.pill{transition:background .4s,color .4s,transform .4s}.pill:hover{background:var(--ink);color:#fff;transform:translateY(-3px)}input,select,textarea{transition:border-color .3s,box-shadow .3s}input:focus,select:focus,textarea:focus{border-color:#6c70ed;box-shadow:0 0 0 4px #7764ee17}
.scroll-progress{position:fixed;top:0;left:0;width:100%;height:4px;transform:scaleX(0);transform-origin:left;z-index:50;background:linear-gradient(90deg,#00d5ea,#2355ff,#a756f5);pointer-events:none}
.page-transition{position:fixed;inset:0;background:linear-gradient(115deg,#135cdf,#6734c9,#00a9bd);z-index:40;pointer-events:none;transform:translateX(-105%);opacity:.9}.page-transition.is-running{animation:pagewipe .8s cubic-bezier(.65,0,.3,1) both}
.motion-ready .reveal{opacity:0;transform:translate3d(0,65px,0) scale(.97);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1.25s cubic-bezier(.16,1,.3,1);transition-delay:var(--delay,0ms)}
.motion-ready .reveal.reveal-left{transform:translate3d(-65px,25px,0) scale(.96)}.motion-ready .reveal.reveal-right{transform:translate3d(65px,25px,0) scale(.96)}
.motion-ready .reveal.is-visible{opacity:1;transform:translate3d(0,0,0) scale(1)}
.motion-ready .hero h1{animation:herorise 1.25s cubic-bezier(.16,1,.3,1) both}.motion-ready .hero .lead{animation:herorise 1.25s .14s cubic-bezier(.16,1,.3,1) both}.motion-ready .hero .actions{animation:herorise 1.25s .28s cubic-bezier(.16,1,.3,1) both}
@keyframes aurora{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}@keyframes colourflow{to{background-position:220% center}}@keyframes ringturn{to{transform:rotate(360deg)}}@keyframes orbitpulse{50%{transform:scale(1.08);opacity:.5}}@keyframes tagfloat{50%{translate:0 -12px}}@keyframes pixeldance{0%,100%{translate:0 0;opacity:.25}50%{translate:4px -8px;opacity:.85}}@keyframes starspin{to{rotate:360deg}}@keyframes halo{50%{transform:translate(-80px,110px) scale(1.2)}}@keyframes lensbreath{50%{transform:scale(1.06) rotate(8deg);filter:brightness(1.2)}}@keyframes lightsweep{0%,100%{transform:translateX(-25%)}50%{transform:translateX(25%)}}@keyframes herorise{from{opacity:0;transform:translateY(55px)}to{opacity:1;transform:translateY(0)}}@keyframes pagewipe{0%{transform:translateX(-105%)}42%{transform:translateX(0)}100%{transform:translateX(105%)}}
@media(min-width:1320px){.hero:before{inset-inline:calc((1320px - 100vw)/2 - 48px)}}
@media(max-width:850px){header{padding:0 10px}.hero{padding:55px 0 60px}.hero:before{inset-inline:-24px}#services,#brief{padding-left:0;padding-right:0}#photography{padding:40px 24px;margin-inline:-10px}.art{overflow:hidden}.motion-ready .reveal.reveal-left,.motion-ready .reveal.reveal-right{transform:translateY(35px)}.motion-ready .reveal.is-visible{transform:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motion-ready .reveal,.motion-ready .reveal.reveal-left,.motion-ready .reveal.reveal-right{opacity:1;transform:none}.page-transition{display:none}.service:hover,.brand-card:hover,.photo-list article:hover,.primary:hover,.pill:hover{transform:none}}

.gallery-entry{margin:24px 14px 12px 0}.project-link{display:block;margin-top:24px;color:#2455df}#portfolio{scroll-margin-top:130px}

/* ATI signature: kinetic entrance, with a static reduced-motion fallback. */
.brand-stage.kinetic-logo{position:relative;overflow:hidden;isolation:isolate;perspective:1000px}
.kinetic-logo>img{position:relative;z-index:2;transform-origin:center;will-change:auto}
.kinetic-logo::after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#ffffffb3 48%,#b5f9ff99 51%,transparent 65%);transform:translateX(-135%);opacity:0}
.logo-pixels{position:absolute;inset:0;pointer-events:none;z-index:1}.logo-pixels i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);background:var(--colour);border-radius:2px;opacity:0;box-shadow:0 0 18px var(--colour)}
.motion-ready .brand-card.reveal:not(.is-visible) .kinetic-logo>img{opacity:0;clip-path:inset(0 100% 0 0);transform:translate3d(-35px,20px,-90px) rotateY(-16deg) scale(.9)}
.motion-ready .brand-card.is-visible .kinetic-logo>img{animation:ati-signature-reveal 1.7s .2s cubic-bezier(.16,1,.3,1) both}
.motion-ready .brand-card.is-visible .kinetic-logo::after{animation:ati-signature-shine 1.6s .65s ease-in-out both}
.motion-ready .brand-card.is-visible .logo-pixels i{animation:ati-pixel-reveal 1.8s calc(.25s + var(--stagger)) cubic-bezier(.22,1,.36,1) both}
@keyframes ati-signature-reveal{0%{opacity:0;clip-path:inset(0 100% 0 0);transform:translate3d(-35px,20px,-90px) rotateY(-16deg) scale(.9);filter:blur(8px)}55%{opacity:1;filter:blur(0);clip-path:inset(0 0 0 0)}80%{transform:translate3d(0,-3px,0) rotateY(2deg) scale(1.025)}100%{opacity:1;clip-path:inset(0 0 0 0);transform:none;filter:none}}
@keyframes ati-signature-shine{0%{opacity:0;transform:translateX(-135%)}20%{opacity:.8}75%{opacity:.6}100%{opacity:0;transform:translateX(135%)}}
@keyframes ati-pixel-reveal{0%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) rotate(65deg) scale(.2)}35%{opacity:.85}75%{opacity:.3;transform:translate3d(0,0,0) rotate(0) scale(1)}100%{opacity:0;transform:translate3d(12px,-18px,0) scale(.6)}}
@media(prefers-reduced-motion:reduce){.motion-ready .brand-card .kinetic-logo>img{opacity:1!important;clip-path:none!important;transform:none!important;filter:none!important}.kinetic-logo::after,.logo-pixels{display:none}}

/* Liquid palette: original ATI silhouette filled with flowing brand colours. */
.palette-stage{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,#142955,#332975 55%,#193f73)}.palette-stage>.eyebrow,.palette-stage>.big,.palette-stage>.swatches{position:relative;z-index:2}.palette-stage>.big{text-shadow:0 2px 18px #091d4899}.liquid-art{position:absolute;inset:0;pointer-events:none;z-index:0}.liquid-filter{position:absolute}.liquid-blob{position:absolute;width:72%;height:100%;border-radius:40% 60% 64% 36%/52% 38% 62% 48%;filter:blur(28px);opacity:.45}.liquid-blob-one{left:-20%;top:-50%;background:radial-gradient(circle at 60% 60%,#05daf3,#2755ff 65%,transparent 75%)}.liquid-blob-two{right:-20%;bottom:-65%;background:radial-gradient(circle at 30% 30%,#9864ff,#6046e6 55%,transparent 75%)}.liquid-logo-form{position:absolute;inset:18% 4% 15%;background:linear-gradient(110deg,#2f64ff 5%,#57edff 30%,#2765ff 50%,#aa7dff 72%,#57edff 90%);background-size:300% 100%;mask:url('assets/ati-logo.png') center/contain no-repeat;-webkit-mask:url('assets/ati-logo.png') center/contain no-repeat;opacity:.25;transform:scale(1.06)}
.motion-ready .brand-card.is-visible .liquid-logo-form{filter:url('#ati-liquid-warp');animation:ati-liquid-colour 8s ease-in-out infinite,ati-liquid-arrive 1.6s .25s cubic-bezier(.16,1,.3,1) both}.motion-ready .brand-card.is-visible .liquid-blob-one{animation:ati-liquid-flow 12s ease-in-out infinite alternate}.motion-ready .brand-card.is-visible .liquid-blob-two{animation:ati-liquid-flow 15s -4s ease-in-out infinite alternate-reverse}.motion-ready .brand-card.is-visible .swatches div{animation:ati-liquid-swatch 7s ease-in-out infinite}.motion-ready .brand-card.is-visible .swatches div:nth-child(2){animation-delay:-1.5s}.motion-ready .brand-card.is-visible .swatches div:nth-child(3){animation-delay:-3s}.motion-ready .brand-card.is-visible .swatches div:nth-child(4){animation-delay:-4.5s}
@keyframes ati-liquid-colour{0%,100%{background-position:0% center}50%{background-position:100% center}}@keyframes ati-liquid-arrive{from{opacity:0;transform:translateY(25px) scale(.9)}to{opacity:.25;transform:scale(1.06)}}@keyframes ati-liquid-flow{from{transform:translate(-10px,-5px) rotate(-10deg) scale(.9);border-radius:40% 60% 64% 36%/52% 38% 62% 48%}to{transform:translate(50px,30px) rotate(25deg) scale(1.2);border-radius:65% 35% 38% 62%/34% 67% 33% 66%}}@keyframes ati-liquid-swatch{0%,100%{border-radius:8px;transform:translateY(0)}50%{border-radius:20px 9px 18px 11px;transform:translateY(-4px)}}
@media(prefers-reduced-motion:reduce){.motion-ready .brand-card.is-visible .liquid-logo-form{filter:none!important;opacity:.25;transform:scale(1.06)}.liquid-blob,.swatches div{animation:none!important}}

/* Satin fabric morph in ATI's blue/cyan/violet palette. */
.fabric-morph{background:linear-gradient(130deg,#102953,#29205f 65%,#183967);perspective:900px}.fabric-field{position:absolute;inset:-25%;z-index:0;pointer-events:none;overflow:hidden;opacity:.8}.fabric-ribbon{position:absolute;inset:-15% -25%;border-radius:43% 57% 36% 64%/47% 34% 66% 53%;background:linear-gradient(115deg,transparent 10%,#07163c 24%,#2153b3 31%,#67e5f3 35%,#13519c 39%,#0b1741 46%,#6344ab 53%,#bb9fff 57%,#39327b 62%,#09162f 72%,transparent 86%);background-size:180% 130%;transform:rotate(-24deg) scale(1.1);opacity:.72;box-shadow:inset 0 2px 25px #b2e9ff22}.fabric-ribbon-two{inset:-5% -40%;transform:rotate(24deg) scale(.9);opacity:.4;background:linear-gradient(110deg,transparent 25%,#08223e 36%,#038fb6 43%,#7ef9ff 46%,#18477f 50%,#161744 59%,transparent 70%)}.fabric-ribbon-three{inset:-30% -20%;opacity:.28;transform:rotate(-42deg);background:repeating-linear-gradient(100deg,transparent 0 12%,#020d2a 16%,#7f62ca 19%,#c7b5f7 20%,#37306a 22%,transparent 29%)}.fabric-weave{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#0000000a 0 1px,transparent 1px 3px);opacity:.4;mix-blend-mode:soft-light}.fabric-morph .liquid-art{z-index:1}.fabric-morph .liquid-blob{display:none}.fabric-morph .liquid-logo-form{opacity:.16}.fabric-morph>.big,.fabric-morph>.eyebrow{ text-shadow:0 2px 12px #07152d,0 0 30px #07152db3}.fabric-morph .swatches{z-index:3}
.motion-ready .brand-card.is-visible .fabric-ribbon-one{animation:ati-satin-drape 14s ease-in-out infinite alternate}.motion-ready .brand-card.is-visible .fabric-ribbon-two{animation:ati-satin-cross 17s -5s ease-in-out infinite alternate}.motion-ready .brand-card.is-visible .fabric-ribbon-three{animation:ati-satin-folds 19s -7s ease-in-out infinite alternate}.motion-ready .brand-card.is-visible .fabric-morph .liquid-logo-form{animation:ati-liquid-colour 10s ease-in-out infinite;filter:url('#ati-liquid-warp')}
@keyframes ati-satin-drape{0%{transform:translate(-4%,-4%) rotate(-24deg) scale(1.1);background-position:0% 20%;border-radius:43% 57% 36% 64%/47% 34% 66% 53%}50%{transform:translate(3%,1%) rotate(-12deg) scale(1.18);border-radius:60% 40% 54% 46%/32% 64% 36% 68%}100%{transform:translate(6%,4%) rotate(-30deg) scale(1.05);background-position:100% 75%;border-radius:34% 66% 62% 38%/62% 38% 56% 44%}}@keyframes ati-satin-cross{from{transform:translate(-6%,0) rotate(24deg) scale(.9);background-position:0% 30%}to{transform:translate(7%,5%) rotate(8deg) scale(1.15);background-position:100% 80%}}@keyframes ati-satin-folds{from{transform:translate(-5%,-4%) rotate(-42deg) scale(1);background-position:0% 50%}to{transform:translate(4%,7%) rotate(-25deg) scale(1.2);background-position:80% 50%}}
@media(prefers-reduced-motion:reduce){.fabric-ribbon{animation:none!important}.motion-ready .brand-card.is-visible .fabric-morph .liquid-logo-form{animation:none!important;filter:none!important;opacity:.16}}

/* Header material assembly uses exact clipped portions of the original logo. */
.header-logo-assembly{display:block;position:relative;width:312px;height:104px;perspective:800px;isolation:isolate}.header-logo-assembly>.logo{display:block;width:100%;height:100%;object-fit:contain;animation:ati-header-finish 2.1s cubic-bezier(.16,1,.3,1) both}.header-logo-parts{position:absolute;inset:0;pointer-events:none}.header-logo-piece{position:absolute;inset:0;background:url('assets/ati-logo.png') center/contain no-repeat;animation:ati-header-piece 2s cubic-bezier(.16,1,.3,1) both;transform-origin:center}.piece-one{clip-path:inset(0 80% 0 0);--px:-40px;--py:20px;--pr:-24deg;--pd:0s}.piece-two{clip-path:inset(0 60% 0 20%);--px:0px;--py:-35px;--pr:20deg;--pd:.08s}.piece-three{clip-path:inset(0 40% 0 40%);--px:18px;--py:28px;--pr:-18deg;--pd:.16s}.piece-four{clip-path:inset(0 20% 0 60%);--px:28px;--py:-24px;--pr:18deg;--pd:.24s}.piece-five{clip-path:inset(0 0 0 80%);--px:40px;--py:15px;--pr:-20deg;--pd:.32s}.header-logo-piece{animation-delay:var(--pd)}.header-logo-glint{position:absolute;inset:15% 0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#ffffffb0 49%,transparent 60%);opacity:0;animation:ati-header-glint 1.2s 1s ease both}
@keyframes ati-header-piece{0%{opacity:0;transform:translate3d(var(--px),var(--py),80px) rotateY(var(--pr)) scale(.8);filter:blur(3px)}30%,65%{opacity:1}62%{transform:none;filter:none}85%,100%{opacity:0;transform:none;filter:none}}@keyframes ati-header-finish{0%,50%{opacity:0}72%,100%{opacity:1}}@keyframes ati-header-glint{0%{opacity:0;transform:translateX(-80%)}30%{opacity:.6}100%{opacity:0;transform:translateX(80%)}}
@media(max-width:850px){.header-logo-assembly{width:240px;height:80px}}@media(max-width:520px){.header-logo-assembly{width:180px;height:60px}}@media(prefers-reduced-motion:reduce){.header-logo-assembly>.logo{opacity:1;animation:none!important}.header-logo-parts,.header-logo-glint{display:none}}

.photo-badge-8{left:47%;top:76%;animation-delay:-2.2s}

#portfolio .project-image{display:flex;align-items:center;justify-content:center;overflow:hidden;width:100%;height:220px;margin:0 0 24px;padding:16px;border-radius:14px;background:#fff;border:1px solid #e5e9f2}#portfolio .project-image img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .5s ease}#portfolio .project-image:hover img{transform:scale(1.04)}@media(prefers-reduced-motion:reduce){#portfolio .project-image img{transition:none}#portfolio .project-image:hover img{transform:none}}

/* Consistent compact spacing, replacing hero offsets that reserved empty space. */
.hero{padding:42px 28px 46px;gap:36px}.hero-heading{transform:none;margin-bottom:22px}#hero-title{translate:none;margin:20px 0 0}.hero .lead{translate:none;margin:0;line-height:1.65}.hero .actions{margin:24px 0}.hero-note.brand-tagline{margin:24px 0 12px}.purpose-line{transform:none;margin:12px 0 0;line-height:1.6}.section{padding:60px 0}.section-head{margin-bottom:30px;gap:32px}.section-head p{margin-bottom:0}.industries{padding:24px 18px 10px}.ribbon{padding-top:20px;padding-bottom:20px}#photography{padding:44px 30px;margin:0 -10px 16px}.photo-list article{padding-top:16px;padding-bottom:16px}.photo-list h3{margin-top:0}.photo-list p{margin-bottom:0}.photo-layout{gap:30px}.vision{padding:44px;gap:32px}.vision small{margin-top:20px}.brief{gap:44px}.form-panel{padding:28px}.card-caption{padding:20px 24px}footer{padding:24px 0}.gallery-entry{margin:20px 12px 6px 0}#portfolio .project-image{height:190px;margin-bottom:18px}
@media(max-width:850px){.hero{padding:32px 0 36px;gap:24px}.section{padding:42px 0}.section-head{gap:20px;margin-bottom:24px}#photography{padding:32px 24px}.vision{padding:30px}.brief{gap:28px}.hero-heading{margin-bottom:20px}.hero .actions{margin:22px 0}.hero-note.brand-tagline{margin-top:20px}.art{margin-top:0;margin-bottom:0}}@media(max-width:480px){.section{padding:34px 0}.vision{padding:24px}.form-panel{padding:22px}.section-head{gap:16px}.hero{padding-top:26px}.purpose-line{margin-top:10px}}

/* Compact, transparent logo links: approximately a quarter of the previous card area. */
#project-links{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}#portfolio .portfolio-logo-card{width:190px;min-height:0;padding:14px 12px 16px;flex:0 0 190px;text-align:center;background:transparent;border:0;box-shadow:none;border-radius:0}#portfolio .portfolio-logo-card::before,#portfolio .portfolio-logo-card::after{display:none}#portfolio .portfolio-logo-card .project-image{width:110px;height:110px;min-height:0;padding:0;margin:0 auto 12px;background:transparent;border:0;border-radius:0;box-shadow:none}#portfolio .portfolio-logo-card h3{font-size:17px;line-height:1.3;margin:0 0 8px;letter-spacing:-.3px}#portfolio .portfolio-logo-card .project-click-hint{font-size:12px;line-height:1.5;margin:0;color:#53647f}#portfolio .portfolio-logo-card .project-image:focus-visible{outline:3px solid #245bfa;outline-offset:6px}#portfolio .portfolio-logo-card .project-image img{width:100%;height:100%;object-fit:contain}

.brief-send-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.whatsapp-send{background:#128c51}.brief-send-actions .text-link{background:transparent;border:0;border-bottom:1px solid currentColor;padding:6px 0;color:#245bfa}.sample-previews{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.sample-previews img{width:70px;height:70px;object-fit:cover;border-radius:8px}input[type=file]{font-size:13px}.brief-send-actions [hidden]{display:none}