@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;700&family=Rajdhani:wght@500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { 
  --ink: #FFFFFF; 
  --muted: #94a3b8; 
  --canvas: #020504; 
  --surface: rgba(8, 18, 15, 0.85); 
  --line: rgba(34, 255, 102, 0.16); 
  --mint: rgba(34, 255, 102, 0.08); 
  --mint-strong: #22ff66; 
  --neon-emerald: #00ff88; 
  --night: #030806; 
  --soft: rgba(34, 255, 102, 0.1); 
  --shadow: 0 20px 50px rgba(0,0,0,0.8); 
  --font-body: 'Inter', sans-serif; 
  --font-title: 'Space Grotesk', 'Rajdhani', sans-serif; 
  --font-display: 'Rajdhani', sans-serif; 
  --font-mono: 'JetBrains Mono', monospace; 
  --accent-cyan: #22ff66; 
  --accent-teal: #22ff66; 
}
html[data-theme='dark'] { 
  --ink: #FFFFFF; 
  --muted: #94a3b8; 
  --canvas: #020504; 
  --surface: rgba(8, 18, 15, 0.85); 
  --line: rgba(34, 255, 102, 0.16); 
  --mint: rgba(34, 255, 102, 0.08); 
  --mint-strong: #22ff66; 
  --neon-emerald: #00ff88; 
  --night: #030806; 
  --soft: rgba(34, 255, 102, 0.1); 
  --shadow: 0 20px 50px rgba(0,0,0,0.8); 
}
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { background:var(--canvas); color:var(--ink); font-family:var(--font-body); margin:0; min-height:100vh; } h1,h2,h3,h4,h5,h6,.font-title { font-family:var(--font-title); color:#FFFFFF; letter-spacing:-.03em; } .page-main { min-height:calc(100vh - 166px); width:100%; }
.container { max-width:1440px; }

/* Universal Modern Rounded Corners */
.btn, .btn-brand, .btn-quiet, .btn-premium, .nav-cta { border-radius: 8px !important; }
.form-control, .form-select, .form-control-custom { border-radius: 8px !important; }
.glass-panel, .glass-card, .feature-card, .hero-terminal, .mentor-card, .lesson-card { border-radius: 14px !important; }
img { border-radius: 8px; }

/* Cyber Grid Overlay */
.cyber-grid {
  background-size: 36px 36px;
  background-image: linear-gradient(to right, rgba(34, 255, 102, 0.035) 1px, transparent 1px),
                    linear-gradient(to bottom, rgba(34, 255, 102, 0.035) 1px, transparent 1px);
}

/* Glassmorphism Panel */
.glass-panel {
  background: rgba(10, 21, 18, 0.75);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(34, 255, 102, 0.15);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5), inset 0 0 15px rgba(34, 255, 102, 0.03);
}

.glass-panel-glow {
  background: rgba(10, 21, 18, 0.85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(34, 255, 102, 0.3);
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.6), 0 0 20px rgba(34, 255, 102, 0.12), inset 0 0 15px rgba(34, 255, 102, 0.05);
}

/* Glowing Neon Text */
.text-neon-glow {
  color: #22ff66 !important;
  text-shadow: 0 0 8px rgba(34, 255, 102, 0.5), 0 0 16px rgba(34, 255, 102, 0.25);
}

/* Cyber Pulse Border */
@keyframes cyber-border-glow {
  0%, 100% { border-color: rgba(34, 255, 102, 0.15); box-shadow: 0 0 10px rgba(34, 255, 102, 0.05); }
  50% { border-color: rgba(34, 255, 102, 0.45); box-shadow: 0 0 18px rgba(34, 255, 102, 0.15); }
}

.cyber-border-pulse {
  animation: cyber-border-glow 4s infinite ease-in-out;
}

/* Hologram Scanning Line Animation */
@keyframes hologram-scan {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}

.hologram-scanner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #22ff66, transparent);
  box-shadow: 0 0 8px #22ff66, 0 0 12px #22ff66;
  animation: hologram-scan 3.5s infinite linear;
  pointer-events: none;
  z-index: 5;
}

