/* ============================================================
   base.css — RhaiTech Solutions
   Shared design tokens + page reset used by BOTH the public
   site (/index.html) and the admin app (/admin/index.html).
   Keep this file limited to things every page needs.
   ============================================================ */
  :root {
    --bg: #020b10;
    --bg2: #04141e;
    --panel: #071a24;
    --accent: #00ffe0;
    --accent2: #ff4d6d;
    --accent3: #ffe066;
    --text: #c8e8f0;
    --text-dim: #4a7a8a;
    --border: rgba(0,255,224,0.15);
    --glow: 0 0 20px rgba(0,255,224,0.3);
    --glow-red: 0 0 20px rgba(255,77,109,0.3);
    --glow-gold: 0 0 20px rgba(255,224,102,0.3);
  }
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body {
    background: var(--bg);
    color: var(--text);
    font-family: 'Exo 2', sans-serif;
    font-weight: 400;
    overflow-x: hidden;
  }

  /* Grid bg */
  body::before {
    content: '';
    position: fixed; inset: 0;
    background-image:
      linear-gradient(rgba(0,255,224,0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,255,224,0.03) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none; z-index: 0;
  }
  /* Scanlines */
  body::after {
    content: '';
    position: fixed; inset: 0;
    background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.07) 2px, rgba(0,0,0,0.07) 4px);
    pointer-events: none; z-index: 0;
  }
  section, nav, footer, .stats-bar { position: relative; z-index: 1; }


/* ── Brand logo (icon + wordmark lockup) — used in the public
   nav/footer and in the admin header ── */
  /* ── Logo image (icon + text lockup on larger screens; icon-only on phones where the full wordmark doesn't leave room for the CTA button) ── */
  .logo-wrap { display:flex; align-items:center; gap:.55rem; }
  .logo-mark { height:34px; width:auto; display:block; filter:drop-shadow(0 0 6px rgba(0,255,224,.15)); }
  .footer-logo-wrap { display:flex; align-items:center; gap:.6rem; justify-content:center; }
  .footer-logo-mark { height:30px; width:auto; }
  @media(max-width:767px){
    .logo-wrap { flex-direction:column; align-items:flex-start; gap:.15rem; }
    .logo-mark { height:26px; }
    #navLogo { display:block; font-size:.52rem; letter-spacing:.5px; }

@keyframes blink { 0%,100% { opacity:1 } 50% { opacity:.25 } }