/* 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}

/* ── mobile menu (dc-fx.js adds the burger when the page's .nav-menu is hidden) ── */
header .burger{display:none!important}
.dcfx-burger{display:none;width:42px;height:42px;padding:0 10px;border:1px solid rgba(255,255,255,.35);background:rgba(10,12,24,.35);color:inherit;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;border-radius:0}
.dcfx-burger span{display:block;height:2px;background:currentColor;transition:transform .25s,opacity .2s}
html.dcfx-mob .dcfx-burger{display:flex}
html.light .dcfx-burger{border-color:rgba(0,0,0,.25);background:rgba(255,255,255,.5)}
html.dcfx-mopen .dcfx-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
html.dcfx-mopen .dcfx-burger span:nth-child(2){opacity:0}
html.dcfx-mopen .dcfx-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.dcfx-mnav{position:fixed;inset:0;z-index:9800;display:flex;flex-direction:column;justify-content:center;gap:30px;padding:90px clamp(24px,8vw,60px) 40px;
  background:rgba(7,9,22,.86);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);color:#f3f1ec;
  opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
html.dcfx-mopen .dcfx-mnav{opacity:1;visibility:visible}
html.dcfx-mopen,html.dcfx-mopen body{overflow:hidden}
.dcfx-mnav nav{display:flex;flex-direction:column}
.dcfx-mnav nav a{font-size:clamp(1.6rem,7vw,2.3rem);font-weight:600;letter-spacing:-.01em;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.12);color:inherit;text-decoration:none}
.dcfx-mnav nav a:hover,.dcfx-mnav nav a:focus{color:#ff6a1a}
.dcfx-mcta{display:flex;flex-wrap:wrap;gap:12px}
.dcfx-mcta a{border:1px solid rgba(255,255,255,.4);padding:12px 20px;color:inherit;text-decoration:none;font-weight:600}
.dcfx-mcta a.fill{background:#ff6a1a;border-color:#ff6a1a;color:#0a0a0c}
.dcfx-mclose{position:absolute;top:22px;right:clamp(20px,5vw,64px);width:44px;height:44px;border:1px solid rgba(255,255,255,.35);background:transparent;color:inherit;font-size:1.8rem;line-height:1;cursor:pointer}
html.light .dcfx-mnav{background:rgba(250,248,244,.9);color:#14161f}
html.light .dcfx-mnav nav a{border-bottom-color:rgba(0,0,0,.12)}
html.light .dcfx-mcta a,html.light .dcfx-mclose{border-color:rgba(0,0,0,.3)}
html.dcfx-mob header .nav-inner > .theme-toggle{margin-left:auto;margin-right:12px}

/* ── light theme: body copy that pages hard-code as pale grey (show pages, news article, privacy) ── */
html.light .main p,html.light .faq p,html.light .enquire .lead p,html.light .marticle p{color:#2c2b31!important}
html.light .answer{color:#16151a!important}
html.light .form-ok{color:#8a3a0a!important}
html.light footer a:hover,html.light .botbar a:hover{color:var(--accent,#ff6a1a)!important}
html.light footer a,html.light .botbar a{text-decoration-color:rgba(0,0,0,.3)}
/* the show-page hero stays dark in both themes, so its copy stays light */
html.light .bb p,html.light .bb .synopsis{color:#cbc8c0!important}