/* ═══════════════════════════════════════════════════════════════════
   AstroKamya™ · VISUAL POLISH v2.0 — Crisp & Striking Override
   ═══════════════════════════════════════════════════════════════════
   Loaded LAST — enforces:
   ✓ ZERO blur (backdrop-filter: none) — crisp, sharp surfaces
   ✓ ZERO text shadows — razor-sharp typography
   ✓ Refined deep background — harmonized with existing palette
   
   DESIGN RATIONALE (Research-backed):
   ─────────────────────────────────────
   Background: #0A0618 → #0D0A1A (Deep Cosmic Indigo)
   
   Why #0D0A1A?
   • Color Psychology: Deep indigo-black represents cosmic depth, 
     spiritual wisdom, Saturn/Shani energy — perfect for Vedic astrology
   • Harmony: Same indigo undertone as existing surfaces (rgba(17,11,46,...))
     so cards, modals, navbar all blend seamlessly
   • Contrast: Provides 18:1 ratio against white text (#F0EAFF)
   • Gold pops: #FFB800 gold shines brilliantly against deep indigo
   • Violet harmony: #7C3AED shares the purple family — cohesive
   • Rose complement: #E8367C warm rose creates vibrant contrast
   • Premium feel: Deep desaturated purple > pure black (avoids "flat")
   • Night sky effect: Mimics the cosmos — the canvas for astrology
   
   Referenced: Co-Star (monochrome), The Pattern (deep charcoal),
   Sanctuary (deep indigo), color psychology for luxury spiritual brands
   ═══════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════
   1. GLOBAL: Kill ALL blur + text-shadow
   ═══════════════════════════════════════ */

/* Remove all frosted glass / backdrop blur */
*,
*::before,
*::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Remove all text shadows for crisp, sharp text */
*,
*::before,
*::after {
  text-shadow: none !important;
}


/* ═══════════════════════════════════════
   2. BACKGROUND — Deep Cosmic Indigo
   ═══════════════════════════════════════
   #0D0A1A — a near-black with subtle indigo 
   undertone that harmonizes perfectly with 
   the existing surface color rgba(17,11,46)
   ═══════════════════════════════════════ */

html, body {
  background: #0D0A1A !important;
}

/* Mesh background — enhanced "wow factor" deep cosmic indigo 
   Gradient pops more in the center and fades softly to deep black 
   to look premium and vast. */
#mesh-bg {
  background: radial-gradient(
    ellipse at 65% 30%, 
    #1A1145 0%,      /* Vibrant mystical indigo core from brand palette */
    #120B30 25%,     /* Mid cosmic tone */
    #0A0618 60%,     /* Base indigo-black */
    #05030C 100%     /* Absolute deep void edge */
  ) !important;
}

/* ═══════════════════════════════════════════════════════
   SCANNER STREAM — TRANSPARENCY FIX (v2)
   Goal: scanner floats over ONE continuous global background.
   Beam glow PRESERVED. No double-screen on canvases.
   ═══════════════════════════════════════════════════════ */

/* 1. Root wrapper — fully transparent, no stacking isolation */
#scanner-stream,
.scanner-stream-container {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  isolation: auto !important;
}

/* 2. Kill the nebula ::before pseudo (was a 1200px radial-gradient block) */
.scanner-stream-container::before,
.scanner-stream-container::after {
  display: none !important;
  content: none !important;
}

/* 3. Card line wrap — the 420px absolute div; MUST be fully transparent
   so it doesn't paint a dark rect over the global haze */
.scs-card-line-wrap {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  isolation: auto !important;
}

/* 4. Starfield canvas — transparent background only.
   NOTE: do NOT add mix-blend-mode here; the JS already uses
   globalCompositeOperation='screen' on the canvas context directly. */
.scs-starfield-canvas {
  background: transparent !important;
}

/* 5. Beam particle canvas — transparent background only.
   Do NOT add mix-blend-mode:screen at the element level — the JS draws with
   ctx.globalCompositeOperation='screen' internally; double-screen would kill it. */
.scs-scanner-canvas {
  background: transparent !important;
}

/* 6. Scanner beam line — DO NOT set background here!
   The beam gradient IS the background of this div.
   Only ensure it doesn't create an opaque stacking layer below. */
