/* DEEPDELL UX SYSTEM v2 — dark-only / interactive / 3D motion */
:root{--ux-bg:#011434;--ux-bg-2:#021c3d;--ux-surface:#062247;--ux-surface-2:#082b52;--ux-text:#fff;--ux-muted:#9db3ca;--ux-line:rgba(137,249,253,.16);--ux-cyan:#20f3fb;--ux-aqua:#0ac7e6;--ux-blue:#0a7fdb;--ux-shadow:0 24px 80px rgba(0,0,0,.24);--ux-radius:8px;color-scheme:dark}
html{background:var(--ux-bg);scroll-behavior:smooth}html,body{min-height:100%;overflow-x:hidden}body{background:var(--ux-bg)!important;color:var(--ux-text)!important}body:before{background:radial-gradient(circle at 78% 5%,rgba(10,127,219,.10),transparent 27%),radial-gradient(circle at 50% 45%,rgba(10,199,230,.035),transparent 38%)!important;pointer-events:none}
.site-header{isolation:isolate;background:rgba(1,20,52,.88)!important;border-bottom:1px solid var(--ux-line)!important;backdrop-filter:blur(18px)}
.brand{display:flex!important;align-items:center!important;width:172px!important;height:auto!important}.brand:after,.footer-brand:after{display:none!important}.brand img{display:block!important;width:170px!important;height:auto!important;max-height:54px!important;object-fit:contain!important}.nav a,.header-cta{color:#fff!important}.header-cta{border-color:rgba(32,243,251,.38)!important}.header-cta:hover{border-color:var(--ux-cyan)!important;background:rgba(32,243,251,.07)!important;color:#fff!important}.header-tools{display:flex;align-items:center;gap:10px;margin-left:auto}.theme-toggle{display:none!important}
.scroll-progress{position:fixed;top:0;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--ux-aqua),var(--ux-cyan));z-index:1000;box-shadow:0 0 14px rgba(32,243,251,.45)}
#site-loader{position:fixed;inset:0;z-index:2000;background:#011434;display:grid;place-items:center;transition:opacity .45s ease,visibility .45s ease;animation:loaderAutoHide 2.2s ease forwards} .loader-inner{text-align:center}.loader-orbit{width:74px;height:74px;border:1px solid rgba(32,243,251,.35);border-radius:50%;position:relative;animation:loaderSpin 2s linear infinite}.loader-orbit:before,.loader-orbit:after{content:'';position:absolute;border-radius:50%;inset:11px;border:2px solid transparent;border-top-color:#20f3fb;transform:rotate(30deg)}.loader-orbit:after{inset:22px;border-top-color:#0ac7e6;transform:rotate(150deg)}.loader-core{position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);box-shadow:0 0 20px #20f3fb}.loader-label{display:block;margin-top:18px;color:#89f9fd;font:10px 'DM Mono',monospace;letter-spacing:.2em}.loader-done{opacity:0!important;visibility:hidden!important;pointer-events:none!important}@keyframes loaderSpin{to{transform:rotate(360deg)}}@keyframes loaderAutoHide{0%,78%{opacity:1;visibility:visible;pointer-events:auto}100%{opacity:0;visibility:hidden;pointer-events:none}}
/* Typography + brand palette */
h1,h2,h3{color:var(--ux-text)!important}h1 em,h2 span{color:var(--ux-cyan)!important;background:none!important;-webkit-text-fill-color:var(--ux-cyan)!important}.section-kicker,.eyebrow,.ai-index,.service-num{color:var(--ux-cyan)!important}.hero-lead,.section-heading p,.shopify-copy>p,.dashboard-copy>p,.hero-note{color:var(--ux-muted)!important}
/* Responsive containment */
html,body{width:100%;max-width:100%}.section-pad{width:100%;max-width:1240px;min-width:0;box-sizing:border-box}.hero-copy,.hero-art,.shopify-copy,.dashboard-copy,.contact-panel>div,.footer-brand,.footer-links{min-width:0}.service-grid,.ai-grid,.why-grid,.steps,.page-grid{min-width:0}.service,.ai-grid article,.why-grid article,.steps article,.page-card{overflow:hidden}
/* Cinematic 3D hero */
.hero{perspective:1400px}.hero-art{--mx:0px;--my:0px;--rx:0deg;--ry:0deg;--scroll-y:0px;position:relative;transform-style:preserve-3d;will-change:transform;transform:translate3d(var(--mx),var(--my),0) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--scroll-y));transition:transform .16s cubic-bezier(.2,.8,.2,1)}.hero-art:before{content:'';position:absolute;inset:5% 4%;border:1px solid rgba(32,243,251,.08);border-radius:50%;transform:translateZ(-50px) rotateX(62deg);pointer-events:none}.hero-art:after{content:'';position:absolute;left:var(--cursor-x,50%);top:var(--cursor-y,50%);width:120px;height:120px;border:1px solid rgba(32,243,251,.24);border-radius:50%;transform:translate(-50%,-50%) scale(0);opacity:.8;pointer-events:none;transition:transform .25s ease,opacity .25s ease;mix-blend-mode:screen}.hero-art.is-hovering:after{transform:translate(-50%,-50%) scale(1)}.hero-art.hit:after{animation:cursorHit .55s ease-out}@keyframes cursorHit{0%{opacity:1;transform:translate(-50%,-50%) scale(.25)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.9)}}
.orb{transform-style:preserve-3d;will-change:transform;box-shadow:0 0 100px rgba(32,243,251,.08),inset 0 0 80px rgba(10,127,219,.06)}.orb .ring{transform-style:preserve-3d;animation:orbitalFloat 9s ease-in-out infinite}.orb .r2{animation-duration:12s;animation-delay:-2s}.orb .r3{animation-duration:15s;animation-delay:-5s}.orb .r4{animation-duration:18s;animation-delay:-8s}.orb .dot{will-change:transform;transition:transform .12s ease-out,box-shadow .2s ease}.floating-card{z-index:4;will-change:transform;transition:transform .22s cubic-bezier(.2,.8,.2,1),border-color .2s ease,box-shadow .2s ease}.floating-card:hover{border-color:rgba(32,243,251,.55)!important;box-shadow:0 18px 55px rgba(0,0,0,.28),0 0 28px rgba(32,243,251,.10);transform:translateY(-7px) translateZ(18px)!important}@keyframes orbitalFloat{0%,100%{filter:drop-shadow(0 0 0 rgba(32,243,251,0))}50%{filter:drop-shadow(0 0 8px rgba(32,243,251,.16))}}
.service,.page-card,.ai-grid article,.why-grid article,.steps article,.arch-card,.engagement,.digital-card,.protocol,.live-console{--card-rx:0deg;--card-ry:0deg;--lift:0px;transform:perspective(900px) rotateX(var(--card-rx)) rotateY(var(--card-ry)) translateY(var(--lift));transform-style:preserve-3d;will-change:transform;border-color:var(--ux-line)!important;transition:transform .18s cubic-bezier(.2,.8,.2,1),border-color .2s ease,box-shadow .2s ease,background .2s ease}.service:hover,.page-card:hover,.ai-grid article:hover,.why-grid article:hover,.steps article:hover,.arch-card:hover,.engagement:hover,.digital-card:hover,.protocol:hover,.live-console:hover{--lift:-7px;border-color:rgba(32,243,251,.38)!important;box-shadow:0 24px 65px rgba(0,0,0,.25),0 0 26px rgba(32,243,251,.06)}.service:after,.page-card:after,.ai-grid article:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--spot-x,50%) var(--spot-y,0%),rgba(32,243,251,.12),transparent 38%);opacity:0;transition:opacity .2s ease;pointer-events:none}.service:hover:after,.page-card:hover:after,.ai-grid article:hover:after{opacity:1}
.btn,.tool-cloud span,.cap-list div,.footer-links a,.nav a,.text-link{transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease}.btn:hover{transform:translateY(-3px)}.tool-cloud span:hover{transform:translateY(-3px);border-color:var(--ux-cyan);color:var(--ux-text)}.footer-links a:hover{transform:translateX(3px)}
.shopify-visual,.dashboard,.architecture,.contact-panel,.page-hero>div{--scroll-tilt:0deg;--scroll-depth:0px;transform-style:preserve-3d;will-change:transform;transform:perspective(1200px) rotateX(var(--scroll-tilt)) translateZ(var(--scroll-depth));transition:transform .18s ease-out}.shopify-visual,.dashboard{isolation:isolate}.shopify-visual:after,.dashboard:after{content:'';position:absolute;inset:-8%;border-radius:inherit;background:radial-gradient(circle at 50% 50%,rgba(32,243,251,.10),transparent 60%);filter:blur(24px);opacity:.5;z-index:-1;pointer-events:none}.architecture{transform-origin:center}.architecture div{transform:translateZ(12px)}
.reveal-item{opacity:0;transform:translateY(24px) scale(.985);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.8,.2,1)}.reveal-item.visible{opacity:1;transform:none}
.page-hero{min-height:56vh;display:grid;align-items:end;padding-top:130px;padding-bottom:90px;background:radial-gradient(circle at 78% 35%,rgba(32,243,251,.10),transparent 30%);perspective:1200px}.page-hero h1{max-width:1000px}.page-hero p{max-width:720px;font-size:18px;color:var(--ux-muted)}.breadcrumbs{display:flex;gap:8px;align-items:center;margin-bottom:22px;color:var(--ux-muted);font:10px 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase}.breadcrumbs a{color:var(--ux-cyan);text-decoration:none}.page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ux-line);border:1px solid var(--ux-line)}.page-card{background:var(--ux-surface);padding:32px;min-height:270px;position:relative}.page-card .card-code{font:10px 'DM Mono',monospace;color:var(--ux-cyan);letter-spacing:.12em}.page-card h2,.page-card h3{margin:42px 0 12px;font-size:22px}.page-card p{color:var(--ux-muted);font-size:14px;line-height:1.75}.page-card ul{padding-left:18px;color:var(--ux-muted);font-size:13px;line-height:1.9}.page-intro{max-width:820px;margin-bottom:50px}.page-intro p{color:var(--ux-muted);font-size:17px;line-height:1.8}.cta-strip{margin-top:80px;padding:55px;border:1px solid var(--ux-line);background:radial-gradient(circle at 85% 30%,rgba(32,243,251,.12),transparent 35%),var(--ux-surface);display:flex;justify-content:space-between;align-items:center;gap:30px}.cta-strip h2{font-size:clamp(32px,4vw,54px);margin:0}.cta-strip p{color:var(--ux-muted);max-width:600px}
.footer{width:100%;max-width:none!important;box-sizing:border-box;overflow:hidden;background:var(--ux-bg);position:relative;padding:65px max(32px,calc((100vw - var(--max))/2 + 32px)) 25px;display:grid;grid-template-columns:1fr .8fr;gap:70px}.footer-brand img{width:170px!important;height:auto!important;max-height:54px!important;display:block!important;margin:0 0 20px!important;object-fit:contain}.footer-brand p{margin:0;max-width:390px;color:var(--ux-muted)}.footer-links{min-width:0}.footer-bottom{min-width:0}.footer-bottom span{overflow-wrap:anywhere}
@media(max-width:1100px){.nav{gap:18px!important}.nav a{font-size:13px!important}.brand,.brand img{width:150px!important}.page-grid{grid-template-columns:1fr 1fr}.cta-strip{align-items:flex-start;flex-direction:column}.footer{grid-template-columns:1fr;gap:40px;padding-left:24px;padding-right:24px}}
@media(max-width:900px){.nav{display:none!important}.menu{display:flex!important}.hero,.shopify,.reporting,.contact-panel{grid-template-columns:1fr}.hero-art{height:470px;margin-top:20px}.shopify-visual{height:360px}.hero-copy{order:1}.hero-art{order:2}}
@media(max-width:700px){.site-header{height:70px!important;padding-left:18px!important;padding-right:18px!important}.brand,.brand img{width:142px!important}.page-hero{min-height:auto;padding-top:100px;padding-bottom:60px}.page-hero h1{font-size:clamp(44px,14vw,68px)}.page-hero p{font-size:15px}.page-grid{grid-template-columns:1fr}.page-card{min-height:0;padding:26px}.cta-strip{margin-top:50px;padding:30px 22px}.footer{padding:48px 18px 20px}.footer-links{grid-template-columns:1fr 1fr}.footer-bottom{flex-direction:column!important}.footer-brand img{width:142px!important;max-height:48px!important}.reveal-item{transform:translateY(14px)}.hero-art{height:360px;margin-top:10px}.orb{width:min(330px,82vw)}.floating-card{min-width:132px;padding:10px 12px;transform:scale(.86);transform-origin:center}.card-a{left:-4%;top:8%}.card-b{right:-4%;bottom:4%}.shopify-visual,.dashboard,.architecture,.contact-panel,.page-hero>div{transform:none!important}}
@media(max-width:420px){.footer-links{grid-template-columns:1fr}.page-hero{padding-top:88px}.hero-art{height:320px}.orb{width:280px}.floating-card{min-width:118px;transform:scale(.76)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal-item{opacity:1;transform:none;transition:none}.loader-orbit,.orb .ring{animation:none}.hero-art,.shopify-visual,.dashboard,.architecture,.contact-panel,.page-hero>div{transition:none!important;transform:none!important}.service,.page-card,.ai-grid article,.why-grid article,.steps article,.arch-card,.engagement,.digital-card,.protocol,.live-console{transition:none!important;transform:none!important}}

/* === BRAND GUIDELINE HEADER CONSISTENCY === */
.site-header{height:82px!important;padding:0 max(28px,calc((100vw - 1440px)/2))!important;background:rgba(1,20,52,.94)!important;border-bottom:1px solid rgba(137,249,253,.16)!important;box-shadow:0 10px 35px rgba(0,0,0,.14)!important}
.brand{width:48px!important;height:48px!important;min-width:48px!important;display:flex!important;align-items:center!important;justify-content:center!important}.brand img{width:48px!important;height:48px!important;max-width:48px!important;max-height:48px!important;object-fit:contain!important;display:block!important;filter:drop-shadow(0 0 12px rgba(32,243,251,.14))!important}.brand:after{display:none!important}
.nav{gap:28px!important}.nav a{font-family:'DM Mono',monospace!important;font-size:10px!important;letter-spacing:.07em!important;text-transform:uppercase!important;color:#8fa8c0!important}.nav a:hover,.nav a[aria-current=page]{color:#fff!important}.header-tools{display:flex!important;align-items:center!important;gap:10px!important;margin-left:auto!important}.header-cta{border:1px solid rgba(137,249,253,.28)!important;border-radius:4px!important;background:rgba(32,243,251,.035)!important;color:#fff!important;font-family:'DM Mono',monospace!important;font-size:10px!important;letter-spacing:.05em!important;text-transform:uppercase!important;padding:12px 15px!important}
@media(max-width:1050px){.site-header{padding:0 24px!important}.nav{gap:18px!important}.nav a{font-size:9px!important}.brand,.brand img{width:46px!important;height:46px!important;min-width:46px!important;max-width:46px!important;max-height:46px!important}}
@media(max-width:700px){.site-header{height:70px!important;padding:0 18px!important}.brand,.brand img{width:42px!important;height:42px!important;min-width:42px!important;max-width:42px!important;max-height:42px!important}.nav{top:70px!important}}
