/* dc-fx — shared Digital Characters look (main site + Academy), 5 Oct 2026.
   Loaded by dc-fx.js. Two modes:
   - full (main site): tech background + glass sections + sharp corners + cursor
   - cursor (Academy): just the animated pointer — the Academy has its own background */

/* ── Animated pointer ── */
.dcfx-cursor{position:fixed;top:0;left:0;width:12px;height:12px;border-radius:50%!important;background:#f3f1ec;z-index:9000;pointer-events:none;
  transform:translate(-50%,-50%);transition:width .3s,height .3s,background .3s;mix-blend-mode:difference;display:flex;align-items:center;justify-content:center}
.dcfx-cursor .dcfx-lbl{font-size:.7rem;color:#000;opacity:0;transform:scale(.5);transition:opacity .25s,transform .25s;letter-spacing:.02em;white-space:nowrap;font-weight:600;font-family:'Space Grotesk',system-ui,sans-serif}
.dcfx-cursor.big{width:92px;height:92px;background:#ff6a1a;mix-blend-mode:normal}
.dcfx-cursor.big .dcfx-lbl{opacity:1;transform:scale(1)}
.dcfx-cursor.link{width:42px;height:42px}
html.dcfx-cur,html.dcfx-cur body,html.dcfx-cur a,html.dcfx-cur button,html.dcfx-cur label{cursor:none}
html.dcfx-cur input,html.dcfx-cur textarea,html.dcfx-cur select{cursor:text}
@media(pointer:coarse){.dcfx-cursor{display:none}}

/* ── Tech background (full mode) ── */
.dcfx-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.dcfx-art{position:absolute;inset:-30px;background-size:cover;background-position:center;filter:blur(14px) brightness(.42) saturate(1.3);transform:scale(1.04)}
.dcfx-grid{position:absolute;left:-50%;right:-50%;bottom:-10%;height:60%;
  background-image:linear-gradient(rgba(0,208,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(0,208,255,.22) 1px,transparent 1px);
  background-size:60px 60px;transform:perspective(600px) rotateX(62deg);transform-origin:bottom;
  -webkit-mask-image:linear-gradient(0deg,#000 10%,transparent 85%);mask-image:linear-gradient(0deg,#000 10%,transparent 85%);animation:dcfxgrid 6s linear infinite}
@keyframes dcfxgrid{to{background-position:0 60px,0 0}}
.dcfx-bg canvas{position:absolute;inset:0}
.dcfx-veil{position:absolute;inset:0;background:radial-gradient(70vw 60vh at 10% 0%,rgba(0,140,255,.18),transparent 70%),radial-gradient(60vw 50vh at 95% 100%,rgba(255,106,26,.14),transparent 70%),linear-gradient(180deg,rgba(5,8,22,.35),rgba(5,8,22,.55))}
html.light .dcfx-art{filter:blur(10px) brightness(1.08) saturate(1.15);opacity:.95}
html.light .dcfx-grid{background-image:linear-gradient(rgba(0,100,240,.32) 1px,transparent 1px),linear-gradient(90deg,rgba(0,100,240,.32) 1px,transparent 1px)}
html.light .dcfx-veil{background:radial-gradient(70vw 60vh at 10% 0%,rgba(0,140,255,.14),transparent 70%),radial-gradient(60vw 50vh at 95% 100%,rgba(255,106,26,.12),transparent 70%),linear-gradient(180deg,rgba(238,243,255,.18),rgba(238,243,255,.32))}
@media(prefers-reduced-motion:reduce){.dcfx-grid{animation:none}}

/* ── Main-site theme (full mode only) ── */
html.dcfx-site{background:#050816}
html.dcfx-site.light{background:#eef3ff}
html.dcfx-site body{background:transparent!important}
html.dcfx-site *,html.dcfx-site *::before,html.dcfx-site *::after{border-radius:0!important}
html.dcfx-site .theme-toggle,html.dcfx-site .dcfx-cursor{border-radius:50%!important}
/* sections become dark glass over the background (image-backed heroes untouched) */
html.dcfx-site main>section:not(.hero),html.dcfx-site body>section:not(.hero),html.dcfx-site footer,html.dcfx-site .connect{
  background-color:rgba(5,8,22,.48)!important;border-top:1px solid rgba(0,208,255,.16)}
html.dcfx-site.light main>section:not(.hero),html.dcfx-site.light body>section:not(.hero),html.dcfx-site.light footer,html.dcfx-site.light .connect{
  background-color:rgba(255,255,255,.42)!important;border-top-color:rgba(0,100,240,.18);backdrop-filter:blur(2px)}
/* nav: frosted bar */
html.dcfx-site .nav.solid,html.dcfx-site header.nav.solid{background:rgba(5,8,22,.6)!important;backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%)}
/* glass cards */
html.dcfx-site .tile .media,html.dcfx-site .logo-tile.dark,html.dcfx-site .vcard,html.dcfx-site .marticle,html.dcfx-site .reel{
  box-shadow:0 0 30px rgba(0,208,255,.12),0 18px 45px rgba(0,0,0,.3)}
html.dcfx-site .cap,html.dcfx-site .prow{border-color:rgba(0,208,255,.14)!important}
html.dcfx-site .cap:hover,html.dcfx-site .prow:hover{background:linear-gradient(90deg,rgba(0,208,255,.08),transparent)}
html.dcfx-site .vcard{background:rgba(10,12,30,.55)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:rgba(255,255,255,.12)!important}
html.dcfx-site .strip{background:rgba(255,255,255,.04);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

/* ── v3 (5 Oct): nav always readable, lighter light-mode glass ── */
html.dcfx-site .nav,html.dcfx-site header.nav{background:rgba(5,8,22,.62)!important;backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  color:#f3f1ec!important;border-bottom:1px solid rgba(255,255,255,.1)}
html.dcfx-site.light .nav,html.dcfx-site.light header.nav{background:rgba(255,255,255,.72)!important;color:#16151a!important;border-bottom-color:rgba(0,0,0,.08)}
html.dcfx-site .nav a,html.dcfx-site .nav .brand,html.dcfx-site .nav button{color:inherit!important}
html.dcfx-site.light .nav .nav-cta{border-color:currentColor}
html.dcfx-site.light main>section:not(.hero),html.dcfx-site.light body>section:not(.hero),html.dcfx-site.light footer,html.dcfx-site.light .connect{
  background-color:rgba(255,255,255,.22)!important;backdrop-filter:none!important}
html.dcfx-site.light .dcfx-art{filter:blur(6px) brightness(1.05) saturate(1.2)!important;opacity:1!important}
html.dcfx-site.light .dcfx-veil{background:linear-gradient(180deg,rgba(238,243,255,.1),rgba(238,243,255,.22))!important}
/* text on the brighter light background */
html.dcfx-site.light .cap p,html.dcfx-site.light .shead p,html.dcfx-site.light .studio .side p{color:#2c2f3a}
html.dcfx-site.light .cap h3,html.dcfx-site.light .shead h2{text-shadow:0 1px 12px rgba(255,255,255,.7)}
html.dcfx-site.light .caps,html.dcfx-site.light .posts,html.dcfx-site.light .studio,html.dcfx-site.light .metrics{background:rgba(255,255,255,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* ── v4: light mode matches the Academy — soft, well-blurred background ── */
html.dcfx-site.light .dcfx-art{filter:blur(18px) brightness(1.06) saturate(1.1)!important;opacity:.9!important;transform:scale(1.08)}
html.dcfx-site.light .dcfx-veil{background:radial-gradient(70vw 60vh at 10% 0%,rgba(0,140,255,.12),transparent 70%),radial-gradient(60vw 50vh at 95% 100%,rgba(255,106,26,.1),transparent 70%),linear-gradient(180deg,rgba(238,243,255,.38),rgba(238,243,255,.5))!important}
html.dcfx-site.light main>section:not(.hero),html.dcfx-site.light body>section:not(.hero),html.dcfx-site.light footer,html.dcfx-site.light .connect{background-color:rgba(255,255,255,.3)!important}
html.dcfx-site.light .hero .hero-veil{background:linear-gradient(180deg,rgba(10,10,12,.85) 0%,rgba(10,10,12,.2) 25%,rgba(238,243,255,.2) 75%,rgba(238,243,255,.85) 100%)!important}