/* Quanscend Labs — Spectral Workshop. Cursor-led depth with calm reading surfaces. */
html{background:var(--page-bg);color-scheme:var(--scheme);scroll-behavior:smooth}
body{background:var(--page-bg)!important;color:var(--text)!important;transition:background-color .28s ease,color .28s ease}
body p,body li{color:var(--text-soft)}
h1,h2,h3,h4{color:var(--text)}
a:hover{color:var(--primary-hover)}
::selection{background:#a796ff;color:#17151f}

/* Keep the supplied wordmark intact against a stable, dark header in both themes. */
.top,.top.shell{min-height:78px;background:var(--header-bg)!important;color:var(--header-text)!important;border-bottom:1px solid var(--header-line)!important;box-shadow:0 8px 28px rgb(11 10 20 / .08)}
.brand img,.top .brand img{object-fit:contain!important;aspect-ratio:3/1!important;filter:none!important}
.nav{color:var(--header-text)}
.nav a:hover,.nav a[aria-current=page]{color:#88e7df!important}
.nav .pill{border-color:rgb(255 255 255 / .28)!important;border-radius:999px!important}
.nav .pill:hover{background:#a796ff!important;border-color:#a796ff!important;color:#17151f!important}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-width:76px;min-height:44px;padding:.55rem .75rem;border:1px solid rgb(255 255 255 / .25);border-radius:999px;background:rgb(255 255 255 / .06);color:#fbfaff;font:700 .78rem/1 var(--font-body);cursor:pointer;transition:background-color .2s ease,border-color .2s ease,transform .2s ease}
.theme-toggle:hover{transform:translateY(-1px);border-color:#a796ff;background:rgb(167 150 255 / .16)}
.theme-toggle svg{width:17px;height:17px;flex:0 0 auto}
.theme-sun{display:none}
:root[data-theme="dark"] .theme-moon{display:none}
:root[data-theme="dark"] .theme-sun{display:block}
.theme-word{white-space:nowrap}
.menu{border-radius:999px!important;background:rgb(255 255 255 / .06)!important}
.menu:hover{border-color:#a796ff!important;color:#a796ff!important}

/* New dimensional hero system. All hero text remains above the decorative depth planes. */
.hero,.page-hero,.local-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--hero-bg)!important;color:var(--hero-ink)!important;border-bottom:1px solid var(--hero-line)!important;transition:background-color .28s ease,color .28s ease}
.hero:before,.hero:after,.page-hero:before,.page-hero:after,.local-hero:before,.local-hero:after{content:none!important;display:none!important}
.hero{min-height:min(790px,calc(100svh - 78px));padding-block:clamp(4.5rem,8vw,7.5rem)}
.hero-grid{position:relative;z-index:2;grid-template-columns:minmax(0,1.04fr) minmax(300px,.88fr);gap:clamp(2rem,4.5vw,5rem)}
.hero-copy{max-width:710px}
.hero-kicker,.local-eyebrow{color:#5940d8!important;letter-spacing:.16em!important}
:root[data-theme="dark"] .hero-kicker,:root[data-theme="dark"] .local-eyebrow{color:#78e4df!important}
.hero h1,.page-hero h1,.local-hero h1{color:var(--hero-ink)!important;max-width:12ch;letter-spacing:-.073em!important;line-height:.99!important}
.hero h1 .gradient{color:#6046e6!important;background:none!important;-webkit-text-fill-color:currentColor!important}
:root[data-theme="dark"] .hero h1 .gradient{color:#b9aaff!important}
.hero-copy>p:not(.hero-tagline),.page-hero .hero-copy>p:not(.hero-tagline),.local-hero .local-lead{color:var(--hero-muted)!important;opacity:1!important;max-width:55ch;font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.75}
.hero-tagline{color:var(--hero-ink)!important;gap:.5rem!important}
.hero-tagline span{border-color:var(--hero-line)!important;border-radius:999px!important;background:color-mix(in srgb,var(--surface) 60%,transparent)!important;color:var(--hero-ink)!important}
.hero-note{color:var(--text-subtle)!important}
.page-hero,.local-hero{padding-block:clamp(4rem,8vw,6rem)!important}
.page-hero .hero-split,.local-hero-grid{position:relative;z-index:2}
.page-hero .hero-copy>p:not(.hero-tagline){max-width:58ch}
.page-hero .btn.alt,.local-hero .btn.alt{border-color:color-mix(in srgb,var(--hero-ink) 25%,transparent)!important;background:transparent!important;color:var(--hero-ink)!important}
.page-hero .btn.alt:hover,.local-hero .btn.alt:hover{border-color:#6046e6!important;background:color-mix(in srgb,#7e67f0 10%,transparent)!important}

/* Layered field: depth planes are independently moved by pointer position and scroll. */
.parallax-stage{position:absolute;z-index:0;inset:0;overflow:hidden;pointer-events:none;perspective:1000px;contain:paint}
.parallax-layer{position:absolute;inset:-3%;pointer-events:none;will-change:transform;transition:transform .36s cubic-bezier(.2,.7,.2,1)}
.parallax-grid{inset:0;background-image:linear-gradient(var(--hero-line) 1px,transparent 1px),linear-gradient(90deg,var(--hero-line) 1px,transparent 1px);background-size:70px 70px;opacity:.38;mask-image:radial-gradient(ellipse 62% 90% at 76% 52%,#000 12%,transparent 100%)}
.parallax-glow{inset:-18%;background:radial-gradient(ellipse at var(--cursor-x,74%) var(--cursor-y,46%),var(--hero-halo),transparent 36%),radial-gradient(ellipse at 84% 70%,rgb(43 200 194 / .12),transparent 37%);filter:blur(7px);opacity:.95}
.parallax-plane:before{content:"";position:absolute;display:block;right:4%;top:5%;width:min(48vw,700px);height:min(68vh,650px);border:1px solid color-mix(in srgb,var(--hero-ink) 16%,transparent);background:linear-gradient(142deg,color-mix(in srgb,#967eff 10%,transparent),color-mix(in srgb,#54d7cf 5%,transparent));clip-path:polygon(31% 0,100% 18%,81% 100%,0 79%);transform:rotate(-12deg);box-shadow:inset 0 1px rgb(255 255 255 / .12)}
.parallax-plane--two:before{right:12%;top:11%;width:min(39vw,570px);height:min(56vh,540px);border-color:color-mix(in srgb,#8570ef 34%,transparent);background:linear-gradient(150deg,color-mix(in srgb,#a796ff 12%,transparent),transparent 66%);clip-path:polygon(26% 0,100% 25%,73% 100%,0 72%);transform:rotate(14deg)}
.parallax-plane--three:before{right:22%;top:17%;width:min(28vw,400px);height:min(44vh,410px);border-color:color-mix(in srgb,#54d7cf 35%,transparent);background:linear-gradient(135deg,color-mix(in srgb,#54d7cf 9%,transparent),transparent 70%);clip-path:polygon(38% 0,100% 28%,62% 100%,0 67%);transform:rotate(-21deg)}
.parallax-traces{background:linear-gradient(155deg,transparent 46%,color-mix(in srgb,#54d7cf 55%,transparent) 46.08%,transparent 46.25%),linear-gradient(155deg,transparent 53%,color-mix(in srgb,#a796ff 43%,transparent) 53.08%,transparent 53.24%);opacity:.48;mask-image:linear-gradient(90deg,transparent 32%,#000 72%,#000)}
.parallax-grain{inset:0;background-image:radial-gradient(circle,color-mix(in srgb,var(--hero-ink) 28%,transparent) .75px,transparent .9px);background-size:17px 17px;opacity:.2;mask-image:radial-gradient(ellipse at 76% 47%,#000,transparent 65%)}
.page-hero .parallax-plane:before,.local-hero .parallax-plane:before{width:min(38vw,520px);height:min(55vh,470px);opacity:.65}
.page-hero .parallax-grid,.local-hero .parallax-grid{background-size:58px 58px;opacity:.3}
.parallax-scene-content{position:relative;z-index:2}

/* Official symbol extracted from the supplied header wordmark; no alternate logo artwork. */
.hero-art{position:relative;z-index:2;min-height:440px;overflow:visible;perspective:1000px;isolation:isolate}
.art-plane{position:absolute;top:50%;left:50%;width:76%;height:74%;border:1px solid var(--hero-line);border-radius:2rem;background:linear-gradient(145deg,color-mix(in srgb,#a796ff 11%,transparent),color-mix(in srgb,#54d7cf 4%,transparent));box-shadow:0 25px 80px rgb(35 25 95 / .07);transform-style:preserve-3d;transition:transform .42s cubic-bezier(.2,.7,.2,1)}
.art-plane--back{transform:translate3d(calc(-50% + var(--parallax-x,0px)),calc(-50% + var(--parallax-y,0px)),0) rotateY(-20deg) rotateZ(-18deg);clip-path:polygon(18% 0,100% 14%,82% 100%,0 84%)}
.art-plane--middle{width:62%;height:62%;border-color:color-mix(in srgb,#856af0 45%,transparent);background:linear-gradient(135deg,color-mix(in srgb,#967eff 18%,transparent),color-mix(in srgb,#54d7cf 6%,transparent));transform:translate3d(calc(-50% + var(--parallax-x,0px)),calc(-50% + var(--parallax-y,0px)),0) rotateY(18deg) rotateZ(16deg);clip-path:polygon(25% 0,100% 20%,75% 100%,0 80%)}
.art-plane--front{width:48%;height:49%;border-color:color-mix(in srgb,#54d7cf 48%,transparent);background:linear-gradient(135deg,color-mix(in srgb,#54d7cf 13%,transparent),color-mix(in srgb,#a796ff 7%,transparent));transform:translate3d(calc(-50% + var(--parallax-x,0px)),calc(-50% + var(--parallax-y,0px)),0) rotateY(-12deg) rotateZ(-27deg);clip-path:polygon(31% 0,100% 23%,69% 100%,0 77%)}
.art-icon{position:absolute;z-index:2;top:50%;left:50%;width:clamp(220px,26vw,350px);transform:translate3d(calc(-50% + var(--parallax-x,0px)),calc(-50% + var(--parallax-y,0px)),80px) rotateZ(-5deg);filter:drop-shadow(0 20px 44px rgb(75 59 181 / .24));transition:transform .42s cubic-bezier(.2,.7,.2,1)}
.art-icon img{display:block;width:100%;height:auto;object-fit:contain;aspect-ratio:1/1;filter:none!important}
.art-coordinate{position:absolute;z-index:3;display:flex;align-items:center;gap:.8rem;color:var(--text-subtle);font:800 .61rem/1.3 var(--font-body);letter-spacing:.14em}
.art-coordinate span{color:var(--primary);font-size:.58rem}
.art-coordinate--top{top:10%;right:5%}
.art-coordinate--bottom{right:4%;bottom:9%}

/* Main content surfaces and cards follow the active theme. */
.band,.about,.tone-light,.pricing-block,.faq{background:var(--page-bg)!important;color:var(--text)!important}
.section h2,.band h2,.contact h2,.head h2,.about h2{color:var(--text)!important}
.band p,.section p,.about p,.head .intro{color:var(--text-soft)!important}
.label{color:var(--primary)!important}
.service,.capability-card,.plan,.quote,.value,.step,.facts,.local-aside,.contact-card,.service-cta,.local-cta{background:var(--surface)!important;color:var(--text)!important;border-color:var(--border)!important;box-shadow:0 16px 45px rgb(20 16 44 / .055)!important}
.service h3,.capability-card h3,.plan h3,.value h3,.step h3,.facts h2,.local-aside h2,.quote strong{color:var(--text)!important}
.service p,.capability-card p,.plan p,.value p,.step p,.facts p,.local-aside li,.quote p{color:var(--text-soft)!important}
.service>a,.service-links a,.local-services a{color:var(--primary)!important}
.service .icon,.icon{border-color:var(--border)!important;background:var(--surface-muted)!important;color:var(--primary)!important}
.service:nth-child(1),.service:nth-child(2){background:var(--surface)!important;border-color:var(--border)!important}
.service:before,.capability-card:before{position:absolute;inset:0;content:"";pointer-events:none;background:radial-gradient(300px circle at var(--spot-x,50%) var(--spot-y,50%),var(--card-glow),transparent 70%);opacity:0;transition:opacity .24s ease}
.service:hover:before,.capability-card:hover:before{opacity:1}
.service:hover,.capability-card:hover,.value:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--primary) 42%,var(--border))!important;box-shadow:0 22px 48px rgb(30 20 80 / .12)!important}
.service-cta,.local-cta{background:var(--surface-muted)!important}
.trust{background:#201b33!important;color:#fbfaff!important}
.trust-item{border-color:rgb(255 255 255 / .13)!important}
.trust-item strong{color:#fbfaff!important}
.trust-item span{color:#d5d1df!important}
.contact{background:#211c35!important;color:#fbfaff!important}
.contact .label,.contact h2{color:#fbfaff!important}
.contact p{color:#d6d1e2!important}
.contact .btn{background:#a796ff!important;border-color:#a796ff!important;color:#17151f!important}
.local-aside .label{color:var(--primary)!important}
.local-aside li{border-color:var(--border)!important}
.local-faq summary,.faq summary{color:var(--text)!important}
.local-faq details,.faq details{border-color:var(--border)!important}
.local-services a,.service-links a{background:var(--surface)!important;border-color:var(--border)!important}
.footer{color:var(--text-subtle)!important}
.footer a{color:var(--primary)!important}
.footer-tagline{color:var(--text-soft)!important}
.local-hero .local-breadcrumb{color:var(--text-subtle)!important}
.local-hero .local-breadcrumb a{color:var(--hero-ink)!important}
.local-hero .local-aside{background:color-mix(in srgb,var(--surface) 82%,transparent)!important;border-color:var(--hero-line)!important}
.local-hero .local-aside h2{color:var(--text)!important}
.local-hero .local-aside li{color:var(--text-soft)!important}
.local-hero .local-aside .fact-note{color:var(--text-subtle)!important}
.btn{background:var(--button-bg)!important;border-color:var(--button-bg)!important;color:var(--button-text)!important;border-radius:999px!important;box-shadow:0 8px 24px color-mix(in srgb,var(--button-bg) 23%,transparent)}
.btn:hover{background:var(--button-hover-bg)!important;border-color:var(--button-hover-bg)!important;color:var(--button-text)!important}
.btn.alt{box-shadow:none}

@media(max-width:800px){
  .hero{min-height:0;padding-block:4.4rem 3rem}
  .hero-grid{grid-template-columns:1fr;gap:1.5rem}
  .hero-art{width:min(100%,620px);min-height:350px;margin-inline:auto}
  .art-icon{width:clamp(210px,52vw,310px)}
  .parallax-plane:before{right:-8%;width:min(78vw,520px);height:380px}
  .page-hero,.local-hero{padding-block:3.8rem 3.2rem!important}
  .parallax-stage{opacity:.8}
}
@media(max-width:560px){
  .top,.top.shell{min-height:68px;padding-inline:1rem;gap:.55rem}
  .brand,.top .brand{width:clamp(118px,37vw,150px)}
  .theme-toggle{min-width:42px;width:42px;height:42px;padding:.55rem}
  .theme-word{font-size:.69rem}
  .hero h1{max-width:11ch;font-size:clamp(3.1rem,13vw,4.1rem)}
  .hero-art{min-height:285px}
  .art-plane{border-radius:1.2rem}
  .art-icon{width:min(67vw,260px)}
  .art-coordinate{font-size:.5rem}
  .parallax-grid{background-size:48px 48px}
  .parallax-plane:before{right:-19%;width:92vw;height:310px}
  .page-hero,.local-hero{padding-block:3.1rem 2.8rem!important}
}
@media(max-width:380px){.theme-word{display:none}.theme-toggle{width:40px;min-width:40px}.brand,.top .brand{width:118px}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .parallax-layer,.art-plane,.art-icon,.service,.capability-card,.value{transition:none!important;will-change:auto}
}