/* .scs-scanner-line — intentionally NOT overridden here */

/* CRITICAL: Kill mesh orbs — they use filter: blur(120px) 
   (not backdrop-filter) which creates the pink/rose haze.
   Our global backdrop-filter:none doesn't affect these. */
.mesh-orb,
.orb-1, .orb-2, .orb-3, .orb-4, .orb-5 {
  display: none !important;
}


/* ═══════════════════════════════════════
   3. SURFACE COMPENSATION
   ═══════════════════════════════════════
   Since blur is removed, glass cards lose 
   their frosted look. We increase opacity 
   so cards remain distinct from background.
   ═══════════════════════════════════════ */

/* Glass cards → solid-ish surfaces */
.glass-card {
  background: rgba(17, 11, 46, 0.85) !important;
}
.glass-card-elevated {
  background: rgba(17, 11, 46, 0.92) !important;
}
.glass-card-recessed {
  background: rgba(17, 11, 46, 0.70) !important;
}

/* Intent cards */
.intent-card {
  background: rgba(17, 11, 46, 0.80) !important;
}

/* Pricing cards */
.pc {
  background: rgba(17, 11, 46, 0.85) !important;
}

/* Testimonial cards */
.t-card {
  background: rgba(17, 11, 46, 0.80) !important;
}

/* FAQ items */
.faq-item {
  background: rgba(17, 11, 46, 0.80) !important;
}

/* Input/form card */
.input-card {
  background: rgba(17, 11, 46, 0.90) !important;
}

/* Infographic panel */
.infographic-panel {
  background: rgba(17, 11, 46, 0.90) !important;
}

/* Step items */
.step-item {
  background: rgba(17, 11, 46, 0.80) !important;
}

/* SoulSync bento cards */
.ss-bento-card {
  background: rgba(17, 11, 46, 0.80) !important;
}

/* Feature bento cards */
.fb-card {
  background: rgba(17, 11, 46, 0.80) !important;
}

/* Chat box */
.chat-box {
  background: rgba(17, 11, 46, 0.90) !important;
}

/* Orbital nodes */
.orbital-node {
  background: rgba(13, 10, 26, 0.92) !important;
}


/* ═══════════════════════════════════════
   4. NAVBAR — Solid (no blur)
   ═══════════════════════════════════════ */

#nav.scrolled {
  background: rgba(13, 10, 26, 0.95) !important;
}

/* Mobile nav drawer */
.ndd,
.nav-dropdown {
  background: rgba(13, 10, 26, 0.98) !important;
}

/* Hero pill & trust bar */
.hero-pill {
  background: rgba(17, 11, 46, 0.75) !important;
}
.hero-personal {
  background: rgba(17, 11, 46, 0.60) !important;
}
.ht-item {
  background: rgba(17, 11, 46, 0.50) !important;
}

/* Hero eyebrow */
.hero-eyebrow {
  background: rgba(255,184,0, 0.06) !important;
}


/* ═══════════════════════════════════════
   5. FOOTER — Harmonized
   ═══════════════════════════════════════ */

footer, .footer, #footer {
  background: #0A0818 !important;
}


/* ═══════════════════════════════════════
   6. SPLASH SCREEN — Match
   ═══════════════════════════════════════ */

.splash-screen {
  background: #0D0A1A !important;
}


/* ═══════════════════════════════════════
   7. MODALS & OVERLAYS — Solid dark
   ═══════════════════════════════════════ */

.modal,
.modal-overlay,
[class*="modal-content"] {
  background: rgba(13, 10, 26, 0.98) !important;
}

/* Profile dropdown */
.profile-menu {
  background: rgba(17, 11, 46, 0.98) !important;
}

/* Back to top */
.back-to-top {
  background: rgba(17, 11, 46, 0.92) !important;
}

/* Scanner stream planet cards — DO NOT override background here.
   Original scanner-stream.css glass gradient (rgba 0.65→0.90) is correct.
   Overriding with solid rgba(17,11,46,0.85) was blocking the volumetric haze. */

/* Demo chart badge */
.demo-chart-badge {
  background: rgba(13, 10, 26, 0.90) !important;
}

/* Orbital pill */
.oc-pill {
  background: rgba(17, 11, 46, 0.80) !important;
}
