/* ╔══════════════════════════════════════════════════════════════╗
   ║  ALGORAM – Premium White Fintech Brand System               ║
   ║  Stripe × TradingView × Apple × Zerodha aesthetic          ║
   ║  Blue = #007BFF (ALGO)  |  Gold = #F59E0B (RAM)            ║
   ╚══════════════════════════════════════════════════════════════╝ */

@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700;800;900&family=Exo+2:wght@300;400;500;600;700;800;900&family=Rajdhani:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DESIGN TOKENS — extracted from ALGORAM logo
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
:root {
  /* ALGO — Electric Metallic Blue */
  --b1: #007BFF;   /* core brand blue */
  --b2: #0057D9;   /* deeper blue */
  --b3: #003FAD;   /* darkest blue */
  --bh: #40A0FF;   /* highlight / glow */
  --bl: #E8F3FF;   /* tint background */
  --bm: #BFDBFE;   /* mid tint */

  /* RAM — Luxury Metallic Gold */
  --g1: #F59E0B;   /* core brand gold */
  --g2: #D97706;   /* deeper gold */
  --g3: #92400E;   /* shadow */
  --gh: #FCD34D;   /* highlight */
  --gl: #FFFBEB;   /* gold tint */

  /* Backgrounds */
  --w0: #FFFFFF;
  --w1: #F8FAFC;
  --w2: #F1F5F9;
  --w3: #EEF6FF;
  --w4: #E0EEFF;

  /* Text hierarchy */
  --t1: #0F172A;   /* primary */
  --t2: #1E293B;   /* secondary */
  --t3: #475569;   /* tertiary */
  --t4: #94A3B8;   /* muted */

  /* Status */
  --green:  #10B981;
  --red:    #EF4444;
  --purple: #8B5CF6;

  /* Gradients */
  --grd-logo:    linear-gradient(135deg, var(--b1) 0%, var(--b2) 35%, var(--g2) 65%, var(--g1) 100%);
  --grd-blue:    linear-gradient(135deg, var(--bh) 0%, var(--b1) 50%, var(--b2) 100%);
  --grd-gold:    linear-gradient(135deg, var(--gh) 0%, var(--g1) 50%, var(--g2) 100%);
  --grd-metal-b: linear-gradient(180deg, #64B5FF 0%, var(--b1) 35%, var(--b2) 65%, #90C8FF 100%);
  --grd-metal-g: linear-gradient(180deg, var(--gh) 0%, var(--g1) 35%, var(--g2) 65%, #FDE68A 100%);

  /* Shadows */
  --sh-xs: 0 1px 2px rgba(0,0,0,0.04);
  --sh-sm: 0 2px 8px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
  --sh-md: 0 4px 20px rgba(0,119,255,0.1), 0 2px 8px rgba(0,0,0,0.06);
  --sh-lg: 0 12px 48px rgba(0,119,255,0.14), 0 4px 16px rgba(0,0,0,0.08);
  --sh-xl: 0 20px 60px rgba(0,119,255,0.18), 0 8px 24px rgba(0,0,0,0.1);
  --sh-gold: 0 8px 32px rgba(245,158,11,0.3), 0 2px 8px rgba(245,158,11,0.15);
  --sh-blue: 0 8px 32px rgba(0,123,255,0.3), 0 2px 8px rgba(0,123,255,0.15);

  /* Override old vars */
  --neon-blue:    var(--b1);
  --neon-cyan:    var(--bh);
  --gold:         var(--g1);
  --gold-light:   var(--gh);
  --navy:         var(--w1);
  --navy-2:       var(--w2);
  --navy-3:       var(--w3);
  --white:        var(--t1);
  --white-70:     var(--t3);
  --glass:        rgba(255,255,255,0.85);
  --glass-border: rgba(0,123,255,0.18);

  /* Fonts */
  --f-display: 'Oxanium', sans-serif;
  --f-ui:      'Exo 2', sans-serif;
  --f-label:   'Rajdhani', sans-serif;
  --f-body:    'Inter', sans-serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BASE — global white theme
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--f-body) !important;
  background: var(--w0) !important;
  color: var(--t1) !important;
  cursor: auto !important;
  -webkit-font-smoothing: antialiased;
}

/* Disable dark cursor */
.cursor, .cursor-ring { display: none !important; }

/* Subtle dot grid */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(0,123,255,0.045) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Scrollbar */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--w2); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--b1), var(--g1));
  border-radius: 4px;
}

/* Text selection */
::selection { background: rgba(0,123,255,0.15); color: var(--b2); }

/* Particles – very faint on white */
#particles-canvas { opacity: 0.15 !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LOADER
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#loader {
  background: #ffffff !important;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
}
.loader-logo-img {
  width: 200px; max-width: 72vw;
  margin-bottom: 0.6rem;
  animation: ldrFloat 2.2s ease-in-out infinite alternate,
             ldrGlow  1.5s ease-in-out infinite alternate;
  filter: drop-shadow(0 4px 16px rgba(0,123,255,0.28));
}
@keyframes ldrFloat {
  from { transform: translateY(0px); }
  to   { transform: translateY(-8px); }
}
@keyframes ldrGlow {
  from { filter: drop-shadow(0 4px 12px rgba(0,123,255,0.22)); }
  to   { filter: drop-shadow(0 6px 28px rgba(0,123,255,0.55))
                 drop-shadow(0 2px 16px rgba(245,158,11,0.38)); }
}
.loader-tagline {
  font-family: var(--f-label);
  font-size: 0.72rem; letter-spacing: 4px;
  color: var(--t4); text-transform: uppercase;
  margin-bottom: 1.8rem;
}
.loader-bar-wrap {
  width: 220px; height: 3px;
  background: var(--w2); border-radius: 4px; overflow: hidden;
}
.loader-bar {
  height: 100%; border-radius: 4px;
  background: linear-gradient(90deg, var(--b1), var(--g1), var(--b1));
  background-size: 200% 100%;
  animation: loadBar 1.8s ease forwards, barShimmer 1.2s linear infinite;
}
@keyframes loadBar { from { width: 0; } to { width: 100%; } }
@keyframes barShimmer {
  from { background-position: 200% 0; } to { background-position: -200% 0; }
}
/* Legacy text loader fallback */
.loader-logo {
  font-family: var(--f-display) !important;
  background: var(--grd-logo) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TICKER BAR
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.ticker-bar {
  background: rgba(255,255,255,0.96) !important;
  border-bottom: 1px solid rgba(0,123,255,0.1) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04) !important;
  backdrop-filter: blur(12px);
}
.ticker-item { color: var(--t2) !important; font-family: var(--f-label); font-size: 0.8rem; }
.ticker-item .up   { color: var(--green) !important; font-weight: 700; }
.ticker-item .down { color: var(--red)   !important; font-weight: 700; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAVBAR
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.navbar {
  background: rgba(255,255,255,0.86) !important;
  backdrop-filter: blur(24px) saturate(1.8) !important;
  border-bottom: 1px solid rgba(0,123,255,0.1) !important;
  box-shadow: 0 1px 0 rgba(0,123,255,0.06), 0 2px 20px rgba(0,0,0,0.05) !important;
  height: 68px;
}
.navbar.scrolled {
  background: rgba(255,255,255,0.97) !important;
  border-bottom-color: rgba(0,123,255,0.16) !important;
  box-shadow: 0 4px 32px rgba(0,123,255,0.1), 0 1px 0 rgba(0,123,255,0.08) !important;
}

/* Logo image */
.nav-logo {
  display: flex; align-items: center; text-decoration: none; padding: 0;
}
.nav-logo-img {
  height: 38px; width: auto; display: block;
  transition: filter 0.3s ease, transform 0.3s ease;
  filter: drop-shadow(0 1px 6px rgba(0,123,255,0.18));
}
.nav-logo-img:hover {
  transform: scale(1.05);
  filter: drop-shadow(0 2px 14px rgba(0,123,255,0.42))
          drop-shadow(0 1px 8px rgba(245,158,11,0.3));
}
/* Fallback text logo */
.nav-logo-text, .nav-logo span {
  font-family: var(--f-display) !important;
  background: var(--grd-logo) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: shimText 5s linear infinite;
}

/* Nav links */
.nav-links a {
  color: var(--t2) !important;
  font-family: var(--f-ui) !important;
  font-size: 0.83rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.2px;
  position: relative;
}
.nav-links a::after {
  content: '';
  position: absolute; bottom: 0; left: 50%; right: 50%; height: 2px;
  background: linear-gradient(90deg, var(--b1), var(--g1));
  border-radius: 2px;
  transition: left 0.25s ease, right 0.25s ease;
}
.nav-links a:hover::after,
.nav-links a.active::after { left: 8px; right: 8px; }
.nav-links a:hover, .nav-links a.active {
  color: var(--b1) !important;
  background: rgba(0,123,255,0.05) !important;
}

/* CTA button — metallic gold */
.nav-cta {
  font-family: var(--f-ui) !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  background: var(--grd-gold) !important;
  color: #fff !important;
  border-radius: 8px !important;
  box-shadow: var(--sh-gold) !important;
  padding: 0.42rem 1.1rem !important;
  position: relative; overflow: hidden;
}
.nav-cta::after {
  content: '';
  position: absolute; top: 0; left: -80%; width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.45), transparent);
  animation: shimmer 2.8s ease-in-out infinite;
}
@keyframes shimmer { to { left: 140%; } }
.nav-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 40px rgba(245,158,11,0.45) !important;
}

/* Hamburger */
.hamburger span { background: var(--t2) !important; }

