/* ============================================================
   Riskora Wordmark — Shared across all surfaces.
   Mirrors the header logo in main site.html exactly so that
   dashboard / terminal / profile / waitlist all render identically.
   ============================================================ */

@import url("https://fonts.cdnfonts.com/css/ethnocentric");
@import url("https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;600;700&family=Orbitron:wght@400;500;600;700&display=swap");

@font-face {
  font-family: "Ethnocentric";
  src: url("/fonts/Ethnocentric-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.logo,
.loading-logo {
  font-family: "Ethnocentric Rg", "Ethnocentric", "Chakra Petch", "Orbitron", system-ui, sans-serif;
  font-weight: 400;
  font-size: 1.5rem;
  letter-spacing: 5px;
  text-transform: uppercase;
  line-height: 1;
  color: #ffffff;
  -webkit-text-stroke: 0.3px rgba(255, 255, 255, 0.8);
  text-shadow:
    0 0 10px rgba(255, 255, 255, 0.25),
    0 0 30px rgba(213, 0, 0, 0.2),
    0 0 60px rgba(213, 0, 0, 0.08);
  white-space: nowrap;
}

/* RISK text — white */
.logo .logo-risk,
.loading-logo .logo-risk {
  color: #ffffff;
}

/* ORA text — red gradient (supports both <span>ORA</span> and <span class="logo-ora">) */
.logo span,
.logo .logo-ora,
.loading-logo span,
.loading-logo .logo-ora,
.headline-gradient {
  display: inline-block;
  background: linear-gradient(135deg, #ff4444, #ff0000, #cc0000);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  filter:
    drop-shadow(0 0 6px rgba(255, 0, 0, 0.7))
    drop-shadow(0 0 20px rgba(213, 0, 0, 0.4));
}

/* When the logo is also used as a "big" hero on plan gates / loading screens */
.logo.logo-lg,
.loading-logo.logo-lg {
  font-size: 2.5rem;
  letter-spacing: 7px;
}