.site-header { border-bottom:1px solid var(--line); background:rgba(3, 7, 6, 0.85); backdrop-filter:blur(16px); position:sticky; top:0; z-index:20; } .nav-shell { height:78px; } .navbar-brand { color:var(--ink)!important; font:700 1.55rem var(--font-display); letter-spacing:-.04em; display:flex; align-items:center; gap:.5rem; text-decoration:none; } .brand-mark { align-items:center; background:var(--mint-strong); border-radius:50%; color:#093227; display:inline-flex; font:800 1rem var(--font-title); height:27px; justify-content:center; letter-spacing:-.1em; width:27px; } .brand-dot { color:var(--mint-strong); }.nav-link { color:var(--muted)!important; font-size:.82rem; font-weight:600; padding:.5rem 1rem!important; transition: color 0.2s; }.nav-link:hover { color:#22ff66!important; }.nav-actions { align-items:center; display:flex; gap:14px; }.nav-cta,.btn-brand { background:linear-gradient(135deg, #103622, #071910); border:1px solid rgba(34, 255, 102, 0.4); border-radius:6px; color:#22ff66!important; font-size:.8rem; font-weight:700; font-family:var(--font-display); letter-spacing:0.05em; text-transform:uppercase; padding:.75rem 1.25rem; text-decoration:none; box-shadow: 0 0 15px rgba(34, 255, 102, 0.15); transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); }.nav-cta:hover, .btn-brand:hover { background:linear-gradient(135deg, #184c30, #0c2b1c); border-color:#22ff66; box-shadow: 0 0 22px rgba(34, 255, 102, 0.35); transform:translateY(-2px); }.nav-cta i,.btn-brand i { margin-left:.3rem; }.navbar-toggler { border:0; color:var(--ink); }
.academy-hero { display:grid; gap:5.5rem; grid-template-columns:.85fr 1.15fr; min-height:605px; padding:80px 0 68px; align-items:center; }.eyebrow { align-items:center; color:#22ff66; display:flex; font-family:var(--font-mono); font-size:.68rem; font-weight:600; gap:.5rem; letter-spacing:.1em; text-transform:uppercase; }.eyebrow-dot { background:#22ff66; border-radius:50%; display:block; height:7px; width:7px; box-shadow: 0 0 8px #22ff66; }.hero-copy h1 { font-size:clamp(3.1rem,5.2vw,5.3rem); line-height:.98; margin:20px 0 23px; max-width:570px; }.hero-copy>p { color:var(--muted); font-size:1rem; line-height:1.8; max-width:485px; }.hero-actions { display:flex; gap:12px; margin-top:31px; }.btn-brand { padding:.9rem 1.25rem; }.btn-quiet { background:rgba(10, 21, 18, 0.6); border:1px solid rgba(34, 255, 102, 0.2); border-radius:6px; color:var(--ink); font-size:.8rem; font-weight:600; padding:.9rem 1rem; transition: all 0.3s; }.btn-quiet:hover { border-color:#22ff66; color:#22ff66; background:rgba(34, 255, 102, 0.08); }.hero-proof { align-items:center; display:flex; gap:13px; margin-top:46px; }.proof-avatars { display:flex; padding-left:8px; }.proof-avatars span { align-items:center; background:#103622; border:2px solid var(--canvas); border-radius:50%; color:#22ff66; display:flex; font-size:.55rem; font-weight:800; height:30px; justify-content:center; margin-left:-8px; width:30px; }.proof-avatars span:nth-child(2) { background:#0b2b1b; color:#22ff66; }.proof-avatars span:nth-child(3) { background:#14442b; color:#22ff66; }.hero-proof strong { display:block; font-size:.68rem; font-family:var(--font-mono); }.hero-proof small { color:var(--muted); display:block; font-size:.64rem; margin-top:2px; }
.hero-terminal { background:rgba(5, 11, 8, 0.9); border: 1px solid rgba(34, 255, 102, 0.2); border-radius:12px; box-shadow:0 0 35px rgba(34, 255, 102, 0.1); color:#eef7f1; overflow:hidden; padding:16px; position:relative; }.terminal-topbar { align-items:center; border-bottom:1px solid rgba(34,255,102,.15); color:#94a3b8; display:flex; font:600 .6rem var(--font-mono); justify-content:space-between; letter-spacing:.08em; padding:4px 5px 12px; }.terminal-brand { color:#fff; font:700 .78rem var(--font-display); letter-spacing:0.05em; }.terminal-brand i { color:#22ff66; margin-right:4px; }.market-live i { background:#22ff66; border-radius:50%; display:inline-block; height:6px; margin-right:4px; width:6px; box-shadow: 0 0 8px #22ff66; }.terminal-dots { letter-spacing:2px; }.terminal-body { display:grid; grid-template-columns:1.55fr .75fr; gap:12px; padding-top:13px; }.terminal-main { background:rgba(10, 21, 18, 0.85); border:1px solid rgba(34,255,102,.12); border-radius:8px; padding:18px; }.terminal-heading { align-items:start; display:flex; justify-content:space-between; }.terminal-heading small,.terminal-stats small,.mentor-card small,.lesson-card small { color:#94a3b8; display:block; font:600 .56rem var(--font-mono); letter-spacing:.08em; text-transform:uppercase; }.terminal-heading h2 { color:white; font:700 1.1rem var(--font-display); letter-spacing:-.02em; margin:5px 0 0; }.up-pill { background:rgba(34, 255, 102, 0.15); border:1px solid rgba(34, 255, 102, 0.3); border-radius:20px; color:#22ff66; font:700 .6rem var(--font-mono); padding:4px 8px; }.chart-area { height:200px; margin-top:15px; overflow:hidden; position:relative; }.chart-area svg { height:100%; position:absolute; width:100%; z-index:1; }.chart-grid { background-image:linear-gradient(rgba(34,255,102,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(34,255,102,.06) 1px,transparent 1px); background-size:20% 25%; height:100%; }.chart-label { background:#22ff66; border-radius:3px; color:#030706; font:700 .5rem var(--font-mono); padding:4px 6px; position:absolute; z-index:2; box-shadow: 0 0 10px rgba(34, 255, 102, 0.5); }.label-one { left:20%; top:34%; }.label-two { right:7%; top:18%; }.terminal-stats { border-top:1px solid rgba(34,255,102,.12); display:grid; grid-template-columns:repeat(3,1fr); margin-top:8px; padding-top:13px; }.terminal-stats strong { color:white; display:block; font:700 1rem var(--font-mono); letter-spacing:-.04em; margin-top:3px; }.terminal-stats strong span { color:#22ff66; font-size:.6rem; margin-left:2px; }.terminal-side { display:flex; flex-direction:column; gap:12px; }.terminal-banner,.mentor-card { background:linear-gradient(145deg,rgba(16, 54, 34, 0.8),rgba(7, 25, 16, 0.9)); border:1px solid rgba(34,255,102,.15); border-radius:8px; height:100%; min-height:190px; object-fit:cover; width:100%; }.mentor-card { display:flex; flex-direction:column; justify-content:end; padding:15px; }.mentor-icon { align-items:center; background:rgba(34, 255, 102, 0.15); border-radius:50%; color:#22ff66; display:flex; font-size:1.3rem; height:43px; justify-content:center; margin-bottom:auto; width:43px; border:1px solid rgba(34,255,102,.3); }.mentor-card strong { color:white; font-size:.9rem; line-height:1.22; margin:7px 0; font-family:var(--font-title); }.mentor-card span { color:#94a3b8; font-size:.62rem; font-family:var(--font-mono); }.lesson-card { align-items:center; background:rgba(10, 21, 18, 0.85); border:1px solid rgba(34,255,102,.12); border-radius:8px; color:var(--ink); display:flex; gap:9px; padding:11px; }.lesson-number { color:#22ff66; font:700 .9rem var(--font-mono); }.lesson-card strong { display:block; font-size:.68rem; font-family:var(--font-title); }.lesson-card small { color:#94a3b8; font-size:.5rem; font-family:var(--font-mono); }.lesson-card>i { margin-left:auto; color:#22ff66; }
.trusted-strip { border-bottom:1px solid var(--line); border-top:1px solid var(--line); background:rgba(5, 11, 8, 0.6); color:#94a3b8; display:flex; font:600 .68rem var(--font-mono); justify-content:space-between; letter-spacing:.12em; padding:22px 10px; }.trusted-strip i { background:#22ff66; border-radius:50%; height:6px; width:6px; box-shadow: 0 0 8px #22ff66; }.feature-section { padding:100px 0; position:relative; }.section-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:42px; }.section-heading h2 { font-size:clamp(2.3rem,3.8vw,3.8rem); font-family:var(--font-title); line-height:1.1; margin:14px 0 0; }.section-heading>p { color:var(--muted); font-size:.92rem; line-height:1.8; max-width:350px; }.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.feature-card { background:rgba(10, 21, 18, 0.75); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid rgba(34, 255, 102, 0.15); border-radius:12px; min-height:250px; padding:32px 28px; position:relative; transition:transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1); }.feature-icon { align-items:center; background:rgba(34, 255, 102, 0.1); border:1px solid rgba(34, 255, 102, 0.25); border-radius:10px; color:#22ff66; display:flex; font-size:1.2rem; height:46px; justify-content:center; width:46px; }.feature-count { color:#22ff66; font:700 .75rem var(--font-mono); position:absolute; right:28px; top:32px; opacity:0.85; }.feature-card h3 { font-size:1.35rem; font-weight:700; font-family:var(--font-title); margin:36px 0 12px; color:var(--ink); letter-spacing:-0.02em; }.feature-card p { color:var(--muted); font-size:.88rem; line-height:1.7; margin:0; }.footer-custom { border-top:1px solid var(--line); background:rgba(3, 7, 6, 0.95); color:var(--muted); font-size:.78rem; padding:60px 0 40px; }.footer-custom .container { width:100%; }.footer-custom .navbar-brand { font-size:1.2rem; font-family:var(--font-display); }.footer-custom .brand-mark { height:22px; width:22px; }
.social-circle { align-items:center; background:rgba(10, 21, 18, 0.85); border:1px solid rgba(34, 255, 102, 0.2); border-radius:50%; color:#22ff66; display:inline-flex; font-size:0.95rem; height:38px; justify-content:center; text-decoration:none; transition:all 0.3s cubic-bezier(0.16, 1, 0.3, 1); width:38px; }.social-circle:hover { background:rgba(34, 255, 102, 0.15); border-color:#22ff66; box-shadow:0 0 15px rgba(34, 255, 102, 0.35); color:#22ff66; transform:translateY(-2px); }.hover-neon { transition:color 0.2s ease, text-shadow 0.2s ease; }.hover-neon:hover { color:#22ff66!important; text-shadow:0 0 8px rgba(34, 255, 102, 0.4); }.faq-card { transition:all 0.3s cubic-bezier(0.16, 1, 0.3, 1); }.faq-card:hover { border-color:rgba(34, 255, 102, 0.4)!important; box-shadow:0 8px 30px rgba(0, 0, 0, 0.6), 0 0 18px rgba(34, 255, 102, 0.12)!important; }.transition-transform { transition:transform 0.3s ease; }.cursor-pointer { cursor:pointer; }
a[href^="tel"], a[href^="tel"]:hover, a[href^="tel"]:focus, a[href^="tel"]:visited { color: inherit !important; text-decoration: none !important; }
/* Standout Vibrant Button Styling */
.btn-checkout-proceed {
    background: linear-gradient(135deg, #00E676 0%, #00B0FF 100%) !important;
    border: 0 !important;
    border-radius: 8px !important;
    color: #03140c !important;
    font-weight: 800 !important;
    font-family: var(--font-display) !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    padding: 0.85rem 1.5rem !important;
    box-shadow: 0 4px 20px rgba(0, 230, 118, 0.4) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-checkout-proceed:hover {
    background: linear-gradient(135deg, #26ff8c 0%, #38c8ff 100%) !important;
    box-shadow: 0 6px 28px rgba(0, 230, 118, 0.65) !important;
    transform: translateY(-2px) !important;
    color: #000000 !important;
}

.btn-pay-emerald {
    background: linear-gradient(135deg, #22ff66 0%, #10b981 100%) !important;
    border: 1px solid #22ff66 !important;
    border-radius: 8px !important;
    color: #02190d !important;
    font-size: 1.15rem !important;
    font-weight: 800 !important;
    font-family: var(--font-display) !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding: 0.95rem 1.5rem !important;
    box-shadow: 0 4px 24px rgba(34, 255, 102, 0.45) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-pay-emerald:hover {
    background: linear-gradient(135deg, #45ff80 0%, #05d66b 100%) !important;
    border-color: #45ff80 !important;
    box-shadow: 0 6px 32px rgba(34, 255, 102, 0.7) !important;
    transform: translateY(-2px) !important;
    color: #000000 !important;
}

.btn-coupon-apply {
    background: linear-gradient(135deg, #06b6d4, #3b82f6) !important;
    border: 1px solid #38bdf8 !important;
    border-radius: 0 8px 8px 0 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-family: var(--font-display) !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    padding: 0.6rem 1.25rem !important;
    box-shadow: 0 0 15px rgba(6, 182, 212, 0.35) !important;
    transition: all 0.3s ease !important;
}

.btn-coupon-apply:hover {
    background: linear-gradient(135deg, #22d3ee, #60a5fa) !important;
    box-shadow: 0 0 22px rgba(6, 182, 212, 0.6) !important;
    color: #ffffff !important;
}

.badge-custom { background:var(--mint); border:1px solid var(--mint-strong); border-radius:99px; color:var(--accent-teal); font-size:.68rem; padding:.32rem .6rem; font-weight:700; }.badge-success, .badge.bg-success, .badge.text-success { background:rgba(34, 255, 102, 0.18) !important; border:1px solid rgba(34, 255, 102, 0.4) !important; border-radius:99px !important; color:#22ff66 !important; font-size:.75rem !important; font-weight:700 !important; padding:.35rem .75rem !important; display:inline-block !important; }.badge-warning, .badge.bg-warning, .badge.text-warning { background:rgba(245, 158, 11, 0.2) !important; border:1px solid rgba(245, 158, 11, 0.4) !important; border-radius:99px !important; color:#fbbf24 !important; font-size:.75rem !important; font-weight:700 !important; padding:.35rem .75rem !important; display:inline-block !important; }.badge-danger, .badge.bg-danger, .badge.text-danger { background:rgba(239, 68, 68, 0.22) !important; border:1px solid rgba(239, 68, 68, 0.45) !important; border-radius:99px !important; color:#ff6b6b !important; font-size:.75rem !important; font-weight:700 !important; padding:.35rem .75rem !important; display:inline-block !important; }.live-indicator { background:#fff0ed; border:1px solid #f7c7bc; border-radius:99px; color:#c74d35; font-size:.65rem; font-weight:700; padding:.32rem .6rem; } html[data-theme='dark'] .live-indicator { background:rgba(223,101,79,.15); border-color:rgba(223,101,79,.3); color:#ff8c7a; } .live-dot { background:#df654f; border-radius:50%; display:inline-block; height:6px; margin-right:3px; width:6px; }.text-cyan { color:var(--accent-teal)!important; }.form-control-custom { background:var(--surface)!important; border-color:var(--line)!important; color:var(--ink)!important; }
@media(max-width:991px) { .academy-hero { gap:3rem; grid-template-columns:1fr; padding-top:58px; }.hero-copy h1 { max-width:640px; }.hero-terminal { max-width:720px; width:100%; }.navbar-collapse { background:var(--surface); border:1px solid var(--line); margin-top:12px; padding:15px; }.nav-actions { margin-top:10px; }.section-heading { align-items:start; flex-direction:column; gap:18px; }.terminal-body { grid-template-columns:1.4fr .7fr; } }
@media(max-width:600px) { .nav-shell { height:65px; }.nav-cta { display:none; }.academy-hero { min-height:auto; padding:42px 0 48px; }.hero-copy h1 { font-size:3.1rem; }.hero-proof { margin-top:32px; }.hero-terminal { transform:none; }.terminal-main { padding:12px; }.terminal-body { grid-template-columns:1fr; }.terminal-side { display:grid; grid-template-columns:1fr 1fr; }.terminal-banner,.mentor-card { min-height:110px; }.chart-area { height:145px; }.trusted-strip { flex-wrap:wrap; gap:12px; justify-content:center; line-height:1.2; }.feature-section { padding:60px 0; }.feature-grid { grid-template-columns:1fr; }.feature-card { min-height:210px; }.footer-custom .container { align-items:start; flex-direction:column; gap:12px; }.section-heading h2 br { display:none; } }

/* ==========================================================================
   Premium Motion & Micro-Interactions Styling
   ========================================================================== */

/* Sticky & Dynamic Navigation Header */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), 
                background-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                backdrop-filter 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Scrolled Navbar Style */
.site-header.nav-scrolled {
    background-color: color-mix(in srgb, var(--canvas) 85%, transparent) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom-color: var(--line) !important;
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.08);
}
html[data-theme='dark'] .site-header.nav-scrolled {
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.4);
}

/* Hidden Header state when scrolling down */
.site-header.nav-hidden {
    transform: translateY(-100%);
}

/* Nav Link Hover Underline Animation */
.navbar-nav .nav-link {
    position: relative;
    padding-bottom: 6px !important;
}
.navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 1rem;
    right: 1rem;
    height: 2px;
    background-color: var(--mint-strong);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.navbar-nav .nav-link:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* High-Performance Card Hover Lift & Shadow */
.feature-card, 
.course-slide .glass-card,
.glass-card {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.feature-card:hover, 
.course-slide .glass-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(84, 224, 180, 0.4) !important;
    box-shadow: 0 16px 36px -10px rgba(25, 45, 40, 0.12) !important;
}
html[data-theme='dark'] .feature-card:hover, 
html[data-theme='dark'] .course-slide .glass-card:hover {
    box-shadow: 0 16px 36px -10px rgba(0, 0, 0, 0.4) !important;
}

/* Image/Video Zoom Hover Effects */
.hero-carousel .carousel-item img,
.hero-carousel .carousel-item video {
    transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.hero-carousel:hover .carousel-item.active img,
.hero-carousel:hover .carousel-item.active video {
    transform: scale(1.05);
}

/* Button Ripple & Hover Transitions */
.btn-brand, 
.btn-quiet, 
.btn-premium, 
.nav-cta {
    position: relative;
    overflow: hidden;
    transition: background-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                color 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-ripple {
    position: absolute;
    background: rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    transform: scale(0);
    animation: btn-ripple-effect 0.6s linear;
    pointer-events: none;
    width: 160px;
    height: 160px;
    margin-left: -80px;
    margin-top: -80px;
}
@keyframes btn-ripple-effect {
    to {
        transform: scale(2.5);
        opacity: 0;
    }
}

/* Floating Animations for Graphic Elements */
.eyebrow-dot, 
.live-dot {
    animation: pulse-dot 2.5s infinite alternate cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
@keyframes pulse-dot {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(45, 212, 165, 0.5);
    }
    70% {
        transform: scale(1.15);
        box-shadow: 0 0 0 6px rgba(45, 212, 165, 0);
    }
    100% {
        transform: scale(1.15);
        box-shadow: 0 0 0 0 rgba(45, 212, 165, 0);
    }
}

/* Floating Utility Animation */
.floating-element {
    animation: float-slow 6s ease-in-out infinite alternate;
}
@keyframes float-slow {
    0% {
        transform: translateY(0px) rotate(0deg);
    }
    50% {
        transform: translateY(-10px) rotate(1deg);
    }
    100% {
        transform: translateY(0px) rotate(0deg);
    }
}

/* FAQ / Collapsible item smooth transition styles */
.faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    opacity: 0;
}
.faq-content.is-open {
    max-height: 1000px;
    opacity: 1;
}

/* Page spacing tweak for fixed header */
body {
    padding-top: 78px;
}
@media (max-width: 600px) {
    body {
        padding-top: 65px;
    }
}

/* Full-Screen Interactive Particle Background */
#particle-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -2; /* Placed behind content and layout elements */
    pointer-events: none; /* Allows clicks to pass through to elements */
    background: transparent;
}

/* Accessibility: Respect Reduced Motion Settings */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-delay: -1ms !important;
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        background-attachment: initial !important;
        scroll-behavior: auto !important;
        transition-duration: 0s !important;
        transition-delay: 0s !important;
        transform: none !important;
    }
}