/* ═══════════════════════════════════════════════════════════════════
   Kaevor Academy — Cream-white theme (2026-10-08)
   Loads AFTER styles.css + design-system.css. Re-themes the academy
   (chrome + shared components) from the dark site to the cream identity.
   Navy ink on warm cream, one indigo accent, gold for premium moments.
═══════════════════════════════════════════════════════════════════ */
:root{
  --paper:#f7f3ea; --paper-2:#efe7d7; --card:#ffffff;
  --ink:#0f1c3f; --ink-soft:#33405c; --muted:#4f5a73;
  --line:rgba(15,28,63,.12); --line-2:rgba(15,28,63,.07);
  --accent:#6c47ff; --accent-d:#553bcf;
  --gold:#b8872b; --gold-br:#e0a73a; --good:#1f9d57;
  --a-shadow:0 20px 48px -24px rgba(15,28,63,.20), 0 6px 16px -8px rgba(15,28,63,.12);
  --a-shadow-sm:0 10px 26px -16px rgba(15,28,63,.22);
  --a-radius:16px; --a-radius-lg:22px;
}

/* ── Canvas ───────────────────────────────────────────────────────── */
body{
  background:var(--paper) !important;
  background-attachment:scroll !important;
  color:var(--ink-soft) !important;
}
body::before{ display:none !important; }   /* kill the dark diamond grain */
::selection{ background:rgba(108,71,255,.18); color:var(--ink); }

h1,h2,h3,h4,h5,h6{ color:var(--ink); }
.muted,.muted2{ color:var(--muted) !important; }
a{ color:var(--ink); }

/* ── Header / nav ─────────────────────────────────────────────────── */
.header{
  background:rgba(247,243,234,.82) !important;
  backdrop-filter:blur(18px) saturate(120%);
  -webkit-backdrop-filter:blur(18px) saturate(120%);
  border-bottom:1px solid var(--line);
}
.header::after{ display:none !important; }
.brand-logo{ filter:none; }
.nav-link{ color:var(--ink) !important; font-weight:600; opacity:.9; }
.nav-link:hover,.nav-link.active{ color:var(--accent) !important; opacity:1; }
.dd{ background:var(--card) !important; border:1px solid var(--line) !important; box-shadow:var(--a-shadow) !important; }
.dd-title{ color:var(--muted) !important; }
.dd-link{ color:var(--ink) !important; }
.dd-link:hover{ color:var(--accent) !important; background:rgba(108,71,255,.06) !important; }
.lang-link{ color:var(--ink) !important; border:1px solid var(--line); }
.lang-link.is-active{ background:var(--ink) !important; color:#fff !important; border-color:var(--ink); }
.lang-link .code{ color:inherit; }
.icon-btn{ color:var(--ink) !important; }
.icon-lines, .icon-lines::before, .icon-lines::after{ background:var(--ink) !important; }
.icon-x::before, .icon-x::after{ background:var(--ink) !important; }

/* top-right CTA → gold (Royal Ink reference) */
.nav-cta{
  background:var(--gold-br) !important; color:#1a1300 !important;
  border:1px solid rgba(0,0,0,.06) !important; font-weight:700;
  box-shadow:0 10px 24px -14px rgba(224,167,58,.7) !important;
}
.nav-cta:hover{ background:#d49a2f !important; transform:translateY(-1px); }

/* ── Buttons ──────────────────────────────────────────────────────── */
.btn-primary{
  background:var(--ink) !important; color:#fff !important;
  box-shadow:0 14px 30px -16px rgba(15,28,63,.6) !important;
}
.btn-primary:hover{ background:#16254e !important; }
.btn-ghost{
  background:transparent !important; color:var(--ink) !important;
  border:1px solid var(--line) !important;
}
.btn-ghost:hover{ border-color:var(--ink) !important; background:rgba(15,28,63,.03) !important; }

/* ── Mobile menu ──────────────────────────────────────────────────── */
.mobile{ background:var(--paper) !important; color:var(--ink) !important; }
.mobile-title{ color:var(--ink) !important; }
.mobile-links a{ color:var(--ink) !important; }
.mobile .mgroup{ background:var(--card); border:1px solid var(--line); border-radius:var(--a-radius); }
.mobile .mtitle{ color:var(--muted) !important; }
.mobile-foot .muted{ color:var(--muted) !important; }

/* ── Footer ───────────────────────────────────────────────────────── */
.footer{
  background:var(--ink) !important; color:#cfd6e6 !important;
  border-top:1px solid var(--line);
}
.footer h4{ color:#fff !important; }
.footer a{ color:#b9c2d6 !important; }
.footer a:hover{ color:#fff !important; }
.footer .muted,.footer .small{ color:#8c97b2 !important; }
.footer .brand-logo{ filter:brightness(0) invert(1); opacity:.92; }
.to-top{ background:rgba(255,255,255,.08) !important; color:#fff !important; border:1px solid rgba(255,255,255,.14) !important; }

/* ── Glass / generic surfaces used by academy ─────────────────────── */
.glass{
  background:var(--card) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:1px solid var(--line) !important;
  box-shadow:var(--a-shadow-sm) !important;
}
.glass::before,.glass::after{ display:none !important; }
.glass:hover{ border-color:rgba(108,71,255,.35) !important; box-shadow:var(--a-shadow) !important; }

/* progress scroll bar stays indigo (fine on cream) */

/* reduced motion already respected in base */

/* ── Mobile guards (2026-10-08) ── */
@media (max-width:600px){
  html,body{ overflow-x:hidden !important; max-width:100%; }
  .tscroll{ overflow-x:auto !important; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; max-width:100%; }
  .tscroll-item{ flex:0 0 86% !important; scroll-snap-align:start; }
  /* collapse any 3/4-up inline grids a page may use */
  .steps, .tiers{ grid-template-columns:1fr !important; }
}