/*
Theme Name: Arthium Education
Author: Codex
Description: Custom WordPress theme converted from the supplied Arthium Educapital design package - Official Brand Logo Edition.
Version: 3.5.0
Text Domain: arthium
*/

:root {
  /* Slate & Ivory Color Palette */
  --logo-bg: #2C3E50;
  --bg: #FAFAF8;
  --bg-subtle: #F5F0E8;
  --bg-deep: #EDE8DC;
  --panel: #FFFFFF;
  --panel-strong: #F5F0E8;
  --panel-high: #FFFFFF;
  --line: #DDD8CC;
  --line-strong: #C8C0AE;
  --text: #2D2D2D;
  --muted: #5A5A5A;
  --muted-light: #888880;
  --primary: #2C3E50;
  --primary-strong: #1a2840;
  --primary-light: #EAF0F6;
  --secondary: #4A6278;
  --secondary-strong: #3A5068;
  --secondary-light: #F5F0E8;
  --accent: #B8960C;
  --accent-strong: #9A7C0A;
  --accent-light: #FBF6E0;
  --accent-emerald: #4A8C6F;
  --accent-emerald-light: #EAF5EE;
  --accent-amber: #B8960C;
  --font-heading: "Sora", "Plus Jakarta Sans", sans-serif;
  --font-body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-num: "Space Grotesk", "Sora", sans-serif;
  --max: 1280px;
  --shadow-sm: 0 1px 2px 0 rgba(44, 62, 80, 0.05);
  --shadow-md: 0 4px 14px 0 rgba(44, 62, 80, 0.08);
  --shadow-lg: 0 12px 28px -4px rgba(44, 62, 80, 0.12);
  --shadow-xl: 0 20px 32px -8px rgba(44, 62, 80, 0.20);
  --radius-lg: 16px;
  --radius-md: 12px;
  --radius-sm: 8px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background: var(--bg);
  font-family: var(--font-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
main {
  margin: 0;
  padding: 0;
  background-color: #2C3E50;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
.container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }

/* Cards & Glass Containers */
.glass {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

/* ════════════════════════════════════════════════
   TOP ANNOUNCEMENT TICKER BAR (Admin Managed)
   ════════════════════════════════════════════════ */
.top-ticker-bar {
  background: #1A2840;
  color: #D4E0EA;
  font-size: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  position: relative;
  z-index: 52;
  padding: 6px 0;
  overflow: hidden;
}

.ticker-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.ticker-socials {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.ticker-socials a {
  color: #A8C0D8;
  transition: color 0.2s ease, transform 0.2s ease;
  display: flex;
  align-items: center;
  text-decoration: none;
}

.ticker-socials a:hover {
  color: #ffffff;
  transform: translateY(-1px);
}

.ticker-scroller {
  flex: 1;
  overflow: hidden;
  position: relative;
  white-space: nowrap;
  mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
}

.ticker-track {
  display: inline-block;
  white-space: nowrap;
  animation: tickerMarquee 26s linear infinite;
  color: #B8960C;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding-left: 100%;
}

.ticker-scroller:hover .ticker-track {
  animation-play-state: paused;
}

@keyframes tickerMarquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

.ticker-contact {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 600;
}

.ticker-contact a {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #D4E0EA;
  text-decoration: none;
  transition: color 0.2s ease;
}

.ticker-contact a:hover {
  color: #ffffff;
}

.ticker-contact .material-symbols-outlined {
  font-size: 15px;
  color: #B8960C;
}

@media (max-width: 860px) {
  .ticker-contact, .ticker-socials { display: none; }
  .ticker-scroller { mask-image: none; -webkit-mask-image: none; }
}

/* Header & Navigation - EXACT LOGO BACKGROUND COLOR (#2C3E50) */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--logo-bg);
  border-bottom: none !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
  margin-bottom: 0 !important;
}
.nav { min-height: 80px; padding: 8px 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.site-logo { height: 56px; width: auto; object-fit: contain; display: block; filter: drop-shadow(0 3px 10px rgba(0,0,0,0.35)); }
.brand-text { font-family: var(--font-heading); font-weight: 800; font-size: 24px; color: #ffffff !important; letter-spacing: -0.025em; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.brand-highlight {
  background: linear-gradient(90deg, #38bdf8, #B8960C, #B8960C);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 800;
}







.mobile-toggle {
  display: none;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: var(--radius-sm);
  padding: 8px;
  cursor: pointer;
  color: #ffffff;
}

.menu { display: flex; align-items: center; gap: 28px; font-size: 15px; color: #D4E0EA; font-weight: 600; }
.menu a { transition: color .2s ease; }
.menu a:hover, .menu .current { color: #ffffff; }
.phone { color: #B8960C !important; font-weight: 800; white-space: nowrap; font-size: 16px; font-family: var(--font-num); background: rgba(255, 255, 255, 0.12); padding: 8px 18px; border-radius: 999px; border: 1px solid rgba(254, 240, 138, 0.3); letter-spacing: -0.01em; }


/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 12px 24px; border-radius: 999px;
  border: 1px solid transparent; font-weight: 700; cursor: pointer;
  font-family: "Plus Jakarta Sans", sans-serif;
  transition: all .25s ease;
  font-size: 15px;
}
.btn.primary {
  background: linear-gradient(135deg, #2C3E50, #4A6278);
  color: #ffffff;
  box-shadow: 0 4px 18px rgba(44, 62, 80, 0.30);
  border: 1px solid rgba(255, 255, 255, 0.15);
}
.btn.primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(44, 62, 80, 0.45);
  background: linear-gradient(135deg, #38026d, #4A6278);
}
.btn.secondary {
  border-color: var(--line-strong);
  color: var(--primary);
  background: var(--primary-light);
}
.btn.secondary:hover {
  background: #e9d8fb;
  transform: translateY(-1px);
}

/* Typography */
h1, h2, h3, h4, .btn {
  font-family: var(--font-heading);
  margin: 0;
  letter-spacing: -0.03em;
}
h1 { font-size: 56px; line-height: 1.1; font-weight: 800; max-width: 780px; letter-spacing: -0.035em; }
h1 em, .accent { color: var(--primary); font-style: normal; background: linear-gradient(135deg, #2C3E50, #4A6278); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
h2 { font-size: 38px; line-height: 1.2; font-weight: 800; letter-spacing: -0.025em; }
h3 { font-size: 22px; line-height: 1.3; font-weight: 700; letter-spacing: -0.02em; }
p { margin: 0; }
.lead { color: var(--muted); font-size: 18px; max-width: 640px; margin-top: 20px; line-height: 1.6; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px;
  color: var(--primary); text-transform: uppercase; font-size: 12px;
  font-weight: 800; letter-spacing: .1em; font-family: var(--font-heading);
  background: var(--primary-light); padding: 6px 14px; border-radius: 999px;
  border: 1px solid rgba(44, 62, 80, 0.15);
}
.eyebrow:before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: var(--primary); }

.counter, .ribbon-item strong, .dash-price, .calc-result-val, .stat-card strong {
  font-family: var(--font-num);
  letter-spacing: -0.02em;
}


/* Hero Section - BRAND GRADIENT (#2C3E50) */
.hero, .page-hero {
  position: relative; overflow: hidden; padding: 40px 0 60px;
  background: linear-gradient(180deg, #2C3E50 0%, #1c0038 100%);
  color: #ffffff;
  margin-top: 0 !important;
  border-top: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.hero h1, .page-hero h1 {
  color: #ffffff;
}
.hero h1 em, .page-hero h1 em {
  background: linear-gradient(90deg, #d8b4fe, #B8960C);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-style: normal;
}
.hero p.lead, .page-hero p.lead {
  color: #D4E0EA;
}
.hero .eyebrow, .page-hero .eyebrow {
  background: rgba(255, 255, 255, 0.14);
  color: #B8960C;
  border: 1px solid rgba(255, 255, 255, 0.25);
}
.hero .eyebrow:before, .page-hero .eyebrow:before {
  background: #B8960C;
}
.hero .list span, .page-hero .list span {
  color: #f3e8ff;
}
.hero .list span:before, .page-hero .list span:before {
  background: #10b981;
}

/* Glass Card inside Dark Hero stays clean white for high contrast */
.hero .glass.card, .page-hero .glass.card {
  background: #ffffff;
  color: #1e293b;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.hero .glass.card h3, .page-hero .glass.card h3 {
  color: #2D2D2D;
}
.hero .glass.card p, .page-hero .glass.card p {
  color: #64748b;
}
.hero .glass.card label, .page-hero .glass.card label {
  color: #334155;
  font-weight: 600;
}

.hero-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 48px; align-items: center; }
.actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 36px; }

/* Hero Trading Terminal Dashboard Card */
.hero-dashboard-card {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  padding: 24px;
  position: relative;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.45);
}

.dash-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.dash-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #ffffff;
}

.pulse-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #10b981;
  box-shadow: 0 0 10px #10b981;
}

.dash-price {
  font-weight: 800;
  font-size: 15px;
  color: #ffffff;
  margin-left: 4px;
}

.dash-change {
  color: #34d399;
  font-weight: 700;
  font-size: 12px;
  background: rgba(16, 185, 129, 0.18);
  padding: 2px 8px;
  border-radius: 6px;
}

.dash-badge {
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: .05em;
  color: #B8960C;
  background: rgba(251, 191, 36, 0.15);
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(251, 191, 36, 0.3);
}

.dash-chart-wrap {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 14px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 16px;
}

.dash-svg-chart {
  width: 100%;
  height: auto;
  display: block;
}

.dash-metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.metric-box {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  padding: 10px 6px;
  text-align: center;
}

.m-label {
  display: block;
  font-size: 10px;
  color: #d8b4fe;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 4px;
}

.m-val {
  font-size: 12px;
  font-weight: 800;
  color: #ffffff;
}

.m-val.green { color: #34d399; }
.m-val.red { color: #f87171; }
.m-val.gold { color: #B8960C; }

.hero-dashboard-card .stat-card {
  position: absolute; right: -16px; bottom: -20px;
  padding: 16px 24px;
  background: #ffffff;
  color: #2D2D2D;
  border-radius: 16px;
  box-shadow: 0 16px 36px rgba(0,0,0,0.35);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.hero-dashboard-card .stat-card strong {
  font-size: 26px;
  color: var(--primary);
  line-height: 1;
}
.hero-dashboard-card .stat-card span {
  font-size: 12px;
  color: #64748b;
  font-weight: 700;
  margin-top: 4px;
}

.hero-media { position: relative; }
.hero-media img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
.stat-card {
  position: absolute; left: -24px; bottom: -24px; padding: 22px 28px;
  background: #ffffff; border: 1px solid var(--line);
  box-shadow: var(--shadow-lg); border-radius: var(--radius-lg);
}
.stat-card strong { display: block; font-size: 36px; line-height: 1; color: var(--primary); font-family: "Plus Jakarta Sans", sans-serif; font-weight: 800; }
.stat-card span { font-size: 13px; color: var(--muted); font-weight: 600; }

/* Sections & Grids */
.section { padding: 84px 0; }
.section.deep { background: #ffffff !important; color: #2D2D2D !important; border-top: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; }
.section.panel { background: #f8fafc !important; color: #2D2D2D !important; border-top: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 44px; }
.section.deep .section-head h1, .section.deep .section-head h2, .section.deep .section-head h3,
.section.panel .section-head h1, .section.panel .section-head h2, .section.panel .section-head h3 { color: #2D2D2D !important; }
.section.deep .section-head p, .section.panel .section-head p { color: #475569 !important; }

.grid { display: grid; gap: 24px; }
.grid.four { grid-template-columns: repeat(4, minmax(0,1fr)); }
.grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }
.grid.two { grid-template-columns: repeat(2, minmax(0,1fr)); }

/* Cards */
.card {
  padding: 28px; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-md);
  transition: all .25s ease;
}
.card:hover {
  transform: translateY(-5px); border-color: var(--line-strong); box-shadow: var(--shadow-lg);
}
.card-image { height: 185px; border-radius: var(--radius-md); overflow: hidden; margin-bottom: 20px; background: #1a0033; border: 1px solid rgba(255,255,255,0.08); }
.card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tag {
  display: inline-flex; padding: 4px 12px; border-radius: 999px;
  background: var(--primary-light); color: var(--primary);
  font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 14px;
}
.list { display: grid; gap: 10px; margin-top: 18px; color: var(--muted); font-size: 14px; font-weight: 500; }
.list span { display: flex; gap: 10px; align-items: flex-start; }
.list span:before { content: "check_circle"; font-family: "Material Symbols Outlined"; color: var(--accent-emerald); font-size: 18px; line-height: 1.3; }

/* Ticker / Ribbon */
.trust-ribbon {
  background: #ffffff; border-bottom: 1px solid var(--line); padding: 24px 0;
}
.ribbon-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; text-align: center; }
.ribbon-item strong {
  display: block; font-size: 32px; color: var(--primary);
  font-family: "Plus Jakarta Sans", sans-serif; font-weight: 800; line-height: 1.1;
}
.ribbon-item span { font-size: 14px; color: var(--muted); font-weight: 600; margin-top: 4px; }

/* Course Path Selector */
.path-selector { margin-top: 24px; }
.path-tabs { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.path-tab {
  padding: 12px 24px; border-radius: 999px; background: var(--bg);
  border: 1px solid var(--line); color: var(--muted); font-weight: 700;
  font-size: 14px; cursor: pointer; transition: all .2s ease;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.path-tab.active, .path-tab:hover {
  background: var(--primary); color: #ffffff; border-color: var(--primary);
  box-shadow: 0 4px 16px rgba(44, 62, 80, 0.3);
}
.path-panel { display: none; padding: 36px; background: #ffffff; border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.path-panel.active { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 36px; align-items: center; }

/* Step Roadmap - Premium Animations & Interactions */
.step-grid {
  position: relative;
  z-index: 2;
}
@media (min-width: 992px) {
  .step-grid::after {
    content: "";
    position: absolute;
    top: 52px; /* aligns with the center of the step-badges */
    left: 12%;
    right: 12%;
    height: 4px;
    background: linear-gradient(90deg, #2C3E50 0%, #4A6278 50%, #10b981 100%);
    opacity: 0.15;
    z-index: 1;
    pointer-events: none;
  }
}
.step-card {
  position: relative;
  padding: 32px 28px;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  z-index: 2;
  overflow: hidden;
}
.step-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; width: 100%; height: 4px;
  background: linear-gradient(90deg, #2C3E50, #4A6278);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.step-card:hover {
  transform: translateY(-8px);
  border-color: rgba(44, 62, 80, 0.35);
  box-shadow: 0 20px 40px rgba(44, 62, 80, 0.08);
}
.step-card:hover::before {
  opacity: 1;
}
.step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #2C3E50, #4A6278);
  color: #ffffff;
  font-weight: 800;
  font-size: 18px;
  margin-bottom: 18px;
  box-shadow: 0 4px 14px rgba(44, 62, 80, 0.25);
  font-family: "Plus Jakarta Sans", sans-serif;
  transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
  z-index: 3;
}
.step-card:hover .step-badge {
  background: linear-gradient(135deg, #4A6278, #10b981);
  transform: scale(1.1) rotate(360deg);
  box-shadow: 0 0 20px rgba(16, 185, 129, 0.6);
}
.step-card h3 {
  transition: color 0.3s ease;
}
.step-card:hover h3 {
  color: #2C3E50;
}

/* Risk Calculator */
.calc-wrapper {
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center;
  padding: 40px; background: #ffffff; border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-md);
}
.calc-field { display: grid; gap: 8px; margin-bottom: 18px; }
.calc-field label { font-size: 13px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; }
.calc-field input {
  width: 100%; min-height: 48px; padding: 12px 16px; border-radius: var(--radius-sm);
  border: 1px solid var(--line-strong); background: var(--bg-subtle); color: var(--text); font-weight: 600; font-size: 16px;
}
.calc-field input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.12); }
.calc-result-box {
  background: linear-gradient(135deg, #EAF0F6, #ecfdf5);
  border: 1px solid #C8C0AE; border-radius: var(--radius-lg);
  padding: 36px 28px; text-align: center;
}
.calc-result-val {
  font-size: 46px; font-weight: 800; color: var(--accent-emerald);
  line-height: 1; margin: 12px 0 6px; font-family: "Plus Jakarta Sans", sans-serif;
}

/* Mentors Profile */
.profile { text-align: center; }
.avatar { width: 120px; height: 120px; border-radius: 999px; margin: 0 auto 18px; object-fit: cover; border: 3px solid var(--primary-light); box-shadow: var(--shadow-md); }

/* Comparison Table */
.table-wrap { overflow-x: auto; background: #ffffff; border-radius: var(--radius-lg); border: 1px solid var(--line); box-shadow: var(--shadow-md); }
.comparison-table { width: 100%; border-collapse: collapse; text-align: left; min-width: 620px; }
.comparison-table th, .comparison-table td { padding: 18px 24px; border-bottom: 1px solid var(--line); font-size: 15px; }
.comparison-table th { background: var(--bg-subtle); font-size: 15px; color: var(--text); font-weight: 800; font-family: "Plus Jakarta Sans", sans-serif; }
.comparison-table tr:hover { background: #F5F0E8; }
.highlight-col { color: var(--primary); font-weight: 700; background: var(--primary-light); }

/* CTA Band */
.cta-band {
  padding: 44px; display: flex; align-items: center; justify-content: space-between; gap: 24px;
  background: linear-gradient(135deg, #EAF0F6, #F5F0E8); border: 1px solid var(--line-strong);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-md);
}

/* Accordion */
.accordion-item { border: 1px solid var(--line); border-radius: var(--radius-md); margin-bottom: 14px; background: #ffffff; overflow: hidden; box-shadow: var(--shadow-sm); }
.accordion-header {
  width: 100%; padding: 20px 24px; text-align: left; background: transparent; border: none;
  color: var(--text); font-size: 17px; font-weight: 700; display: flex; justify-content: space-between;
  align-items: center; cursor: pointer; font-family: "Plus Jakarta Sans", sans-serif;
}
.accordion-header:after { content: "+"; font-size: 22px; color: var(--primary); font-weight: 800; }
.accordion-item.active .accordion-header:after { content: "−"; }
.accordion-body { display: none; padding: 0 24px 22px; color: var(--muted); font-size: 15px; line-height: 1.6; }
.accordion-item.active .accordion-body { display: block; }

/* Batch Cards */
.batch-card { padding: 32px 28px; display: flex; flex-direction: column; justify-content: space-between; background: #ffffff; }
.badge-seats { display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; background: #fee2e2; color: #dc2626; }

/* Form Wrap */
.form-wrap { display: grid; grid-template-columns: .85fr 1.15fr; gap: 36px; align-items: start; }
form { display: grid; gap: 14px; }
input, select, textarea {
  width: 100%; min-height: 50px; padding: 13px 16px; border-radius: var(--radius-sm);
  border: 1px solid var(--line-strong); background: #ffffff; color: var(--text); font: inherit; font-size: 15px;
}
textarea { min-height: 128px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.12); }
.notice { padding: 14px 16px; border-radius: var(--radius-sm); background: var(--accent-emerald-light); color: var(--accent-emerald); margin-bottom: 12px; border: 1px solid #a7f3d0; font-weight: 700; }

/* Community Box - EXACT BRAND COLOR (#2C3E50) */
.community-box {
  padding: 52px 48px; background: linear-gradient(135deg, #2C3E50, #3A5068);
  border-radius: var(--radius-lg); display: flex; align-items: center; justify-content: space-between;
  gap: 32px; color: #ffffff; box-shadow: var(--shadow-lg);
}
.community-box h2 { color: #ffffff; }
.community-box .lead { color: #D4E0EA; }
.community-box .tag { background: rgba(255, 255, 255, 0.2); color: #ffffff; }

/* Footer - BRAND COLOR (#2C3E50) */
.site-footer { background: var(--logo-bg); border-top: 1px solid rgba(255, 255, 255, 0.12); padding: 64px 0 32px; color: #d8b4fe; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 36px; }
.site-footer h3 { color: #ffffff; font-size: 16px; margin-bottom: 14px; font-family: "Plus Jakarta Sans", sans-serif; text-transform: uppercase; letter-spacing: 1px; }
.footer-links { display: grid; gap: 10px; }
.footer-links a { font-size: 13.5px; color: #c4b5fd; transition: color .2s; }
.footer-links a:hover { color: #ffffff; padding-left: 4px; }
.social { display: flex; flex-wrap: wrap; gap: 10px; }
.social a { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255,255,255,.08); color: #ffffff; font-weight: 700; font-size: 13px; transition: background .2s; }
.social a:hover { background: rgba(168,85,247,0.3); border-color: rgba(168,85,247,0.6); }
.copyright { margin-top: 32px; padding-top: 24px; font-size: 13px; color: #A8C0D8; }
.float-whatsapp {
  position: fixed; left: 24px; right: auto; bottom: 24px; z-index: 40;
  width: 60px; height: 60px; border-radius: 999px; display: grid;
  place-items: center; background: #25d366; color: #fff; font-size: 28px;
  box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4);
  animation: pulseGlow 3s infinite;
  transition: transform .25s ease;
}
.float-whatsapp:hover { transform: scale(1.12); }

/* Keyframe Animations */
@keyframes floatAnim {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.4); }
  50% { box-shadow: 0 0 0 14px rgba(37, 211, 102, 0); }
}

@keyframes primaryGlow {
  0%, 100% { box-shadow: 0 4px 18px rgba(44, 62, 80, 0.30); }
  50% { box-shadow: 0 8px 28px rgba(44, 62, 80, 0.45); }
}

.hero-media img {
  animation: floatAnim 6s ease-in-out infinite;
}

.stat-card {
  animation: floatAnim 5s ease-in-out infinite 1s;
}

/* Item-Level Scroll Reveals (Smooth Staggered Entrance) */
.page-hero, .hero {
  opacity: 1 !important;
  transform: none !important;
}
.reveal-item {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.55s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.55s cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: opacity, transform;
}
.page-hero.reveal-item, .hero.reveal-item {
  opacity: 1 !important;
  transform: none !important;
}
body.elementor-editor-active .reveal-item {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

.reveal-item.reveal-scale {
  transform: scale(0.95) translateY(20px);
}
.reveal-item.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Staggered Delay Helpers */
.grid > .reveal-item:nth-child(1) { transition-delay: 0.05s; }
.grid > .reveal-item:nth-child(2) { transition-delay: 0.15s; }
.grid > .reveal-item:nth-child(3) { transition-delay: 0.25s; }
.grid > .reveal-item:nth-child(4) { transition-delay: 0.35s; }
.ribbon-grid > .reveal-item:nth-child(1) { transition-delay: 0.05s; }
.ribbon-grid > .reveal-item:nth-child(2) { transition-delay: 0.12s; }
.ribbon-grid > .reveal-item:nth-child(3) { transition-delay: 0.19s; }
.ribbon-grid > .reveal-item:nth-child(4) { transition-delay: 0.26s; }

/* Smooth Tab Transitions */
.path-panel, .faq-category-content {
  display: none;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.path-panel.active, .faq-category-content.active {
  display: grid;
  opacity: 1;
  transform: translateY(0);
}
.faq-category-content.active {
  display: block;
}


/* Card Glow Accent Line */
.card {
  position: relative;
  overflow: hidden;
}
.card:before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #2C3E50, #4A6278, #10b981);
  opacity: 0;
  transition: opacity .3s ease;
}
.card:hover:before {
  opacity: 1;
}

/* FAQ Category Tabs */
.faq-tabs {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 36px;
}
.faq-tab-btn {
  padding: 12px 24px;
  border-radius: 999px;
  background: var(--bg);
  border: 1px solid var(--line);
  color: var(--muted);
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all .2s ease;
  font-family: "Plus Jakarta Sans", sans-serif;
}
.faq-tab-btn.active, .faq-tab-btn:hover {
  background: var(--primary);
  color: #ffffff;
  border-color: var(--primary);
  box-shadow: 0 4px 18px rgba(44, 62, 80, 0.25);
}
.faq-category-content {
  display: none;
}
.faq-category-content.active {
  display: block;
}


/* Responsive Rules */
@media (max-width: 980px) {
  .nav { min-height: 72px; }
  .site-logo { height: 48px; }
  .brand-text { font-size: 20px; }
  .mobile-toggle { display: flex; align-items: center; justify-content: center; }
  .menu {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: var(--logo-bg); border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    flex-direction: column; padding: 24px; align-items: stretch; gap: 16px;
    box-shadow: var(--shadow-lg);
  }
  .menu.open { display: flex; }
  .phone { display: block; text-align: center; }
  .hero-grid, .grid.four, .grid.three, .grid.two, .form-wrap { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .section-head, .cta-band, .copyright, .community-box { align-items: flex-start; flex-direction: column; }
  h1 { font-size: 40px; }
  h2 { font-size: 30px; }
  .hero { padding: 56px 0 64px; }
  .section { padding: 56px 0; }
  .stat-card { position: static; margin-top: 16px; }
  .ribbon-grid { grid-template-columns: 1fr 1fr; }
  .path-panel.active, .calc-wrapper { grid-template-columns: 1fr; padding: 24px; }
}

@media (max-width: 640px) {
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
}

/* SLIDE-IN LEAD DRAWER STYLING */
.slide-lead-wrap {
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
}

.slide-lead-wrap.open {
  pointer-events: auto;
}

.slide-lead-overlay {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.slide-lead-wrap.open .slide-lead-overlay {
  opacity: 1;
  pointer-events: auto;
}

.slide-lead-panel {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: 440px;
  max-width: 88vw;
  background: #ffffff;
  box-shadow: -15px 0 45px rgba(0, 0, 0, 0.35);
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  z-index: 9999;
  pointer-events: auto;
}

.slide-lead-wrap.open .slide-lead-panel {
  transform: translateX(0);
}

.slide-lead-trigger-btn {
  position: fixed;
  right: 0;
  top: 40%;
  transform: translateY(-50%);
  z-index: 10000;
  pointer-events: auto !important;
  background: linear-gradient(135deg, #2C3E50, #4A6278);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-right: none;
  border-radius: 12px 0 0 12px;
  padding: 16px 10px;
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 13px;
  cursor: pointer !important;
  box-shadow: -6px 10px 25px rgba(44, 62, 80, 0.4);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: nowrap !important;
  letter-spacing: .06em;
  transition: right 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.25s ease;
}

.slide-lead-wrap.open .slide-lead-trigger-btn {
  right: min(440px, 88vw);
}

.slide-lead-trigger-btn:hover {
  background: linear-gradient(135deg, #1a2840, #4A6278);
}

.slide-trigger-icon {
  writing-mode: horizontal-tb;
  font-size: 15px;
}


.slide-lead-header {
  background: linear-gradient(135deg, #2C3E50, #1c0038);
  padding: 24px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.slide-lead-close {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #ffffff;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 16px;
}

.slide-lead-body {
  padding: 24px 28px;
  flex: 1;
}

/* ENHANCED LEAD FORM STYLING */
.enhanced-lead-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.enhanced-lead-form .form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.enhanced-lead-form .form-label {
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-family: var(--font-heading);
}

.input-icon-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.input-icon-wrap .input-icon {
  position: absolute;
  left: 14px;
  font-size: 15px;
  pointer-events: none;
  opacity: 0.7;
}

.enhanced-lead-form input,
.enhanced-lead-form select,
.enhanced-lead-form textarea {
  width: 100%;
  padding: 12px 14px 12px 42px;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  font-size: 14px;
  font-family: var(--font-body);
  color: #2D2D2D;
  outline: none;
  transition: all .2s ease;
}

.enhanced-lead-form textarea {
  padding-left: 14px;
}

.enhanced-lead-form input:focus,
.enhanced-lead-form select:focus,
.enhanced-lead-form textarea:focus {
  border-color: #4A6278;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.15);
}

.full-width-btn {
  width: 100%;
  padding: 14px;
  font-size: 15px;
  font-weight: 800;
  border-radius: 10px;
  margin-top: 6px;
  background: linear-gradient(135deg, #2C3E50, #4A6278);
  box-shadow: 0 8px 20px rgba(44, 62, 80, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  border: none;
  cursor: pointer;
}

.full-width-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(44, 62, 80, 0.45);
}

.form-trust-badges {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 11px;
  color: #64748b;
  font-weight: 600;
}

/* 3D CARD FLIP CONTAINER */
.lead-card-3d-container {
  perspective: 1200px;
  width: 100%;
}

.lead-card-3d-inner {
  position: relative;
  width: 100%;
  transform-style: preserve-3d;
  transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.lead-card-3d-container.flipped .lead-card-3d-inner {
  transform: rotateY(180deg);
}

.lead-card-front,
.lead-card-back {
  width: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.lead-card-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 480px;
  transform: rotateY(180deg);
  background: #ffffff;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid var(--line);
  box-shadow: 0 10px 30px rgba(44, 62, 80, 0.1);
}

/* THANK YOU CARD STYLING */
.thank-you-card {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.thank-you-icon-badge {
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #10b981;
  font-size: 32px;
  display: grid;
  place-items: center;
  margin-bottom: 14px;
  border: 2px solid #a7f3d0;
  box-shadow: 0 10px 25px rgba(16, 185, 129, 0.25);
  animation: floatAnim 3s infinite ease-in-out;
}

.thank-you-title {
  font-size: 22px;
  font-weight: 800;
  color: #2D2D2D;
  margin-bottom: 8px;
  font-family: var(--font-heading);
}

.thank-you-text {
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
  margin-bottom: 18px;
}

.thank-you-details {
  width: 100%;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  text-align: left;
}

.detail-row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
}

.detail-row span {
  color: #64748b;
}

.thank-you-actions {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}


.form-trust-badges {
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
  font-size: 11px;
  color: #64748b;
  font-weight: 600;
}


/* ARTHIUM AI CHATBOT STYLING */
.ai-chatbot-wrap {
  position: fixed;
  right: 24px;
  left: auto;
  bottom: 24px;
  z-index: 50;
}


.ai-chat-btn {
  width: 60px;
  height: 60px;
  border-radius: 999px;
  background: linear-gradient(135deg, #2C3E50, #4A6278);
  border: 2px solid #ffffff;
  color: #ffffff;
  font-size: 26px;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(44, 62, 80, 0.45);
  position: relative;
  transition: transform .25s ease;
}

.ai-chat-btn:hover {
  transform: scale(1.12);
}

.ai-pulse-ring {
  position: absolute;
  top: -4px; left: -4px; right: -4px; bottom: -4px;
  border-radius: 999px;
  border: 2px solid #4A6278;
  animation: pulseGlow 2.5s infinite;
}

.ai-chat-window {
  display: none;
  position: absolute;
  bottom: 75px;
  right: 0;
  left: auto;
  width: 360px;
  max-width: calc(100vw - 40px);
  height: 480px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
  border: 1px solid var(--line);
  flex-direction: column;
  overflow: hidden;
  z-index: 51;
}


.ai-chat-window.open {
  display: flex;
  animation: floatAnim 0.3s ease;
}

.ai-chat-header {
  background: linear-gradient(135deg, #2C3E50, #1a2840);
  color: #ffffff;
  padding: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ai-chat-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ai-avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  display: grid;
  place-items: center;
  font-size: 18px;
}

.ai-chat-title strong {
  display: block;
  font-size: 14px;
  font-family: var(--font-heading);
}

.ai-status {
  font-size: 11px;
  color: #d8b4fe;
}

.ai-close-btn {
  background: none;
  border: none;
  color: #ffffff;
  font-size: 18px;
  cursor: pointer;
}

.ai-chat-messages {
  flex: 1;
  padding: 16px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: #f8fafc;
}

.ai-msg {
  display: flex;
}

.ai-msg.user {
  justify-content: flex-end;
}

.ai-msg.bot {
  justify-content: flex-start;
}

.ai-msg-content {
  max-width: 82%;
  padding: 10px 14px;
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.5;
}

.ai-msg.user .ai-msg-content {
  background: #2C3E50;
  color: #ffffff;
  border-bottom-right-radius: 2px;
}

.ai-msg.bot .ai-msg-content {
  background: #ffffff;
  color: #2D2D2D;
  border: 1px solid var(--line);
  border-bottom-left-radius: 2px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.ai-quick-prompts {
  padding: 8px 12px;
  background: #ffffff;
  border-top: 1px solid var(--line);
  display: flex;
  gap: 6px;
  overflow-x: auto;
  white-space: nowrap;
}

.ai-quick-prompts button {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

.ai-quick-prompts button:hover {
  background: var(--primary-light);
  color: var(--primary);
  border-color: var(--primary);
}

.ai-chat-input-wrap {
  padding: 12px;
  background: #ffffff;
  border-top: 1px solid var(--line);
  display: flex;
  gap: 8px;
}

.ai-chat-input-wrap input {
  flex: 1;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid var(--line);
  font-size: 13px;
  outline: none;
  font-family: var(--font-body);
}

.ai-chat-input-wrap button {
  padding: 10px 16px;
  border-radius: 10px;
  border: none;
  background: #2C3E50;
  color: #ffffff;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  font-family: var(--font-heading);
}

/* ════════════════════════════════════════════════
   CHATBOT LEAD CAPTURE SCREEN — PREMIUM STYLING
   ════════════════════════════════════════════════ */

.ai-lead-screen {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(160deg, #1a0035 0%, #2C3E50 60%, #3b0764 100%);
  overflow: hidden;
  position: relative;
}

.ai-lead-screen::before,
.ai-lead-screen::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  filter: blur(40px);
  pointer-events: none;
}
.ai-lead-screen::before {
  width: 180px; height: 180px;
  background: rgba(168, 85, 247, 0.25);
  top: -40px; right: -40px;
}
.ai-lead-screen::after {
  width: 140px; height: 140px;
  background: rgba(99, 102, 241, 0.2);
  bottom: -30px; left: -30px;
}

.ai-lead-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 28px 24px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.ai-lead-icon {
  width: 64px; height: 64px;
  background: linear-gradient(135deg, #6B8EA8, #7c3aed);
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  margin-bottom: 16px;
  box-shadow: 0 8px 24px rgba(168, 85, 247, 0.5);
  animation: iconFloat 3s ease-in-out infinite;
}

@keyframes iconFloat {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-7px); }
}

.ai-lead-title {
  color: #ffffff;
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 6px;
  font-family: var(--font-heading);
  letter-spacing: -0.01em;
}

.ai-lead-sub {
  color: #c4b5fd;
  font-size: 12px;
  line-height: 1.6;
  margin: 0 0 20px;
}

#ai-lead-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ai-lead-field {
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1.5px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  padding: 0 14px;
  transition: border-color .2s, background .2s, box-shadow .2s;
}

.ai-lead-field:focus-within {
  border-color: #6B8EA8;
  background: rgba(168, 85, 247, 0.14);
  box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.22);
}

.ai-lead-field-icon {
  font-size: 15px;
  margin-right: 10px;
  flex-shrink: 0;
  opacity: 0.7;
}

.ai-lead-field input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #ffffff;
  font-size: 13px;
  font-family: var(--font-body);
  padding: 14px 0;
  font-weight: 500;
}

.ai-lead-field input::placeholder {
  color: rgba(196, 181, 253, 0.55);
}

.ai-lead-btn {
  width: 100%;
  padding: 14px;
  background: linear-gradient(135deg, #7c3aed, #6B8EA8);
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  font-family: var(--font-heading);
  margin-top: 4px;
  box-shadow: 0 6px 20px rgba(124, 58, 237, 0.45);
  transition: transform .2s, box-shadow .2s, opacity .2s;
  letter-spacing: 0.02em;
}

.ai-lead-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(124, 58, 237, 0.6);
}

.ai-lead-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.ai-lead-err {
  color: #fca5a5;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  margin: 0;
}

@keyframes leadSlideOut {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-16px); }
}

@keyframes chatSlideIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

.ai-lead-slide-out { animation: leadSlideOut 0.35s ease forwards; }
.ai-chat-slide-in  { animation: chatSlideIn  0.35s ease forwards; }
.ai-chat-main { display: flex; flex-direction: column; flex: 1; overflow: hidden; }


/* ================================================================
   NUCLEAR CONTRAST SYSTEM — ADDED AT END OF STYLESHEET (WINS ALL)
   Body bg: #2C3E50 dark purple. Cards bg: #ffffff white.
   ================================================================ */

/* Step 1: ALL section headings white by default (dark bg inherited from body/main) */
html body main section h1,
html body main section h2,
html body main section h3,
html body main section h4,
html body main section .section-head h1,
html body main section .section-head h2,
html body main section .section-head h3 {
  color: #ffffff !important;
}

html body main section p,
html body main section .lead,
html body main section .section-head p {
  color: #e2d9f3 !important;
}

/* Step 2: WHITE/LIGHT sections override to dark text */
html body main .section.deep h1,
html body main .section.deep h2,
html body main .section.deep h3,
html body main .section.deep h4,
html body main .section.panel h1,
html body main .section.panel h2,
html body main .section.panel h3,
html body main .section-light h1,
html body main .section-light h2,
html body main .section-light h3,
html body main section[style*="background:#ffffff"] h1,
html body main section[style*="background:#ffffff"] h2,
html body main section[style*="background:#ffffff"] h3,
html body main section[style*="background: #ffffff"] h1,
html body main section[style*="background: #ffffff"] h2,
html body main section[style*="background: #ffffff"] h3,
html body main section[style*="background:#fff"] h1,
html body main section[style*="background:#fff"] h2,
html body main section[style*="background:#fff"] h3,
html body main section[style*="background: #fff"] h1,
html body main section[style*="background: #fff"] h2,
html body main section[style*="background: #fff"] h3,
html body main section[style*="background:#f8fafc"] h1,
html body main section[style*="background:#f8fafc"] h2,
html body main section[style*="background:#f8fafc"] h3,
html body main section[style*="background: #f8fafc"] h1,
html body main section[style*="background: #f8fafc"] h2,
html body main section[style*="background: #f8fafc"] h3 {
  color: #2D2D2D !important;
}

html body main .section.deep p,
html body main .section.deep .lead,
html body main .section.panel p,
html body main .section.panel .lead,
html body main .section-light p,
html body main .section-light .lead,
html body main section[style*="background:#ffffff"] p,
html body main section[style*="background:#ffffff"] .lead,
html body main section[style*="background:#fff"] p,
html body main section[style*="background:#fff"] .lead,
html body main section[style*="background:#f8fafc"] p,
html body main section[style*="background:#f8fafc"] .lead {
  color: #475569 !important;
}

/* Step 3: WHITE CARDS always dark text */
html body .glass.card h1, html body .glass.card h2, html body .glass.card h3, html body .glass.card h4,
html body .card h1, html body .card h2, html body .card h3, html body .card h4,
html body .path-panel h1, html body .path-panel h2, html body .path-panel h3,
html body .step-card h1, html body .step-card h2, html body .step-card h3,
html body .calc-wrapper h1, html body .calc-wrapper h2, html body .calc-wrapper h3,
html body .batch-card h1, html body .batch-card h2, html body .batch-card h3,
html body .accordion-header {
  color: #2D2D2D !important;
}

html body .glass.card p, html body .glass.card li,
html body .card p, html body .card li,
html body .path-panel p, html body .step-card p,
html body .calc-wrapper p, html body .batch-card p,
html body .accordion-body {
  color: #475569 !important;
}

/* Step 4: Hero sections always white */
html body .hero h1, html body .hero h2, html body .hero h3, html body .hero p,
html body .page-hero h1, html body .page-hero h2, html body .page-hero h3, html body .page-hero p,
html body .community-box h1, html body .community-box h2, html body .community-box h3, html body .community-box p {
  color: #ffffff !important;
}
/* END NUCLEAR CONTRAST SYSTEM */

/* ── SOCIAL ICONS SVG & HOVER TRANSITIONS ── */
.social a {
  transition: all 0.25s ease;
}
.social a:hover {
  background: #4A6278;
  border-color: #6B8EA8;
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(44, 62, 80, 0.4);
}
.social a svg {
  display: block;
  transition: transform 0.2s ease;
}
.social a:hover svg {
  transform: scale(1.15);
}

/* ── HOMEPAGE AUTO POPUP MODAL (BASIC INFO LEAD CAPTURE) ── */
.home-popup-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(15, 23, 42, 0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s;
}
.home-popup-overlay.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.home-popup-card {
  position: relative;
  width: 100%;
  max-width: 490px;
  background: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 25px 60px -15px rgba(44, 62, 80, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.15);
  transform: translateY(24px) scale(0.96);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.home-popup-overlay.active .home-popup-card {
  transform: translateY(0) scale(1);
}
.home-popup-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.22);
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: all 0.2s ease;
  z-index: 10;
}
.home-popup-close:hover {
  background: rgba(255, 255, 255, 0.4);
  transform: rotate(90deg);
}
.home-popup-header {
  background: linear-gradient(135deg, #2C3E50 0%, #4A6278 100%);
  padding: 28px 24px 22px;
  color: #ffffff;
  text-align: left;
}
.home-popup-badge {
  display: inline-block;
  background: rgba(254, 240, 138, 0.18);
  color: #B8960C;
  border: 1px solid rgba(254, 240, 138, 0.35);
  font-size: 11px;
  font-weight: 800;
  padding: 3px 10px;
  border-radius: 999px;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.home-popup-title {
  font-size: 21px;
  font-weight: 800;
  color: #ffffff !important;
  margin: 0 0 6px !important;
  font-family: 'Plus Jakarta Sans', sans-serif;
  line-height: 1.25;
}
.home-popup-subtitle {
  font-size: 13px;
  color: #D4E0EA !important;
  margin: 0 !important;
  line-height: 1.45;
}
.home-popup-body {
  padding: 22px 24px 26px;
  background: #ffffff;
}
.home-popup-field {
  margin-bottom: 14px;
}
.home-popup-field label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #334155 !important;
  margin-bottom: 5px;
}
.home-popup-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.home-popup-field-icon {
  position: absolute;
  left: 12px;
  font-size: 15px;
  pointer-events: none;
  opacity: 0.75;
}
.home-popup-input-wrap input,
.home-popup-input-wrap select {
  width: 100%;
  padding: 10px 14px 10px 38px;
  border-radius: 10px;
  border: 1.5px solid #e2e8f0;
  font-size: 13.5px;
  font-family: inherit;
  color: #2D2D2D;
  background: #f8fafc;
  transition: all 0.2s ease;
  box-sizing: border-box;
}
.home-popup-input-wrap input:focus,
.home-popup-input-wrap select:focus {
  outline: none;
  border-color: #4A6278;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.15);
}
.home-popup-submit-btn {
  width: 100%;
  padding: 13px;
  border: none;
  border-radius: 10px;
  font-size: 14.5px;
  font-weight: 800;
  color: #ffffff;
  cursor: pointer;
  background: linear-gradient(135deg, #2C3E50 0%, #4A6278 100%);
  box-shadow: 0 6px 18px rgba(44, 62, 80, 0.35);
  transition: all 0.2s ease;
  margin-top: 4px;
}
.home-popup-submit-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(44, 62, 80, 0.45);
}
.home-popup-err {
  color: #ef4444;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  margin: 8px 0 0;
}
.home-popup-note {
  text-align: center;
  font-size: 11px;
  color: #64748b !important;
  margin: 10px 0 0 !important;
}
.home-popup-success {
  padding: 32px 24px 28px;
  text-align: center;
  background: #ffffff;
}
.home-popup-success-icon {
  font-size: 44px;
  line-height: 1;
  margin-bottom: 6px;
}