/* ==========================================================================
   NOVA APEX DESIGN SYSTEM - TOKENS & FOUNDATIONS
   Awwwards-Tier Cosmic Holographic Glassmorphism
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------------
     Colors: Cosmic Void & Surfaces
     ------------------------------------------------------------------------ */
  --bg-deep-void: #0A0A0A;
  --bg-surface-obsidian: #111111;
  --bg-surface-elevated: #161616;
  --bg-nav-island: rgba(14, 14, 14, 0.85);
  --bg-glass-card: rgba(18, 18, 18, 0.78);
  --bg-glass-highlight: rgba(255, 255, 255, 0.04);
  --bg-input-field: rgba(255, 255, 255, 0.05);
  --bg-input-focus: rgba(255, 255, 255, 0.08);
  --bg-overlay-scrim: rgba(5, 5, 5, 0.88);

  /* ------------------------------------------------------------------------
     Colors: Tiers, Gamification & Brand Accents
     ------------------------------------------------------------------------ */
  --accent-electric-blue: #3FD6D6;
  --accent-blue-hover: #32bebe;
  --accent-blue-glow: rgba(63, 214, 214, 0.35);

  /* Podium Metal Insignias & Auroras */
  --tier-gold: #ffd100;
  --tier-gold-amber: #ff9d00;
  --tier-gold-glow: rgba(255, 209, 0, 0.35);
  --tier-gold-radial: radial-gradient(circle, rgba(255, 209, 0, 0.45) 0%, rgba(255, 140, 0, 0.15) 60%, transparent 80%);

  --tier-cyan: #3FD6D6;
  --tier-cyan-glow: rgba(63, 214, 214, 0.35);
  --tier-cyan-radial: radial-gradient(circle, rgba(63, 214, 214, 0.4) 0%, rgba(63, 214, 214, 0.12) 60%, transparent 80%);

  --tier-bronze: #f79824;
  --tier-bronze-dark: #d16213;
  --tier-bronze-glow: rgba(247, 152, 36, 0.3);
  --tier-bronze-radial: radial-gradient(circle, rgba(247, 152, 36, 0.4) 0%, rgba(209, 98, 19, 0.12) 60%, transparent 80%);

  --accent-emerald-green: #00ce67;
  --accent-emerald-glow: rgba(0, 206, 103, 0.35);
  --accent-destructive-red: #ff334b;
  --accent-red-glow: rgba(255, 51, 75, 0.25);

  /* ------------------------------------------------------------------------
     Official Deise Imóveis Brand Identity Tokens
     (Guia oficial: preto #0A0A0A, branco #FFFFFF, ciano ação #3FD6D6)
     ------------------------------------------------------------------------ */
  --brand-black: #0A0A0A;
  --brand-black-surface: #111111;
  --brand-black-elevated: #161616;
  --brand-white: #FFFFFF;
  --brand-cyan: #3FD6D6;
  --brand-cyan-glow: rgba(63, 214, 214, 0.35);
  --brand-cyan-subtle: rgba(63, 214, 214, 0.12);
  --brand-font-script: 'Caveat', cursive;

  /* ------------------------------------------------------------------------
     Colors: Typography Hierarchy
     ------------------------------------------------------------------------ */
  --text-pure-white: #ffffff;
  --text-secondary: #f4f7ff;
  --text-muted: #aeb6d1;
  --text-dim: #626b8a;
  --text-disabled: #444c66;

  /* ------------------------------------------------------------------------
     Double-Bezel Architecture & Concentric Borders
     ------------------------------------------------------------------------ */
  --border-glass-subtle: 1px solid rgba(255, 255, 255, 0.08);
  --border-glass-active: 1px solid rgba(255, 255, 255, 0.18);
  --border-bezel-outer: 1px solid rgba(255, 255, 255, 0.06);
  --border-gold-glow: 1px solid rgba(255, 209, 0, 0.35);
  --border-cyan-glow: 1px solid rgba(0, 238, 255, 0.35);
  --border-bronze-glow: 1px solid rgba(247, 152, 36, 0.35);

  /* ------------------------------------------------------------------------
     Concentric Radii System
     ------------------------------------------------------------------------ */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 9999px;

  /* ------------------------------------------------------------------------
     Shadows & Atmospheric Glows
     ------------------------------------------------------------------------ */
  --shadow-ambient: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
  --shadow-elevated: 0 20px 50px -15px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.05);
  --shadow-modal: 0 25px 80px -20px rgba(0, 0, 0, 0.85), 0 0 40px rgba(0, 110, 219, 0.15);
  --shadow-text-glow: 0 2px 14px rgba(0, 0, 0, 0.8);
  --glow-button: drop-shadow(0 4px 16px rgba(0, 110, 219, 0.45));

  /* ------------------------------------------------------------------------
     Typography
     ------------------------------------------------------------------------ */
  --font-display: 'Outfit', -apple-system, sans-serif;
  --font-body: 'Plus Jakarta Sans', -apple-system, sans-serif;

  /* ------------------------------------------------------------------------
     Motion Choreography (Real Mass Spring Physics)
     ------------------------------------------------------------------------ */
  --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-smooth: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 0.15s var(--ease-spring);
  --transition-normal: 0.3s var(--ease-spring);
  --transition-slow: 0.6s var(--ease-spring);
  --transition-reveal: 0.8s var(--ease-spring);
}