/* Mobile menu */
.mobile-menu {
  background: rgba(255,255,255,0.98) !important;
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(0,123,255,0.1) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
}
.mobile-menu a { color: var(--t2) !important; font-family: var(--f-ui) !important; }
.mobile-menu a:hover { color: var(--b1) !important; background: var(--bl) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HERO
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.hero {
  background:
    radial-gradient(ellipse 90% 70% at 15% 30%, rgba(0,123,255,0.07) 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 85% 70%, rgba(245,158,11,0.05) 0%, transparent 50%),
    linear-gradient(170deg, #ffffff 0%, #f0f7ff 50%, #f8fafc 100%) !important;
  padding-top: 130px !important;
}
.hero-bg { display: none; }
.hero-grid {
  background-image:
    linear-gradient(rgba(0,123,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,123,255,0.035) 1px, transparent 1px) !important;
  background-size: 48px 48px !important;
  opacity: 1 !important;
}

/* Hero badge */
.hero-badge {
  background: rgba(0,123,255,0.07) !important;
  border: 1px solid rgba(0,123,255,0.22) !important;
  color: var(--b1) !important;
  font-family: var(--f-label) !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  box-shadow: 0 2px 12px rgba(0,123,255,0.1) !important;
}
.hero-badge::before { background: var(--green) !important; box-shadow: 0 0 8px var(--green) !important; }

/* Headlines */
.hero-title-hindi {
  font-family: var(--f-display) !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  background: var(--grd-logo) !important;
  background-size: 200% 100% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: shimText 5s linear infinite;
}
@keyframes shimText {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.hero-title-eng {
  font-family: var(--f-ui) !important;
  font-weight: 600 !important;
  color: var(--t3) !important;
  letter-spacing: 1px !important;
}
.hero-subtitle { color: var(--t3) !important; }
.hero-subtitle strong { color: var(--b1) !important; font-weight: 700; }
#typing-text { color: var(--b1) !important; font-weight: 700; }

/* Hero stats */
.stat-value {
  font-family: var(--f-display) !important;
  font-weight: 800 !important;
  background: var(--grd-logo) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: shimText 5s linear infinite;
}
.stat-label { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 1.5px !important; }
.hero-stats { border-top: 1px solid rgba(0,123,255,0.1) !important; }

/* Hero dashboard — white glass card */
.hero-dashboard {
  background: rgba(255,255,255,0.9) !important;
  border: 1px solid rgba(0,123,255,0.16) !important;
  box-shadow: var(--sh-xl), 0 0 0 1px rgba(255,255,255,0.9) !important;
  backdrop-filter: blur(16px);
}
.hero-dashboard::before {
  background: linear-gradient(135deg, rgba(0,123,255,0.12), transparent, rgba(245,158,11,0.08)) !important;
}
.dash-header { background: rgba(0,123,255,0.04) !important; border-bottom: 1px solid rgba(0,123,255,0.1) !important; }
.dash-title  { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 2px !important; font-size: 0.7rem !important; }
.dash-live   { color: var(--green) !important; }
.dash-card   { background: rgba(0,123,255,0.03) !important; border-color: rgba(0,123,255,0.1) !important; }
.dash-card:hover { background: rgba(0,123,255,0.07) !important; border-color: rgba(0,123,255,0.25) !important; }
.dc-label { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 1px !important; }
.dc-value.blue  { color: var(--b1) !important; }
.dc-value.gold  { color: var(--g2) !important; }
.dc-value.green { color: var(--green) !important; }

/* Floating indicators near dashboard */
.hero-visual > div[style*="rgba(0,255,136"] {
  background: rgba(16,185,129,0.08) !important;
  border: 1px solid rgba(16,185,129,0.3) !important;
  color: var(--green) !important;
}
.hero-visual > div[style*="rgba(0,168,255"] {
  background: rgba(0,123,255,0.08) !important;
  border: 1px solid rgba(0,123,255,0.25) !important;
  color: var(--b1) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BUTTONS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.btn { font-family: var(--f-ui) !important; font-weight: 600 !important; border-radius: 10px !important; }

.btn-primary {
  background: var(--grd-gold) !important;
  color: #fff !important;
  box-shadow: var(--sh-gold) !important;
  border: none !important;
  position: relative; overflow: hidden;
}
.btn-primary::after {
  content: '';
  position: absolute; top: 0; left: -80%; width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  animation: shimmer 2.8s ease-in-out infinite;
}
.btn-primary:hover {
  transform: translateY(-3px) scale(1.01) !important;
  box-shadow: 0 12px 40px rgba(245,158,11,0.5) !important;
}
.btn-outline {
  background: transparent !important;
  border: 1.5px solid rgba(0,123,255,0.4) !important;
  color: var(--b1) !important;
  box-shadow: 0 2px 12px rgba(0,123,255,0.08) !important;
}
.btn-outline:hover {
  background: rgba(0,123,255,0.06) !important;
  border-color: var(--b1) !important;
  box-shadow: var(--sh-blue) !important;
  transform: translateY(-3px) !important;
}
.btn-gold {
  background: var(--grd-gold) !important;
  color: #fff !important;
  box-shadow: var(--sh-gold) !important;
}
.btn-gold:hover { transform: translateY(-3px) !important; box-shadow: 0 12px 40px rgba(245,158,11,0.5) !important; }
.btn-whatsapp { background: linear-gradient(135deg, #25D366, #128C7E) !important; color: #fff !important; }
.btn-whatsapp:hover { transform: translateY(-2px) !important; }
.btn::before { background: rgba(255,255,255,0.15) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECTION SYSTEM
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.section-tag {
  font-family: var(--f-label) !important;
  font-weight: 700 !important;
  letter-spacing: 4px !important;
  background: rgba(0,123,255,0.07) !important;
  border: 1px solid rgba(0,123,255,0.2) !important;
  color: var(--b1) !important;
  box-shadow: 0 2px 8px rgba(0,123,255,0.08) !important;
}
.section-title {
  font-family: var(--f-display) !important;
  font-weight: 800 !important;
  color: var(--t1) !important;
  letter-spacing: 0.5px;
}
/* Override inline blue span */
.section-title span { color: var(--b1) !important; -webkit-text-fill-color: var(--b1) !important; }
.section-title span[style] {
  background: var(--grd-blue) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.section-divider { background: linear-gradient(90deg, transparent, var(--b1), var(--g1), transparent) !important; height: 2px !important; opacity: 0.5 !important; }
.section-desc { color: var(--t3) !important; font-family: var(--f-body) !important; }
.gold-text { background: var(--grd-metal-g) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.gold-grad { background: var(--grd-metal-g) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.green-grad { background: linear-gradient(135deg, var(--green), #059669) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }

/* Section backgrounds */
.section-pad { background: var(--w0) !important; }
#features     { background: var(--w0) !important; }
#automation   { background: var(--w3) !important; }
#advanced     { background: var(--w2) !important; }
#why          { background: var(--w0) !important; }
#security     { background: var(--w3) !important; }
#performance  { background: var(--w0) !important; }
#testimonials { background: var(--w2) !important; }
#faq          { background: var(--w0) !important; }
#founders     { background: var(--w3) !important; }

/* Stats row */
.stats-row {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  box-shadow: var(--sh-md) !important;
  border-radius: 20px !important;
}
.stat-box { border-color: rgba(0,123,255,0.08) !important; }
.stat-num {
  font-family: var(--f-display) !important;
  font-weight: 800 !important;
  background: var(--grd-logo) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: shimText 5s linear infinite;
}
.stat-text { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 1.5px !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FEATURE CARDS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.feature-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  border-radius: 20px !important;
  box-shadow: var(--sh-sm) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
  position: relative; overflow: hidden;
}
.feature-card::before {
  content: '' !important;
  position: absolute !important; inset: 0 !important;
  background: linear-gradient(135deg, rgba(0,123,255,0.04), transparent 50%, rgba(245,158,11,0.03)) !important;
  opacity: 0 !important; transition: opacity 0.35s !important;
}
.feature-card:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(0,123,255,0.28) !important;
  box-shadow: var(--sh-lg) !important;
}
.feature-card:hover::before { opacity: 1 !important; }
.feature-card h3 { color: var(--t1) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; }
.feature-card p  { color: var(--t3) !important; font-family: var(--f-body) !important; }
.feature-icon { filter: none !important; }
.feature-badge {
  font-family: var(--f-label) !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  background: rgba(245,158,11,0.1) !important;
  border: 1px solid rgba(245,158,11,0.3) !important;
  color: var(--g2) !important;
  -webkit-text-fill-color: var(--g2) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   AUTOMATION SECTION
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.auto-feature-item {
  border-left: 3px solid !important;
  border-image: linear-gradient(180deg, var(--b1), var(--g1)) 1 !important;
  padding: 0.75rem 0 0.75rem 1.2rem !important;
  background: transparent !important;
  border-top: none !important; border-right: none !important; border-bottom: none !important;
  border-radius: 0 8px 8px 0 !important;
  transition: background 0.25s ease !important;
}
.auto-feature-item:hover { background: rgba(0,123,255,0.04) !important; }
.auto-feature-item h4 { color: var(--b2) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; }
.auto-feature-item p  { color: var(--t3) !important; font-size: 0.88rem !important; }
.auto-icon { filter: none !important; }

/* Phone mockup */
.phone-frame {
  background: linear-gradient(180deg, var(--w0), var(--w2)) !important;
  border: 1px solid rgba(0,123,255,0.2) !important;
  box-shadow: var(--sh-xl), 0 0 0 1px rgba(255,255,255,0.8) !important;
}
.phone-app-header h4 {
  font-family: var(--f-display) !important;
  background: var(--grd-logo) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.pnl-label  { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 2px !important; }
.pnl-value  { font-family: var(--f-display) !important; font-weight: 800 !important; color: var(--green) !important; -webkit-text-fill-color: var(--green) !important; }
.phone-trade .symbol  { color: var(--b1) !important; font-weight: 600 !important; }
.phone-trade .pnl-pos { color: var(--green) !important; }
.phone-trade .pnl-neg { color: var(--red) !important; }
.phone-status { color: var(--t4) !important; }
.phone-btn.start { background: var(--grd-blue) !important; color: #fff !important; }
.phone-btn.stop  { background: rgba(239,68,68,0.08) !important; border-color: rgba(239,68,68,0.3) !important; color: var(--red) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   ADVANCED CARDS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.adv-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.09) !important;
  border-radius: 18px !important;
  box-shadow: var(--sh-sm) !important;
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s !important;
}
.adv-card:hover {
  transform: translateY(-7px) !important;
  border-color: rgba(245,158,11,0.35) !important;
  box-shadow: var(--sh-lg), 0 0 0 1px rgba(245,158,11,0.06) !important;
}
.adv-card h3 { color: var(--t1) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; }
.adv-card p  { color: var(--t3) !important; font-size: 0.88rem !important; }
.adv-icon { filter: none !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   COMPARISON TABLE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.comparison-table {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  border-radius: 16px !important;
  box-shadow: var(--sh-md) !important;
  overflow: hidden !important;
}
.comparison-table thead tr { background: linear-gradient(90deg, rgba(0,123,255,0.07), rgba(245,158,11,0.04)) !important; }
.comparison-table thead th { color: var(--t2) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; border-bottom: 1px solid rgba(0,123,255,0.1) !important; }
.comparison-table thead th:nth-child(2) { background: rgba(0,123,255,0.09) !important; color: var(--b1) !important; font-family: var(--f-display) !important; }
.comparison-table tbody td { color: var(--t2) !important; border-bottom: 1px solid rgba(0,123,255,0.05) !important; }
.comparison-table tbody tr:hover td { background: rgba(0,123,255,0.03) !important; }
.check { color: var(--green) !important; font-weight: 700 !important; }
.cross { color: var(--red) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECURITY
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sec-item h4 { color: var(--b2) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; }
.sec-item p  { color: var(--t3) !important; }
.sec-icon { filter: none !important; }
.shield-pct  { color: var(--b1) !important; font-family: var(--f-display) !important; font-weight: 800 !important; }
.shield-label { color: var(--t4) !important; }
.shield-stat-val { color: var(--b1) !important; font-family: var(--f-display) !important; font-weight: 700 !important; }
.shield-stat-txt { color: var(--t4) !important; font-size: 0.72rem !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PERFORMANCE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.perf-chart-box {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  border-radius: 16px !important;
  box-shadow: var(--sh-md) !important;
}
.perf-chart-title { color: var(--t4) !important; font-family: var(--f-label) !important; font-weight: 700 !important; letter-spacing: 3px !important; }
.perf-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.09) !important;
  border-radius: 14px !important;
  box-shadow: var(--sh-sm) !important;
}
.perf-card-label { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 1.5px !important; }
.perf-card-value { font-family: var(--f-display) !important; font-weight: 800 !important; }
.progress-bar-wrap { background: var(--w2) !important; border-radius: 6px !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TESTIMONIALS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.testimonial-card .testimonial-inner {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.09) !important;
  border-radius: 20px !important;
  box-shadow: var(--sh-sm) !important;
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s !important;
}
.testimonial-card .testimonial-inner:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(245,158,11,0.3) !important;
  box-shadow: var(--sh-lg) !important;
}
.testimonial-text { color: var(--t2) !important; font-family: var(--f-body) !important; line-height: 1.7 !important; }
.author-name  { color: var(--t1) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; }
.author-city  { color: var(--t4) !important; }
.author-profit { color: var(--green) !important; font-family: var(--f-label) !important; font-weight: 700 !important; }
.stars { color: var(--g1) !important; letter-spacing: 1px !important; }
.slider-btn {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.2) !important;
  color: var(--b1) !important;
  box-shadow: var(--sh-sm) !important;
  transition: all 0.25s !important;
}
.slider-btn:hover { background: var(--b1) !important; color: #fff !important; box-shadow: var(--sh-blue) !important; }
.dot { background: rgba(0,123,255,0.18) !important; }
.dot.active { background: var(--b1) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FAQ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.faq-list { max-width: 800px; margin: 0 auto; }
.faq-item {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.09) !important;
  border-radius: 14px !important;
  box-shadow: var(--sh-xs) !important;
  margin-bottom: 0.75rem !important;
  transition: border-color 0.3s, box-shadow 0.3s !important;
  overflow: hidden !important;
}
.faq-item.active {
  border-color: rgba(0,123,255,0.28) !important;
  box-shadow: var(--sh-md) !important;
}
.faq-question { color: var(--t1) !important; font-family: var(--f-ui) !important; font-weight: 600 !important; }
.faq-question:hover { color: var(--b1) !important; }
.faq-icon { color: var(--b1) !important; font-size: 1.2rem !important; }
.faq-answer { color: var(--t3) !important; font-family: var(--f-body) !important; line-height: 1.7 !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FOUNDERS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.founders-section { background: var(--w3) !important; }
.founders-canvas { opacity: 0.1 !important; }

.founder-card {
  background: linear-gradient(135deg, rgba(0,123,255,0.18) 0%, rgba(245,158,11,0.12) 100%) !important;
  border-radius: 24px !important;
  box-shadow: none !important;
  transition: transform 0.4s ease, box-shadow 0.4s ease !important;
}
.founder-card:hover {
  transform: translateY(-10px) !important;
  box-shadow: var(--sh-xl) !important;
}
.founder-card:nth-child(2) {
  background: linear-gradient(135deg, rgba(245,158,11,0.22) 0%, rgba(0,123,255,0.1) 100%) !important;
}

.founder-card-inner {
  background: rgba(255,255,255,0.96) !important;
  border-radius: 22px !important;
  box-shadow: 0 4px 24px rgba(0,123,255,0.08) !important;
}
.founder-border-glow { background: conic-gradient(from 0deg, transparent, var(--b1) 20%, transparent 40%) !important; }
.founder-border-gold { background: conic-gradient(from 0deg, transparent, var(--g1) 20%, transparent 40%) !important; }

.founder-photo-frame {
  border-color: rgba(0,123,255,0.55) !important;
  box-shadow: 0 0 0 2px rgba(0,123,255,0.3), 0 8px 28px rgba(0,123,255,0.2) !important;
}
.founder-frame-gold {
  border-color: rgba(245,158,11,0.55) !important;
  box-shadow: 0 0 0 2px rgba(245,158,11,0.3), 0 8px 28px rgba(245,158,11,0.2) !important;
}
.founder-avatar-1 { background: rgba(0,123,255,0.08) !important; color: var(--b2) !important; text-shadow: none !important; }
.founder-avatar-2 { background: rgba(245,158,11,0.1) !important; color: var(--g2) !important; text-shadow: none !important; }

.founder-name {
  font-family: var(--f-display) !important;
  font-weight: 800 !important;
  background: var(--grd-logo) !important;
  background-size: 200% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.founder-card:nth-child(2) .founder-name {
  background: var(--grd-metal-g) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.founder-role-tag { border-color: rgba(0,123,255,0.22) !important; color: var(--b1) !important; background: rgba(0,123,255,0.06) !important; font-family: var(--f-label) !important; font-weight: 700 !important; }
.founder-designation { color: var(--t3) !important; }
.founder-desc { color: var(--t3) !important; font-style: italic !important; font-family: var(--f-body) !important; }
.founder-divider { background: linear-gradient(90deg, transparent, var(--b1), transparent) !important; }
.f-tag { background: rgba(0,123,255,0.06) !important; border-color: rgba(0,123,255,0.16) !important; color: var(--b2) !important; }
.founder-social-btn { background: rgba(0,123,255,0.05) !important; border-color: rgba(0,123,255,0.2) !important; color: var(--b1) !important; }
.founder-social-btn:hover { background: rgba(0,123,255,0.1) !important; box-shadow: var(--sh-md) !important; }
.founder-badge-active { font-family: var(--f-label) !important; font-weight: 600 !important; letter-spacing: 1px !important; }

/* Message block */
.founders-msg-inner { background: rgba(255,255,255,0.92) !important; border-color: rgba(0,123,255,0.14) !important; box-shadow: var(--sh-md) !important; }
.founders-msg-label { color: var(--b1) !important; font-family: var(--f-label) !important; letter-spacing: 4px !important; font-weight: 700 !important; }
.founders-quote { color: var(--t2) !important; font-family: var(--f-ui) !important; font-style: italic !important; }
.sig-line { font-family: var(--f-display) !important; }
.sig-role { color: var(--t4) !important; }

/* Stats */
.founders-stats { background: rgba(255,255,255,0.88) !important; border-color: rgba(0,123,255,0.1) !important; box-shadow: var(--sh-md) !important; backdrop-filter: blur(12px) !important; }
.founder-stat-item::after { background: linear-gradient(180deg, transparent, rgba(0,123,255,0.15), transparent) !important; }
.fstat-value { font-family: var(--f-display) !important; background: var(--grd-logo) !important; background-size: 200% !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.fstat-label { color: var(--t4) !important; font-family: var(--f-label) !important; letter-spacing: 1px !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CTA SECTION  — deep navy premium
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cta-section {
  background: linear-gradient(150deg, var(--b3) 0%, var(--b2) 40%, #1a4080 70%, var(--b3) 100%) !important;
  position: relative; overflow: hidden;
}
.cta-section::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 60% 55% at 50% 50%, rgba(245,158,11,0.07), transparent),
    url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.025'%3E%3Cpath d='M0 40L40 0H20L0 20M40 40V20L20 40'/%3E%3C/g%3E%3C/svg%3E");
}
.cta-title {
  font-family: var(--f-display) !important;
  font-weight: 900 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: none !important;
  animation: none !important;
  text-shadow: 0 2px 24px rgba(255,255,255,0.15) !important;
}
.cta-sub {
  font-family: var(--f-label) !important;
  font-size: 1.1rem !important;
  color: rgba(255,255,255,0.72) !important;
  letter-spacing: 3px !important;
}
.cta-section [data-i18n="cta_note"],
.cta-section p:last-of-type { color: rgba(255,255,255,0.38) !important; }
.cta-section .btn-primary {
  background: var(--grd-gold) !important;
  color: #fff !important;
  box-shadow: var(--sh-gold) !important;
}
.cta-section .btn-outline {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.35) !important;
  color: #fff !important;
}
.cta-section .btn-outline:hover { background: rgba(255,255,255,0.2) !important; border-color: rgba(255,255,255,0.6) !important; }
.cta-section .section-tag {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.25) !important;
  color: rgba(255,255,255,0.85) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FOOTER — deep navy
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
footer {
  background: #0B1120 !important;
  border-top: none !important;
  position: relative;
}
footer::before {
  content: ''; position: absolute; top: 0; left: 8%; right: 8%; height: 2px;
  background: linear-gradient(90deg, transparent, var(--b1), var(--g1), transparent);
  opacity: 0.55;
}
.footer-logo-img {
  height: 44px; width: auto; display: block;
  margin-bottom: 1rem;
  filter: drop-shadow(0 2px 10px rgba(0,123,255,0.35)) drop-shadow(0 1px 6px rgba(245,158,11,0.22));
  transition: filter 0.3s ease;
}
.footer-logo-img:hover {
  filter: drop-shadow(0 4px 20px rgba(0,123,255,0.6)) drop-shadow(0 2px 12px rgba(245,158,11,0.4));
}
/* Fallback text footer logo */
.footer-logo { font-family: var(--f-display) !important; background: var(--grd-logo) !important; background-size: 200% !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.footer-desc { color: rgba(255,255,255,0.48) !important; font-family: var(--f-body) !important; line-height: 1.7 !important; }

.footer-col h4 {
  font-family: var(--f-label) !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  background: linear-gradient(135deg, var(--bh), var(--gh));
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
footer .footer-col a,
footer .contact-item { color: rgba(255,255,255,0.5) !important; font-family: var(--f-body) !important; transition: color 0.2s, padding-left 0.2s !important; }
footer .footer-col a:hover { color: var(--bh) !important; padding-left: 5px !important; }
.footer-copy { color: rgba(255,255,255,0.35) !important; font-family: var(--f-label) !important; letter-spacing: 0.5px !important; }
.footer-bottom { border-top-color: rgba(255,255,255,0.07) !important; }
.footer-legal a { color: rgba(255,255,255,0.35) !important; transition: color 0.2s !important; }
.footer-legal a:hover { color: var(--bh) !important; }
.disclaimer-text { color: rgba(255,255,255,0.3) !important; font-size: 0.76rem !important; line-height: 1.6 !important; }
.social-link { color: rgba(255,255,255,0.45) !important; border-color: rgba(255,255,255,0.1) !important; }
.social-link:hover { color: var(--bh) !important; border-color: rgba(0,123,255,0.4) !important; background: rgba(0,123,255,0.08) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LANGUAGE SWITCHER
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.lang-btn {
  background: rgba(0,123,255,0.06) !important;
  border-color: rgba(0,123,255,0.22) !important;
  color: var(--t2) !important;
}
.lang-btn:hover { background: rgba(0,123,255,0.11) !important; border-color: var(--b1) !important; box-shadow: 0 4px 16px rgba(0,123,255,0.15) !important; }
.lang-dropdown { background: rgba(255,255,255,0.98) !important; border-color: rgba(0,123,255,0.16) !important; box-shadow: 0 12px 40px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,123,255,0.06) !important; }
.lang-option { color: var(--t2) !important; }
.lang-option:hover { background: rgba(0,123,255,0.05) !important; color: var(--b1) !important; }
.lang-option.active { background: rgba(0,123,255,0.09) !important; color: var(--b1) !important; }
.lang-arrow { color: var(--b1) !important; }
#lang-transition { background: rgba(255,255,255,0.8) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   INNER PAGES — generic overrides
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Page hero (about, pricing, etc.) */
.page-hero {
  background: linear-gradient(160deg, var(--w0) 0%, var(--w3) 50%, var(--w0) 100%) !important;
  padding: 130px 0 80px !important;
}
.page-hero h1 { font-family: var(--f-display) !important; color: var(--t1) !important; -webkit-text-fill-color: var(--t1) !important; }
.page-hero h1 span { background: var(--grd-logo) !important; background-size: 200% !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.page-hero p { color: var(--t3) !important; }

/* Pricing cards */
.pricing-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.12) !important;
  border-radius: 20px !important;
  box-shadow: var(--sh-md) !important;
  transition: transform 0.3s, box-shadow 0.3s !important;
}
.pricing-card:hover { transform: translateY(-8px) !important; box-shadow: var(--sh-xl) !important; }
.pricing-card.featured {
  border-color: rgba(245,158,11,0.4) !important;
  box-shadow: var(--sh-gold), var(--sh-blue) !important;
}
.price-tag { font-family: var(--f-display) !important; font-weight: 800 !important; color: var(--t1) !important; }

/* Strategy cards */
.strategy-card, .strat-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  border-radius: 18px !important;
  box-shadow: var(--sh-sm) !important;
}
.strategy-card:hover, .strat-card:hover { transform: translateY(-6px) !important; box-shadow: var(--sh-lg) !important; border-color: rgba(0,123,255,0.28) !important; }

/* Contact form */
.contact-form-wrap, .form-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.12) !important;
  border-radius: 20px !important;
  box-shadow: var(--sh-lg) !important;
}
input, textarea, select {
  background: var(--w1) !important;
  border: 1px solid rgba(0,123,255,0.15) !important;
  color: var(--t1) !important;
  border-radius: 10px !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--b1) !important;
  box-shadow: 0 0 0 3px rgba(0,123,255,0.12) !important;
  outline: none !important;
  background: var(--w0) !important;
}
input::placeholder, textarea::placeholder { color: var(--t4) !important; }
label { color: var(--t2) !important; font-family: var(--f-ui) !important; font-weight: 500 !important; }

/* FAQ page */
.faq-section-title { font-family: var(--f-display) !important; color: var(--t1) !important; }

/* About values cards */
.value-card, .about-card {
  background: var(--w0) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  border-radius: 18px !important;
  box-shadow: var(--sh-sm) !important;
}
.value-card:hover, .about-card:hover { transform: translateY(-6px) !important; box-shadow: var(--sh-lg) !important; }
.value-card h3, .about-card h3 { color: var(--t1) !important; font-family: var(--f-ui) !important; }
.value-card p,  .about-card p  { color: var(--t3) !important; }

/* Disclaimer / Privacy pages */
.disclaimer-content h2, .privacy-content h2 { color: var(--b2) !important; font-family: var(--f-ui) !important; font-weight: 700 !important; }
.disclaimer-content p, .privacy-content p,
.disclaimer-content li, .privacy-content li { color: var(--t3) !important; }
.warning-box { background: rgba(245,158,11,0.06) !important; border-color: rgba(245,158,11,0.3) !important; }
.warning-box p { color: var(--g2) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   UTILITY — reusable premium classes
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.text-logo   { background: var(--grd-logo) !important; background-size: 200% !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; animation: shimText 5s linear infinite; }
.text-blue   { background: var(--grd-blue) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.text-gold   { background: var(--grd-metal-g) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.card-white  { background: var(--w0) !important; border: 1px solid rgba(0,123,255,0.1) !important; border-radius: 18px !important; box-shadow: var(--sh-md) !important; }
.glow-blue   { box-shadow: var(--sh-blue) !important; }
.glow-gold   { box-shadow: var(--sh-gold) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAVBAR & FOOTER — Royal Blue Theme
   Color: #0057D9
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── NAVBAR ── */
.navbar {
  background: rgba(0, 87, 217, 0.96) !important;
  backdrop-filter: blur(20px) saturate(1.4) !important;
  border-bottom: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 2px 24px rgba(0,87,217,0.4), 0 1px 0 rgba(255,255,255,0.08) !important;
}
.navbar.scrolled {
  background: rgba(0, 75, 195, 0.99) !important;
  border-bottom-color: rgba(255,255,255,0.18) !important;
  box-shadow: 0 4px 36px rgba(0,87,217,0.5) !important;
}

/* Nav links — white text on blue */
.nav-links a {
  color: rgba(255,255,255,0.85) !important;
}
.nav-links a:hover,
.nav-links a.active {
  color: #fff !important;
  background: rgba(255,255,255,0.12) !important;
}
.nav-links a::after {
  background: linear-gradient(90deg, #fff, var(--gh)) !important;
}

/* Logo on blue navbar */
.nav-logo-img {
  filter: brightness(1) drop-shadow(0 2px 8px rgba(255,255,255,0.2)) !important;
}
.nav-logo-img:hover {
  filter: brightness(1.1) drop-shadow(0 2px 16px rgba(255,255,255,0.35))
          drop-shadow(0 1px 8px rgba(245,158,11,0.4)) !important;
}

/* CTA button — gold on blue */
.nav-cta {
  background: linear-gradient(135deg, var(--gh) 0%, var(--g1) 50%, var(--g2) 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 20px rgba(245,158,11,0.45) !important;
}
.nav-cta:hover {
  box-shadow: 0 8px 36px rgba(245,158,11,0.65) !important;
}

/* Hamburger — white lines on blue */
.hamburger span { background: #fff !important; }

/* Mobile menu — dark blue */
.mobile-menu {
  background: rgba(0, 75, 195, 0.99) !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  box-shadow: 0 8px 32px rgba(0,87,217,0.3) !important;
}
.mobile-menu a { color: rgba(255,255,255,0.85) !important; }
.mobile-menu a:hover {
  color: #fff !important;
  background: rgba(255,255,255,0.1) !important;
}

/* Language switcher on blue navbar */
.lang-btn {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.25) !important;
  color: #fff !important;
}
.lang-btn:hover {
  background: rgba(255,255,255,0.2) !important;
  border-color: rgba(255,255,255,0.45) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.15) !important;
}
.lang-arrow { color: rgba(255,255,255,0.7) !important; }
.lang-current-label { color: #fff !important; }

/* ── FOOTER ── */
footer {
  background: #0047C0 !important;
  position: relative;
}
footer::before {
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), var(--gh), rgba(255,255,255,0.3), transparent) !important;
  opacity: 0.6;
}

/* Footer logo */
.footer-logo-img {
  filter: brightness(1) drop-shadow(0 2px 12px rgba(255,255,255,0.25)) !important;
}
.footer-logo-img:hover {
  filter: brightness(1.1) drop-shadow(0 4px 20px rgba(255,255,255,0.4))
          drop-shadow(0 2px 12px rgba(245,158,11,0.45)) !important;
}

/* Footer text on blue */
.footer-desc { color: rgba(255,255,255,0.7) !important; }

.footer-col h4 {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  opacity: 0.9;
  letter-spacing: 3px;
}
footer .footer-col a,
footer .contact-item { color: rgba(255,255,255,0.65) !important; }
footer .footer-col a:hover { color: #fff !important; padding-left: 5px !important; }

.footer-copy { color: rgba(255,255,255,0.45) !important; }
.footer-bottom { border-top-color: rgba(255,255,255,0.12) !important; }
.footer-legal a { color: rgba(255,255,255,0.45) !important; }
.footer-legal a:hover { color: #fff !important; }
.disclaimer-text { color: rgba(255,255,255,0.42) !important; }

.social-link {
  color: rgba(255,255,255,0.6) !important;
  border-color: rgba(255,255,255,0.18) !important;
}
.social-link:hover {
  color: #fff !important;
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.4) !important;
}

/* WhatsApp button in footer */
.btn-whatsapp { background: linear-gradient(135deg, #25D366, #128C7E) !important; }


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LOGO VISIBILITY FINAL FIX
   Navbar = White glassmorphism (logo crisp on light)
   Footer = Deep navy (logo glows on dark)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ══ NAVBAR — Premium White Glass ══ */
.navbar {
  background: linear-gradient(135deg,
    rgba(255,255,255,0.94),
    rgba(248,250,252,0.96),
    rgba(238,246,255,0.93)) !important;
  backdrop-filter: blur(24px) saturate(1.8) !important;
  border-bottom: 1px solid rgba(0,123,255,0.1) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.9),
    0 2px 20px rgba(0,123,255,0.08),
    0 4px 32px rgba(0,0,0,0.04) !important;
}
.navbar.scrolled {
  background: rgba(255,255,255,0.98) !important;
  border-bottom-color: rgba(0,123,255,0.16) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,1),
    0 4px 32px rgba(0,123,255,0.12),
    0 2px 8px rgba(0,0,0,0.05) !important;
}

/* ══ NAV LOGO — white background fix ══ */
.nav-logo-img {
  height: 40px; width: auto; display: block;
  /* Shadow makes white tagline visible on white bg */
  filter:
    drop-shadow(0 1px 3px rgba(0,0,0,0.18))
    drop-shadow(0 0 10px rgba(0,123,255,0.22)) !important;
  transition: filter 0.3s ease, transform 0.3s ease;
}
.nav-logo-img:hover {
  transform: scale(1.04);
  filter:
    drop-shadow(0 2px 6px rgba(0,0,0,0.22))
    drop-shadow(0 0 18px rgba(0,123,255,0.38))
    drop-shadow(0 0 10px rgba(245,158,11,0.28)) !important;
}

/* Optional: glass pill container around logo */
.nav-logo {
  background: rgba(255,255,255,0.6);
  border: 1px solid rgba(0,123,255,0.1);
  border-radius: 10px;
  padding: 4px 10px 4px 6px;
  backdrop-filter: blur(8px);
  transition: background 0.25s, box-shadow 0.25s;
}
.nav-logo:hover {
  background: rgba(255,255,255,0.85);
  box-shadow: 0 2px 14px rgba(0,123,255,0.14);
}

/* Nav links — dark on white */
.nav-links a {
  color: #1E293B !important;
  font-family: var(--f-ui) !important;
  font-weight: 500 !important;
}
.nav-links a:hover, .nav-links a.active {
  color: #0057D9 !important;
  background: rgba(0,87,217,0.06) !important;
}
.nav-links a::after {
  background: linear-gradient(90deg, #0057D9, #F59E0B) !important;
}

/* Nav CTA — gold on white */
.nav-cta {
  background: linear-gradient(135deg, #FCD34D, #F59E0B, #D97706) !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(245,158,11,0.38) !important;
}
.nav-cta:hover {
  box-shadow: 0 8px 32px rgba(245,158,11,0.55) !important;
  transform: translateY(-2px);
}

/* Hamburger lines — dark */
.hamburger span { background: #1E293B !important; }

/* Mobile menu — white */
.mobile-menu {
  background: rgba(255,255,255,0.99) !important;
  border-bottom: 1px solid rgba(0,123,255,0.1) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
}
.mobile-menu a { color: #1E293B !important; }
.mobile-menu a:hover { color: #0057D9 !important; background: rgba(0,87,217,0.05) !important; }

/* Language switcher — on white navbar */
.lang-btn {
  background: rgba(0,87,217,0.07) !important;
  border-color: rgba(0,87,217,0.22) !important;
  color: #1E293B !important;
}
.lang-btn:hover {
  background: rgba(0,87,217,0.12) !important;
  border-color: #0057D9 !important;
  box-shadow: 0 4px 14px rgba(0,87,217,0.18) !important;
}
.lang-arrow { color: #0057D9 !important; }

/* ══ FOOTER — Deep Navy Premium ══ */
footer {
  background: linear-gradient(135deg,
    #071120 0%,
    #0B1F3A 50%,
    #102A43 100%) !important;
  position: relative; overflow: hidden;
}
/* Subtle grid pattern overlay */
footer::after {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(0,191,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,191,255,0.025) 1px, transparent 1px);
  background-size: 48px 48px;
  z-index: 0;
}
footer > * { position: relative; z-index: 1; }

/* Top gold-blue divider */
footer::before {
  content: ''; position: absolute; top: 0; left: 6%; right: 6%; height: 1px;
  background: linear-gradient(90deg,
    transparent,
    rgba(0,191,255,0.5),
    rgba(245,158,11,0.7),
    rgba(0,191,255,0.5),
    transparent) !important;
  opacity: 0.7 !important;
  z-index: 2;
}

/* Footer logo — glows on dark */
.footer-logo-img {
  height: 46px; width: auto; display: block; margin-bottom: 1rem;
  filter:
    drop-shadow(0 0 10px rgba(0,191,255,0.35))
    drop-shadow(0 0 20px rgba(0,191,255,0.15))
    drop-shadow(0 2px 8px rgba(255,193,7,0.18)) !important;
  transition: filter 0.35s ease;
}
.footer-logo-img:hover {
  filter:
    drop-shadow(0 0 18px rgba(0,191,255,0.6))
    drop-shadow(0 0 36px rgba(0,191,255,0.25))
    drop-shadow(0 2px 14px rgba(255,193,7,0.38)) !important;
}

/* Footer text */
.footer-desc { color: rgba(255,255,255,0.55) !important; line-height: 1.75 !important; }
.footer-col h4 {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 700 !important; letter-spacing: 3px !important;
  background: linear-gradient(135deg, #64B5FF, #FCD34D) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
footer .footer-col a,
footer .contact-item { color: rgba(255,255,255,0.52) !important; }
footer .footer-col a:hover { color: #64B5FF !important; padding-left: 5px !important; }
.footer-copy   { color: rgba(255,255,255,0.35) !important; }
.footer-bottom { border-top-color: rgba(255,255,255,0.07) !important; }
.footer-legal a { color: rgba(255,255,255,0.35) !important; }
.footer-legal a:hover { color: #64B5FF !important; }
.disclaimer-text { color: rgba(255,255,255,0.32) !important; font-size: 0.75rem !important; }
.social-link {
  color: rgba(255,255,255,0.5) !important;
  border-color: rgba(255,255,255,0.12) !important;
}
.social-link:hover {
  color: #64B5FF !important;
  background: rgba(0,123,255,0.1) !important;
  border-color: rgba(0,123,255,0.4) !important;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAVBAR LOGO — Premium Transparent Version
   Removed: white container pill (excess space)
   Added:   crisp glow, no background box
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Remove the white glass pill container */
.nav-logo {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
}
.nav-logo:hover {
  background: none !important;
  box-shadow: none !important;
}

/* Logo image — crisp, no box, premium glow */
.nav-logo-img {
  height: 38px !important;
  width: auto !important;
  display: block !important;
  /* Sharp blue-gold glow — makes logo pop on white navbar */
  filter:
    drop-shadow(0 1px 0px rgba(255,255,255,0.8))
    drop-shadow(0 0 8px rgba(0,123,255,0.3))
    drop-shadow(0 0 3px rgba(245,158,11,0.15)) !important;
  transition: filter 0.3s ease, transform 0.3s ease !important;
}
.nav-logo-img:hover {
  transform: scale(1.04) !important;
  filter:
    drop-shadow(0 1px 0px rgba(255,255,255,0.9))
    drop-shadow(0 0 14px rgba(0,123,255,0.5))
    drop-shadow(0 0 8px rgba(245,158,11,0.3)) !important;
}

/* Mobile — slightly smaller */
@media (max-width: 768px) {
  .nav-logo-img { height: 32px !important; }
}

/* ── Footer logo — glows on dark bg ── */
.footer-logo-img {
  height: 44px !important;
  width: auto !important;
  display: block !important;
  margin-bottom: 1rem !important;
  /* On dark: white glow + blue-gold accent */
  filter:
    drop-shadow(0 0 12px rgba(0,191,255,0.45))
    drop-shadow(0 0 24px rgba(0,191,255,0.18))
    drop-shadow(0 2px 6px rgba(255,193,7,0.2)) !important;
  transition: filter 0.35s ease !important;
}
.footer-logo-img:hover {
  filter:
    drop-shadow(0 0 20px rgba(0,191,255,0.7))
    drop-shadow(0 0 40px rgba(0,191,255,0.3))
    drop-shadow(0 2px 12px rgba(255,193,7,0.4)) !important;
}

/* ── trade.html navbar logo (dark bg) ── */
.trade-nav .nav-logo-img,
.trade-nav img {
  height: 36px !important;
  filter:
    drop-shadow(0 0 10px rgba(0,229,255,0.45))
    drop-shadow(0 0 4px rgba(255,215,0,0.2)) !important;
}
.trade-nav .nav-logo-img:hover,
.trade-nav img:hover {
  filter:
    drop-shadow(0 0 18px rgba(0,229,255,0.7))
    drop-shadow(0 0 8px rgba(255,215,0,0.4)) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAVBAR — FINAL DEFINITIVE OVERRIDE
   Deep navy dark glassmorphism
   TradingView × Binance × Apple premium
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── Base navbar ── */
.navbar {
  background: linear-gradient(135deg,
    rgba(4, 10, 28, 0.96) 0%,
    rgba(7, 14, 36, 0.97) 50%,
    rgba(5, 11, 30, 0.96) 100%) !important;
  backdrop-filter: blur(28px) saturate(1.6) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.6) !important;
  border-bottom: 1px solid rgba(0, 191, 255, 0.12) !important;
  box-shadow:
    0 1px 0 rgba(0, 191, 255, 0.06),
    0 4px 32px rgba(0, 0, 0, 0.5),
    0 0 60px rgba(0, 119, 255, 0.04) !important;
  height: 68px !important;
  padding: 0 2.5rem !important;
  transition: background 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
}

/* Scrolled state — stronger glass + border glow */
.navbar.scrolled {
  background: linear-gradient(135deg,
    rgba(3, 7, 20, 0.99) 0%,
    rgba(5, 11, 28, 0.99) 100%) !important;
  border-bottom: 1px solid rgba(0, 191, 255, 0.22) !important;
  box-shadow:
    0 1px 0 rgba(0, 191, 255, 0.12),
    0 6px 40px rgba(0, 0, 0, 0.65),
    0 0 80px rgba(0, 119, 255, 0.07),
    inset 0 -1px 0 rgba(0, 191, 255, 0.08) !important;
}

/* ── Logo container — no background box ── */
.nav-logo {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  text-decoration: none !important;
}
.nav-logo:hover {
  background: none !important;
  box-shadow: none !important;
}

/* ── Logo image — crisp HD on dark ── */
.nav-logo-img {
  height: 40px !important;
  width: auto !important;
  display: block !important;
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
  /* Transparent PNG glows naturally on dark */
  filter:
    brightness(1.08)
    contrast(1.12)
    drop-shadow(0 0 10px rgba(0, 191, 255, 0.55))
    drop-shadow(0 0 22px rgba(0, 119, 255, 0.28))
    drop-shadow(0 2px 4px rgba(255, 215, 0, 0.18)) !important;
  transition: filter 0.35s ease, transform 0.35s ease !important;
}
.nav-logo:hover .nav-logo-img,
.nav-logo-img:hover {
  transform: scale(1.05) !important;
  filter:
    brightness(1.14)
    contrast(1.15)
    drop-shadow(0 0 16px rgba(0, 229, 255, 0.8))
    drop-shadow(0 0 36px rgba(0, 119, 255, 0.45))
    drop-shadow(0 0 12px rgba(255, 215, 0, 0.4)) !important;
}

/* Mobile logo */
@media (max-width: 768px) {
  .nav-logo-img { height: 34px !important; }
  .navbar { padding: 0 1.25rem !important; height: 62px !important; }
}
@media (max-width: 400px) {
  .nav-logo-img { height: 30px !important; }
}

/* ── Nav links — white on dark ── */
.nav-links a {
  color: rgba(255, 255, 255, 0.78) !important;
  font-family: 'Exo 2', var(--f-ui), sans-serif !important;
  font-size: 0.83rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.3px !important;
  padding: 0.42rem 0.78rem !important;
  border-radius: 7px !important;
  position: relative !important;
  transition: color 0.2s ease, background 0.2s ease !important;
  white-space: nowrap !important;
}

/* Animated underline */
.nav-links a::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important; left: 50% !important; right: 50% !important;
  height: 1.5px !important;
  background: linear-gradient(90deg, #00BFFF, #FFD700) !important;
  border-radius: 2px !important;
  transition: left 0.25s ease, right 0.25s ease !important;
}
.nav-links a:hover::after,
.nav-links a.active::after {
  left: 8px !important; right: 8px !important;
}
.nav-links a:hover,
.nav-links a.active {
  color: #ffffff !important;
  background: rgba(0, 191, 255, 0.1) !important;
}

/* ── CTA button — gold metallic ── */
.nav-cta,
a.nav-cta {
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  background: linear-gradient(135deg, #FFD54F 0%, #F59E0B 50%, #D97706 100%) !important;
  color: #0a0f1e !important;
  padding: 0.44rem 1.1rem !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 18px rgba(255, 215, 0, 0.35), 0 1px 0 rgba(255,255,255,0.15) inset !important;
  border: none !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
.nav-cta::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: -80% !important; width: 50% !important; height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent) !important;
  animation: navCtaShimmer 2.8s ease-in-out infinite !important;
  pointer-events: none !important;
}
@keyframes navCtaShimmer { to { left: 140%; } }
.nav-cta:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 30px rgba(255, 215, 0, 0.55), 0 1px 0 rgba(255,255,255,0.2) inset !important;
  color: #050a18 !important;
}

/* ── Hamburger — white lines ── */
.hamburger span {
  background: rgba(255, 255, 255, 0.85) !important;
  transition: all 0.3s ease !important;
}
.hamburger:hover span { background: #00BFFF !important; }

/* ── Mobile menu — matching dark glass ── */
.mobile-menu {
  background: linear-gradient(135deg,
    rgba(4, 10, 28, 0.99) 0%,
    rgba(6, 13, 34, 0.99) 100%) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid rgba(0, 191, 255, 0.15) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7) !important;
  top: 68px !important;
}
@media (max-width: 768px) { .mobile-menu { top: 62px !important; } }

.mobile-menu a {
  color: rgba(255, 255, 255, 0.78) !important;
  font-family: 'Exo 2', sans-serif !important;
  font-size: 0.92rem !important;
  border-radius: 8px !important;
  transition: color 0.2s, background 0.2s !important;
}
.mobile-menu a:hover {
  color: #00E5FF !important;
  background: rgba(0, 191, 255, 0.1) !important;
}

/* Mobile language switcher on dark */
.mobile-lang-item {
  border-top-color: rgba(0, 191, 255, 0.1) !important;
}
.mobile-lang-item .lang-btn {
  background: rgba(0, 191, 255, 0.08) !important;
  border-color: rgba(0, 191, 255, 0.22) !important;
  color: rgba(255,255,255,0.8) !important;
}

/* ── Language switcher on dark navbar ── */
.lang-btn {
  background: rgba(0, 191, 255, 0.08) !important;
  border-color: rgba(0, 191, 255, 0.22) !important;
  color: rgba(255, 255, 255, 0.82) !important;
}
.lang-btn:hover {
  background: rgba(0, 191, 255, 0.15) !important;
  border-color: rgba(0, 229, 255, 0.5) !important;
  box-shadow: 0 0 14px rgba(0, 191, 255, 0.2) !important;
}
.lang-arrow   { color: #00BFFF !important; }
.lang-current-label { color: rgba(255,255,255,0.9) !important; }
.lang-current-flag  { filter: brightness(1.1) !important; }
.lang-dropdown {
  background: rgba(5, 11, 30, 0.98) !important;
  border-color: rgba(0, 191, 255, 0.18) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.7), 0 0 0 1px rgba(0,191,255,0.06) !important;
}
.lang-option { color: rgba(255,255,255,0.72) !important; }
.lang-option:hover { background: rgba(0,191,255,0.1) !important; color: #00E5FF !important; }
.lang-option.active { background: rgba(0,191,255,0.14) !important; color: #00E5FF !important; }


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LOGO FINAL FIX — ZERO GLOW / HALO
   Clean crisp logo, no background bleed
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Kill every drop-shadow / filter on logo */
.nav-logo,
.nav-logo:hover,
a.nav-logo,
a.nav-logo:hover {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.nav-logo-img,
.nav-logo img {
  height: 42px !important;
  width: auto !important;
  display: block !important;
  /* NO drop-shadow, no filter — pure clean render */
  filter: none !important;
  -webkit-filter: none !important;
  transition: transform 0.3s ease, opacity 0.3s ease !important;
  opacity: 1 !important;
  image-rendering: -webkit-optimize-contrast !important;
}

/* Hover: only subtle scale + slight brightness — zero glow */
.nav-logo:hover .nav-logo-img,
.nav-logo:hover img,
.nav-logo-img:hover {
  filter: none !important;
  -webkit-filter: none !important;
  transform: scale(1.04) !important;
  opacity: 0.92 !important;
}

/* Mobile sizing */
@media (max-width: 768px) {
  .nav-logo-img,
  .nav-logo img { height: 34px !important; }
}

/* Footer logo — also clean, just a bit of contrast boost, no glow */
.footer-logo-img,
footer .nav-logo-img,
footer img[alt="ALGORAM"] {
  height: 44px !important;
  width: auto !important;
  filter: brightness(1.1) contrast(1.05) !important;
  -webkit-filter: brightness(1.1) contrast(1.05) !important;
  transition: filter 0.3s ease !important;
}
.footer-logo-img:hover {
  filter: brightness(1.18) contrast(1.08) !important;
  -webkit-filter: brightness(1.18) contrast(1.08) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAVBAR LAYOUT FIX — links not cut off
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.nav-container,
.navbar > .container,
.navbar {
  overflow: visible !important;
}
.nav-links {
  flex-shrink: 0 !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
  gap: 0.15rem !important;
}
.nav-links a {
  font-size: 0.8rem !important;
  padding: 0.38rem 0.65rem !important;
  white-space: nowrap !important;
}
/* Tighten spacing on mid screens */
@media (max-width: 1200px) {
  .nav-links a { font-size: 0.76rem !important; padding: 0.35rem 0.5rem !important; }
  .navbar { padding: 0 1.5rem !important; }
}
@media (max-width: 1024px) {
  .nav-links a { font-size: 0.74rem !important; padding: 0.3rem 0.42rem !important; }
  .navbar { padding: 0 1rem !important; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BLOG SECTION — Homepage Cards
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.blog-section { background: var(--w2) !important; }

/* Grid: 1 featured (wide) + 2 normal */
.blog-grid {
  display: grid;
  grid-template-columns: 1.45fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 1.75rem;
  margin-top: 3rem;
}
.blog-card-featured { grid-row: span 1; }

/* Card base */
.blog-card {
  background: #ffffff;
  border: 1px solid rgba(0,123,255,0.1);
  border-radius: 20px;
  overflow: hidden;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
  display: flex; flex-direction: column;
}
.blog-card:hover {
  transform: translateY(-8px);
  border-color: rgba(0,123,255,0.28);
  box-shadow: 0 16px 48px rgba(0,123,255,0.13), 0 4px 16px rgba(0,0,0,0.07);
}

/* Card image area */
.blog-card-img {
  position: relative;
  height: 200px;
  overflow: hidden;
}
.blog-card-featured .blog-card-img { height: 240px; }

/* Animated gradient placeholder images */
.blog-img-placeholder {
  width: 100%; height: 100%;
  position: relative;
  overflow: hidden;
}
.blog-img-1 {
  background: linear-gradient(135deg, #040c20 0%, #071730 40%, #0a1f3c 100%);
}
.blog-img-2 {
  background: linear-gradient(135deg, #050a1a 0%, #0c1628 40%, #091624 100%);
}
.blog-img-3 {
  background: linear-gradient(135deg, #06101e 0%, #0d1a2e 40%, #0a1628 100%);
}
.blog-img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.55) 100%);
  pointer-events: none;
}

/* Inline chart canvas inside card image */
.blog-chart-anim {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
}
.blog-chart-anim canvas {
  width: 100% !important;
  height: 100% !important;
  display: block;
}

/* Category badge */
.blog-cat-badge {
  position: absolute; top: 14px; left: 14px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.66rem; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; padding: 4px 12px; border-radius: 20px;
  border: 1px solid;
  backdrop-filter: blur(8px);
  z-index: 2;
}
.cat-strategy  { color: #00E5FF; border-color: rgba(0,229,255,0.5); background: rgba(0,229,255,0.12); }
.cat-education { color: #818CF8; border-color: rgba(129,140,248,0.5); background: rgba(129,140,248,0.12); }
.cat-risk      { color: #FFD700; border-color: rgba(255,215,0,0.5); background: rgba(255,215,0,0.12); }
.cat-market    { color: #00FF88; border-color: rgba(0,255,136,0.5); background: rgba(0,255,136,0.12); }
.cat-tech      { color: #F472B6; border-color: rgba(244,114,182,0.5); background: rgba(244,114,182,0.12); }

/* Card body */
.blog-card-body {
  padding: 1.5rem;
  display: flex; flex-direction: column;
  flex: 1;
}
.blog-card-featured .blog-card-body { padding: 1.75rem 2rem; }

/* Meta row */
.blog-meta {
  display: flex; gap: 1rem; align-items: center;
  margin-bottom: 0.75rem;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.5px;
  color: #94A3B8;
}

/* Title */
.blog-title {
  font-family: 'Oxanium', sans-serif;
  font-size: 1rem; font-weight: 700;
  color: #0F172A;
  line-height: 1.45;
  margin-bottom: 0.75rem;
  transition: color 0.2s;
}
.blog-card-featured .blog-title { font-size: 1.15rem; }
.blog-card:hover .blog-title { color: #007BFF; }

/* Excerpt */
.blog-excerpt {
  font-family: 'Inter', sans-serif;
  font-size: 0.86rem; line-height: 1.7;
  color: #475569;
  flex: 1;
  margin-bottom: 1.25rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Author + read more row */
.blog-footer-row {
  display: flex; align-items: center;
  justify-content: space-between;
  padding-top: 1rem;
  border-top: 1px solid rgba(0,123,255,0.08);
  margin-top: auto;
}
.blog-author { display: flex; align-items: center; gap: 0.6rem; }
.blog-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  font-family: 'Oxanium', sans-serif;
  font-size: 0.75rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.ba-1 { background: rgba(0,123,255,0.12); color: #007BFF; border: 1px solid rgba(0,123,255,0.25); }
.ba-2 { background: rgba(245,158,11,0.12); color: #D97706; border: 1px solid rgba(245,158,11,0.25); }
.blog-author-name {
  font-family: 'Exo 2', sans-serif;
  font-size: 0.8rem; font-weight: 700; color: #1E293B;
}
.blog-author-role {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.65rem; font-weight: 600; letter-spacing: 0.5px;
  color: #94A3B8;
}
.blog-read-btn {
  font-family: 'Exo 2', sans-serif;
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.3px;
  color: #007BFF; text-decoration: none;
  padding: 0.38rem 0.9rem; border-radius: 7px;
  border: 1px solid rgba(0,123,255,0.25);
  background: rgba(0,123,255,0.04);
  transition: all 0.22s ease;
  white-space: nowrap;
}
.blog-read-btn:hover {
  background: rgba(0,123,255,0.1);
  border-color: #007BFF;
  transform: translateX(3px);
}

/* Bottom CTA row */
.blog-cta-row {
  text-align: center;
  margin-top: 2.5rem;
}

/* ── Responsive ── */
@media (max-width: 1100px) {
  .blog-grid { grid-template-columns: 1fr 1fr; }
  .blog-card-featured { grid-column: span 2; }
}
@media (max-width: 680px) {
  .blog-grid { grid-template-columns: 1fr; }
  .blog-card-featured { grid-column: auto; }
  .blog-card-img, .blog-card-featured .blog-card-img { height: 180px; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BLOG LISTING PAGE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.blog-listing-hero {
  background: linear-gradient(160deg, #071120 0%, #0B1F3A 50%, #071120 100%);
  padding: 120px 0 70px;
  text-align: center;
  position: relative; overflow: hidden;
}
.blog-listing-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(0,123,255,0.06) 1px, transparent 1px);
  background-size: 32px 32px;
}
.blog-listing-hero h1 {
  font-family: 'Oxanium', sans-serif;
  font-size: clamp(2rem,5vw,3.2rem); font-weight: 900;
  color: #fff; position: relative; z-index: 1;
  margin-bottom: 1rem;
}
.blog-listing-hero h1 span {
  background: linear-gradient(135deg,#00BFFF,#F59E0B);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.blog-listing-hero p {
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem; color: rgba(255,255,255,0.65);
  max-width: 560px; margin: 0 auto; line-height: 1.7;
  position: relative; z-index: 1;
}

/* Filter tabs */
.blog-filter-tabs {
  display: flex; gap: 0.5rem; flex-wrap: wrap;
  justify-content: center; margin: 2.5rem 0;
}
.filter-tab {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.8rem; font-weight: 700; letter-spacing: 1px;
  padding: 0.45rem 1.2rem; border-radius: 25px;
  border: 1px solid rgba(0,123,255,0.2);
  color: #64748B; background: #fff;
  cursor: pointer; transition: all 0.22s;
}
.filter-tab:hover, .filter-tab.active {
  background: #007BFF; color: #fff;
  border-color: #007BFF;
  box-shadow: 0 4px 16px rgba(0,123,255,0.28);
}

/* Full listing grid */
.blog-listing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
  margin-bottom: 3rem;
}
@media (max-width: 1000px) { .blog-listing-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 640px)  { .blog-listing-grid { grid-template-columns: 1fr; } }

/* Pagination */
.blog-pagination {
  display: flex; justify-content: center; gap: 0.5rem;
  margin: 2rem 0 4rem;
}
.page-btn {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px; font-family: 'Exo 2', sans-serif;
  font-size: 0.85rem; font-weight: 600;
  border: 1px solid rgba(0,123,255,0.2);
  color: #475569; background: #fff;
  cursor: pointer; transition: all 0.2s;
  text-decoration: none;
}
.page-btn:hover, .page-btn.active {
  background: #007BFF; color: #fff;
  border-color: #007BFF;
  box-shadow: 0 4px 14px rgba(0,123,255,0.28);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BLOG DETAIL PAGE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.blog-detail-wrap {
  max-width: 1200px; margin: 0 auto;
  padding: 0 2rem 80px;
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 3rem;
  align-items: start;
}
@media (max-width: 900px) {
  .blog-detail-wrap { grid-template-columns: 1fr; }
  .blog-sidebar { order: 2; }
}

/* Article hero */
.article-hero {
  background: linear-gradient(160deg, #071120 0%, #0c1e36 60%, #071120 100%);
  padding: 110px 0 70px;
  position: relative; overflow: hidden;
}
.article-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(0,191,255,0.05) 1px, transparent 1px);
  background-size: 36px 36px;
}
.article-hero-inner {
  max-width: 860px; margin: 0 auto; padding: 0 2rem;
  position: relative; z-index: 1; text-align: center;
}
.article-cat-badge {
  display: inline-block; margin-bottom: 1.25rem;
  font-family: 'Rajdhani', sans-serif; font-size: 0.68rem;
  font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  color: #00E5FF; background: rgba(0,229,255,0.1);
  border: 1px solid rgba(0,229,255,0.3);
  padding: 5px 16px; border-radius: 20px;
}
.article-title {
  font-family: 'Oxanium', sans-serif;
  font-size: clamp(1.7rem,4vw,2.8rem); font-weight: 900;
  color: #fff; line-height: 1.25; margin-bottom: 1.5rem;
}
.article-title span {
  background: linear-gradient(135deg,#00BFFF,#F59E0B);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.article-meta-row {
  display: flex; align-items: center; justify-content: center;
  gap: 1.5rem; flex-wrap: wrap;
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.78rem; font-weight: 600; letter-spacing: 0.5px;
  color: rgba(255,255,255,0.55);
}
.article-meta-author {
  display: flex; align-items: center; gap: 0.6rem;
}
.article-meta-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(0,123,255,0.2); border: 1px solid rgba(0,123,255,0.4);
  font-family: 'Oxanium', sans-serif; font-size: 0.7rem; font-weight: 800;
  color: #00BFFF; display: flex; align-items: center; justify-content: center;
}

/* Article body */
.article-body {
  padding-top: 3rem;
}
.article-cover {
  width: 100%; height: 380px; border-radius: 20px;
  overflow: hidden; margin-bottom: 2.5rem;
  position: relative;
  background: linear-gradient(135deg, #040c20, #071730, #0a1f3c);
  border: 1px solid rgba(0,123,255,0.15);
}
#articleChart { width: 100%; height: 100%; }

/* Article content typography */
.article-content h2 {
  font-family: 'Oxanium', sans-serif;
  font-size: 1.45rem; font-weight: 800;
  color: #0F172A; margin: 2.5rem 0 1rem;
  padding-bottom: 0.6rem;
  border-bottom: 2px solid rgba(0,123,255,0.12);
}
.article-content h3 {
  font-family: 'Exo 2', sans-serif;
  font-size: 1.1rem; font-weight: 700;
  color: #007BFF; margin: 1.75rem 0 0.75rem;
}
.article-content p {
  font-family: 'Inter', sans-serif;
  font-size: 0.97rem; line-height: 1.85;
  color: #334155; margin-bottom: 1.25rem;
}
.article-content ul, .article-content ol {
  padding-left: 1.5rem; margin-bottom: 1.25rem;
}
.article-content li {
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem; line-height: 1.8;
  color: #334155; margin-bottom: 0.4rem;
}
.article-content strong { color: #0F172A; font-weight: 700; }

/* Pull quote */
.article-pullquote {
  border-left: 4px solid #007BFF;
  background: linear-gradient(135deg, rgba(0,123,255,0.05), rgba(245,158,11,0.03));
  border-radius: 0 14px 14px 0;
  padding: 1.25rem 1.5rem;
  margin: 2rem 0;
}
.article-pullquote p {
  font-family: 'Exo 2', sans-serif;
  font-size: 1.05rem; font-weight: 600;
  color: #007BFF; font-style: italic;
  margin: 0;
}

/* Stats box inside article */
.article-stats-box {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 1rem; margin: 2rem 0;
}
.asb-item {
  background: #fff; border: 1px solid rgba(0,123,255,0.12);
  border-radius: 14px; padding: 1.25rem;
  text-align: center;
  box-shadow: 0 2px 12px rgba(0,123,255,0.07);
}
.asb-val {
  font-family: 'Oxanium', sans-serif;
  font-size: 1.6rem; font-weight: 900;
  background: linear-gradient(135deg,#007BFF,#F59E0B);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  margin-bottom: 4px;
}
.asb-lbl {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.72rem; font-weight: 600; letter-spacing: 1px;
  color: #94A3B8; text-transform: uppercase;
}

/* Tags */
.article-tags { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 2rem 0; }
.article-tag {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 1px;
  color: #007BFF; background: rgba(0,123,255,0.07);
  border: 1px solid rgba(0,123,255,0.2);
  padding: 4px 12px; border-radius: 20px;
  text-decoration: none; transition: all 0.2s;
}
.article-tag:hover { background: #007BFF; color: #fff; }

/* Author bio box */
.article-author-box {
  background: #fff; border: 1px solid rgba(0,123,255,0.12);
  border-radius: 18px; padding: 1.75rem;
  display: flex; gap: 1.25rem; align-items: flex-start;
  margin: 2.5rem 0;
  box-shadow: 0 4px 20px rgba(0,123,255,0.08);
}
.author-bio-avatar {
  width: 64px; height: 64px; border-radius: 50%; flex-shrink: 0;
  background: rgba(0,123,255,0.1); border: 2px solid rgba(0,123,255,0.3);
  font-family: 'Oxanium', sans-serif; font-size: 1.2rem; font-weight: 900;
  color: #007BFF; display: flex; align-items: center; justify-content: center;
}
.author-bio-name {
  font-family: 'Oxanium', sans-serif;
  font-size: 1rem; font-weight: 800; color: #0F172A; margin-bottom: 2px;
}
.author-bio-role {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.72rem; font-weight: 600; letter-spacing: 1px;
  color: #007BFF; margin-bottom: 0.6rem; text-transform: uppercase;
}
.author-bio-text {
  font-family: 'Inter', sans-serif;
  font-size: 0.87rem; line-height: 1.7; color: #475569;
}

/* ── Sidebar ── */
.blog-sidebar { position: sticky; top: 90px; }
.sidebar-widget {
  background: #fff; border: 1px solid rgba(0,123,255,0.1);
  border-radius: 18px; padding: 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 2px 12px rgba(0,123,255,0.06);
}
.sidebar-widget-title {
  font-family: 'Oxanium', sans-serif;
  font-size: 0.85rem; font-weight: 800; letter-spacing: 1.5px;
  color: #0F172A; text-transform: uppercase;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid rgba(0,123,255,0.1);
  margin-bottom: 1rem;
}

/* CTA sidebar widget */
.sidebar-cta {
  background: linear-gradient(135deg, #071120, #0d1e38);
  border: 1px solid rgba(0,191,255,0.18);
  border-radius: 18px; padding: 1.75rem 1.5rem;
  text-align: center; margin-bottom: 1.5rem;
}
.sidebar-cta h4 {
  font-family: 'Oxanium', sans-serif;
  font-size: 1rem; font-weight: 800; color: #fff; margin-bottom: 0.6rem;
}
.sidebar-cta p {
  font-size: 0.82rem; color: rgba(255,255,255,0.6);
  line-height: 1.6; margin-bottom: 1.25rem;
}
.sidebar-cta .btn-primary {
  width: 100%; text-align: center; display: block;
  padding: 0.7rem 1rem !important;
  font-size: 0.88rem !important;
}

/* Related post mini card */
.related-mini {
  display: flex; gap: 0.75rem; align-items: flex-start;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(0,123,255,0.07);
  text-decoration: none; transition: all 0.2s;
}
.related-mini:last-child { border-bottom: none; padding-bottom: 0; }
.related-mini:hover .related-mini-title { color: #007BFF; }
.related-mini-img {
  width: 58px; height: 48px; border-radius: 8px; flex-shrink: 0;
  background: linear-gradient(135deg, #071120, #0d1e38);
  border: 1px solid rgba(0,123,255,0.15);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
}
.related-mini-title {
  font-family: 'Exo 2', sans-serif;
  font-size: 0.82rem; font-weight: 600; color: #1E293B;
  line-height: 1.4; transition: color 0.2s;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.related-mini-date {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.65rem; font-weight: 600; letter-spacing: 0.5px;
  color: #94A3B8; margin-top: 3px;
}

/* Topic tags sidebar */
.sidebar-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FOUNDERS SECTION — REAL PHOTO + MOBILE FIX
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── Real photo inside circular frame ── */
.founder-photo-frame {
  width: 150px !important;
  height: 150px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  position: absolute !important;
  top: 50% !important; left: 50% !important;
  transform: translate(-50%, -50%) !important;
  border: 3px solid rgba(0,123,255,0.6) !important;
  box-shadow:
    0 0 0 1px rgba(0,123,255,0.15),
    0 8px 32px rgba(0,123,255,0.25) !important;
}
.founder-frame-gold {
  border-color: rgba(245,158,11,0.65) !important;
  box-shadow:
    0 0 0 1px rgba(245,158,11,0.15),
    0 8px 32px rgba(245,158,11,0.25) !important;
}
.founder-real-photo {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
  border-radius: 50% !important;
  /* Photo already has black bg — remove it for clean circular crop */
  filter: none !important;
  transition: transform 0.45s ease !important;
}
.founder-card:hover .founder-real-photo {
  transform: scale(1.06) !important;
}
/* Gold tint for Rahul's card to differentiate */
.founder-real-photo-gold {
  filter: hue-rotate(3deg) saturate(1.05) !important;
}

/* ── Photo wrap sizing ── */
.founder-photo-wrap {
  width: 180px !important;
  height: 180px !important;
  position: relative !important;
  margin: 0 auto 1.75rem !important;
  flex-shrink: 0 !important;
}

/* ── Pulse rings ── */
.founder-photo-ring {
  position: absolute !important;
  border-radius: 50% !important;
  top: 50% !important; left: 50% !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
}
.founder-ring-1 {
  width: 162px !important; height: 162px !important;
  border: 1px solid rgba(0,123,255,0.22) !important;
  animation: ringPulse 3s ease-in-out infinite !important;
}
.founder-ring-2 {
  width: 190px !important; height: 190px !important;
  border: 1px solid rgba(0,123,255,0.09) !important;
  animation: ringPulse 3s ease-in-out infinite 1.5s !important;
}
.founder-ring-gold-1 {
  width: 162px !important; height: 162px !important;
  border: 1px solid rgba(245,158,11,0.28) !important;
  animation: ringPulse 3s ease-in-out infinite !important;
}
.founder-ring-gold-2 {
  width: 190px !important; height: 190px !important;
  border: 1px solid rgba(245,158,11,0.1) !important;
  animation: ringPulse 3s ease-in-out infinite 1.5s !important;
}

/* ── Active badge ── */
.founder-badge-active {
  position: absolute !important;
  bottom: 0 !important; left: 50% !important;
  transform: translateX(-50%) !important;
  font-family: 'Rajdhani', sans-serif !important;
  font-size: 0.62rem !important; font-weight: 700 !important;
  letter-spacing: 1px !important;
  padding: 3px 12px !important;
  border-radius: 20px !important;
  white-space: nowrap !important;
  z-index: 3 !important;
}

/* ── Card inner layout ── */
.founder-card-inner {
  padding: 2.25rem 2rem 2rem !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

/* ── Info ── */
.founder-info { width: 100% !important; }
.founder-role-tag {
  display: inline-block !important;
  font-family: 'Rajdhani', sans-serif !important;
  font-size: 0.63rem !important;
  font-weight: 700 !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  padding: 4px 14px !important;
  border-radius: 20px !important;
  margin-bottom: 0.7rem !important;
}
.founder-name {
  font-family: 'Oxanium', sans-serif !important;
  font-size: 1.45rem !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  margin-bottom: 0.25rem !important;
}
.founder-designation {
  font-size: 0.8rem !important;
  color: #64748B !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 1rem !important;
}
.founder-divider {
  height: 1px !important;
  width: 70% !important;
  margin: 0 auto 1rem !important;
}
.founder-desc {
  font-family: 'Inter', sans-serif !important;
  font-size: 0.88rem !important;
  line-height: 1.75 !important;
  color: #475569 !important;
  font-style: italic !important;
  margin-bottom: 1.25rem !important;
  padding: 0 0.25rem !important;
}
.founder-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0.45rem !important;
  margin-bottom: 1.5rem !important;
}
.f-tag {
  font-size: 0.7rem !important;
  padding: 4px 11px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(0,123,255,0.22) !important;
  color: #007BFF !important;
  background: rgba(0,123,255,0.05) !important;
}
.founder-socials {
  display: flex !important;
  gap: 0.65rem !important;
  justify-content: center !important;
}
.founder-social-btn {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 16px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(0,123,255,0.25) !important;
  color: #007BFF !important;
  font-size: 0.78rem !important;
  font-family: 'Exo 2', sans-serif !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  background: rgba(0,123,255,0.04) !important;
  transition: all 0.25s ease !important;
}
.founder-social-btn:hover {
  background: rgba(0,123,255,0.1) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 16px rgba(0,123,255,0.18) !important;
}

/* ── GRID — Desktop: 2 columns ── */
.founders-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 2rem !important;
  margin-top: 3rem !important;
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ── CARD wrapper ── */
.founder-card {
  border-radius: 22px !important;
  padding: 2px !important;
  background: linear-gradient(135deg,
    rgba(0,123,255,0.4),
    rgba(0,191,255,0.1),
    rgba(0,123,255,0.05)) !important;
  transition: transform 0.4s ease, box-shadow 0.4s ease !important;
}
.founder-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 24px 60px rgba(0,123,255,0.18) !important;
}
.founder-card:nth-child(2) {
  background: linear-gradient(135deg,
    rgba(245,158,11,0.4),
    rgba(253,211,79,0.12),
    rgba(245,158,11,0.05)) !important;
}
.founder-card:nth-child(2):hover {
  box-shadow: 0 24px 60px rgba(245,158,11,0.18) !important;
}
.founder-card-inner {
  background: rgba(255,255,255,0.96) !important;
  border-radius: 20px !important;
}

/* ── MOBILE — Stack single column, compact ── */
@media (max-width: 700px) {
  .founders-grid {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    max-width: 420px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .founder-card { padding: 2px !important; }
  .founder-card-inner { padding: 1.75rem 1.5rem 1.75rem !important; }
  .founder-photo-wrap {
    width: 150px !important;
    height: 150px !important;
    margin-bottom: 1.5rem !important;
  }
  .founder-photo-frame {
    width: 124px !important;
    height: 124px !important;
  }
  .founder-ring-1, .founder-ring-gold-1 { width: 134px !important; height: 134px !important; }
  .founder-ring-2, .founder-ring-gold-2 { width: 158px !important; height: 158px !important; }
  .founder-name { font-size: 1.25rem !important; }
  .founder-desc { font-size: 0.84rem !important; }
  .f-tag { font-size: 0.67rem !important; padding: 3px 9px !important; }
}

@media (max-width: 420px) {
  .founder-card-inner { padding: 1.5rem 1.1rem !important; }
  .founders-socials { flex-direction: column !important; align-items: center !important; }
  .founder-social-btn { width: 100% !important; justify-content: center !important; }
}

/* ── Founders message ── */
.founders-message { max-width: 800px !important; margin: 2.5rem auto 0 !important; }
.founders-msg-inner {
  background: rgba(255,255,255,0.9) !important;
  border: 1px solid rgba(0,123,255,0.14) !important;
  border-radius: 18px !important;
  padding: 2rem 2.5rem !important;
  display: flex !important;
  gap: 1.25rem !important;
  align-items: flex-start !important;
  box-shadow: 0 4px 20px rgba(0,123,255,0.07) !important;
}
.founders-msg-icon { font-size: 1.8rem !important; flex-shrink: 0 !important; }
.founders-msg-label {
  font-family: 'Rajdhani', sans-serif !important;
  font-size: 0.62rem !important; font-weight: 700 !important;
  letter-spacing: 3.5px !important; text-transform: uppercase !important;
  color: #007BFF !important; margin-bottom: 0.65rem !important;
}
.founders-quote {
  font-family: 'Exo 2', sans-serif !important;
  font-style: italic !important;
  font-size: 0.97rem !important;
  line-height: 1.8 !important;
  color: #334155 !important;
  margin-bottom: 1.25rem !important;
}
.founders-signatures { display: flex !important; align-items: center !important; gap: 1.5rem !important; }
.sig-line { font-family: 'Oxanium', sans-serif !important; font-size: 0.88rem !important; font-weight: 800 !important; background: linear-gradient(135deg,#007BFF,#F59E0B) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.sig-role { font-size: 0.68rem !important; color: #94A3B8 !important; margin-top: 2px !important; font-family: 'Rajdhani', sans-serif !important; letter-spacing: 1px !important; }
.sig-separator { color: #F59E0B !important; font-size: 1rem !important; opacity: 0.5 !important; }

@media (max-width: 600px) {
  .founders-msg-inner { flex-direction: column !important; align-items: center !important; text-align: center !important; padding: 1.5rem 1.25rem !important; }
  .founders-signatures { justify-content: center !important; }
}

/* ── Founders stats ── */
.founders-stats {
  display: grid !important;
  grid-template-columns: repeat(4,1fr) !important;
  gap: 1.25rem !important;
  margin-top: 2.5rem !important;
  padding: 1.75rem !important;
  background: rgba(255,255,255,0.88) !important;
  border: 1px solid rgba(0,123,255,0.1) !important;
  border-radius: 18px !important;
  box-shadow: 0 4px 20px rgba(0,123,255,0.07) !important;
}
@media (max-width: 700px) {
  .founders-stats { grid-template-columns: repeat(2,1fr) !important; gap: 1rem !important; padding: 1.25rem !important; }
}
@media (max-width: 380px) {
  .founders-stats { grid-template-columns: 1fr 1fr !important; }
}
.founder-stat-item { text-align: center !important; padding: 0.75rem 0 !important; position: relative !important; }
.founder-stat-item:not(:last-child)::after {
  content: '' !important;
  position: absolute !important; right: 0 !important; top: 15% !important; bottom: 15% !important;
  width: 1px !important;
  background: linear-gradient(180deg,transparent,rgba(0,123,255,0.2),transparent) !important;
}
@media (max-width: 700px) {
  .founder-stat-item:nth-child(2)::after,
  .founder-stat-item:nth-child(4)::after { display: none !important; }
}
.fstat-value {
  font-family: 'Oxanium', sans-serif !important;
  font-size: 1.75rem !important; font-weight: 900 !important;
  line-height: 1 !important; margin-bottom: 0.4rem !important;
  background: linear-gradient(135deg,#007BFF,#F59E0B) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.fstat-icon { font-size: 1.15rem !important; margin-bottom: 0.3rem !important; }
.fstat-label { font-family: 'Rajdhani', sans-serif !important; font-size: 0.73rem !important; font-weight: 600 !important; letter-spacing: 1px !important; color: #64748B !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LOADER — PREMIUM DARK FINTECH — MOBILE PERFECT
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#loader {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  /* Deep navy premium background */
  background: linear-gradient(145deg,
    #020812 0%,
    #050f1e 35%,
    #071528 65%,
    #040a16 100%) !important;
  overflow: hidden !important;
  transition: opacity 0.7s ease, visibility 0.7s ease !important;
}
#loader.hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Background canvas — full-screen particles */
#loaderCanvas {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Grid overlay */
.ldr-grid {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background-image:
    linear-gradient(rgba(0,123,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,123,255,0.04) 1px, transparent 1px) !important;
  background-size: 44px 44px !important;
}

/* Ambient glow orbs */
.ldr-orb {
  position: absolute !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  filter: blur(70px) !important;
  animation: ldrOrbPulse 4s ease-in-out infinite alternate !important;
}
.ldr-orb-1 {
  width: 45vw; height: 45vw;
  max-width: 380px; max-height: 380px;
  background: rgba(0,123,255,0.12) !important;
  top: -10%; left: -10% !important;
  animation-delay: 0s !important;
}
.ldr-orb-2 {
  width: 40vw; height: 40vw;
  max-width: 320px; max-height: 320px;
  background: rgba(245,158,11,0.08) !important;
  bottom: -10%; right: -8% !important;
  animation-delay: 1.5s !important;
}
.ldr-orb-3 {
  width: 30vw; height: 30vw;
  max-width: 240px; max-height: 240px;
  background: rgba(0,191,255,0.07) !important;
  top: 50%; left: 55% !important;
  transform: translateY(-50%) !important;
  animation-delay: 0.8s !important;
}
@keyframes ldrOrbPulse {
  from { opacity: 0.6; transform: scale(1); }
  to   { opacity: 1;   transform: scale(1.12); }
}

/* Content wrapper — above canvas */
.ldr-content {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 24px !important;
  width: 100% !important;
  max-width: 420px !important;
  text-align: center !important;
}

/* Rotating ring + logo combo */
.ldr-ring-wrap {
  position: relative !important;
  width: 200px !important;
  height: 200px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 1.5rem !important;
  flex-shrink: 0 !important;
}

/* SVG spinning ring */
.ldr-ring-svg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  animation: ldrRingSpin 8s linear infinite !important;
}
@keyframes ldrRingSpin { to { transform: rotate(360deg); } }

/* Logo inside the ring */
.ldr-logo-wrap {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.loader-logo-img {
  width: 150px !important;
  max-width: 55vw !important;
  height: auto !important;
  display: block !important;
  animation: ldrLogoFloat 3s ease-in-out infinite alternate !important;
  /* Clean logo on dark bg — no extra glow needed */
  filter: none !important;
  -webkit-filter: none !important;
}
@keyframes ldrLogoFloat {
  from { transform: translateY(0px); }
  to   { transform: translateY(-6px); }
}

/* Tagline */
.loader-tagline {
  font-family: 'Rajdhani', sans-serif !important;
  font-size: clamp(0.6rem, 2.5vw, 0.72rem) !important;
  font-weight: 700 !important;
  letter-spacing: clamp(2px, 1vw, 4px) !important;
  color: rgba(0,191,255,0.75) !important;
  text-transform: uppercase !important;
  margin-bottom: 1.75rem !important;
  white-space: nowrap !important;
}

/* Progress bar */
.loader-bar-wrap {
  width: clamp(160px, 55vw, 260px) !important;
  height: 3px !important;
  background: rgba(255,255,255,0.08) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  margin-bottom: 1.25rem !important;
}
.loader-bar {
  height: 100% !important;
  border-radius: 4px !important;
  background: linear-gradient(90deg, #007BFF, #00BFFF, #F59E0B) !important;
  background-size: 200% 100% !important;
  animation: loadBar 2s ease forwards, barShimmer 1.2s linear infinite !important;
}

/* Status text — cycling messages */
.ldr-status {
  font-family: 'Space Mono', 'Rajdhani', monospace !important;
  font-size: clamp(0.58rem, 2vw, 0.68rem) !important;
  font-weight: 400 !important;
  letter-spacing: 1px !important;
  color: rgba(0,123,255,0.6) !important;
  transition: opacity 0.2s ease !important;
  min-height: 1.2em !important;
}

/* ── MOBILE SPECIFIC ── */
@media (max-width: 480px) {
  .ldr-ring-wrap {
    width: 170px !important;
    height: 170px !important;
    margin-bottom: 1.25rem !important;
  }
  .loader-logo-img {
    width: 120px !important;
    max-width: 52vw !important;
  }
  .loader-tagline {
    letter-spacing: 2px !important;
    font-size: 0.62rem !important;
    margin-bottom: 1.5rem !important;
  }
  .ldr-orb-1 { width: 60vw !important; height: 60vw !important; }
  .ldr-orb-2 { width: 50vw !important; height: 50vw !important; }
  .ldr-orb-3 { display: none !important; }
}
@media (max-width: 360px) {
  .ldr-ring-wrap { width: 150px !important; height: 150px !important; }
  .loader-logo-img { width: 100px !important; }
  .loader-tagline { font-size: 0.56rem !important; letter-spacing: 1.5px !important; }
}

/* ── Landscape mobile ── */
@media (max-height: 500px) and (orientation: landscape) {
  .ldr-ring-wrap {
    width: 130px !important;
    height: 130px !important;
    margin-bottom: 0.75rem !important;
  }
  .loader-logo-img { width: 95px !important; }
  .loader-tagline { margin-bottom: 1rem !important; font-size: 0.58rem !important; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CORE MARKETING TEAM SECTION
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Section background */
.mkt-section {
  background: var(--w0) !important;
  position: relative;
  overflow: hidden;
}
/* Soft ambient blob */
.mkt-section::before {
  content: '';
  position: absolute;
  width: 60vw; height: 60vw;
  max-width: 600px; max-height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,123,255,0.04), transparent 70%);
  top: -10%; left: -15%;
  pointer-events: none;
}
.mkt-section::after {
  content: '';
  position: absolute;
  width: 50vw; height: 50vw;
  max-width: 480px; max-height: 480px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245,158,11,0.04), transparent 70%);
  bottom: -10%; right: -10%;
  pointer-events: none;
}

/* ── Banner ── */
.mkt-banner { margin: 2rem auto 3rem; max-width: 700px; }
.mkt-banner-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  background: linear-gradient(135deg, rgba(0,123,255,0.06), rgba(245,158,11,0.04));
  border: 1px solid rgba(0,123,255,0.15);
  border-radius: 40px;
  padding: 0.65rem 1.75rem;
  position: relative;
  overflow: hidden;
}
.mkt-banner-inner::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(0,123,255,0.04), transparent);
  animation: mktBannerShimmer 3s ease-in-out infinite;
}
@keyframes mktBannerShimmer {
  0%,100% { transform: translateX(-100%); }
  50%      { transform: translateX(100%); }
}
.mkt-banner-text {
  font-family: 'Rajdhani', sans-serif;
  font-size: 0.75rem; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  color: #475569;
}
.mkt-banner-icon { color: #007BFF; font-size: 0.6rem; }
.mkt-banner-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: #007BFF;
  box-shadow: 0 0 6px rgba(0,123,255,0.5);
  animation: mktDotBlink 1.2s ease-in-out infinite;
}
@keyframes mktDotBlink { 0%,100%{opacity:1} 50%{opacity:0.25} }

/* ── Section title span ── */
.mkt-title-span {
  background: linear-gradient(135deg, #007BFF, #F59E0B) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ── Grid ── */
.mkt-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  margin-top: 2.5rem;
}
@media (max-width: 1100px) { .mkt-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 580px)  { .mkt-grid { grid-template-columns: 1fr; max-width: 400px; margin-left: auto; margin-right: auto; } }

/* ── Card wrapper (gradient border trick) ── */
.mkt-card {
  border-radius: 22px;
  padding: 2px;
  background: linear-gradient(145deg, rgba(0,123,255,0.25), rgba(0,191,255,0.08), rgba(0,123,255,0.04));
  transition: transform 0.38s ease, box-shadow 0.38s ease;
  position: relative;
}
.mkt-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 50px rgba(0,123,255,0.15);
}
/* Gold card */
.mkt-card:nth-child(2) {
  background: linear-gradient(145deg, rgba(245,158,11,0.3), rgba(253,211,79,0.1), rgba(245,158,11,0.04));
}
.mkt-card:nth-child(2):hover { box-shadow: 0 20px 50px rgba(245,158,11,0.15); }
/* Green card */
.mkt-card:nth-child(3) {
  background: linear-gradient(145deg, rgba(16,185,129,0.25), rgba(52,211,153,0.08), rgba(16,185,129,0.04));
}
.mkt-card:nth-child(3):hover { box-shadow: 0 20px 50px rgba(16,185,129,0.15); }
/* Purple card */
.mkt-card:nth-child(4) {
  background: linear-gradient(145deg, rgba(139,92,246,0.25), rgba(167,139,250,0.08), rgba(139,92,246,0.04));
}
.mkt-card:nth-child(4):hover { box-shadow: 0 20px 50px rgba(139,92,246,0.15); }

/* ── Card inner ── */
.mkt-card-inner {
  background: rgba(255,255,255,0.97);
  border-radius: 20px;
  padding: 2rem 1.5rem 1.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  overflow: hidden;
  height: 100%;
}
/* Light sweep on hover */
.mkt-card-inner::after {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  opacity: 0;
  transition: opacity 0.4s;
}
.mkt-card:nth-child(1) .mkt-card-inner::after { background: linear-gradient(90deg,transparent,#007BFF,transparent); }
.mkt-card:nth-child(2) .mkt-card-inner::after { background: linear-gradient(90deg,transparent,#F59E0B,transparent); }
.mkt-card:nth-child(3) .mkt-card-inner::after { background: linear-gradient(90deg,transparent,#10B981,transparent); }
.mkt-card:nth-child(4) .mkt-card-inner::after { background: linear-gradient(90deg,transparent,#8B5CF6,transparent); }
.mkt-card:hover .mkt-card-inner::after { opacity: 1; }

/* ── Animated gradient border glow ── */
.mkt-glow-border {
  position: absolute; inset: -1px;
  border-radius: 21px;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
  z-index: -1;
}
.mkt-card:hover .mkt-glow-border { opacity: 0.6; }
.mkt-glow-blue   { background: conic-gradient(from 0deg, transparent 60%, #007BFF 80%, transparent); animation: mktSpin 4s linear infinite; }
.mkt-glow-gold   { background: conic-gradient(from 0deg, transparent 60%, #F59E0B 80%, transparent); animation: mktSpin 4s linear infinite; }
.mkt-glow-green  { background: conic-gradient(from 0deg, transparent 60%, #10B981 80%, transparent); animation: mktSpin 4s linear infinite; }
.mkt-glow-purple { background: conic-gradient(from 0deg, transparent 60%, #8B5CF6 80%, transparent); animation: mktSpin 4s linear infinite; }
@keyframes mktSpin { to { transform: rotate(360deg); } }

/* ── Avatar wrap ── */
.mkt-avatar-wrap {
  width: 120px; height: 120px;
  position: relative;
  margin-bottom: 1.5rem;
  flex-shrink: 0;
}
.mkt-ring {
  position: absolute; border-radius: 50%;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.mkt-ring-1       { width:120px;height:120px; border:1px solid rgba(0,123,255,0.2);  animation:mktRingPulse 3s ease-in-out infinite; }
.mkt-ring-2       { width:142px;height:142px; border:1px solid rgba(0,123,255,0.08); animation:mktRingPulse 3s ease-in-out infinite 1.2s; }
.mkt-ring-gold-1  { width:120px;height:120px; border:1px solid rgba(245,158,11,0.28); animation:mktRingPulse 3s ease-in-out infinite; }
.mkt-ring-gold-2  { width:142px;height:142px; border:1px solid rgba(245,158,11,0.1);  animation:mktRingPulse 3s ease-in-out infinite 1.2s; }
.mkt-ring-green-1  { width:120px;height:120px; border:1px solid rgba(16,185,129,0.28); animation:mktRingPulse 3s ease-in-out infinite; }
.mkt-ring-green-2  { width:142px;height:142px; border:1px solid rgba(16,185,129,0.1);  animation:mktRingPulse 3s ease-in-out infinite 1.2s; }
.mkt-ring-purple-1 { width:120px;height:120px; border:1px solid rgba(139,92,246,0.28); animation:mktRingPulse 3s ease-in-out infinite; }
.mkt-ring-purple-2 { width:142px;height:142px; border:1px solid rgba(139,92,246,0.1);  animation:mktRingPulse 3s ease-in-out infinite 1.2s; }
@keyframes mktRingPulse {
  0%,100% { opacity:0.5; transform:translate(-50%,-50%) scale(1); }
  50%      { opacity:1;   transform:translate(-50%,-50%) scale(1.05); }
}

/* ── Avatar frame (circle) ── */
.mkt-avatar-frame {
  width: 100px; height: 100px;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  border: 2.5px solid rgba(0,123,255,0.5);
  box-shadow: 0 0 0 1px rgba(0,123,255,0.12), 0 6px 24px rgba(0,123,255,0.18);
  transition: box-shadow 0.35s ease;
}
.mkt-frame-gold   { border-color: rgba(245,158,11,0.6)  !important; box-shadow: 0 0 0 1px rgba(245,158,11,0.12), 0 6px 24px rgba(245,158,11,0.18) !important; }
.mkt-frame-green  { border-color: rgba(16,185,129,0.6)  !important; box-shadow: 0 0 0 1px rgba(16,185,129,0.12), 0 6px 24px rgba(16,185,129,0.18) !important; }
.mkt-frame-purple { border-color: rgba(139,92,246,0.6)  !important; box-shadow: 0 0 0 1px rgba(139,92,246,0.12), 0 6px 24px rgba(139,92,246,0.18) !important; }
.mkt-card:hover .mkt-avatar-frame { box-shadow: 0 0 0 2px rgba(0,123,255,0.3), 0 10px 32px rgba(0,123,255,0.3) !important; }
.mkt-card:nth-child(2):hover .mkt-avatar-frame { box-shadow: 0 0 0 2px rgba(245,158,11,0.4), 0 10px 32px rgba(245,158,11,0.3) !important; }
.mkt-card:nth-child(3):hover .mkt-avatar-frame { box-shadow: 0 0 0 2px rgba(16,185,129,0.4), 0 10px 32px rgba(16,185,129,0.28) !important; }
.mkt-card:nth-child(4):hover .mkt-avatar-frame { box-shadow: 0 0 0 2px rgba(139,92,246,0.4), 0 10px 32px rgba(139,92,246,0.28) !important; }

/* ── Avatar initials ── */
.mkt-avatar {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-family:'Oxanium',sans-serif;
  font-size:1.5rem; font-weight:900; letter-spacing:1px;
  border-radius:50%;
  transition: transform 0.4s ease;
}
.mkt-card:hover .mkt-avatar { transform: scale(1.08); }
.mkt-av-1 { background:linear-gradient(145deg,rgba(0,123,255,0.12),rgba(0,191,255,0.06)); color:#007BFF; }
.mkt-av-2 { background:linear-gradient(145deg,rgba(245,158,11,0.14),rgba(253,211,79,0.06)); color:#D97706; }
.mkt-av-3 { background:linear-gradient(145deg,rgba(16,185,129,0.12),rgba(52,211,153,0.06)); color:#059669; }
.mkt-av-4 { background:linear-gradient(145deg,rgba(139,92,246,0.12),rgba(167,139,250,0.06)); color:#7C3AED; }

/* ── Status dot ── */
.mkt-dept-dot {
  position: absolute; bottom:4px; right:10px;
  width:14px; height:14px; border-radius:50%;
  border:2px solid #fff;
  animation: mktDotBlink 2s ease-in-out infinite;
}
.mkt-dot-marketing { background:#10B981; box-shadow:0 0 8px rgba(16,185,129,0.5); }
.mkt-dot-brand     { background:#F59E0B; box-shadow:0 0 8px rgba(245,158,11,0.5); }
.mkt-dot-social    { background:#007BFF; box-shadow:0 0 8px rgba(0,123,255,0.5); }
.mkt-dot-design    { background:#8B5CF6; box-shadow:0 0 8px rgba(139,92,246,0.5); }

/* ── Info ── */
.mkt-info { width:100%; }
.mkt-dept-tag {
  display:inline-block;
  font-family:'Rajdhani',sans-serif;
  font-size:0.62rem; font-weight:700; letter-spacing:2.5px;
  text-transform:uppercase; padding:4px 14px; border-radius:20px;
  margin-bottom:0.65rem;
}
.mkt-tag-blue   { color:#007BFF; border:1px solid rgba(0,123,255,0.25); background:rgba(0,123,255,0.06); }
.mkt-tag-gold   { color:#D97706; border:1px solid rgba(245,158,11,0.3);  background:rgba(245,158,11,0.07); }
.mkt-tag-green  { color:#059669; border:1px solid rgba(16,185,129,0.3);  background:rgba(16,185,129,0.06); }
.mkt-tag-purple { color:#7C3AED; border:1px solid rgba(139,92,246,0.28); background:rgba(139,92,246,0.06); }

.mkt-name {
  font-family:'Oxanium',sans-serif;
  font-size:1.1rem; font-weight:800; letter-spacing:0.5px;
  margin-bottom:0.2rem;
}
.mkt-name       { background:linear-gradient(135deg,#007BFF,#00BFFF); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.mkt-name-gold  { background:linear-gradient(135deg,#F59E0B,#FDE68A)  !important; -webkit-background-clip:text !important; -webkit-text-fill-color:transparent !important; }
.mkt-name-green { background:linear-gradient(135deg,#10B981,#34D399)  !important; -webkit-background-clip:text !important; -webkit-text-fill-color:transparent !important; }
.mkt-name-purple{ background:linear-gradient(135deg,#8B5CF6,#C4B5FD)  !important; -webkit-background-clip:text !important; -webkit-text-fill-color:transparent !important; }

.mkt-role {
  font-family:'Exo 2',sans-serif;
  font-size:0.77rem; font-weight:500; color:#64748B;
  margin-bottom:0.9rem; letter-spacing:0.2px;
}
.mkt-divider {
  height:1px; width:60%; margin:0 auto 1rem;
  background:linear-gradient(90deg,transparent,#007BFF,transparent);
}
.mkt-divider-gold   { background:linear-gradient(90deg,transparent,#F59E0B,transparent) !important; }
.mkt-divider-green  { background:linear-gradient(90deg,transparent,#10B981,transparent) !important; }
.mkt-divider-purple { background:linear-gradient(90deg,transparent,#8B5CF6,transparent) !important; }

.mkt-desc {
  font-family:'Inter',sans-serif;
  font-size:0.84rem; line-height:1.72; color:#475569;
  font-style:italic; margin-bottom:1.1rem;
}

/* ── Skills ── */
.mkt-skills { display:flex; flex-wrap:wrap; justify-content:center; gap:0.4rem; margin-bottom:1.25rem; }
.mkt-skill {
  font-family:'Rajdhani',sans-serif;
  font-size:0.68rem; font-weight:700; letter-spacing:0.5px;
  padding:3px 10px; border-radius:20px;
  color:#007BFF; border:1px solid rgba(0,123,255,0.2); background:rgba(0,123,255,0.05);
  transition: all 0.22s;
}
.mkt-skill:hover { background:rgba(0,123,255,0.12); transform:translateY(-1px); }
.mkt-skill-gold   { color:#D97706; border-color:rgba(245,158,11,0.25); background:rgba(245,158,11,0.06); }
.mkt-skill-gold:hover { background:rgba(245,158,11,0.12) !important; }
.mkt-skill-green  { color:#059669; border-color:rgba(16,185,129,0.25); background:rgba(16,185,129,0.05); }
.mkt-skill-green:hover { background:rgba(16,185,129,0.12) !important; }
.mkt-skill-purple { color:#7C3AED; border-color:rgba(139,92,246,0.22); background:rgba(139,92,246,0.05); }
.mkt-skill-purple:hover { background:rgba(139,92,246,0.12) !important; }

/* ── Social buttons ── */
.mkt-socials { display:flex; gap:0.55rem; justify-content:center; }
.mkt-social-btn {
  display:flex; align-items:center; gap:6px;
  padding:6px 14px; border-radius:8px;
  font-family:'Exo 2',sans-serif; font-size:0.75rem; font-weight:600;
  text-decoration:none;
  color:#007BFF; border:1px solid rgba(0,123,255,0.22); background:rgba(0,123,255,0.04);
  transition:all 0.25s ease;
}
.mkt-social-btn:hover { background:rgba(0,123,255,0.1); transform:translateY(-2px); box-shadow:0 4px 14px rgba(0,123,255,0.15); }
.mkt-social-gold   { color:#D97706 !important; border-color:rgba(245,158,11,0.28) !important; background:rgba(245,158,11,0.04) !important; }
.mkt-social-gold:hover   { background:rgba(245,158,11,0.1)  !important; box-shadow:0 4px 14px rgba(245,158,11,0.15) !important; }
.mkt-social-green  { color:#059669 !important; border-color:rgba(16,185,129,0.28) !important; background:rgba(16,185,129,0.04) !important; }
.mkt-social-green:hover  { background:rgba(16,185,129,0.1)  !important; box-shadow:0 4px 14px rgba(16,185,129,0.15) !important; }
.mkt-social-purple { color:#7C3AED !important; border-color:rgba(139,92,246,0.25) !important; background:rgba(139,92,246,0.04) !important; }
.mkt-social-purple:hover { background:rgba(139,92,246,0.1)  !important; box-shadow:0 4px 14px rgba(139,92,246,0.15) !important; }

/* ── Bottom divider into blog ── */
.mkt-bottom-divider {
  height:2px; max-width:400px; margin:3.5rem auto 0;
  background:linear-gradient(90deg,transparent,rgba(0,123,255,0.25),rgba(245,158,11,0.2),transparent);
  border-radius:2px;
}

/* ── Mobile spacing ── */
@media (max-width:580px) {
  .mkt-section { padding-left:1rem !important; padding-right:1rem !important; }
  .mkt-card-inner { padding:1.75rem 1.25rem !important; }
  .mkt-avatar-wrap { width:100px !important; height:100px !important; }
  .mkt-avatar-frame { width:84px !important; height:84px !important; }
  .mkt-ring-1,.mkt-ring-gold-1,.mkt-ring-green-1,.mkt-ring-purple-1 { width:100px !important; height:100px !important; }
  .mkt-ring-2,.mkt-ring-gold-2,.mkt-ring-green-2,.mkt-ring-purple-2 { width:118px !important; height:118px !important; }
  .mkt-avatar { font-size:1.2rem !important; }
  .mkt-name { font-size:1rem !important; }
  .mkt-banner-inner { gap:0.5rem !important; padding:0.55rem 1rem !important; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SEO & ACCESSIBILITY STYLES
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── Breadcrumb nav ── */
#breadcrumb-nav {
  background: var(--w1, #f8fafc);
  border-bottom: 1px solid rgba(0,123,255,0.08);
  padding: 0;
}
.breadcrumb-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0.55rem 2rem;
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
}
.breadcrumb-item { display: flex; align-items: center; color: #64748B; }
.breadcrumb-item a { color: #007BFF; text-decoration: none; transition: color 0.2s; }
.breadcrumb-item a:hover { color: #0057D9; text-decoration: underline; }
.breadcrumb-item span[aria-hidden] { margin: 0 0.35rem; color: #94A3B8; font-size: 0.7rem; }
.breadcrumb-item.active span { color: #475569; font-weight: 500; }

/* ── Skip to content (accessibility) ── */
.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  background: #007BFF;
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 0 0 8px 8px;
  font-family: 'Exo 2', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  z-index: 100000;
  transition: top 0.2s;
  text-decoration: none;
}
.skip-link:focus { top: 0; }

/* ── Font CLS prevention ── */
.fonts-loading h1,
.fonts-loading h2,
.fonts-loading h3 {
  font-family: system-ui, -apple-system, sans-serif;
}
.fonts-loaded h1,
.fonts-loaded h2,
.fonts-loaded h3 {
  font-family: 'Oxanium', sans-serif;
}

/* ── Image lazy load placeholder ── */
img[data-src] {
  opacity: 0;
  transition: opacity 0.3s ease;
}
img.loaded { opacity: 1; }

/* ── Focus styles (accessibility) ── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #007BFF;
  outline-offset: 2px;
  border-radius: 4px;
}

/* ── Touch targets (mobile SEO) ── */
@media (max-width: 768px) {
  .nav-links a,
  .mobile-menu a,
  .btn,
  .footer-col a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .footer-col a { display: block; padding: 0.25rem 0; }
}

/* ── Print styles ── */
@media print {
  .navbar, .mobile-menu, #loader, .cursor, .cursor-ring,
  #particles-canvas, .hero-visual, footer { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  a { color: #000 !important; text-decoration: underline !important; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SOCIAL ICONS — Proper visibility
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.social-links {
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-top: 1.25rem;
}
.social-link {
  width: 40px !important;
  height: 40px !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
  flex-shrink: 0 !important;
  /* Dark footer: light icon on dark bg */
  color: rgba(255,255,255,0.65) !important;
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
}
.social-link svg {
  width: 20px !important;
  height: 20px !important;
  display: block !important;
  fill: currentColor !important;
}
.social-link:hover {
  color: #ffffff !important;
  transform: translateY(-3px) !important;
}
/* Per-platform hover colors */
.social-link[aria-label="Telegram"]:hover  { background: rgba(0,136,204,0.25) !important; border-color: rgba(0,136,204,0.5) !important; }
.social-link[aria-label="YouTube"]:hover   { background: rgba(255,0,0,0.2) !important;     border-color: rgba(255,0,0,0.4) !important; }
.social-link[aria-label="Instagram"]:hover { background: rgba(228,64,95,0.2) !important;   border-color: rgba(228,64,95,0.4) !important; }
.social-link[aria-label="Facebook"]:hover  { background: rgba(24,119,242,0.2) !important;  border-color: rgba(24,119,242,0.4) !important; }

/* Mobile: slightly smaller */
@media (max-width: 480px) {
  .social-link { width: 36px !important; height: 36px !important; }
  .social-link svg { width: 18px !important; height: 18px !important; }
}

/* ── Rahul Patel photo — white bg, adjust framing ── */
.founder-real-photo-gold {
  object-position: top center !important;
  /* Slight contrast boost so it pops on the card */
  filter: contrast(1.04) !important;
}