/* Entainify: light, warm and soft. Mostly warm white, with the page gradient dipping to deep purple at the very bottom. */
:root{
  --bg:#fffaf3;--bg2:#f4ecff;--panel:rgba(255,255,255,.72);--line:rgba(120,90,190,.2);
  --ink:#2c2150;--muted:#65598a;--glow:#7c5ac7;--warm:#a66a00;--cyan:#7c5ac7;
  --acc:#7c5ac7;--acc2:#ff8fb8;--gold:#ffc83d;--r:22px;color-scheme:light;
}
html{background:#fffaf3}
body{color:var(--ink);background:linear-gradient(180deg,#fffaf3 0%,#fff7ec 60%,#fdf3f4 90%,#f4ecff 100%);min-height:100vh;position:relative}
body::before{background:
  radial-gradient(80% 22% at 50% 0%,rgba(255,214,120,.55),transparent 75%),
  radial-gradient(60% 40% at 12% 8%,rgba(255,200,61,.22),transparent 70%),
  radial-gradient(50% 36% at 92% 22%,rgba(255,143,184,.2),transparent 70%),
  radial-gradient(60% 40% at 80% 58%,rgba(124,90,199,.12),transparent 70%)}
body::after{background:none}
a{color:#6a45c4}a:hover{color:#3d2486;text-shadow:none}
:focus-visible{outline-color:#7c5ac7}
.top{background:linear-gradient(rgba(255,244,214,.96),rgba(255,250,243,.82));border-bottom:1px solid rgba(255,200,61,.45);box-shadow:0 6px 40px rgba(255,200,61,.5),0 0 0 1px rgba(255,255,255,.6) inset}
.brand{color:var(--ink);font-weight:800}
.brand small{color:var(--muted)}
nav a{color:var(--muted)}nav a::after{background:linear-gradient(90deg,#ffc83d,#ff8fb8,#7c5ac7);box-shadow:none;height:2px}
nav a:hover,nav a[aria-current=page]{color:var(--ink)}
.menu{background:#fff;color:var(--ink)}
h1,h2,h3{color:var(--ink)}
.eyebrow{color:#7c5ac7}.eyebrow::before{background:linear-gradient(90deg,transparent,#7c5ac7)}
.glow{text-shadow:none}
.hero .display{background:linear-gradient(100deg,#3d2486 0%,#7c5ac7 40%,#ff8fb8 75%,#ffb52e 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hero .display span{padding-bottom:.06em}
.hero .sub{color:#7c5ac7}
.lead,.hero .tag,.note,.card p{color:var(--muted)}
.btn{color:#fff;background:linear-gradient(135deg,#7c5ac7,#a06be0);box-shadow:0 8px 22px rgba(124,90,199,.35)}
.btn:hover{color:#fff;box-shadow:0 12px 30px rgba(124,90,199,.5)}
.btn.ghost{background:rgba(255,255,255,.7);color:var(--ink);border:1px solid var(--line);box-shadow:none}
.btn.ghost:hover{color:#3d2486;border-color:#7c5ac7;box-shadow:0 6px 20px rgba(124,90,199,.2)}
.btn.world{background:linear-gradient(135deg,#ffb52e,#ff8fb8);color:#3a1f00;box-shadow:0 8px 22px rgba(255,160,80,.4)}
.btn.world:hover{color:#3a1f00}
.marquee{border-color:var(--line)}
.marquee div{-webkit-text-stroke:1px rgba(124,90,199,.55)}
.marquee b{color:#ffb52e;text-shadow:none}
.fact,.card,.player{background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 30px rgba(110,80,180,.1)}
.fact b{color:#7c5ac7}
.card:hover{border-color:rgba(124,90,199,.5);box-shadow:0 16px 40px rgba(124,90,199,.22)}
.card .pic.art{color:#fff;text-shadow:0 2px 12px rgba(80,40,140,.35);background:linear-gradient(135deg,#8f6fe0,#ff8fb8)}
.card:nth-child(3n+2) .pic.art{background:linear-gradient(135deg,#ffb52e,#ff8fb8)}
.card:nth-child(3n+3) .pic.art{background:linear-gradient(135deg,#6fd6c7,#7c5ac7)}
.card .pic::after{background:linear-gradient(transparent 60%,rgba(255,255,255,.25))}
.chip{background:rgba(124,90,199,.1);color:#5a3aa8;border-color:rgba(124,90,199,.3)}
.chip.live{border-color:rgba(63,178,127,.5);color:#1f7d55;background:rgba(63,178,127,.1)}.chip.soon{border-color:rgba(255,160,40,.55);color:#9a5a00;background:rgba(255,181,46,.14)}
.scrollcue{color:var(--muted)}.scrollcue::after{background:linear-gradient(#7c5ac7,transparent)}
blockquote{border-left-color:#7c5ac7;box-shadow:none}
.art svg{filter:drop-shadow(0 12px 24px rgba(110,80,180,.2))}
footer{border-top:0;color:var(--muted);padding-top:40px;padding-bottom:70px;position:relative}
footer::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(transparent,#2b1a55);pointer-events:none}
footer a{color:#5a3aa8}footer a:hover{color:#2b1a55}
.connect .display{color:var(--ink);-webkit-text-fill-color:initial}
.connect{padding-bottom:40px}
.lightbox{background:rgba(40,25,70,.9)}
.wisp{background:radial-gradient(circle,#fff 0,rgba(255,226,140,.9) 20%,rgba(255,200,61,.3) 52%,transparent 70%);box-shadow:0 0 40px rgba(255,200,61,.6)}
.wisp span{background:#fff;color:var(--ink);border-color:var(--line)}

/* Photon, the mascot */
.photon{display:grid;place-items:center;max-width:520px;margin-left:auto;position:relative}
.photon::before{content:"";position:absolute;inset:6% 6% 6%;border-radius:50%;background:radial-gradient(circle,rgba(255,200,61,.45),rgba(255,143,184,.14) 55%,transparent 72%);filter:blur(8px)}
.photon img{position:relative;width:min(100%,380px);height:auto;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 20px 26px rgba(110,70,190,.28))}
.photon .cloud{position:absolute;border-radius:999px;background:#fff;opacity:.9;filter:blur(1px);box-shadow:0 10px 24px rgba(120,90,200,.18)}
.photon .c1{width:130px;height:44px;left:2%;top:20%}.photon .c2{width:90px;height:32px;right:2%;top:62%}.photon .c3{width:160px;height:50px;left:10%;bottom:4%}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.worldband{margin:0 0 90px;border-radius:30px;padding:36px clamp(20px,4vw,48px);background:linear-gradient(120deg,rgba(255,200,61,.3),rgba(255,143,184,.28) 50%,rgba(124,90,199,.28));border:1px solid var(--line);display:grid;grid-template-columns:1.3fr .7fr;gap:24px;align-items:center;box-shadow:0 18px 50px rgba(110,80,180,.16)}
.worldband h2{margin:0 0 8px}.worldband p{margin:0 0 16px;color:var(--muted)}
.worldband .miniature{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.worldband .dot{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;font-weight:800;color:#fff;box-shadow:0 8px 18px rgba(80,50,140,.25)}
@media (max-width:860px){.worldband{grid-template-columns:1fr}.photon{margin:10px auto 0}}

/* B2B tone: calmer type, squarer shapes, one accent colour, no playful extras */
.hero .display{background:none;-webkit-text-fill-color:initial;color:var(--ink);font-weight:700;letter-spacing:-.035em;font-size:clamp(44px,8vw,104px)}
.hero .display span:last-child{color:#6a45c4}
.hero .sub{color:#6a45c4;letter-spacing:.24em}
.btn{border-radius:10px;font-weight:600;letter-spacing:.02em;background:#4b2f8a;box-shadow:0 6px 16px rgba(75,47,138,.25)}
.btn:hover{background:#3a2370;box-shadow:0 10px 22px rgba(75,47,138,.32)}
.btn.world,.btn.ghost{background:#fff;color:var(--ink);border:1px solid rgba(75,47,138,.35);box-shadow:none}
.btn.world:hover,.btn.ghost:hover{color:#3a2370;border-color:#4b2f8a;background:#fff;box-shadow:0 6px 16px rgba(75,47,138,.14)}
.card,.fact,.player{border-radius:14px;box-shadow:0 2px 10px rgba(60,40,110,.07)}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(60,40,110,.14)}
.card .pic.art,.card:nth-child(3n+2) .pic.art,.card:nth-child(3n+3) .pic.art{background:linear-gradient(135deg,#efe8fb,#f9f3ea);color:#4b2f8a;text-shadow:none;font-weight:600;font-size:44px;letter-spacing:.04em;aspect-ratio:16/8}
.chip{border-radius:6px;letter-spacing:.12em}
.card h3{font-size:20px}
.worldband{border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 2px 12px rgba(60,40,110,.08)}
.worldband .miniature{display:none}.worldband{grid-template-columns:1fr}
.photon .cloud{display:none}
.photon::before{background:radial-gradient(circle,rgba(255,200,61,.3),transparent 70%)}
.band{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0;border-block:1px solid var(--line);margin:0 0 80px;background:rgba(255,255,255,.6)}
.band div{padding:22px 24px;border-left:1px solid var(--line)}.band div:first-child{border-left:0}
.band b{display:block;font-size:15px;color:var(--ink);margin-bottom:4px}.band span{font-size:14px;color:var(--muted)}

/* Lightwave: the reverse of Entainify. Black/dark purple at the top, mostly dark purple, light only at the very bottom. */
:root{--bg:#120a24;--ink:#f3ecff;--muted:#cbbdee;--line:rgba(200,180,255,.22);--panel:rgba(255,255,255,.07);--glow:#ffd36b;--cyan:#cdb8ff;color-scheme:dark}
html{background:#fffaf3}
body{color:var(--ink);background:linear-gradient(180deg,#0b0618 0%,#160c2c 14%,#25164a 45%,#3a2470 78%,#8a73c8 90%,#efe6ff 96%,#fffaf3 100%)}
body::before{background:
  radial-gradient(70% 30% at 50% 0%,rgba(150,110,255,.28),transparent 72%),
  radial-gradient(40% 30% at 88% 40%,rgba(255,143,184,.14),transparent 70%),
  radial-gradient(40% 30% at 8% 60%,rgba(255,200,61,.1),transparent 70%)}
a{color:#d9c7ff}a:hover{color:#fff}
.top{background:linear-gradient(rgba(11,6,24,.92),rgba(22,12,44,.75));border-bottom:1px solid var(--line);box-shadow:0 6px 30px rgba(120,80,220,.25)}
.brand,h1,h2,h3{color:#fff}.brand small{color:var(--muted)}
nav a{color:var(--muted)}nav a:hover,nav a[aria-current=page]{color:#fff}
.menu{background:rgba(255,255,255,.1);color:#fff;border-color:var(--line)}
.eyebrow,.hero .sub,.fact b{color:#ffd36b}.eyebrow::before{background:linear-gradient(90deg,transparent,#ffd36b)}
.hero .display{background:none;-webkit-text-fill-color:initial;color:#fff;font-weight:700}
.hero .display span:last-child{color:#ffd36b}
.btn,.btn:hover{background:#fff;color:#25164a;box-shadow:0 8px 22px rgba(0,0,0,.35)}
.btn.ghost,.btn.world{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--line);box-shadow:none}
.btn.ghost:hover,.btn.world:hover{background:rgba(255,255,255,.16);color:#fff;border-color:#ffd36b}
.card,.fact,.player,.band{background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.3)}
.card:hover{border-color:rgba(255,211,107,.6);box-shadow:0 16px 40px rgba(0,0,0,.45)}
.card p,.lead,.note,.hero .tag{color:var(--muted)}
.card .pic.art{background:linear-gradient(135deg,#3a2470,#6a45c4);color:#fff}
.chip{background:rgba(255,255,255,.1);color:#fff;border-color:var(--line)}
.chip.live{color:#9af0c4;background:rgba(63,178,127,.18)}.chip.soon{color:#ffd36b;background:rgba(255,181,46,.16)}
.scrollcue{color:var(--muted)}
.art svg{filter:drop-shadow(0 0 30px rgba(180,140,255,.35))}
.connect .display,.connect h2{color:#fff}
blockquote{color:var(--muted);border-left-color:#ffd36b}
.lightbox{background:rgba(5,3,12,.94)}
.grid a,.strip img,.banner,.side{border-color:var(--line)}
footer{color:#3a2470;padding-bottom:40px}footer::after{display:none}
footer a{color:#4b2f8a}footer a:hover{color:#25164a}
.marquee div{-webkit-text-stroke:1px rgba(255,255,255,.5)}.marquee b{color:#ffd36b}
.prose a{color:#ffd36b}
.player audio{color-scheme:dark}

/* project cards and pages */
.card.proj .pic{display:block;aspect-ratio:16/10;overflow:hidden;background:#150a28}
.card.proj .pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease}
.card.proj:hover .pic img{transform:scale(1.06)}
.card .thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0 4px}
.card .thumbs img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.card h3 a{text-decoration:none;color:inherit}.card h3 a:hover{text-decoration:underline}

/* ===== LED light show: infinity-mirror frames, LED strips, stage beams and colour-cycling glow (reduced motion turns the movement off) ===== */
:root{--led1:#ff3df2;--led2:#35e8ff;--led3:#b6ff3c;--led4:#ffd36b}
body{background:linear-gradient(180deg,#04020d 0%,#0a0518 16%,#1a0d36 48%,#34206a 80%,#8a73c8 91%,#efe6ff 96%,#fffaf3 100%)}
/* LED pixel grid across the page */
body::before{background:
  radial-gradient(circle,rgba(255,255,255,.22) 0 1px,transparent 1.6px) 0 0/22px 22px,
  radial-gradient(60% 34% at 50% 0%,rgba(255,61,242,.22),transparent 72%),
  radial-gradient(40% 30% at 90% 38%,rgba(53,232,255,.16),transparent 70%),
  radial-gradient(40% 30% at 6% 62%,rgba(182,255,60,.1),transparent 70%)}
/* two sweeping stage beams */
body::after{content:"";position:fixed;inset:-20% -10% auto -10%;height:120%;z-index:-1;pointer-events:none;mix-blend-mode:screen;opacity:.55;
  background:conic-gradient(from 188deg at 12% -6%,transparent 0 14deg,rgba(255,61,242,.34) 17deg,transparent 22deg),conic-gradient(from 162deg at 88% -6%,transparent 0 14deg,rgba(53,232,255,.3) 17deg,transparent 22deg);
  animation:beams 14s ease-in-out infinite alternate;transform-origin:50% 0}
@keyframes beams{0%{transform:rotate(-5deg)}100%{transform:rotate(5deg)}}
/* LED strip under the header: dots that chase along the bar */
.top{border-bottom:0;position:sticky}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:4px;pointer-events:none;
  background:repeating-linear-gradient(90deg,var(--led1) 0 6px,transparent 6px 12px,var(--led2) 12px 18px,transparent 18px 24px,var(--led3) 24px 30px,transparent 30px 36px);
  filter:drop-shadow(0 0 6px var(--led1));background-size:72px 4px;animation:chase 1.6s linear infinite}
@keyframes chase{to{background-position:72px 0}}
.brand{text-shadow:0 0 14px rgba(255,61,242,.6)}
nav a::after{background:linear-gradient(90deg,var(--led1),var(--led2),var(--led3));box-shadow:0 0 8px var(--led2)}
/* neon headings */
.hero .display{text-shadow:0 0 22px rgba(255,61,242,.55),0 0 60px rgba(53,232,255,.25)}
.hero .display span:last-child{color:var(--led2);text-shadow:0 0 18px var(--led2),0 0 54px rgba(53,232,255,.5)}
.eyebrow,.hero .sub,.fact b{color:var(--led2);text-shadow:0 0 10px rgba(53,232,255,.7)}.eyebrow::before{background:linear-gradient(90deg,transparent,var(--led2))}
h2.glow,h1.glow{text-shadow:0 0 20px rgba(255,61,242,.45)}
/* LED buttons */
.btn,.btn:hover{background:#fff;color:#1a0d36;box-shadow:0 0 0 2px var(--led1),0 0 22px rgba(255,61,242,.65)}
.btn:hover{box-shadow:0 0 0 2px var(--led2),0 0 30px rgba(53,232,255,.8)}
.btn.ghost,.btn.world{background:rgba(255,255,255,.06);color:#fff;box-shadow:0 0 0 1px rgba(53,232,255,.7),0 0 16px rgba(53,232,255,.35)}
.btn.ghost:hover,.btn.world:hover{background:rgba(53,232,255,.14);box-shadow:0 0 0 1px var(--led2),0 0 26px rgba(53,232,255,.7)}
/* cards: a chasing LED line along the top edge */
.card,.fact,.player,.band{position:relative;overflow:hidden;border-color:rgba(255,61,242,.28)}
.card::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(90deg,var(--led1) 0 8px,transparent 8px 16px,var(--led2) 16px 24px,transparent 24px 32px);background-size:64px 3px;animation:chase 2.4s linear infinite;opacity:.85}
.card:hover{border-color:var(--led2);box-shadow:0 0 0 1px var(--led2),0 0 34px rgba(53,232,255,.35),0 16px 40px rgba(0,0,0,.5)}
.card .pic.art{background:radial-gradient(circle at 50% 50%,#3a1a78,#14082e)}
.chip{border-color:rgba(255,61,242,.5);color:#ffd9fb;background:rgba(255,61,242,.12)}
.marquee div{-webkit-text-stroke:1px rgba(53,232,255,.7)}.marquee b{color:var(--led1);text-shadow:0 0 10px var(--led1)}
blockquote{border-left-color:var(--led2)}
.grid a,.strip img,.banner,.side{border-color:rgba(53,232,255,.35)}
.grid a:hover img{box-shadow:0 0 28px rgba(255,61,242,.6)}
/* the infinity mirror: LED frames receding into the distance */
.infinity{position:relative;width:min(470px,84vw);aspect-ratio:1;margin-left:auto;isolation:isolate;animation:hue 16s linear infinite}
.infinity i{position:absolute;inset:calc(var(--n) * 4.4%);border:4px dotted var(--led1);border-radius:calc(7% - var(--n) * .4%);
  box-shadow:0 0 14px var(--led1),inset 0 0 14px var(--led1);opacity:calc(1 - var(--n) * .06);
  animation:depth 5s ease-in-out infinite;animation-delay:calc(var(--n) * -.38s)}
.infinity i:nth-child(3n+2){border-color:var(--led2);box-shadow:0 0 14px var(--led2),inset 0 0 14px var(--led2)}
.infinity i:nth-child(3n+3){border-color:var(--led3);box-shadow:0 0 14px var(--led3),inset 0 0 14px var(--led3);border-style:solid;border-width:2px}
.infinity .core{position:absolute;inset:40%;border-radius:50%;background:radial-gradient(circle,#fff 0,rgba(255,255,255,.75) 18%,rgba(255,61,242,.4) 48%,transparent 72%);animation:pulsecore 3s ease-in-out infinite}
.infinity::before{content:"";position:absolute;inset:-6%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(255,61,242,.28),rgba(53,232,255,.12) 50%,transparent 70%);filter:blur(14px)}
@keyframes depth{0%,100%{transform:scale(1)}50%{transform:scale(.955)}}
@keyframes pulsecore{0%,100%{transform:scale(.85);opacity:.8}50%{transform:scale(1.15);opacity:1}}
@keyframes hue{to{filter:hue-rotate(360deg)}}
.pagehero .infinity{width:min(330px,70vw)}
.art svg{filter:none}
.photon,.wisp{display:none}
@media (prefers-reduced-motion:reduce){.infinity,.infinity i,.infinity .core,.top::after,.card::after,body::after{animation:none!important}}