/* Brand refinement and interaction layer */
:root { --brand-blue:#078fea; --brand-aqua:#078fea; --brand-ice:#bcecff; --brand-soft:#e9f7fd; }

html { scroll-padding-top:24px; }
a:focus-visible { outline:2px solid var(--brand-aqua); outline-offset:5px; }

.brand { width:112px; height:42px; padding:0; overflow:visible; background:transparent; border-radius:0; }
.brand img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 8px 20px rgba(7,143,234,.2)); }
.brand:hover { transform:translateY(-3px) rotate(-1deg); }
.nav-links a { position:relative; padding:8px 0; }
.nav-links a:after { content:''; position:absolute; height:1px; left:0; right:0; bottom:2px; transform:scaleX(0); transform-origin:right; background:var(--brand-aqua); transition:transform .35s cubic-bezier(.16,1,.3,1); }
.nav-links a:hover:after { transform:scaleX(1); transform-origin:left; }
.nav-cta { transition:color .25s ease; }
.nav-cta:hover { color:var(--brand-aqua); }
.nav-cta:hover b,.contact-link:hover b { transform:rotate(45deg) scale(1.1); }
.nav-cta b,.contact-link b { transition:transform .3s cubic-bezier(.16,1,.3,1), background .3s ease; }

.hero { background:#050505; isolation:isolate; }
.hero:before { content:''; position:absolute; z-index:1; width:46vw; height:46vw; min-width:500px; min-height:500px; right:-21vw; top:-17vw; border:1px solid rgba(7,143,234,.37); border-radius:50%; box-shadow:0 0 0 68px rgba(7,143,234,.06),0 0 0 137px rgba(7,143,234,.03); animation:orb-breathe 7s ease-in-out infinite; pointer-events:none; }
.hero-image { will-change:transform; transform:translate3d(0,var(--hero-shift,0px),0) scale(1.06); }
.hero-wash { background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.73) 28%,rgba(0,0,0,.13) 72%,rgba(0,0,0,.38) 100%),linear-gradient(0deg,rgba(0,0,0,.78) 0%,transparent 49%); }
.hero-pulse { position:absolute; z-index:1; left:49%; top:60%; width:11px; height:11px; border-radius:50%; background:var(--brand-aqua); box-shadow:0 0 0 0 rgba(7,143,234,.62); animation:signal 2.4s infinite; }
.hero .accent { text-shadow:0 0 30px rgba(7,143,234,.12); }
.circle-link { position:relative; overflow:hidden; }
.circle-link:before { content:''; position:absolute; inset:0; z-index:-1; border-radius:50%; background:var(--brand-aqua); transform:scale(0); transition:transform .45s cubic-bezier(.16,1,.3,1); }
.circle-link:hover { color:var(--ink); background:transparent; }
.circle-link:hover:before { transform:scale(1); }

@keyframes hero-enter { from { opacity:0; transform:translate3d(0,0,0) scale(1.15); } to { opacity:1; transform:translate3d(0,var(--hero-shift,0px),0) scale(1.06); } }
@keyframes orb-breathe { 50% { transform:scale(1.09); border-color:rgba(7,143,234,.6); } }
@keyframes signal { 70% { box-shadow:0 0 0 20px rgba(7,143,234,0); } 100% { box-shadow:0 0 0 0 rgba(7,143,234,0); } }

