/* =====================================================================
   THEME LAYER  —  "calm dark + glow"  (loaded LAST, overrides earlier files)
   Inspired by modern bot/dashboard sites: a settled deep-indigo background,
   soft ambient colour glows, glowing headline letters, big rounded buttons,
   flat frosted cards with hairline borders and a mobile-first layout.
   To go back to the old look, delete the <link> to css/theme.css in index.html.
   ===================================================================== */
:root{
  --navy:#0d0f21; --navy-2:#13162e; --navy-3:#191c3a;
  --glass-bg:linear-gradient(160deg, rgba(150,135,255,.065), rgba(90,110,220,.025) 60%);
  --glass-border:rgba(255,255,255,.10);
  --neu-bg:linear-gradient(160deg, rgba(150,135,255,.07), rgba(90,110,220,.03));
  --neu-border:rgba(255,255,255,.11);
  --nav-bg:rgba(13,15,33,.82);
  --panel-bg:rgba(21,23,48,.95);
  --card-bg:rgba(255,255,255,.03);
  --field-bg:rgba(255,255,255,.045);
  --footer-bg:rgba(13,15,33,.7);
  --line:rgba(255,255,255,.08);
  --shadow-soft:rgba(2,3,12,.45);
  --glow-a:rgba(90,168,236,.55);      /* blue glow  */
  --glow-b:rgba(139,92,246,.55);      /* purple glow */
  --glow-c:rgba(194,102,255,.40);     /* magenta glow */
}

