/* ─────────────────────────────────────────────────────────────
   site.css — shared base for /resources/* pages.
   Tokens, body, nav, footer, buttons. Mirrors the inline CSS
   in /index.html. Existing index/privacy/terms keep their
   inline styles unchanged.
   ───────────────────────────────────────────────────────────── */

:root {
  --bg-deep: #070A12;
  --bg-primary: #0B0F1A;
  --bg-card: #101624;
  --bg-card-hover: #151C2E;
  --bg-surface: #0E1320;
  --text-primary: #FFFFFF;
  --text-secondary: #A0ABBE;
  --text-dim: #5A6A80;
  --accent: #4B8BFF;
  --accent-light: #6BA1FF;
  --accent-glow: rgba(75, 139, 255, 0.10);
  --accent-glow-strong: rgba(75, 139, 255, 0.18);
  --accent-border: rgba(75, 139, 255, 0.25);
  --border: rgba(255, 255, 255, 0.06);
  --border-hover: rgba(255, 255, 255, 0.10);
  --sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --max-w: 1140px;
  --measure: 720px;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg-deep);
  color: var(--text-primary);
  font-family: var(--sans);
  font-weight: 300;
  font-size: 15px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* ── NAV ── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  padding: 1.1rem 2.5rem;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(7, 10, 18, 0.8);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  transition: all 0.3s ease;
}
nav.scrolled { padding: 0.8rem 2.5rem; background: rgba(7, 10, 18, 0.95); }

.nav-mark { text-decoration: none; display: flex; align-items: center; }
.nav-mark img { height: 22px; transition: opacity 0.2s; }
.nav-mark:hover img { opacity: 0.85; }

.nav-links { display: flex; align-items: center; gap: 2rem; list-style: none; }
.nav-links a {
  font-size: 0.88rem; font-weight: 500; color: var(--text-secondary);
  text-decoration: none; letter-spacing: 0.02em; transition: color 0.2s;
}
.nav-links a:hover { color: var(--text-primary); }
.nav-links a[aria-current="page"] { color: var(--text-primary); }

/* ── BUTTONS ── */
.btn {
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.65rem 1.5rem; font-family: var(--sans); font-weight: 600;
  font-size: 0.82rem; letter-spacing: 0.02em; border-radius: 6px;
  text-decoration: none; cursor: pointer; transition: all 0.25s ease; border: none;
}
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(75, 139, 255, 0.25);
  background: var(--accent-light);
}
.btn-ghost {
  background: transparent; color: var(--text-secondary);
  border: 1px solid var(--border-hover);
}
.btn-ghost:hover { color: var(--text-primary); border-color: var(--accent-border); }
.btn-large { padding: 0.8rem 2rem; font-size: 0.9rem; }

/* ── CONTAINER ── */
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 2.5rem; }

/* ── FOOTER ── */
footer {
  padding: 2rem 2.5rem;
  border-top: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center;
}
.footer-l { font-size: 0.75rem; color: var(--text-dim); }
.footer-r { display: flex; gap: 1.8rem; list-style: none; }
.footer-r a {
  font-size: 0.75rem; color: var(--text-dim); text-decoration: none;
  transition: color 0.2s;
}
.footer-r a:hover { color: var(--text-secondary); }

/* ── SCROLL REVEAL ── */
.rv { opacity: 0; transform: translateY(24px); transition: all 0.65s cubic-bezier(0.25,0.46,0.45,0.94); }
.rv.vis { opacity: 1; transform: translateY(0); }
.rv-d1 { transition-delay: 0.08s; }
.rv-d2 { transition-delay: 0.16s; }
.rv-d3 { transition-delay: 0.24s; }
.rv-d4 { transition-delay: 0.32s; }

/* ── RESPONSIVE ── */
@media (max-width: 960px) {
  nav { padding: 0.8rem 1.5rem; }
  .nav-links { display: none; }
  .container { padding: 0 1.5rem; }
  footer { flex-direction: column; gap: 0.8rem; text-align: center; }
}