/* The original identity becomes a dimensional, living network. */
.dimensional-logo{width:180px!important;height:79px!important;object-fit:contain;filter:drop-shadow(0 3px 2px #00171e80)}
.header.is-scrolled .dimensional-logo{transform:scale(.9)}
.hero{padding-top:34px;background-position:center;background-image:linear-gradient(90deg,#031f29cc,#0326308a 58%,#032630a3),var(--surface-image)}
.hero-grid{grid-template-columns:1fr 1.13fr;gap:30px;align-items:center}
.hero-copy{padding-bottom:30px}
.hero-lines{display:none}
.brand-stage{position:relative;width:100%;aspect-ratio:640/540;min-height:480px;isolation:isolate;perspective:1000px;margin:0 0 24px;--tilt-x:0deg;--tilt-y:0deg}
.brand-halo{position:absolute;inset:12% 0% 8%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#278d7940 0%,#11645620 40%,transparent 72%);filter:blur(18px);animation:network-breathe 7s ease-in-out infinite alternate}
.connection-field{position:absolute;inset:0;width:100%;height:100%;overflow:visible;opacity:.95}
.connection-wires path{stroke-width:1;opacity:.32;stroke-dasharray:100;animation:connect-draw 1.8s cubic-bezier(.16,1,.3,1) both}
.connection-wires path:nth-child(even){animation-delay:.3s}
.connection-signals path{stroke:#c6ffb7;stroke-width:2;stroke-dasharray:6 94;stroke-dashoffset:100;filter:drop-shadow(0 0 4px #79e2b1);animation:signal-flow 4.8s linear infinite;animation-delay:var(--delay)}
.connection-points circle{filter:drop-shadow(0 0 5px #5bc9b54d)}
.node-rings circle{stroke-width:.65;opacity:.23;transform-box:fill-box;transform-origin:center;animation:node-ring 4.8s ease-out infinite}
.node-rings circle:nth-child(2){animation-delay:-1.3s}.node-rings circle:nth-child(3){animation-delay:-2.6s}.node-rings circle:nth-child(4){animation-delay:-.7s}
.concept-node{position:absolute;z-index:3;display:flex;align-items:center;gap:13px;font-size:12px;letter-spacing:.06em;color:#d6e8df;white-space:nowrap;animation:concept-arrive 1.1s var(--ease-out) both}
.concept-ball{flex:none;display:block;width:25px;height:25px;border-radius:50%;background:radial-gradient(circle at 30% 22%,#e8ffe3 0%,#a5f09a 16%,#43b482 44%,#13795f 74%,#074a43);border:1px solid #baf8c777;box-shadow:inset 0 1px 2px #fff9,1px 3px 0 #033d39,0 0 21px #5acda02b}
.node-knowledge{left:calc(16.25% - 12px);top:calc(19.26% - 12px)}
.node-people{left:calc(79.68% - 12px);top:calc(19.81% - 12px);animation-delay:.2s;flex-direction:column;gap:12px}
.node-ideas{left:calc(16.71% - 12px);top:calc(77.59% - 12px);animation-delay:.35s;flex-direction:row-reverse;transform:translateX(calc(-100% + 25px))}
.node-ideas .concept-ball{background:radial-gradient(circle at 30% 22%,#d8fff4,#72dcc9 18%,#1ca89d 47%,#075d6b 78%);border-color:#94e5d980}
.node-future{left:calc(76.875% - 12px);top:calc(79.44% - 12px);animation-delay:.5s;flex-direction:column;gap:12px}
.node-future .concept-ball{background:radial-gradient(circle at 30% 22%,#e3f9ff,#75d4e8 18%,#288fc3 49%,#0c4f80 78%);border-color:#74bde080}
.brand-core{position:absolute;inset:25% 1% 22%;display:flex;align-items:center;justify-content:center;z-index:2;transform-style:preserve-3d;transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:transform 1s var(--ease-out)}
.brand-core>img{width:100%;height:auto;max-height:100%;object-fit:contain;filter:drop-shadow(0 18px 12px #00191d9e);animation:brand-materialize 1.65s var(--ease-out) .15s both,brand-levitate 7s ease-in-out 1.8s infinite;transform-origin:center;will-change:transform}
.brand-reflection{position:absolute;left:18%;right:0;bottom:10%;height:15%;border-radius:50%;background:#9be0c41a;filter:blur(22px);z-index:-1;animation:network-breathe 7s ease-in-out infinite alternate}
.stage-caption{position:absolute;bottom:0;left:14%;right:2%;display:flex;justify-content:space-between;gap:15px;align-items:center;border-top:1px solid #8ac3b72b;padding-top:17px;color:#a9c7c1;font-size:12px;letter-spacing:.03em}
.motion-toggle{background:#082c347a;color:#b4d1c9;font-size:11px;border:1px solid #8dbaad36;border-radius:30px;display:inline-flex;align-items:center;gap:8px;padding:7px 11px;line-height:1.2;cursor:pointer;transition:background .2s}
.motion-toggle:hover{background:#15473f;color:white}
.motion-icon{width:9px;height:10px;border-left:2px solid currentColor;border-right:2px solid currentColor;display:block}
.motion-toggle[aria-pressed=true] .motion-icon{width:0;height:0;border:5px solid transparent;border-left:7px solid currentColor;border-right:0}
.brand-stage.is-paused *, .brand-stage.is-paused *:before,.brand-stage.is-paused *:after{animation-play-state:paused!important}
.brand-stage.is-offscreen *{animation-play-state:paused!important}
.branded-surface{position:relative;isolation:isolate;overflow:hidden}
.branded-surface>.wrap{position:relative;z-index:1}
.brand-watermark{position:absolute;pointer-events:none;z-index:0;width:440px;height:auto;opacity:.055}
.impact-watermark{left:-110px;bottom:-185px;width:580px;transform:rotate(-14deg);opacity:.06}
.cta-watermark{width:510px;right:10%;top:-130px;opacity:.055;filter:brightness(0);transform:rotate(13deg)}
.page-watermark{right:-110px;top:-135px;width:540px;opacity:.06;transform:rotate(12deg)}
.hero-bottom{margin-top:10px}
@keyframes connect-draw{from{stroke-dashoffset:100;opacity:0}to{stroke-dashoffset:0;opacity:.32}}
@keyframes signal-flow{0%{stroke-dashoffset:100;opacity:0}8%{opacity:.9}75%{opacity:.9}100%{stroke-dashoffset:0;opacity:0}}
@keyframes node-ring{0%{transform:scale(.7);opacity:.4}80%,100%{transform:scale(1.55);opacity:0}}
@keyframes network-breathe{from{opacity:.5;transform:scale(.92)}to{opacity:1;transform:scale(1.1)}}
@keyframes brand-materialize{0%{opacity:0;filter:blur(12px) drop-shadow(0 10px 8px #00191d8f);transform:translateY(20px) scale(.91) rotateX(12deg)}100%{opacity:1;filter:blur(0) drop-shadow(0 18px 12px #00191d9e);transform:translateY(0) scale(1) rotateX(0)}}
@keyframes brand-levitate{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes concept-arrive{from{opacity:0;filter:blur(4px)}to{opacity:1;filter:blur(0)}}
@media(min-width:1151px){.hero h1{font-size:clamp(3.75rem,5.1vw,5rem)}.hero-grid{gap:26px}.brand-stage{min-height:540px}}
@media(min-width:801px) and (max-width:1150px){.brand-stage{min-height:430px}.hero h1{font-size:clamp(2.8rem,4.9vw,3.7rem)}.hero-grid{gap:10px}.concept-node{font-size:10px}.stage-caption{left:9%;font-size:10px}.hero-copy>.eyebrow{font-size:10px}}
@media(max-width:800px){.hero{padding-top:35px}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:5px}.brand-stage{width:100%;max-width:620px;min-height:0;margin:0 auto 24px;aspect-ratio:640/540}.hero-bottom{margin-top:0}.dimensional-logo{width:154px!important;height:68px!important}.concept-node{font-size:12px}.brand-watermark{opacity:.045}.cta-watermark{right:-130px;top:-20px}.page-watermark{right:-150px;top:-20px;width:400px}.impact-watermark{left:auto;right:-210px;bottom:-120px}}
@media(max-width:480px){.hero{padding-top:30px}.hero h1{font-size:clamp(2.55rem,10.6vw,3.05rem)}.hero-copy{padding-bottom:5px}.brand-stage{width:calc(100% + 14px);max-width:none;margin-left:-7px;margin-bottom:16px;aspect-ratio:640/570}.concept-node{font-size:10px;gap:9px;letter-spacing:.025em}.concept-ball{width:20px;height:20px}.node-knowledge{left:calc(16.25% - 10px);top:calc(19.26% - 10px)}.node-people{left:calc(79.68% - 10px);top:calc(19.81% - 10px)}.node-ideas{left:calc(16.71% - 10px);top:calc(77.59% - 10px);transform:translateX(calc(-100% + 20px))}.node-future{left:calc(76.875% - 10px);top:calc(79.44% - 10px)}.brand-core{inset:25% 0 22%}.stage-caption{left:6%;right:2%;bottom:-7px;padding-top:13px;font-size:10px}.motion-toggle{font-size:10px;padding:7px 9px}.hero-bottom{padding-top:20px}.hero-bottom .tags{gap:8px 13px}.header .dimensional-logo{width:150px!important}}
@media(prefers-reduced-motion:reduce){.brand-stage *,.brand-stage *:before,.brand-stage *:after{animation:none!important;transition:none!important}.connection-signals{display:none}.connection-wires path{stroke-dashoffset:0;opacity:.32}.brand-core{transform:none!important}.brand-core>img{opacity:1;filter:drop-shadow(0 18px 12px #00191d9e)}.motion-toggle{display:none}.node-rings circle{opacity:.2;transform:none}}
/* Anchor labels independently so every sphere sits exactly on its connection. */
.concept-node{display:block;width:25px;height:25px}
.concept-node>span:last-child{position:absolute;left:38px;top:50%;transform:translateY(-50%)}
.node-people>span:last-child,.node-future>span:last-child{left:50%;top:39px;transform:translateX(-50%)}
.node-ideas{transform:none}
.node-ideas>span:last-child{left:auto;right:38px}
@media(max-width:480px){.brand-stage{aspect-ratio:640/540}.concept-node{width:20px;height:20px}.concept-node>span:last-child{left:30px}.node-people>span:last-child,.node-future>span:last-child{left:50%;top:31px}.node-ideas{transform:none}.node-ideas>span:last-child{left:auto;right:30px}}

/* Real-time extruded logo, physical materials and three-dimensional connections. */
.webgl-layer{position:absolute;inset:0 0 48px;z-index:4;pointer-events:none;opacity:0;transition:opacity 1.2s}
.webgl-layer>canvas{display:block;width:100%;height:100%;border:0;outline:0}
.webgl-ready .webgl-layer{opacity:1}
.webgl-ready .brand-core,.webgl-ready .connection-field,.webgl-ready .concept-node,.webgl-ready .brand-halo{visibility:hidden}
.webgl-label{position:absolute;display:block;transform:translateX(-50%);color:#c2dad1;font:12px/1.3 'DM Sans',sans-serif;letter-spacing:.035em;white-space:nowrap;text-shadow:0 1px 5px #001e28a0}
.brand-stage .stage-caption{z-index:5}
@media(max-width:800px){.webgl-label{font-size:11px}.webgl-layer{inset:-5px -4px 43px}}
@media(max-width:480px){.webgl-label{font-size:10px;letter-spacing:.01em}.webgl-layer{inset:-10px -7px 33px}.brand-stage.webgl-ready{aspect-ratio:640/570}}
@media(prefers-reduced-motion:reduce){.webgl-layer{transition:none}}
.webgl-layer>svg{display:block;width:100%;height:100%;overflow:visible;background:transparent!important}
/* Layered dimensional fallback for browsers without a graphics context. */
.brand-depth{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.depth-slice{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transform:translate3d(calc(var(--slice) * -.65px),calc(var(--slice) * .3px),calc(var(--slice) * -1.7px))}
.depth-slice img{width:100%;height:auto;max-height:100%;object-fit:contain;filter:brightness(.26) saturate(.6)}
.brand-specular{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 5%,#d9ffe566,transparent 43%);mask-image:url('/assets/logo-3d.webp');mask-position:center;mask-size:contain;mask-repeat:no-repeat;mix-blend-mode:screen;opacity:0}
.webgl-ready .brand-depth,.webgl-ready .brand-specular{display:none}
.enhanced-fallback .brand-core{inset:22% -3% 18%;transform-style:preserve-3d;animation:dimensional-orbit 11s ease-in-out infinite;filter:drop-shadow(10px 20px 15px #00191d70)}
.enhanced-fallback .brand-core>img{animation:none!important;transform:translateZ(3px);filter:drop-shadow(1px 2px 1px #052a3970)}
.enhanced-fallback .connection-field{transform:rotateX(13deg) rotateY(-7deg) translateZ(-20px);transform-origin:center}
.enhanced-fallback .brand-specular{opacity:.8;animation:studio-sweep 11s ease-in-out infinite}
@keyframes dimensional-orbit{0%,100%{transform:translateY(0) rotateX(calc(8deg + var(--tilt-x))) rotateY(calc(-16deg + var(--tilt-y)))}50%{transform:translateY(-7px) rotateX(calc(2deg + var(--tilt-x))) rotateY(calc(4deg + var(--tilt-y)))}}
@keyframes studio-sweep{0%,100%{background-position:-60px 0;opacity:.45}50%{background-position:80px 0;opacity:.9}}
@media(prefers-reduced-motion:reduce){.enhanced-fallback .brand-core{animation:none;transform:rotateX(5deg) rotateY(-12deg)}.brand-specular{animation:none!important}}