/* ---------- settled background: deep indigo + soft ambient colour pools ---------- */
body{ background:var(--navy); }
.bg-fx{ background:
  radial-gradient(900px 560px at 6% -4%, rgba(70,120,235,.13), transparent 65%),
  radial-gradient(900px 620px at 100% 22%, rgba(130,95,240,.11), transparent 65%),
  radial-gradient(1000px 600px at 40% 108%, rgba(105,80,215,.09), transparent 65%),
  linear-gradient(180deg,#0d0f21 0%,#0e0f23 55%,#100f26 100%); }
.stars{ opacity:.16; }
.orb{ opacity:.10; filter:blur(24px); }
.orb1{ background:radial-gradient(circle,#3f86ff,transparent 70%) !important; } .orb2{ background:radial-gradient(circle,#9a5cff,transparent 70%) !important; } .orb3{ background:radial-gradient(circle,#6a5cff,transparent 70%) !important; }
.pl-orb{ opacity:.26 !important; } .pl-orb.o3{ opacity:.14 !important; }

/* ---------- glowing letters + glow pool behind every section title ---------- */
h1, h2, .section-head h2, .community-card h2{ filter:drop-shadow(0 0 18px rgba(120,110,255,.50)) drop-shadow(0 0 42px rgba(90,168,236,.28)); }
.section-head{ position:relative; isolation:isolate; }
.section-head::before{ content:''; position:absolute; left:50%; top:34px; width:min(560px,92%); height:150px; transform:translateX(-50%); z-index:-1; pointer-events:none;
  background:radial-gradient(closest-side, rgba(124,77,255,.30), rgba(58,143,224,.12) 55%, transparent 78%); filter:blur(26px); }
.head-rule{ box-shadow:0 0 16px var(--glow-b); }
.section-tag{ background:rgba(255,255,255,.04) !important; border:1px solid rgba(255,255,255,.13) !important; letter-spacing:1.8px; box-shadow:0 0 22px rgba(124,77,255,.14); }

/* ---------- hero: two-tone headline (white + glowing gradient) ---------- */
.hero-bg .slide{ filter:saturate(.7) brightness(.8) hue-rotate(8deg); }
.hero-bg::after{ background:
  radial-gradient(ellipse 60% 34% at 50% 40%, rgba(124,77,255,.28), transparent 70%),
  linear-gradient(to bottom, rgba(13,15,33,.84) 0%, rgba(13,15,33,.62) 42%, var(--navy) 100%); }
.hero h1.grad-text{ background:none !important; -webkit-text-fill-color:#fff; color:#fff; animation:none; filter:none;
  text-shadow:0 0 18px rgba(170,150,255,.85), 0 0 48px rgba(124,77,255,.70), 0 0 90px rgba(90,168,236,.45), 0 4px 22px rgba(0,0,0,.55); }
.hero .type-line{ filter:drop-shadow(0 0 20px rgba(139,92,246,.75)) drop-shadow(0 0 46px rgba(90,168,236,.35)); }
.hero p.lede{ color:#dde3f7; }
.hero .eyebrow{ color:#9cc8f5; letter-spacing:2px; text-shadow:0 0 18px rgba(90,168,236,.6); }
.hero-logo{ box-shadow:0 0 0 1px rgba(255,255,255,.1), 0 22px 60px rgba(0,0,0,.55), 0 0 60px rgba(124,77,255,.35); border-radius:14px; }

/* ---------- big rounded buttons (primary glows, secondary is an outline) ---------- */
.cta-pill{ border-radius:16px; padding:16px 30px; font-size:15.5px; letter-spacing:.2px; display:inline-flex; align-items:center; justify-content:center; gap:9px; }
.cta-pill.gold{ background:linear-gradient(120deg,#8f63ff,#6a3fe0 55%,#4f6df0); border:1px solid rgba(255,255,255,.22);
  box-shadow:0 12px 36px rgba(124,77,255,.50), 0 0 0 1px rgba(124,77,255,.4), inset 0 1px 0 rgba(255,255,255,.35); }
.cta-pill.gold:hover{ box-shadow:0 16px 46px rgba(124,77,255,.7), 0 0 0 1px rgba(160,130,255,.6), inset 0 1px 0 rgba(255,255,255,.4); }
.cta-pill.blue{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.18); color:var(--cream); box-shadow:none; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.cta-pill.blue:hover{ background:rgba(90,168,236,.12); border-color:rgba(90,168,236,.55); box-shadow:0 0 28px rgba(90,168,236,.25); }
.hero-chip{ display:inline-flex; align-items:center; gap:14px; margin:-18px auto 38px; padding:8px 20px 8px 10px; border-radius:40px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); font-size:14.5px; color:var(--cream-dim); }
.hero-chip b{ color:var(--cream); }
.hc-stack{ display:inline-flex; } .hc-stack i{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(145deg,rgba(139,92,246,.35),rgba(58,143,224,.25)); border:2px solid #0d1030; margin-left:-9px; }
.hc-stack i:first-child{ margin-left:0; } .hc-stack .icon{ width:17px; height:17px; }

/* ---------- cards: flat frosted, hairline border, rounder ---------- */
.glass{ border-radius:20px; box-shadow:0 18px 50px rgba(2,3,12,.45), inset 0 1px 0 rgba(255,255,255,.10); }
.mc-panel{ border-radius:20px; }
.glass::before{ background:linear-gradient(130deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,0) 32%); }
.glass:hover{ border-color:rgba(139,92,246,.38); }
.neu{ border-radius:14px; }

/* ---------- navigation: rounded-square controls ---------- */
.nav{ background:var(--nav-bg); -webkit-backdrop-filter:blur(16px) saturate(140%); backdrop-filter:blur(16px) saturate(140%); }
.nav-links a.active{ background:linear-gradient(135deg,#6a7cf0,#8b5cf6); box-shadow:0 6px 22px rgba(124,77,255,.5); border-radius:12px; }
.burger, .sound-toggle, .cmdk-trigger, .discord-cta{ border-radius:14px !important; }
.burger{ width:44px; height:44px; border:1px solid rgba(255,255,255,.12); }
.discord-cta{ background:linear-gradient(120deg,#8f63ff,#6a3fe0) !important; border:1px solid rgba(255,255,255,.2); box-shadow:0 8px 26px rgba(124,77,255,.45) !important; }

/* ---------- tabs / segmented controls: pill with glowing active state ---------- */
.seg{ border-radius:18px; background:rgba(255,255,255,.04); }
.seg-btn{ border-radius:14px !important; }
.seg-btn.active, .seg-btn[aria-pressed="true"], .seg-btn[aria-selected="true"]{ box-shadow:0 8px 26px rgba(124,77,255,.38) !important; }
.pl-stat{ border-radius:20px; }

/* ---------- phones: airy, full-width actions like a native app ---------- */
@media (max-width:640px){
  .hero{ padding:56px 0 40px; }
  .hero-ctas, .ab-ctas{ flex-direction:column; align-items:stretch; gap:12px; padding:0 4px; margin-bottom:34px; }
  .hero-ctas .cta-pill, .ab-ctas .cta-pill{ width:100%; padding:17px 22px; font-size:16px; border-radius:17px; }
  .hero-chip{ margin:-12px auto 30px; font-size:13.5px; padding-right:16px; text-align:left; }
  .section-head{ margin-bottom:30px; }
  .section-head::before{ top:20px; height:120px; }
  .glass, .mc-panel{ border-radius:18px; }
}
@media (prefers-reduced-motion: reduce){ .orb{ animation:none; } }

/* calmer rotating edge-light on the About panels */
.ab-hero::after, .ab-vision::after, .ab-final::after{ opacity:.16 !important; }

/* ---------- footer / nav tint to match the blue-purple base ---------- */
footer.site-foot{ background:linear-gradient(180deg, rgba(13,15,33,.5), rgba(14,15,36,.94) 55%, rgba(16,15,40,.97)); }
.mobile-menu-card{ background:linear-gradient(160deg, rgba(30,28,70,.97), rgba(15,16,38,.98)); }

/* ---------- ALL icons white (like the footer link icon) ---------- */
.icon{ filter:brightness(0) invert(1); }
.ab-ico .icon, .ab-bcard .icon{ filter:brightness(0) invert(1) drop-shadow(0 0 8px rgba(160,140,255,.7)); }
.foot-soc .icon, .section-tag .icon, .tag-pill .icon, .announce .icon{ filter:brightness(0) invert(1); }

/* ---------- hero logo: no visible box (soft glow that follows the logo's own shape) ---------- */
.hero-logo{ box-shadow:none !important; border-radius:0 !important; border:0 !important; background:none !important;
  filter:drop-shadow(0 6px 26px rgba(124,77,255,.55)) drop-shadow(0 0 2px rgba(0,0,0,.35)); }

/* ---------- phones: never auto-inflate or shift text; clip stray overflow ---------- */
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{ overflow-x:clip; }
.hero .eyebrow{ overflow-wrap:anywhere; }
.feat-icon img, img.mc-ico, .mc-ico, img.mc-tag-ico, .mc-tag-ico, .tab-block-ico, .mc-stat-ico, img.mc-stat-ico{ filter:drop-shadow(0 4px 10px rgba(0,0,0,0.6)) !important; -webkit-filter:drop-shadow(0 4px 10px rgba(0,0,0,0.6)) !important; mix-blend-mode:normal !important; opacity:1 !important; }
.connect-icon .icon, .connect-icon img{ filter:none !important; }

/* calmer decorative blobs on the About page */
.ab-blob{ opacity:.26 !important; }
.ab-blob.b3{ opacity:.16 !important; }
