:root{ --bg:#050505;--ink:#f3f3f0;--muted:#aaa9a5;--line:rgba(255,255,255,.085);--line-strong:rgba(255,255,255,.16); --frame-max:1800px;--header-h:120px;--ease:cubic-bezier(.22,.72,.18,1); } *{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Inter","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}body.lock{overflow:hidden} a{color:inherit;text-decoration:none}button,input,textarea{font:inherit;color:inherit}img,video{display:block;width:100%;height:100%;object-fit:cover}button{cursor:pointer} .frame{width:min(var(--frame-max),calc(100% - 100px));margin:0 auto;position:relative}.grid-rails{position:fixed;inset:0;pointer-events:none;z-index:80}.grid-rails .inner{width:min(var(--frame-max),calc(100% - 100px));height:100%;margin:auto;position:relative;border-left:1px solid var(--line);border-right:1px solid var(--line)}.rail{position:absolute;top:0;bottom:0;width:1px;background:var(--line)}.r1{left:25%}.r2{left:50%}.r3{left:75%} .grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.18;background:url('../img/grain.png') repeat;background-size:280px 280px;mix-blend-mode:soft-light}.vignette{position:fixed;inset:0;pointer-events:none;z-index:89;background:radial-gradient(circle at 50% 45%,transparent 45%,rgba(0,0,0,.2) 100%)} .site-header{position:fixed;top:0;left:0;right:0;height:var(--header-h);z-index:120;pointer-events:none}.header-inner{pointer-events:auto;height:100%;display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);align-items:stretch}.brand{display:flex;align-items:center;gap:12px;padding:0 0;font-size:28px;letter-spacing:-.04em;font-weight:500}.star{width:24px;height:24px;position:relative;display:inline-block;flex:none}.star:before,.star:after{content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 0C13.05 6.1 17.9 10.95 24 12c-6.1 1.05-10.95 5.9-12 12C10.95 17.9 6.1 13.05 0 12 6.1 10.95 10.95 6.1 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 0C13.05 6.1 17.9 10.95 24 12c-6.1 1.05-10.95 5.9-12 12C10.95 17.9 6.1 13.05 0 12 6.1 10.95 10.95 6.1 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat}.brand sup{font-size:9px;letter-spacing:0;margin-left:2px;vertical-align:top}.nav{grid-column:3/5;display:grid;grid-template-columns:1.5fr .5fr;align-items:stretch}.nav-links{display:flex;justify-content:flex-end;align-items:center;gap:34px;padding-right:26px}.nav-links a{font-size:16px;color:#d0d0ce;transition:opacity .2s}.nav-links a:hover{opacity:.58}.top-cta{display:flex;align-items:center;justify-content:center;gap:26px;background:#efefec;color:#090909;font-size:16px;border-left:1px solid var(--line);transition:background .25s,color .25s}.top-cta:hover{background:#fff}.top-cta .star{width:21px;height:21px}.menu-btn{display:none;background:none;border:0;font-size:24px}.mobile-menu{display:none} .hero{position:relative;min-height:900px;height:100svh;overflow:hidden}.hero-bg{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(8,4,4,.30),rgba(9,4,4,.42) 52%,rgba(0,14,14,.72)),url('../img/hero-flower.jpg');background-size:cover;background-position:center 40%;transform:scale(1.025);will-change:transform}.hero-shade{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.04),rgba(0,0,0,.16) 65%,rgba(0,0,0,.35))}.hero-grid{position:relative;height:100%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:120px 1fr 235px}.hero-copy{grid-column:1/3;grid-row:2;align-self:start;padding-top:34px;position:relative;z-index:2}.hero-title{font-size:clamp(76px,6.35vw,122px);line-height:1.13;letter-spacing:-.063em;font-weight:400;margin:0 0 36px}.maskline{display:block;overflow:hidden}.maskline span{display:block;transform:translateY(110%);animation:lineIn 1s var(--ease) forwards}.maskline:nth-child(2) span{animation-delay:.12s}@keyframes lineIn{to{transform:translateY(0)}}.hero-intro{max-width:555px;font-size:27px;line-height:1.47;letter-spacing:-.025em;color:#d3d1ce;margin:0 0 30px}.btn-row{display:flex;gap:14px}.btn{min-height:64px;padding:0 28px;border:1px solid var(--line-strong);background:rgba(0,0,0,.12);display:inline-flex;align-items:center;gap:22px;font-size:17px;transition:background .3s,color .3s,border-color .3s}.btn.light{background:#efefec;color:#080808;border-color:#efefec}.btn:hover{background:#efefec;color:#080808}.btn .star{width:21px;height:21px}.hero-services{grid-column:3/4;grid-row:3;align-self:end;height:198px;margin-bottom:24px;overflow:hidden;position:relative;--service-row:66px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.22) 0%,rgba(0,0,0,.48) 22%,#000 42%,#000 100%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.22) 0%,rgba(0,0,0,.48) 22%,#000 42%,#000 100%)}.service-carousel-track{display:flex;flex-direction:column;will-change:transform;transform:translate3d(0,0,0);animation:heroServicesCarousel 7.8s cubic-bezier(.72,0,.28,1) infinite;animation-play-state:paused}.page-revealed .service-carousel-track{animation-play-state:running}.service-word{height:var(--service-row);flex:0 0 var(--service-row);display:flex;align-items:center;font-size:22px;line-height:1;color:#f1f0ed;margin:0;white-space:nowrap}.service-word:nth-child(3n+1){color:rgba(255,255,255,.92)}@keyframes heroServicesCarousel{0%,20%{transform:translate3d(0,0,0)}29%,49%{transform:translate3d(0,calc(var(--service-row)*-1),0)}58%,78%{transform:translate3d(0,calc(var(--service-row)*-2),0)}87%,100%{transform:translate3d(0,calc(var(--service-row)*-3),0)}}.hero-thumb{grid-column:4/5;grid-row:3;width:66%;height:154px;justify-self:end;align-self:end;margin-bottom:0;overflow:hidden;border-left:1px solid var(--line);border-top:1px solid var(--line);position:relative}.hero-thumb img{filter:grayscale(1);transition:filter .6s var(--ease),transform .8s var(--ease)}.hero-thumb:hover img{filter:grayscale(0);transform:scale(1.045)} @keyframes fadeUp{to{opacity:1;transform:none}} .h-rule{border-top:1px solid var(--line)}.section{position:relative}.section-head{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);min-height:360px}.label-cell{grid-column:1/2;padding:44px 0;font-size:14px;color:#c7c6c2}.copy-cell{grid-column:2/4;padding:42px 48px}.copy-cell h2,.large-copy{font-size:clamp(42px,3.6vw,70px);line-height:1.02;letter-spacing:-.047em;font-weight:400;margin:0 0 30px}.copy-cell p{font-size:20px;line-height:1.55;color:var(--muted);max-width:790px;margin:0}.art-cell{grid-column:4/5;min-height:360px;border-left:1px solid var(--line);overflow:hidden}.art-cell img{filter:grayscale(1);transition:filter .6s var(--ease),transform .8s var(--ease)}.art-cell:hover img{filter:grayscale(0);transform:scale(1.04)} .logo-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.logo-strip div{height:130px;padding:28px;border-right:1px solid var(--line);display:grid;place-items:center}.logo-strip div:last-child{border-right:0}.logo-strip img{object-fit:contain;filter:grayscale(1);opacity:.85;transition:opacity .25s}.logo-strip div:hover img{opacity:1} .ticker{overflow:hidden;border-bottom:1px solid var(--line);height:72px;display:flex;align-items:center}.ticker-track{display:flex;width:max-content;animation:marquee 27s linear infinite}.ticker-item{min-width:360px;font-size:18px;display:flex;align-items:center;gap:30px;white-space:nowrap}.ticker-item:after{content:'✦';font-size:13px}@keyframes marquee{to{transform:translateX(-50%)}} .video-grid{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.video-tile,.video-art{aspect-ratio:1.16/1;position:relative;overflow:hidden;border-right:1px solid var(--line)}.video-grid>*:last-child{border-right:0}.video-tile video{filter:grayscale(1) contrast(.92);transition:filter .55s var(--ease),transform .8s var(--ease)}.video-tile:hover video{filter:grayscale(0);transform:scale(1.04)}.video-tile:after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.48),transparent 55%)}.video-label{position:absolute;z-index:2;left:24px;right:24px;bottom:22px;display:flex;align-items:center;justify-content:space-between;font-size:14px;text-transform:lowercase}.play-dot{width:42px;height:42px;border:1px solid var(--line-strong);border-radius:50%;display:grid;place-items:center;transition:.3s}.video-tile:hover .play-dot{background:#fff;color:#000}.video-art{background:#080808;display:grid;place-items:center}.video-art:before,.video-art:after{content:'';position:absolute;width:55%;height:55%;border:1px solid rgba(255,255,255,.22);border-radius:50%;animation:orbit 12s linear infinite}.video-art:after{width:35%;height:70%;animation-direction:reverse;animation-duration:9s}@keyframes orbit{to{transform:rotate(360deg)}} .about-body{display:grid;grid-template-columns:repeat(4,1fr);min-height:620px}.about-visual{grid-column:1/3;overflow:hidden;border-right:1px solid var(--line)}.about-visual img{filter:grayscale(1);transition:.7s var(--ease)}.about-visual:hover img{filter:grayscale(0);transform:scale(1.03)}.about-note{grid-column:3/5;padding:52px 48px;display:flex;flex-direction:column;justify-content:space-between}.about-note .thinking{text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:#777}.about-note h3{font-size:56px;line-height:1;letter-spacing:-.05em;font-weight:400;margin:0}.about-note p{font-size:20px;color:var(--muted);max-width:620px;line-height:1.55}.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stat{min-height:240px;padding:34px 26px;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--line)}.stat:last-child{border-right:0}.stat strong{font-size:74px;font-weight:400;letter-spacing:-.065em}.stat span{font-size:15px;color:#9a9996} .solutions-wrap{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.solutions-media{grid-column:1/3;position:relative;min-height:760px;border-right:1px solid var(--line);overflow:hidden}.solutions-media .sticky-media{position:sticky;top:var(--header-h);height:calc(100vh - var(--header-h));min-height:640px;overflow:hidden}.solutions-media img{filter:grayscale(1);transition:opacity .45s var(--ease),filter .55s var(--ease),transform .8s var(--ease)}.solutions-media:hover img{filter:grayscale(0);transform:scale(1.025)}.solutions-media .big-word{position:absolute;left:30px;bottom:26px;font-size:90px;letter-spacing:-.06em;z-index:2}.solution-list{grid-column:3/5}.solution-intro{padding:48px;min-height:260px;border-bottom:1px solid var(--line)}.solution-intro p{font-size:19px;line-height:1.5;color:var(--muted);max-width:620px}.solution-row{min-height:135px;padding:28px 34px;display:grid;grid-template-columns:70px 1fr auto;align-items:center;border-bottom:1px solid var(--line);transition:background .32s,color .32s}.solution-row:hover,.solution-row.active{background:#f0f0ed;color:#070707}.solution-row h3{font-weight:400;font-size:29px;letter-spacing:-.035em;margin:0}.solution-row .num{font-size:12px}.arr{font-size:28px;transition:transform .3s}.solution-row:hover .arr{transform:translate(6px,-6px)} .quote{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);min-height:620px}.quote-copy{grid-column:1/3;padding:54px 50px;display:flex;flex-direction:column;justify-content:space-between}.quote blockquote{font-size:clamp(42px,3.6vw,68px);line-height:1.05;letter-spacing:-.045em;margin:0}.quote-by{display:flex;gap:15px;align-items:center}.quote-by img{width:56px;height:56px;border-radius:50%;filter:grayscale(1)}.quote-by small{display:block;color:#888;margin-top:4px}.quote-portrait{grid-column:3/5;overflow:hidden}.quote-portrait img{filter:grayscale(1);transition:.65s}.quote-portrait:hover img{filter:grayscale(0);transform:scale(1.03)} .cap-grid{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.cap-card{min-height:370px;padding:38px 28px;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--line);transition:background .3s,color .3s}.cap-card:last-child{border-right:0}.cap-card:hover{background:#efefec;color:#090909}.pixel-icon{width:96px;height:96px;image-rendering:pixelated;object-fit:contain}.cap-card:hover .pixel-icon{filter:invert(1)}.cap-card h3{font-size:29px;font-weight:400;letter-spacing:-.035em;margin:0 0 16px}.cap-card p{font-size:17px;line-height:1.5;color:#888;margin:0;transition:color .3s}.cap-card:hover p{color:#383838} .enterprise{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);min-height:480px}.enterprise-copy{grid-column:1/3;padding:50px}.enterprise-copy h3{font-size:58px;line-height:1;letter-spacing:-.05em;font-weight:400;margin:0 0 32px}.enterprise-copy p{color:#94938f;font-size:18px}.badge-cell{display:grid;place-items:center;border-left:1px solid var(--line)}.badge-cell img{width:70%;height:auto;object-fit:contain;filter:grayscale(1);transition:.4s}.badge-cell:hover img{filter:grayscale(0);transform:scale(1.025)} .case-grid,.insight-grid{display:grid;grid-template-columns:repeat(2,1fr);border-bottom:1px solid var(--line)}.case-card,.insight-card{border-right:1px solid var(--line);overflow:hidden}.case-card:nth-child(2n),.insight-card:nth-child(2n){border-right:0}.case-image,.insight-image{height:430px;overflow:hidden;border-bottom:1px solid var(--line)}.case-image img,.insight-image img{filter:grayscale(1);transition:filter .6s var(--ease),transform .8s var(--ease)}.case-card:hover .case-image img,.insight-card:hover .insight-image img{filter:grayscale(0);transform:scale(1.035)}.case-body,.insight-body{padding:30px;min-height:290px}.meta{display:flex;justify-content:space-between;color:#83827f;font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:40px}.case-body h3,.insight-body h3{font-size:37px;line-height:1.04;letter-spacing:-.04em;font-weight:400;margin:0}.metrics{display:flex;gap:42px;border-top:1px solid var(--line);margin-top:36px;padding-top:20px}.metrics strong{font-size:31px;font-weight:400}.metrics span{display:block;color:#777;font-size:12px;margin-top:4px} .test-head{display:grid;grid-template-columns:repeat(4,1fr);min-height:350px;border-bottom:1px solid var(--line)}.test-head .label-cell{grid-column:1}.test-copy{grid-column:2/4;padding:48px}.test-copy h2{font-size:62px;letter-spacing:-.05em;font-weight:400;line-height:1;margin:0}.test-cta{grid-column:4;display:flex;align-items:flex-end;padding:30px}.test-scroller{overflow:hidden;border-bottom:1px solid var(--line)}.test-track{display:flex;width:max-content;animation:marquee 42s linear infinite}.testimonial{width:450px;min-height:300px;padding:34px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between}.testimonial q{font-size:28px;line-height:1.25;letter-spacing:-.03em}.person{display:flex;gap:13px;align-items:center}.person img{width:50px;height:50px;border-radius:50%;filter:grayscale(1)}.person small{display:block;color:#777;margin-top:3px} .insight-grid{grid-template-columns:repeat(4,1fr)}.insight-card{border-right:1px solid var(--line)}.insight-card:nth-child(2n){border-right:1px solid var(--line)}.insight-card:last-child{border-right:0}.insight-image{height:300px}.insight-body{min-height:230px}.insight-body h3{font-size:27px}.read{display:block;color:#777;font-size:12px;margin-top:45px} .faq-list{border-bottom:1px solid var(--line)}.faq-item{display:grid;grid-template-columns:repeat(4,1fr);min-height:145px;border-top:1px solid var(--line);transition:background .32s,color .32s}.faq-icon{grid-column:1;padding:22px;display:flex;align-items:center}.faq-icon img{width:72px;height:72px;object-fit:contain;image-rendering:pixelated}.faq-q{grid-column:2/4;border:0;background:none;text-align:left;font-size:28px;padding:28px 45px}.faq-plus{grid-column:4;display:grid;place-items:center;border-left:1px solid var(--line);font-size:36px;transition:transform .3s}.faq-answer{grid-column:2/4;max-height:0;overflow:hidden;padding:0 45px;transition:max-height .45s var(--ease),padding .45s var(--ease)}.faq-answer p{color:#595959;font-size:18px;line-height:1.55}.faq-item.open{background:#efefec;color:#080808}.faq-item.open .faq-answer{max-height:180px;padding-bottom:28px}.faq-item.open .faq-plus{transform:rotate(45deg)}.faq-item.open .faq-icon img{filter:invert(1)} .footer-cta{display:grid;grid-template-columns:repeat(4,1fr);min-height:520px;border-bottom:1px solid var(--line)}.footer-art{grid-column:1/3;overflow:hidden;border-right:1px solid var(--line)}.footer-art img{filter:grayscale(1);transition:.65s}.footer-art:hover img{filter:grayscale(0);transform:scale(1.025)}.footer-copy{grid-column:3/5;padding:54px;display:flex;flex-direction:column;justify-content:flex-start;gap:42px}.footer-copy h2{font-size:67px;line-height:1;letter-spacing:-.055em;font-weight:400;margin:0}.footer{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.footer-col{min-height:330px;padding:38px 28px;border-right:1px solid var(--line)}.footer-col:last-child{border-right:0}.footer-col h4{text-transform:uppercase;letter-spacing:.13em;font-size:11px;color:#777;margin:0 0 30px}.footer-col a{display:block;margin:13px 0;color:#c2c1be;font-size:15px}.footer-col a:hover{color:#fff}.footer-bottom{height:80px;display:flex;justify-content:space-between;align-items:center;color:#666;font-size:12px} .reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal.in{opacity:1;transform:none}.sticky-label{position:sticky;top:calc(var(--header-h) + 20px);align-self:start} .video-modal{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:300;display:grid;place-items:center;opacity:0;visibility:hidden;transition:.3s}.video-modal.open{opacity:1;visibility:visible}.modal-box{width:min(1100px,85vw);aspect-ratio:16/9;position:relative}.modal-close{position:absolute;right:0;top:-52px;background:none;border:0;font-size:32px}.page-wipe{position:fixed;top:0;bottom:0;left:var(--curtain-edge-left,0px);right:auto;width:var(--curtain-total-width,100vw);z-index:2050;display:grid;grid-template-columns:repeat(5,var(--curtain-panel-width,20vw));grid-template-rows:100%;gap:0;overflow:hidden;visibility:hidden;pointer-events:none;background:transparent;contain:paint;isolation:isolate;backface-visibility:hidden;-webkit-backface-visibility:hidden}.page-wipe.is-armed{visibility:visible;pointer-events:auto}.page-wipe-panel{position:relative;width:var(--curtain-panel-width,20vw);min-width:0;max-width:none;margin:0;padding:0;height:100%;box-sizing:border-box;background:#f0f0ed;border:0;border-right:var(--curtain-divider-width,2px) solid rgba(0,0,0,.22);transform:translate3d(0,101.5%,0);will-change:auto;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-origin:50% 50%}.page-wipe-panel:last-child{border-right:0}.page-wipe.is-armed .page-wipe-panel{will-change:transform}.page-wipe.is-closing .page-wipe-panel{animation:pageCurtainIn .50s cubic-bezier(.76,0,.22,1) both}.page-wipe.is-closing .page-wipe-panel:nth-child(3){animation-delay:0s}.page-wipe.is-closing .page-wipe-panel:nth-child(2),.page-wipe.is-closing .page-wipe-panel:nth-child(4){animation-delay:.045s}.page-wipe.is-closing .page-wipe-panel:nth-child(1),.page-wipe.is-closing .page-wipe-panel:nth-child(5){animation-delay:.09s}.page-wipe.force-covered .page-wipe-panel{animation:none!important;transform:translate3d(0,0,0)!important}.page-wipe.is-armed,.page-wipe.is-closing{touch-action:none}.page-wipe.is-armed:after{content:"";position:absolute;inset:0;z-index:5;pointer-events:auto}.is-navigating{cursor:progress}.is-navigating body,.is-navigating body *{user-select:none}.is-navigating body{overscroll-behavior:none}@keyframes pageCurtainIn{from{transform:translate3d(0,101.5%,0)}to{transform:translate3d(0,0,0)}} /* internal pages */ .page-hero{min-height:720px;padding-top:var(--header-h);display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);position:relative;overflow:hidden}.page-hero-copy{grid-column:1/4;padding-top:85px}.page-hero h1{font-size:clamp(72px,6.2vw,120px);line-height:.94;letter-spacing:-.06em;font-weight:400;margin:0;max-width:1320px}.page-hero p{font-size:24px;line-height:1.45;color:#aaa;max-width:740px;margin:38px 0}.page-hero-art{grid-column:4;position:absolute;right:0;top:var(--header-h);bottom:0;width:25%;overflow:hidden;border-left:1px solid var(--line)}.page-hero-art img{filter:grayscale(1)} .service-block{display:grid;grid-template-columns:repeat(4,1fr);min-height:610px;border-bottom:1px solid var(--line)}.service-copy{grid-column:1/3;padding:52px}.service-icon{width:96px;height:96px;image-rendering:pixelated;margin-bottom:55px}.service-copy h2{font-size:62px;line-height:1;letter-spacing:-.05em;font-weight:400;margin:0 0 24px}.service-copy p{font-size:19px;line-height:1.55;color:#92918e;max-width:650px}.service-art{grid-column:3/5;border-left:1px solid var(--line);padding:30px;display:grid;place-items:center}.service-art img{object-fit:contain;filter:grayscale(1);transition:.5s}.service-block:hover .service-art img{filter:grayscale(0)} .process-grid{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.process-nav{grid-column:1;position:sticky;top:var(--header-h);height:calc(100vh - var(--header-h));border-right:1px solid var(--line);padding:34px 0}.process-btn{width:100%;min-height:80px;background:none;border:0;border-bottom:1px solid var(--line);text-align:left;padding:0 25px;color:#888;transition:.3s}.process-btn.active,.process-btn:hover{background:#efefec;color:#070707}.process-panels{grid-column:2/5}.process-panel{display:none;grid-template-columns:1.2fr 1fr;min-height:620px}.process-panel.active{display:grid;animation:fadeUp .5s var(--ease)}.process-photo{overflow:hidden;border-right:1px solid var(--line)}.process-photo img{filter:grayscale(1);transition:.6s}.process-panel:hover .process-photo img{filter:grayscale(0)}.process-copy{padding:54px}.process-copy h3{font-size:52px;font-weight:400;letter-spacing:-.045em;margin:0 0 28px}.process-copy p{font-size:19px;line-height:1.6;color:#94938f} .featured{display:grid;grid-template-columns:repeat(4,1fr);min-height:650px;border-bottom:1px solid var(--line)}.featured-copy{grid-column:1/3;padding:50px;display:flex;flex-direction:column;justify-content:flex-end}.featured-copy h1{font-size:70px;line-height:1;letter-spacing:-.05em;font-weight:400;margin:24px 0}.featured-art{grid-column:3/5;border-left:1px solid var(--line);overflow:hidden}.featured-art img{filter:grayscale(1);transition:.65s}.featured:hover .featured-art img{filter:grayscale(0);transform:scale(1.025)}.listing-grid{display:grid;grid-template-columns:repeat(2,1fr)}.hidden-item{display:none}.loadmore{height:110px;display:grid;place-items:center;border-bottom:1px solid var(--line)} .article-head{padding-top:var(--header-h);display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.article-title{grid-column:1/4;padding:90px 0 70px}.article-title h1{font-size:95px;line-height:.98;letter-spacing:-.058em;font-weight:400;margin:25px 0}.article-side{grid-column:4;border-left:1px solid var(--line);overflow:hidden}.article-side img{filter:grayscale(1)}.article-body{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.article-body aside{grid-column:1;padding:45px 0;position:sticky;top:var(--header-h);height:max-content}.article-prose{grid-column:2/4;padding:48px}.article-prose h2{font-size:38px;font-weight:400;letter-spacing:-.04em;margin:54px 0 18px}.article-prose p{font-size:19px;line-height:1.7;color:#aaa}.article-next{grid-column:4;border-left:1px solid var(--line);padding:48px;display:flex;flex-direction:column;justify-content:flex-end}.article-next a{font-size:30px;line-height:1.08}.case-hero{padding-top:var(--header-h);border-bottom:1px solid var(--line)}.case-title{padding:80px 0 60px}.case-title h1{font-size:94px;line-height:.97;letter-spacing:-.055em;font-weight:400;margin:20px 0}.case-cover{height:620px;overflow:hidden;border-top:1px solid var(--line)}.case-cover img{filter:grayscale(1);transition:.6s}.case-cover:hover img{filter:grayscale(0);transform:scale(1.025)}.key-metrics{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.key-metric{min-height:190px;padding:30px;border-right:1px solid var(--line)}.key-metric:last-child{border-right:0}.key-metric strong{display:block;font-size:52px;font-weight:400;letter-spacing:-.05em}.key-metric span{font-size:13px;color:#777}.case-content{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.case-side{grid-column:1;padding:44px 0;position:sticky;top:var(--header-h);height:max-content}.case-prose{grid-column:2/4;padding:48px}.case-prose h2{font-size:40px;font-weight:400;margin:48px 0 18px}.case-prose p{font-size:19px;line-height:1.65;color:#aaa}.case-next{grid-column:4;padding:48px;border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end} .form-layout{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.contact-info{grid-column:1/3;padding:56px}.contact-info h2{font-size:62px;font-weight:400;letter-spacing:-.05em}.contact-line{display:flex;justify-content:space-between;padding:20px 0;border-top:1px solid var(--line)}.contact-line span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#777}.form-wrap{grid-column:3/5;border-left:1px solid var(--line);padding:55px}.field{margin-bottom:22px}.field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#777;margin-bottom:8px}.field input,.field textarea{width:100%;background:#080808;border:1px solid var(--line-strong);padding:16px;outline:none}.field textarea{min-height:160px}.field input:focus,.field textarea:focus{border-color:#777}.form-status{display:none;margin-top:18px;color:#aaa}.form-status.show{display:block} .waitlist-hero{min-height:760px;padding-top:var(--header-h);display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.waitlist-copy{grid-column:1/3;padding:75px 50px}.waitlist-copy h1{font-size:106px;line-height:.95;letter-spacing:-.06em;font-weight:400;margin:0 0 40px}.waitlist-art{grid-column:3/5;border-left:1px solid var(--line);overflow:hidden}.waitlist-art img{filter:grayscale(1)}.legal{padding-top:var(--header-h)}.legal-wrap{display:grid;grid-template-columns:repeat(4,1fr)}.legal-title{grid-column:1/3;padding:90px 0}.legal-title h1{font-size:90px;font-weight:400;letter-spacing:-.06em}.legal-prose{grid-column:2/4;padding:50px;border-top:1px solid var(--line)}.legal-prose h2{font-size:32px;font-weight:400;margin:48px 0 18px}.legal-prose p{font-size:18px;line-height:1.7;color:#aaa}.error{height:100svh;display:grid;place-items:center;text-align:center;padding-top:var(--header-h)}.error strong{display:block;font-size:260px;color:#151515;line-height:.8}.error h1{font-size:64px;font-weight:400;letter-spacing:-.05em} /* Verified continuation structures */ .about-bridge{border-bottom:1px solid var(--line)} .about-bridge-grid{display:grid;grid-template-columns:repeat(4,1fr);min-height:360px} .about-bridge-copy{grid-column:1/4;padding:52px 48px 52px 0;display:flex;align-items:flex-end} .about-bridge-copy p{font-size:clamp(34px,3vw,58px);line-height:1.04;letter-spacing:-.045em;margin:0;max-width:1120px} .about-bridge-art{grid-column:4;border-left:1px solid var(--line);overflow:hidden} .about-bridge-art img{filter:grayscale(1);transition:filter .6s var(--ease),transform .8s var(--ease)} .about-bridge-art:hover img{filter:grayscale(0);transform:scale(1.04)} .test-head.has-art{grid-template-columns:repeat(4,1fr)} .test-head.has-art .test-art{grid-column:1;overflow:hidden;border-right:1px solid var(--line)} .test-head.has-art .test-art img{filter:grayscale(1);transition:.6s var(--ease)} .test-head.has-art .test-art:hover img{filter:grayscale(0);transform:scale(1.035)} .test-head.has-art .test-copy{grid-column:2/4} .test-head.has-art .test-cta{grid-column:4} .footer-art.dark-atmosphere{background:linear-gradient(155deg,#2b2b2b 0%,#161616 45%,#050505 100%);position:relative;overflow:hidden} .footer-art.dark-atmosphere:before{content:'';position:absolute;inset:-20%;background:radial-gradient(circle at 38% 20%,rgba(255,255,255,.07),transparent 35%),linear-gradient(140deg,transparent 35%,rgba(255,255,255,.025) 50%,transparent 65%);filter:blur(18px)} .footer-art.dark-atmosphere img{display:none} .waitlist-intro{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)} .waitlist-intro-copy{grid-column:1/4;padding:58px 48px 58px 0} .waitlist-intro-copy h2{font-size:clamp(46px,4.5vw,84px);line-height:1;letter-spacing:-.055em;font-weight:400;margin:0 0 34px;max-width:1220px} .waitlist-intro-cta{grid-column:4;border-left:1px solid var(--line);display:flex;align-items:flex-end;padding:30px} .trust-head{display:grid;grid-template-columns:repeat(4,1fr);min-height:170px;border-bottom:1px solid var(--line)} .trust-head h3{grid-column:1/3;padding:38px 0;margin:0;font-weight:400;font-size:28px;letter-spacing:-.03em} .waitlist-cap-head{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);min-height:330px} .waitlist-cap-head .label-cell{grid-column:1} .waitlist-cap-head .copy-cell{grid-column:2/4} .waitlist-cap-head .art-cell{grid-column:4} .case-metrics-label{min-height:94px;display:flex;align-items:center;border-bottom:1px solid var(--line);font-size:14px;color:#c7c6c2} .case-subtitle{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)} .case-subtitle h3{grid-column:2/4;padding:42px 48px;margin:0;font-size:34px;line-height:1.15;font-weight:400;letter-spacing:-.035em} .article-cover-full{height:min(62vw,700px);border-bottom:1px solid var(--line);overflow:hidden} .article-cover-full img{filter:grayscale(1);transition:filter .65s var(--ease),transform .9s var(--ease)} .article-cover-full:hover img{filter:grayscale(0);transform:scale(1.025)} .article-about{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);min-height:260px} .article-about-art{grid-column:1;border-right:1px solid var(--line);overflow:hidden} .article-about-art img{filter:grayscale(1);transition:.6s var(--ease)} .article-about-art:hover img{filter:grayscale(0);transform:scale(1.035)} .article-about-copy{grid-column:2/4;padding:42px 48px} .article-about-copy h3{font-size:38px;font-weight:400;letter-spacing:-.035em;margin:15px 0} .article-about-copy p{font-size:18px;line-height:1.55;color:var(--muted);max-width:740px} .article-about-next{grid-column:4;border-left:1px solid var(--line);padding:40px;display:flex;flex-direction:column;justify-content:flex-end} .article-about-next a{font-size:25px;line-height:1.12} .featured-mark{position:absolute;left:28px;top:calc(var(--header-h) + 28px);width:72px;height:72px;z-index:2;image-rendering:pixelated;object-fit:contain} .case-card .case-image img,.featured-art img,.service-art img,.process-photo img,.waitlist-art img,.page-hero-art img{transition:filter .6s var(--ease),transform .8s var(--ease)} .waitlist-art:hover img,.page-hero-art:hover img{filter:grayscale(0);transform:scale(1.025)} @media(max-width:1100px){.about-bridge-grid,.waitlist-intro,.trust-head,.waitlist-cap-head,.case-subtitle,.article-about{grid-template-columns:1fr 1fr}.about-bridge-copy,.waitlist-intro-copy{grid-column:1/3}.about-bridge-art{grid-column:1/3;height:380px;border-left:0;border-top:1px solid var(--line)}.waitlist-intro-cta{grid-column:2}.trust-head h3{grid-column:1/3}.waitlist-cap-head .label-cell{grid-column:1}.waitlist-cap-head .copy-cell{grid-column:1/3}.waitlist-cap-head .art-cell{grid-column:1/3}.case-subtitle h3{grid-column:1/3}.article-about-art{grid-column:1}.article-about-copy{grid-column:2}.article-about-next{grid-column:1/3;border-left:0;border-top:1px solid var(--line)}} @media(max-width:680px){.about-bridge-grid,.waitlist-intro,.trust-head,.waitlist-cap-head,.case-subtitle,.article-about{grid-template-columns:1fr}.about-bridge-copy,.about-bridge-art,.waitlist-intro-copy,.waitlist-intro-cta,.trust-head h3,.waitlist-cap-head .label-cell,.waitlist-cap-head .copy-cell,.waitlist-cap-head .art-cell,.case-subtitle h3,.article-about-art,.article-about-copy,.article-about-next{grid-column:1}.about-bridge-copy{padding:36px 0}.about-bridge-copy p{font-size:38px}.waitlist-intro-copy{padding:38px 0}.waitlist-intro-copy h2{font-size:48px}.waitlist-intro-cta{border-left:0;border-top:1px solid var(--line);padding:24px 0}.trust-head{min-height:120px}.trust-head h3{padding:30px 0}.case-subtitle h3{padding:30px 0}.article-cover-full{height:420px}.article-about-art{height:300px;border-right:0}.article-about-copy{padding:32px 0}.article-about-next{padding:30px 0}} @media(max-width:1100px){:root{--header-h:88px}.frame,.grid-rails .inner{width:calc(100% - 40px)}.header-inner{grid-template-columns:1fr auto}.brand{font-size:23px}.nav{grid-column:2;display:block}.nav-links,.top-cta{display:none}.menu-btn{display:block;height:100%;padding:0 22px}.mobile-menu{position:fixed;inset:0;background:#050505;z-index:250;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;opacity:0;visibility:hidden;transition:.3s}.mobile-menu.open{opacity:1;visibility:visible}.mobile-menu a{font-size:46px;letter-spacing:-.05em}.mobile-close{position:absolute;right:28px;top:20px;background:none;border:0;font-size:34px}.hero{height:auto;min-height:850px}.hero-grid{grid-template-columns:1fr 1fr;grid-template-rows:88px 1fr 210px}.hero-copy{grid-column:1/3}.hero-title{font-size:82px}.hero-intro{font-size:22px}.hero-services{grid-column:1}.hero-thumb{grid-column:2;width:100%}.section-head,.about-body,.solutions-wrap,.quote,.enterprise,.test-head,.footer-cta,.footer,.page-hero,.service-block,.process-grid,.featured,.article-head,.article-body,.case-content,.form-layout,.waitlist-hero{grid-template-columns:1fr 1fr}.label-cell{grid-column:1}.copy-cell{grid-column:1/3}.art-cell{grid-column:1/3}.logo-strip,.cap-grid,.stats,.key-metrics{grid-template-columns:1fr 1fr}.video-grid{grid-template-columns:1fr 1fr}.about-visual{grid-column:1}.about-note{grid-column:2}.solutions-media{grid-column:1}.solution-list{grid-column:2}.quote-copy{grid-column:1}.quote-portrait{grid-column:2}.enterprise-copy{grid-column:1}.badge-cell{grid-column:auto}.case-grid{grid-template-columns:1fr}.insight-grid{grid-template-columns:1fr 1fr}.test-copy{grid-column:1/3}.test-cta{grid-column:2}.faq-item{grid-template-columns:110px 1fr 80px}.faq-icon{grid-column:1}.faq-q{grid-column:2}.faq-plus{grid-column:3}.faq-answer{grid-column:2}.footer-art{grid-column:1}.footer-copy{grid-column:2}.page-hero-copy{grid-column:1/3}.page-hero-art{display:none}.service-copy{grid-column:1}.service-art{grid-column:2}.process-nav{grid-column:1}.process-panels{grid-column:2}.process-panel{grid-template-columns:1fr}.featured-copy{grid-column:1}.featured-art{grid-column:2}.article-title{grid-column:1/3}.article-side{display:none}.article-prose{grid-column:1/3}.article-body aside,.article-next{display:none}.case-prose{grid-column:1/3}.case-side,.case-next{display:none}.contact-info{grid-column:1}.form-wrap{grid-column:2}.waitlist-copy{grid-column:1}.waitlist-art{grid-column:2}.legal-title{grid-column:1/3}.legal-prose{grid-column:1/3}} @media(max-width:680px){.frame,.grid-rails .inner{width:calc(100% - 28px)}.grid-rails .r2,.grid-rails .r3{display:none}.grid-rails .r1{left:50%}.hero{min-height:820px}.hero-grid{grid-template-columns:1fr;grid-template-rows:88px auto auto auto;padding-bottom:0}.hero-copy{grid-column:1;grid-row:2;padding-top:42px}.hero-title{font-size:57px}.hero-intro{font-size:18px}.btn{min-height:56px;padding:0 18px;font-size:14px}.hero-services{grid-column:1;grid-row:3;padding:0;height:168px;margin:48px 0 18px;--service-row:56px}.hero-thumb{grid-column:1;grid-row:4;width:100%;height:210px;margin:0}.section-head,.about-body,.solutions-wrap,.quote,.enterprise,.test-head,.footer-cta,.footer,.page-hero,.service-block,.process-grid,.featured,.article-head,.article-body,.case-content,.form-layout,.waitlist-hero,.logo-strip,.cap-grid,.stats,.key-metrics,.video-grid,.insight-grid{grid-template-columns:1fr}.label-cell,.copy-cell,.art-cell,.about-visual,.about-note,.solutions-media,.solution-list,.quote-copy,.quote-portrait,.enterprise-copy,.badge-cell,.test-copy,.test-cta,.footer-art,.footer-copy,.page-hero-copy,.service-copy,.service-art,.process-nav,.process-panels,.featured-copy,.featured-art,.article-title,.article-prose,.case-prose,.contact-info,.form-wrap,.waitlist-copy,.waitlist-art,.legal-title,.legal-prose{grid-column:1}.copy-cell{padding:35px 0}.copy-cell h2,.large-copy{font-size:42px}.logo-strip div{height:100px}.video-tile,.video-art{aspect-ratio:1.25}.about-note{padding:40px 20px}.about-note h3{font-size:43px}.stat{min-height:160px}.stat strong{font-size:56px}.solutions-media{min-height:480px}.solutions-media .sticky-media{position:relative;top:0;height:480px;min-height:0}.solution-intro{padding:36px 20px}.solution-row{padding:22px 18px}.solution-row h3{font-size:22px}.quote-copy{padding:38px 20px}.quote blockquote{font-size:39px}.quote-portrait{height:470px}.cap-card{min-height:280px}.enterprise-copy{padding:38px 20px}.enterprise-copy h3{font-size:42px}.badge-cell{min-height:310px;border-left:0;border-top:1px solid var(--line)}.case-image{height:320px}.insight-grid{grid-template-columns:1fr}.insight-card{border-right:0!important}.test-head{min-height:0}.test-copy{padding:35px 20px}.test-copy h2{font-size:42px}.test-cta{padding:0 20px 35px}.testimonial{width:320px}.faq-item{grid-template-columns:75px 1fr 60px}.faq-q{font-size:20px;padding:20px 15px}.faq-icon{padding:12px}.faq-icon img{width:50px;height:50px}.faq-answer{padding:0 15px}.footer-copy{padding:48px 20px 40px;min-height:auto;justify-content:flex-start;gap:32px}.footer-copy h2{font-size:48px;max-width:12ch}.footer-copy .btn{margin-top:4px}.footer-col{min-height:auto;border-right:0;border-bottom:1px solid var(--line)}.page-hero{min-height:620px}.page-hero-copy{padding-top:70px}.page-hero h1{font-size:56px}.page-hero p{font-size:18px}.service-copy{padding:38px 20px}.service-copy h2{font-size:46px}.service-art{min-height:420px}.process-nav{position:relative;top:0;height:auto}.process-panel{min-height:0}.process-photo{height:420px}.process-copy{padding:36px 20px}.featured{min-height:0}.featured-copy{padding:42px 20px;min-height:430px}.featured-copy h1{font-size:48px}.featured-art{height:420px}.article-title{padding:70px 0 45px}.article-title h1,.case-title h1{font-size:55px}.article-prose,.case-prose{padding:35px 0}.case-cover{height:420px}.contact-info,.form-wrap{padding:40px 20px}.waitlist-copy{padding:70px 20px}.waitlist-copy h1{font-size:58px}.waitlist-art{height:480px}.legal-title{padding:60px 0}.legal-title h1{font-size:56px}.legal-prose{padding:35px 0}.error strong{font-size:140px}.error h1{font-size:42px}} @media(prefers-reduced-motion:reduce){.service-carousel-track{animation:none!important;transform:none!important}.service-word{opacity:1!important;transform:none!important;clip-path:none!important;animation:none!important}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}} /* continuation audit: verified structural refinements */ .contact-hero-tag{position:absolute;left:0;bottom:30px;display:flex;align-items:center;gap:14px;font-size:13px;color:#bcbcb8}.contact-hero-tag .mini-art{width:64px;height:64px;overflow:hidden;border:1px solid var(--line)}.contact-hero-tag img{filter:grayscale(1)} .featured-label{font-size:13px;text-transform:lowercase;letter-spacing:.02em;color:#bebdb9;margin-bottom:20px}.featured .featured-copy .btn{margin-top:24px} .listing-grid .listing-card.hidden-item{display:none}.loadmore{display:flex;justify-content:center;padding:46px 0;border-bottom:1px solid var(--line)} .case-metrics-label.frame{width:min(var(--frame-max),calc(100% - 100px));margin:auto} .case-services-line{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);min-height:90px}.case-services-line .label{grid-column:1;padding:30px 0;color:#888;font-size:12px}.case-services-line .value{grid-column:2/5;padding:30px 48px;border-left:1px solid var(--line);font-size:15px;color:#c9c8c4} .article-date{font-size:13px;color:#a8a7a3;letter-spacing:.02em}.article-body .article-prose>p:first-child{font-size:24px;line-height:1.5;color:#d0cfca} @media(max-width:1100px){.case-services-line{grid-template-columns:1fr 1fr}.case-services-line .label{grid-column:1}.case-services-line .value{grid-column:2}.case-metrics-label.frame{width:calc(100% - 40px)}} @media(max-width:680px){.case-services-line{grid-template-columns:1fr}.case-services-line .label,.case-services-line .value{grid-column:1;padding:24px 0;border-left:0}.case-services-line .value{border-top:1px solid var(--line)}.case-metrics-label.frame{width:calc(100% - 28px)}} .case-next-strip{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);min-height:360px}.case-next-art{grid-column:1/3;overflow:hidden}.case-next-art img{filter:grayscale(1);transition:filter .65s var(--ease),transform .9s var(--ease)}.case-next-strip:hover .case-next-art img{filter:grayscale(0);transform:scale(1.025)}.case-next-copy{grid-column:3/5;border-left:1px solid var(--line);padding:42px 48px;display:flex;flex-direction:column;justify-content:flex-end}.case-next-copy a{font-size:clamp(30px,3vw,54px);line-height:1.02;letter-spacing:-.045em;margin-top:22px}.article-body:not(:has(aside)) .article-prose{grid-column:2/4} @media(max-width:1100px){.case-next-strip{grid-template-columns:1fr 1fr}.case-next-art{grid-column:1}.case-next-copy{grid-column:2}.article-body:not(:has(aside)) .article-prose{grid-column:1/3}} @media(max-width:680px){.case-next-strip{grid-template-columns:1fr}.case-next-art,.case-next-copy{grid-column:1}.case-next-art{height:330px}.case-next-copy{border-left:0;border-top:1px solid var(--line);padding:34px 0}.article-body:not(:has(aside)) .article-prose{grid-column:1}} /* ========================================================= CLEAN AUDIT V4 — verified global film grain + white curtain ========================================================= */ /* The texture is a true viewport overlay. It now sits above the fixed header and all page sections, instead of disappearing behind high-z interface layers. */ .grain{ position:fixed; inset:0; z-index:2100; pointer-events:none; opacity:1; background:none; mix-blend-mode:normal; overflow:hidden; } .grain::before, .grain::after{ content:""; position:absolute; inset:-45%; background-image:url('../img/grain.png'); background-repeat:repeat; will-change:transform; } .grain::before{ background-size:172px 172px; opacity:.08; mix-blend-mode:overlay; filter:contrast(1.22); animation:intelliGrainA .48s steps(2,end) infinite; } .grain::after{ background-size:127px 127px; opacity:.025; mix-blend-mode:multiply; filter:contrast(1.35); animation:intelliGrainB .72s steps(2,end) infinite reverse; } @keyframes intelliGrainA{ 0%{transform:translate3d(0,0,0)} 20%{transform:translate3d(-2.5%,1.8%,0)} 40%{transform:translate3d(1.6%,-2.2%,0)} 60%{transform:translate3d(2.4%,2.8%,0)} 80%{transform:translate3d(-1.7%,-1.4%,0)} 100%{transform:translate3d(.8%,1.2%,0)} } @keyframes intelliGrainB{ 0%{transform:translate3d(-1.2%,1.1%,0) scale(1.02)} 25%{transform:translate3d(1.7%,-.9%,0) scale(1.02)} 50%{transform:translate3d(-.6%,-1.8%,0) scale(1.02)} 75%{transform:translate3d(1.1%,1.6%,0) scale(1.02)} 100%{transform:translate3d(-1.5%,.4%,0) scale(1.02)} } /* White curtain preloader: five full-height panels, with the center opening first and the neighboring panels following in a mirrored stagger. */ body.is-preloading{overflow-x:hidden} .curtain-reveal{ position:fixed; top:0; bottom:0; left:var(--curtain-edge-left,0px); right:auto; width:var(--curtain-total-width,100vw); z-index:2000; pointer-events:auto; touch-action:none; display:grid; grid-template-columns:repeat(5,var(--curtain-panel-width,20vw)); grid-template-rows:100%; gap:0; background:transparent; visibility:visible; overflow:hidden; backface-visibility:hidden; -webkit-backface-visibility:hidden; } .curtain-panel{ display:block; position:relative; z-index:2; width:var(--curtain-panel-width,20vw); min-width:0; max-width:none; margin:0; padding:0; height:100%; box-sizing:border-box; background:#f0f0ed; border:0; border-right:var(--curtain-divider-width,2px) solid rgba(0,0,0,.22); transform:translate3d(0,0,0); will-change:transform; backface-visibility:hidden; -webkit-backface-visibility:hidden; } .curtain-panel:last-child{border-right:0} .curtain-reveal.is-running .curtain-panel{animation:curtainPanelOut 1.18s cubic-bezier(.76,0,.22,1) both} .curtain-reveal.is-running .curtain-panel:nth-child(3){animation-delay:0s} .curtain-reveal.is-running .curtain-panel:nth-child(2), .curtain-reveal.is-running .curtain-panel:nth-child(4){animation-delay:.08s} .curtain-reveal.is-running .curtain-panel:nth-child(1), .curtain-reveal.is-running .curtain-panel:nth-child(5){animation-delay:.16s} .curtain-reveal.is-finished{visibility:hidden;pointer-events:none} @keyframes curtainPanelOut{ 0%{transform:translate3d(0,0,0)} 100%{transform:translate3d(0,-101.5%,0)} } /* Keep the grain visible on light UI states as well. */ .top-cta, .btn.light, .solution-row:hover, .solution-row.active, .cap-card:hover, .faq-item.open, .process-btn.active, .process-btn:hover{ isolation:auto; } @media (max-width:680px){ .grain::before{background-size:150px 150px;opacity:.07} .grain::after{background-size:112px 112px;opacity:.02} } @media(prefers-reduced-motion:reduce){.service-carousel-track{animation:none!important;transform:none!important}.service-word{opacity:1!important;transform:none!important;clip-path:none!important;animation:none!important} .grain::before,.grain::after{animation:none!important} .curtain-reveal{display:none!important} body.is-preloading{overflow:auto} } /* AUDIT V4.1 — reduced animated grain intensity per user request */ /* ========================================================= CLEAN AUDIT V4.2 — stable page geometry / no entry reflow ========================================================= */ /* Reserve the browser scrollbar gutter from the very first paint. This prevents the centered 4-column grid from changing width when the white curtain finishes and scrolling becomes available. */ html{ overflow-y:scroll; scrollbar-gutter:stable; } /* The curtain should never change the document width. Scroll is blocked in JavaScript while it is visible instead of removing the scrollbar with overflow:hidden. */ body.is-preloading{ overflow-x:hidden; overflow-y:visible; } /* The same stable gutter also prevents modal/mobile-menu locks from producing a horizontal jump on browsers that support the property. */ body.lock{ overflow-x:hidden; } /* Give the browser stable sizing information for media while files decode. Container dimensions remain authoritative. */ img,video{ max-width:100%; } /* Prevent browser scroll anchoring from moving the viewport when delayed media or accordion content finishes initializing. */ body{ overflow-anchor:none; } /* ========================================================= CLEAN AUDIT V4.3 — curtain panel seams removed ========================================================= */ /* CLEAN AUDIT V4.5 — entry starts immediately with curtain, no initial white hold */ /* CLEAN AUDIT V4.6 — curtain standardized globally with smoother motion on all pages */ /* CLEAN AUDIT V4.7 — hero service labels reveal upward after the curtain */ /* CLEAN AUDIT V4.8 — hero service labels converted to a seamless infinite vertical carousel */ /* AUDIT V4.8.1 — improved spacing between final CTA text and button, especially on mobile */ /* DEANGELIS FILMES — conteúdo PT-BR */ .brand{white-space:nowrap} .brand sup{font-size:7px;letter-spacing:.14em;margin-left:6px;opacity:.68} .badge-word{width:68%;aspect-ratio:1;border:1px solid rgba(255,255,255,.22);border-radius:50%;display:grid;place-items:center;font-size:clamp(17px,1.4vw,28px);letter-spacing:.12em;color:#d8d7d3;background:radial-gradient(circle at 42% 32%,rgba(255,255,255,.08),transparent 38%),#080808;transition:background .35s,color .35s,transform .45s var(--ease)} .badge-cell:hover .badge-word{background:#efefec;color:#090909;transform:scale(1.025)} @media(max-width:1100px){.brand sup{display:none}.nav-links{gap:22px}.nav-links a{font-size:14px}} @media(max-width:680px){.brand{font-size:21px}.footer-copy h2{max-width:13ch}.badge-word{width:58%}} .work-type{font-size:clamp(15px,1.15vw,21px);letter-spacing:.08em;text-transform:uppercase;color:#b9b8b4;font-weight:400}.logo-strip div:hover .work-type{color:#fff} /* ========================================================= DEANGELIS QA V2 — layout / buttons / images / responsive ========================================================= */ /* Header CTA: Portuguese label must never wrap or collapse. */ .top-cta{ white-space:nowrap; line-height:1.1; padding:0 18px; gap:16px; text-align:center; min-width:0; } .nav{grid-template-columns:minmax(0,1fr) 220px} .nav-links{min-width:0} /* Buttons should keep their geometry without clipping long PT-BR labels. */ .btn{ max-width:100%; white-space:nowrap; flex-shrink:0; } .btn-row{flex-wrap:wrap} /* Featured/listing pages must reserve the fixed header, just like other page heroes. */ .featured{ position:relative; padding-top:var(--header-h); } .featured-mark{ top:calc(var(--header-h) + 28px); } /* The final CTA is an image block, not an empty gradient. */ .footer-art.dark-atmosphere img{ display:block; position:relative; z-index:0; opacity:.38; filter:grayscale(1) contrast(.85) brightness(.72); transform:scale(1.02); } .footer-art.dark-atmosphere:after{ content:''; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(135deg,rgba(0,0,0,.14),rgba(0,0,0,.68)); } .footer-art.dark-atmosphere:before{z-index:2;pointer-events:none} .footer-art.dark-atmosphere:hover img{filter:grayscale(0) contrast(.9) brightness(.75);transform:scale(1.045)} /* Medium desktop: Portuguese navigation needs more room. */ @media(max-width:1500px) and (min-width:1251px){ .nav{grid-template-columns:minmax(0,1fr) 190px} .nav-links{gap:19px;padding-right:18px} .nav-links a{font-size:14px} .top-cta{font-size:14px;gap:12px;padding:0 14px} } /* Switch to compact navigation before desktop labels can collide. */ @media(max-width:1250px) and (min-width:1101px){ :root{--header-h:96px} .frame,.grid-rails .inner{width:calc(100% - 56px)} .header-inner{grid-template-columns:1fr auto} .nav{grid-column:2;display:block} .nav-links,.top-cta{display:none} .menu-btn{display:block;height:100%;padding:0 24px} .mobile-menu{position:fixed;inset:0;background:#050505;z-index:250;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;opacity:0;visibility:hidden;transition:.3s} .mobile-menu.open{opacity:1;visibility:visible} .mobile-menu a{font-size:46px;letter-spacing:-.05em} .mobile-close{position:absolute;right:28px;top:20px;background:none;border:0;font-size:34px} } /* Tablet forms: two narrow columns are not usable for Portuguese copy. */ @media(max-width:900px){ .form-layout{grid-template-columns:1fr!important} .contact-info,.form-wrap{grid-column:1!important} .form-wrap{border-left:0;border-top:1px solid var(--line)} .contact-info h2{font-size:clamp(42px,7vw,58px);overflow-wrap:anywhere} } @media(max-width:680px){ /* Listing grids were still two columns on phones. */ .listing-grid{grid-template-columns:1fr!important} .listing-grid .case-card,.listing-grid .insight-card{border-right:0!important;border-bottom:1px solid var(--line)} .listing-grid .case-body,.listing-grid .insight-body{min-height:0;padding:28px 20px 34px} .listing-grid .case-body h3,.listing-grid .insight-body h3{font-size:31px;line-height:1.06;overflow-wrap:anywhere} .listing-grid .meta{gap:12px;flex-wrap:wrap;margin-bottom:28px} .listing-grid .metrics{gap:24px;flex-wrap:wrap} /* Featured mark stays clear of the heading on mobile. */ .featured-mark{left:auto;right:20px;top:calc(var(--header-h) + 22px);width:48px;height:48px} .featured-copy{padding:48px 20px 42px;min-height:470px} .featured-copy h1{font-size:clamp(40px,11vw,48px);overflow-wrap:anywhere} /* Specific selectors from the desktop art layout otherwise win over generic mobile rules. */ .test-head.has-art .test-art, .test-head.has-art .test-copy, .test-head.has-art .test-cta{grid-column:1!important} .test-head.has-art .test-art{height:300px;border-right:0;border-bottom:1px solid var(--line)} .test-head.has-art .test-copy{padding:34px 20px} .test-head.has-art .test-copy h2{font-size:40px;overflow-wrap:anywhere} .test-head.has-art .test-cta{padding:0 20px 34px} /* Legal pages need a real one-column grid on phones. */ .legal-wrap{grid-template-columns:1fr!important} .legal-title,.legal-prose{grid-column:1!important} .legal-title h1{font-size:clamp(44px,13vw,56px);overflow-wrap:anywhere} /* Keep all button labels inside the frame. */ .btn{white-space:normal;line-height:1.15;min-width:0} .btn .star{flex:none} } @media(min-width:681px) and (max-width:1100px){ /* Legal grid itself was never converted from 4 columns at tablet size. */ .legal-wrap{grid-template-columns:1fr 1fr!important} .legal-title,.legal-prose{grid-column:1/3!important} .legal-title h1{font-size:clamp(62px,9vw,82px);overflow-wrap:anywhere} } /* Tablet testimonial header: preserve a clean two-column composition. */ @media(min-width:681px) and (max-width:1100px){ .test-head.has-art{grid-template-columns:1fr 1fr!important} .test-head.has-art .test-art{grid-column:1!important;grid-row:1/4;border-right:1px solid var(--line);min-height:460px} .test-head.has-art .label-cell{grid-column:2!important;grid-row:1;padding:32px 28px 0} .test-head.has-art .test-copy{grid-column:2!important;grid-row:2;padding:24px 28px} .test-head.has-art .test-copy h2{font-size:clamp(38px,5vw,52px);overflow-wrap:anywhere} .test-head.has-art .test-cta{grid-column:2!important;grid-row:3;padding:0 28px 32px} } /* ========================================================= DEANGELIS QA V5 — TRUE header blend over scrolling content ========================================================= The blend is applied to the fixed header as a single composited group. This avoids child blend modes being trapped inside the header's own fixed/z-index stacking context. White source pixels invert the backdrop; black source pixels preserve it, producing the complementary colors seen in the reference when the header crosses photography and light sections. */ .site-header{ background:transparent!important; mix-blend-mode:difference; isolation:auto; } .header-inner{ background:transparent!important; } .site-header .brand, .site-header .nav-links a, .site-header .menu-btn{ color:#fff; mix-blend-mode:normal; } .site-header .top-cta{ background:#fff; color:#000; border-left-color:rgba(255,255,255,.34); mix-blend-mode:normal; } .site-header .top-cta:hover{ background:#fff; color:#000; } .site-header .nav-links a:hover{opacity:.68} /* The fullscreen mobile menu is a sibling of the header, so it does not inherit the difference blend and keeps normal, readable colors. */ .mobile-menu, .mobile-menu *{ mix-blend-mode:normal; } @supports not (mix-blend-mode:difference){ .site-header{mix-blend-mode:normal} .site-header .brand, .site-header .nav-links a, .site-header .menu-btn{color:#f3f3f0} .site-header .top-cta{background:#efefec;color:#090909} } /* ========================================================= V6 — seamless curtain + stable anchor navigation ========================================================= */ html{overflow-anchor:none} [id]{scroll-margin-top:calc(var(--header-h) + 18px)} .curtain-reveal,.page-wipe{backface-visibility:hidden;-webkit-backface-visibility:hidden} /* V7 — one shared outgoing curtain for every internal cross-page navigation */ /* V8 — real vertical curtain panels: separators are part of each panel from first paint */ /* V8.3 — deterministic curtain lifecycle: no pseudo-overlay swap, real panel borders, click lock, cache-safe reset. */ /* V8.6 — curtain panels use DPR-aligned integer device pixels. Any remainder is split only between viewport edges. */ /* V8.7 — curtain axis lock: no horizontal geometry changes during motion. */ html.is-navigating{overflow-y:scroll;scrollbar-gutter:stable}