.text-link { position:relative; padding-bottom:5px; }
.text-link:after { content:''; position:absolute; bottom:0; left:0; width:calc(100% - 25px); height:1px; background:currentColor; transform-origin:left; transition:transform .35s ease; }
.text-link:hover:after { transform:scaleX(.35); }
.orbit-mark { border-color:rgba(7,143,234,.34); }
.manifesto { background:#050505; }
.manifesto-number { -webkit-text-stroke-color:rgba(7,143,234,.19); }

.service-row { cursor:default; }
.service-row:before { background:var(--brand-blue); }
.service-row.active:before { background:var(--deep-blue); }
.service-jump { width:46px; height:46px; justify-self:end; display:grid; place-items:center; border:1px solid rgba(255,255,255,.45); border-radius:50%; color:inherit; background:transparent; font-size:22px; transition:background .25s,color .25s,transform .35s cubic-bezier(.16,1,.3,1); }
.service-row:hover .service-jump,.service-row.active .service-jump { color:var(--ink); border-color:var(--brand-aqua); background:var(--brand-aqua); }
.service-jump:hover { transform:rotate(45deg) scale(1.12); }
.service-row:hover h3 { transform:translateX(8px); }
.service-row h3 { transition:transform .35s cubic-bezier(.16,1,.3,1); }

.featured-work { padding:108px 0 128px; overflow:hidden; background:var(--brand-soft); }
.featured-head { display:flex; justify-content:space-between; gap:70px; padding:88px 0 72px 9.8%; }
.featured-head h2 { margin:0; font-size:clamp(44px,5.5vw,84px); line-height:.98; letter-spacing:-.07em; }
.featured-head h2 em { font-family:var(--serif); font-weight:500; color:var(--brand-blue); }
.featured-head p { max-width:300px; margin:20px 0 0; font-size:14px; line-height:1.74; }
.case-grid { display:grid; grid-template-columns:1.28fr .72fr; gap:15px; align-items:start; }
.case-card { position:relative; display:block; color:#fff; overflow:hidden; min-height:535px; background:#071012; isolation:isolate; }
.case-card.case-tall { min-height:625px; margin-top:80px; }
.case-media { position:absolute; inset:-7%; z-index:-2; overflow:hidden; background:#0a1012; }
.case-media:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.02) 73%); transition:opacity .5s ease; }
.case-media img { width:100%; height:100%; object-fit:cover; transform:scale(1.07) translate3d(0,var(--media-shift,0px),0); transition:transform .9s cubic-bezier(.16,1,.3,1),filter .6s ease; will-change:transform; }
.case-tall .case-media img { object-position:center; }
.case-content { position:absolute; inset:auto 30px 27px; display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
.case-content span { font:10px var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--brand-aqua); }
.case-content h3 { margin:0; font-size:clamp(28px,3vw,45px); line-height:.98; letter-spacing:-.06em; }
.case-content b { padding-top:7px; font-size:12px; letter-spacing:-.01em; }
.case-content b i { display:inline-grid; width:23px; height:23px; margin-left:8px; place-items:center; border-radius:50%; background:var(--brand-aqua); color:var(--ink); font-size:14px; font-style:normal; transition:transform .3s ease; }
.case-card:hover .case-media:after { opacity:.65; }
.case-card:hover .case-media img { transform:scale(1.16) translate3d(0,var(--media-shift,0px),0); filter:saturate(1.12); }
.case-card:hover .case-content b i { transform:rotate(45deg); }
.case-card:after { content:''; position:absolute; pointer-events:none; inset:14px; border:1px solid rgba(255,255,255,0); transition:border-color .4s ease; }
.case-card:hover:after { border-color:rgba(255,255,255,.45); }

.metric-card { transition:transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s ease; }
.metric-card:hover { transform:translateY(-9px); box-shadow:0 24px 45px rgba(5,5,5,.12); }
.metric-card:hover .metric-orbit { animation:spin 5s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

.work-band { min-height:840px; position:relative; }
.process-track { transform:translate3d(var(--track-shift,0px),0,0); will-change:transform; }
.process-card { transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s ease; }
.process-card:hover { transform:translateY(-14px) rotate(-1.2deg); box-shadow:0 21px 34px rgba(5,5,5,.16); }
.process-card:hover>i { transform:rotate(45deg); }
.process-card>i { transition:transform .35s cubic-bezier(.16,1,.3,1); }
.process-card.ink:hover { box-shadow:0 21px 40px rgba(7,143,234,.35); }

.sector-cloud span { cursor:default; }
.sector-cloud span:nth-child(3n+2):hover { background:var(--brand-blue); }
.sector-cloud span:nth-child(3n):hover { background:var(--brand-aqua); color:var(--ink); }
.contact { background:var(--brand-blue); }
.contact:after { content:''; position:absolute; width:380px; height:380px; left:-190px; bottom:-210px; border:1px solid rgba(7,143,234,.66); border-radius:50%; box-shadow:0 0 0 55px rgba(7,143,234,.08),0 0 0 110px rgba(7,143,234,.04); }
.contact-link { transition:color .3s ease; }.contact-link:hover { color:var(--brand-aqua); }
.contact-foot a:not(:last-child) { justify-self:start; text-decoration:none; transition:color .3s ease; }
.contact-foot a:not(:last-child):hover { color:var(--brand-aqua); }

.reveal-scale { opacity:0; transform:scale(.94) translateY(22px); transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1); }
.reveal-scale.visible { opacity:1; transform:none; }
.tilt-card.visible { transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .22s ease,opacity .9s cubic-bezier(.16,1,.3,1); }

@media (max-width:800px) {
  .brand { width:94px; height:35px; }
  .hero:before { right:-340px; top:80px; }
  .hero-pulse { left:auto; right:23%; top:38%; }
  .featured-work { padding:68px 0 78px; }
  .featured-head { padding:55px 0 45px; display:block; }
  .featured-head p { margin-top:28px; }
  .case-grid { grid-template-columns:1fr; }
  .case-card,.case-card.case-tall { min-height:425px; margin:0; }
  .case-content { inset:auto 20px 20px; }
  .case-content h3 { font-size:31px; }
  .work-band { min-height:auto; }
  .process-wrap { overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .process-wrap::-webkit-scrollbar { display:none; }
  .process-track { transform:none!important; }
  .process-card { scroll-snap-align:start; }
  .process-card:hover { transform:none; box-shadow:none; }
  .service-jump { width:40px; height:40px; }
}

@media (prefers-reduced-motion:reduce) {
  .hero:before,.hero-pulse,.metric-card:hover .metric-orbit { animation:none!important; }
  .process-track,.case-media img { transform:none!important; }
}
