/* shared.css — Design tokens & base reset for all 30Elevate pages */

:root {
  scrollbar-gutter: stable;
  color-scheme: dark;

  /* Core palette */
  --bg: #090E1A;
  --surface: #0F172A;
  --accent: #3B82F6;
  --accent-light: #60A5FA;
  --dark: #F1F5F9;
  --muted: #94A3B8;
  --border: #1E293B;

  /* Extended */
  --hover-accent: #2563EB;
  --nav-bg: rgba(9,14,26,0.55);
  --nav-bg-mobile: rgba(9,14,26,0.95);
  --nav-bg-scrolled: rgba(9,14,26,0.8);
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background-color: var(--bg);
  color: var(--dark);
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  line-height: 1.65;
  overflow-x: hidden;
}

/* Typography */
h1, h2, h3 { font-family: 'Clash Display', 'Inter', sans-serif; text-wrap: balance; }
a { text-decoration: none; color: inherit; }
p { color: var(--muted); line-height: 1.7; }

/* Focus (a11y) */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Skip link */
.skip-link {
  position: absolute; top: -100%; left: 16px; z-index: 100001;
  background: var(--accent); color: #fff; padding: 8px 16px;
  border-radius: 8px; font-family: 'Clash Display', sans-serif;
  font-size: 0.85rem; font-weight: 500; text-decoration: none;
}
.skip-link:focus { top: 16px; }

/* Cookie banner */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:rgba(15,23,42,0.97);border-top:1px solid var(--border);backdrop-filter:blur(12px);padding:16px 24px;display:flex;align-items:center;justify-content:center;gap:16px;font-family:'Inter',sans-serif;font-size:0.85rem;color:var(--muted);transform:translateY(100%);transition:transform 0.4s ease}
.cookie-banner.cookie-visible{transform:translateY(0)}
.cookie-banner a{color:var(--accent);text-decoration:underline}
.cookie-accept{padding:8px 20px;background-color:var(--accent);background-image:radial-gradient(circle,rgba(255,255,255,0.06) 0.5px,transparent 0.5px);background-size:8px 8px;color:#fff;border:none;border-radius:10px;font-family:'Clash Display',sans-serif;font-weight:600;font-size:0.82rem;cursor:pointer;white-space:nowrap;transition:background-color 0.2s;min-height:44px;box-shadow:0 2px 12px rgba(59,130,246,0.2)}
.cookie-accept:hover{background-color:#2563EB}
@media(max-width:600px){.cookie-banner{flex-direction:column;text-align:center;gap:12px;padding:14px 18px 18px}}