/* ============================================================
   CodeAugs — variables.css
   Design tokens: colours, typography, spacing, radii, shadows
   ============================================================ */
:root{
  /* Brand */
  /* ============================================================
     🔒 CODEAUGS OFFICIAL LANDMARK — DESIGN TOKEN DEPENDENCIES
     STATUS: PERMANENTLY LOCKED
     DO NOT MODIFY, REDESIGN, REMOVE, REPLACE, OR REINTERPRET.
     Changes require explicit CodeAugs design-system authorization.
     ============================================================ */
  --primary:#00E5FF;
  --accent:#A855F7;
  --bg:#060814;
  --secondary:#CBD5E1;
  --white:#FFFFFF;
  /* ============================================================
     🔒 END LOCKED CODEAUGS LANDMARK
     ============================================================ */

  /* Semantic colours */
  --color-bg:#060814;
  --color-bg-secondary:#0B1020;
  --color-surface:#111827;
  --color-surface-strong:rgba(17,24,39,.65);
  --color-border:rgba(255,255,255,.08);
  --color-border-strong:rgba(0,229,255,.35);
  --color-text:#F8FAFC;
  --color-text-secondary:#CBD5E1;
  --color-text-muted:#94A3B8;
  --color-link:#00E5FF;
  --color-accent:#A855F7;

  /* Surface aliases */
  --bg:var(--color-bg);
  --surface:var(--color-surface);
  --surface-2:var(--color-bg-secondary);
  --surface-3:rgba(255,255,255,.04);
  --glass:rgba(17,24,39,.65);
  --glass-strong:rgba(17,24,39,.85);
  --border:var(--color-border);
  --border-strong:var(--color-border-strong);

  /* Text aliases */
  --text:var(--color-text);
  --muted:var(--color-text-secondary);
  --dim:var(--color-text-muted);

  /* Gradients */
  --grad:linear-gradient(135deg,#00E5FF 0%,#4FD9FF 30%,#7A7DFF 65%,#A855F7 100%);
  --grad-soft:linear-gradient(135deg,rgba(0,229,255,.16),rgba(168,85,247,.16));
  --grad-text:linear-gradient(100deg,#00E5FF 10%,#8BE9FF 40%,#7C4DFF 90%);
  --glow:0 0 0 1px rgba(0,229,255,.25),0 12px 40px -12px rgba(0,229,255,.35);

  /* Shadows */
  --shadow:0 12px 32px -16px rgba(0,0,0,.75);
  --shadow-soft:0 14px 42px -20px rgba(0,0,0,.55);
  --shadow-lg:0 32px 70px -30px rgba(0,0,0,.85);
  --shadow-card:0 24px 58px -30px rgba(0,0,0,.55);

  /* Page accents */
  --navbar-bg:rgba(11,15,25,.72);
  --navbar-bg-scrolled:rgba(11,15,25,.92);
  --hero-overlay-strong:rgba(11,15,25,.82);
  --hero-overlay-soft:rgba(11,15,25,.55);

  /* Shape & rhythm */
  --radius-sm:10px;
  --radius:16px;
  --radius-lg:24px;
  --radius-pill:999px;
  --container:1240px;
  --container-wide:1560px;
  --nav-h:72px;
  --utility-h:44px;
  --section-y:clamp(3rem,6vw,6.5rem);

  /* Type */
  --font-display:'Space Grotesk','Segoe UI',system-ui,sans-serif;
  --font-body:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;

  /* Motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --t-fast:.18s var(--ease);
  --t:.3s var(--ease);

  /* Small refinements */
  --glass-opacity:0.045;
  --glass-strong-opacity:0.10;
  --card-padding:1.75rem;
  --card-radius:var(--radius-lg);
  --img-radius:12px;
  --btn-transition:.22s var(--ease);
  --btn-disabled:rgba(167,176,192,.12);
}

:root[data-color-scheme="light"]{
  --color-bg:#F8FAFC;
  --color-bg-secondary:#FFFFFF;
  --color-surface:#F1F5F9;
  --color-surface-strong:rgba(255,255,255,.75);
  --color-border:#E2E8F0;
  --color-border-strong:rgba(0,229,255,.35);
  --color-text:#0F172A;
  --color-text-secondary:#475569;
  --color-text-muted:#64748B;
  --color-link:#009DCC;
  --color-accent:#7E22CE;

  --bg:var(--color-bg);
  --surface:var(--color-surface);
  --surface-2:var(--color-bg-secondary);
  --surface-3:#F1F5F9;
  --glass:rgba(255,255,255,.75);
  --glass-strong:rgba(255,255,255,.94);
  --border:var(--color-border);
  --border-strong:var(--color-border-strong);

  --text:var(--color-text);
  --muted:var(--color-text-secondary);
  --dim:var(--color-text-muted);

  --navbar-bg:rgba(248,250,252,.92);
  --navbar-bg-scrolled:rgba(248,250,252,.96);
  --hero-overlay-strong:rgba(255,255,255,.92);
  --hero-overlay-soft:rgba(255,255,255,.72);
}

:root[data-color-scheme="system"]{
  --color-bg:#060814;
  --color-bg-secondary:#0B1020;
  --color-surface:#111827;
  --color-surface-strong:rgba(17,24,39,.65);
  --color-border:rgba(255,255,255,.08);
  --color-border-strong:rgba(0,229,255,.35);
  --color-text:#F8FAFC;
  --color-text-secondary:#CBD5E1;
  --color-text-muted:#94A3B8;
  --color-link:#00E5FF;
  --color-accent:#A855F7;

  --bg:var(--color-bg);
  --surface:var(--color-surface);
  --surface-2:var(--color-bg-secondary);
  --surface-3:rgba(255,255,255,.04);
  --glass:rgba(17,24,39,.65);
  --glass-strong:rgba(17,24,39,.85);
  --border:var(--color-border);
  --border-strong:var(--color-border-strong);

  --text:var(--color-text);
  --muted:var(--color-text-secondary);
  --dim:var(--color-text-muted);

  --navbar-bg:rgba(11,15,25,.72);
  --navbar-bg-scrolled:rgba(11,15,25,.92);
  --hero-overlay-strong:rgba(11,15,25,.82);
  --hero-overlay-soft:rgba(11,15,25,.55);
}

@media (prefers-color-scheme: light) {
  :root[data-color-scheme="system"]{
    --color-bg:#F8FAFC;
    --color-bg-secondary:#FFFFFF;
    --color-surface:#F1F5F9;
    --color-surface-strong:rgba(255,255,255,.75);
    --color-border:#E2E8F0;
    --color-border-strong:rgba(0,229,255,.35);
    --color-text:#0F172A;
    --color-text-secondary:#475569;
    --color-text-muted:#64748B;
    --color-link:#009DCC;
    --color-accent:#7E22CE;

    --bg:var(--color-bg);
    --surface:var(--color-surface);
    --surface-2:var(--color-bg-secondary);
    --surface-3:#F1F5F9;
    --glass:rgba(255,255,255,.75);
    --glass-strong:rgba(255,255,255,.94);
    --border:var(--color-border);
    --border-strong:var(--color-border-strong);

    --text:var(--color-text);
    --muted:var(--color-text-secondary);
    --dim:var(--color-text-muted);

    --navbar-bg:rgba(248,250,252,.92);
    --navbar-bg-scrolled:rgba(248,250,252,.96);
    --hero-overlay-strong:rgba(255,255,255,.92);
    --hero-overlay-soft:rgba(255,255,255,.72);
  }
}

:root[data-color-scheme="dark"]{
  color-scheme: dark;
}

:root[data-color-scheme="light"]{
  color-scheme: light;
}

:root[data-color-scheme="system"]{
  color-scheme: light dark;
}