@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Outfit:wght@300;400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap');

:root {
  --bg-base: #ffffff;
  --bg-surface: #ffffff;
  --bg-elevated: #f3f4f6;

  --border-subtle: rgba(0, 0, 0, 0.05);
  --border-strong: rgba(0, 0, 0, 0.1);

  --text-primary: #111827;
  --text-secondary: #4b5563;
  --text-muted: #9ca3af;

  --accent-gold: #D4AF37;
  --accent-gold-bright: #f5d788;
  --accent-gold-dim: rgba(212, 175, 55, 0.12);
  --accent-gold-glow: rgba(212, 175, 55, 0.15);

  /* App Mirroring Colors */
  --color-sun: #F59E0B;
  --color-moon: #A78BFA;
  --color-rising: #22D3EE;
  --color-emerald: #10B981;
  --color-violet: #8B5CF6;
  --color-rose: #F472B6;
  --color-indigo: #6366F1;
  --color-mystic: #A855F7;
  --color-rose-red: #FB7185;

  /* Planet Colors */
  --planet-sun: #FBBF24;
  --planet-moon: #E2E8F0;
  --planet-mercury: #60A5FA;
  --planet-venus: #F9A8D4;
  --planet-mars: #F87171;
  --planet-jupiter: #FDBA74;
  --planet-saturn: #A3A3A3;
  --planet-uranus: #67E8F9;
  --planet-neptune: #818CF8;
  --planet-pluto: #C084FC;
  
  --font-main: 'Outfit', 'Inter', sans-serif;
  --font-display: 'Playfair Display', serif;
  color-scheme: light;

  --fluid-h1: clamp(2.5rem, 8vw, 4.5rem);
  --fluid-h2: clamp(2rem, 6vw, 3.2rem);
  --fluid-body: clamp(0.95rem, 2vw, 1.1rem);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  background-color: #ffffff !important;
  color: #111827 !important;
  margin: 0;
  padding: 0;
  min-height: 100%;
  overscroll-behavior-y: auto;
}

body {
  font-family: var(--font-main);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  overflow-y: visible;
}

#root {
  min-height: 100dvh;
  background-color: #ffffff;
  overflow-x: hidden;
  overflow-y: visible;
}

/* Typography */

h1, h2, h3, h4 {
  font-family: var(--font-display);
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
}

.headline-gradient {
  background: linear-gradient(135deg, #111827 0%, #4b5563 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* Nav */

.nav-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 5%;
  width: 100%;
  z-index: 100;
}

/* Navigation Themes */

.nav-container.theme-dark {
  background: rgba(2, 6, 23, 0.88);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.nav-container.theme-light {
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.nav-logo-text {
  font-weight: 800;
  font-size: 1.25rem;
  letter-spacing: -0.03em;
  font-family: var(--font-display);
  line-height: 1;
  transition: color 0.2s ease;
}

.theme-dark .nav-logo-text {
  color: #FFFFFF;
}

.theme-light .nav-logo-text {
  color: #111827;
}

.nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
}

.nav-link {
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 700;
  transition: color 0.2s;
  position: relative;
}

.theme-dark .nav-link {
  color: rgba(255, 255, 255, 0.74);
}

.theme-dark .nav-link:hover {
  color: #ffffff;
}

.theme-dark .nav-link.active {
  color: #F6C65B;
}

.theme-dark .nav-link.active::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 100%;
  height: 1px;
  background: #F6C65B;
}

.theme-light .nav-link {
  color: rgba(17, 24, 39, 0.74);
}

.theme-light .nav-link:hover {
  color: #8B5CF6;
}

.theme-light .nav-link.active {
  color: #8B5CF6;
}

.theme-light .nav-link.active::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 100%;
  height: 1px;
  background: #8B5CF6;
}

.nav-dropdown {
  position: relative;
  display: flex;
  align-items: center;
}

.nav-dropdown::after {
  content: '';
  position: absolute;
  top: 100%;
  left: -18px;
  right: -18px;
  height: 28px;
}

.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  width: min(720px, calc(100vw - 48px));
  max-height: 72vh;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 18px;
  border-radius: 22px;
  z-index: 1001;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(8px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.theme-dark .nav-dropdown-menu {
  background:
    radial-gradient(circle at 16% 0%, rgba(245, 158, 11, 0.18), transparent 28%),
    linear-gradient(145deg, rgba(2, 6, 23, 0.98), rgba(10, 16, 32, 0.98));
  border: 1px solid rgba(246, 198, 91, 0.22);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.42);
}

.theme-light .nav-dropdown-menu {
  background:
    radial-gradient(circle at 16% 0%, rgba(139, 92, 246, 0.06), transparent 28%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(249, 250, 251, 0.99));
  border: 1px solid rgba(139, 92, 246, 0.16);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.12);
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.nav-dropdown-heading {
  grid-column: 1 / -1;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0 4px 6px;
}

.theme-dark .nav-dropdown-heading {
  color: #F6C65B;
}

.theme-light .nav-dropdown-heading {
  color: #8B5CF6;
}

.nav-dropdown-menu a {
  display: grid;
  gap: 2px;
  padding: 12px;
  text-decoration: none;
  border-radius: 14px;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.theme-dark .nav-dropdown-menu a {
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.055);
}

.theme-dark .nav-dropdown-menu a:hover {
  transform: translateY(-1px);
  border-color: rgba(246, 198, 91, 0.32);
  background: rgba(255, 255, 255, 0.09);
}

.theme-light .nav-dropdown-menu a {
  color: #111827;
  border: 1px solid rgba(139, 92, 246, 0.08);
  background: rgba(139, 92, 246, 0.02);
}

.theme-light .nav-dropdown-menu a:hover {
  transform: translateY(-1px);
  border-color: rgba(139, 92, 246, 0.24);
  background: rgba(139, 92, 246, 0.05);
}

.nav-dropdown-menu span {
  font-size: 0.92rem;
  font-weight: 850;
}

.nav-dropdown-menu small {
  font-size: 0.76rem;
  font-weight: 650;
}

.theme-dark .nav-dropdown-menu small {
  color: rgba(248, 250, 252, 0.58);
}

.theme-light .nav-dropdown-menu small {
  color: #6B7280;
}

.nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 28px;
  color: #050510;
  background: linear-gradient(135deg, #F6C65B 0%, #F59E0B 100%);
  border-radius: 999px;
  text-align: center;
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 850;
  box-shadow: 0 14px 34px rgba(245, 158, 11, 0.24);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.nav-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 42px rgba(245, 158, 11, 0.32);
  filter: brightness(1.03);
}

.nav-mobile-tools {
  display: none;
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 850;
}

.theme-dark .nav-mobile-tools {
  color: rgba(255, 255, 255, 0.84);
}

.theme-light .nav-mobile-tools {
  color: rgba(17, 24, 39, 0.84);
}

@media (max-width: 980px) {
  .nav-container {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .nav-links {
    display: none;
  }

  .nav-dropdown-menu {
    display: none;
  }

  .nav-mobile-tools {
    display: inline-flex;
  }
}

@media (max-width: 560px) {
  .nav-container {
    padding-left: 20px;
    padding-right: 20px;
  }

  .nav-mobile-tools {
    font-size: 0.82rem;
  }

  .nav-cta {
    min-height: 44px;
    padding: 0 15px;
    font-size: 0.84rem;
  }
}

/* Buttons */

.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--accent-gold);
  color: #000;
  padding: 0.8rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  font-size: 0.95rem;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s, transform 0.15s;
}

.btn-primary:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

/* Background Gradients */

.glow-orb-purple {
  position: absolute;
  width: 800px;
  height: 800px;
  background: radial-gradient(circle at center, 
    rgba(139, 92, 246, 0.15) 0%, 
    rgba(99, 102, 241, 0.08) 30%, 
    transparent 70%);
  filter: blur(100px);
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
}

.glow-orb-gold {
  position: absolute;
  width: 700px;
  height: 700px;
  background: radial-gradient(circle at center, 
    rgba(245, 158, 11, 0.12) 0%, 
    rgba(212, 175, 55, 0.05) 40%, 
    transparent 80%);
  filter: blur(100px);
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
}

/* ================= ASTROVIBE HOME V2 ================= */

.home-container {
  padding-bottom: 0;
  position: relative;
  background-color: #ffffff !important;
}

/* Ambient Background */

.av-ambient {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  pointer-events: none;
  z-index: 0;
}

.av-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
  animation: av-float 20s ease-in-out infinite;
}

.av-orb-1 {
  width: 900px; height: 900px;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.12) 0%, transparent 70%);
  top: -20%; left: -15%;
  animation-delay: 0s;
}

.av-orb-2 {
  width: 700px; height: 700px;
  background: radial-gradient(circle, rgba(245, 158, 11, 0.08) 0%, transparent 70%);
  top: 30%; right: -15%;
  animation-delay: -7s;
}

.av-orb-3 {
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(34, 211, 238, 0.06) 0%, transparent 70%);
  bottom: 10%; left: 20%;
  animation-delay: -14s;
}

@keyframes av-float {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(30px, -40px) scale(1.05); }
  66% { transform: translate(-20px, 20px) scale(0.95); }
}

/* Scroll Reveal */

.av-reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.av-reveal.av-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---- HERO ---- */

.av-hero {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 95vh;
  text-align: center;
  padding: 8rem 5% 4rem;
}

.av-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 20px;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 40px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin-bottom: 3rem;
  color: var(--text-secondary);
}

.av-pulse-dot {
  width: 6px; height: 6px;
  background: var(--color-emerald);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--color-emerald);
  animation: av-pulse 2s ease-in-out infinite;
}

@keyframes av-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 8px var(--color-emerald); }
  50% { opacity: 0.4; box-shadow: 0 0 20px var(--color-emerald); }
}

.av-hero-title-hormozi {
  font-size: clamp(2.5rem, 8vw, 5.5rem);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.04em;
  margin-bottom: 2rem;
  color: #111827;
  max-width: 1200px;
}

.av-hero-title-hormozi .text-highlight {
  color: #8B5CF6;
}

.av-hero-sub-hormozi {
  font-size: clamp(1.1rem, 2.5vw, 1.4rem);
  color: #4b5563;
  max-width: 800px;
  line-height: 1.6;
  margin-bottom: 3rem;
  font-family: var(--font-main);
  font-weight: 500;
}

.av-hero-sub {
  font-size: clamp(1rem, 2.5vw, 1.3rem);
  color: var(--text-secondary);
  max-width: 680px;
  line-height: 1.7;
  margin-bottom: 3.5rem;
  font-family: var(--font-main);
}

.av-hero-actions {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 4rem;
}

.av-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 1rem 2.5rem;
  font-size: 1rem;
  font-weight: 700;
  background: var(--accent-gold);
  color: #000;
  border-radius: 12px;
  border: none;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.3s;
  font-family: var(--font-main);
}

.av-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(212, 175, 55, 0.3);
}

.av-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 1rem 2rem;
  font-size: 1rem;
  font-weight: 600;
  background: transparent;
  color: var(--text-secondary);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
  font-family: var(--font-main);
}

.av-btn-ghost:hover {
  color: #fff;
  border-color: rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.03);
}

.av-hero-metrics {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  color: var(--text-muted);
  font-size: 0.82rem;
}

.av-metric {
  display: flex; align-items: center; gap: 8px;
}

.av-metric-sep {
  width: 1px; height: 16px;
  background: var(--border-strong);
}

/* ---- TICKER ---- */

.av-ticker {
  position: relative;
  z-index: 1;
  width: 100%;
  overflow: hidden;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  padding: 1.2rem 0;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(12px);
}

.av-ticker-track {
  display: flex;
  animation: av-marquee 40s linear infinite;
}

.av-ticker-set {
  display: flex;
  gap: 3rem;
  padding-right: 3rem;
  white-space: nowrap;
}

.av-ticker-set span {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  transition: color 0.3s;
}

.av-ticker-set span:hover { color: var(--accent-gold); }

@keyframes av-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ---- SECTION HEADER ---- */

.av-section-header {
  text-align: center;
  margin-bottom: 5rem;
}

.av-section-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 30px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  margin-bottom: 2rem;
}

.av-section-title {
  font-size: clamp(2.2rem, 6vw, 3.5rem);
  font-weight: 800;
  line-height: 1.1;
  margin-bottom: 1.5rem;
  color: var(--text-primary);
}

.av-section-sub {
  font-size: 1.1rem;
  color: var(--text-secondary);
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.7;
  font-family: var(--font-main);
}

/* ---- FEATURES GRID ---- */

.av-features-section {
  position: relative;
  z-index: 1;
  padding: 8rem 5%;
  max-width: 1400px;
  margin: 0 auto;
}

.av-features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.av-feature-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
  padding: 2.2rem 1.8rem;
  position: relative;
  overflow: hidden;
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
              border-color 0.4s,
              box-shadow 0.4s;
  cursor: pointer;
  display: flex;
  flex-direction: column;
}

.av-feature-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--card-color), transparent);
  opacity: 0;
  transition: opacity 0.4s;
}

.av-feature-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: radial-gradient(ellipse at top left, var(--card-color), transparent 70%);
  opacity: 0;
  transition: opacity 0.5s;
  pointer-events: none;
}

.av-feature-card:hover {
  transform: translateY(-6px);
  border-color: var(--card-color);
  box-shadow: 0 20px 60px -15px var(--card-color);
}

.av-feature-card:hover::before { opacity: 1; }

.av-feature-card:hover::after { opacity: 0.04; }

.av-feature-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.av-feature-icon {
  width: 48px; height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
}

.av-feature-tag {
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: var(--text-muted);
  padding: 4px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
}

.av-tag-premium {
  color: var(--accent-gold);
  border-color: rgba(212, 175, 55, 0.3);
  background: rgba(212, 175, 55, 0.05);
}

.av-feature-card h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 0.8rem;
  font-family: var(--font-main);
}

.av-feature-card p {
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ---- PROCESS / HOW IT WORKS ---- */

.av-process-section {
  position: relative;
  z-index: 1;
  padding: 8rem 5%;
  max-width: 900px;
  margin: 0 auto;
}

.av-process-steps {
  display: flex;
  flex-direction: column;
}

.av-process-step {
  display: flex;
  gap: 2.5rem;
  align-items: stretch;
}

.av-step-number {
  width: 52px; height: 52px;
  min-width: 52px;
  border: 1.5px solid var(--accent-gold);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-gold);
  font-weight: 800;
  font-size: 0.9rem;
  font-family: var(--font-main);
  position: relative;
  z-index: 2;
  background: var(--bg-base);
}

.av-step-line {
  position: absolute;
  left: calc(5% + 25px);
  width: 1.5px;
  height: 100%;
  background: linear-gradient(180deg, var(--border-strong), transparent);
}

.av-step-line-hidden { opacity: 0; }

.av-process-step {
  position: relative;
  padding-bottom: 4rem;
}

.av-step-content h3 {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 0.8rem;
  font-family: var(--font-main);
}

.av-step-content p {
  font-size: 1rem;
  color: var(--text-secondary);
  line-height: 1.7;
  max-width: 500px;
}

/* ---- STATS ---- */

.av-stats-section {
  position: relative;
  z-index: 1;
  padding: 4rem 5% 8rem;
  max-width: 1200px;
  margin: 0 auto;
}

.av-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

.av-stat-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
  padding: 3rem 2rem;
  text-align: center;
  transition: border-color 0.3s, transform 0.3s;
}

.av-stat-card:hover {
  border-color: var(--border-strong);
  transform: translateY(-4px);
}

.av-stat-value {
  font-size: 3rem;
  font-weight: 800;
  color: var(--accent-gold);
  font-family: var(--font-main);
  line-height: 1;
  margin-bottom: 0.8rem;
}

.av-stat-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1.5px;
}

/* ---- FINAL CTA ---- */

.av-cta-section {
  position: relative;
  z-index: 1;
  padding: 0 5% 8rem;
  max-width: 1200px;
  margin: 0 auto;
}

.av-cta-card {
  position: relative;
  background: linear-gradient(145deg, rgba(139, 92, 246, 0.08), rgba(212, 175, 55, 0.08));
  border: 1px solid var(--border-strong);
  border-radius: 32px;
  padding: 6rem 3rem;
  text-align: center;
  overflow: hidden;
}

.av-cta-glow {
  position: absolute;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(212, 175, 55, 0.1) 0%, transparent 70%);
  top: -200px; left: 50%;
  transform: translateX(-50%);
  filter: blur(80px);
  pointer-events: none;
}

.av-cta-title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  color: var(--text-primary);
  margin: 2rem 0 1.2rem;
}

.av-cta-sub {
  font-size: 1.1rem;
  color: var(--text-secondary);
  max-width: 500px;
  margin: 0 auto 3rem;
  line-height: 1.7;
}

.av-btn-cta {
  padding: 1.2rem 3rem;
  font-size: 1.1rem;
}

/* ---- RESPONSIVE ---- */

@media (max-width: 1100px) {
  .av-features-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
  .av-features-grid { grid-template-columns: repeat(2, 1fr); }
  .av-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .av-hero-actions { flex-direction: column; }
  .av-hero-metrics { flex-wrap: wrap; justify-content: center; }
  .av-process-step { gap: 1.5rem; }
}

@media (max-width: 600px) {
  .av-features-grid { grid-template-columns: 1fr; }
  .av-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .av-hero { padding: 7rem 5% 3rem; min-height: 85vh; }
  .av-step-line { display: none; }
}

/* Ritual */

.ritual-section { padding: 10rem 5%; border-top: 1px solid var(--border-subtle); }

.ritual-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4rem; margin-top: 5rem; }

.ritual-step { display: flex; flex-direction: column; gap: 2rem; }

.step-num { width: 40px; height: 40px; border: 1px solid var(--accent-gold); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--accent-gold); font-weight: 800; font-size: 0.8rem; }

/* CTA */

.cta-section { padding: 8rem 5%; }

.cta-card { background: var(--accent-gold); padding: 6rem 2rem; border-radius: 40px; text-align: center; color: #000; }

.cta-headline { font-size: clamp(2rem, 8vw, 4rem); font-weight: 800; margin-bottom: 1.5rem; }

/* ================= SHARED PAGE STYLES (Science, About, Privacy) ================= */

.av-page {
  position: relative;
  padding-bottom: 0;
  background-color: var(--bg-base);
}

.av-page-hero {
  position: relative;
  z-index: 1;
  padding: 12rem 5% 4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.av-page-title {
  font-size: clamp(2.8rem, 8vw, 5rem);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.04em;
  color: var(--text-primary);
  margin-bottom: 1.5rem;
}

.av-page-sub {
  font-size: clamp(1rem, 2vw, 1.2rem);
  color: var(--text-secondary);
  max-width: 620px;
  line-height: 1.7;
  font-family: var(--font-main);
}

/* ---- SCIENCE: Pillar Cards ---- */

.av-pillars {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 5% 6rem;
}

.av-pillar-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 24px;
  padding: 2.5rem 2rem;
  position: relative;
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.4s, box-shadow 0.4s;
}

.av-pillar-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--card-color), transparent);
  opacity: 0;
  transition: opacity 0.4s;
}

.av-pillar-card:hover {
  transform: translateY(-6px);
  border-color: var(--card-color);
  box-shadow: 0 20px 60px -15px var(--card-color);
}

.av-pillar-card:hover::before { opacity: 1; }

.av-pillar-icon {
  width: 52px; height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border-subtle);
  border-radius: 16px;
  margin-bottom: 1.5rem;
}

.av-pillar-card h3 {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 1rem;
  font-family: var(--font-main);
}

.av-pillar-card p {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.av-pillar-tag {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 1.5px;
  padding: 5px 12px;
  border: 1px solid;
  border-radius: 20px;
  opacity: 0.8;
}

/* ---- SCIENCE: Tech Grid ---- */

.av-deepdive {
  position: relative;
  z-index: 1;
  padding: 6rem 5%;
  max-width: 1200px;
  margin: 0 auto;
}

.av-tech-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}

.av-tech-item {
  display: flex;
  gap: 1.2rem;
  padding: 1.8rem;
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 16px;
  transition: border-color 0.3s, transform 0.3s;
}

.av-tech-item:hover {
  border-color: var(--border-strong);
  transform: translateY(-3px);
}

.av-tech-icon {
  width: 40px; height: 40px;
  min-width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-gold);
  background: rgba(212, 175, 55, 0.06);
  border: 1px solid rgba(212, 175, 55, 0.15);
  border-radius: 12px;
}

.av-tech-item strong {
  display: block;
  color: var(--text-primary);
  font-size: 0.95rem;
  margin-bottom: 0.4rem;
  font-family: var(--font-main);
}

.av-tech-item span {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ---- SCIENCE: Orbital Visual ---- */

.av-orbital-section {
  position: relative;
  z-index: 1;
  padding: 4rem 5% 8rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.av-orbital-visual {
  position: relative;
  width: 280px; height: 280px;
  margin-bottom: 2rem;
}

.av-orbital-ring {
  position: absolute;
  border: 1px solid var(--border-subtle);
  border-radius: 50%;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  animation: av-orbit-pulse 8s ease-in-out infinite;
}

.av-ring-1 { width: 100%; height: 100%; }

.av-ring-2 { width: 70%; height: 70%; animation-delay: -2s; }

.av-ring-3 { width: 40%; height: 40%; animation-delay: -5s; }

.av-orbital-dot {
  position: absolute;
  width: 8px; height: 8px;
  border-radius: 50%;
  animation: av-orbit-dot 12s linear infinite;
}

.av-ring-1 .av-orbital-dot { top: -4px; left: 50%; }

.av-ring-2 .av-orbital-dot { top: 50%; right: -4px; }

.av-ring-3 .av-orbital-dot { bottom: -4px; left: 50%; }

.av-orbital-core {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.5rem;
  color: var(--accent-gold);
  text-shadow: 0 0 20px var(--accent-gold);
}

.av-orbital-caption {
  font-size: 0.85rem;
  color: var(--text-muted);
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 600;
}

@keyframes av-orbit-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}

@keyframes av-orbit-dot {
  0% { transform: rotate(0deg) translateX(20px) rotate(0deg); }
  100% { transform: rotate(360deg) translateX(20px) rotate(-360deg); }
}

/* ---- ABOUT: Dual Cards ---- */

.av-dual-section {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 5% 6rem;
}

.av-dual-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 24px;
  padding: 3rem 2.5rem;
  position: relative;
  transition: border-color 0.4s, transform 0.4s;
}

.av-dual-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--card-color), transparent);
  opacity: 0.6;
}

.av-dual-card:hover {
  border-color: var(--card-color);
  transform: translateY(-4px);
}

.av-dual-icon { margin-bottom: 1.5rem; }

.av-dual-card h3 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 1rem;
  font-family: var(--font-main);
}

.av-dual-card p {
  font-size: 0.95rem;
  color: var(--text-secondary);
  line-height: 1.7;
}

/* ---- ABOUT: Values Grid ---- */

.av-values-section {
  position: relative;
  z-index: 1;
  padding: 6rem 5%;
  max-width: 1200px;
  margin: 0 auto;
}

.av-values-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.av-value-card {
  background: rgba(13, 13, 16, 0.4);
  backdrop-filter: blur(12px);
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
  padding: 2.5rem 2rem;
  text-align: center;
  transition: transform 0.4s, border-color 0.4s, box-shadow 0.4s;
}

.av-value-card:hover {
  transform: translateY(-6px);
  border-color: var(--card-color);
  box-shadow: 0 15px 40px -10px var(--card-color);
}

.av-value-icon {
  width: 56px; height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border-subtle);
  border-radius: 16px;
  margin-bottom: 1.5rem;
}

.av-value-card h3 {
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.8rem;
  font-family: var(--font-main);
}

.av-value-card p {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ---- ABOUT: Timeline ---- */

.av-timeline-section {
  position: relative;
  z-index: 1;
  padding: 6rem 5%;
  max-width: 800px;
  margin: 0 auto;
}

.av-timeline {
  display: flex;
  flex-direction: column;
  position: relative;
}

.av-timeline-item {
  display: flex;
  gap: 2rem;
  position: relative;
  padding-bottom: 3rem;
}

.av-timeline-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.av-timeline-num {
  width: 48px; height: 48px;
  min-width: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--border-strong);
  border-radius: 50%;
  font-weight: 800;
  font-size: 0.85rem;
  color: var(--text-muted);
  background: var(--bg-base);
  z-index: 2;
  font-family: var(--font-main);
}

.av-timeline-active .av-timeline-num {
  border-color: var(--accent-gold);
  color: var(--accent-gold);
  box-shadow: 0 0 20px rgba(212, 175, 55, 0.15);
}

.av-timeline-connector {
  width: 1.5px;
  flex: 1;
  background: linear-gradient(180deg, var(--border-strong), transparent);
  margin-top: 8px;
}

.av-timeline-content h3 {
  font-size: 1.3rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.6rem;
  font-family: var(--font-main);
}

.av-timeline-content p {
  font-size: 0.95rem;
  color: var(--text-secondary);
  line-height: 1.7;
  margin-bottom: 1rem;
}

.av-timeline-badge-active {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: var(--color-emerald);
  padding: 5px 14px;
  border: 1px solid rgba(16, 185, 129, 0.3);
  border-radius: 20px;
  background: rgba(16, 185, 129, 0.06);
}

.av-timeline-badge-done {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--text-muted);
}

/* ---- PRIVACY: Legal Card ---- */

.av-legal-section {
  position: relative;
  z-index: 1;
  padding: 0 5% 8rem;
  max-width: 900px;
  margin: 0 auto;
}

.av-legal-card {
  background: rgba(13, 13, 16, 0.5);
  backdrop-filter: blur(16px);
  border: 1px solid var(--border-subtle);
  border-radius: 24px;
  padding: 3.5rem 3rem;
  position: relative;
  overflow: hidden;
}

.av-legal-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--color-emerald), transparent);
  opacity: 0.5;
}

.av-legal-intro {
  font-size: 1rem;
  color: var(--text-secondary);
  line-height: 1.7;
  margin-bottom: 2.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--border-subtle);
}

.av-legal-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 3rem 0 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border-subtle);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 2px;
  color: var(--text-muted);
}

.av-legal-block {
  margin-bottom: 2rem;
}

.av-legal-block h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.8rem;
  font-family: var(--font-main);
}

.av-legal-block p {
  font-size: 0.95rem;
  color: var(--text-secondary);
  line-height: 1.7;
  margin-bottom: 0.5rem;
}

.av-legal-block ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  margin-top: 0.5rem;
}

.av-legal-block li {
  font-size: 0.93rem;
  color: var(--text-secondary);
  line-height: 1.6;
  padding-left: 1.5rem;
  position: relative;
}

.av-legal-block li::before {
  content: '✦';
  position: absolute;
  left: 0;
  color: var(--accent-gold);
  font-size: 0.6rem;
  top: 4px;
}

.av-legal-block strong {
  color: #fff;
}

.av-legal-contact a {
  color: var(--accent-gold);
  text-decoration: none;
  transition: opacity 0.2s;
}

.av-legal-contact a:hover { opacity: 0.8; }

/* ---- RESPONSIVE: All Pages ---- */

@media (max-width: 900px) {
  .av-pillars { grid-template-columns: 1fr; }
  .av-dual-section { grid-template-columns: 1fr; }
  .av-values-grid { grid-template-columns: 1fr; }
  .av-tech-grid { grid-template-columns: 1fr; }
  .av-legal-card { padding: 2.5rem 1.5rem; }
}

@media (max-width: 600px) {
  .av-page-hero { padding: 9rem 5% 3rem; }
}

/* Footer */

.footer { background: var(--bg-surface); border-top: 1px solid var(--border-subtle); padding: 8rem 5% 4rem; margin-top: 10rem; }

.footer-content { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; gap: 4rem; flex-wrap: wrap; }

.footer-links-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4rem; }

.footer-column { display: flex; flex-direction: column; gap: 1.2rem; }

.footer-column h4 { color: var(--text-primary); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 2rem; }

.footer-column a { color: var(--text-secondary); text-decoration: none; font-size: 0.9rem; }

.footer-column a:hover { color: #8B5CF6; }

.footer-bottom { max-width: 1200px; margin: 4rem auto 0; padding-top: 2rem; border-top: 1px solid var(--border-subtle); display: flex; justify-content: space-between; font-size: 0.8rem; color: var(--text-muted); }

/* Animations */

.wl-fade-in { animation: wl-fade-in 0.8s ease-out both; }

.wl-fade-in-up { animation: wl-fade-in-up 0.8s ease-out both; }

@keyframes wl-fade-in { from { opacity: 0; } to { opacity: 1; } }

@keyframes wl-fade-in-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }

/* Waitlist Refined Styles */

.wl-page { padding: 8rem 5% 0; min-height: 100vh; display: flex; flex-direction: column; align-items: center; position: relative; overflow-y: auto; overflow-x: hidden; }

.wl-starfield { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }

.wl-nebula { position: fixed; pointer-events: none; z-index: 0; }

.wl-nebula-1 { width: 800px; height: 800px; background: radial-gradient(circle, rgba(139, 92, 246, 0.1) 0%, transparent 70%); top: -20%; left: -10%; filter: blur(80px); border-radius: 50%; }

.wl-nebula-2 { width: 600px; height: 600px; background: radial-gradient(circle, rgba(34, 211, 238, 0.08) 0%, transparent 70%); bottom: -10%; right: -10%; filter: blur(80px); border-radius: 50%; }

.wl-nebula-3 { width: 500px; height: 500px; background: radial-gradient(circle, rgba(245, 158, 11, 0.05) 0%, transparent 70%); top: 40%; left: 40%; filter: blur(80px); border-radius: 50%; }

.wl-content { position: relative; z-index: 10; display: flex; align-items: center; justify-content: space-between; max-width: 1200px; width: 100%; gap: 4rem; min-height: 70vh; margin-bottom: 5rem; }

.wl-editorial { flex: 1; max-width: 600px; }

.wl-headline { font-size: clamp(2.5rem, 6vw, 4rem); font-weight: 800; margin: 1.5rem 0; line-height: 1.1; }

.wl-badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; background: var(--bg-elevated); border: 1px solid var(--border-strong); border-radius: 30px; font-size: 0.75rem; font-weight: 700; letter-spacing: 1px; color: var(--text-muted); }

.wl-badge-dot { width: 6px; height: 6px; background: var(--color-moon); border-radius: 50%; box-shadow: 0 0 8px var(--color-moon); }

.wl-stats { display: flex; align-items: center; gap: 2rem; margin-top: 3rem; }

.wl-stat { display: flex; flex-direction: column; gap: 4px; }

.wl-stat-number { font-size: 1.5rem; font-weight: 800; color: #fff; }

.wl-stat-label { font-size: 0.8rem; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 1px; }

.wl-stat-divider { width: 1px; height: 40px; background: var(--border-strong); }

.wl-card { flex: 0.8; position: relative; }

.wl-card-glow { position: absolute; top: -20px; left: -20px; right: -20px; bottom: -20px; background: radial-gradient(circle at center, rgba(212, 175, 55, 0.15), transparent 70%); filter: blur(40px); z-index: 0; pointer-events: none; }

.wl-card-inner { position: relative; background: rgba(13, 13, 16, 0.7); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border: 1px solid var(--border-strong); border-radius: 24px; padding: 3rem; width: 100%; z-index: 1; box-shadow: 0 20px 40px rgba(0,0,0,0.5); overflow: hidden; }

.wl-card-inner::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--color-sun), transparent); opacity: 0.5; }

.wl-card-header { margin-bottom: 2rem; text-align: center; }

.wl-card-logo { width: 40px; height: 40px; margin-bottom: 1.5rem; }

.wl-card-title { font-size: 1.8rem; font-weight: 700; margin-bottom: 0.5rem; }

.wl-card-subtitle { color: var(--text-secondary); font-size: 0.95rem; }

.wl-form { display: flex; flex-direction: column; gap: 1rem; }

.wl-input-wrapper { background: rgba(0, 0, 0, 0.5); border: 1px solid var(--border-subtle); border-radius: 12px; display: flex; align-items: center; transition: border-color 0.2s, box-shadow 0.2s; }

.wl-input-wrapper:focus-within { border-color: var(--color-sun); box-shadow: 0 0 15px rgba(245, 158, 11, 0.2); }

.wl-input { background: transparent; border: none; color: #fff; padding: 1.2rem 1rem; width: 100%; outline: none; font-size: 1rem; }

.wl-submit { position: relative; width: 100%; background: #fff; color: #000; padding: 1.2rem; border-radius: 12px; font-weight: 700; font-size: 1rem; cursor: pointer; border: none; overflow: hidden; transition: transform 0.2s; }

.wl-submit:hover { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(255,255,255,0.1); }

.wl-submit-shimmer { position: absolute; top: 0; left: -100%; width: 50%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent); animation: sl-shimmer 2.5s infinite; transform: skewX(-20deg); }

.wl-trust { display: flex; justify-content: center; gap: 1.5rem; margin-top: 1.5rem; font-size: 0.8rem; color: var(--text-muted); }

/* Success State */

.wl-success-container { position: relative; z-index: 10; display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 500px; padding: 4rem; background: rgba(13, 13, 16, 0.4); border: 1px solid var(--border-strong); border-radius: 24px; backdrop-filter: blur(20px); }

.wl-success-ring { width: 80px; height: 80px; border-radius: 50%; border: 2px dashed var(--color-emerald); display: flex; align-items: center; justify-content: center; margin-bottom: 2rem; animation: wl-spin 10s linear infinite; }

.wl-success-logo { width: 40px; height: 40px; animation: wl-counter-spin 10s linear infinite; }

.wl-success-title { font-size: 2.5rem; font-weight: 800; margin: 1rem 0; }

.wl-badge-success { border-color: var(--color-emerald); color: var(--color-emerald); }

.wl-btn-ghost { background: transparent; border: 1px solid var(--border-strong); color: #fff; padding: 1rem 2rem; border-radius: 8px; font-weight: 600; cursor: pointer; transition: background 0.2s; }

.wl-btn-ghost:hover { background: rgba(255, 255, 255, 0.05); }

/* Animations */

@keyframes sl-shimmer { 100% { left: 200%; } }

@keyframes wl-spin { 100% { transform: rotate(360deg); } }

@keyframes wl-counter-spin { 100% { transform: rotate(-360deg); } }

/* Science & Ticker Sections */

.wl-science-section { width: 100%; max-width: 1200px; margin: 0 auto 10rem; padding: 0 5%; position: relative; z-index: 10; }

.wl-science-header { text-align: center; margin-bottom: 4rem; }

.wl-science-title { font-size: 2.5rem; margin-top: 1rem; }

.wl-science-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }

.wl-science-card { background: var(--bg-surface); border: 1px solid var(--border-subtle); padding: 2rem; border-radius: 20px; transition: border-color 0.3s; }

.wl-science-icon { font-size: 1.5rem; margin-bottom: 1rem; }

.wl-ticker { width: 100%; overflow: hidden; background: var(--bg-surface); border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); padding: 1.5rem 0; position: relative; z-index: 10; margin-top: 4rem; }

.wl-ticker-track { display: flex; white-space: nowrap; animation: wl-marquee 30s linear infinite; align-items: center; gap: 2rem; }

.wl-ticker-quote { font-size: 0.9rem; font-weight: 500; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 1px; }

.wl-ticker-star { color: var(--accent-gold); font-size: 0.8rem; }

@keyframes wl-marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

@media (max-width: 900px) {
  .wl-content { flex-direction: column; text-align: center; }
  .wl-editorial { display: flex; flex-direction: column; align-items: center; }
  .wl-science-grid { grid-template-columns: 1fr; }
}

/* ================= FEATURE DETAIL PAGES ================= */

.av-back-nav {
  position: absolute;
  top: 9rem;
  left: 5%;
  z-index: 100;
}

.av-back-link {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.85rem;
  font-weight: 600;
  transition: color 0.3s, transform 0.3s;
}

.av-back-link:hover {
  color: #fff;
  transform: translateX(-4px);
}

.av-feature-hero {
  padding: 12rem 5% 4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.av-feature-main-icon {
  margin: 2rem 0;
  filter: drop-shadow(0 0 20px currentColor);
}

.av-feature-content {
  padding: 0 5% 6rem;
  max-width: 900px;
  margin: 0 auto;
}

.av-desc-card {
  padding: 3rem;
  border-radius: 32px;
}

.av-large-desc {
  font-size: clamp(1.1rem, 2vw, 1.3rem);
  line-height: 1.8;
  color: var(--text-secondary);
}

.av-logic-section {
  padding: 6rem 5%;
  max-width: 1200px;
  margin: 0 auto;
}

.av-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: 4rem;
}

.av-step-card {
  background: rgba(13, 13, 16, 0.4);
  border: 1px solid var(--border-subtle);
  padding: 2.5rem;
  border-radius: 24px;
  position: relative;
  transition: transform 0.4s, border-color 0.4s;
}

.av-step-card:hover {
  transform: translateY(-8px);
  border-color: var(--border-strong);
}

.av-step-number {
  font-size: 0.75rem;
  font-weight: 800;
  color: var(--accent-gold);
  margin-bottom: 1.5rem;
  letter-spacing: 2px;
  font-family: var(--font-main);
}

.av-step-card h3 {
  font-size: 1.3rem;
  margin-bottom: 1rem;
  color: var(--text-primary);
}

.av-step-card p {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.7;
}

.av-science-deep {
  padding: 4rem 5% 8rem;
  max-width: 1000px;
  margin: 0 auto;
}

.av-science-card {
  padding: 3.5rem;
  border-radius: 32px;
}

.av-science-header {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 1.5rem;
}

.av-science-header h3 {
  font-size: 1.5rem;
  color: var(--text-primary);
}

.av-science-card p {
  font-size: 1.05rem;
  color: var(--text-secondary);
  line-height: 1.8;
  margin-bottom: 2rem;
}

.av-benefits-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.av-benefit-tag {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border-subtle);
  padding: 8px 16px;
  border-radius: 30px;
  font-size: 0.85rem;
  color: #fff;
  font-weight: 600;
}

.av-bottom-cta {
  padding: 0 5% 10rem;
  max-width: 1200px;
  margin: 0 auto;
}

.av-cta-glass {
  background: rgba(212, 175, 55, 0.05);
  backdrop-filter: blur(24px);
  border: 1px solid rgba(212, 175, 55, 0.2);
  padding: 6rem 2rem;
  border-radius: 40px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.av-cta-glass h2 {
  font-size: clamp(2rem, 5vw, 3rem);
  color: var(--text-primary);
}

.av-cta-glass p {
  font-size: 1.1rem;
  color: var(--text-secondary);
  max-width: 500px;
}

.av-feature-more {
  margin-top: auto;
  padding-top: 1.5rem;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--accent-gold);
  opacity: 0.6;
  transition: opacity 0.3s, transform 0.3s;
}

.av-feature-card:hover .av-feature-more {
  opacity: 1;
  transform: translateX(4px);
}

@media (max-width: 900px) {
  .av-steps-grid { grid-template-columns: 1fr; }
  .av-feature-hero { padding-top: 10rem; }
  .av-back-nav { top: 7rem; }
  .av-science-card, .av-desc-card { padding: 2rem 1.5rem; }
}

/* iOS Safari Zoom Fix */

input, select, textarea { font-size: 16px !important; }
.free-tools-page,
.free-tool-page {
  min-height: 100vh;
  padding: 0 5% 96px;
  color: #ffffff;
  background:
    radial-gradient(circle at 18% 14%, rgba(245, 158, 11, 0.15), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(99, 102, 241, 0.12), transparent 34%),
    linear-gradient(180deg, #030712 0%, #050510 58%, #080a16 100%);
  font-family: var(--font-main);
  position: relative;
  overflow: hidden;
}

.free-tools-page::before,
.free-tool-page::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.48) 1px, transparent 1.5px),
    radial-gradient(circle, rgba(125, 211, 252, 0.26) 1px, transparent 1.5px);
  background-size: 116px 116px, 178px 178px;
  background-position: 18px 28px, 64px 92px;
  opacity: 0.34;
  pointer-events: none;
}

.free-tools-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: calc(100% + 10%);
  margin-left: -5%;
  padding: 18px 5%;
  background: rgba(2, 6, 23, 0.88);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(28px);
  -webkit-backdrop-filter: blur(28px);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.24);
}

.free-tools-brand,
.free-tools-nav,
.free-tools-header-cta {
  position: relative;
  z-index: 1;
}

.free-tools-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #ffffff;
  text-decoration: none;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.25rem;
}

.free-tools-brand img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.free-tools-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
}

.free-tools-nav a {
  color: rgba(255, 255, 255, 0.74);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 800;
}

.free-tools-header-cta {
  justify-self: end;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 28px;
  color: #050510;
  background: linear-gradient(135deg, #F6C65B, #F59E0B);
  border-radius: 999px;
  text-decoration: none;
  font-weight: 900;
  box-shadow: 0 14px 34px rgba(245, 158, 11, 0.26);
}

.free-tools-hero,
.tool-hero {
  position: relative;
  z-index: 1;
  max-width: 1080px;
  margin: 0 auto 46px;
  padding-top: 86px;
  text-align: center;
}

.tool-hero {
  margin-bottom: 32px;
}

.tool-nav-row {
  max-width: 1180px;
  margin: 0 auto 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.tool-back {
  color: #f4c35f;
  font-weight: 900;
  text-decoration: none;
}

.tool-switcher {
  min-width: min(100%, 360px);
  display: grid;
  gap: 8px;
  text-align: left;
  color: #f4c35f;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  position: relative;
}

.tool-switcher > button {
  width: 100%;
  min-height: 52px;
  padding: 0 44px 0 18px;
  color: #ffffff;
  background:
    linear-gradient(45deg, transparent 50%, #f4c35f 50%) right 18px center / 8px 8px no-repeat,
    rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(246, 198, 91, 0.24);
  border-radius: 999px;
  font-size: 0.98rem;
  font-weight: 850;
  text-align: left;
  outline: none;
  cursor: pointer;
}

.tool-switcher-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 30;
  width: min(680px, calc(100vw - 40px));
  max-height: 420px;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 14px;
  background:
    radial-gradient(circle at 12% 0%, rgba(245, 158, 11, 0.2), transparent 30%),
    linear-gradient(145deg, rgba(2, 6, 23, 0.98), rgba(10, 16, 32, 0.98));
  border: 1px solid rgba(246, 198, 91, 0.24);
  border-radius: 20px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.42);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.tool-switcher-open .tool-switcher-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.tool-switcher-menu button {
  display: grid;
  gap: 3px;
  padding: 12px;
  color: #ffffff;
  text-align: left;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  cursor: pointer;
}

.tool-switcher-menu button.active,
.tool-switcher-menu button:hover {
  border-color: rgba(246, 198, 91, 0.38);
  background: rgba(255, 255, 255, 0.1);
}

.tool-switcher-menu strong {
  font-size: 0.92rem;
}

.tool-switcher-menu small {
  color: rgba(248, 250, 252, 0.58);
  font-size: 0.76rem;
  font-weight: 700;
}

.free-tools-hero p,
.tool-kicker {
  margin: 0 0 16px;
  color: #f4c35f;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.free-tools-hero h1,
.tool-hero h1 {
  max-width: 980px;
  margin: 0 auto;
  color: #ffffff;
  font-family: var(--font-display);
  font-size: clamp(3.1rem, 6.8vw, 6.2rem);
  line-height: 1.02;
  letter-spacing: -0.025em;
}

.free-tools-hero span,
.tool-hero > p:last-child {
  display: block;
  max-width: 720px;
  margin: 22px auto 0;
  color: rgba(248, 250, 252, 0.72);
  font-size: 1.08rem;
  line-height: 1.72;
}

.free-tools-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  max-width: 1240px;
  margin: 0 auto;
}

.free-tool-card,
.tool-calculator-card,
.tool-result-block,
.tool-blueprint-cta,
.tool-seo-copy {
  background: rgba(255, 255, 255, 0.075);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(18px);
}

.free-tool-card {
  min-height: 270px;
  padding: 28px;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.free-tool-card:hover {
  transform: translateY(-4px);
  border-color: rgba(246, 198, 91, 0.36);
  background: rgba(255, 255, 255, 0.105);
}

.tool-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 22px;
}

.tool-icon {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #07101e;
  background: linear-gradient(145deg, #f8cf72, #f1a20b);
  border-radius: 17px;
}

.tool-card-top span {
  color: #34d399;
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.free-tool-card h2 {
  margin: 0 0 10px;
  color: #ffffff;
  font-family: var(--font-main);
  font-size: 1.25rem;
}

.free-tool-card p,
.tool-seo-copy p {
  margin: 0;
  color: rgba(248, 250, 252, 0.64);
  line-height: 1.68;
}

.free-tool-card b {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  color: #f4c35f;
  font-size: 0.88rem;
}

.tool-workflow,
.tool-blueprint-cta,
.tool-seo-copy {
  position: relative;
  z-index: 1;
}

.tool-workflow {
  max-width: 1180px;
  margin: 0 auto 26px;
}

.tool-section-heading {
  max-width: 760px;
  margin: 0 auto 24px;
  text-align: center;
}

.tool-section-heading span,
.tool-result-block span,
.tool-blueprint-cta span {
  color: #f4c35f;
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.tool-section-heading h2,
.tool-result-block h2,
.tool-blueprint-cta h2 {
  margin: 10px 0 8px;
  color: #ffffff;
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.04;
}

.tool-section-heading p,
.tool-result-block p,
.tool-blueprint-cta p {
  margin: 0;
  color: rgba(248, 250, 252, 0.68);
  line-height: 1.72;
}

.tool-workflow-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.85fr);
  gap: 18px;
  align-items: stretch;
}

.tool-workflow-single {
  max-width: 860px;
  margin: 0 auto;
  grid-template-columns: 1fr;
}

.tool-calculator-card,
.tool-result-block {
  padding: 30px;
}

.tool-reading-card {
  background:
    radial-gradient(circle at 92% 10%, rgba(245, 158, 11, 0.2), transparent 30%),
    rgba(255, 255, 255, 0.08);
}

.tool-form {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.tool-form label {
  display: grid;
  gap: 8px;
  color: rgba(248, 250, 252, 0.88);
  font-size: 0.82rem;
  font-weight: 850;
}

.tool-form input {
  width: 100%;
  min-height: 52px;
  padding: 0 14px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  outline: none;
}

.tool-form input:focus {
  border-color: rgba(246, 198, 91, 0.52);
  box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.1);
}

.tool-form button {
  grid-column: 1 / -1;
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 8px;
  color: #07101e;
  background: linear-gradient(135deg, #f8cf72, #f1a20b);
  border: 0;
  border-radius: 999px;
  font-weight: 950;
  cursor: pointer;
  box-shadow: 0 16px 36px rgba(245, 158, 11, 0.2);
}

.tool-loader-state,
.tool-result-inline {
  min-height: 330px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.tool-loader-state span,
.tool-result-inline span {
  color: #f4c35f;
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.tool-loader-state h2,
.tool-result-inline h2 {
  margin: 18px 0 12px;
  max-width: 680px;
  color: #ffffff;
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 4vw, 3.4rem);
  line-height: 1.04;
}

.tool-loader-state p,
.tool-result-inline p {
  max-width: 680px;
  margin: 0;
  color: rgba(248, 250, 252, 0.68);
  line-height: 1.72;
}

.tool-result-inline button {
  min-height: 46px;
  margin-top: 24px;
  padding: 0 18px;
  color: rgba(248, 250, 252, 0.86);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  font-weight: 850;
  cursor: pointer;
}

.tool-loader-orbit {
  position: relative;
  width: 92px;
  height: 92px;
  margin-bottom: 24px;
  border: 1px solid rgba(246, 198, 91, 0.32);
  border-radius: 50%;
  animation: toolSpin 3.6s linear infinite;
}

.tool-loader-orbit i {
  position: absolute;
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: #f4c35f;
  box-shadow: 0 0 22px rgba(246, 198, 91, 0.75);
}

.tool-loader-orbit i:nth-child(1) { top: -5px; left: 40px; }
.tool-loader-orbit i:nth-child(2) { right: 5px; bottom: 14px; background: #a78bfa; }
.tool-loader-orbit i:nth-child(3) { left: 5px; bottom: 14px; background: #22d3ee; }

@keyframes toolSpin {
  to { transform: rotate(360deg); }
}

.tool-result-block {
  background:
    radial-gradient(circle at 90% 8%, rgba(245, 158, 11, 0.2), transparent 30%),
    rgba(255, 255, 255, 0.08);
}

.tool-result-block h2 {
  margin: 18px 0 12px;
}

.tool-blueprint-cta {
  max-width: 1180px;
  margin: 0 auto 34px;
  padding: 34px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 30px;
  background:
    radial-gradient(circle at 92% 12%, rgba(245, 158, 11, 0.2), transparent 28%),
    rgba(255, 255, 255, 0.075);
}

.tool-blueprint-cta button {
  min-height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 25px;
  color: #07101e;
  background: linear-gradient(135deg, #f8cf72, #f1a20b);
  border: 0;
  border-radius: 999px;
  font-weight: 950;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 18px 40px rgba(245, 158, 11, 0.22);
}

.tool-seo-copy {
  max-width: 920px;
  margin: 34px auto 0;
  padding: 34px;
}

.tool-seo-copy h2 {
  margin: 0 0 16px;
  color: #ffffff;
  font-family: var(--font-main);
  font-size: 1.35rem;
}

.tool-seo-copy p + p {
  margin-top: 14px;
}

@media (max-width: 980px) {
  .free-tools-header {
    grid-template-columns: 1fr auto;
  }

  .free-tools-nav {
    display: none;
  }

  .tool-workflow-grid,
  .tool-blueprint-cta {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .free-tools-page,
  .free-tool-page {
    padding: 0 20px 72px;
  }

  .free-tools-header {
    width: calc(100% + 40px);
    margin-left: -20px;
    padding: 14px 20px;
  }

  .free-tools-header-cta {
    min-height: 46px;
    padding: 0 18px;
    font-size: 0.88rem;
  }

  .free-tools-hero,
  .tool-hero {
    padding-top: 58px;
  }

  .tool-nav-row {
    display: grid;
    text-align: center;
  }

  .tool-switcher {
    text-align: center;
  }

  .tool-switcher-menu {
    left: 50%;
    right: auto;
    width: calc(100vw - 40px);
    grid-template-columns: 1fr;
    transform: translateX(-50%) translateY(8px);
  }

  .tool-switcher-open .tool-switcher-menu {
    transform: translateX(-50%) translateY(0);
  }

  .tool-form {
    grid-template-columns: 1fr;
  }

  .tool-calculator-card,
  .tool-result-block,
  .tool-blueprint-cta,
  .tool-seo-copy {
    padding: 24px;
  }

  .tool-blueprint-cta button {
    width: 100%;
  }
}
.premium-home {
  background: #050510;
  color: #E8E8F0;
  overflow: hidden;
}

.premium-hero {
  position: relative;
  min-height: calc(100vh - 96px);
  padding: 76px 5% 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(90deg, rgba(2, 6, 23, 0.98) 0%, rgba(2, 6, 23, 0.93) 48%, rgba(2, 6, 23, 0.84) 100%),
    radial-gradient(circle at 20% 22%, rgba(16, 185, 129, 0.16), transparent 28%),
    radial-gradient(circle at 78% 38%, rgba(245, 158, 11, 0.12), transparent 32%),
    #020617;
}

.starfield {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.95) 0 1px, transparent 1.2px),
    radial-gradient(circle, rgba(255, 255, 255, 0.45) 0 1px, transparent 1.1px),
    radial-gradient(circle, rgba(125, 211, 252, 0.45) 0 1px, transparent 1.2px);
  background-size: 82px 82px, 141px 141px, 233px 233px;
  background-position: 0 0, 24px 42px, 70px 18px;
  opacity: 0.34;
  pointer-events: none;
}

.premium-hero-inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  text-align: center;
}

.section-kicker,
.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.74rem;
  font-weight: 800;
}


.premium-hero-copy {
  color: #fff;
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 15px;
  margin-bottom: 24px;
  color: rgba(248, 250, 252, 0.86);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
}

.eyebrow span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2dd4bf;
  box-shadow: 0 0 16px rgba(45, 212, 191, 0.9);
}

.premium-hero h1 {
  margin: 0 auto;
  max-width: 980px;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(3.1rem, 5.8vw, 5.85rem);
  line-height: 1.04;
  letter-spacing: -0.025em;
}

.premium-hero h1 em {
  display: inline;
  font-style: normal;
  color: #f0bf69;
  text-shadow: 0 14px 44px rgba(212, 175, 55, 0.25);
}

.hero-subtitle {
  max-width: 720px;
  margin: 22px auto 0;
  color: rgba(248, 250, 252, 0.78);
  font-size: clamp(1.02rem, 1.25vw, 1.17rem);
  line-height: 1.68;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
  justify-content: center;
}

.hero-primary,
.hero-secondary,
.calculation-intro button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: none;
  cursor: pointer;
  font-family: var(--font-main);
  font-weight: 850;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.hero-primary {
  min-height: 58px;
  padding: 0 30px;
  color: #07101e;
  background: linear-gradient(135deg, #f8cf72 0%, #d99b2b 100%);
  border-radius: 999px;
  box-shadow: 0 18px 40px rgba(217, 155, 43, 0.24);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.hero-primary:hover,
.calculation-intro button:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(217, 155, 43, 0.32);
}

.hero-secondary {
  min-height: 58px;
  padding: 0 24px;
  color: rgba(248, 250, 252, 0.9);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 999px;
}

.hero-secondary:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 255, 255, 0.34);
}

.hero-review {
  max-width: 620px;
  margin: 28px auto 0;
  padding-top: 18px;
  border-top: 1px solid rgba(212, 175, 55, 0.42);
  border-left: 0;
}

.hero-stars {
  display: flex;
  justify-content: center;
  gap: 4px;
  color: #f8c45f;
  margin-bottom: 10px;
}

.hero-review p {
  margin: 0;
  color: rgba(248, 250, 252, 0.72);
  font-size: 1rem;
  line-height: 1.65;
}

.premium-strip {
  display: flex;
  gap: 40px;
  overflow: hidden;
  justify-content: center;
  padding: 20px 5%;
  color: #F59E0B;
  background: #0A0A1A;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  white-space: nowrap;
}

.premium-strip span {
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.brand-positioning-section {
  padding: 96px 5%;
  background:
    radial-gradient(circle at 18% 18%, rgba(139, 92, 246, 0.12), transparent 35%),
    radial-gradient(circle at 82% 34%, rgba(245, 158, 11, 0.08), transparent 35%),
    #050510;
}

.brand-positioning-section > .section-kicker,
.brand-positioning-header,
.positioning-card-grid,
.mechanism-panel,
.accuracy-strip {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
}

.brand-positioning-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 800px;
  margin: 0 auto 56px;
}

.brand-positioning-header h2,
.mechanism-copy h3 {
  margin: 0;
  color: #ffffff;
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 4.6vw, 4.4rem);
  line-height: 1.02;
  letter-spacing: -0.03em;
  text-align: center;
}

.brand-positioning-header p,
.mechanism-copy p {
  margin: 0;
  color: #9898B0;
  font-size: 1.08rem;
  line-height: 1.75;
  text-align: center;
}

.positioning-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.positioning-card {
  min-height: 260px;
  padding: 28px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(12px);
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.positioning-card:hover {
  transform: translateY(-4px);
  border-color: rgba(139, 92, 246, 0.3);
}

.positioning-card span,
.mechanism-card span {
  display: block;
  color: #F59E0B;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.positioning-card h3 {
  margin: 18px 0 12px;
  color: #ffffff;
  font-family: var(--font-main);
  font-size: 1.32rem;
  letter-spacing: -0.01em;
}

.positioning-card p {
  margin: 0;
  color: #9898B0;
  line-height: 1.68;
}

.mechanism-panel {
  display: grid;
  grid-template-columns: 0.78fr 1.22fr;
  gap: 36px;
  align-items: center;
  margin-top: 56px;
  padding: 44px;
  background: linear-gradient(145deg, #0A0A1A, #050510);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 28px;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.5);
}

.mechanism-copy {
  padding: 26px;
}

.mechanism-copy .section-kicker {
  color: #F59E0B;
}

.mechanism-copy h3 {
  color: #ffffff;
  font-size: clamp(2rem, 3.4vw, 3.25rem);
  text-align: left;
}

.mechanism-copy p {
  margin-top: 20px;
  color: #9898B0;
  text-align: left;
}

.mechanism-stack {
  display: grid;
  gap: 12px;
}

.mechanism-card {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  transition: border-color 0.3s ease;
}
.mechanism-card:hover {
  border-color: rgba(245, 158, 11, 0.25);
}

.mechanism-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: #07101e;
  background: linear-gradient(145deg, #f8cf72, #d99b2b);
  border-radius: 16px;
}

.mechanism-card h4 {
  margin: 6px 0 6px;
  color: #ffffff;
  font-family: var(--font-main);
  font-size: 1.08rem;
}

.mechanism-card p {
  margin: 0;
  color: #9898B0;
  line-height: 1.58;
}

.accuracy-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 36px;
  color: rgba(255, 255, 255, 0.7);
}

.accuracy-strip svg,
.accuracy-strip span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
}

.accuracy-strip span {
  padding: 6px 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9);
}

.calculation-section,
.blueprint-section,
.final-premium-cta {
  max-width: 1240px;
  margin: 0 auto;
  padding: 96px 5%;
}

.calculation-section {
  max-width: none;
  padding: 108px 5%;
  background:
    radial-gradient(circle at 78% 20%, rgba(245, 158, 11, 0.06), transparent 35%),
    radial-gradient(circle at 20% 80%, rgba(139, 92, 246, 0.08), transparent 35%),
    #050510;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.calculation-section > .section-kicker,
.calculation-section > .calculation-grid {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
}

.section-kicker {
  color: #F59E0B;
  margin-bottom: 16px;
  text-align: center;
  display: block;
}

.calculation-grid {
  display: grid;
  grid-template-columns: 0.84fr 1.16fr;
  gap: 58px;
  align-items: center;
}

.calculation-intro {
  position: relative;
}

.calculation-intro::before {
  content: '';
  display: block;
  width: 74px;
  height: 2px;
  margin-bottom: 28px;
  background: linear-gradient(90deg, #b87815, #2dd4bf, #a78bfa);
}

.calculation-intro h2,
.blueprint-copy h2,
.final-premium-cta h2 {
  margin: 0;
  color: #ffffff;
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 4.5vw, 4.2rem);
  line-height: 1.02;
  letter-spacing: -0.035em;
}

.calculation-intro p,
.blueprint-copy p,
.final-premium-cta p {
  margin: 22px 0 0;
  color: #9898B0;
  font-size: 1.08rem;
  line-height: 1.75;
}

.calculation-intro button {
  margin-top: 30px;
  min-height: 50px;
  padding: 0 22px;
  color: #07101e;
  background: #f1b23c;
  border-radius: 999px;
}

.calculation-panel {
  overflow: hidden;
  position: relative;
  padding: 24px;
  background: linear-gradient(145deg, #0A0A1A, #050510);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 30px;
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.45);
}

.calculation-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.55) 0 1px, transparent 1.2px),
    radial-gradient(circle, rgba(125, 211, 252, 0.35) 0 1px, transparent 1.1px);
  background-size: 72px 72px, 131px 131px;
  opacity: 0.12;
  pointer-events: none;
}

.calculation-panel-header {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 18px 20px 24px;
  color: rgba(248, 250, 252, 0.82);
}

.calculation-panel-header span {
  color: #F59E0B;
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.calculation-panel-header strong {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.86rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.calculation-row {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 18px;
  align-items: center;
  margin-bottom: 12px;
  padding: 24px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  backdrop-filter: blur(16px);
  transition: border-color 0.3s ease;
}
.calculation-row:hover {
  border-color: rgba(139, 92, 246, 0.25);
}

.calculation-row:last-child {
  margin-bottom: 0;
}

.row-number {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  color: #07101e;
  background: linear-gradient(145deg, #f8cf72, #d99b2b);
  border-radius: 50%;
  font-weight: 900;
  box-shadow: 0 12px 26px rgba(217, 155, 43, 0.22);
}

.calculation-row h3 {
  margin: 0 0 8px;
  color: #fff;
  font-family: var(--font-main);
  font-size: 1.08rem;
}

.calculation-row p {
  margin: 0;
  color: rgba(248, 250, 252, 0.68);
  line-height: 1.65;
}

.experience-section {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 5% 80px;
}

.experience-card,
.proof-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(12px);
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.experience-card:hover,
.proof-card:hover {
  transform: translateY(-4px);
  border-color: rgba(139, 92, 246, 0.25);
}

.experience-card {
  padding: 30px;
}

.experience-card svg {
  color: #F59E0B;
  margin-bottom: 18px;
}

.experience-card h3 {
  margin: 0 0 10px;
  font-family: var(--font-main);
  color: #ffffff;
  font-size: 1.2rem;
}

.experience-card p {
  margin: 0;
  color: #9898B0;
  line-height: 1.65;
}

.blueprint-section {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  align-items: center;
  gap: 54px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.blueprint-copy ul {
  display: grid;
  gap: 12px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}

.blueprint-copy li {
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 700;
}

.blueprint-copy li svg {
  color: #10b981;
  flex: 0 0 auto;
}

.blueprint-preview {
  min-height: 430px;
  position: relative;
}

.preview-cover,
.preview-page {
  position: absolute;
  border-radius: 22px;
  box-shadow: 0 28px 80px rgba(2, 6, 23, 0.2);
}

.preview-cover {
  inset: 0 auto auto 0;
  width: 54%;
  min-height: 410px;
  padding: 42px 34px;
  color: #fff;
  background:
    linear-gradient(145deg, rgba(2, 6, 23, 0.96), rgba(12, 17, 34, 0.95)),
    radial-gradient(circle at 30% 18%, rgba(212, 175, 55, 0.24), transparent 28%);
  border: 1px solid rgba(212, 175, 55, 0.36);
}

.preview-cover span,
.preview-page span {
  display: block;
  color: #f4c35f;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.72rem;
  font-weight: 850;
}

.preview-cover h3 {
  margin: 96px 0 0;
  max-width: 220px;
  font-family: var(--font-display);
  font-size: 2.7rem;
  line-height: 1.03;
  color: #fff;
}

.preview-lines {
  display: flex;
  gap: 12px;
  margin-top: 72px;
}

.preview-lines i {
  display: block;
  height: 3px;
  width: 52px;
  background: #f4c35f;
}

.preview-lines i:nth-child(2) {
  background: #2dd4bf;
}

.preview-lines i:nth-child(3) {
  background: #a78bfa;
}

.preview-page {
  right: 0;
  bottom: 0;
  width: 58%;
  min-height: 285px;
  padding: 34px;
  background: #0A0A1A;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.4);
}

.mini-bars {
  display: flex;
  align-items: end;
  gap: 12px;
  height: 96px;
  margin: 34px 0 22px;
}

.mini-bars b {
  display: block;
  width: 42px;
  background: #f4c35f;
  border-radius: 12px 12px 0 0;
}

.mini-bars b:nth-child(1) { height: 46px; background: #f97316; }
.mini-bars b:nth-child(2) { height: 76px; background: #2dd4bf; }
.mini-bars b:nth-child(3) { height: 60px; background: #a78bfa; }
.mini-bars b:nth-child(4) { height: 88px; background: #f4c35f; }

.preview-page p {
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.65;
}

.proof-section {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 5% 90px;
}

.proof-card {
  padding: 28px;
  text-align: center;
}

.proof-card strong {
  display: block;
  color: #ffffff;
  font-size: 2.4rem;
  line-height: 1;
  font-weight: 900;
}

.proof-card span {
  display: block;
  margin-top: 10px;
  color: #9898B0;
  font-weight: 700;
  font-size: 0.86rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.final-premium-cta {
  padding-top: 0;
  text-align: center;
}

.final-premium-cta > p {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.final-premium-cta .hero-primary {
  margin-top: 30px;
}

.security-row {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 16px;
  align-items: center;
  margin-bottom: 22px;
  color: #9898B0;
  font-size: 0.86rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

.security-row svg {
  color: #F59E0B;
}

@media (max-width: 1120px) {
  .premium-hero-inner,
  .calculation-grid,
  .blueprint-section,
  .brand-positioning-header,
  .mechanism-panel {
    grid-template-columns: 1fr;
  }

  .premium-hero-copy {
    max-width: 850px;
  }

  .premium-hero-copy {
    order: 1;
  }
}

@media (max-width: 840px) {
  .premium-hero {
    padding-top: 122px;
  }

  .premium-hero-copy {
    align-items: center;
  }

  .experience-section,
  .proof-section,
  .positioning-card-grid {
    grid-template-columns: 1fr 1fr;
  }

}

@media (max-width: 620px) {
  .premium-hero {
    min-height: auto;
    padding: 118px 20px 48px;
  }

  .premium-hero-copy {
    align-items: center;
  }

  .premium-hero h1 {
    font-size: clamp(2.7rem, 15vw, 4.2rem);
  }

  .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hero-primary,
  .hero-secondary {
    width: 100%;
  }

  .premium-strip {
    justify-content: flex-start;
    overflow-x: auto;
  }

  .calculation-section,
  .blueprint-section,
  .brand-positioning-section,
  .final-premium-cta {
    padding: 72px 20px;
  }

  .calculation-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .experience-section,
  .proof-section,
  .positioning-card-grid {
    grid-template-columns: 1fr;
    padding-left: 20px;
    padding-right: 20px;
  }

  .positioning-card-grid {
    padding-left: 0;
    padding-right: 0;
  }

  .mechanism-panel {
    padding: 16px;
  }

  .mechanism-copy {
    padding: 14px;
  }

  .mechanism-card {
    grid-template-columns: 1fr;
  }

  .blueprint-preview {
    min-height: 620px;
  }

  .preview-cover,
  .preview-page {
    position: relative;
    width: 100%;
  }

  .preview-page {
    margin-top: -40px;
  }
}

/* Final homepage theme overrides. Keep last so legacy dark rules do not win. */
.premium-home {
  background: #ffffff;
  color: #111827;
}

.premium-hero {
  min-height: calc(100vh - 76px);
  padding: 118px 5% 64px;
  align-items: center;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(250, 247, 255, 0.98) 54%, rgba(255, 255, 255, 1) 100%),
    radial-gradient(circle at 16% 18%, rgba(139, 92, 246, 0.13), transparent 32%),
    radial-gradient(circle at 88% 22%, rgba(245, 158, 11, 0.12), transparent 30%);
  border-bottom: 1px solid rgba(139, 92, 246, 0.10);
}

.starfield {
  background-image:
    radial-gradient(circle, rgba(139, 92, 246, 0.22) 0 1px, transparent 1.2px),
    radial-gradient(circle, rgba(245, 158, 11, 0.18) 0 1px, transparent 1.1px);
  background-size: 92px 92px, 164px 164px;
  background-position: 0 0, 32px 48px;
  opacity: 0.42;
}

.premium-hero-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  text-align: center;
  justify-items: center;
}

.premium-hero-copy {
  max-width: 920px;
  margin: 0 auto;
  align-items: center;
  color: #111827;
}

.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 18px;
  padding: 9px 13px;
  color: #6D28D9;
  background: rgba(139, 92, 246, 0.08);
  border: 1px solid rgba(139, 92, 246, 0.16);
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.premium-hero h1 {
  max-width: 900px;
  margin: 0 auto;
  color: #111827;
  font-size: clamp(3rem, 5.1vw, 5.2rem);
  line-height: 0.98;
  letter-spacing: -0.02em;
}

.hero-subtitle {
  max-width: 610px;
  margin: 24px auto 0;
  color: #4B5563;
  font-size: clamp(1.05rem, 1.4vw, 1.24rem);
  line-height: 1.62;
}

.hero-actions {
  justify-content: center;
  margin-top: 34px;
}

.hero-primary {
  color: #ffffff;
  background: linear-gradient(135deg, #8B5CF6 0%, #6D28D9 100%);
  box-shadow: 0 18px 40px rgba(109, 40, 217, 0.25);
}

.hero-primary:hover,
.calculation-intro button:hover {
  box-shadow: 0 22px 48px rgba(109, 40, 217, 0.32);
}

.hero-secondary {
  color: #312E81;
  background: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.20);
  box-shadow: 0 10px 30px rgba(17, 24, 39, 0.06);
}

.hero-secondary:hover {
  border-color: rgba(139, 92, 246, 0.42);
}

.hero-review {
  max-width: 560px;
  margin: 30px auto 0;
  border-top: 1px solid rgba(139, 92, 246, 0.18);
}

.hero-stars {
  justify-content: center;
  color: #F59E0B;
}

.hero-review p {
  color: #4B5563;
}

.hero-insight-panel {
  width: 100%;
  max-width: 440px;
  justify-self: end;
  padding: 24px;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(139, 92, 246, 0.16);
  border-radius: 28px;
  box-shadow: 0 34px 90px rgba(88, 28, 135, 0.16);
  backdrop-filter: blur(18px);
}

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

.hero-panel-header span {
  color: #6D28D9;
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hero-panel-header strong {
  color: #6B7280;
  font-size: 0.82rem;
  font-weight: 800;
}

.hero-chart-orbit {
  position: relative;
  min-height: 300px;
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(250, 247, 255, 0.94), rgba(255, 255, 255, 0.98)),
    radial-gradient(circle at 50% 50%, rgba(139, 92, 246, 0.16), transparent 42%);
  border: 1px solid rgba(139, 92, 246, 0.12);
  overflow: hidden;
}

.hero-chart-orbit::before,
.hero-chart-orbit::after,
.orbit-ring {
  content: '';
  position: absolute;
  border: 1px solid rgba(109, 40, 217, 0.16);
  border-radius: 50%;
}

.hero-chart-orbit::before {
  inset: 48px;
}

.hero-chart-orbit::after {
  inset: 86px;
  border-color: rgba(245, 158, 11, 0.24);
}

.orbit-ring-one {
  inset: 22px;
}

.orbit-ring-two {
  inset: 122px;
  background: rgba(139, 92, 246, 0.12);
  border-color: rgba(139, 92, 246, 0.28);
}

.planet-dot {
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.16);
}

.planet-sun { top: 54px; left: 72px; background: #F59E0B; }
.planet-moon { top: 92px; right: 78px; background: #A78BFA; }
.planet-venus { bottom: 70px; left: 92px; background: #F472B6; }
.planet-rising { right: 64px; bottom: 94px; background: #22D3EE; }

.hero-panel-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.hero-panel-list div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 14px;
  color: #111827;
  background: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.12);
  border-radius: 14px;
  font-weight: 800;
}

.hero-panel-list svg {
  color: #8B5CF6;
  flex: 0 0 auto;
}

.premium-strip {
  color: #6D28D9;
  background: #FAF7FF;
  border-top: 1px solid rgba(139, 92, 246, 0.10);
  border-bottom: 1px solid rgba(139, 92, 246, 0.10);
}

.brand-positioning-section,
.calculation-section {
  background: #ffffff;
  border-color: rgba(139, 92, 246, 0.10);
}

.brand-positioning-header h2,
.mechanism-copy h3,
.calculation-intro h2,
.blueprint-copy h2,
.final-premium-cta h2,
.positioning-card h3,
.mechanism-card h4,
.calculation-row h3,
.experience-card h3,
.proof-card strong {
  color: #111827;
}

.brand-positioning-header p,
.mechanism-copy p,
.positioning-card p,
.mechanism-card p,
.calculation-intro p,
.blueprint-copy p,
.final-premium-cta p,
.experience-card p,
.proof-card span {
  color: #4B5563;
}

.positioning-card,
.experience-card,
.proof-card {
  background: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.12);
  box-shadow: 0 18px 50px rgba(88, 28, 135, 0.08);
}

.mechanism-panel,
.calculation-panel {
  background: linear-gradient(145deg, #ffffff, #FAF7FF);
  border: 1px solid rgba(139, 92, 246, 0.14);
  box-shadow: 0 30px 90px rgba(88, 28, 135, 0.10);
}

.mechanism-card,
.calculation-row {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(139, 92, 246, 0.12);
}

.mechanism-icon,
.row-number,
.calculation-intro button {
  color: #ffffff;
  background: linear-gradient(135deg, #8B5CF6, #6D28D9);
}

.calculation-panel-header {
  color: #4B5563;
}

.calculation-panel-header strong,
.calculation-row p,
.preview-page p {
  color: #4B5563;
}

.accuracy-strip {
  color: #4B5563;
}

.accuracy-strip span {
  background: #ffffff;
  border-color: rgba(139, 92, 246, 0.14);
  color: #312E81;
}

.blueprint-section {
  border-top: 1px solid rgba(139, 92, 246, 0.10);
}

.blueprint-copy li {
  color: #111827;
}

.preview-page {
  background: #ffffff;
  border: 1px solid rgba(139, 92, 246, 0.14);
  box-shadow: 0 28px 80px rgba(88, 28, 135, 0.12);
}

.security-row {
  color: #4B5563;
}

@media (max-width: 1120px) {
  .premium-hero-inner {
    grid-template-columns: 1fr;
    max-width: 860px;
  }

  .premium-hero-copy {
    max-width: 760px;
  }

  .hero-insight-panel {
    justify-self: start;
    max-width: 620px;
  }
}

@media (max-width: 840px) {
  .premium-hero {
    padding-top: 116px;
  }
}

@media (max-width: 620px) {
  .premium-hero {
    padding: 104px 20px 44px;
  }

  .premium-hero h1 {
    font-size: clamp(2.45rem, 13vw, 3.7rem);
    line-height: 1.02;
  }

  .hero-actions {
    width: 100%;
  }

  .hero-insight-panel {
    padding: 16px;
    border-radius: 22px;
  }

  .hero-chart-orbit {
    min-height: 240px;
  }

  .hero-chart-orbit::before {
    inset: 36px;
  }

  .hero-chart-orbit::after {
    inset: 70px;
  }

  .orbit-ring-one {
    inset: 18px;
  }

  .orbit-ring-two {
    inset: 98px;
  }
}
/* ==========================================================================
   BASE STYLES & RESET
   ========================================================================== */

html { 
  background-color: #050510;
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

body { 
  background-color: #050510;
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
  -webkit-tap-highlight-color: transparent;
  overflow-x: hidden;
  overflow-y: visible;
  position: relative;
}

#root {
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.ob-container {
  position: relative;
  min-height: 100dvh;
  width: 100%;
  background: radial-gradient(ellipse at 50% 0%, #1a103d 0%, #0a0a1a 50%, #050510 100%);
  display: flex;
  flex-direction: column;
  color: #E8E8F0;
  font-family: 'Outfit', 'Inter', sans-serif;
  overflow-x: hidden;
  overflow-y: visible;
}

.ob-content-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  z-index: 1;
  padding: 20px 20px 120px;
  width: 100%;
  box-sizing: border-box;
}

.ob-content-inner {
  width: 100%;
  max-width: 440px;
  margin: 0 auto;
}

/* Step Animations */
.ob-step {
  animation: ob-fadeSlide 0.5s ease-out both;
}

@keyframes ob-fadeSlide {
  0% { opacity: 0; transform: translateY(16px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Tailwind CSS Utility Polyfills */
.flex {
  display: flex !important;
}
.flex-col {
  flex-direction: column !important;
}
.flex-1 {
  flex: 1 1 0% !important;
}
.items-center {
  align-items: center !important;
}
.justify-between {
  justify-content: space-between !important;
}
.justify-center {
  justify-content: center !important;
}
.relative {
  position: relative !important;
}
.w-full {
  width: 100% !important;
}
.mb-2 {
  margin-bottom: 0.5rem !important;
}
.mt-4 {
  margin-top: 1rem !important;
}
.mt-6 {
  margin-top: 1.5rem !important;
}
.text-center {
  text-align: center !important;
}
.opacity-30 {
  opacity: 0.3 !important;
}
/* --- GAMIFIED WIZARD V3 --- */
.ob-wizard-container {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 60px 24px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100dvh;
  box-sizing: border-box;
  position: relative;
}

.ob-wizard-progress-header {
  position: absolute;
  top: 40px;
  left: 24px;
  right: 24px;
}

.ob-progress-info {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 12px;
}

.ob-progress-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: #86868b;
  text-transform: uppercase;
}

.ob-progress-percentage {
  font-size: 11px;
  font-weight: 700;
  color: #000000;
}

.ob-progress-bar-container {
  width: 100%;
  height: 4px;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 100px;
  overflow: hidden;
}

.ob-progress-bar-fill {
  height: 100%;
  background: #8B5CF6;
  border-radius: 100px;
  transition: width 1s cubic-bezier(0.65, 0, 0.35, 1);
}

.ob-wizard-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
}

@media (min-width: 768px) {
  .ob-wizard-step {
    margin-top: 20px; /* Offset for header presence only on desktop */
  }
}

.ob-wizard-title {
  font-size: clamp(2rem, 10vw, 2.5rem);
  font-weight: 700;
  color: #E8E8F0;
  line-height: 1.1;
  margin-bottom: 24px;
  letter-spacing: -0.03em;
  max-width: 100%;
}

.ob-wizard-subtitle {
  font-size: 17px;
  color: #9898B0;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: -0.01em;
  max-width: 400px;
  margin: 0 auto;
}

.ob-input-container-v3 {
  width: 100%;
  max-width: 400px;
  margin: 32px auto 48px;
  position: relative;
}

.ob-input-massive {
  width: 100%;
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(139, 92, 246, 0.25) !important;
  border-radius: 20px !important;
  padding: 22px 20px !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #E8E8F0 !important;
  text-align: center !important;
  outline: none;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-sizing: border-box;
  display: block;
  margin: 0 auto;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-family: 'Outfit', sans-serif;
}

/* Deeper internal centering for date/time values */
input[type="date"].ob-input-massive::-webkit-date-and-time-value,
input[type="time"].ob-input-massive::-webkit-date-and-time-value {
  text-align: center !important;
  min-height: 1.2em;
  font-family: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Chrome/Safari desktop centering */
input[type="date"].ob-input-massive::-webkit-datetime-edit,
input[type="time"].ob-input-massive::-webkit-datetime-edit {
  display: flex;
  justify-content: center;
  width: 100%;
  text-align: center;
}

.ob-input-massive:focus {
  background: rgba(139, 92, 246, 0.08) !important;
  border-color: rgba(139, 92, 246, 0.6) !important;
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.12), 0 10px 40px rgba(139, 92, 246, 0.15);
  transform: translateY(-2px);
}

.ob-input-massive::placeholder {
  color: #86868b;
  opacity: 0.5;
}

.ob-wizard-footer {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ob-wizard-next-btn {
  background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 50%, #6D28D9 100%) !important;
  color: #ffffff !important;
  border: none;
  padding: 18px 32px;
  border-radius: 14px;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
  max-width: 400px;
  box-shadow: 0 8px 30px rgba(139, 92, 246, 0.35), 0 0 60px rgba(139, 92, 246, 0.1);
}

.ob-wizard-next-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #7C3AED 0%, #C026D3 100%) !important;
  transform: scale(1.02);
  box-shadow: 0 15px 30px rgba(139, 92, 246, 0.4);
}

.ob-wizard-next-btn:active:not(:disabled) {
  transform: scale(0.98);
}

.ob-wizard-next-btn:disabled {
  background: rgba(139, 92, 246, 0.15) !important;
  color: rgba(232, 232, 240, 0.3) !important;
  cursor: not-allowed;
  box-shadow: none;
}

.ob-wizard-back-btn {
  background: none;
  border: none;
  font-size: 11px;
  font-weight: 800;
  color: #9898B0;
  letter-spacing: 1.5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s;
  text-transform: uppercase;
}

.ob-wizard-back-btn:hover {
  color: #8B5CF6;
  transform: translateX(-4px);
}

.ob-encryption-v3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 32px;
  color: #86868b;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: -0.01em;
}

.ob-encryption-v3 span {
  opacity: 0.8;
}

.ob-wizard-encryption-text {
  display: none;
}

.ob-sun-reveal-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, #F59E0B, #D97706);
  color: #ffffff;
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 2.5px;
  margin-bottom: 30px;
  box-shadow: 0 10px 25px rgba(245, 158, 11, 0.4);
}

.ob-time-wizard-flex {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
}

.ob-checkbox-v3 {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
  color: #9898B0;
  user-select: none;
  padding: 12px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(139, 92, 246, 0.24);
  box-shadow: 0 10px 28px rgba(0,0,0,0.18);
}

.ob-checkbox-v3 input {
  accent-color: #8B5CF6;
  width: 22px;
  height: 22px;
}

.ob-results-overlay-v3 {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: rgba(10, 10, 26, 0.95);
  backdrop-filter: blur(16px);
  border-radius: 24px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.4);
  z-index: 1000;
  margin-top: 15px;
  overflow: hidden;
  border: 1px solid rgba(139, 92, 246, 0.3);
}

.ob-result-item-v3 {
  padding: 20px 25px;
  display: flex;
  align-items: center;
  gap: 18px;
  cursor: pointer;
  font-size: 16px;
  color: #E8E8F0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  transition: all 0.2s;
}

.ob-result-item-v3:hover {
  background: rgba(139, 92, 246, 0.15);
  color: #C084FC;
  padding-left: 35px;
}

.ob-location-confirmed {
  padding: 14px 24px;
  background: rgba(34, 197, 94, 0.1);
  border-radius: 14px;
  border: 1.5px solid rgba(34, 197, 94, 0.2);
}

.animate-fade-in {
  animation: fadeIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

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

.animate-bounce-subtle {
  animation: bounceSubtle 2.5s ease-in-out infinite;
}

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

.pulse-glow {
  animation: pulseGlow 2.5s infinite;
}

@keyframes pulseGlow {
  0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4); }
  70% { box-shadow: 0 0 0 20px rgba(139, 92, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}

.apple-v-gallery-section {
  max-width: 1000px;
  margin: 60px auto;
  padding: 40px 20px;
}

.apple-v-gallery-header {
  text-align: center;
  margin-bottom: 40px;
}

.apple-v-gallery-title {
  font-family: 'Cinzel', serif;
  font-size: 28px;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 12px;
}

.apple-v-gallery-subtitle {
  font-size: 16px;
  color: #86868b;
  max-width: 500px;
  margin: 0 auto;
}

.apple-v-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}

.apple-v-gallery-item {
  background: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.05);
  border: 1px solid rgba(0, 0, 0, 0.04);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
}

.apple-v-gallery-item:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.08);
}

.apple-v-gallery-img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: contain;
  background: #fbfbfd;
  padding: 20px;
}

.apple-v-gallery-label {
  padding: 16px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: #1d1d1f;
  background: #ffffff;
  border-top: 1px solid rgba(0,0,0,0.03);
}

@media (max-width: 768px) {
  .apple-v-gallery-grid {
    grid-template-columns: 1fr;
    max-width: 360px;
    margin: 0 auto;
  }
}

/* --- PRODUCT CAROUSEL --- */
.apple-v-carousel-section {
  max-width: 1000px;
  margin: 40px auto;
  padding: 0 20px;
}

.apple-v-carousel-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.apple-v-main-image-box {
  position: relative;
  width: 100%;
  max-width: 600px;
  aspect-ratio: 1 / 1;
  background: #ffffff;
  border-radius: 32px;
  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.04);
}

.apple-v-carousel-main-img {
  width: 90%;
  height: 90%;
  object-fit: contain;
  transition: opacity 0.3s ease;
}

.apple-v-carousel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  cursor: pointer;
  z-index: 10;
  color: #1d1d1f;
  transition: all 0.2s;
}

.apple-v-carousel-nav:hover {
  background: #ffffff;
  transform: translateY(-50%) scale(1.1);
}

.apple-v-carousel-nav.prev { left: 16px; }
.apple-v-carousel-nav.next { right: 16px; }

.apple-v-thumbnails {
  display: flex;
  gap: 12px;
  justify-content: center;
}

.apple-v-thumbnail {
  width: 64px;
  height: 64px;
  border-radius: 12px;
  overflow: hidden;
  border: 2px solid transparent;
  padding: 4px;
  background: #f5f5f7;
  cursor: pointer;
  transition: all 0.2s;
}

.apple-v-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.apple-v-thumbnail.active {
  border-color: #8B5CF6;
  background: #ffffff;
  box-shadow: 0 4px 12px rgba(139, 92, 246, 0.2);
}

@media (max-width: 768px) {
  .apple-v-main-image-box {
    border-radius: 24px;
    max-width: 400px;
  }
  .apple-v-carousel-nav {
    width: 40px;
    height: 40px;
  }
}

/* Personalization Questions Page (Apple-Level Light Theme) */
.ob-questions-page {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  color: #111827;
  padding: 0 16px;
}

.ob-questions-container {
  background: #ffffff;
}

.ob-q-block {
  background: #ffffff;
  border-radius: 20px;
  padding: 24px;
  margin-bottom: 20px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.ob-q-label {
  display: block;
  font-size: 1.1rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.ob-q-opt-btn {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  padding: 16px;
  border-radius: 16px;
  color: #4b5563;
  font-weight: 600;
  font-size: 0.95rem;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  text-align: center;
  cursor: pointer;
  font-family: inherit;
  box-shadow: 0 2px 4px rgba(0,0,0,0.01);
}

.ob-q-opt-btn:hover {
  background: #f3f4f6;
  border-color: #d1d5db;
  color: #111827;
  transform: translateY(-1px);
}

.ob-q-opt-btn.active {
  background: rgba(139, 92, 246, 0.08);
  border-color: #8B5CF6;
  color: #8B5CF6;
  box-shadow: 0 4px 15px rgba(139, 92, 246, 0.15);
}

.ob-q-range {
  -webkit-appearance: none;
  width: 100%;
  height: 8px;
  background: #e5e7eb;
  border-radius: 8px;
  outline: none;
  margin: 20px 0;
}

.ob-q-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 28px;
  height: 28px;
  background: #ffffff;
  border: 3px solid #8B5CF6;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(139, 92, 246, 0.3);
  transition: transform 0.1s;
}

.ob-q-range::-webkit-slider-thumb:active {
  transform: scale(1.1);
}

.ob-q-textarea {
  width: 100%;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 16px;
  color: #111827;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  resize: none;
  transition: all 0.25s ease;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
}

.ob-skip-btn-v3 {
  position: absolute;
  top: 2rem;
  right: 2rem;
  background: #8B5CF6;
  color: white;
  border: none;
  padding: 10px 24px;
  border-radius: 50px;
  font-weight: 800;
  font-size: 0.9rem;
  letter-spacing: 1.5px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
  z-index: 100;
}

.ob-skip-btn-v3:hover {
  background: #7c3aed;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4);
}

.ob-skip-btn-v3:active {
  transform: translateY(0);
}

@media (max-width: 768px) {
  .ob-skip-btn-v3 {
    top: 1.5rem;
    right: 1.5rem;
    padding: 8px 20px;
    font-size: 0.8rem;
  }
}
/* ==========================================================================
   COMPONENTS (LOADERS, SPINNERS, ETC.)
   ========================================================================== */

/* --- SACRED APPLE LOADER (Ultra-Premium) --- */
.sacred-loader-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 400px;
  width: 100%;
  position: relative;
}

.sacred-orbit-wrapper {
  position: relative;
  width: 220px;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(139, 92, 246, 0.03) 0%, transparent 70%);
}

.sacred-svg-loader {
  overflow: visible;
  filter: drop-shadow(0 0 12px rgba(139, 92, 246, 0.15));
}

.sacred-star-center {
  animation: apple-star-breathe 4s cubic-bezier(0.65, 0, 0.35, 1) infinite;
  transform-origin: 110px 110px;
}

.sacred-apple-ring-outer {
  stroke: rgba(139, 92, 246, 0.1);
  stroke-width: 0.5;
  animation: apple-rotate 12s linear infinite;
  transform-origin: 110px 110px;
}

.sacred-apple-ring-inner {
  stroke: rgba(139, 92, 246, 0.2);
  stroke-width: 1;
  animation: apple-rotate 8s linear infinite reverse;
  transform-origin: 110px 110px;
}

.sacred-planet {
  fill: #8B5CF6;
  filter: blur(0.5px);
  animation: apple-planet-glow 3s ease-in-out infinite;
}

.sacred-loader-text {
  margin-top: 48px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: #E8E8F0;
  opacity: 0.4;
  animation: apple-text-pulse 3s ease-in-out infinite;
  font-family: 'Outfit', sans-serif;
}

@keyframes apple-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes apple-star-breathe {
  0%, 100% { transform: scale(1); opacity: 0.7; filter: blur(0px); }
  50% { transform: scale(1.4); opacity: 1; filter: blur(1px); }
}

@keyframes apple-planet-glow {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.2); }
}

@keyframes apple-text-pulse {
  0%, 100% { opacity: 0.3; transform: translateY(0); }
  50% { opacity: 0.6; transform: translateY(-2px); }
}

.sacred-glass-ring {
  fill: none;
  stroke: rgba(255, 255, 255, 0.03);
  stroke-width: 0.25;
}

/* --- CANONICAL SPINNER --- */
.ob-standard-loader-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: clamp(34px, 6vw, 52px) clamp(24px, 5vw, 44px);
  min-height: 360px;
  width: min(100%, 520px);
  margin: 0 auto;
  border-radius: 34px;
  border: 1px solid rgba(124, 58, 237, 0.16);
  background:
    radial-gradient(circle at 18% 10%, rgba(139, 92, 246, 0.14), transparent 34%),
    radial-gradient(circle at 78% 18%, rgba(192, 132, 252, 0.12), transparent 34%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.98), rgba(250, 248, 255, 0.96));
  box-shadow: 0 34px 90px rgba(76, 29, 149, 0.14), inset 0 1px 0 rgba(255,255,255,0.92);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  overflow: hidden;
  position: relative;
}

.ob-standard-loader-container::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(124,58,237,0.22) 1px, transparent 1.5px),
    radial-gradient(circle, rgba(192,132,252,0.14) 1px, transparent 1.5px);
  background-position: 20px 18px, 76px 68px;
  background-size: 96px 96px, 148px 148px;
  opacity: 0.28;
  pointer-events: none;
}

.ob-standard-loader-container > * {
  position: relative;
  z-index: 1;
}

.ob-loader-kicker {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.24em;
  color: #7c3aed;
  text-transform: uppercase;
}

.ob-loader-stage {
  display: grid;
  place-items: center;
  width: 168px;
  height: 168px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(124,58,237,0.08), transparent 64%);
}

.ob-loader-orbit {
  position: relative;
  width: 148px;
  height: 148px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ob-loader-glow {
  position: absolute;
  inset: 24px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.28), rgba(192, 132, 252, 0.18) 44%, transparent 70%);
  filter: blur(14px);
  animation: ob-loader-breathe 2.6s ease-in-out infinite;
}

.ob-loader-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px solid rgba(124,58,237,0.12);
}

.ob-loader-ring-one {
  inset: 8px;
  border-top-color: #8b5cf6;
  border-right-color: rgba(139,92,246,0.55);
  animation: ob-spin-canonical 5.5s linear infinite;
}

.ob-loader-ring-two {
  inset: 24px;
  border-left-color: #8b5cf6;
  border-bottom-color: rgba(139,92,246,0.6);
  animation: ob-spin-canonical 3.8s linear infinite reverse;
}

.ob-loader-ring-three {
  inset: 42px;
  border-top-color: rgba(124,58,237,0.42);
  border-right-color: rgba(192,132,252,0.30);
  animation: ob-spin-canonical 2.7s linear infinite;
}

.ob-spinner {
  width: 22px;
  height: 22px;
  border: 3px solid rgba(139, 92, 246, 0.18);
  border-top-color: #c084fc;
  border-right-color: #8b5cf6;
  border-radius: 50%;
  animation: ob-spin-canonical 0.9s linear infinite;
}

.ob-loader-core {
  position: absolute;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: radial-gradient(circle at 35% 28%, #ffffff, #c4b5fd 38%, #7c3aed 100%);
  box-shadow: 0 0 28px rgba(139,92,246,0.36), 0 0 55px rgba(192,132,252,0.22);
  animation: ob-loader-pulse 1.8s ease-in-out infinite;
  z-index: 3;
}

.ob-loader-planet {
  position: absolute;
  border-radius: 999px;
  z-index: 4;
}

.ob-loader-planet-one {
  width: 9px;
  height: 9px;
  background: #7c3aed;
  box-shadow: 0 0 15px rgba(124,58,237,0.55);
  animation: ob-loader-planet-one 3.8s linear infinite;
}

.ob-loader-planet-two {
  width: 7px;
  height: 7px;
  background: #c4b5fd;
  box-shadow: 0 0 14px rgba(196,181,253,0.8);
  animation: ob-loader-planet-two 5.4s linear infinite;
}

@keyframes ob-spin-canonical {
  to { transform: rotate(360deg); }
}

@keyframes ob-loader-pulse {
  0%, 100% { transform: scale(0.9); opacity: 0.85; }
  50% { transform: scale(1.2); opacity: 1; }
}

@keyframes ob-loader-breathe {
  0%, 100% { transform: scale(0.92); opacity: 0.55; }
  50% { transform: scale(1.08); opacity: 1; }
}

@keyframes ob-loader-planet-one {
  from { transform: rotate(0deg) translateX(62px) rotate(0deg); }
  to { transform: rotate(360deg) translateX(62px) rotate(-360deg); }
}

@keyframes ob-loader-planet-two {
  from { transform: rotate(160deg) translateX(48px) rotate(-160deg); }
  to { transform: rotate(520deg) translateX(48px) rotate(-520deg); }
}

.ob-loader-text {
  margin: 0;
  text-align: center;
  font-size: clamp(1.05rem, 2.4vw, 1.28rem);
  line-height: 1.55;
  font-weight: 900;
  color: #111827;
  max-width: 26rem;
}

.ob-loader-progress {
  width: min(100%, 320px);
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(124,58,237,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.82);
}

.ob-loader-progress span {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ede9fe, #a855f7, #6d28d9);
  animation: ob-loader-progress 2.4s ease-in-out infinite;
}

.ob-loader-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: 28rem;
}

.ob-loader-steps span {
  padding: 7px 10px;
  border: 1px solid rgba(124,58,237,0.12);
  border-radius: 999px;
  background: rgba(124,58,237,0.06);
  color: #6d28d9;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@keyframes ob-loader-progress {
  0% { transform: translateX(-110%); }
  50% { transform: translateX(70%); }
  100% { transform: translateX(250%); }
}
/* ==========================================================================
   READING REVEAL & SALES PAGE (SACRED VOID THEME)
   ========================================================================== */

.ob-reading-reveal-white {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    text-align: left;
    font-family: 'Outfit', sans-serif;
    color: #E8E8F0;
}

.rrw-free-reading-intro {
    text-align: center;
    margin: 10px auto 32px;
}

.rrw-free-reading-title {
    font-size: 32px;
    line-height: 1.08;
    font-weight: 900;
    color: #F8FAFC;
    margin: 8px 0 12px;
}

.rrw-free-reading-copy {
    font-size: 15px;
    line-height: 1.6;
    color: #9898B0;
    max-width: 460px;
    margin: 0 auto;
}

.rrw-archetype-section {
    text-align: center;
    margin-bottom: 40px;
}

.rrw-verified-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(16, 185, 129, 0.15);
    color: #10B981;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    margin-bottom: 24px;
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.rrw-label {
    font-size: 11px;
    font-weight: 800;
    color: #9898B0;
    letter-spacing: 2px;
    margin-bottom: 12px;
}

.rrw-archetype-name {
    font-size: 36px;
    font-weight: 900;
    background: linear-gradient(135deg, #C084FC 0%, #8B5CF6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 16px;
    line-height: 1.1;
}

.rrw-archetype-desc {
    font-size: 16px;
    color: #9898B0;
    line-height: 1.6;
}

.rrw-card {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
    border-radius: 24px;
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid rgba(139, 92, 246, 0.2);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.rrw-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
    margin-bottom: 16px;
    padding: 6px 12px;
    border-radius: 8px;
}

.rrw-card-badge.mask {
    background: rgba(245, 158, 11, 0.1);
    color: #D97706;
}

.rrw-card-badge.shadow {
    background: rgba(239, 68, 68, 0.1);
    color: #DC2626;
}

.rrw-card-body {
    font-size: 16px;
    line-height: 1.7;
    color: #E8E8F0;
}

.rrw-card-body.italic {
    font-style: italic;
}

.rrw-scanner {
    text-align: center;
    margin: 32px 0;
    color: #6B7280;
    font-size: 12px;
    font-family: monospace;
    font-weight: 600;
    letter-spacing: 1px;
}

.rrw-scanner-bar {
    height: 2px;
    background: linear-gradient(90deg, transparent, #EF4444, transparent);
    margin-bottom: 12px;
    animation: rrw-scan 1.5s ease-in-out infinite;
}

@keyframes rrw-scan {
    0% { transform: scaleX(0.1); opacity: 0; }
    50% { transform: scaleX(1); opacity: 1; }
    100% { transform: scaleX(0.1); opacity: 0; }
}

.rrw-critical-alert {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px dashed rgba(239, 68, 68, 0.2);
    color: #DC2626;
    font-size: 13px;
    font-weight: 600;
}

.rrw-tipping-point {
    background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
    padding: 32px 24px;
    border-radius: 20px;
    margin-top: 32px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.1);
}

.rrw-tipping-point h3 {
    font-size: 18px;
    font-weight: 800;
    color: #E8E8F0;
    margin-bottom: 12px;
}

.rrw-tipping-point p {
    font-size: 15px;
    line-height: 1.6;
    color: #9898B0;
}

.sp-white-page {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    font-family: 'Outfit', sans-serif;
    color: #E8E8F0;
    background: transparent;
    padding-bottom: 80px;
}

/* Toast Popup */
.sp-purchase-toast {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(15, 10, 30, 0.9);
    backdrop-filter: blur(10px);
    padding: 10px 16px;
    border-radius: 30px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(139, 92, 246, 0.3);
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 9999;
    width: auto;
    min-width: 280px;
    max-width: 90%;
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
}

.sp-toast-show {
    transform: translate(-50%, 0);
    opacity: 1;
}

.sp-toast-hide {
    transform: translate(-50%, -150%);
    opacity: 0;
}

.sp-toast-dot {
    width: 8px;
    height: 8px;
    background: #10B981;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.5);
}

.sp-purchase-toast p {
    font-size: 13px;
    color: #E8E8F0;
    line-height: 1.4;
    margin: 0;
}

/* Hero Section */
.sp-hero {
    text-align: center;
    padding: 40px 20px;
}

.sp-campaign-confirmation {
    display: inline-flex;
    margin: 0 auto 18px;
    padding: 9px 14px;
    border: 1px solid rgba(124, 58, 237, 0.24);
    border-radius: 999px;
    background: #f5f3ff;
    color: #6d28d9;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
}

.sp-hero-headline {
    font-size: clamp(2rem, 8vw, 2.5rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.03em;
    margin-bottom: 24px;
    color: #E8E8F0;
}

.sp-purple-text {
    color: #8B5CF6;
}

.sp-hero-sub {
    font-size: 16px;
    line-height: 1.6;
    color: #9898B0;
    margin-bottom: 36px;
}

.sp-hero-cta {
    width: 100%;
    background: #8B5CF6;
    color: white;
    border: none;
    border-radius: 16px;
    padding: 20px;
    font-size: 18px;
    font-weight: 800;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    box-shadow: 0 15px 30px rgba(139, 92, 246, 0.3);
    transition: transform 0.2s;
    margin-bottom: 16px;
}

.sp-hero-cta:active {
    transform: scale(0.98);
}

.sp-hero-micro {
    font-size: 12px;
    color: #9898B0;
    font-weight: 500;
}

/* We Know You Proof Section */
.sp-proof-section {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 24px;
    padding: 32px 24px;
    margin: 20px;
}

.sp-proof-badge {
    display: inline-block;
    background: #8B5CF6;
    color: #fff;
    font-size: 10px;
    font-family: monospace;
    font-weight: 800;
    padding: 4px 12px;
    border-radius: 6px;
    letter-spacing: 1.5px;
    margin-bottom: 16px;
}

.sp-proof-title {
    font-size: 24px;
    font-weight: 800;
    margin-bottom: 12px;
    color: #E8E8F0;
}

.sp-proof-sub {
    font-size: 15px;
    color: #9898B0;
    line-height: 1.6;
    margin-bottom: 24px;
}

.sp-proof-grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sp-proof-item {
    background: rgba(255, 255, 255, 0.05);
    padding: 16px;
    border-radius: 16px;
    display: flex;
    gap: 16px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.sp-proof-icon {
    color: #8B5CF6;
    flex-shrink: 0;
}

.sp-proof-label {
    font-size: 10px;
    font-weight: 800;
    color: #8B5CF6;
    letter-spacing: 1px;
    display: block;
    margin-bottom: 4px;
}

.sp-proof-val {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #E8E8F0;
}

.sp-proof-text {
    font-size: 13px;
    color: #9898B0;
    line-height: 1.5;
}

.sp-proof-footer {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.1);
    display: flex;
    gap: 12px;
}

.sp-alert-icon {
    color: #EF4444;
    flex-shrink: 0;
}

.sp-alert-text {
    font-size: 14px;
    font-style: italic;
    color: #9898B0;
    line-height: 1.5;
}

/* Conflict & Solution Sections */
.sp-conflict-section, .sp-solution-section {
    padding: 40px 20px;
}

.sp-section-title {
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 16px;
    color: #E8E8F0;
}

.sp-section-sub {
    font-size: 16px;
    line-height: 1.6;
    color: #9898B0;
    margin-bottom: 24px;
}

.sp-conflict-card {
    background: rgba(239, 68, 68, 0.05);
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: 20px;
    padding: 24px;
    margin-bottom: 24px;
}

.sp-conflict-label {
    font-size: 11px;
    font-weight: 800;
    color: #F87171;
    letter-spacing: 1.5px;
    display: block;
    margin-bottom: 12px;
}

.sp-conflict-body {
    font-size: 16px;
    line-height: 1.6;
    color: #E8E8F0;
}

.sp-conflict-quote {
    border-left: 3px solid #8B5CF6;
    padding-left: 16px;
    font-style: italic;
    font-size: 18px;
    color: #E8E8F0;
}

.sp-solution-feature {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 20px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* Solution Carousel */
.sp-carousel-container {
    position: relative;
    margin: 32px 0;
    width: 100%;
    overflow: hidden;
}

.sp-carousel-track {
    display: flex;
    gap: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    border-radius: 24px;
}

.sp-carousel-track::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

.sp-carousel-image {
    width: 100%;
    height: 590px;
    flex-shrink: 0;
    scroll-snap-align: center;
    border-radius: 24px;
    box-shadow: 0 24px 70px rgba(24, 18, 46, 0.18);
    border: 1px solid rgba(255,255,255,0.1);
    object-fit: contain;
    background: #050510;
    padding: 28px;
    box-sizing: border-box;
}

.sp-carousel-slide {
    width: 100%;
    height: 590px;
    flex-shrink: 0;
    scroll-snap-align: center;
    border-radius: 24px;
    box-shadow: 0 24px 70px rgba(24, 18, 46, 0.18);
    border: 1px solid rgba(255,255,255,0.1);
    background:
      radial-gradient(circle at 50% 42%, rgba(139, 92, 246, 0.32), transparent 34%),
      linear-gradient(180deg, #fbfaff 0%, #f3edff 100%);
    padding: 34px 28px 24px;
    box-sizing: border-box;
}

.sp-device-showcase {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}

.sp-device-showcase-img {
    width: min(88%, 760px);
    max-height: 455px;
    object-fit: contain;
    border-radius: 18px;
    box-shadow:
      0 34px 80px rgba(86, 54, 150, 0.34),
      0 10px 28px rgba(12, 10, 24, 0.22);
}

.sp-device-showcase-caption {
    margin: 18px 0 0;
    text-align: center;
    font-size: 13px;
    color: rgba(77, 58, 127, 0.72);
    letter-spacing: 0.06em;
    font-weight: 700;
}

.sp-carousel-nav {
    position: absolute;
    top: 50%;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border: 1px solid rgba(118, 82, 214, 0.18);
    border-radius: 999px;
    color: #15111f;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 18px 42px rgba(25, 18, 45, 0.18);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.sp-carousel-nav:hover {
    background: #ffffff;
    box-shadow: 0 22px 52px rgba(25, 18, 45, 0.24);
    transform: translateY(-50%) scale(1.04);
}

.sp-carousel-nav-prev {
    left: 18px;
}

.sp-carousel-nav-next {
    right: 18px;
}

.sp-personalized-shot {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 0.85fr);
    gap: 18px;
    align-items: center;
    height: 100%;
}

.sp-phone-frame {
    position: relative;
    width: min(100%, 220px);
    margin: 0 auto;
    padding: 10px;
    border-radius: 38px;
    background: linear-gradient(145deg, #262138 0%, #0B0B12 100%);
    box-shadow:
      0 18px 40px rgba(0, 0, 0, 0.42),
      inset 0 1px 0 rgba(255,255,255,0.12);
}

.sp-phone-notch {
    position: absolute;
    top: 11px;
    left: 50%;
    transform: translateX(-50%);
    width: 88px;
    height: 18px;
    border-radius: 999px;
    background: rgba(4, 4, 9, 0.96);
    z-index: 2;
}

.sp-phone-screen {
    position: relative;
    overflow: hidden;
    border-radius: 30px;
    min-height: 380px;
    background:
      radial-gradient(circle at top, rgba(192, 132, 252, 0.24), transparent 30%),
      linear-gradient(180deg, #17112E 0%, #080712 100%);
    padding: 36px 16px 18px;
    border: 1px solid rgba(255,255,255,0.06);
}

.sp-screen-glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 18%, rgba(192,132,252,0.18), transparent 36%);
    pointer-events: none;
}

.sp-screen-meta {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 16px;
    text-align: center;
    color: rgba(245,243,255,0.9);
    font-size: 11px;
    letter-spacing: 0.04em;
    font-weight: 600;
}

.sp-blueprint-card-wrap {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 190px;
    margin: 0 auto;
    filter: drop-shadow(0 22px 28px rgba(0,0,0,0.45));
}

.sp-blueprint-card-svg {
    width: 100%;
    height: auto;
    display: block;
}

.sp-phone-footer-note {
    position: relative;
    z-index: 1;
    margin-top: 14px;
    text-align: center;
    color: rgba(232,232,240,0.62);
    font-size: 11px;
    line-height: 1.45;
}

.sp-book-preview-shot {
    display: flex;
    align-items: center;
    justify-content: center;
}

.sp-book-preview-shot .sp-phone-frame {
    width: min(100%, 360px);
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    perspective: 1100px;
}

.sp-book-preview-shot .sp-phone-notch,
.sp-book-preview-shot .sp-screen-meta,
.sp-book-preview-shot .sp-phone-footer-note,
.sp-book-preview-shot .sp-shot-copy {
    display: none;
}

.sp-book-preview-shot .sp-phone-screen {
    min-height: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
}

.sp-book-preview-shot .sp-blueprint-card-wrap {
    max-width: 310px;
    transform: rotateY(-18deg) rotateX(4deg);
    transform-style: preserve-3d;
    filter: drop-shadow(34px 34px 28px rgba(0,0,0,0.42));
    animation: sp-book-hover 6s ease-in-out infinite;
}

.sp-book-preview-shot .sp-blueprint-card-wrap::before {
    content: '';
    position: absolute;
    top: 4%;
    right: -12%;
    width: 18%;
    height: 92%;
    background: linear-gradient(90deg, #f9f7ff 0%, #b6a4dd 100%);
    transform: skewY(8deg);
    border-radius: 0 16px 16px 0;
    box-shadow: inset 8px 0 12px rgba(65, 43, 114, 0.24);
    z-index: -1;
}

.sp-book-preview-shot .sp-blueprint-card-wrap::after {
    content: '';
    position: absolute;
    inset: 5% 2% 5% 8%;
    border-radius: 22px 6px 6px 22px;
    background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,0.22) 42%, transparent 58%);
    mix-blend-mode: screen;
    pointer-events: none;
}

@keyframes sp-book-hover {
    0%, 100% { transform: rotateY(-18deg) rotateX(4deg) translateY(0); }
    50% { transform: rotateY(-14deg) rotateX(5deg) translateY(-8px); }
}

.sp-book-preview-shot .sp-blueprint-card-svg {
    border-radius: 20px 8px 8px 20px;
}

.sp-book-preview-shot .sp-blueprint-card-svg rect:last-of-type,
.sp-book-preview-shot .sp-blueprint-card-svg text:nth-of-type(n+4) {
    display: none;
}

.sp-shot-copy {
    align-self: center;
}

.sp-shot-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(192,132,252,0.12);
    border: 1px solid rgba(192,132,252,0.18);
    color: #D8B4FE;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.14em;
    margin-bottom: 12px;
}

.sp-shot-copy h4 {
    margin: 0 0 10px;
    color: #F5F3FF;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
}

.sp-shot-copy p {
    margin: 0;
    color: #B5B2C8;
    font-size: 14px;
    line-height: 1.6;
}

.sp-carousel-hint {
    text-align: center;
    font-size: 12px;
    color: #9898B0;
    font-weight: 500;
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.sp-carousel-hint::before,
.sp-carousel-hint::after {
    content: '';
    display: block;
    width: 24px;
    height: 1px;
    background: rgba(255,255,255,0.1);
}

.sp-included-section {
    display: grid;
    gap: 22px;
    margin: 28px 0;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    background:
      radial-gradient(circle at 92% 0%, rgba(245, 158, 11, 0.13), transparent 34%),
      rgba(255, 255, 255, 0.035);
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
}

.sp-included-header {
    display: grid;
    gap: 8px;
}

.sp-included-header h3 {
    margin: 0;
    color: #E8E8F0;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(1.85rem, 4vw, 3rem);
    line-height: 1.03;
    letter-spacing: 0;
}

.sp-included-header p {
    margin: 0;
    max-width: 660px;
    color: #9898B0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.65;
}

.sp-chapter-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.sp-chapter-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 14px 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.045);
    color: #E8E8F0;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
}

.sp-chapter-number {
    color: #F6C65B;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.08em;
}

.sp-chapter-item svg {
    color: #6EE7B7;
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .sp-product-card {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 20px;
    }

    .sp-product-price {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .sp-carousel-container {
        margin: 24px -4px;
    }

    .sp-carousel-slide {
        padding: 18px 14px 16px;
        height: auto;
        min-height: 390px;
    }

    .sp-carousel-image {
        height: 390px;
        padding: 16px;
        border-radius: 20px;
    }

    .sp-device-showcase-img {
        width: min(96%, 420px);
        max-height: 300px;
        border-radius: 14px;
    }

    .sp-device-showcase-caption {
        margin-top: 12px;
        font-size: 11px;
    }

    .sp-carousel-nav {
        width: 42px;
        height: 42px;
    }

    .sp-carousel-nav-prev {
        left: 10px;
    }

    .sp-carousel-nav-next {
        right: 10px;
    }

    .sp-personalized-shot {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .sp-phone-frame {
        width: min(100%, 214px);
    }

    .sp-shot-copy {
        text-align: center;
    }

    .sp-shot-copy h4 {
        font-size: 18px;
    }

    .sp-included-section {
        padding: 18px;
        border-radius: 20px;
    }

    .sp-chapter-list {
        grid-template-columns: 1fr;
    }

    .sp-chapter-item {
        min-height: 54px;
    }
}

.sp-solution-icon {
    color: #8B5CF6;
    margin-bottom: 16px;
}

.sp-solution-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #E8E8F0;
}

.sp-solution-text {
    font-size: 15px;
    color: #9898B0;
    line-height: 1.6;
}

/* Urgency Card */
.sp-urgency-card {
    margin: 20px;
    background: rgba(17, 24, 39, 0.6);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(239, 68, 68, 0.2);
    color: #fff;
    border-radius: 24px;
    padding: 32px 24px;
    text-align: center;
}

.sp-urgency-icon {
    color: #EF4444;
    margin: 0 auto 16px;
}

.sp-urgency-title {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 12px;
}

.sp-urgency-text {
    font-size: 15px;
    color: #D1D5DB;
    line-height: 1.6;
    margin-bottom: 20px;
}

.sp-urgency-footer {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    color: #F87171;
    background: rgba(239, 68, 68, 0.1);
    padding: 8px;
    border-radius: 8px;
}

/* Features Section */
.sp-features-section {
    padding: 40px 20px;
}

.sp-section-heading-block {
    text-align: center;
    display: grid;
    gap: 10px;
    margin-bottom: 28px;
}

.sp-section-kicker {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.18em;
    color: #A78BFA;
}

.sp-section-heading {
    margin: 0;
    color: #F5F3FF;
    font-size: 26px;
    line-height: 1.14;
    font-weight: 850;
}

.sp-features-header {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #9898B0;
    text-align: center;
    margin-bottom: 32px;
}

.sp-features-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sp-feature-item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    min-height: 108px;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    box-sizing: border-box;
}

.sp-feature-icon {
    width: 48px;
    height: 48px;
    background: rgba(139, 92, 246, 0.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #A78BF0;
    border: 1px solid rgba(139, 92, 246, 0.15);
}

.sp-feature-name {
    display: block;
    font-size: 16px;
    color: #E8E8F0;
    margin-bottom: 4px;
    font-weight: 700;
}

.sp-feature-desc {
    font-size: 14px;
    color: #9898B0;
    line-height: 1.5;
}

/* Transformation Grid */
.sp-transform-grid {
    padding: 20px;
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
}

.sp-transform-card {
    position: relative;
    z-index: 0;
    padding: 24px;
    border-radius: 20px;
}

.sp-transform-card .sp-transform-list {
    gap: 10px;
}

.sp-before {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-right: 0;
    border-radius: 20px 0 0 20px;
}

.sp-after {
    background:
      radial-gradient(circle at top left, rgba(16, 185, 129, 0.22), transparent 34%),
      linear-gradient(135deg, rgba(6, 78, 59, 0.72), rgba(4, 47, 46, 0.56));
    color: #fff;
    box-shadow: 0 20px 48px rgba(16, 185, 129, 0.18), inset 0 1px 0 rgba(255,255,255,0.12);
    border: 1px solid rgba(16, 185, 129, 0.38);
    border-left: 0;
    border-radius: 0 20px 20px 0;
}

.sp-transform-grid::before {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 50%;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(139, 92, 246, 0.34), transparent);
    transform: translateX(-50%);
    z-index: 1;
}

.sp-transform-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.sp-before .sp-transform-label {
    color: #9898B0;
}

.sp-after .sp-transform-label {
    color: #6EE7B7;
    text-shadow: 0 0 18px rgba(110, 231, 183, 0.55);
}

.sp-transform-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    font-size: 14px;
    line-height: 1.5;
}

.sp-before .sp-transform-list {
    color: #9898B0;
}

.sp-after .sp-transform-list {
    color: #ECFDF5;
}

.sp-check {
    display: inline-block;
    color: #6EE7B7;
    margin-right: 8px;
    vertical-align: middle;
    filter: drop-shadow(0 0 8px rgba(110, 231, 183, 0.55));
}

@media (max-width: 640px) {
    .sp-transform-grid {
        grid-template-columns: 1fr;
    }

    .sp-transform-grid::before {
        top: 50%;
        bottom: auto;
        left: 20px;
        right: 20px;
        width: auto;
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.34), transparent);
        transform: translateY(-50%);
    }

    .sp-before {
        border-right: 1px solid rgba(255, 255, 255, 0.05);
        border-bottom: 0;
        border-radius: 20px 20px 0 0;
    }

    .sp-after {
        border-left: 1px solid rgba(16, 185, 129, 0.38);
        border-top: 0;
        border-radius: 0 0 20px 20px;
    }
}

/* Process Steps */
.sp-process-section {
    padding: 40px 20px;
    background: rgba(255, 255, 255, 0.02);
}

.sp-process-steps {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.sp-process-step {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    box-sizing: border-box;
}

.sp-step-num {
    width: 32px;
    height: 32px;
    background: #8B5CF6;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 14px;
    flex-shrink: 0;
}

.sp-step-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 4px;
    color: #E8E8F0;
}

.sp-step-desc {
    font-size: 14px;
    color: #9898B0;
    line-height: 1.5;
}

/* Testimonials */
.sp-testimonials {
    padding: 56px 0;
    overflow: hidden;
}

.sp-testimonials .ob-carousel-track {
    animation-duration: 24s !important;
    animation-play-state: running !important;
}

.sp-testimonials .ob-carousel-track:hover,
.sp-testimonials .ob-carousel-track:active,
.sp-testimonials .ob-carousel-track-wrapper:hover .ob-carousel-track {
    animation-play-state: running !important;
}

.sp-review-heading {
    width: min(100%, 900px);
    margin: 0 auto 24px;
    padding: 0 20px;
    text-align: center;
}

.sp-review-heading .sp-features-header {
    margin: 10px auto 10px;
    max-width: 760px;
    color: #111827;
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.sp-review-heading p {
    max-width: 640px;
    margin: 0 auto;
    color: #5f5a7a;
    font-size: 15px;
    line-height: 1.65;
    font-weight: 600;
}

.sp-testimonial-card {
    width: 340px;
    background: #ffffff;
    border: 1px solid rgba(93, 70, 149, 0.12);
    border-radius: 18px;
    padding: 14px 14px 20px;
    flex-shrink: 0;
    box-shadow: 0 16px 38px rgba(76, 29, 149, 0.08);
}

.sp-testimonial-photo {
    width: 100%;
    aspect-ratio: 4 / 5;
    display: block;
    object-fit: cover;
    object-position: center;
    border-radius: 12px;
    margin-bottom: 16px;
    background: #f4f0ff;
    box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.06);
}

.sp-testimonial-profile {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    padding: 0 6px;
}

.sp-testimonial-avatar,
.sp-testimonial-initial {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    box-shadow: 0 6px 18px rgba(17, 24, 39, 0.16);
    background: linear-gradient(135deg, #111827, #6d28d9);
}

.sp-testimonial-avatar {
    object-fit: cover;
}

.sp-testimonial-initial {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 18px;
    font-weight: 900;
}

.sp-stars {
    display: flex;
    gap: 2px;
    margin-bottom: 12px;
    padding: 0 6px;
}

.sp-testimonial-text {
    font-size: 14px;
    color: #1f2937;
    line-height: 1.6;
    font-style: italic;
    margin: 0 6px 16px;
}

.sp-testimonial-author {
    font-size: 13px;
    font-weight: 800;
    color: #111827;
}

.sp-testimonial-location {
    margin-top: 3px;
    font-size: 12px;
    font-weight: 700;
    color: #7c728f;
}

.sp-verified-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #059669;
    margin: 0 6px;
}

.sp-verified {
    color: inherit;
    font-weight: 500;
    font-size: 11px;
}

/* Checkout Section */
.sp-checkout-section {
    padding: 40px 20px;
    background: transparent;
}

/* Pricing Section V2 */
.sp-pricing-container {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(16px);
    border-radius: 24px;
    padding: 32px 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.2);
    margin-bottom: 40px;
}

.sp-pricing-header-v2 {
    text-align: center;
    margin-bottom: 32px;
}

.sp-pricing-title {
    font-size: 24px;
    font-weight: 800;
    color: #E8E8F0;
    margin: 12px 0;
}

.sp-pricing-subtitle {
    max-width: 720px;
    margin: 0 auto 14px;
    color: #B5B2C8;
    font-size: 16px;
    line-height: 1.65;
    font-weight: 600;
}

.sp-timer-pill-v2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(239, 68, 68, 0.1);
    color: #F87171;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
}

/* Checkout + FAQ polish */
.sp-offer-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(139, 92, 246, 0.12);
    border: 1px solid rgba(139, 92, 246, 0.24);
    color: #c4b5fd;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.sp-value-stack {
    display: grid;
    gap: 12px;
    margin-bottom: 24px;
}

.sp-product-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    padding: 22px 24px;
    border-radius: 22px;
    background:
      radial-gradient(circle at 90% 0%, rgba(245, 158, 11, 0.13), transparent 36%),
      rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.sp-product-card-bonus {
    border-color: rgba(16, 185, 129, 0.24);
    background:
      radial-gradient(circle at 88% 0%, rgba(16, 185, 129, 0.16), transparent 34%),
      rgba(255, 255, 255, 0.045);
}

.sp-product-label {
    display: inline-flex;
    width: fit-content;
    margin-bottom: 10px;
    padding: 7px 10px;
    border-radius: 999px;
    color: #FCD34D;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.24);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.sp-product-card-bonus .sp-product-label {
    color: #6EE7B7;
    background: rgba(16, 185, 129, 0.11);
    border-color: rgba(16, 185, 129, 0.24);
}

.sp-product-card h3 {
    margin: 0 0 8px;
    color: #FFFFFF;
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 3.8vw, 42px);
    line-height: 1;
    letter-spacing: -0.03em;
}

.sp-product-card p {
    margin: 0;
    max-width: 720px;
    color: #B5B2C8;
    font-size: 14px;
    line-height: 1.6;
    font-weight: 600;
}

.sp-product-price {
    min-width: 118px;
    padding: 16px 14px;
    border-radius: 18px;
    text-align: center;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.sp-product-price span {
    display: block;
    margin-bottom: 5px;
    color: #938eb2;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.sp-product-price strong {
    color: #FFFFFF;
    font-size: 22px;
    line-height: 1;
}

.sp-product-price-free {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.sp-product-price .sp-product-crossed-price {
    display: inline-block;
    margin: 0;
    color: #938eb2;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    text-decoration: line-through;
    text-decoration-thickness: 2px;
    text-decoration-color: #ef4444;
    letter-spacing: 0;
}

.sp-product-price .sp-product-free-now {
    display: inline-flex;
    margin: 0;
    padding: 5px 8px;
    border-radius: 999px;
    color: #047857;
    background: rgba(16, 185, 129, 0.14);
    border: 1px solid rgba(16, 185, 129, 0.28);
    font-size: 10px;
    font-weight: 950;
    line-height: 1;
    letter-spacing: 0.08em;
}

.sp-value-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.07);
    color: #ebe7ff;
    line-height: 1.5;
}

.sp-value-item span {
    color: inherit;
    font-weight: 700;
}

.sp-value-icon {
    color: #c084fc;
    flex-shrink: 0;
    margin-top: 2px;
}

/* ── 7-Day Money-Back Guarantee ── */
.sp-guarantee-badge {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    border-radius: 22px;
    background:
      radial-gradient(circle at 10% 0%, rgba(110, 231, 183, 0.18), transparent 40%),
      linear-gradient(135deg, rgba(6, 78, 59, 0.42), rgba(15, 23, 42, 0.72));
    border: 1px solid rgba(16, 185, 129, 0.36);
    box-shadow: 0 18px 40px rgba(16, 185, 129, 0.12), inset 0 1px 0 rgba(255,255,255,0.08);
    animation: sp-guarantee-glow 3s ease-in-out infinite alternate;
}

@keyframes sp-guarantee-glow {
    0% { box-shadow: 0 0 12px rgba(16, 185, 129, 0.04); }
    100% { box-shadow: 0 0 24px rgba(16, 185, 129, 0.10); }
}

.sp-guarantee-shield {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.24), rgba(6, 78, 59, 0.28));
    border: 1px solid rgba(110, 231, 183, 0.34);
    color: #A7F3D0;
    box-shadow: 0 0 22px rgba(16, 185, 129, 0.24);
}

.sp-guarantee-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sp-guarantee-title {
    font-size: 15px;
    font-weight: 800;
    color: #D1FAE5;
    letter-spacing: 0.01em;
    margin: 0;
}

.sp-guarantee-text {
    font-size: 13px;
    color: #C7F9E5;
    line-height: 1.5;
    margin: 0;
}

.sp-price-display-v2 {
    display: grid;
    gap: 18px;
    padding: 24px 20px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(17, 14, 39, 0.96), rgba(10, 10, 26, 0.92));
    border: 1px solid rgba(139, 92, 246, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.sp-price-labels {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.sp-original-price {
    color: #938eb2;
    text-decoration: line-through;
    text-decoration-color: rgba(248, 113, 113, 0.8);
    font-size: 14px;
    font-weight: 600;
}

.sp-current-price-label {
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.2);
    color: #6ee7b7;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.sp-coupon-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.2);
    color: #fcd34d;
    font-size: 11px;
    font-weight: 800;
}

.sp-savings-tag {
    justify-self: center;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.14);
    border: 1px solid rgba(16, 185, 129, 0.28);
    color: #6ee7b7;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sp-savings-pulse {
    animation: sp-savings-glow 1.8s ease-in-out infinite;
}

@keyframes sp-savings-glow {
    0%, 100% {
        box-shadow: 0 0 8px rgba(16, 185, 129, 0.15);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 22px rgba(16, 185, 129, 0.4), 0 0 44px rgba(16, 185, 129, 0.15);
        transform: scale(1.03);
    }
}

.sp-price-row-today-badge {
    justify-content: center !important;
}

.sp-today-only-inline {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.22);
    color: #fbbf24;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.sp-price-breakdown {
    display: grid;
    gap: 12px;
    padding-top: 6px;
}

.sp-price-row-v2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    color: #d7d3f1;
    font-size: 14px;
}

.sp-price-row-v2 strong {
    color: #ffffff;
    font-size: 15px;
}

.sp-price-row-discount strong {
    color: #86efac;
}

.sp-price-row-total {
    margin-top: 4px;
    padding: 14px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 15px;
}

.sp-price-row-total strong {
    color: #ffffff;
    font-size: 2rem;
    line-height: 1;
    letter-spacing: -0.03em;
}

.sp-coupon-section {
    display: grid;
    gap: 10px;
}

.sp-coupon-toggle {
    width: 100%;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px dashed rgba(139, 92, 246, 0.28);
    background: rgba(255, 255, 255, 0.03);
    color: #c4b5fd;
    font-weight: 700;
    cursor: pointer;
}

.sp-coupon-input-group {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
}

.sp-coupon-field {
    min-width: 0;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid rgba(139, 92, 246, 0.22);
    background: rgba(255, 255, 255, 0.05);
    color: #f5f3ff;
    font-size: 14px;
    outline: none;
}

.sp-coupon-field::placeholder {
    color: rgba(232, 232, 240, 0.4);
}

.sp-coupon-apply-btn {
    padding: 14px 16px;
    border: none;
    border-radius: 14px;
    background: linear-gradient(135deg, #8b5cf6, #c026d3);
    color: #ffffff;
    font-weight: 800;
    cursor: pointer;
}

.sp-coupon-apply-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.sp-coupon-error {
    margin: 0;
    color: #fca5a5;
    font-size: 13px;
    text-align: center;
}

.sp-checkout-divider-v2 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 24px 0 20px;
}

.sp-divider-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.25), transparent);
}

.sp-secure-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #a8a3c4;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.sp-stripe-container {
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

#payment-form {
    background: #ffffff;
    border: 1px solid rgba(124, 58, 237, 0.16);
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 18px 44px rgba(76, 29, 149, 0.1);
    color: #16122B;
}

#payment-form p,
#payment-form span {
    color: inherit;
}

#payment-form .ob-premium-cta {
    background: linear-gradient(135deg, #7C3AED 0%, #A855F7 52%, #14B8A6 100%);
    border-radius: 16px;
    box-shadow: 0 18px 34px rgba(124, 58, 237, 0.28), 0 0 0 1px rgba(255,255,255,0.16) inset;
    text-transform: none;
    letter-spacing: 0;
    font-size: 16px;
    min-height: 58px;
}

#payment-form .ob-premium-cta:hover {
    background: linear-gradient(135deg, #6D28D9 0%, #9333EA 52%, #0D9488 100%);
    transform: translateY(-2px);
}

#payment-form #button-text {
    color: #ffffff !important;
    justify-content: center;
}

.sp-loading-checkout {
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: 18px 0;
}

.sp-loading-checkout p {
    margin: 0;
    color: #c6c2df;
    font-size: 14px;
    font-weight: 600;
}

.sp-spinner {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    border: 3px solid rgba(139, 92, 246, 0.18);
    border-top-color: #c084fc;
    animation: sp-spin 0.9s linear infinite;
}

@keyframes sp-spin {
    to { transform: rotate(360deg); }
}

.sp-payment-methods-v2 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
    opacity: 0.9;
}

.sp-faq-section {
    padding: 24px 20px 8px;
    display: grid;
    gap: 14px;
}

.sp-faq-intro {
    text-align: center;
    display: grid;
    gap: 10px;
    margin-bottom: 8px;
}

.sp-faq-title {
    font-size: 1.75rem;
    line-height: 1.15;
    font-weight: 800;
    color: #f5f3ff;
    margin: 0;
}

.sp-faq-subtitle {
    margin: 0;
    color: #aaa4c7;
    font-size: 15px;
    line-height: 1.6;
}

.sp-faq-item {
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

.sp-faq-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 18px 18px;
    cursor: pointer;
}

.sp-faq-q {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #f5f3ff;
    font-weight: 700;
    line-height: 1.5;
}

.sp-faq-q svg {
    color: #c084fc;
    flex-shrink: 0;
    margin-top: 2px;
}

.sp-faq-arrow {
    color: #a8a3c4;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.sp-rotated {
    transform: rotate(90deg);
}

.sp-faq-body {
    padding: 0 18px 18px;
}

.sp-faq-body p {
    margin: 0;
    color: #bcb7d7;
    line-height: 1.7;
    font-size: 14px;
}

.sp-footer {
    padding: 28px 20px 0;
    text-align: center;
    color: #9d97ba;
    display: grid;
    gap: 8px;
}

.sp-footer-links {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
    color: #bcb7d7;
}

.sp-footer-links button {
    background: transparent;
    border: none;
    color: inherit;
    cursor: pointer;
    padding: 0;
    font: inherit;
}

.sp-footer p {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
}

.sp-email-link {
    color: #d8b4fe;
}

.sp-copyright {
    opacity: 0.75;
    padding-bottom: 12px;
}

@media (max-width: 520px) {
    .sp-pricing-container {
        padding: 24px 18px;
    }

    .sp-coupon-input-group {
        grid-template-columns: 1fr;
    }

    .sp-price-row-v2 {
        font-size: 13px;
    }
}

/* Oracelle premium sales-page refresh */
.ob-sales-reveal-container {
    width: 100%;
    background:
        radial-gradient(circle at 18% 4%, rgba(139, 92, 246, 0.18), transparent 28%),
        radial-gradient(circle at 82% 8%, rgba(192, 132, 252, 0.12), transparent 34%),
        linear-gradient(180deg, #050510 0%, #12122a 42%, #fbfaff 42%, #ffffff 100%);
}

.sp-white-page {
    max-width: none;
    color: #0f172a;
    background: transparent;
    padding-bottom: 96px;
    overflow: hidden;
}

.sp-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: min(100%, 1080px);
    margin: 0 auto;
    padding: clamp(4.5rem, 8vw, 7rem) 1.25rem clamp(3.25rem, 6vw, 5rem);
    color: #ffffff;
    isolation: isolate;
}

.sp-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image:
        radial-gradient(circle, rgba(255,255,255,0.45) 1px, transparent 1.5px),
        radial-gradient(circle, rgba(255,255,255,0.16) 1px, transparent 1.5px);
    background-position: 24px 14px, 78px 82px;
    background-size: 116px 116px, 174px 174px;
    opacity: 0.45;
    pointer-events: none;
}

.sp-hero::after {
    content: "Oracelle Blueprint";
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 1.1rem;
    padding: 0.48rem 0.8rem;
    border: 1px solid rgba(196,181,253,0.36);
    border-radius: 999px;
    background: rgba(255,255,255,0.07);
    color: #c4b5fd;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    backdrop-filter: blur(14px);
    order: -1;
}

.sp-hero-headline {
    max-width: 830px;
    margin: 0 auto 1.35rem;
    color: #ffffff;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(3rem, 7.2vw, 6.7rem);
    font-weight: 900;
    line-height: 0.96;
    letter-spacing: 0;
}

.sp-purple-text {
    color: #c4b5fd;
    text-shadow: 0 0 34px rgba(139,92,246,0.22);
}

.sp-hero-sub {
    max-width: 680px;
    margin: 0 auto 2rem;
    color: rgba(255,255,255,0.76);
    font-size: clamp(1rem, 1.7vw, 1.18rem);
    font-weight: 600;
    line-height: 1.75;
}

.sp-hero-cta {
    width: min(100%, 470px);
    min-height: 66px;
    margin: 0 auto 1rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #8b5cf6, #6d28d9);
    color: #ffffff;
    box-shadow: 0 22px 50px rgba(124,58,237,0.30), 0 0 0 1px rgba(255,255,255,0.08) inset;
    font-size: clamp(0.92rem, 2vw, 1.05rem);
    letter-spacing: 0.02em;
}

.sp-hero-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 28px 70px rgba(124,58,237,0.38), 0 0 0 1px rgba(255,255,255,0.12) inset;
}

.sp-hero-micro {
    max-width: 480px;
    margin: 0 auto;
    color: rgba(255,255,255,0.58);
    font-size: 0.86rem;
    font-weight: 800;
}

.sp-proof-section {
    position: relative;
    width: min(calc(100% - 2rem), 860px);
    margin: clamp(1rem, 4vw, 2.2rem) auto 3.5rem;
    padding: clamp(1.5rem, 4vw, 2.4rem);
    border: 1px solid rgba(124,58,237,0.18);
    border-radius: 30px;
    background:
        radial-gradient(circle at 92% 10%, rgba(139,92,246,0.12), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #fbfaff 100%);
    color: #0f172a;
    box-shadow: 0 32px 90px rgba(15,23,42,0.14);
}

.sp-proof-section::before {
    content: "";
    position: absolute;
    inset: 14px;
    border: 1px solid rgba(124,58,237,0.12);
    border-radius: 22px;
    pointer-events: none;
}

.sp-proof-badge {
    position: relative;
    background: #f5f3ff;
    color: #6d28d9;
    border: 1px solid rgba(124,58,237,0.22);
    border-radius: 999px;
    font-family: 'Outfit', sans-serif;
    letter-spacing: 0.14em;
}

.sp-proof-title {
    position: relative;
    max-width: 680px;
    color: #0f172a;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(2rem, 4.4vw, 3.45rem);
    line-height: 1.02;
    letter-spacing: 0;
}

.sp-proof-sub {
    position: relative;
    max-width: 660px;
    color: #4b5563;
    font-size: 1rem;
    font-weight: 600;
}

.sp-proof-grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.sp-proof-item {
    min-height: 100%;
    border: 1px solid rgba(124,58,237,0.12);
    border-radius: 20px;
    background: rgba(255,255,255,0.8);
    box-shadow: 0 14px 35px rgba(15,23,42,0.06);
}

.sp-proof-icon {
    color: #8b5cf6;
}

.sp-proof-label {
    color: #7c3aed;
}

.sp-proof-val {
    color: #0f172a;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.28rem;
    line-height: 1.1;
}

.sp-proof-text {
    color: #596273;
    font-weight: 600;
}

.sp-proof-footer {
    position: relative;
    border-top: 1px solid rgba(124,58,237,0.12);
}

.sp-alert-text {
    color: #4b5563;
    font-weight: 700;
}

.sp-purchase-toast {
    border-color: rgba(124,58,237,0.28);
    background: rgba(3, 7, 18, 0.92);
}

@media (max-width: 820px) {
    .sp-hero {
        width: 100%;
        padding: 4.25rem 1.25rem 3.35rem;
    }

    .sp-hero-headline {
        max-width: 31rem;
        font-size: clamp(3.15rem, 10.5vw, 4.9rem);
        line-height: 1;
        text-wrap: balance;
    }

    .sp-proof-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .ob-sales-reveal-container {
        background:
            radial-gradient(circle at 18% 4%, rgba(139, 92, 246, 0.16), transparent 30%),
            linear-gradient(180deg, #050510 0%, #12122a 34%, #fbfaff 34%, #ffffff 100%);
    }

    .sp-hero {
        padding-top: 3.5rem;
    }

    .sp-hero-headline {
        font-size: clamp(2.55rem, 13vw, 4rem);
    }

    .sp-hero-cta {
        min-height: 58px;
        padding: 16px 18px;
    }

    .sp-proof-section {
        width: min(calc(100% - 1.25rem), 860px);
        border-radius: 24px;
    }
}
/* --- VERIFICATION & PERSONALIZATION STYLES --- */

/* Scarcity Banner */
.ob-scarcity-banner {
  background: rgba(5, 5, 16, 0.95);
  backdrop-filter: blur(10px);
  padding: 12px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 1000;
  height: 60px;
}

.ob-pulse-dot {
  width: 6px;
  height: 6px;
  background: #F59E0B;
  border-radius: 50%;
  animation: ob-pulse-glow 2s infinite;
}

@keyframes ob-pulse-glow {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(245, 158, 11, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}

/* Personalization Trigger */
.ob-personalization-trigger {
  width: 100%;
  margin: 20px 0;
}

.ob-toggle-btn {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px;
  background: rgba(139, 92, 246, 0.05);
  border: 1px dashed rgba(139, 92, 246, 0.3);
  border-radius: 12px;
  color: #C084FC;
  transition: all 0.3s ease;
  cursor: pointer;
}

.ob-toggle-btn:hover {
  background: rgba(139, 92, 246, 0.1);
  border-color: #8B5CF6;
}

.ob-toggle-btn.active {
  background: rgba(139, 92, 246, 0.1);
  border-style: solid;
  border-color: #8B5CF6;
}

.ob-questions-dropdown {
  background: rgba(139, 92, 246, 0.03);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(139, 92, 246, 0.1);
  border-radius: 16px;
  padding: 24px;
  margin-top: 12px;
}

.ob-questions-stack-mini {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ob-question-input-wrapper-mini {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #0A0A1A;
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 12px;
  padding: 12px 16px;
  transition: all 0.2s ease;
}

.ob-input-field-mini {
  background: transparent;
  border: none;
  color: #fff;
  font-size: 14px;
  width: 100%;
  outline: none;
  font-family: inherit;
}

/* Verification Card */
.ob-verification-section {
  margin: 60px 20px 40px;
}

.ob-verification-card {
  background: #0A0A1A;
  border: 1px solid rgba(139, 92, 246, 0.3);
  border-radius: 32px;
  padding: 40px 24px;
  position: relative;
  overflow: hidden;
  text-align: left;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}

.ob-verification-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: #8B5CF6;
}

.ob-status-badge {
  display: inline-block;
  color: #10b981;
  font-size: 10px;
  font-weight: 900;
  padding: 4px 12px;
  border-radius: 20px;
  letter-spacing: 1px;
  margin-bottom: 12px;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.ob-v-label {
  font-size: 10px;
  color: #9898B0;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.ob-v-value {
  font-size: 16px;
  color: #fff;
  font-weight: 500;
}

/* Apple-style Verification */
.apple-v-section {
  max-width: 600px;
  margin: 40px auto;
  padding: 0 20px;
}

.apple-v-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid rgba(255, 255, 255, 0.1);
  padding-bottom: 12px;
  margin-bottom: 32px;
}

.apple-v-title {
  font-family: 'Cinzel', serif;
  font-size: 22px;
  font-weight: 700;
  color: #E8E8F0;
}

.apple-v-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  padding-bottom: 16px;
  margin-bottom: 16px;
}

.apple-v-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: #94a3b8;
  text-transform: uppercase;
}

.apple-v-value {
  font-size: 17px;
  font-weight: 600;
  color: #E8E8F0;
}

.apple-v-input {
  width: 100%;
  padding: 12px 0;
  background: transparent;
  border: none;
  border-bottom: 2px solid rgba(139, 92, 246, 0.2);
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  outline: none;
}

.apple-v-input:focus {
  border-color: #8B5CF6;
}

.apple-v-save-btn {
  width: 100%;
  padding: 20px;
  background: #8B5CF6;
  border: none;
  border-radius: 16px;
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
}

.ob-v-status-blink {
  width: 6px;
  height: 6px;
  background: #10b981;
  border-radius: 50%;
  animation: ob-blink 2s infinite;
}

@keyframes ob-blink {
  0% { opacity: 0.3; }
  50% { opacity: 1; }
  100% { opacity: 0.3; }
}
html { background-color: #050510;
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

body { background-color: #050510;
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
  -webkit-tap-highlight-color: transparent;
  overflow-x: hidden;
  overflow-y: visible;
  position: relative;
}

#root {
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.ob-container{
  position:relative;
  min-height: 100dvh;
  width:100%;
  background: radial-gradient(ellipse at 50% 0%, #1a103d 0%, #0a0a1a 50%, #050510 100%);
  display:flex;
  flex-direction:column;
  color:#E8E8F0;
  font-family:'Outfit','Inter',sans-serif;
  overflow-x: hidden;
  overflow-y: visible;
}

/* Ambient elements removed as per user request (completely removing dark theme) */
.ob-ambient-bg{display:none !important}
.ob-stars{display:none !important}

/* Navigation */
.ob-nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:16px 20px;display:flex;align-items:center}
.ob-nav-btn{background:none;border:none;color:#E8E8F0;cursor:pointer;font-size:28px;padding:4px 8px;opacity:.7;transition:opacity .2s}
.ob-nav-btn:hover{opacity:1}

/* Content */
.ob-content-wrapper{
  flex:1;
  display:flex;
  flex-direction: column;
  align-items:center;
  justify-content:flex-start; /* Ensure content starts at top */
  position:relative;
  z-index:1;
  padding:20px 20px 120px; /* Minimized top padding for ultra-compact layout */
  width: 100%;
  box-sizing: border-box;
}

.ob-no-padding-top {
  padding-top: 0 !important;
}
.ob-content-inner{width:100%;max-width:440px;margin:0 auto}

/* Footer */
.ob-footer{position:fixed;bottom:0;left:0;right:0;z-index:100;padding:16px 20px;padding-bottom:max(16px,env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(5,5,16,0.9) 40%)}
.ob-btn-continue{width:100%;max-width:440px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:18px;border-radius:18px;border:none;background:linear-gradient(135deg,#A855F7,#7C3AED,#5B21B6);color:#ffffff;text-shadow:0 0 10px rgba(255,255,255,0.5);font-family:'Outfit',sans-serif;font-size:13px;font-weight:900;letter-spacing:3.5px;cursor:pointer;position:relative;overflow:hidden;box-shadow:0 10px 30px rgba(124,58,237,.5);transition:transform .15s,box-shadow .15s}
.ob-btn-continue:hover:not(.disabled){transform:translateY(-1px);box-shadow:0 14px 40px rgba(124,58,237,.6)}
.ob-btn-continue.disabled{opacity:.35;cursor:not-allowed;box-shadow:none}

/* Step fade-in */
.ob-step{animation:ob-fadeSlide .5s ease-out both}
@keyframes ob-fadeSlide{0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}

/* --- STEP 0: SPLASH --- */
.ob-splash{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-height:100dvh;width:100%;padding-bottom:20px;text-align:center;position:relative;}
.ob-splash-solar{position:absolute;top:0;left:0;right:0;height:60vh;pointer-events:none}
.ob-splash-scrim{position:absolute;bottom:0;left:0;right:0;height:52%;background:linear-gradient(transparent,rgba(0,0,0,.75) 40%,#000 80%);pointer-events:none}
.ob-app-name{font-size:42px;font-weight:700;letter-spacing:16px;color:#E8E8F0;margin-bottom:12px;font-family:'Outfit',sans-serif}
.ob-divider-row{display:flex;align-items:center;gap:14px;width:100%;margin-bottom:14px}
.ob-divider-line{flex:1;height:1px;background:rgba(255,255,255,0.1)}
.ob-divider-dot{color:#7C3AED;font-size:10px;opacity:.8}
.ob-tagline{font-size:22px;font-weight:600;color:#E8E8F0;letter-spacing:.5px;margin-bottom:6px}
.ob-tag-sub{font-size:13px;color:#7C3AED;letter-spacing:1.8px;opacity:.8;text-transform:uppercase;margin-bottom:24px}
.ob-splash-cta{width:100%;display:flex;flex-direction:column;align-items:center;gap:12px}

/* --- INTRO / DETAILS STEPS --- */
.ob-step-indicator{font-size:10px;text-transform:uppercase;letter-spacing:3px;color:rgba(255,255,255,0.4);margin-bottom:8px;font-weight:700;display:block}
.ob-badge{display:inline-block;font-size:11px;letter-spacing:4px;color:#7C3AED;opacity:1;margin-bottom:12px;text-transform:uppercase;font-weight:700}
.ob-title{
  font-family:'Outfit',serif;
  font-size:clamp(1.6rem,5vw,2rem);
  font-weight:700;
  color:#E8E8F0;
  margin-bottom:12px;
  line-height:1.2;
}

/* PREMIUM REDESIGN */
.ob-trust-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f5f5f7;
  padding: 8px 16px;
  border-radius: 40px;
  margin-bottom: 32px;
  border: 1px solid #e5e7eb;
}

.ob-trust-badge span {
  font-size: 12px;
  font-weight: 600;
  color: #1d1d1f;
  letter-spacing: -0.01em;
}

.ob-title-premium {
  font-size: clamp(2rem, 8vw, 2.5rem);
  font-weight: 800;
  color: #1a1a2e;
  text-align: center;
  line-height: 1.1;
  margin-bottom: 16px;
  letter-spacing: -0.5px;
}

.text-gradient-purple {
  background: linear-gradient(135deg, #8B5CF6, #D946EF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ob-subtitle-premium {
  font-size: 15px;
  color: #9898B0;
  text-align: center;
  line-height: 1.6;
  max-width: 340px;
  margin: 0 auto 40px;
  opacity: 0.9;
}

.ob-form-stack {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

.ob-input-group-premium {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ob-label-premium {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: #9ca3af;
  margin-left: 4px;
}

.ob-input-wrapper {
  position: relative;
}

.ob-input-field {
  width: 100%;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 16px;
  padding: 16px 20px;
  font-size: 16px;
  color: #E8E8F0;
  font-family: inherit;
  transition: all 0.2s ease;
  box-sizing: border-box;
}

.ob-input-field:focus {
  outline: none;
  border-color: #8B5CF6;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.1);
}

.ob-time-flex-premium {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ob-checkbox-premium {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #6b7280;
  cursor: pointer;
  white-space: nowrap;
}

.ob-results-overlay-premium {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  z-index: 1000;
  overflow: hidden;
}

.ob-result-item-premium {
  padding: 14px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 14px;
  color: #374151;
  transition: background 0.2s;
}

.ob-result-item-premium:hover {
  background: #f3f4f6;
  color: #8B5CF6;
}
.ob-body{font-size:15px;color:#9898B0;line-height:1.6}
.ob-gradient-text{background:linear-gradient(135deg,#A855F7,#D946EF,#C084FC);-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* Intro Details Special */
.ob-intro-congrats{font-size:24px;font-weight:900;letter-spacing:5px;color:#F59E0B;text-align:center;text-shadow:0 0 12px rgba(245,158,11,.3);margin-bottom:8px}
.ob-celestial-icon{width:200px;height:200px;margin:20px auto;position:relative;display:flex;align-items:center;justify-content:center}
.ob-celestial-icon svg{width:100%;height:100%}
.ob-rigor-label{font-size:11px;font-weight:700;letter-spacing:4px;color:#7C3AED;text-align:center;margin-bottom:8px}
.ob-rigor-divider{width:28px;height:2px;background:#7C3AED;margin:0 auto 14px;opacity:.6;border-radius:1px}
.ob-rigor-body{font-size:13px;color:#64748b;text-align:center;line-height:1.6;max-width:290px;margin:0 auto 20px}
.ob-trust-row{display:flex;align-items:center;justify-content:center;width:100%;padding-top:14px;border-top:1px solid rgba(0,0,0,.06)}
.ob-trust-item{flex:1;text-align:center}
.ob-trust-value{font-size:15px;font-weight:800;color:#F59E0B;margin-bottom:3px}
.ob-trust-label{font-size:8px;font-weight:700;color:#94a3b8;letter-spacing:1.5px;text-transform:uppercase}
.ob-trust-divider-v{width:1px;height:28px;background:rgba(0,0,0,.06)}

/* --- INPUTS --- */
.ob-input-group{display:flex;flex-direction:column;gap:12px;position:relative}
.ob-input{
  width:100%;
  padding:16px 18px;
  border-radius:16px;
  border:1px solid rgba(0, 0, 0, 0.12);
  background:#fff;
  color:#1a1a2e;
  font-size:16px;
  font-family:'Outfit',sans-serif;
  outline:none;
  transition:border-color .2s,background .2s;-webkit-appearance:none;
}
.ob-input:focus{border-color:#8B5CF6;background:#faf8ff}
.ob-input::placeholder{color:rgba(0,0,0,.3)}
.ob-input::-webkit-calendar-picker-indicator{filter:none;opacity:.5}
.ob-checkbox-container{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;color:rgba(0,0,0,.5)}
.ob-checkbox-container input[type="checkbox"]{width:18px;height:18px;accent-color:#8B5CF6}

/* Location dropdown */
.ob-input-icon{position:absolute;left:14px;top:18px;z-index:1}
.ob-input-with-icon{padding-left:42px}
.ob-results-dropdown{position:absolute;top:100%;left:0;right:0;background:#ffffff;border:1px solid rgba(0,0,0,.1);border-radius:12px;margin-top:4px;overflow:hidden;z-index:50;box-shadow:0 12px 30px rgba(0,0,0,.08)}
.ob-result-item{display:flex;align-items:center;gap:10px;padding:14px 16px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.05);transition:background .15s;font-size:14px;color:#E8E8F0}
.ob-result-item:hover{background:rgba(139,92,246,.06)}

/* --- SELECTION CARDS --- */
.ob-cards{display:flex;flex-direction:column;gap:12px}
.ob-selection-card{padding:20px;border-radius:20px;border:1px solid rgba(0,0,0,.06);background:#f8f7ff;cursor:pointer;transition:all .2s}
.ob-selection-card:hover{background:#f3f0ff}
.ob-selection-card.active{border-color:rgba(139,92,246,.5);background:rgba(139,92,246,.06);box-shadow:0 8px 20px rgba(139,92,246,.08)}
.ob-selection-card h3{font-family:'Outfit',sans-serif;font-size:16px;font-weight:700;color:#1a1a2e;margin-bottom:6px}
.ob-selection-card p{font-size:13px;color:rgba(0,0,0,.5);line-height:1.5}

/* --- EMOTIONAL ID GRID --- */
.ob-emotion-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ob-emotion-card{display:flex;flex-direction:column;align-items:flex-start;padding:16px;border-radius:24px;background:#f8f7ff;border:1px solid rgba(0,0,0,.06);cursor:pointer;transition:all .2s;height:160px;position:relative;overflow:hidden}
.ob-emotion-card.active{border-width:1.5px;box-shadow:0 0 15px var(--card-color,rgba(139,92,246,.2))}
.ob-emotion-card .icon-box{width:44px;height:44px;border-radius:14px;border:1px solid;display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:12px}
.ob-emotion-card .card-label{font-size:12px;font-weight:700;letter-spacing:1px;color:#1a1a2e;opacity:.95;margin-bottom:6px}
.ob-emotion-card .card-desc{font-size:11px;color:rgba(0,0,0,.5);line-height:1.5}
.ob-emotion-card .active-dot{width:8px;height:8px;border-radius:4px;position:absolute;top:16px;right:16px}

/* --- PHASE 1: FORM PAGE --- */
.ob-form-page { width: 100%; max-width: 550px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.ob-form-card { 
  width: 100%; 
  background: rgba(255, 255, 255, 0.03); 
  border: 1px solid rgba(139,92,246,0.2); 
  border-radius: 28px; 
  padding: 36px; 
  margin: 32px 0; 
  display: flex; 
  flex-direction: column; 
  gap: 24px; 
  box-shadow: 0 15px 40px rgba(0,0,0,0.3);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.ob-input-group { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; width: 100%; }
.ob-field { display: flex; flex-direction: column; gap: 10px; width: 100%; text-align: left; position: relative; }
.ob-field label { font-size: 11px; font-weight: 800; color: rgba(0, 0, 0, 0.4); text-transform: uppercase; letter-spacing: 1.5px; margin-left: 4px; }
.ob-input { 
  width: 100%; 
  background: rgba(255, 255, 255, 0.05); 
  border: 1px solid rgba(255, 255, 255, 0.1); 
  border-radius: 14px; 
  padding: 16px; 
  color: #E8E8F0; 
  font-size: 16px; 
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
  outline: none;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px #1a103d inset !important;
    -webkit-text-fill-color: #E8E8F0 !important;
}
.ob-input:focus { border-color: #8B5CF6; background: #faf8ff; box-shadow: 0 0 20px rgba(139, 92, 246, 0.1); }
.ob-input-padded { padding-left: 48px; }
.ob-input-icon-inner { position: absolute; left: 16px; top: 40px; color: rgba(0, 0, 0, 0.3); pointer-events: none; }

.ob-time-container { width: 100%; display: flex; flex-direction: column; gap: 10px; }
.ob-check-wrap { display: flex; align-items: center; gap: 10px; font-size: 12px; color: rgba(0, 0, 0, 0.5); cursor: pointer; user-select: none; margin-top: 4px; }
.ob-check-wrap input { accent-color: #8B5CF6; width: 16px; height: 16px; }

.ob-primary-btn { 
  width: 100%; 
  background: linear-gradient(135deg, #8B5CF6, #D946EF) !important; 
  color: #fff !important; 
  border: none; 
  padding: 22px; 
  border-radius: 16px; 
  font-size: 17px; 
  font-weight: 900; 
  letter-spacing: 2px; 
  text-transform: uppercase; 
  cursor: pointer; 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  gap: 12px; 
  transition: all 0.3s; 
  box-shadow: 0 12px 30px rgba(139, 92, 246, 0.4);
}
.ob-primary-btn:hover { transform: translateY(-2px); background: linear-gradient(135deg, #7C3AED, #C026D3) !important; box-shadow: 0 18px 45px rgba(139, 92, 246, 0.6); filter: brightness(1.1); }
.ob-primary-btn:active { transform: translateY(0); }

/* --- PHASE 2: READING PAGE (STEP 3) --- */
.ob-reading-page { width: 100%; max-width: 600px; margin: 0 auto; text-align: left; }

/* Reveal sequence items */
.ob-badge-glow {
  background: #00FF94;
  color: #050510;
  padding: 8px 18px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 3px;
  box-shadow: 0 0 20px rgba(0, 255, 148, 0.4);
  text-transform: uppercase;
}

.ob-archetype-reveal {
  margin: 24px 0;
}
.ob-label-mini {
  font-size: 11px;
  color: #9898B0;
  letter-spacing: 4px;
  margin-bottom: 10px;
  font-weight: 800;
}
.ob-archetype-name {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(2rem, 8vw, 2.8rem);
  font-weight: 900;
  color: #1a1a2e;
  line-height: 1.1;
  letter-spacing: -1px;
}

.ob-big-three-row { display: flex; gap: 12px; margin-bottom: 30px; flex-wrap: wrap; }
.ob-pill { 
  flex: 1; 
  min-width: 100px; 
  background: rgba(255,255,255,0.03); 
  border: 1px solid rgba(139,92,246,0.12); 
  border-radius: 16px; 
  padding: 14px; 
  display: flex; 
  flex-direction: column; 
  align-items: center; 
  gap: 6px; 
}
.ob-pill-label { font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: 2px; display: flex; align-items: center; gap: 6px; color: #666 !important; }
.ob-pill-value { font-weight: 900; font-size: 22px; color: #1a1a2e !important; }

/* --- STRUCTURED FORM V2 --- */
.ob-form-card-structured {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(139, 92, 246, 0.2) !important;
  border-radius: 24px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  width: 100%;
  margin-top: 10px;
}
.ob-input-section {
  width: 100%;
  margin-bottom: 24px;
}
.ob-section-header-mini {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 2px;
  color: #8B5CF6 !important;
  text-transform: uppercase;
  margin-bottom: 12px;
  padding-left: 8px;
}
.ob-section-header-mini span {
  color: #8B5CF6 !important;
}
.ob-field-structured {
  padding: 18px 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: #ffffff !important;
}

.ob-field-structured:last-child {
  border-bottom: none;
}
.ob-field-structured label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 800;
  color: #9898B0 !important;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.ob-input-v2 {
  width: 100%;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1.5px solid rgba(139, 92, 246, 0.2) !important;
  border-radius: 14px;
  font-family: 'Outfit', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #E8E8F0 !important;
  outline: none;
  padding: 12px 16px;
  height: 52px;
  transition: all 0.2s;
  display: block;
}

/* Normalize date/time inputs */
input[type="date"].ob-input-v2,
input[type="time"].ob-input-v2 {
  appearance: none;
  -webkit-appearance: none;
  min-height: 52px;
}
.ob-input-v2:focus {
  border-color: #8B5CF6 !important;
}
.ob-input-v2::placeholder {
  color: #bbbbbb !important;
}

.ob-input-v2::-webkit-calendar-picker-indicator {
  cursor: pointer;
  filter: invert(0.5);
  opacity: 0.6;
}

.ob-time-flex {
  display: flex;
  align-items: center;
  gap: 16px;
}
.ob-checkbox-v2 {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.4);
  user-select: none;
}
.ob-checkbox-v2 input {
  accent-color: #8B5CF6;
  width: 16px;
  height: 16px;
}
.ob-results-overlay-v2 {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-top: none;
  border-radius: 0 0 16px 16px;
  z-index: 100;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.ob-result-item-v2 {
  padding: 14px 20px;
  font-size: 14px;
  color: #1a1a2e;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}
.ob-result-item-v2:hover {
  background: #f8f7ff;
}
.ob-primary-btn-v2 {
  width: 100%;
  background: linear-gradient(135deg, #8B5CF6, #D946EF);
  color: #ffffff;
  border: none;
  padding: 22px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 3px;
  text-transform: uppercase;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  box-shadow: 0 12px 30px rgba(139, 92, 246, 0.4);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.ob-primary-btn-v2:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 45px rgba(139, 92, 246, 0.6);
}
.ob-error-banner {
  background: #FEF2F2;
  border: 1px solid #FCA5A5;
  color: #B91C1C;
  padding: 12px 20px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}

/* Duality Stack */
.ob-duality-stack {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ob-insight-card-v2 {
  background: #fdfcff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 24px;
  padding: 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.03);
}

.ob-insight-card-v2.mask {
  border-left: 4px solid #F59E0B;
}

.ob-insight-card-v2.shadow {
  background: #fffafa;
  border: 1px solid rgba(255, 77, 77, 0.15);
  border-left: 4px solid #FF4D4D;
}

.ob-card-tag {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 2px;
  color: #F59E0B;
  margin-bottom: 12px;
}
.shadow-tag { color: #FF4D4D; }

.ob-insight-body {
  font-size: 1.05rem;
  line-height: 1.6;
  color: rgba(0, 0, 0, 0.7);
}

.ob-critical-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #FF4D4D;
  font-size: 12px;
  font-weight: 700;
  padding: 10px;
  background: rgba(255, 77, 77, 0.1);
  border-radius: 12px;
}

/* Scanner Animation */
.ob-warning-scanner {
  position: relative;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 77, 77, 0.05);
  border-radius: 12px;
  overflow: hidden;
  border: 1px dashed rgba(255, 77, 77, 0.3);
}
.ob-warning-scanner p {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2px;
  color: #FF4D4D;
  z-index: 1;
}
.ob-scan-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #FF4D4D;
  box-shadow: 0 0 15px #FF4D4D;
  animation: scan-move 2s ease-in-out infinite;
}
@keyframes scan-move {
  0% { top: 0; }
  50% { top: 100%; }
  100% { top: 0; }
}

/* Tipping Point Green Section */
.ob-tipping-point-box {
  background: #00FF94;
  color: #050510;
  border-radius: 24px;
  padding: 40px;
  text-align: center;
  box-shadow: 0 10px 40px rgba(0, 255, 148, 0.2);
  margin: 40px 0;
}
.ob-tipping-point-box h3 {
  font-size: 1.4rem;
  font-weight: 900;
  letter-spacing: 3px;
  margin-bottom: 12px;
  color: #050510 !important;
}
.ob-tipping-point-box p {
  font-size: 16px;
  line-height: 1.6;
  color: #050510 !important;
  font-weight: 600;
}

/* Mega CTA */
.ob-mega-cta-v2 {
  width: 100%;
  background: linear-gradient(135deg, #8B5CF6, #D946EF);
  border: none;
  border-radius: 20px;
  padding: 22px;
  color: #fff;
  font-size: 1.1rem;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(139, 92, 246, 0.4);
}

.pulse-btn {
  animation: pulse-glow 2s infinite;
}
@keyframes pulse-glow {
  0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4); }
  70% { box-shadow: 0 0 0 15px rgba(139, 92, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}

/* Lock Grid V3 (Premium Locked State) */
.ob-lock-grid-v3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 40px 0;
}
.ob-lock-card-v3 {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 24px;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  position: relative;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.02);
}
.ob-lock-card-v3:hover {
  transform: translateY(-2px);
  border-color: rgba(139, 92, 246, 0.3);
  box-shadow: 0 10px 30px rgba(139, 92, 246, 0.1);
}
.ob-lock-icon-v3 {
  width: 56px;
  height: 56px;
  background: #f8f7ff;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8B5CF6;
  flex-shrink: 0;
}
.ob-lock-info-v3 {
  flex: 1;
}
.ob-lock-title-v3 {
  font-size: 16px;
  font-weight: 800;
  color: #1a1a2e;
  margin-bottom: 4px;
}
.ob-lock-desc-v3 {
  font-size: 13px;
  color: rgba(26, 26, 46, 0.5);
  line-height: 1.4;
}
.ob-lock-tag-v3 {
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 2px;
  color: #EF4444;
  background: rgba(239, 68, 68, 0.08);
  padding: 6px 10px;
  border-radius: 8px;
  text-transform: uppercase;
}

/* Value Badge Anchor */
.ob-value-badge-anchor {
  position: absolute;
  right: 0px;
  top: 50%;
  transform: translateY(-50%) rotate(5deg);
  background: #ffffff;
  border: 2px solid #8B5CF6;
  padding: 10px 14px;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(139, 92, 246, 0.2);
  z-index: 10;
  text-align: center;
  animation: float 3s ease-in-out infinite;
}
.ob-value-badge-label {
  font-size: 8px;
  font-weight: 900;
  color: #8B5CF6;
  letter-spacing: 2px;
  margin-bottom: 2px;
}
.ob-value-badge-price {
  font-size: 20px;
  font-weight: 900;
  color: #E8E8F0;
  font-family: 'Outfit', sans-serif;
}

@keyframes float {
  0%, 100% { transform: translateY(-50%) rotate(5deg); }
  50% { transform: translateY(-60%) rotate(7deg); }
}

/* Testimonials Carousel V2 */
.ob-testimonials-carousel-v2 {
  margin: 60px 0;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  position: relative;
}
.ob-carousel-track-wrapper {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.ob-carousel-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: marquee 40s linear infinite;
  padding: 20px 0;
}
.ob-carousel-track:hover {
  animation-play-state: paused;
}
.ob-testimonial-card-v2 {
  width: 280px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(139, 92, 246, 0.1);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  flex-shrink: 0;
}
.ob-testimonial-text {
  font-size: 14px;
  line-height: 1.6;
  color: rgba(26, 26, 46, 0.7);
  margin-bottom: 16px;
  min-height: 60px;
}
.ob-testimonial-author {
  font-size: 12px;
  font-weight: 800;
  color: #E8E8F0;
}

@keyframes marquee {
  0% { transform: translateX(calc(-50% - 10px)); }
  100% { transform: translateX(0); }
}

/* Price Section V2 - Triple Breakdown */
.ob-price-section {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 40px;
  padding: 48px 32px;
  text-align: center;
  margin: 48px 0;
  border: 1px solid rgba(139, 92, 246, 0.2);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  position: relative;
  overflow: hidden;
}
.ob-price-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
  background: linear-gradient(90deg, #8B5CF6, #C084FC);
}
.ob-price-breakdown {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 340px;
  margin: 0 auto 32px;
}
.ob-price-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 15px;
  color: rgba(26, 26, 46, 0.5);
  font-weight: 600;
}
.ob-price-item.total-value span:last-child {
  text-decoration: line-through;
  opacity: 0.6;
}
.ob-price-item.discount {
  color: #00FF94;
  background: rgba(0, 255, 148, 0.05);
  padding: 8px 12px;
  border-radius: 12px;
}
.ob-price-item.final {
  margin-top: 12px;
  padding-top: 24px;
  border-top: 2px dashed rgba(139, 92, 246, 0.3);
  font-size: 22px;
  color: #E8E8F0;
  font-weight: 900;
}
.ob-price-item.final .price-tag {
  font-size: 52px;
  font-family: 'Outfit', sans-serif;
  color: #8B5CF6;
  text-shadow: 0 4px 12px rgba(139, 92, 246, 0.2);
}

.ob-price-label {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 4px;
  color: #8B5CF6;
  margin-bottom: 24px;
  text-transform: uppercase;
}
.ob-price-urgency {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #FFF1F2;
  color: #E11D48;
  padding: 8px 16px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(225, 29, 72, 0.1);
}

/* Base Animations */
.animate-fade-in {
  animation: fade-in 0.8s ease-out forwards;
}
.animate-slide-up {
  opacity: 0;
  animation: slide-up 0.6s ease-out forwards;
}
.animate-shake-in {
  animation: shake-anim 0.5s ease-in-out;
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes slide-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes shake-anim {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  50% { transform: translateX(5px); }
  75% { transform: translateX(-5px); }
}
.ob-insight-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.ob-insight-header h3 { font-family: 'Playfair Display', serif; font-size: 24px; font-weight: 700; color: #1a1a2e; }
.ob-insight-body { font-size: 16px; line-height: 1.8; color: rgba(0,0,0,0.75); font-style: italic; }

/* --- PHASE 3: MISSING CONTENT (FOMO) --- */
.ob-missing-page { width: 100%; max-width: 600px; margin: 0 auto; }
.ob-lock-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 32px 0; }
.ob-lock-card { 
  background: rgba(255, 255, 255, 0.03); 
  border: 1px solid rgba(139, 92, 246, 0.1); 
  border-radius: 20px; 
  padding: 20px; 
  display: flex; 
  align-items: flex-start; 
  gap: 16px; 
  position: relative; 
  opacity: 0.9; 
  transition: all 0.3s; 
  box-shadow: 0 4px 12px rgba(0,0,0,0.2); 
  backdrop-filter: blur(8px);
}
.ob-lock-card:hover { transform: translateY(-4px); opacity: 1; border-color: rgba(139,92,246,0.3); }
.ob-lock-icon { width: 48px; height: 48px; background: rgba(139, 92, 246, 0.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; color: #A78BFA; }
.ob-lock-content { flex: 1; text-align: left; }
.ob-lock-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.ob-lock-title { font-weight: 700; font-size: 16px; color: #E8E8F0; }
.ob-lock-status { font-size: 10px; font-weight: 900; color: #FF4D4D; text-transform: uppercase; letter-spacing: 1px; }
.ob-lock-body { font-size: 14px; color: #9898B0; line-height: 1.5; }

/* --- LOADING PAGE (STEP 1) --- */
.ob-loading-page { 
  min-height: 70vh; 
  display: flex; 
  flex-direction: column; 
  align-items: center; 
  justify-content: center; 
  text-align: center;
  padding: 20px;
}

.ob-loader-container { 
  position: relative; 
  width: 140px; 
  height: 140px; 
  margin-bottom: 40px; 
  display: flex;
  align-items: center;
  justify-content: center;
}

.ob-loader-ring { 
  position: absolute; 
  inset: 0; 
  border: 2px solid rgba(139,92,246,0.08); 
  border-top-color: #7C3AED; 
  border-radius: 50%; 
  animation: spin 1.5s cubic-bezier(0.4, 0, 0.2, 1) infinite; 
}

.ob-loader-inner-ring { 
  position: absolute; 
  inset: 20px; 
  border: 1px solid rgba(139,92,246,0.05); 
  border-bottom-color: #C084FC; 
  border-radius: 50%; 
  animation: spin-reverse 2s linear infinite; 
}

.ob-loader-icon {
  animation: slow-rotate 12s linear infinite;
  filter: drop-shadow(0 0 10px rgba(139, 92, 246, 0.3));
}

@keyframes slow-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes message-fade {
  0%, 100% { opacity: 0.3; transform: translateY(5px); }
  50% { opacity: 1; transform: translateY(0); }
}

.ob-loading-content { width: 100%; max-width: 400px; }
.ob-loading-title { 
  font-family: 'Cinzel', serif; 
  font-size: 22px; 
  font-weight: 700;
  color: #1a1a2e; 
  margin-bottom: 24px; 
  letter-spacing: 0.5px;
  min-height: 2.4em; /* Allow space for 2 lines */
  display: flex;
  align-items: center;
  justify-content: center;
  animation: message-fade 3s ease-in-out infinite;
}

.ob-progress-track { 
  width: 100%; 
  height: 8px; 
  background: #f0f0f5; 
  border-radius: 10px; 
  overflow: hidden; 
  margin-bottom: 16px;
  border: 1px solid rgba(0,0,0,0.03);
}

.ob-progress-fill { 
  height: 100%; 
  background: linear-gradient(90deg, #8B5CF6, #C084FC); 
  box-shadow: 0 0 15px rgba(139,92,246,0.6);
  transition: width 0.3s ease-out; 
}

.ob-loading-subtext { font-size: 14px; color: rgba(0,0,0,0.4); }

@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes spin-reverse { from { transform: rotate(360deg); } to { transform: rotate(0deg); } }
@keyframes pulse-glow { 0%, 100% { opacity: 0.8; transform: scale(1); } 50% { opacity: 1; transform: scale(1.1); filter: drop-shadow(0 0 10px rgba(139,92,246,0.5)); } }


/* --- TENSION BUILD (Locked Cards) --- */
.ob-urgency-badge{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 24px;border-radius:30px;border:1.5px solid rgba(255,77,77,.5);background:rgba(255,77,77,.08);margin:0 auto 28px;animation:pulse-badge 2.4s ease-in-out infinite}
.pulse{animation:pulse-badge 1.5s ease-in-out infinite}
@keyframes pulse-badge{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.03)}}
.ob-urgency-dot{width:8px;height:8px;border-radius:4px;background:#FF4D4D;box-shadow:0 0 6px #FF4D4D}
.ob-urgency-text{font-size:12px;font-weight:700;color:#FF4D4D;letter-spacing:2.5px}
.ob-locked-list{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
.ob-locked-card{background:#f8f7ff;border-radius:22px;padding:24px;border:1px solid rgba(0,0,0,.06);overflow:hidden;position:relative}
.ob-card-top-row{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.ob-icon-circle{width:48px;height:48px;border-radius:14px;border:1px solid;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.ob-card-title{font-size:16px;font-weight:700;color:#1a1a2e;letter-spacing:.5px;line-height:1.4;flex:1}
.ob-lock-badge{width:32px;height:32px;border-radius:10px;border:1px solid;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.ob-tease-container{position:relative;margin-bottom:14px}
.ob-tease-text{font-size:14px;color:rgba(0,0,0,.5);line-height:1.6}
.ob-tease-fade{position:absolute;left:0;right:0;bottom:-4px;height:30px;background:linear-gradient(transparent,rgba(248,247,255,.9),#f8f7ff)}
.ob-stat-row{display:flex;align-items:center;gap:8px;padding-top:12px;border-top:1px solid}
.ob-stat-dot{width:5px;height:5px;border-radius:3px;flex-shrink:0}
.ob-stat-text{font-size:11px;letter-spacing:.8px;line-height:1.5;text-transform:uppercase;font-weight:600}
.ob-fomo-nudge{text-align:center;padding:20px 24px;border-radius:16px;border:1px solid rgba(139,92,246,.3);position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(139,92,246,.12),rgba(99,102,241,.06))}
.ob-fomo-text{font-size:10px;font-weight:700;color:#1a1a2e;letter-spacing:2px;line-height:1.6;opacity:.8}
.ob-social-proof{display:flex;align-items:center;gap:12px;padding:16px;border-radius:16px;border:1px solid rgba(139,92,246,.25);margin-bottom:22px;background:rgba(139,92,246,.05)}
.ob-social-icon{font-size:20px}
.ob-social-text{font-size:13px;color:rgba(0,0,0,.6);line-height:1.4}

/* --- SALES PAGE V2 --- */
.ob-sales-hero {
  text-align: center;
  margin-bottom: 48px;
}
.ob-badge-premium {
  background: #00FF94;
  color: #050510;
  padding: 8px 18px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 2.5px;
  margin-bottom: 24px;
  box-shadow: 0 0 20px rgba(0, 255, 148, 0.4);
  text-transform: uppercase;
  display: inline-block;
}

.ob-sales-title {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(2.2rem, 8vw, 3.2rem);
  font-weight: 900;
  color: #8B5CF6;
  line-height: 1.1;
  margin: 20px 0 12px;
  letter-spacing: -1.5px;
  text-transform: uppercase;
}
.ob-sales-subtitle {
  font-size: 17px;
  color: rgba(26, 26, 46, 0.6);
  line-height: 1.5;
  max-width: 480px;
  margin: 0 auto;
}

/* 2D Premium Book Cover Design */
.ob-book-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 60px auto;
}
.ob-book-wrapper {
  position: relative;
  box-shadow: 
    0 30px 60px rgba(0, 0, 0, 0.4),
    0 10px 20px rgba(0,0,0,0.2);
  transition: transform 0.3s ease;
}
.ob-book-wrapper:hover {
  transform: translateY(-5px);
}
.ob-book-mockup {
  width: 320px;
  height: 420px;
  background: #fdfcfb; /* Premium Paper Look */
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  padding: 0;
  color: #1a1a2e;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.1);
}

/* Background Texture for the Book */
.ob-book-texture {
  position: absolute;
  inset: 0;
  background-image: url("https://www.transparenttextures.com/patterns/natural-paper.png");
  opacity: 0.4;
  pointer-events: none;
}

.ob-book-cover-content {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 40px 20px;
  text-align: center;
}

.ob-book-zodiac-wheel {
  width: 140%;
  height: 180px;
  opacity: 0.8;
  margin: -60px 0;
}

.ob-book-top-label {
  font-size: 8px;
  letter-spacing: 4px;
  font-weight: 800;
  color: #8B5CF6;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.ob-book-main-title {
  font-family: 'Cinzel', serif;
  font-size: 24px;
  font-weight: 900;
  color: #1a1a2e;
  line-height: 1.2;
  margin: 20px 0;
  letter-spacing: 1px;
}

.ob-book-name-label {
  font-family: 'Cinzel', serif;
  font-size: 16px;
  font-weight: 700;
  color: #8B5CF6;
  margin-top: 10px;
}

.ob-book-author-line {
  font-family: 'Cinzel', serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  color: #1a1a2e;
  opacity: 0.8;
}

/* Premium Price Tag Style */
.ob-value-tag {
  position: absolute;
  top: 20px;
  right: -30px;
  background: #fff;
  border: 2px solid #8B5CF6;
  padding: 10px 15px;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(139, 92, 246, 0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 10;
  transform: rotate(5deg);
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.ob-value-tag:hover {
  transform: rotate(0deg) scale(1.1);
  box-shadow: 0 15px 35px rgba(139, 92, 246, 0.3);
}

.ob-tag-hole {
  width: 10px;
  height: 10px;
  background: #fdfcfb;
  border: 2px solid #8B5CF6;
  border-radius: 50%;
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
}

.ob-tag-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ob-tag-label {
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 1.5px;
  color: #8B5CF6;
  opacity: 0.8;
  margin-bottom: 2px;
}

.ob-tag-price {
  font-family: 'Outfit', sans-serif;
  font-size: 20px;
  font-weight: 900;
  color: #1a1a2e;
  letter-spacing: -0.5px;
}

/* Premium CTA Button Improvements */
.ob-premium-cta {
  width: 100%;
  margin-top: 32px;
  background: linear-gradient(135deg, #8B5CF6 0%, #D946EF 100%);
  color: #ffffff;
  font-size: 18px;
  font-weight: 900;
  padding: 20px 32px;
  border-radius: 100px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  box-shadow: 0 15px 35px rgba(139, 92, 246, 0.3);
  text-transform: uppercase;
  letter-spacing: 1px;
  position: relative;
  overflow: hidden;
}

.ob-premium-cta:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 45px rgba(139, 92, 246, 0.45);
  background: linear-gradient(135deg, #7C3AED 0%, #4F46E5 100%);
}

.ob-premium-cta:active {
  transform: translateY(-1px);
}

.ob-premium-cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.6s ease;
}

.ob-premium-cta:hover::before {
  left: 100%;
}

.ob-cta-pulse {
  animation: ob-button-pulse 2s infinite;
}

@keyframes ob-button-pulse {
  0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.4); }
  70% { box-shadow: 0 0 0 20px rgba(139, 92, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}

/* We Know Everything Section - Soul Scan Aesthetic */
.ob-we-know-section {
  background: #0A0A1A;
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 24px;
  padding: 40px;
  margin: 40px 0;
  position: relative;
  overflow: hidden;
  text-align: left;
}

.ob-we-know-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #8B5CF6, transparent);
  animation: ob-scan-line 3s linear infinite;
}

@keyframes ob-scan-line {
  0% { transform: translateY(-100%); opacity: 0; }
  50% { opacity: 1; }
  100% { transform: translateY(500px); opacity: 0; }
}

.ob-we-know-header {
  margin-bottom: 32px;
}

.ob-we-know-label {
  font-family: monospace;
  font-size: 10px;
  color: #10B981;
  background: rgba(16, 185, 129, 0.1);
  padding: 4px 10px;
  border-radius: 4px;
  letter-spacing: 2px;
  display: inline-block;
  margin-bottom: 12px;
}

.ob-we-know-title {
  font-size: 24px;
  font-weight: 900;
  color: #ffffff;
  margin-bottom: 12px;
  letter-spacing: -0.5px;
}

.ob-we-know-desc {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.5;
}

.ob-we-know-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

@media (min-width: 768px) {
  .ob-we-know-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.ob-we-know-item {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 16px;
  padding: 20px;
  display: flex;
  gap: 16px;
  transition: all 0.3s ease;
}

.ob-we-know-item:hover {
  background: rgba(139, 92, 246, 0.05);
  border-color: rgba(139, 92, 246, 0.2);
  transform: translateY(-2px);
}

.ob-item-icon {
  color: #8B5CF6;
  padding-top: 4px;
}

.ob-item-label {
  font-size: 9px;
  font-weight: 800;
  color: #8B5CF6;
  letter-spacing: 1.5px;
  display: block;
  margin-bottom: 4px;
}

.ob-item-val {
  font-size: 16px;
  font-weight: 900;
  color: #ffffff;
  margin-bottom: 6px;
}

.ob-item-text {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.4;
}

.ob-we-know-footer {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.ob-shadow-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #EF4444;
  font-family: monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  margin-bottom: 12px;
}

.ob-shadow-teaser {
  font-style: italic;
  color: #ffffff;
  font-size: 15px;
  line-height: 1.5;
  opacity: 0.9;
}

/* Transformation V2 */
.ob-transformation-v2 {
  margin: 60px 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ob-trans-card {
  border-radius: 32px;
  padding: 32px;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s;
}
.ob-trans-card.before {
  background: rgba(255, 255, 255, 0.02);
  border: 1.5px solid rgba(255, 255, 255, 0.05);
}
.ob-trans-card.after {
  background: #1a1a2e;
  color: #fff;
  box-shadow: 0 20px 50px rgba(139, 92, 246, 0.15);
}
.ob-trans-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.ob-trans-card.before .ob-trans-label { color: #EF4444; }
.ob-trans-card.after .ob-trans-label { color: #10B981; }

.ob-trans-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ob-trans-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 16px;
  line-height: 1.5;
}
.ob-trans-card.before .ob-trans-item { color: #9898B0; }
.ob-trans-card.after .ob-trans-item { color: rgba(255, 255, 255, 0.9); font-weight: 500; }

.ob-trans-icon {
  margin-top: 4px;
  flex-shrink: 0;
}

/* --- SALES PAGE & CHECKOUT V3 (Restored) --- */
.ob-sales-page-v3 {
  padding-top: 60px;
  max-width: 1000px;
  margin: 0 auto;
  color: #E8E8F0;
}

.ob-combined-checkout-card {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 32px;
  padding: 40px;
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.3);
  color: #E8E8F0;
  margin-top: 40px;
  border: 1px solid rgba(139, 92, 246, 0.2);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.ob-pricing-header {
  text-align: center;
  margin-bottom: 32px;
}

.ob-timer-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(239, 68, 68, 0.05);
  color: #EF4444;
  padding: 6px 16px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  margin-bottom: 12px;
}

.ob-one-time-label {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  color: #8B5CF6;
  opacity: 0.8;
}

.ob-pricing-table {
  background: #f8f9ff;
  border-radius: 20px;
  padding: 24px;
  margin-bottom: 32px;
  border: 1px solid rgba(139, 92, 246, 0.08);
}

.ob-price-row {
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  font-size: 0.95rem;
}

.ob-price-row:last-child {
  border-bottom: none;
  padding-top: 16px;
  font-weight: 900;
  font-size: 1.4rem;
  color: #1a1a2e;
}

.ob-price-row.discount {
  color: #10b981;
}

.ob-price-label { color: #666; }
.ob-price-val { font-family: 'Outfit', sans-serif; }
.ob-price-val.strike { text-decoration: line-through; opacity: 0.4; }

.ob-checkout-title {
  font-family: 'Cinzel', serif;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 24px;
  color: #1a1a2e;
}

.ob-secure-badges {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.04);
}

.ob-secure-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #999;
  font-weight: 600;
}

.ob-badge-verified {
  background: rgba(16, 185, 129, 0.1);
  color: #10B981;
  border: 1px solid rgba(16, 185, 129, 0.3);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  box-shadow: 0 0 15px rgba(16, 185, 129, 0.1);
  text-shadow: 0 0 5px rgba(16, 185, 129, 0.5);
  text-transform: uppercase;
}

.ob-badge-premium {
  background: rgba(139, 92, 246, 0.1);
  color: #8B5CF6;
  border: 1px solid rgba(139, 92, 246, 0.3);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* Transformation Grid (Side-by-Side) */
.ob-transformation-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  margin: 60px 0;
}

@media (min-width: 768px) {
  .ob-transformation-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.ob-trans-card {
  border-radius: 32px;
  padding: 32px;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s;
  display: flex;
  flex-direction: column;
}

.ob-trans-card.before {
  background: #ffffff;
  border: 1.5px solid rgba(0, 0, 0, 0.06);
  color: #1a1a2e;
}

.ob-trans-card.after {
  background: #0A0A1A;
  color: #fff;
  border: 1px solid rgba(139, 92, 246, 0.3);
  box-shadow: 0 20px 50px rgba(139, 92, 246, 0.15);
}

.ob-trans-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 24px;
}

.ob-trans-card.before .ob-trans-label { color: #EF4444; }
.ob-trans-card.after .ob-trans-label { color: #10B981; }

.ob-trans-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ob-trans-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  line-height: 1.6;
}

.ob-trans-card.before .ob-trans-item { color: rgba(26, 26, 46, 0.7); }
.ob-trans-card.after .ob-trans-item { color: rgba(255, 255, 255, 0.9); }

.ob-trans-icon {
  margin-top: 4px;
  flex-shrink: 0;
}

/* Secure Pricing Aesthetic */
.ob-combined-checkout-card {
  background: #ffffff;
  border-radius: 32px;
  padding: 40px;
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.08);
  color: #1d1d1f;
  margin-top: 60px;
  border: 1px solid rgba(0, 0, 0, 0.04);
  position: relative;
}

.ob-pricing-table-v4 {
  background: #ffffff;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
  margin-bottom: 40px;
}

.ob-pricing-header-v4 {
  background: #1d1d1f;
  padding: 12px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ob-offer-badge {
  color: rgba(255, 255, 255, 0.7);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.ob-timer-pill {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  padding: 4px 10px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.ob-price-content-v4 {
  padding: 32px;
}

.ob-price-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

.ob-price-line:last-child {
  border-bottom: none;
}

.ob-label-v4 {
  font-size: 14px;
  font-weight: 600;
  color: #6B7280;
}

.ob-value-v4 {
  font-size: 16px;
  font-weight: 700;
  color: #111827;
}

.ob-value-v4.strike {
  text-decoration: line-through;
  color: #9CA3AF;
  font-weight: 500;
}

.ob-price-line.discount .ob-label-v4 {
  color: #059669;
}

.ob-value-v4.glow {
  background: #10B981;
  color: #fff;
  padding: 4px 10px;
  border-radius: 6px;
  box-shadow: 0 0 15px rgba(16, 185, 129, 0.3);
}

.ob-price-line.total {
  margin-top: 10px;
  padding-top: 24px;
  border-top: 2px dashed rgba(139, 92, 246, 0.1);
}

.ob-label-v4.main {
  font-size: 15px;
  font-weight: 900;
  color: #1a1a2e;
  letter-spacing: 1px;
}

.ob-value-v4.main {
  font-size: 42px;
  font-weight: 900;
  color: #8B5CF6;
  font-family: 'Cinzel', serif;
  text-shadow: 0 4px 12px rgba(139, 92, 246, 0.15);
}

.ob-pricing-footer-v4 {
  background: #fbfbfd;
  padding: 16px;
  text-align: center;
  font-size: 12px;
  color: #86868b;
  font-weight: 500;
  border-top: 1px solid rgba(0, 0, 0, 0.04);
}

.ob-badge-premium {
  background: linear-gradient(135deg, #8B5CF6 0%, #D946EF 100%);
  color: #ffffff;
  border: none;
  padding: 8px 20px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  display: inline-block;
  box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3), 0 0 0 4px rgba(139, 92, 246, 0.1);
}

/* Custom Radio */
.ob-radio-outer{width:22px;height:22px;border-radius:50%;border:2px solid rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center;transition:all .2s}
.ob-selection-item.active .ob-radio-outer{border-color:#8B5CF6}
.ob-radio-inner{width:12px;height:12px;border-radius:50%;background:#8B5CF6;transform:scale(0);transition:transform .2s cubic-bezier(.34,1.56,.64,1)}
.ob-selection-item.active .ob-radio-inner{transform:scale(1)}

.ob-info-box{background:rgba(34,211,238,.05);border-radius:16px;padding:16px;border:1px solid rgba(34,211,238,.15)}
.ob-info-box p{font-size:13px;color:rgba(34,211,238,.8);line-height:1.6;text-align:center}
.ob-info-box strong{color:#C084FC;font-weight:700}

/* --- UTILITY --- */
.text-center{text-align:center}
.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}
.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}
.w-full{width:100%}

/* --- TEASED SECTIONS (PREVIEW) --- */
.ob-tease-grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 24px; }
.ob-tease-card { display: flex; align-items: center; gap: 16px; padding: 16px; background: #f8f7ff; border-radius: 16px; border: 1px solid rgba(0,0,0,0.06); }
.ob-tease-card.locked { opacity: 0.7; }
.ob-tease-icon { font-size: 24px; width: 44px; height: 44px; background: rgba(0,0,0,0.04); border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.ob-tease-info { display: flex; flex-direction: column; gap: 2px; }
.ob-tease-label { font-size: 11px; font-weight: 800; letter-spacing: 1.5px; color: #1a1a2e; opacity: 0.9; }
.ob-tease-status { font-size: 9px; font-weight: 600; letter-spacing: 1px; color: #EF4444; }

/* --- TIMER BOX --- */
.ob-timer-box { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 24px; background: rgba(239, 68, 68, 0.1); border: 1px solid rgba(239, 68, 68, 0.3); border-radius: 12px; margin-bottom: 32px; animation: pulse 2s infinite; }
.ob-timer-label { font-size: 10px; font-weight: 800; letter-spacing: 2px; color: #EF4444; }
.ob-timer-value { font-family: 'Cinzel', serif; font-size: 24px; font-weight: 700; color: #EF4444; }

/* --- PRICING HERO --- */
.ob-pricing-hero { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 40px; }
.ob-price-row { display: flex; align-items: center; gap: 16px; }
.ob-price-old { font-size: 24px; color: rgba(255,255,255,0.3); text-decoration: line-through; text-decoration-color: #EF4444; text-decoration-thickness: 2px; font-weight: 600; }
.ob-price-new { font-size: 56px; font-weight: 800; color: #F59E0B; font-family: 'Cinzel', serif; line-height: 1; }
.ob-price-badge { background: #EF4444; color: #fff; font-size: 11px; font-weight: 900; padding: 4px 12px; border-radius: 4px; letter-spacing: 1px; }

@media (max-width: 600px) {
  .ob-price-new { font-size: 44px; }
}

/* --- MOBILE RESPONSIVE --- */
@media(max-width:480px){
  .ob-content-wrapper{padding:60px 16px 90px}
  .ob-app-name{font-size:28px;letter-spacing:10px}
  .ob-tagline{font-size:17px}
  .ob-title{font-size:1.5rem}
  .ob-reading-title{font-size:22px}
  .ob-placement-row{gap:10px}
  .ob-placement-card{padding:14px}
  .ob-placement-emoji{font-size:22px}
  .ob-placement-value{font-size:14px}
  .ob-big-three{flex-direction:column}
  .ob-locked-card{padding:18px}
  .ob-card-title{font-size:14px}
  .ob-emotion-grid{gap:10px}
  .ob-emotion-card{height:140px;padding:12px}
  .ob-sales-copy{font-size:.95rem}
  .ob-book-image{width:160px;height:224px}
}

/* --- SOLAR SYSTEM --- */
.ob-solar-system {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.ob-sun {
  position: absolute;
  font-size: 32px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.ob-orbit-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.ob-planet-container {
  position: absolute;
  top: 50%;
  left: 50%;
  animation: ob-orbit-spin linear infinite;
}
@keyframes ob-orbit-spin {
  from { transform: rotate(0deg) translateX(var(--radius)) rotate(0deg); }
  to   { transform: rotate(360deg) translateX(var(--radius)) rotate(-360deg); }
}

/* Sales Page Extra Components */
.ob-testimonials {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 32px 0;
  width: 100%;
}

.ob-testimonial-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 20px;
  position: relative;
}

.ob-stars-row {
  color: #F59E0B;
  font-size: 0.9rem;
  margin-bottom: 8px;
  letter-spacing: 2px;
}

.ob-testimonial-card p {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #E8E8F0;
  margin-bottom: 12px;
  font-style: italic;
  margin-top: 0;
}

.ob-author {
  display: block;
  font-size: 0.85rem;
  color: #9898B0;
  font-weight: 600;
  text-align: right;
}

@media (max-width: 600px) {
  .ob-testimonial-card {
    padding: 16px;
  }
}

.ob-legal-links {
  text-align: center;
  opacity: 0.6;
}

.ob-legal-links p {
  font-size: 0.75rem;
  color: #9898B0;
  margin: 0;
}

.ob-legal-links a {
  color: #8B5CF6;
  text-decoration: underline;
  margin: 0 4px;
}

.ob-legal-links a:hover {
  color: #A78BFA;
}

/*  *  *  *  SALES PAGE V3 (SPLIT LAYOUT) --- */
.ob-top-timer-bar { position: fixed; top: 0; left: 0; right: 0; background: #8B5CF6; color: #fff; z-index: 100; padding: 12px 0; box-shadow: 0 4px 20px rgba(0,0,0,0.5); }
.ob-top-timer-content { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 20px; }
.ob-top-timer-text { font-weight: 800; letter-spacing: 1px; font-size: 14px; }
.ob-top-timer-clock { display: flex; align-items: center; gap: 8px; }
.ob-clock-unit { background: #fff; color: #000; padding: 4px 8px; border-radius: 6px; font-weight: 900; font-size: 18px; display: flex; flex-direction: column; align-items: center; min-width: 45px; }
.ob-clock-unit small { font-size: 8px; opacity: 0.6; margin-top: -2px; }
.ob-clock-sep { font-weight: 900; font-size: 20px; }
/* --- DYNAMIC BOOK COVER (PREMIUM PERSONALIZATION) --- */
.ob-book-container {
  perspective: 2000px;
  margin: 60px auto;
  width: 100%;
  max-width: 320px;
  position: relative;
}

.ob-book-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 2/3;
  transform: rotateY(-20deg) rotateX(10deg);
  transform-style: preserve-3d;
  transition: transform 0.6s cubic-bezier(0.2, 0, 0.2, 1);
}

.ob-value-tag {
  position: absolute;
  top: -20px;
  right: -40px;
  background: #F59E0B;
  color: #000;
  padding: 12px 20px;
  border-radius: 4px;
  transform: rotate(15deg);
  box-shadow: 10px 10px 30px rgba(0,0,0,0.3);
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 100px;
  font-family: 'Cinzel', serif;
}

.ob-tag-hole {
  position: absolute;
  top: 50%;
  left: -8px;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  background: #050510;
  border-radius: 50%;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,0.5);
}

.ob-tag-label {
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 1px;
  opacity: 0.8;
}

.ob-tag-price {
  font-size: 20px;
  font-weight: 900;
}

.ob-hero-book-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 40px 20px;
  perspective: 1500px;
  background: radial-gradient(circle at center, rgba(139, 92, 246, 0.05) 0%, transparent 70%);
}

.ob-dynamic-book {
  position: relative;
  width: 280px;
  height: 380px;
  transform: rotateY(0deg) rotateX(0deg);
  transform-style: preserve-3d;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.ob-dynamic-book:hover {
  transform: rotateY(-5deg) rotateX(2deg);
}

.ob-book-cover {
  position: absolute;
  inset: 0;
  background: #fdfdfb; /* Fine ivory paper */
  border-radius: 4px 12px 12px 4px;
  overflow: hidden;
  box-shadow: 
    inset 0 0 40px rgba(0,0,0,0.02),
    5px 5px 20px rgba(0,0,0,0.2);
  display: flex;
  flex-direction: column;
  z-index: 2;
}

.ob-book-texture {
  position: absolute;
  inset: 0;
  opacity: 0.4;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
  pointer-events: none;
}

.ob-book-border {
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(184, 134, 11, 0.15); /* Subtile gold border */
  border-radius: 2px 8px 8px 2px;
  pointer-events: none;
}

.ob-book-content {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 25px;
  z-index: 3;
}

.ob-book-series {
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 3px;
  color: #8b8b8b;
  margin-bottom: 30px;
}

.ob-book-top-rule, .ob-book-bottom-rule {
  width: 40px;
  height: 1px;
  background: #D4AF37;
  margin: 15px 0;
  opacity: 0.6;
}

.ob-book-user-name {
  font-family: 'Cinzel', serif;
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1a;
  letter-spacing: 4px;
  margin: 0;
  text-align: center;
}

.ob-book-title {
  font-family: 'Cinzel', serif;
  font-size: 28px;
  font-weight: 900;
  color: #1a1a1a;
  letter-spacing: 2px;
  margin: 10px 0;
  text-align: center;
  line-height: 1.1;
}

.ob-book-tagline {
  font-size: 9px;
  font-weight: 600;
  color: #666;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-top: auto;
  text-align: center;
  max-width: 180px;
}

.ob-book-seal {
  margin-top: 40px;
  width: 60px;
  height: 60px;
  background: #D4AF37; /* Gold seal */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1), inset 0 0 10px rgba(255,255,255,0.4);
  position: relative;
}

.ob-book-seal::before {
  content: "";
  position: absolute;
  inset: 4px;
  border: 1px dashed rgba(255,255,255,0.4);
  border-radius: 50%;
}

.ob-book-spine {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 15px;
  background: #e5e5e0;
  border-right: 1px solid rgba(0,0,0,0.1);
  box-shadow: inset -5px 0 10px rgba(0,0,0,0.05);
  z-index: 4;
}

.ob-book-shadow {
  position: absolute;
  bottom: -30px;
  left: 5%;
  width: 90%;
  height: 40px;
  background: rgba(0,0,0,0.15);
  filter: blur(25px);
  border-radius: 50%;
  z-index: 1;
}

@media (max-width: 480px) {
  .ob-dynamic-book {
    width: 240px;
    height: 330px;
  }
  .ob-book-title {
    font-size: 22px;
  }
}

.ob-sales-page-v3 { padding-top: 60px; max-width: 1100px; margin: 0 auto; }
.ob-sales-split-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; margin-top: 40px; }

/* LEFT COLUMN */
.ob-main-image-container {
  width: 100%;
  aspect-ratio: 1/1.3;
  background: #0A0A1A;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.05);
  box-shadow: 0 30px 60px rgba(0,0,0,0.5), 0 0 40px rgba(139, 92, 246, 0.1);
  position: relative;
}

.ob-main-image-container::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(0,0,0,0.4) 100%);
  pointer-events: none;
}
.ob-viral-badge { background: #FF4D4D; color: #fff; padding: 6px 12px; text-align: center; font-weight: 800; font-size: 10px; letter-spacing: 1px; text-transform: uppercase; border-bottom: 1px solid #eee; }
.ob-product-main-img { width: 100%; display: block; height: auto; }
.ob-product-footer { background: #f8f8f8; color: #333; padding: 10px; text-align: center; font-weight: 700; font-size: 10px; letter-spacing: 1px; border-top: 1px solid #eee; }

/* RIGHT COLUMN */
.ob-product-title { font-size: 2.2rem; font-weight: 800; line-height: 1.1; margin-bottom: 12px; color: #fff; text-align: left; }
.ob-reviews-row { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.ob-stars { color: #F59E0B; font-size: 1.1rem; }
.ob-reviews-count { font-size: 0.9rem; opacity: 0.6; font-weight: 600; }

.ob-price-block { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.ob-price-new { font-size: 2.5rem; font-weight: 900; color: #A78BFA; }
.ob-price-old { font-size: 1.4rem; opacity: 0.5; text-decoration: line-through; }
.ob-payment-icons { display: flex; justify-content: center; gap: 15px; margin-top: 24px; opacity: 0.7; flex-wrap: wrap; }
.ob-payment-icons img { height: 22px; object-fit: contain; filter: brightness(0) invert(1); }

@media (max-width: 900px) {
  .ob-sales-split-layout { grid-template-columns: 1fr; gap: 30px; }
  .ob-sales-page-v3 { padding-top: 100px; padding-left: 16px; padding-right: 16px; }
  .ob-top-timer-content { flex-direction: column; gap: 10px; padding: 10px; }
  .ob-product-title { font-size: 1.8rem; text-align: center; }
  .ob-bullet-list { align-items: center; }
  .ob-reviews-row { justify-content: center; }
  .ob-price-block { justify-content: center; }
}

.ob-skip-btn {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.4);
  font-size: 11px;
  letter-spacing: 2px;
  cursor: pointer;
  padding: 10px;
  transition: color 0.3s;
  margin-top: 10px;
}
.ob-skip-btn:hover {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: underline;
}

/*  *  *  *  SALES PAGE V3 (REFINED) --- */
.ob-top-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: #8B5CF6;
  color: white;
  padding: 10px 0;
  box-shadow: 0 4px 20px rgba(0,0,0,0.5);
}

.ob-banner-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
}

.ob-banner-text {
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 1.5px;
}

.ob-banner-timer {
  display: flex;
  gap: 8px;
}

.ob-timer-unit {
  background: rgba(0,0,0,0.15);
  padding: 4px 8px;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 42px;
}

.ob-timer-unit span {
  font-weight: 900;
  font-size: 16px;
  line-height: 1;
}

.ob-timer-unit small {
  font-size: 8px;
  text-transform: uppercase;
  opacity: 0.7;
  margin-top: 2px;
}

.ob-sales-page-v3 {
  padding-top: 80px;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

.ob-sales-split-layout {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  margin-bottom: 60px;
  padding: 20px;
  align-items: start;
}

/* Left Column */
.ob-viral-badge {
  display: inline-block;
  background: #ef4444;
  color: #fff;
  padding: 6px 14px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1px;
  margin-bottom: 20px;
}

.ob-product-display {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 24px;
  padding: 32px;
  margin-bottom: 24px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.ob-main-image-container {
  aspect-ratio: 1;
  background: radial-gradient(circle at center, #1a1a3a, #050510);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  border: 1px solid rgba(255,255,255,0.1);
}

.ob-main-image-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ob-thumbnails {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.ob-thumb-btn {
  aspect-ratio: 1;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.ob-thumb-btn.active {
  border-color: #8B5CF6;
  background: rgba(139,92,246,0.1);
}

.ob-sales-left-footer {
  display: flex;
  justify-content: center;
  gap: 24px;
  color: rgba(255,255,255,0.6);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* Right Column */
.ob-product-title {
  font-family: 'Cinzel', serif;
  font-size: 32px;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.2;
}

.ob-product-subtitle {
  font-size: 16px;
  color: rgba(255,255,255,0.6);
  margin-bottom: 24px;
  line-height: 1.5;
}

.ob-price-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  background: rgba(139, 92, 246, 0.05);
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid rgba(139, 92, 246, 0.1);
  width: fit-content;
}

.ob-price-old {
  font-size: 20px;
  color: rgba(255,255,255,0.3);
  text-decoration: line-through;
  font-weight: 500;
}

.ob-price-new {
  font-size: 36px;
  font-weight: 900;
  color: #fff;
  text-shadow: 0 0 20px rgba(139, 92, 246, 0.3);
}

.ob-price-badge {
  background: #F59E0B;
  color: #000;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

.ob-sales-input {
  width: 100%;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 16px;
  color: #fff;
  margin-bottom: 12px;
  font-size: 16px;
  outline: none;
}

.ob-sales-cta {
  width: 100%;
  background: linear-gradient(135deg, #8B5CF6 0%, #D946EF 100%);
  color: #fff;
  border: none;
  padding: 20px;
  border-radius: 14px;
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  transition: transform 0.2s, box-shadow 0.2s;
  animation: ob-pulse 2s infinite;
  text-transform: uppercase;
  letter-spacing: 1px;
}

@keyframes ob-pulse {
  0% { transform: scale(1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); }
  50% { transform: scale(1.02); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4); }
  100% { transform: scale(1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); }
}

.ob-sales-cta:hover {
  transform: translateY(-2px);
}

.ob-sales-cta:active {
  transform: scale(0.98);
}

.ob-payment-icons {
  display: flex;
  justify-content: center;
  gap: 16px;
  opacity: 0.6;
  margin-top: 24px;
}

.ob-payment-icons img {
  height: 18px;
  filter: brightness(0) invert(1);
}

/* Info Stack (Accordions) */
.ob-info-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ob-info-item {
  background: #f8f7ff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  overflow: hidden;
}

.ob-info-header {
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(0,0,0,0.02);
  font-weight: 700;
  font-size: 15px;
  color: #1a1a2e;
  cursor: pointer;
  transition: background 0.2s;
}

.ob-info-header:hover {
  background: rgba(0,0,0,0.04);
}

.ob-accordion-arrow {
  transition: transform 0.3s ease;
  opacity: 0.5;
}

.ob-accordion-arrow.rotate-90 {
  transform: rotate(90deg);
  opacity: 1;
}

.ob-testimonials-section {
  padding: 40px 20px;
  max-width: 1000px;
  margin: 0 auto;
}

.ob-section-title {
  font-size: 28px;
  font-weight: 800;
  color: #1a1a2e;
  text-align: center;
  margin-bottom: 32px;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.ob-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}

.ob-testimonial-card {
  background: #ffffff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  padding: 24px;
  transition: transform 0.3s ease;
  box-shadow: 0 10px 30px rgba(0,0,0,0.03);
}

.ob-testimonial-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.06);
}

.ob-info-body {
  padding: 20px;
  border-top: 1px solid rgba(0,0,0,0.06);
  font-size: 14px;
  color: rgba(0,0,0,0.6);
  line-height: 1.6;
  background: rgba(0,0,0,0.02);
  animation: slideDown 0.3s ease-out;
}

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

.ob-payment-icons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  opacity: 0.8;
  margin: 30px 0;
}

.ob-payment-icons img {
  height: 20px;
  filter: grayscale(1) brightness(2);
  transition: filter 0.3s;
}

.ob-payment-icons img:hover {
  filter: grayscale(0) brightness(1);
}

.ob-info-body strong {
  color: #1a1a2e;
}

.ob-testimonial-text {
  font-size: 15px;
  color: #1a1a2e;
  line-height: 1.6;
  font-style: italic;
  margin-bottom: 20px;
}

.ob-testimonial-author {
  font-size: 13px;
  color: #8B5CF6;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
}

.ob-verified-badge {
  background: rgba(16, 185, 129, 0.1);
  color: #10B981;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 0.5px;
}

/* Mobile Responsive Refinements */
@media (max-width: 900px) {
  .ob-sales-split-layout {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 15px;
    margin-top: 20px;
  }
  .ob-product-title {
    text-align: center;
    font-size: 26px;
  }
  .ob-product-subtitle {
    text-align: center;
    padding: 0 10px;
  }
  .ob-price-hero {
    justify-content: center;
  }
  .ob-banner-content {
    gap: 12px;
  }
  .ob-banner-text {
    font-size: 10px;
    letter-spacing: 0.5px;
  }
  .ob-timer-unit {
    min-width: 35px;
    padding: 2px 4px;
  }
  .ob-timer-unit span {
    font-size: 13px;
  }
  .ob-top-banner {
    padding: 8px 0;
  }
}


.ob-final-checkout-section {
  background: linear-gradient(135deg, rgba(10, 10, 26, 0.8), rgba(18, 18, 42, 0.8));
  backdrop-filter: blur(20px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}

.ob-final-checkout-section h3 {
  font-family: 'Cinzel', serif;
  letter-spacing: 1px;
  color: #fff;
}

.ob-sales-footer-text {
  text-align: center;
  color: rgba(255,255,255,0.4);
  font-size: 14px;
  max-width: 600px;
  margin: 40px auto 0;
}

.ob-limited-tag {
  background: rgba(245, 158, 11, 0.1);
  color: #F59E0B;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  border: 1px solid rgba(245, 158, 11, 0.3);
}

.ob-trust-tag {
  display: flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,0.6);
  font-size: 12px;
  font-weight: 500;
}

.ob-timer-simple {
  font-size: 14px;
  color: rgba(255,255,255,0.7);
}

@media (max-width: 600px) {
  .ob-price-hero {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
  }
  .ob-price-badge {
    width: 100%;
    text-align: center;
    margin-top: 4px;
  }
  .ob-price-new {
    font-size: 32px;
  }
}

.ob-save-inline {
  color: #F59E0B;
  font-size: 14px;
  font-weight: 900;
  margin-left: 4px;
  letter-spacing: 0.5px;
  text-shadow: 0 0 10px rgba(245, 158, 11, 0.2);
}

/* --- STRUCTURED FORM V2 --- */
.ob-form-stack { display: flex; flex-direction: column; gap: 24px; width: 100%; }
/* Legacy dark sections removed */
/* Removed legacy dark overrides */
.ob-results-overlay-v2 { 
  position: absolute; 
  top: 100%; 
  left: 0; 
  right: 0; 
  background: #ffffff; 
  border: 1px solid rgba(0,0,0,0.1); 
  border-radius: 18px; 
  margin-top: 12px; 
  z-index: 100; 
  overflow: hidden; 
  box-shadow: 0 15px 45px rgba(0,0,0,0.15); 
}
.ob-result-item-v2 { 
  padding: 16px 20px; 
  cursor: pointer; 
  display: flex; 
  align-items: center; 
  gap: 12px; 
  font-size: 14px; 
  color: #1a1a2e !important;
  border-bottom: 1px solid rgba(0,0,0,0.05); 
  transition: all 0.2s; 
}
.ob-result-item-v2:hover { 
  background: #f3f4f6; 
}
.ob-result-item-v2 svg {
  color: #8B5CF6 !important;
}
.ob-primary-btn-v2 { width: 100%; padding: 20px; border-radius: 20px; border: none; background: linear-gradient(135deg, #8B5CF6, #D946EF) !important; color: #fff !important; font-weight: 800; font-size: 14px; letter-spacing: 2px; display: flex; align-items: center; justify-content: center; gap: 10px; cursor: pointer; transition: all 0.2s ease; box-shadow: 0 10px 25px rgba(139, 92, 246, 0.3); }
.ob-primary-btn-v2:hover { transform: translateY(-2px); background: linear-gradient(135deg, #7C3AED, #C026D3) !important; box-shadow: 0 15px 35px rgba(139, 92, 246, 0.4); }
.ob-primary-btn-v2:active { transform: scale(0.98); }
.ob-error-banner { background: rgba(239, 68, 68, 0.1); border: 1px solid rgba(239, 68, 68, 0.2); color: #ef4444; padding: 12px; border-radius: 12px; text-align: center; font-size: 13px; }

/*  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  * /* Sales Page v4 Refinements */
.ob-sales-page {
  padding-top: 60px !important;
  max-width: 1000px !important;
  margin: 0 auto;
}

.ob-premium-badge-green {
  background: #10B981;
  color: #fff;
  padding: 8px 24px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 2px;
  display: inline-block;
  margin-bottom: 24px;
  box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2);
}

.ob-sales-title-purple {
  font-size: 48px;
  font-weight: 900;
  color: #8B5CF6;
  font-family: 'Cinzel', serif;
  line-height: 1.1;
  margin-bottom: 20px;
  text-shadow: 0 10px 30px rgba(139, 92, 246, 0.2);
}

/* Book v4 Fixes */
.ob-book-section-v4 {
  perspective: 2000px;
  margin: 80px 0 120px;
  display: flex;
  justify-content: center;
}

.ob-book-container-v4 {
  position: relative;
  width: 320px;
  height: 450px;
  transform-style: preserve-3d;
  transform: rotateY(-25deg) rotateX(5deg);
  transition: transform 0.5s ease;
}

.ob-book-mockup-v4 {
  position: absolute;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}

.ob-book-spine-v4 {
  position: absolute;
  width: 40px;
  height: 100%;
  background: #1a1a2e;
  left: 0;
  transform: rotateY(-90deg);
  transform-origin: left;
  border-radius: 4px 0 0 4px;
  box-shadow: inset -10px 0 20px rgba(0,0,0,0.3);
}

.ob-book-cover-v4 {
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);
  border-radius: 0 8px 8px 0;
  box-shadow: 20px 20px 60px rgba(0,0,0,0.5);
  display: flex;
  flex-direction: column;
  padding: 30px;
  border-left: 2px solid rgba(255,255,255,0.1);
  overflow: hidden;
}

.ob-book-content-v4 {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(255,255,255,0.05);
  padding: 20px;
  position: relative;
}

.ob-book-logo-v4 {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 4px;
  color: rgba(255,255,255,0.3);
}

.ob-book-title-v4 {
  font-size: 18px;
  color: #94a3b8;
  margin-bottom: 5px;
}

.ob-book-subtitle-v4 {
  font-size: 26px;
  font-weight: 900;
  line-height: 1.1;
  color: #fff;
  font-family: 'Cinzel', serif;
}

.ob-book-seal-v4 {
  position: absolute;
  right: -10px;
  top: 50%;
  transform: rotate(-15deg);
  background: #8B5CF6;
  color: #fff;
  padding: 5px 15px;
  font-size: 10px;
  font-weight: 900;
  border-radius: 4px;
}

.ob-book-footer-v4 {
  font-size: 9px;
  letter-spacing: 2px;
  color: #8B5CF6;
  font-weight: 700;
}

.ob-book-pages-v4 {
  position: absolute;
  width: 100%;
  height: 98%;
  background: #e2e8f0;
  right: -5px;
  top: 1%;
  transform: translateZ(-20px);
  border-radius: 0 4px 4px 0;
  box-shadow: inset -5px 0 10px rgba(0,0,0,0.1);
}

.ob-price-tag-v4-tag {
  position: absolute;
  top: -40px;
  right: -80px;
  background: #FBBF24;
  padding: 12px 20px;
  border-radius: 4px;
  box-shadow: 10px 10px 30px rgba(0,0,0,0.2);
  transform: rotate(15deg);
  z-index: 10;
}

.ob-price-tag-punch-v4 {
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  background: #1a1a2e;
  border-radius: 50%;
}

.ob-price-tag-label-v4 {
  font-size: 10px;
  font-weight: 900;
  color: #1a1a2e;
  opacity: 0.6;
}

.ob-price-tag-value-v4 {
  font-size: 24px;
  font-weight: 900;
  color: #1a1a2e;
}

/* Comparison v4 */
.ob-comparison-section-v4 {
  margin: 100px 0;
}

.ob-comparison-grid-v4 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 40px;
}

.ob-comparison-card-v4 {
  background: #ffffff;
  padding: 40px;
  border-radius: 24px;
  border: 1px solid rgba(0,0,0,0.05);
}

.ob-comparison-card-v4.unaligned {
  background: #fafafa;
}

.ob-comparison-card-v4.blueprint {
  background: #ffffff;
  border: 2px solid rgba(16, 185, 129, 0.1);
  box-shadow: 0 20px 40px rgba(16, 185, 129, 0.05);
}

.ob-card-label-v4 {
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 2px;
  margin-bottom: 24px;
  opacity: 0.5;
}

.blueprint .ob-card-label-v4 {
  color: #10B981;
  opacity: 1;
}

.ob-comparison-list-v4 {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ob-comparison-list-v4 li {
  padding: 12px 0;
  border-bottom: 1px solid rgba(0,0,0,0.03);
  font-size: 15px;
  color: #4B5563;
  display: flex;
  align-items: flex-start;
}

.blueprint .ob-comparison-list-v4 li {
  color: #1a1a2e;
  font-weight: 500;
}

.blueprint .ob-comparison-list-v4 li::before {
  content: '   ';
  color: #10B981;
  margin-right: 12px;
}

.unaligned .ob-comparison-list-v4 li::before {
  content: 'x';
  color: #EF4444;
  margin-right: 12px;
  font-weight: 900;
}

/* FAQ Spacing */
.ob-info-item {
  margin-bottom: 20px !important;
}

/* Payment Icons Box */
.ob-payment-icons-static {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 12px;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-top: 24px;
}

.ob-payment-icon {
  height: 20px;
  opacity: 0.6;
  filter: grayscale(1);
}

/* Loading payment spinner */
.ob-loading-payment {
  padding: 40px;
  text-align: center;
  background: #f8f9ff;
  border-radius: 16px;
  border: 1px dashed rgba(139, 92, 246, 0.2);
}

/* ob-spinner defined once at bottom of file */


/* Hero Image Section */
.ob-hero-image-section {
  position: relative;
  max-width: 600px;
  margin: 0 auto 0;
  padding: 0 20px;
}

.ob-hero-book-img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 30px 60px rgba(0, 0, 0, 0.6)) drop-shadow(0 0 40px rgba(139, 92, 246, 0.15));
  animation: ob-float 6s ease-in-out infinite;
}

@keyframes ob-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

.ob-hero-overlay {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}

.ob-hero-name-tag {
  background: rgba(139, 92, 246, 0.9);
  backdrop-filter: blur(12px);
  color: #fff;
  padding: 10px 28px;
  border-radius: 100px;
  font-size: 14px;
  letter-spacing: 1px;
  box-shadow: 0 8px 24px rgba(139, 92, 246, 0.4);
  animation: ob-glow-tag 3s ease-in-out infinite;
  white-space: nowrap;
}

@keyframes ob-glow-tag {
  0%, 100% { box-shadow: 0 8px 24px rgba(139, 92, 246, 0.4); }
  50% { box-shadow: 0 8px 32px rgba(139, 92, 246, 0.6), 0 0 16px rgba(139, 92, 246, 0.2); }
}

.ob-hero-name-tag strong {
  font-weight: 800;
}

/* Social Proof Bar */
.ob-social-proof-bar {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding: 16px 20px;
  background: rgba(255, 255, 255, 0.03);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  margin-bottom: 40px;
  flex-wrap: wrap;
}

.ob-proof-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 600;
}

.ob-proof-stars {
  display: flex;
  gap: 2px;
}

.ob-proof-divider {
  color: rgba(255, 255, 255, 0.15);
  font-size: 18px;
}

/* Main Sales Content Stack */
.ob-sales-content-stack {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

/* Headline Block */
.ob-sales-headline-block {
  text-align: center;
}

.ob-limited-spots-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(239, 68, 68, 0.1);
  border: 1px solid rgba(239, 68, 68, 0.25);
  color: #ef4444;
  padding: 6px 16px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
  margin-bottom: 20px;
}

.ob-pulse-dot {
  width: 8px;
  height: 8px;
  background: #ef4444;
  border-radius: 50%;
  animation: ob-dot-pulse 1.5s infinite;
}

@keyframes ob-dot-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.4); }
}

.ob-sales-main-title {
  font-family: 'Cinzel', serif;
  font-size: 34px;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 16px;
}

.ob-name-highlight {
  background: linear-gradient(135deg, #C084FC, #8B5CF6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ob-sales-main-sub {
  font-size: 17px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.7;
  max-width: 600px;
  margin: 0 auto;
}

/* What's Inside Grid */
.ob-whats-inside {
  text-align: center;
}

.ob-section-label {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 3px;
  color: #8B5CF6;
  text-transform: uppercase;
  margin-bottom: 24px;
}

.ob-inside-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.ob-inside-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  padding: 24px 20px;
  text-align: left;
  transition: all 0.3s ease;
}

.ob-inside-card:hover {
  background: rgba(139, 92, 246, 0.05);
  border-color: rgba(139, 92, 246, 0.2);
  transform: translateY(-3px);
}

.ob-inside-icon {
  font-size: 28px;
  margin-bottom: 12px;
}

.ob-inside-card h3 {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 6px;
}

.ob-inside-card p {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.5;
}

/* Delivery Block */
.ob-delivery-block {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  background: rgba(139, 92, 246, 0.05);
  border: 1px solid rgba(139, 92, 246, 0.15);
  border-radius: 20px;
  padding: 28px;
}

.ob-delivery-icon {
  font-size: 36px;
  flex-shrink: 0;
}

.ob-delivery-text h3 {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}

.ob-delivery-text p {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.6;
}

/* Price Section */
.ob-price-section {
  text-align: center;
}

.ob-price-anchor {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  padding: 32px;
  margin-bottom: 24px;
}

.ob-price-compare {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
}

.ob-price-label {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.4);
}

.ob-price-crossed {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.3);
  text-decoration: line-through;
}

.ob-price-divider-line {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.3), transparent);
  margin: 16px 0;
}

.ob-price-final-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
}

.ob-price-label-final {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}

.ob-price-final-amount {
  display: flex;
  align-items: flex-start;
}

.ob-price-dollar {
  font-size: 24px;
  font-weight: 700;
  color: #8B5CF6;
  margin-top: 6px;
}

.ob-price-number {
  font-size: 56px;
  font-weight: 900;
  color: #fff;
  line-height: 1;
  text-shadow: 0 0 30px rgba(139, 92, 246, 0.3);
}

.ob-price-cents {
  font-size: 24px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 6px;
}

.ob-savings-callout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(245, 158, 11, 0.1);
  color: #F59E0B;
  padding: 8px 16px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 800;
  margin-top: 16px;
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.ob-final-product-preview {
  margin: 32px auto;
  max-width: 280px;
  position: relative;
}

.ob-final-book-img {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,0.4));
  animation: ob-float 5s ease-in-out infinite;
}

/* Mega CTA */
.ob-mega-cta {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 50%, #6D28D9 100%);
  color: #fff;
  border: none;
  padding: 22px 32px;
  border-radius: 18px;
  cursor: pointer;
  box-shadow: 0 8px 30px rgba(139, 92, 246, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
  transition: all 0.3s ease;
  animation: ob-mega-pulse 2.5s infinite;
  position: relative;
  overflow: hidden;
}

.ob-mega-cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
  animation: ob-shine 3s infinite;
}

@keyframes ob-shine {
  0% { left: -100%; }
  50%, 100% { left: 100%; }
}

@keyframes ob-mega-pulse {
  0% { transform: scale(1); box-shadow: 0 8px 30px rgba(139, 92, 246, 0.4); }
  50% { transform: scale(1.02); box-shadow: 0 12px 40px rgba(139, 92, 246, 0.55); }
  100% { transform: scale(1); box-shadow: 0 8px 30px rgba(139, 92, 246, 0.4); }
}

.ob-mega-cta:hover {
  transform: translateY(-3px) scale(1.01);
  box-shadow: 0 14px 40px rgba(139, 92, 246, 0.5);
}

.ob-mega-cta:active {
  transform: scale(0.98);
}

.ob-cta-main-text {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.ob-cta-sub-text {
  font-size: 12px;
  font-weight: 500;
  opacity: 0.7;
  letter-spacing: 0.5px;
}

/* Trust Row */
.ob-trust-row {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.ob-trust-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 500;
}

/* Final CTA Block */
.ob-final-cta-block {
  text-align: center;
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.08), rgba(99, 102, 241, 0.05));
  border: 1px solid rgba(139, 92, 246, 0.15);
  border-radius: 28px;
  padding: 48px 32px;
}

.ob-final-cta-title {
  font-family: 'Cinzel', serif;
  font-size: 26px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}

.ob-final-cta-sub {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 24px;
}

.ob-final-price-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 24px;
}

.ob-price-old-final {
  font-size: 28px;
  color: rgba(255, 255, 255, 0.25);
  text-decoration: line-through;
  font-weight: 500;
}

.ob-price-arrow {
  font-size: 24px;
  color: rgba(255, 255, 255, 0.3);
}

.ob-price-new-final {
  font-size: 48px;
  font-weight: 900;
  color: #8B5CF6;
  text-shadow: 0 0 30px rgba(139, 92, 246, 0.4);
}

.ob-final-urgency {
  margin-top: 20px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  animation: ob-urgency-flash 2s infinite;
}

@keyframes ob-urgency-flash {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

.ob-final-urgency strong {
  color: #F59E0B;
}

/*  *  *  *  MOBILE RESPONSIVE - CONVERSION MACHINE  *  *  *  */
@media (max-width: 768px) {
  .ob-hero-image-section {
    max-width: 100%;
    padding: 0 10px;
  }

  .ob-hero-name-tag {
    font-size: 12px;
    padding: 8px 20px;
  }

  .ob-hero-overlay {
    bottom: 20px;
  }

  .ob-social-proof-bar {
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px;
  }

  .ob-proof-divider {
    display: none;
  }

  .ob-sales-content-stack {
    gap: 36px;
    padding: 0 16px;
  }

  .ob-sales-main-title {
    font-size: 26px;
  }

  .ob-sales-main-sub {
    font-size: 15px;
  }

  .ob-inside-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ob-inside-card {
    padding: 20px 16px;
  }

  .ob-delivery-block {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 24px 20px;
  }

  .ob-price-anchor {
    padding: 24px 20px;
  }

  .ob-price-number {
    font-size: 44px;
  }

  .ob-cta-main-text {
    font-size: 15px;
    letter-spacing: 0.5px;
  }

  .ob-trust-row {
    gap: 12px;
  }

  .ob-trust-item {
    font-size: 11px;
  }

  .ob-final-cta-block {
    padding: 32px 20px;
  }

  .ob-final-cta-title {
    font-size: 22px;
  }

  .ob-price-new-final {
    font-size: 40px;
  }

  .ob-testimonials-grid {
    grid-template-columns: 1fr;
  }
}

/* --- Payment Icons & Badges --- */
.ob-payment-icons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.ob-pay-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  background: #f8f7ff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  color: #1a1a2e;
  letter-spacing: 0.5px;
}

.ob-pay-apple {
  background: #000;
  color: #fff;
  border-color: #000;
}

/* --- Trust Badge Row --- */
.ob-trust-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: rgba(0,0,0,0.45);
}

/*  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  * 
   WHITE THEME OVERRIDE - PREMIUM LIGHT MODE
   All rules below override the dark theme above via cascade
    *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  */

/* Container & Background */
.light-mode.ob-container { 
  background: #ffffff !important; 
  color: #1a1a2e;
  overflow-x: hidden;
}
.light-mode .ob-ambient-bg { display: none !important; }
.light-mode .ob-stars { display: none !important; }
.light-mode { background-color: #ffffff !important; }
body.is-light-mode { background-color: #ffffff !important; }

/* Navigation */
.light-mode .ob-nav-btn { color: #333; }

/* Content */
.light-mode .ob-content-wrapper { padding: 40px 20px 60px; }

/* Text & Typography */
.light-mode .ob-step-indicator { color: rgba(0,0,0,0.35); }
.light-mode .ob-badge { color: #7C3AED; opacity: 1; }
.light-mode .ob-title { color: #1a1a2e; }
.light-mode .ob-body { color: rgba(0,0,0,0.55); }

/* Form Page */
.light-mode .ob-section-header-mini { color: rgba(0,0,0,0.45); text-align: center; font-size: 11px; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase; margin-bottom: 32px; }
.ob-section-header-mini { color: rgba(255,255,255,0.4); text-align: center; font-size: 11px; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase; margin-bottom: 32px; }
.light-mode .ob-form-card-structured { background: #f8f7ff; border-color: rgba(139,92,246,0.12); }
.light-mode .ob-form-card-structured:focus-within { border-color: rgba(139,92,246,0.4); background: #f3f0ff; box-shadow: 0 8px 24px rgba(139,92,246,0.08); }
.light-mode .ob-field-structured label { color: rgba(0,0,0,0.4); }
.light-mode .ob-input-v2 { background: #fff; border: 1.5px solid rgba(0,0,0,0.1); color: #1a1a2e; }
.light-mode .ob-input-v2:focus { border-color: #8B5CF6; background: #faf8ff; box-shadow: 0 0 0 3px rgba(139,92,246,0.08); }
.light-mode .ob-input-v2::placeholder { color: rgba(0,0,0,0.3); }
.light-mode .ob-input-v2::-webkit-calendar-picker-indicator { filter: none; opacity: 0.5; }
.light-mode .ob-checkbox-v2 { color: rgba(0,0,0,0.5); }
.light-mode .ob-results-overlay-v2 { background: #fff; border: 1px solid rgba(0,0,0,0.1); box-shadow: 0 12px 32px rgba(0,0,0,0.12); }
.light-mode .ob-result-item-v2 { color: #1a1a2e; border-bottom-color: rgba(0,0,0,0.06); }
.light-mode .ob-result-item-v2:hover { background: rgba(139,92,246,0.06); }
.light-mode .ob-error-banner { background: rgba(239,68,68,0.06); }
.light-mode .ob-time-flex { color: #1a1a2e; }

/* Loading Page */
.light-mode .ob-loading-title { color: #1a1a2e; }
.light-mode .ob-progress-track { background: rgba(0,0,0,0.06); border-color: rgba(0,0,0,0.06); }
.light-mode .ob-loading-subtext { color: rgba(0,0,0,0.4); }
.light-mode .ob-loader-ring { border-color: rgba(139,92,246,0.15); border-top-color: #8B5CF6; }
.light-mode .ob-loader-inner-ring { border-color: rgba(139,92,246,0.08); border-bottom-color: #C084FC; }

/* Email Step */
.light-mode .ob-input { background: #fff; border-color: rgba(0,0,0,0.12); color: #1a1a2e; }
.light-mode .ob-input:focus { border-color: #8B5CF6; background: #faf8ff; }
.light-mode .ob-input::placeholder { color: rgba(0,0,0,0.3); }

/* Reading Page */
.light-mode .ob-pill { background: #f8f7ff; border-color: rgba(139,92,246,0.12); }
.light-mode .ob-pill-label { color: rgba(0,0,0,0.45); }
.light-mode .ob-pill-value { color: #1a1a2e !important; }
.light-mode .ob-insight-card { background: #f8f7ff; border-color: rgba(139,92,246,0.15); }
.light-mode .ob-insight-header h3 { color: #1a1a2e; }
.light-mode .ob-insight-body { color: rgba(0,0,0,0.75); }

/* Missing/FOMO Page */
.light-mode .ob-locked-card { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-card-title { color: #1a1a2e; }
.light-mode .ob-tease-text { color: rgba(0,0,0,0.5); }
.light-mode .ob-tease-fade { background: linear-gradient(transparent, rgba(248,247,255,0.9), #f8f7ff); }
.light-mode .ob-lock-title { color: #1a1a2e; }
.light-mode .ob-lock-body { color: rgba(0,0,0,0.45); }
.light-mode .ob-icon-circle { background: #f3f0ff; }
.light-mode .ob-fomo-nudge { background: linear-gradient(135deg, rgba(139,92,246,0.06), rgba(99,102,241,0.03)); border-color: rgba(139,92,246,0.15); }
.light-mode .ob-fomo-text { color: #1a1a2e; }
.light-mode .ob-social-proof { background: #f8f7ff; border-color: rgba(139,92,246,0.12); }
.light-mode .ob-social-text { color: rgba(0,0,0,0.6); }
.light-mode .ob-urgency-badge { background: rgba(239,68,68,0.05); border-color: rgba(239,68,68,0.2); }

/* Sales Page V3 */
.light-mode .ob-top-banner { background: #7C3AED; }
.light-mode .ob-product-title { color: #1a1a2e; }
.light-mode .ob-product-subtitle { color: rgba(0,0,0,0.55); }
.light-mode .ob-product-display { background: #f8f7ff; border-color: rgba(0,0,0,0.06); box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.light-mode .ob-info-item { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-info-header { color: #1a1a2e; background: rgba(0,0,0,0.02); }
.light-mode .ob-info-header:hover { background: rgba(0,0,0,0.04); }
.light-mode .ob-info-body { color: rgba(0,0,0,0.6); border-top-color: rgba(0,0,0,0.06); background: rgba(0,0,0,0.02); }
.light-mode .ob-info-body strong { color: #1a1a2e; }
.light-mode .ob-sales-footer-text { color: rgba(0,0,0,0.4); }
.light-mode .ob-trust-tag { color: rgba(0,0,0,0.5); }
.light-mode .ob-timer-simple { color: rgba(0,0,0,0.6); }
.light-mode .ob-sales-title { color: #1a1a2e; }
.light-mode .ob-sales-subtitle { color: rgba(0,0,0,0.55); }
.light-mode .ob-price-label { color: rgba(0,0,0,0.4); }
.light-mode .ob-price-old { color: rgba(0,0,0,0.3); }
.light-mode .ob-price-new { color: #1a1a2e; }
.light-mode .ob-price-urgency { color: rgba(0,0,0,0.55); }

/* Testimonials */
.light-mode .ob-section-title { color: #1a1a2e; }
.light-mode .ob-section-label { color: #1a1a2e; }
.light-mode .ob-testimonial-card { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-testimonial-card:hover { background: #f3f0ff; }
.light-mode .ob-testimonial-text { color: #1a1a2e; }
.light-mode .ob-stars-row { color: #F59E0B; }
.light-mode .ob-testimonial-card p { color: #333; }
.light-mode .ob-author { color: rgba(0,0,0,0.5); }
.light-mode .ob-testimonial-author { color: rgba(0,0,0,0.5); }
.light-mode .ob-verified-badge { color: #7C3AED; }

/* Selection Cards */
.light-mode .ob-selection-card { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-selection-card:hover { background: #f3f0ff; }
.light-mode .ob-selection-card.active { border-color: rgba(139,92,246,0.5); background: rgba(139,92,246,0.06); }
.light-mode .ob-selection-card h3 { color: #1a1a2e; }
.light-mode .ob-selection-card p { color: rgba(0,0,0,0.5); }

/*  *  *  *  CONVERSION MACHINE WHITE OVERRIDES  *  *  *  */
.light-mode .ob-hero-name-tag { background: rgba(139,92,246,0.95); }
.light-mode .ob-social-proof-bar { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-proof-item { color: rgba(0,0,0,0.6); }
.light-mode .ob-proof-divider { color: rgba(0,0,0,0.12); }
.light-mode .ob-sales-main-title { color: #1a1a2e; }
.light-mode .ob-sales-main-sub { color: rgba(0,0,0,0.55); }
.light-mode .ob-inside-card { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-inside-card:hover { background: #f3f0ff; border-color: rgba(139,92,246,0.2); }
.light-mode .ob-inside-card h3 { color: #1a1a2e; }
.light-mode .ob-inside-card p { color: rgba(0,0,0,0.5); }
.light-mode .ob-delivery-block { background: #f8f7ff; border-color: rgba(139,92,246,0.12); }
.light-mode .ob-delivery-text h3 { color: #1a1a2e; }
.light-mode .ob-delivery-text p { color: rgba(0,0,0,0.55); }
.light-mode .ob-price-anchor { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-price-label-final { color: #1a1a2e; }
.light-mode .ob-price-number { color: #1a1a2e; text-shadow: none; }
.light-mode .ob-price-cents { color: rgba(0,0,0,0.4); }
.light-mode .ob-trust-item { color: rgba(0,0,0,0.45); }
.light-mode .ob-final-cta-block { background: #f8f7ff; border-color: rgba(139,92,246,0.12); }
.light-mode .ob-final-cta-title { color: #1a1a2e; }
.light-mode .ob-final-cta-sub { color: rgba(0,0,0,0.45); }
.light-mode .ob-price-old-final { color: rgba(0,0,0,0.25); }
.light-mode .ob-price-arrow { color: rgba(0,0,0,0.2); }
.light-mode .ob-final-urgency { color: rgba(0,0,0,0.55); }

.light-mode .ob-final-product-preview { border-radius: 20px; }
.light-mode .ob-final-book-img { filter: drop-shadow(0 15px 30px rgba(139,92,246,0.2)); }

/* Checkout Section - light bg */
.light-mode .ob-final-checkout-console { background: #f8f7ff; backdrop-filter: none; box-shadow: 0 4px 16px rgba(0,0,0,0.06); border-color: rgba(0,0,0,0.06); }
.light-mode .ob-final-checkout-console h3 { color: #1a1a2e; }
.light-mode .ob-checkout-section { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-trust-badges { color: rgba(0,0,0,0.4); }
.light-mode .ob-trust-badge { color: rgba(0,0,0,0.45); }
.light-mode .ob-loading-payment p { color: rgba(0,0,0,0.5); }
.light-mode .ob-price-section { background: #f8f7ff; }
.light-mode .ob-price-container { background: transparent; }

/* Footer */
.light-mode .ob-footer { 
  background: #ffffff !important; 
  border-top: 1px solid rgba(0,0,0,0.05);
}
.ob-footer { background: linear-gradient(transparent, rgba(5,5,16,0.95) 30%); }

/* Dividers & Misc */
.light-mode .ob-divider { background: linear-gradient(90deg, transparent, rgba(0,0,0,0.1), transparent); }
.light-mode .ob-divider-line { background: rgba(0,0,0,0.1); }
.light-mode .ob-price-divider-line { background: linear-gradient(90deg, transparent, rgba(139,92,246,0.2), transparent); }

/* Utility overrides */
.light-mode .ob-highlight-box { background: rgba(139,92,246,0.06); border-color: rgba(139,92,246,0.15); color: #1a1a2e; }
.light-mode .ob-final-checkout-section { background: #f8f7ff; backdrop-filter: none; box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.light-mode .ob-final-checkout-section h3 { color: #1a1a2e; }

/* Splash overrides */
.light-mode .ob-splash-scrim { background: linear-gradient(transparent, rgba(255,255,255,0.75) 40%, #fff 80%); }
.light-mode .ob-app-name { color: #1a1a2e; }
.light-mode .ob-tagline { color: #1a1a2e; }
.light-mode .ob-tag-sub { color: #7C3AED; }

/* Reading page extras */
.light-mode .ob-badge-glow { background: rgba(139,92,246,0.1); color: #7C3AED; }
.light-mode .ob-reveal-item { color: #1a1a2e; }
.light-mode .ob-archetype-badge { color: #1a1a2e; }
.light-mode .ob-archetype-title { color: #1a1a2e; }
.light-mode .ob-badge-error { color: #dc2626; background: rgba(239,68,68,0.06); }
.light-mode .ob-title-locked { color: #1a1a2e; }
.light-mode .ob-lock-card-v3 { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-lock-title-v3 { color: #1a1a2e; }
.light-mode .ob-lock-desc-v3 { color: rgba(0,0,0,0.5); }
.light-mode .ob-lock-tag-v3 { color: rgba(0,0,0,0.3); }
.light-mode .ob-encrypted-section { color: #1a1a2e; }
.light-mode .ob-tipping-point-box { color: #000; }

/* Info accordion light */
.light-mode .ob-info-accordion .ob-info-item { background: #f8f7ff; border-color: rgba(0,0,0,0.06); }
.light-mode .ob-info-accordion .ob-info-header { color: #1a1a2e; }
.light-mode .ob-info-accordion .ob-info-body { color: rgba(0,0,0,0.6); }
.light-mode .ob-info-accordion .ob-info-body p { color: rgba(0,0,0,0.6); }

/* --- BOOK MOCKUP (dark book on light page - product display) --- */
.ob-book-container {
  width: 100%;
  max-width: 320px;
  margin: 0 auto 40px;
  perspective: 1500px;
}

.ob-book-mockup {
  position: relative;
  width: 100%;
  height: 420px;
  background: linear-gradient(135deg, #f8f7ff 0%, #ffffff 100%);
  border-radius: 20px;
  box-shadow: 0 25px 50px rgba(139, 92, 246, 0.12), 0 10px 20px rgba(0, 0, 0, 0.05);
  display: flex;
  transition: transform 0.5s ease;
  overflow: hidden;
  border: 1px solid rgba(139, 92, 246, 0.15);
}


.ob-book-content {
  flex: 1;
  padding: 50px 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: center;
  position: relative;
}

.ob-book-content::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 30%, rgba(139, 92, 246, 0.1) 0%, transparent 70%);
  pointer-events: none;
}

.ob-book-logo {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 4px;
  color: #8B5CF6;
  margin-bottom: 20px;
}

.ob-book-decoration {
  margin: 20px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ob-book-seal {
  width: 60px;
  height: 60px;
  background: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 4px double #F59E0B;
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.2);
}

.ob-book-footer {
  border-top: 1px solid rgba(0,0,0,0.06);
  padding-top: 20px;
}

.ob-book-title {
  font-family: 'Cinzel', serif;
  font-size: 28px;
  font-weight: 700;
  color: #1a1a2e;
  line-height: 1.2;
  margin-bottom: 12px;
  text-shadow: none;
}

.ob-book-subtitle {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: rgba(0, 0, 0, 0.5);
  text-transform: uppercase;
  margin: 0;
}

.ob-book-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 20px;
}

.ob-book-author {
  font-size: 8px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.4);
  letter-spacing: 2px;
  margin-bottom: 4px;
}

.ob-book-name {
  font-size: 14px;
  font-weight: 800;
  color: #8B5CF6;
  letter-spacing: 1px;
}



/* Features Section */
.ob-features-section { margin: 48px 0; padding: 0 16px; }
.ob-features-list { display: flex; flex-direction: column; gap: 32px; list-style: none; padding: 0; margin: 0; }
.ob-feature-item { display: flex; align-items: flex-start; gap: 20px; }
.ob-feature-icon-box { 
  width: 48px; height: 48px; border-radius: 14px; 
  background: rgba(139, 92, 246, 0.05); 
  display: flex; align-items: center; justify-content: center; 
  flex-shrink: 0; border: 1px solid rgba(139, 92, 246, 0.1); 
}
.light-mode .ob-feature-icon-box { background: #f5f3ff; border-color: #ede9fe; }
.ob-feature-text { flex: 1; }
.ob-feature-name { display: block; font-size: 18px; font-weight: 800; color: #1a1a2e; margin-bottom: 4px; }
.ob-feature-desc { display: block; font-size: 14px; color: rgba(0,0,0,0.55); line-height: 1.6; }

/* Process Section */
.ob-process-section { background: #f9fafb; padding: 48px 24px; border-radius: 32px; margin: 40px 0; border: 1px solid rgba(0,0,0,0.04); }
.ob-process-steps { display: flex; flex-direction: column; gap: 40px; }
.ob-process-step { display: flex; gap: 20px; }
.ob-step-num-col { display: flex; flex-direction: column; align-items: center; }
.ob-step-number { 
  width: 32px; height: 32px; border-radius: 50%; 
  background: #8B5CF6; color: #fff; 
  display: flex; align-items: center; justify-content: center; 
  font-size: 14px; font-weight: 800; 
}
.ob-step-line { width: 2px; flex: 1; background: #e5e7eb; margin-top: 8px; }
.ob-step-text { flex: 1; padding-top: 4px; }
.ob-step-title { font-size: 16px; font-weight: 800; color: #1a1a2e; margin-bottom: 6px; }
.ob-step-desc { font-size: 14px; color: rgba(0,0,0,0.5); line-height: 1.5; }

/* Precise Calculation Box */
.ob-precision-box {
  background: rgba(139, 92, 246, 0.05);
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 20px;
  padding: 24px;
  margin: 30px 0;
}
.ob-precision-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.ob-precision-header h3 {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 2px;
  color: #1a1a2e;
}
.ob-precision-box p {
  font-size: 13px;
  line-height: 1.6;
  color: rgba(0, 0, 0, 0.6);
}

/* Standard List */
.ob-list-standard { list-style: none; padding: 0; margin: 0 0 16px 0; }
.ob-list-standard li { position: relative; padding-left: 24px; margin-bottom: 12px; font-size: 14px; color: rgba(0,0,0,0.6); line-height: 1.5; }
.ob-list-standard li strong { color: #1a1a2e; }

/* Enhanced Footer Links */
.ob-footer-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.ob-footer-links button {
  background: none;
  border: none;
  color: rgba(0, 0, 0, 0.4);
  font-size: 11px;
  cursor: pointer;
  text-decoration: underline;
  padding: 5px;
  transition: color 0.2s;
}
.ob-footer-links button:hover {
  color: #1a1a2e;
}
.ob-dot {
  width: 3px;
  height: 3px;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
}

.ob-sales-footer-text {
  text-align: center;
  padding: 40px 20px 100px;
  color: rgba(0, 0, 0, 0.35);
  font-size: 12px;
}


/* Ultimate Badge */
.ob-ultimate-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  color: #F59E0B;
  padding: 6px 14px;
  border-radius: 100px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  margin-bottom: 16px;
  text-transform: uppercase;
}


/* Locked Card V3 (Premium Encrypted Look) */
.ob-lock-grid-v3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  width: 100%;
}
.ob-lock-card-v3 {
  background: #f8f7ff;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease;
}
.ob-lock-card-v3:hover {
  transform: scale(1.02);
  border-color: rgba(139, 92, 246, 0.3);
}
.ob-lock-glow {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.05) 0%, transparent 70%);
  pointer-events: none;
}
.ob-lock-icon-v3 {
  width: 52px;
  height: 52px;
  background: rgba(0, 0, 0, 0.04);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(0, 0, 0, 0.4);
  flex-shrink: 0;
}
.ob-lock-info-v3 {
  flex: 1;
}
.ob-lock-title-v3 {
  font-size: 16px;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 4px;
}
.ob-lock-desc-v3 {
  font-size: 13px;
  color: rgba(0, 0, 0, 0.6);
  line-height: 1.4;
}
.ob-lock-tag-v3 {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  color: #EF4444;
  background: rgba(239, 68, 68, 0.1);
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid rgba(239, 68, 68, 0.2);
}

.ob-badge-error {
  background: rgba(239, 68, 68, 0.1);
  color: #EF4444;
  padding: 8px 16px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 2px;
  border: 1px solid rgba(239, 68, 68, 0.3);
  display: inline-block;
}

/* Sticky Footer Spacing Fix */
.ob-sticky-footer {
  padding-bottom: 40px !important;
}

@media (min-width: 600px) {
  .ob-lock-grid-v3 {
    grid-template-columns: 1fr 1fr;
  }
}


/* Premium Reveal Divider */
.ob-premium-reveal-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  position: relative;
  padding: 10px 0;
  margin: 32px 0;
}
.ob-premium-reveal-divider span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2px;
  color: rgba(0, 0, 0, 0.3);
  text-transform: uppercase;
}
.ob-divider-glow {
  position: absolute;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.08), transparent);
  top: 50%;
}

/* Spacing Utilities */
.ob-mt-4 { margin-top: 16px; }
.ob-mt-8 { margin-top: 32px; }
.ob-mt-12 { margin-top: 48px; }
.ob-mt-16 { margin-top: 64px; }
.ob-mb-4 { margin-bottom: 16px; }
.ob-mb-8 { margin-bottom: 32px; }
.ob-mb-12 { margin-bottom: 48px; }
.ob-mb-16 { margin-bottom: 64px; }
.ob-pb-24 { padding-bottom: 96px; }

.ob-reading-page {
  padding-bottom: 120px;
}

.ob-tipping-point-box {
  margin: 48px 0;
}

.ob-cta-container-v2 {
  margin: 64px 0;
  text-align: center;
}

.ob-encrypted-section {
  margin-top: 64px;
  text-align: center;
}

.ob-title-locked {
  margin-top: 24px;
  margin-bottom: 16px;
  font-size: 1.6rem;
  color: #1a1a2e;
}



/* --- FINAL CHECKOUT CONSOLE --- */
.ob-final-checkout-console {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 32px;
  overflow: hidden;
  margin: 40px -10px;
  text-align: left;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 10;
}

@media (max-width: 480px) {
  .ob-final-checkout-console {
    margin-left: -20px;
    margin-right: -20px;
    border-radius: 24px;
    border-left: none;
    border-right: none;
  }
}

.ob-checkout-header {
  background: #f9fafb;
  padding: 24px 32px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.ob-checkout-header h3 {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 2px;
  color: #1a1a2e;
  flex: 1;
  margin: 0;
}

.ob-ssl-badge {
  font-size: 10px;
  font-weight: 900;
  background: rgba(16, 185, 129, 0.1);
  color: #10B981;
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.ob-checkout-body {
  padding: 32px 24px;
}

.ob-order-summary {
  background: #f9fafb;
  border: 1px solid rgba(0, 0, 0, 0.04);
  border-radius: 20px;
  padding: 24px;
  margin-bottom: 32px;
}

.ob-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 12px;
}

.ob-text-purple { color: #8B5CF6 !important; }
.ob-text-amber { color: #F59E0B !important; }
.ob-text-blue { color: #3B82F6 !important; }
.ob-text-highlight { color: #8B5CF6; font-weight: 700; }

.ob-summary-row.discount {
  color: #10B981;
  font-weight: 600;
}

.ob-summary-divider {
  height: 1px;
  background: rgba(0, 0, 0, 0.08);
  margin: 16px 0;
}

.ob-summary-row.total {
  margin-bottom: 0;
  color: #1a1a2e;
  font-weight: 800;
  font-size: 20px;
}

.ob-contact-display {
  margin-bottom: 32px;
  padding: 0 4px;
}

.ob-contact-label {
  font-size: 10px;
  font-weight: 800;
  color: rgba(0, 0, 0, 0.4);
  letter-spacing: 1.5px;
  margin-bottom: 6px;
}

.ob-contact-email {
  font-size: 16px;
  color: #1a1a2e;
  font-weight: 600;
}

.ob-payment-method-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding: 0 4px;
}

.ob-payment-method-header span {
  font-size: 10px;
  font-weight: 800;
  color: rgba(0, 0, 0, 0.4);
  letter-spacing: 1.5px;
}

.ob-payment-icons {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ob-payment-icons img {
  opacity: 0.8;
  filter: brightness(1.2);
}

.ob-apple-pay-icon {
  background: #fff;
  color: #000;
  font-weight: 900;
  padding: 3px 10px;
  border-radius: 6px;
  font-size: 11px;
  line-height: 1;
  display: flex;
  align-items: center;
  height: 14px;
}

.ob-checkout-footer {
  background: #f9fafb;
  padding: 24px 32px;
  text-align: center;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.ob-guarantee-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 900;
  color: #10B981;
  margin-bottom: 8px;
  letter-spacing: 1.5px;
}

.ob-checkout-footer p {
  font-size: 11px;
  color: rgba(0, 0, 0, 0.4);
  margin: 0;
  line-height: 1.5;
}

.ob-stripe-container {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(139, 92, 246, 0.1);
  border-radius: 20px;
  padding: 4px;
  margin-top: 12px;
}

.ob-loading-payment {
  padding: 40px 0;
  text-align: center;
}

/* ob-spinner defined once at bottom of file */

.ob-loading-payment p {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
  color: rgba(0, 0, 0, 0.4);
}

/* Transformation Grid: Side-by-Side */
.ob-transformation-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 40px;
}

@media (max-width: 768px) {
  .ob-transformation-grid {
    grid-template-columns: 1fr;
  }
}

.ob-trans-card {
  background: rgba(10, 10, 26, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  overflow: hidden;
}

.ob-trans-card.before {
  border-left: 4px solid #ef4444;
}

.ob-trans-card.after {
  border-left: 4px solid #10b981;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(16, 185, 129, 0.1);
}

.ob-trans-card.after .ob-trans-label,
.ob-trans-card.after .ob-trans-item p {
  color: #1a1a2e;
}

/* Pricing Breakdown Section Improvements */
.ob-pricing-table {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 32px;
}

.ob-price-row {
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 0.95rem;
}

.ob-price-row:last-child {
  border-bottom: none;
  padding-top: 16px;
  font-weight: 700;
  font-size: 1.2rem;
  color: #E8E8F0;
}

.ob-price-row.discount {
  color: #10b981;
}

.ob-price-label { color: #9898B0; }
.ob-price-val { font-family: 'Cinzel', serif; }
.ob-price-val.strike { text-decoration: line-through; opacity: 0.5; }

.ob-badge-verified {
  background: rgba(16, 185, 129, 0.1);
  color: #10B981;
  border: 1px solid rgba(16, 185, 129, 0.3);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  box-shadow: 0 0 15px rgba(16, 185, 129, 0.1);
  text-shadow: 0 0 5px rgba(16, 185, 129, 0.5);
}

/*  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  * 
   SALES PAGE V5 - CONVERSION-OPTIMIZED
    *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  *  */

/* Timer bar at top of hero */
.ob-timer-bar-top {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: rgba(239, 68, 68, 0.08);
  border: 1px solid rgba(239, 68, 68, 0.2);
  color: #DC2626;
  padding: 10px 20px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-bottom: 32px;
  animation: pulse-soft 2s ease-in-out infinite;
}
@keyframes pulse-soft {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

/* Bold claim headline */
.ob-sales-headline {
  font-family: 'Outfit', sans-serif;
  font-size: clamp(2rem, 7vw, 3rem);
  font-weight: 900;
  color: #1a1a2e;
  line-height: 1.1;
  margin: 0 0 20px;
  letter-spacing: -1.5px;
}
.ob-text-gradient-purple {
  background: linear-gradient(135deg, #8B5CF6, #D946EF, #A855F7);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Hero CTA */
.ob-hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 18px 40px;
  border: none;
  border-radius: 16px;
  background: linear-gradient(135deg, #8B5CF6, #7C3AED);
  color: #fff;
  font-family: 'Outfit', sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 2px;
  cursor: pointer;
  box-shadow: 0 10px 40px rgba(139, 92, 246, 0.4);
  transition: transform 0.2s, box-shadow 0.2s;
  margin-top: 8px;
}
.ob-hero-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 50px rgba(139, 92, 246, 0.5);
}

.ob-micro-proof {
  font-size: 13px;
  color: rgba(26,26,46,0.45);
  margin-top: 16px;
  font-weight: 500;
}

/* Pricing Hero Row - side by side original/final */
.ob-price-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.ob-price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}

.ob-price-total {
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding-top: 16px;
  margin-top: 4px;
}

.ob-price-label {
  font-size: 15px;
  font-weight: 500;
  color: #86868b;
}

.ob-price-value {
  font-size: 17px;
  font-weight: 600;
  color: #1d1d1f;
}

.ob-price-value.strike {
  text-decoration: line-through;
  color: #86868b;
  font-weight: 400;
}

.ob-price-value.main {
  font-size: 32px;
  font-weight: 700;
  color: #1d1d1f;
  letter-spacing: -0.02em;
}

.ob-price-currency {
  font-size: 14px;
  font-weight: 600;
  color: #86868b;
  margin-left: 4px;
}

.ob-savings-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: #f5f5f7;
  color: #8B5CF6;
  padding: 10px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  margin-top: 8px;
}

.ob-checkout-trust-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px;
  background: rgba(16, 185, 129, 0.04);
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  font-size: 13px;
  color: #10b981;
  font-weight: 600;
}

.ob-price-main-wrap {
  display: flex;
  align-items: baseline;
}

/* Savings pill */
.ob-savings-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.25);
  color: #059669;
  padding: 8px 20px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
}

/* Checkout divider */
.ob-checkout-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 28px 0 24px;
  color: rgba(26,26,46,0.35);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
}
.ob-divider-line {
  flex: 1;
  height: 1px;
  background: rgba(26,26,46,0.1);
}

/* NEW PREMIUM TRUST STYLES */
.ob-checkout-trust-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: rgba(16, 185, 129, 0.05);
  padding: 8px;
  border-radius: 8px;
  margin: 12px 0;
  border: 1px solid rgba(16, 185, 129, 0.1);
}

.ob-checkout-trust-header span {
  font-size: 12px;
  font-weight: 700;
  color: #10b981;
}

.ob-guarantee-badge-container {
  margin-top: 24px;
  padding: 16px;
  background: #f9fafb;
  border-radius: 16px;
  border: 1px dashed #e5e7eb;
}

.ob-guarantee-seal {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ob-guarantee-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ob-guarantee-text strong {
  font-size: 13px;
  font-weight: 800;
  color: #1a1a2e;
  letter-spacing: 0.5px;
}

.ob-guarantee-text span {
  font-size: 11px;
  color: #6b7280;
  line-height: 1.4;
}

.ob-payment-methods-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 24px;
  opacity: 1;
  filter: grayscale(0);
  transition: opacity 0.3s, filter 0.3s;
}

.ob-secure-badges {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #f3f4f6;
}

.ob-secure-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: #9ca3af;
}

/* SUCCESS PAGE & BONUS QUESTIONS */
.ob-success-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 0;
  text-align: center;
}

.ob-success-card {
  width: 100%;
  max-width: 500px;
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(16px);
  padding: 48px 32px;
  border-radius: 32px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(139, 92, 246, 0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
}

.ob-success-check-wrapper {
  position: relative;
  width: 90px;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ob-success-check-circle {
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  box-shadow: 0 10px 25px rgba(139, 92, 246, 0.3);
  animation: ob-check-pop 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

.ob-success-check-ring {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 2px solid #8B5CF6;
  border-radius: 50%;
  opacity: 0;
  animation: ob-ring-pulse 2s infinite;
}

@keyframes ob-check-pop {
  0% { transform: scale(0); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

@keyframes ob-ring-pulse {
  0% { transform: scale(0.9); opacity: 0.6; }
  100% { transform: scale(1.4); opacity: 0; }
}

.ob-title-premium {
  font-family: 'Cinzel', serif;
  font-size: 28px;
  font-weight: 800;
  color: #E8E8F0;
  margin-bottom: 12px;
  letter-spacing: -0.5px;
}

.ob-subtitle-premium {
  font-size: 16px;
  color: #9898B0;
  line-height: 1.6;
  max-width: 400px;
  margin: 0 auto;
}

.ob-success-next-steps {
  width: 100%;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 20px;
  padding: 24px;
  margin: 32px 0;
  text-align: left;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.ob-next-title {
  font-size: 11px;
  font-weight: 800;
  color: #8B5CF6;
  letter-spacing: 1.5px;
  margin-bottom: 16px;
  text-transform: uppercase;
}

.ob-step-item {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
}

.ob-step-item:last-child {
  margin-bottom: 0;
}

.ob-step-num {
  width: 24px;
  height: 24px;
  background: rgba(139, 92, 246, 0.1);
  color: #8B5CF6;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex-shrink: 0;
}

.ob-step-text {
  font-size: 14px;
  color: #E8E8F0;
  line-height: 1.5;
}

.ob-success-support {
  font-size: 13px;
  color: #9ca3af;
  text-align: center;
}

.ob-support-link {
  display: block;
  color: #8B5CF6;
  font-weight: 700;
  text-decoration: none;
  margin-top: 4px;
  transition: opacity 0.2s;
}

.ob-support-link:hover {
  opacity: 0.8;
}

.ob-bonus-questions-card {
  width: 100%;
  max-width: 440px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 24px;
  padding: 32px 24px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.05);
  margin: 32px 0;
  position: relative;
  text-align: left;
}

.ob-bonus-badge {
  display: inline-block;
  background: #F59E0B;
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1.5px;
  padding: 4px 12px;
  border-radius: 100px;
  margin-bottom: 16px;
}

.ob-bonus-title {
  font-size: 20px;
  font-weight: 800;
  color: #1a1a2e;
  margin-bottom: 8px;
}

.ob-bonus-desc {
  font-size: 14px;
  color: #6b7280;
  line-height: 1.5;
  margin-bottom: 24px;
}

.ob-questions-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ob-question-input-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f9fafb;
  border: 1px solid #f3f4f6;
  border-radius: 12px;
  padding: 12px 16px;
}

.ob-question-number {
  font-size: 12px;
  font-weight: 800;
  color: #8B5CF6;
  opacity: 0.5;
}

.ob-question-input {
  flex: 1;
  background: transparent;
  border: none;
  font-size: 14px;
  color: #1a1a2e;
  outline: none;
}

.ob-submit-questions-btn {
  width: 100%;
  margin-top: 24px;
  padding: 16px;
  background: #1a1a2e;
  color: #ffffff;
  border: none;
  border-radius: 12px;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 1px;
  cursor: pointer;
  transition: transform 0.2s;
}

.ob-submit-questions-btn:hover {
  transform: translateY(-2px);
}

.ob-questions-confirmed {
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.ob-success-footer {
  margin-top: 40px;
}

.ob-return-btn:hover {
  background: #f9fafb;
}

/* PREMIUM HEADER & VERIFIED LOGO */
.ob-premium-header {
  padding: 24px;
  display: flex;
  justify-content: center;
  width: 100%;
}

.ob-logo-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.ob-logo-text {
  font-family: 'Cinzel', serif;
  font-size: 20px;
  letter-spacing: 4px;
  font-weight: 800;
  color: #1a1a2e;
}

.ob-verified-badge-inline {
  display: flex;
  align-items: center;
  gap: 4px;
  background: rgba(139, 92, 246, 0.05);
  padding: 2px 8px;
  border-radius: 4px;
}

.ob-verified-badge-inline span {
  font-size: 10px;
  font-weight: 700;
  color: #8B5CF6;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* READING REVEAL PERSONALIZATION (PRE-PURCHASE) */
.ob-personalize-section {
  margin: 64px 0;
  width: 100%;
}

.ob-bonus-questions-card-v2 {
  background: rgba(10, 10, 26, 0.4);
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 32px;
  padding: 40px 24px;
  backdrop-filter: blur(10px);
  margin-top: 32px;
  text-align: left;
}

.ob-bonus-badge-v2 {
  display: inline-block;
  background: linear-gradient(135deg, #F59E0B, #D97706);
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  padding: 6px 16px;
  border-radius: 100px;
  margin-bottom: 20px;
  box-shadow: 0 4px 15px rgba(245, 158, 11, 0.3);
}

.ob-bonus-title-v2 {
  font-size: 24px;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 12px;
  font-family: 'Cinzel', serif;
}

.ob-bonus-desc-v2 {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.6;
  margin-bottom: 32px;
}

.ob-questions-stack-v2 {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ob-question-input-wrapper-v2 {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 16px 20px;
  transition: all 0.3s ease;
}

.ob-question-input-wrapper-v2:focus-within {
  border-color: #8B5CF6;
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.1);
  transform: translateX(4px);
}

.ob-question-number-v2 {
  font-size: 14px;
  font-weight: 900;
  color: #8B5CF6;
  opacity: 0.4;
}

.ob-question-input-v2 {
  flex: 1;
  background: transparent;
  border: none;
  font-size: 15px;
  color: #1a1a2e;
  outline: none;
  font-weight: 500;
}

.ob-question-input-v2::placeholder {
  color: #94a3b8;
}

.ob-disclaimer-v2 {
  color: #94a3b8;
  margin-top: 24px;
}

.ob-secondary-cta-v2 {
  width: 100%;
  padding: 16px;
  background: #8B5CF6;
  border: none;
  border-radius: 12px;
  color: #ffffff;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  font-family: 'Inter', sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 14px;
  margin-top: 16px;
  box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
}

.ob-secondary-cta-v2:hover {
  background: #7C3AED;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(139, 92, 246, 0.4);
}


.ob-positive-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.2);
  padding: 4px 10px;
  border-radius: 20px;
  color: #D97706;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* --- LOSS AVERSION SECTION --- */
.ob-loss-aversion-section {
  position: relative;
  margin: 60px 20px;
  padding: 48px 24px;
  background: #050510; /* Deep black */
  border: 1px solid rgba(239, 68, 68, 0.4);
  border-radius: 32px;
  text-align: center;
  overflow: hidden;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.8), 0 0 30px rgba(239, 68, 68, 0.1);
}

.ob-loss-glow {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(239, 68, 68, 0.15) 0%, transparent 60%);
  pointer-events: none;
  animation: pulse-red-glow 4s ease-in-out infinite;
}

.ob-loss-icon {
  color: #ef4444;
  margin-bottom: 24px;
  filter: drop-shadow(0 0 20px rgba(239, 68, 68, 0.8));
}

.ob-loss-title {
  font-family: 'Cinzel', serif;
  font-size: 28px;
  color: #fff;
  margin-bottom: 24px;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.ob-loss-text {
  color: #E8E8F0; /* Brighter text */
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 32px;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.9;
}

.ob-shadow-reminder-v2 {
  background: rgba(0, 0, 0, 0.4);
  padding: 28px 24px;
  border-radius: 24px;
  border: 1px solid rgba(239, 68, 68, 0.3);
  position: relative;
  margin-bottom: 32px;
  box-shadow: inset 0 0 20px rgba(239, 68, 68, 0.1);
}

.ob-shadow-reminder-v2 p {
  color: #fff;
  font-style: italic;
  font-size: 19px;
  line-height: 1.6;
  font-family: 'Inter', sans-serif;
  opacity: 1;
}

.ob-loss-footer {
  color: #ef4444;
  font-weight: 900;
  font-size: 14px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* --- PRICE ANCHORING SECTION --- */
.ob-anchoring-section {
  margin: 100px 20px 80px;
}

.ob-anchor-title {
  font-family: 'Cinzel', serif;
  text-align: center;
  font-size: 24px;
  color: #fff;
  margin-bottom: 48px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.ob-anchor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.ob-anchor-card {
  padding: 40px 24px;
  border-radius: 32px;
  background: #0A0A1A; /* Sacred Void Surface */
  border: 1px solid rgba(255, 255, 255, 0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.ob-anchor-card.secondary {
  opacity: 0.4;
  filter: grayscale(1);
  transform: scale(0.95);
}

.ob-anchor-card.primary {
  background: linear-gradient(180deg, #0A0A1A 0%, #12122A 100%);
  border: 1px solid rgba(139, 92, 246, 0.6);
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.6), 0 0 30px rgba(139, 92, 246, 0.1);
  transform: scale(1.08);
  z-index: 5;
}

.ob-best-value {
  position: absolute;
  top: -16px;
  background: linear-gradient(90deg, #F59E0B, #D97706);
  color: #000;
  font-size: 11px;
  font-weight: 900;
  padding: 8px 20px;
  border-radius: 30px;
  letter-spacing: 1.5px;
  box-shadow: 0 4px 20px rgba(245, 158, 11, 0.5);
  text-transform: uppercase;
}

.ob-anchor-card h4 {
  font-size: 13px;
  color: #9898B0;
  margin-bottom: 16px;
  text-align: center;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.ob-anchor-price {
  font-size: 42px;
  font-weight: 900;
  color: #fff;
  margin-bottom: 28px;
  font-family: 'Cinzel', serif;
  text-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
}

.ob-anchor-list {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.ob-anchor-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: #9898B0;
  margin-bottom: 18px;
  line-height: 1.4;
}

.ob-anchor-list li svg {
  flex-shrink: 0;
  color: #4B5563;
}

.ob-anchor-card.primary .ob-anchor-list li {
  color: #fff;
  font-weight: 600;
}

.ob-anchor-card.primary .ob-anchor-list li svg {
  color: #8B5CF6;
  filter: drop-shadow(0 0 5px rgba(139, 92, 246, 0.5));
}

/* --- GUARANTEE BOX --- */
.ob-guarantee-box {
  margin-top: 40px;
  padding: 24px;
  background: rgba(245, 158, 11, 0.05);
  border: 1px solid rgba(245, 158, 11, 0.2);
  border-radius: 20px;
  display: flex;
  gap: 20px;
  align-items: center;
}

.ob-guarantee-icon-wrapper {
  flex-shrink: 0;
}

.ob-guarantee-content h3 {
  font-family: 'Cinzel', serif;
  font-size: 18px;
  color: #F59E0B;
  margin-bottom: 8px;
}

.ob-guarantee-content p {
  color: #9898B0;
  font-size: 13px;
  line-height: 1.6;
}

@media (max-width: 480px) {
  .ob-anchor-grid {
    grid-template-columns: 1fr;
  }
  
  .ob-anchor-card.secondary {
    transform: none;
    order: 2;
  }
  
  .ob-anchor-card.primary {
    order: 1;
  }
}

/* --- SCARCITY BANNER --- */
.ob-scarcity-banner {
  background: rgba(245, 158, 11, 0.1);
  border-bottom: 1px solid rgba(245, 158, 11, 0.2);
  padding: 10px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 700;
  color: #F59E0B;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.ob-pulse-dot {
  width: 6px;
  height: 6px;
  background: #F59E0B;
  border-radius: 50%;
  animation: ob-pulse-glow 2s infinite;
}

@keyframes ob-pulse-glow {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(245, 158, 11, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
}


/* --- EARLY PERSONALIZATION TOGGLE --- */
.ob-personalization-trigger {
  width: 100%;
}

.ob-toggle-btn {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px;
  background: rgba(139, 92, 246, 0.05);
  border: 1px dashed rgba(139, 92, 246, 0.3);
  border-radius: 12px;
  color: #7C3AED; /* Deep purple for light mode visibility */
  transition: all 0.3s ease;
  cursor: pointer;
}

.ob-toggle-btn:hover {
  background: rgba(139, 92, 246, 0.1);
  border-color: #8B5CF6;
}

.ob-toggle-btn.active {
  background: rgba(139, 92, 246, 0.1);
  border-style: solid;
  border-color: #8B5CF6;
}

.ob-questions-dropdown {
  background: rgba(139, 92, 246, 0.03);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(139, 92, 246, 0.1);
  border-radius: 16px;
  padding: 24px;
  margin-top: 12px;
}

.ob-questions-stack-mini {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ob-question-input-wrapper-mini {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #0A0A1A;
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 12px;
  padding: 12px 16px;
  transition: all 0.2s ease;
}

.ob-question-input-wrapper-mini:focus-within {
  border-color: #8B5CF6;
  box-shadow: 0 0 10px rgba(139, 92, 246, 0.2);
}

.ob-question-num {
  font-size: 11px;
  font-weight: 900;
  color: #8B5CF6;
  opacity: 0.5;
  width: 14px;
}

.ob-input-field-mini {
  background: transparent;
  border: none;
  color: #fff;
  font-size: 14px;
  width: 100%;
  outline: none;
  font-family: inherit;
}

.ob-input-field-mini::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

/* --- ORDER VERIFICATION SECTION --- */
.ob-verification-section {
  margin: 60px 20px 40px;
}

/* Dark funnel fixes for loader + lead capture */
.ob-loading-page .ob-loading-content {
  margin-top: 18px;
}

.ob-loading-page .ob-loading-subtext {
  color: #b7b3d1;
  font-weight: 500;
}

.ob-loading-page .ob-progress-track {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(139, 92, 246, 0.12);
}

.ob-email-page {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 24px 0 56px;
  text-align: center;
}

.ob-email-page .ob-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(139, 92, 246, 0.12);
  border: 1px solid rgba(139, 92, 246, 0.22);
  color: #c4b5fd;
  letter-spacing: 2px;
}

.ob-email-page .ob-title {
  margin-bottom: 14px;
}

.ob-email-page .ob-body {
  max-width: 420px;
  margin: 0 auto 24px;
  color: #b8b3d0;
}

.ob-email-page .ob-form-card {
  background:
    radial-gradient(circle at top, rgba(139, 92, 246, 0.14), transparent 52%),
    rgba(9, 8, 24, 0.92);
  border: 1px solid rgba(139, 92, 246, 0.22);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
  padding: 24px;
  margin: 20px 0 18px;
}

.ob-email-page .ob-field label {
  color: #b6afd3;
}

.ob-email-page .ob-input {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(139, 92, 246, 0.18);
  color: #f5f3ff;
}

.ob-email-page .ob-input::placeholder {
  color: rgba(232, 232, 240, 0.42);
}

.ob-email-page .ob-input:focus {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.12);
}

.ob-email-page .text-center.text-xs.text-gray-500.mt-4 {
  color: #9d97ba;
  font-size: 12px;
  margin-top: 16px;
}

.ob-verification-card {
  background: #0A0A1A;
  border: 1px solid rgba(139, 92, 246, 0.3);
  border-radius: 32px;
  padding: 40px 24px;
  position: relative;
  overflow: hidden;
  text-align: left;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
}

.ob-verification-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: #8B5CF6;
}

.ob-verification-header {
  margin-bottom: 24px;
}

.ob-status-badge {
  display: inline-block;
  color: #10b981;
  font-size: 10px;
  font-weight: 900;
  padding: 4px 12px;
  border-radius: 20px;
  letter-spacing: 1px;
  margin-bottom: 12px;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.ob-verification-header h3 {
  font-family: 'Cinzel', serif;
  font-size: 20px;
  color: #fff;
  letter-spacing: 0.5px;
}

.ob-verification-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 32px;
  padding: 20px;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 16px;
}

.ob-v-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ob-v-label {
  font-size: 10px;
  color: #9898B0;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.ob-v-value {
  font-size: 16px;
  color: #fff;
  font-weight: 500;
}

.ob-v-footer {
  text-align: center;
}

.ob-v-footer p {
  color: #9898B0;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 20px;
}

.ob-scarcity-banner {
  background: rgba(5, 5, 16, 0.95);
  backdrop-filter: blur(10px);
  padding: 12px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 1000;
  height: 60px;
}

.ob-nav-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ob-nav-logo {
  font-family: 'Cinzel', serif;
  font-weight: 800;
  letter-spacing: 2px;
  color: #fff;
  font-size: 14px;
}

.ob-nav-center {
  flex: 1;
  display: flex;
  justify-content: center;
}

.ob-status-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(139, 92, 246, 0.1);
  padding: 6px 14px;
  border-radius: 30px;
  border: 1px solid rgba(139, 92, 246, 0.2);
}

.ob-status-dot {
  width: 6px;
  height: 6px;
  background: #C084FC;
  border-radius: 50%;
  box-shadow: 0 0 10px #C084FC;
  animation: pulse-dot 2s infinite;
}

.ob-status-text {
  font-size: 10px;
  font-weight: 900;
  color: #C084FC;
  letter-spacing: 1px;
}

.ob-nav-right {
  display: flex;
  align-items: center;
}

.ob-nav-timer {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #ef4444;
  font-weight: 700;
  font-size: 14px;
  background: rgba(239, 68, 68, 0.1);
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid rgba(239, 68, 68, 0.2);
}

/* Edit Mode Styles */
.ob-v-input {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(139, 92, 246, 0.4);
  color: #fff;
  padding: 10px 16px;
  border-radius: 12px;
  font-size: 16px;
  width: 100%;
  outline: none;
  font-family: 'Inter', sans-serif;
  transition: all 0.2s ease;
}

.ob-v-input:focus {
  border-color: #8B5CF6;
  box-shadow: 0 0 15px rgba(139, 92, 246, 0.2);
  background: rgba(255, 255, 255, 0.08);
}

/* --- APPLE-STYLE VERIFICATION REWRITE --- */
.apple-v-section {
  max-width: 600px;
  margin: 40px auto;
  padding: 0 20px;
  background: transparent;
}

.apple-v-collapsible {
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 0;
  max-height: 0;
}

.apple-v-collapsible.open {
  opacity: 1;
  max-height: 1200px;
  margin-top: 24px;
}

@media (max-width: 768px) {
  .apple-v-section {
    margin: 30px auto;
    padding: 0 24px;
  }
}

.apple-v-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid #000;
  padding-bottom: 12px;
  margin-bottom: 32px;
  gap: 16px;
}

.apple-v-title {
  font-family: 'Cinzel', serif;
  font-size: 22px;
  font-weight: 700;
  color: #1a1a2e;
  margin: 0;
  letter-spacing: -0.5px;
  flex: 1;
  min-width: 0;
}

@media (max-width: 480px) {
  .apple-v-title {
    font-size: 16px;
  }
}

.apple-v-edit-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: none;
  color: #86868b;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  transition: all 0.2s;
}

.apple-v-edit-btn:hover {
  background: rgba(0, 0, 0, 0.04);
  color: #1d1d1f;
}

.apple-v-toggle-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: none;
  color: #8B5CF6;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.apple-v-instruction {
  font-size: 15px;
  line-height: 1.5;
  color: #64748b;
  margin-bottom: 32px;
}

.apple-v-edit-intro {
  margin-bottom: 32px;
}

.apple-v-edit-h {
  font-size: 18px;
  font-weight: 800;
  color: #1a1a2e;
  margin: 0 0 4px 0;
}

.apple-v-edit-p {
  font-size: 14px;
  color: #94a3b8;
  margin: 0;
}

/* List Items */
.apple-v-list {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.apple-v-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 1px solid #f1f5f9;
  padding-bottom: 16px;
}

.apple-v-item.stack {
  gap: 12px;
}

.apple-v-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: #94a3b8;
  text-transform: uppercase;
}

.apple-v-value {
  font-size: 17px;
  font-weight: 600;
  color: #1a1a2e;
  line-height: 1.4;
}

/* Inputs */
.apple-v-input {
  width: 100%;
  padding: 12px 0;
  background: transparent;
  border: none;
  border-bottom: 2px solid #e2e8f0;
  font-size: 18px;
  font-weight: 600;
  color: #1a1a2e;
  font-family: 'Outfit', sans-serif;
  transition: border-color 0.2s ease;
}

.apple-v-input:focus {
  outline: none;
  border-color: #8B5CF6;
}

.apple-v-time-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.apple-v-checkbox {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #94a3b8;
  cursor: pointer;
}

.apple-v-checkbox input {
  width: 18px;
  height: 18px;
  accent-color: #8B5CF6;
}

/* Search */
.apple-v-search-wrap {
  position: relative;
}

.apple-v-search-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  z-index: 100;
  margin-top: 8px;
}

.apple-v-search-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  border-bottom: 1px solid #f1f5f9;
  font-size: 14px;
  color: #1a1a2e;
}

.apple-v-search-item:hover {
  background: #f8fafc;
  color: #8B5CF6;
}

/* Questions */
.apple-v-q-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.apple-v-input-mini {
  width: 100%;
  padding: 10px 0;
  background: transparent;
  border: none;
  border-bottom: 1px solid #e2e8f0;
  font-size: 14px;
}

.apple-v-q-display {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.apple-v-q-row {
  font-size: 15px;
  color: #475569;
  font-style: italic;
  padding-left: 16px;
  border-left: 2px solid #e2e8f0;
}

.apple-v-empty {
  font-size: 14px;
  color: #cbd5e1;
  font-style: italic;
}

/* Actions */
.apple-v-actions {
  margin-top: 48px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.apple-v-save-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 20px;
  background: #000;
  border: none;
  border-radius: 16px;
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
  transition: transform 0.2s ease;
}

.apple-v-save-btn:active {
  transform: scale(0.98);
}

.apple-v-cancel-btn {
  width: 100%;
  padding: 12px;
  background: transparent;
  border: none;
  color: #94a3b8;
  cursor: pointer;
}

.ob-v-edit-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px;
  background: #fff;
  border: 2px solid #f1f5f9;
  border-radius: 12px;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

/* Status Blink */
.ob-v-engine-status {
  padding: 16px 24px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 10px;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.ob-v-status-blink {
  width: 6px;
  height: 6px;
  background: #10b981;
  border-radius: 50%;
  animation: ob-blink 2s infinite;
}

@keyframes ob-blink {
  0% { opacity: 0.3; }
  50% { opacity: 1; }
  100% { opacity: 0.3; }
}

.ob-v-result-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  color: #E8E8F0;
  font-size: 13px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  transition: all 0.2s ease;
}

.ob-v-result-item:hover {
  background: rgba(139, 92, 246, 0.1);
  color: #fff;
}

.ob-v-questions-section {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.ob-v-questions-edit-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}

.ob-v-input-mini {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 10px 14px;
  color: #fff;
  font-size: 12px;
  width: 100%;
}

.ob-v-questions-display {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ob-v-q-text {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  font-style: italic;
  padding-left: 12px;
  border-left: 2px solid rgba(139, 92, 246, 0.3);
}

.ob-v-q-empty {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.3);
  font-style: italic;}
.ob-container.ob-light-theme {
  --ob-bg: #f6f3ff;
  --ob-bg-2: #ffffff;
  --ob-surface: rgba(255, 255, 255, 0.92);
  --ob-surface-strong: #ffffff;
  --ob-border: rgba(118, 82, 214, 0.14);
  --ob-border-strong: rgba(118, 82, 214, 0.22);
  --ob-text: #050510;
  --ob-text-soft: #2d2a3d;
  --ob-text-faint: #6b6683;
  --ob-purple: #6d28d9;
  --ob-purple-2: #9333ea;
  --ob-shadow: 0 10px 30px rgba(76, 29, 149, 0.08);
  background:
    radial-gradient(circle at top, rgba(192, 132, 252, 0.18), transparent 32%),
    linear-gradient(180deg, #fcfbff 0%, #f5f1ff 45%, #f7f4ff 100%);
  color: var(--ob-text);
}

.ob-container.ob-light-theme .ob-starfield-canvas {
  opacity: 0.18;
  filter: saturate(0.7) brightness(1.15);
  pointer-events: none !important;
  position: fixed;
}

.ob-container.ob-light-theme .ob-content-inner {
  position: relative;
  z-index: 1;
}

.ob-container.ob-light-theme .ob-nav-btn {
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--ob-border);
  color: var(--ob-text);
  box-shadow: 0 12px 28px rgba(76, 29, 149, 0.08);
}

.ob-container.ob-light-theme .ob-hero-content,
.ob-container.ob-light-theme .ob-wizard-step,
.ob-container.ob-light-theme .ob-email-page,
.ob-container.ob-light-theme .ob-loading-page,
.ob-container.ob-light-theme .ob-reading-reveal-white,
.ob-container.ob-light-theme .sp-white-page,
.ob-container.ob-light-theme .ob-success-page {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .ob-hero-title,
.ob-container.ob-light-theme .ob-wizard-title,
.ob-container.ob-light-theme .ob-title,
.ob-container.ob-light-theme .ob-title-premium,
.ob-container.ob-light-theme .rrw-archetype-name,
.ob-container.ob-light-theme .sp-hero-headline,
.ob-container.ob-light-theme .sp-proof-title,
.ob-container.ob-light-theme .sp-section-title,
.ob-container.ob-light-theme .sp-pricing-title,
.ob-container.ob-light-theme .sp-faq-title {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .ob-hero-title .text-gradient,
.ob-container.ob-light-theme .ob-text-gradient-purple,
.ob-container.ob-light-theme .sp-purple-text,
.ob-container.ob-light-theme .text-purple-400 {
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: #4f46e5 !important;
  font-weight: 700;
}

.ob-container.ob-light-theme .ob-hero-card-dark,
.ob-container.ob-light-theme .ob-form-card,
.ob-container.ob-light-theme .rrw-card,
.ob-container.ob-light-theme .rrw-tipping-point,
.ob-container.ob-light-theme .sp-proof-section,
.ob-container.ob-light-theme .sp-conflict-card,
.ob-container.ob-light-theme .sp-solution-feature,
.ob-container.ob-light-theme .sp-feature-item,
.ob-container.ob-light-theme .sp-transform-card,
.ob-container.ob-light-theme .sp-process-step,
.ob-container.ob-light-theme .sp-testimonial-card,
.ob-container.ob-light-theme .sp-pricing-container,
.ob-container.ob-light-theme .sp-faq-item,
.ob-container.ob-light-theme .sp-guarantee-content,
.ob-container.ob-light-theme .sp-payment-methods-v2,
.ob-container.ob-light-theme .sp-stripe-container,
.ob-container.ob-light-theme .ob-success-card {
  background: var(--ob-surface);
  border: 1px solid var(--ob-border);
  box-shadow: var(--ob-shadow);
  backdrop-filter: blur(16px);
}

.ob-container.ob-light-theme .ob-hero-subtitle,
.ob-container.ob-light-theme .ob-wizard-subtitle,
.ob-container.ob-light-theme .ob-body,
.ob-container.ob-light-theme .rrw-archetype-desc,
.ob-container.ob-light-theme .rrw-card-body,
.ob-container.ob-light-theme .sp-hero-sub,
.ob-container.ob-light-theme .sp-proof-sub,
.ob-container.ob-light-theme .sp-proof-text,
.ob-container.ob-light-theme .sp-section-sub,
.ob-container.ob-light-theme .sp-solution-text,
.ob-container.ob-light-theme .sp-step-desc,
.ob-container.ob-light-theme .sp-testimonial-text,
.ob-container.ob-light-theme .sp-faq-body,
.ob-container.ob-light-theme .ob-subtitle-premium,
.ob-container.ob-light-theme .ob-loading-subtext,
.ob-container.ob-light-theme .sp-shot-copy p,
.ob-container.ob-light-theme .sp-phone-footer-note,
.ob-container.ob-light-theme .sp-hero-micro,
.ob-container.ob-light-theme .sp-alert-text {
  color: var(--ob-text-soft);
}

.ob-container.ob-light-theme .ob-input-label,
.ob-container.ob-light-theme .sp-proof-label,
.ob-container.ob-light-theme .sp-conflict-label,
.ob-container.ob-light-theme .sp-features-header,
.ob-container.ob-light-theme .sp-shot-badge,
.ob-container.ob-light-theme .ob-badge,
.ob-container.ob-light-theme .rrw-label {
  color: var(--ob-purple);
}

.ob-container.ob-light-theme .ob-badge,
.ob-container.ob-light-theme .sp-proof-badge,
.ob-container.ob-light-theme .sp-offer-badge,
.ob-container.ob-light-theme .sp-shot-badge,
.ob-container.ob-light-theme .rrw-verified-badge,
.ob-container.ob-light-theme .sp-coupon-badge,
.ob-container.ob-light-theme .sp-guarantee-badge,
.ob-container.ob-light-theme .ob-sun-reveal-badge {
  background: rgba(124, 58, 237, 0.1);
  border: 1px solid rgba(124, 58, 237, 0.16);
  color: var(--ob-purple);
}

.ob-container.ob-light-theme .ob-hero-input-dark,
.ob-container.ob-light-theme .ob-input-massive,
.ob-container.ob-light-theme .ob-input,
.ob-container.ob-light-theme .sp-coupon-field {
  background: rgba(255, 255, 255, 0.96) !important;
  color: var(--ob-text) !important;
  border: 1px solid var(--ob-border) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
}

.ob-container.ob-light-theme .ob-hero-input-dark::placeholder,
.ob-container.ob-light-theme .ob-input-massive::placeholder,
.ob-container.ob-light-theme .ob-input::placeholder,
.ob-container.ob-light-theme .sp-coupon-field::placeholder {
  color: #9691ab;
}

.ob-container.ob-light-theme .ob-hero-input-dark:focus,
.ob-container.ob-light-theme .ob-input-massive:focus,
.ob-container.ob-light-theme .ob-input:focus,
.ob-container.ob-light-theme .sp-coupon-field:focus {
  border-color: rgba(124, 58, 237, 0.45) !important;
  box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.1), 0 10px 30px rgba(124, 58, 237, 0.08) !important;
}

.ob-container.ob-light-theme .ob-hero-cta-dark,
.ob-container.ob-light-theme .ob-wizard-next-btn,
.ob-container.ob-light-theme .ob-primary-btn,
.ob-container.ob-light-theme .ob-mega-cta-v2,
.ob-container.ob-light-theme .sp-hero-cta,
.ob-container.ob-light-theme .sp-coupon-apply-btn {
  background: linear-gradient(135deg, var(--ob-purple) 0%, var(--ob-purple-2) 100%) !important;
  color: #fff !important;
  box-shadow: 0 16px 36px rgba(124, 58, 237, 0.24);
}

.ob-container.ob-light-theme .ob-wizard-next-btn:disabled,
.ob-container.ob-light-theme .ob-hero-cta-dark:disabled,
.ob-container.ob-light-theme .ob-primary-btn:disabled {
  background: #ddd6fe !important;
  color: rgba(74, 52, 120, 0.5) !important;
  box-shadow: none;
}

.ob-container.ob-light-theme .ob-wizard-back-btn,
.ob-container.ob-light-theme .sp-coupon-toggle,
.ob-container.ob-light-theme .sp-footer-links button,
.ob-container.ob-light-theme .sp-email-link {
  color: var(--ob-text-soft);
}

.ob-container.ob-light-theme .ob-progress-track,
.ob-container.ob-light-theme .ob-progress-bar-container {
  background: rgba(124, 58, 237, 0.08);
}

.ob-container.ob-light-theme .ob-progress-fill,
.ob-container.ob-light-theme .ob-progress-bar-fill {
  background: linear-gradient(90deg, var(--ob-purple), var(--ob-purple-2));
}

.ob-container.ob-light-theme .ob-loader-kicker,
.ob-container.ob-light-theme .ob-loader-text,
.ob-container.ob-light-theme .ob-loader-hint,
.ob-container.ob-light-theme .ob-loading-subtext,
.ob-container.ob-light-theme .ob-text-highlight {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .ob-loader-orbit,
.ob-container.ob-light-theme .ob-progress-track {
  background: rgba(124, 58, 237, 0.08);
}

.ob-container.ob-light-theme .ob-loading-page {
  min-height: 100dvh;
  display: grid;
  place-items: center;
}

.ob-container.ob-light-theme .ob-standard-loader-container {
  background:
    radial-gradient(circle at top, rgba(168, 85, 247, 0.14), transparent 48%),
    rgba(255, 255, 255, 0.96);
  border-color: var(--ob-border);
  box-shadow: var(--ob-shadow);
}

.ob-container.ob-light-theme .ob-loader-core {
  background: linear-gradient(135deg, #ede9fe 0%, #a855f7 100%);
}

.ob-container.ob-light-theme .ob-spinner {
  border-color: rgba(124, 58, 237, 0.12);
  border-top-color: var(--ob-purple);
}

.ob-container.ob-light-theme .ob-results-overlay-v3 {
  background: rgba(255,255,255,0.97);
  border: 1px solid var(--ob-border);
  box-shadow: var(--ob-shadow);
}

.ob-container.ob-light-theme .ob-result-item-v3 {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .ob-result-item-v3:hover {
  background: rgba(124, 58, 237, 0.06);
}

.ob-container.ob-light-theme .ob-checkbox-v3 {
  background: rgba(255,255,255,0.9);
  border: 1px solid var(--ob-border);
  color: var(--ob-text-soft);
  padding: 12px 16px;
  border-radius: 999px;
  box-shadow: 0 10px 24px rgba(76, 29, 149, 0.08);
}

.ob-container.ob-light-theme .ob-checkbox-v3 input {
  accent-color: var(--ob-purple);
  background: #ffffff;
}

.ob-container.ob-light-theme .ob-reading-reveal-white,
.ob-container.ob-light-theme .sp-white-page {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .rrw-card-badge.mask {
  background: rgba(124, 58, 237, 0.08);
  color: var(--ob-purple);
}

.ob-container.ob-light-theme .rrw-card-badge.shadow,
.ob-container.ob-light-theme .rrw-critical-alert {
  background: rgba(239, 68, 68, 0.08);
  color: #dc2626;
}

.ob-container.ob-light-theme .rrw-scanner {
  color: var(--ob-text-faint);
}

.ob-container.ob-light-theme .rrw-scanner-bar {
  background: linear-gradient(90deg, transparent, var(--ob-purple), transparent);
}

.ob-container.ob-light-theme .sp-white-page {
  max-width: 680px;
  padding-bottom: 96px;
}

.ob-container.ob-light-theme .sp-purchase-toast {
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--ob-border);
  box-shadow: var(--ob-shadow);
}

.ob-container.ob-light-theme .sp-purchase-toast p {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .sp-proof-item,
.ob-container.ob-light-theme .sp-proof-footer,
.ob-container.ob-light-theme .sp-value-item,
.ob-container.ob-light-theme .sp-price-breakdown,
.ob-container.ob-light-theme .sp-faq-header {
  border-color: rgba(93, 70, 149, 0.1);
}

.ob-container.ob-light-theme .sp-proof-item,
.ob-container.ob-light-theme .sp-feature-item,
.ob-container.ob-light-theme .sp-transform-card,
.ob-container.ob-light-theme .sp-process-step,
.ob-container.ob-light-theme .sp-testimonial-card,
.ob-container.ob-light-theme .sp-faq-item {
  background: var(--ob-surface-strong);
}

.ob-container.ob-light-theme .sp-proof-icon,
.ob-container.ob-light-theme .sp-feature-icon,
.ob-container.ob-light-theme .sp-value-icon,
.ob-container.ob-light-theme .sp-check,
.ob-container.ob-light-theme .sp-faq-arrow,
.ob-container.ob-light-theme .sp-alert-icon {
  color: var(--ob-purple);
}

.ob-container.ob-light-theme .sp-proof-val,
.ob-container.ob-light-theme .sp-feature-name,
.ob-container.ob-light-theme .sp-solution-title,
.ob-container.ob-light-theme .sp-step-title,
.ob-container.ob-light-theme .sp-testimonial-author,
.ob-container.ob-light-theme .sp-faq-q,
.ob-container.ob-light-theme .sp-current-price-label,
.ob-container.ob-light-theme .sp-shot-copy h4 {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .sp-phone-frame {
  background: linear-gradient(145deg, #241b3a 0%, #0f0c1f 100%);
}

.ob-container.ob-light-theme .sp-carousel-slide {
  background:
    radial-gradient(circle at top, rgba(168, 85, 247, 0.18), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f7f2ff 100%);
  border-color: var(--ob-border);
  box-shadow: var(--ob-shadow);
}

.ob-container.ob-light-theme .sp-book-preview-shot .sp-phone-frame,
.ob-container.ob-light-theme .sp-book-preview-shot .sp-phone-screen {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.ob-container.ob-light-theme .sp-carousel-image {
  background: #ffffff;
  border-color: rgba(118, 82, 214, 0.12);
}

.ob-container.ob-light-theme .sp-pricing-container,
.ob-container.ob-light-theme .sp-checkout-section,
.ob-container.ob-light-theme .sp-footer {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .sp-checkout-section {
  padding: clamp(1.5rem, 4vw, 3.5rem) 0 !important;
  background:
    radial-gradient(circle at 14% 8%, rgba(139,92,246,0.08), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
}

.ob-container.ob-light-theme .sp-pricing-container {
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding: 0 clamp(1rem, 3vw, 1.5rem) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.ob-container.ob-light-theme .sp-section-heading,
.ob-container.ob-light-theme .sp-conflict-body,
.ob-container.ob-light-theme .sp-conflict-quote,
.ob-container.ob-light-theme .sp-transform-label,
.ob-container.ob-light-theme .sp-transform-list,
.ob-container.ob-light-theme .sp-price-row-v2,
.ob-container.ob-light-theme .sp-price-row-v2 strong,
.ob-container.ob-light-theme .sp-price-row-total strong,
.ob-container.ob-light-theme .sp-secure-label,
.ob-container.ob-light-theme .sp-loading-checkout p {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .sp-section-kicker {
  color: var(--ob-purple);
}

.ob-container.ob-light-theme .sp-price-display-v2,
.ob-container.ob-light-theme .sp-stripe-container,
.ob-container.ob-light-theme #payment-form {
  background: #ffffff;
  border: 1px solid var(--ob-border);
  box-shadow: 0 14px 34px rgba(76, 29, 149, 0.08);
}

.ob-container.ob-light-theme #payment-form,
.ob-container.ob-light-theme #payment-form p,
.ob-container.ob-light-theme #payment-form span {
  color: var(--ob-text) !important;
}

.ob-container.ob-light-theme #payment-form .border-white\/10 {
  border-color: rgba(93, 70, 149, 0.14) !important;
}

.ob-container.ob-light-theme #payment-form .ob-premium-cta,
.ob-container.ob-light-theme #payment-form #button-text {
  color: #ffffff !important;
}

.ob-container.ob-light-theme .sp-price-row-discount strong {
  color: #059669;
}

.ob-container.ob-light-theme .sp-price-row-total {
  border-top-color: rgba(93, 70, 149, 0.12);
}

.ob-container.ob-light-theme .sp-value-item {
  background: #fbfaff;
  color: var(--ob-text);
  border-color: rgba(118, 82, 214, 0.14);
}

.ob-container.ob-light-theme .sp-value-item span {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .sp-pricing-subtitle,
.ob-container.ob-light-theme .sp-product-card p {
  color: var(--ob-text-muted);
}

.ob-container.ob-light-theme .sp-product-card {
  background:
    radial-gradient(circle at 90% 0%, rgba(245, 158, 11, 0.13), transparent 35%),
    #ffffff;
  border-color: rgba(118, 82, 214, 0.14);
  box-shadow: 0 14px 34px rgba(76, 29, 149, 0.08);
}

.ob-container.ob-light-theme .sp-product-card-bonus {
  background:
    radial-gradient(circle at 88% 0%, rgba(16, 185, 129, 0.15), transparent 34%),
    #ffffff;
  border-color: rgba(16, 185, 129, 0.2);
}

.ob-container.ob-light-theme .sp-product-card h3,
.ob-container.ob-light-theme .sp-product-price strong {
  color: var(--ob-text);
}

.ob-container.ob-light-theme .sp-product-price {
  background: #fbfaff;
  border-color: rgba(118, 82, 214, 0.12);
}

.ob-container.ob-light-theme .sp-value-item .sp-value-icon {
  color: #7c3aed;
}

.ob-container.ob-light-theme .sp-guarantee-badge {
  background:
    radial-gradient(circle at 8% 0%, rgba(16, 185, 129, 0.18), transparent 42%),
    linear-gradient(135deg, #ecfdf5 0%, #ffffff 100%);
  border: 1px solid rgba(16, 185, 129, 0.28);
  box-shadow: 0 18px 38px rgba(16, 185, 129, 0.12);
}

.ob-container.ob-light-theme .sp-guarantee-title {
  color: #047857;
}

.ob-container.ob-light-theme .sp-guarantee-text {
  color: #365f52;
}

.ob-container.ob-light-theme .sp-guarantee-shield {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.16), rgba(167, 243, 208, 0.8));
  color: #047857;
  border-color: rgba(16, 185, 129, 0.28);
}

.ob-container.ob-light-theme .sp-feature-desc,
.ob-container.ob-light-theme .sp-step-desc,
.ob-container.ob-light-theme .sp-faq-subtitle,
.ob-container.ob-light-theme .sp-faq-body p,
.ob-container.ob-light-theme .sp-footer p {
  color: var(--ob-text-soft);
}

.ob-container.ob-light-theme .sp-before {
  background: #ffffff;
  border-right: 0;
  border-radius: 24px 0 0 24px;
}

.ob-container.ob-light-theme .sp-after {
  background:
    radial-gradient(circle at top left, rgba(16, 185, 129, 0.26), transparent 38%),
    linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border-color: rgba(16, 185, 129, 0.34);
  border-left: 0;
  border-radius: 0 24px 24px 0;
  box-shadow: 0 18px 42px rgba(16, 185, 129, 0.18);
}

.ob-container.ob-light-theme .sp-transform-grid::before {
  background: linear-gradient(180deg, transparent, rgba(148,123,88,0.34), transparent);
}

.ob-container.ob-light-theme .sp-after .sp-transform-label {
  color: #047857;
  text-shadow: 0 0 18px rgba(16, 185, 129, 0.24);
}

.ob-container.ob-light-theme .sp-after .sp-transform-list {
  color: #064E3B;
}

.ob-container.ob-light-theme .sp-after .sp-check {
  color: #059669;
}

.ob-container.ob-light-theme .sp-original-price {
  color: #9f97b9;
}

.ob-container.ob-light-theme .sp-copyright,
.ob-container.ob-light-theme .sp-verified {
  color: var(--ob-text-faint);
}

.ob-container.ob-light-theme .ob-success-check-circle {
  background: linear-gradient(135deg, var(--ob-purple) 0%, var(--ob-purple-2) 100%);
  box-shadow: 0 18px 40px rgba(124, 58, 237, 0.24);
}

.ob-container.ob-light-theme .ob-success-check-ring {
  border-color: rgba(124, 58, 237, 0.14);
}

.ob-container.ob-light-theme .ob-step-num {
  background: rgba(124, 58, 237, 0.1);
  color: var(--ob-purple);
}

.ob-container.ob-light-theme .ob-step-text,
.ob-container.ob-light-theme .ob-success-support p,
.ob-container.ob-light-theme .ob-support-link {
  color: var(--ob-text-soft);
}

.ob-container.ob-light-theme .ob-support-link {
  color: var(--ob-purple);
}

/* Early funnel refresh: white/purple, less visual noise */
.ob-container.ob-light-theme .vb-fullpage {
  min-height: 100dvh;
  background:
    radial-gradient(circle at 15% 0%, rgba(139, 92, 246, 0.14), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(192, 132, 252, 0.12), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  color: var(--ob-text);
}

.ob-container.ob-light-theme .vb-fullpage-shell {
  width: min(100%, 1120px);
  min-height: 100dvh;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(280px, 0.84fr) minmax(360px, 1fr);
  gap: clamp(20px, 4vw, 44px);
  align-items: center;
  padding: clamp(28px, 5vw, 56px) clamp(18px, 4vw, 36px);
}

.ob-container.ob-light-theme .vb-context-panel,
.ob-container.ob-light-theme .vb-flow-panel,
.ob-container.ob-light-theme .ob-hero-card,
.ob-container.ob-light-theme .ob-consolidated-card,
.ob-container.ob-light-theme .vb-dob-shell,
.ob-container.ob-light-theme .vb-reveal-card,
.ob-container.ob-light-theme .vb-reveal-unlock,
.ob-container.ob-light-theme .ob-email-page,
.ob-container.ob-light-theme .ob-form-card {
  background: rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(124, 58, 237, 0.14) !important;
  box-shadow: 0 22px 58px rgba(76, 29, 149, 0.10) !important;
  backdrop-filter: blur(18px);
}

.ob-container.ob-light-theme .vb-context-panel {
  border-radius: 30px;
  padding: clamp(24px, 4vw, 40px);
  min-height: auto;
}

.ob-container.ob-light-theme .vb-context-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ob-text) !important;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.ob-container.ob-light-theme .vb-context-brand img {
  width: 34px;
  height: 34px;
  border-radius: 10px;
}

.ob-container.ob-light-theme .vb-context-body {
  margin-top: clamp(28px, 5vw, 56px);
}

.ob-container.ob-light-theme .vb-context-kicker,
.ob-container.ob-light-theme .vb-step-label,
.ob-container.ob-light-theme .vb-dob-eyebrow {
  color: var(--ob-purple) !important;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ob-container.ob-light-theme .vb-context-body h1 {
  max-width: 11ch;
  margin: 12px 0 14px;
  color: var(--ob-text) !important;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(42px, 6vw, 76px);
  line-height: 0.96;
  letter-spacing: 0;
}

.ob-container.ob-light-theme .vb-context-body p {
  max-width: 460px;
  color: var(--ob-text-soft) !important;
  font-size: 16px;
  line-height: 1.65;
  font-weight: 650;
}

.ob-container.ob-light-theme .vb-context-points {
  display: grid;
  gap: 10px;
  margin-top: 24px;
}

.ob-container.ob-light-theme .vb-context-point {
  padding: 12px 14px;
  border-radius: 14px;
  background: #f5f3ff;
  border: 1px solid rgba(124, 58, 237, 0.12);
  color: #312e81;
  font-size: 13px;
  font-weight: 850;
}

.ob-container.ob-light-theme .vb-context-footer {
  margin-top: 28px;
  color: var(--ob-text-faint);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.12em;
}

.ob-container.ob-light-theme .vb-flow-panel {
  border-radius: 30px;
  padding: clamp(18px, 3vw, 30px);
}

.ob-container.ob-light-theme .vb-fullpage-logo {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 18px;
  color: var(--ob-text) !important;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.12em;
}

.ob-container.ob-light-theme .ob-hero-card,
.ob-container.ob-light-theme .ob-consolidated-card {
  border-radius: 24px !important;
  padding: clamp(20px, 4vw, 32px) !important;
  box-shadow: none !important;
}

.ob-container.ob-light-theme .vb-progress-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.10) !important;
  overflow: hidden;
  margin-bottom: 14px;
}

.ob-container.ob-light-theme .vb-progress-fill-line {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8b5cf6, #6d28d9) !important;
}

.ob-container.ob-light-theme .vb-dob-card {
  margin-top: 18px;
  padding: 18px;
  border-radius: 20px;
  background: #fbfaff !important;
  border: 1px solid rgba(124, 58, 237, 0.10) !important;
}

.ob-container.ob-light-theme .vb-dob-grid {
  gap: 12px;
}

.ob-container.ob-light-theme .ob-field-v2,
.ob-container.ob-light-theme .ob-input {
  background: #ffffff !important;
  border: 1px solid rgba(124, 58, 237, 0.18) !important;
  color: var(--ob-text) !important;
  box-shadow: 0 8px 22px rgba(76, 29, 149, 0.05) !important;
}

.ob-container.ob-light-theme .ob-field-v2 option {
  background: #ffffff !important;
  color: var(--ob-text) !important;
}

.ob-container.ob-light-theme .vb-reveal-card {
  border-radius: 24px;
  padding: clamp(22px, 4vw, 34px);
  text-align: center;
}

.ob-container.ob-light-theme .vb-reveal-emoji {
  width: 64px;
  height: 64px;
  margin: 0 auto 12px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  background: #f5f3ff;
  border: 1px solid rgba(124, 58, 237, 0.12);
  font-size: 34px;
}

.ob-container.ob-light-theme .vb-reveal-sign,
.ob-container.ob-light-theme .vb-reveal-title {
  color: var(--ob-text) !important;
}

.ob-container.ob-light-theme .vb-reveal-sign {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(28px, 5vw, 44px);
  font-weight: 900;
}

.ob-container.ob-light-theme .vb-reveal-title {
  font-size: 16px;
  font-weight: 900;
  color: var(--ob-purple) !important;
}

.ob-container.ob-light-theme .vb-reveal-line,
.ob-container.ob-light-theme .vb-reveal-shadow,
.ob-container.ob-light-theme .vb-reveal-unlock-text {
  color: var(--ob-text-soft) !important;
  font-weight: 650;
}

.ob-container.ob-light-theme .vb-reveal-shadow {
  margin-top: 14px;
  padding: 14px;
  border-radius: 16px;
  background: #fbfaff;
  border: 1px solid rgba(124, 58, 237, 0.10);
}

.ob-container.ob-light-theme .vb-trust-line {
  color: var(--ob-text-faint) !important;
}

.ob-container.ob-light-theme .ob-hero-cta-v2,
.ob-container.ob-light-theme .ob-primary-btn {
  border: 0 !important;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
  color: #ffffff !important;
  box-shadow: 0 18px 40px rgba(124, 58, 237, 0.24) !important;
}

.ob-container.ob-light-theme .ob-hero-cta-v2:hover,
.ob-container.ob-light-theme .ob-primary-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 50px rgba(124, 58, 237, 0.30) !important;
}

.ob-container.ob-light-theme .ob-wizard-container {
  padding-top: 36px;
  padding-bottom: 48px;
}

.ob-container.ob-light-theme .ob-hero-content {
  width: min(100%, 720px);
  margin: 0 auto;
}

.ob-container.ob-light-theme .ob-hero-title {
  color: var(--ob-text) !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(42px, 7vw, 72px) !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .ob-email-page {
  width: min(calc(100% - 32px), 560px);
  margin: 48px auto;
  padding: clamp(24px, 5vw, 40px);
  border-radius: 28px;
}

.ob-container.ob-light-theme .ob-badge {
  display: inline-flex;
  margin-bottom: 16px;
}

.ob-container.ob-light-theme .rrw-free-reading-title,
.ob-container.ob-light-theme .rrw-archetype-name {
  color: var(--ob-text) !important;
  -webkit-text-fill-color: initial !important;
  background: none !important;
  font-family: 'Playfair Display', Georgia, serif;
  letter-spacing: 0;
}

.ob-container.ob-light-theme .rrw-card {
  border-radius: 22px !important;
  background: #ffffff !important;
}

.ob-container.ob-light-theme .rrw-card-badge.mask,
.ob-container.ob-light-theme .rrw-card-badge.shadow {
  border-radius: 999px;
}

@media (max-width: 860px) {
  .ob-container.ob-light-theme .vb-fullpage-shell {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 18px;
  }

  .ob-container.ob-light-theme .vb-context-panel {
    padding: 22px;
  }

  .ob-container.ob-light-theme .vb-context-body {
    margin-top: 22px;
  }

  .ob-container.ob-light-theme .vb-context-body h1 {
    max-width: 100%;
    font-size: clamp(34px, 10vw, 54px);
  }

  .ob-container.ob-light-theme .vb-context-points,
  .ob-container.ob-light-theme .vb-context-footer {
    display: none;
  }
}

@media (max-width: 640px) {
  .ob-container.ob-light-theme .ob-wizard-container {
    padding: 44px 18px 32px;
  }

  .ob-container.ob-light-theme .ob-hero-title,
  .ob-container.ob-light-theme .ob-wizard-title,
  .ob-container.ob-light-theme .sp-hero-headline {
    letter-spacing: -0.04em;
  }

  .ob-container.ob-light-theme .ob-hero-card-dark,
  .ob-container.ob-light-theme .ob-form-card,
  .ob-container.ob-light-theme .sp-proof-section,
  .ob-container.ob-light-theme .sp-pricing-container,
  .ob-container.ob-light-theme .ob-success-card {
    border-radius: 20px;
  }
}

/* Final early-funnel compact pass: keep onboarding white/purple and remove the stretched first step. */
.ob-container.ob-light-theme .vb-fullpage {
  min-height: 100dvh !important;
  background:
    radial-gradient(circle at 14% 8%, rgba(139, 92, 246, 0.10), transparent 30%),
    radial-gradient(circle at 88% 10%, rgba(167, 139, 250, 0.12), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
}

.ob-container.ob-light-theme .vb-fullpage-shell {
  width: min(100%, 1160px) !important;
  min-height: auto !important;
  margin: 0 auto !important;
  grid-template-columns: minmax(260px, 0.72fr) minmax(420px, 0.92fr) !important;
  align-items: start !important;
  gap: clamp(28px, 5vw, 68px) !important;
  padding: clamp(34px, 5vw, 58px) clamp(18px, 4vw, 38px) !important;
}

.ob-container.ob-light-theme .vb-context-panel {
  min-height: 0 !important;
  padding: clamp(12px, 2vw, 18px) 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.ob-container.ob-light-theme .vb-context-body {
  margin-top: clamp(54px, 9vh, 96px) !important;
}

.ob-container.ob-light-theme .vb-context-kicker,
.ob-container.ob-light-theme .vb-step-label,
.ob-container.ob-light-theme .vb-dob-eyebrow {
  color: #7c3aed !important;
  -webkit-text-fill-color: #7c3aed !important;
}

.ob-container.ob-light-theme .vb-context-body h1 {
  max-width: 10ch !important;
  margin: 12px 0 16px !important;
  color: #090914 !important;
  font-size: clamp(42px, 5.2vw, 68px) !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .vb-context-body p {
  max-width: 430px !important;
  margin: 0 !important;
  color: #4b5563 !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
}

.ob-container.ob-light-theme .vb-context-points,
.ob-container.ob-light-theme .vb-context-footer {
  display: none !important;
}

.ob-container.ob-light-theme .vb-flow-panel {
  align-self: start !important;
  min-height: 0 !important;
  padding: clamp(20px, 3vw, 28px) !important;
  border-radius: 28px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid rgba(124, 58, 237, 0.12) !important;
  box-shadow: 0 24px 70px rgba(76, 29, 149, 0.12) !important;
}

.ob-container.ob-light-theme .vb-fullpage-logo {
  margin-bottom: 18px !important;
  color: #312e81 !important;
}

.ob-container.ob-light-theme .ob-hero-card.ob-consolidated-card {
  min-height: 0 !important;
  height: auto !important;
  padding: clamp(24px, 3vw, 34px) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(139, 92, 246, 0.08), transparent 32%),
    #ffffff !important;
  border: 1px solid rgba(124, 58, 237, 0.14) !important;
  box-shadow: 0 18px 48px rgba(76, 29, 149, 0.08) !important;
}

.ob-container.ob-light-theme .ob-variant-b-flow,
.ob-container.ob-light-theme .ob-variant-b-flow .animate-fade-in,
.ob-container.ob-light-theme .vb-dob-shell {
  min-height: 0 !important;
  height: auto !important;
}

.ob-container.ob-light-theme .ob-variant-b-flow {
  display: block !important;
}

.ob-container.ob-light-theme .vb-dob-shell {
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.ob-container.ob-light-theme .vb-dob-eyebrow {
  display: inline-flex !important;
  width: auto !important;
  margin: 26px 0 14px !important;
  padding: 8px 13px !important;
  border-radius: 999px !important;
  background: #f5f3ff !important;
  border: 1px solid rgba(124, 58, 237, 0.18) !important;
  box-shadow: none !important;
}

.ob-container.ob-light-theme .vb-dob-header {
  margin: 0 0 18px !important;
}

.ob-container.ob-light-theme .ob-card-title-small {
  color: #0f172a !important;
  font-size: clamp(1.8rem, 3.1vw, 2.45rem) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .ob-card-subtitle-small {
  max-width: 520px !important;
  color: #5b6172 !important;
  font-size: 0.98rem !important;
  line-height: 1.6 !important;
}

.ob-container.ob-light-theme .vb-dob-card {
  margin-top: 16px !important;
  padding: 18px !important;
  border-radius: 18px !important;
  background: #fbfaff !important;
  border: 1px solid rgba(124, 58, 237, 0.12) !important;
  box-shadow: 0 12px 30px rgba(76, 29, 149, 0.07) !important;
}

.ob-container.ob-light-theme .vb-step-label {
  text-align: right !important;
  font-weight: 950 !important;
}

.ob-container.ob-light-theme .ob-hero-cta-v2 {
  margin-top: 20px !important;
  background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 18px 42px rgba(109, 40, 217, 0.24) !important;
}

@media (max-width: 900px) {
  .ob-container.ob-light-theme .vb-fullpage-shell {
    display: block !important;
    padding: 18px !important;
  }

  .ob-container.ob-light-theme .vb-context-body {
    margin-top: 24px !important;
  }

  .ob-container.ob-light-theme .vb-context-body h1 {
    max-width: 100% !important;
    font-size: clamp(2.4rem, 10vw, 4.2rem) !important;
  }

  .ob-container.ob-light-theme .vb-context-body p {
    max-width: 100% !important;
  }

  .ob-container.ob-light-theme .vb-flow-panel {
    margin-top: 22px !important;
  }
}

@media (max-width: 640px) {
  .ob-container.ob-light-theme .vb-fullpage {
    min-height: 100svh !important;
    padding-bottom: 112px !important;
    background:
      radial-gradient(circle at 12% 0%, rgba(139, 92, 246, 0.12), transparent 34%),
      linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-shell {
    width: 100% !important;
    padding: 18px 18px 92px !important;
  }

  .ob-container.ob-light-theme .vb-context-panel {
    padding: 0 !important;
  }

  .ob-container.ob-light-theme .vb-context-brand {
    gap: 10px !important;
  }

  .ob-container.ob-light-theme .vb-context-brand img {
    width: 44px !important;
    height: 44px !important;
    border-radius: 13px !important;
  }

  .ob-container.ob-light-theme .vb-context-brand span {
    color: #2b2d3a !important;
    font-size: 1.05rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.01em !important;
  }

  .ob-container.ob-light-theme .vb-context-body {
    margin-top: 34px !important;
  }

  .ob-container.ob-light-theme .vb-context-kicker {
    margin-bottom: 14px !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.16em !important;
  }

  .ob-container.ob-light-theme .vb-context-body h1 {
    max-width: 11ch !important;
    margin: 0 0 14px !important;
    font-size: clamp(2.55rem, 12vw, 3.6rem) !important;
    line-height: 0.94 !important;
  }

  .ob-container.ob-light-theme .vb-context-body p {
    max-width: 28rem !important;
    color: #4b5563 !important;
    font-size: 0.98rem !important;
    line-height: 1.55 !important;
    font-weight: 750 !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-body {
    margin-top: 28px !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-body h1 {
    max-width: 12ch !important;
    font-size: clamp(2.35rem, 11vw, 3.25rem) !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-body p {
    font-size: 0.92rem !important;
    line-height: 1.48 !important;
  }

  .ob-container.ob-light-theme .vb-flow-panel {
    margin-top: 28px !important;
    padding: 10px !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, 0.74) !important;
  }

  .ob-container.ob-light-theme .vb-flow-panel > .vb-fullpage-logo {
    display: none !important;
  }

  .ob-container.ob-light-theme .ob-hero-card.ob-consolidated-card {
    padding: 18px !important;
    border-radius: 22px !important;
    box-shadow: 0 18px 42px rgba(76, 29, 149, 0.08) !important;
  }

  .ob-container.ob-light-theme .vb-progress-track {
    height: 7px !important;
    margin: 4px 0 12px !important;
  }

  .ob-container.ob-light-theme .vb-step-label {
    margin-bottom: 16px !important;
    text-align: right !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.14em !important;
  }

  .ob-container.ob-light-theme .ob-card-header-minimal {
    margin-bottom: 16px !important;
  }

  .ob-container.ob-light-theme .ob-card-title-small {
    font-size: clamp(1.75rem, 8.6vw, 2.2rem) !important;
    line-height: 0.98 !important;
    margin-bottom: 8px !important;
  }

  .ob-container.ob-light-theme .ob-card-subtitle-small {
    font-size: 0.95rem !important;
    line-height: 1.48 !important;
  }

  .ob-container.ob-light-theme .ob-form-grid-v2.vb-precision-form {
    gap: 14px !important;
  }

  .ob-container.ob-light-theme .vb-field-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 8px !important;
  }

  .ob-container.ob-light-theme .ob-checkbox-minimal {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 0 !important;
    color: #2b2d3a !important;
    font-size: 0.92rem !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
  }

  .ob-container.ob-light-theme .ob-checkbox-minimal input[type="checkbox"] {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    border: 1.5px solid rgba(124, 58, 237, 0.34) !important;
    border-radius: 6px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 2px #ffffff !important;
  }

  .ob-container.ob-light-theme .ob-checkbox-minimal input[type="checkbox"]:checked {
    background: #7c3aed !important;
    border-color: #7c3aed !important;
    box-shadow: inset 0 0 0 3px #ffffff !important;
  }

  .ob-container.ob-light-theme .ob-field-v2 {
    height: 54px !important;
    border-radius: 15px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
  }

  .ob-container.ob-light-theme .ob-input-group-v2 {
    gap: 7px !important;
    margin-bottom: 0 !important;
  }

  .ob-container.ob-light-theme .ob-hero-cta-v2 {
    position: sticky !important;
    bottom: calc(78px + env(safe-area-inset-bottom)) !important;
    z-index: 20 !important;
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 18px 0 0 !important;
    border-radius: 18px !important;
    font-size: 1rem !important;
    font-weight: 950 !important;
    box-shadow: 0 20px 44px rgba(109, 40, 217, 0.28) !important;
  }
}
.ob-container.ob-light-theme .ob-hero-subtitle-new {
  color: var(--ob-text-soft) !important;
  font-weight: 500 !important;
  margin-bottom: 24px !important;
}

/* Final Oracelle sales funnel overrides */
.ob-container.ob-light-theme .ob-sales-reveal-container {
  width: 100%;
  background:
    radial-gradient(circle at 18% 4%, rgba(139, 92, 246, 0.18), transparent 28%),
    radial-gradient(circle at 82% 8%, rgba(192, 132, 252, 0.12), transparent 34%),
    linear-gradient(180deg, #050510 0%, #12122a 42%, #fbfaff 42%, #ffffff 100%) !important;
}

.ob-container.ob-light-theme .ob-content-wrapper.ob-no-padding-top {
  align-items: stretch !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
}

.ob-container.ob-light-theme .ob-content-wrapper.ob-no-padding-top > .ob-content-inner {
  max-width: none !important;
  width: 100% !important;
}

.ob-container.ob-light-theme .sp-white-page {
  width: 100% !important;
  max-width: none !important;
  color: #0f172a !important;
  background: transparent !important;
}

.ob-container.ob-light-theme .sp-hero {
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding: clamp(4.5rem, 8vw, 7rem) 1.25rem clamp(3.25rem, 6vw, 5rem) !important;
  color: #ffffff !important;
  overflow: hidden;
}

.ob-container.ob-light-theme .sp-hero-headline {
  max-width: 860px !important;
  margin: 0 auto 1.35rem !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(3rem, 7.2vw, 6.7rem) !important;
  font-weight: 900 !important;
  line-height: 0.96 !important;
  letter-spacing: 0 !important;
  overflow-wrap: normal;
  word-break: normal;
}

.ob-container.ob-light-theme .sp-purple-text {
  background: none !important;
  color: #c4b5fd !important;
  -webkit-text-fill-color: #c4b5fd !important;
  text-shadow: 0 0 34px rgba(139,92,246,0.22);
}

.ob-container.ob-light-theme .sp-hero-sub,
.ob-container.ob-light-theme .sp-hero-micro {
  color: rgba(255,255,255,0.72) !important;
}

.ob-container.ob-light-theme .sp-hero-cta {
  width: min(100%, 470px) !important;
  min-height: 66px !important;
  margin: 0 auto 1rem !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
  color: #ffffff !important;
  box-shadow: 0 22px 50px rgba(124,58,237,0.30), 0 0 0 1px rgba(255,255,255,0.08) inset !important;
}

.ob-container.ob-light-theme .sp-proof-section {
  width: min(calc(100% - 2rem), 860px) !important;
  max-width: 860px !important;
  background:
    radial-gradient(circle at 92% 10%, rgba(139,92,246,0.12), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  border-color: rgba(124,58,237,0.18) !important;
}

.ob-container.ob-light-theme .sp-proof-title {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .sp-proof-badge,
.ob-container.ob-light-theme .sp-proof-label {
  color: #6d28d9 !important;
}

@media (max-width: 1180px) {
  .ob-container.ob-light-theme .sp-hero {
    width: 100% !important;
    max-width: 100% !important;
    padding: 5.25rem 2rem 4rem !important;
  }

  .ob-container.ob-light-theme .sp-hero-headline {
    max-width: 720px !important;
    font-size: clamp(4rem, 8.5vw, 5.5rem) !important;
    line-height: 0.98 !important;
  }

  .ob-container.ob-light-theme .sp-hero-sub {
    max-width: 620px !important;
  }
}

@media (max-width: 820px) {
  .ob-container.ob-light-theme .sp-hero {
    padding: 4.25rem 1.25rem 3.35rem !important;
  }

  .ob-container.ob-light-theme .sp-hero-headline {
    max-width: 31rem !important;
    font-size: clamp(3.15rem, 10.5vw, 4.9rem) !important;
    line-height: 1 !important;
    text-wrap: balance;
  }

  .ob-container.ob-light-theme .sp-proof-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .ob-container.ob-light-theme .ob-sales-reveal-container {
    background:
      radial-gradient(circle at 18% 4%, rgba(139, 92, 246, 0.16), transparent 30%),
      linear-gradient(180deg, #050510 0%, #12122a 36%, #fbfaff 36%, #ffffff 100%) !important;
  }

  .ob-container.ob-light-theme .sp-hero {
    width: 100% !important;
    padding: 3.5rem 1rem 3rem !important;
  }

  .ob-container.ob-light-theme .sp-hero-headline {
    max-width: 22rem !important;
    font-size: clamp(2.55rem, 11.5vw, 4rem) !important;
    line-height: 1.02 !important;
    text-wrap: balance;
  }

  .ob-container.ob-light-theme .sp-hero-sub {
    max-width: 21rem !important;
    font-size: 0.98rem !important;
  }

  .ob-container.ob-light-theme .sp-hero-cta {
    min-height: 58px !important;
    padding: 16px 18px !important;
    font-size: 0.9rem !important;
  }
}

.ob-container.ob-light-theme .ob-card-title-small {
  color: var(--ob-text) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.ob-container.ob-light-theme .ob-card-subtitle-small {
  color: var(--ob-text-soft) !important;
  line-height: 1.5;
}

.ob-container.ob-light-theme .ob-label-v2 {
  color: var(--ob-text) !important;
  font-weight: 800 !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  opacity: 0.9;
}

.ob-container.ob-light-theme .ob-field-v2 {
  background: #ffffff !important;
  border: 1px solid var(--ob-border-strong) !important;
  color: var(--ob-text) !important;
  text-align: left !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.02) !important;
}

.ob-container.ob-light-theme .ob-field-v2:focus {
  border-color: var(--ob-purple) !important;
  box-shadow: 0 0 0 4px rgba(109, 40, 217, 0.1) !important;
}

.ob-container.ob-light-theme .ob-field-v2::placeholder {
  color: var(--ob-text-faint) !important;
  opacity: 0.6;
}

.ob-container.ob-light-theme .ob-checkbox-minimal {
  color: var(--ob-text-soft) !important;
  font-weight: 600 !important;
}

.ob-container.ob-light-theme .ob-checkbox-minimal input {
  accent-color: var(--ob-purple);
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.ob-container.ob-light-theme .ob-results-dropdown-v2 {
  background: #ffffff !important;
  border: 1px solid var(--ob-border-strong) !important;
  box-shadow: 0 15px 40px rgba(0,0,0,0.1) !important;
  border-radius: 16px !important;
}

.ob-container.ob-light-theme .ob-result-item-v2 {
  color: var(--ob-text) !important;
  padding: 14px 18px !important;
  font-weight: 500 !important;
}

.ob-container.ob-light-theme .ob-result-item-v2:hover {
  background: rgba(109, 40, 217, 0.05) !important;
}

/* Fix for date/time input internal alignment */
.ob-container.ob-light-theme input[type="date"].ob-field-v2,
.ob-container.ob-light-theme input[type="time"].ob-field-v2 {
  text-align: left !important;
}

.ob-container.ob-light-theme input[type="date"].ob-field-v2::-webkit-date-and-time-value,
.ob-container.ob-light-theme input[type="time"].ob-field-v2::-webkit-date-and-time-value {
  text-align: left !important;
  padding-left: 0;
}

/* Meta cold-traffic funnel: purple onboarding matched to the final sales page. */
.ob-container.ob-light-theme.meta-funnel-theme {
  --meta-purple-950: #100719;
  --meta-purple-900: #1a0b2b;
  --meta-purple-800: #2a1242;
  --meta-purple-700: #57278b;
  --meta-purple-600: #7137ad;
  --meta-gold: #d8b66b;
  --meta-cream: #f5efe5;
  background: var(--meta-purple-950) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-starfield-canvas {
  display: none !important;
}

.meta-onboarding-trustbar {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 7px 16px;
  background: linear-gradient(90deg, #bd9750, #ead18e, #bd9750);
  color: #21152d;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage {
  min-height: 100dvh !important;
  padding: 0 !important;
  background:
    radial-gradient(circle at 13% 18%, rgba(123, 72, 172, 0.28), transparent 30rem),
    radial-gradient(circle at 86% 82%, rgba(216, 182, 107, 0.10), transparent 26rem),
    var(--meta-purple-950) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-shell {
  width: min(100%, 1180px) !important;
  min-height: calc(100dvh - 34px) !important;
  display: grid !important;
  grid-template-columns: minmax(330px, 0.85fr) minmax(440px, 1.15fr) !important;
  align-items: center !important;
  gap: clamp(32px, 6vw, 82px) !important;
  padding: 42px 28px !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-panel {
  min-height: 610px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  padding: 32px !important;
  border: 1px solid rgba(216, 182, 107, 0.26) !important;
  border-radius: 2px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015)),
    radial-gradient(circle at 82% 10%, rgba(113,55,173,0.28), transparent 45%) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,0.28) !important;
  text-align: left !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-brand {
  align-self: flex-start !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-brand > span:last-child,
.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-logo > span:last-child {
  color: #f8f2e7 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
}

.meta-onboarding-mark {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(216,182,107,0.55);
  border-radius: 50%;
  color: #efd48f;
  font-size: 13px;
}

.meta-onboarding-mark-small {
  width: 28px;
  height: 28px;
  font-size: 11px;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-body {
  width: 100% !important;
  margin: auto 0 !important;
  text-align: left !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-kicker {
  display: inline-flex !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--meta-gold) !important;
  -webkit-text-fill-color: var(--meta-gold) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-body h1 {
  max-width: 9.5ch !important;
  margin: 0 0 22px !important;
  background: none !important;
  color: #f8f2e7 !important;
  -webkit-text-fill-color: #f8f2e7 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(46px, 5vw, 68px) !important;
  font-weight: 400 !important;
  line-height: 0.98 !important;
  letter-spacing: -0.035em !important;
  text-align: left !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-body p {
  max-width: 430px !important;
  color: rgba(242, 235, 225, 0.72) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-points {
  display: grid !important;
  gap: 10px !important;
  margin-top: 30px !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-point {
  position: relative;
  padding-left: 20px !important;
  color: rgba(248,242,231,0.72) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-point::before {
  content: '✦';
  position: absolute;
  left: 0;
  color: var(--meta-gold);
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-footer {
  display: block !important;
  color: rgba(248,242,231,0.35) !important;
  font-size: 9px !important;
  letter-spacing: 0.14em !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-flow-panel {
  width: 100% !important;
  min-height: 610px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: clamp(28px, 4vw, 48px) !important;
  border: 1px solid rgba(216,182,107,0.23) !important;
  border-radius: 2px !important;
  background:
    radial-gradient(circle at 94% 0%, rgba(113,55,173,0.08), transparent 35%),
    var(--meta-cream) !important;
  box-shadow: 0 36px 90px rgba(0,0,0,0.36) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-logo {
  display: none !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-hero-card.ob-consolidated-card {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-progress-track {
  height: 3px !important;
  background: rgba(87,39,139,0.12) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-progress-fill-line {
  background: linear-gradient(90deg, var(--meta-purple-600), var(--meta-gold)) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-step-label,
.ob-container.ob-light-theme.meta-funnel-theme .vb-dob-eyebrow {
  color: var(--meta-purple-700) !important;
  -webkit-text-fill-color: var(--meta-purple-700) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-dob-eyebrow {
  margin: 25px 0 13px !important;
  background: rgba(87,39,139,0.07) !important;
  border-color: rgba(87,39,139,0.16) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-card-title-small {
  color: #21152d !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(31px, 4vw, 43px) !important;
  font-weight: 400 !important;
  line-height: 1.04 !important;
  letter-spacing: -0.025em !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-card-subtitle-small {
  color: #6d6372 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-dob-card,
.ob-container.ob-light-theme.meta-funnel-theme .vb-reveal-card {
  background: rgba(255,255,255,0.64) !important;
  border: 1px solid rgba(87,39,139,0.14) !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-label-v2 {
  color: #3b2947 !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-field-v2 {
  min-height: 56px !important;
  border-radius: 2px !important;
  border-color: rgba(87,39,139,0.20) !important;
  background: rgba(255,255,255,0.84) !important;
  color: #21152d !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-field-v2:focus {
  border-color: var(--meta-purple-600) !important;
  box-shadow: 0 0 0 3px rgba(113,55,173,0.12) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-hero-cta-v2 {
  min-height: 58px !important;
  border-radius: 2px !important;
  background: linear-gradient(135deg, #7137ad, #3d1d62) !important;
  color: #ffffff !important;
  box-shadow: 0 17px 35px rgba(61,29,98,0.25) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-reveal-sign,
.ob-container.ob-light-theme.meta-funnel-theme .vb-reveal-title,
.ob-container.ob-light-theme.meta-funnel-theme .vb-reveal-shadow strong {
  color: var(--meta-purple-700) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-trust-line {
  color: #746a79 !important;
}

@media (max-width: 900px) {
  .ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-shell {
    display: block !important;
    padding: 22px 18px 62px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-panel {
    min-height: 0 !important;
    padding: 24px 22px 34px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body {
    margin-top: 50px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body h1 {
    max-width: 12ch !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-points,
  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-footer {
    display: none !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-flow-panel {
    min-height: 0 !important;
    margin-top: 0 !important;
    padding: 30px 22px 34px !important;
  }
}

@media (max-width: 640px) {
  .meta-onboarding-trustbar {
    min-height: 38px;
    gap: 6px;
    font-size: 8px;
    letter-spacing: 0.07em;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage {
    padding-bottom: 0 !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-shell {
    padding: 14px 12px 32px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-panel {
    padding: 20px 18px 30px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body {
    margin-top: 40px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body h1 {
    max-width: 10ch !important;
    margin-bottom: 16px !important;
    font-size: clamp(41px, 12.8vw, 55px) !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body p {
    font-size: 13px !important;
    line-height: 1.6 !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-flow-panel {
    padding: 28px 18px 32px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .ob-card-title-small {
    font-size: 31px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-dob-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-dob-card {
    padding: 12px !important;
  }
}

.ob-container.ob-light-theme .ob-form-grid-v2 {
  gap: 24px !important;
}

.ob-container.ob-light-theme .ob-hero-cta-v2 {
  height: 60px;
  border-radius: 16px;
  font-size: 18px;
  text-transform: none;
  letter-spacing: -0.01em;
  margin-top: 10px;
}

.ob-container.ob-light-theme .ob-hero-card-dark {
  padding: 32px !important;
  border-radius: 28px !important;
}
.ob-container.ob-light-theme .ob-error-v2 {
  color: #b91c1c !important;
  background: rgba(248, 113, 113, 0.1) !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  margin-top: 16px !important;
  border: 1px solid rgba(185, 28, 28, 0.1) !important;
  text-align: center;
}

.ob-container.ob-light-theme .ob-field-v2 {
  height: 56px !important;
  border-radius: 14px !important;
  padding: 0 16px !important;
  font-size: 16px !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-color: #ffffff !important;
  color: var(--ob-text) !important;
  border: 1px solid var(--ob-border-strong) !important;
}

.ob-container.ob-light-theme .ob-input-group-v2 {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 4px;
}

.ob-container.ob-light-theme .mb-10 {
  margin-bottom: 48px !important;
}

/* Ensure native date/time pickers icons are visible and aligned */
.ob-container.ob-light-theme input[type="date"].ob-field-v2::-webkit-calendar-picker-indicator,
.ob-container.ob-light-theme input[type="time"].ob-field-v2::-webkit-calendar-picker-indicator {
  filter: invert(0.2) sepia(1) saturate(5) hue-rotate(240deg);
  cursor: pointer;
  margin-left: auto;
}

/* Structured Oracelle sales sections */
.ob-container.ob-light-theme .sp-conflict-section,
.ob-container.ob-light-theme .sp-solution-section,
.ob-container.ob-light-theme .sp-offer-bridge,
.ob-container.ob-light-theme .sp-features-section,
.ob-container.ob-light-theme .sp-transform-grid,
.ob-container.ob-light-theme .sp-process-section,
.ob-container.ob-light-theme .sp-testimonials,
.ob-container.ob-light-theme .sp-checkout-section,
.ob-container.ob-light-theme .sp-faq-section {
  width: min(calc(100% - 2rem), 1080px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ob-container.ob-light-theme .sp-offer-bridge {
  margin-top: 1.5rem !important;
  padding: clamp(1.5rem, 4vw, 3rem) !important;
  border: 1px solid rgba(124,58,237,0.16) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 12% 10%, rgba(139,92,246,0.10), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  box-shadow: 0 32px 90px rgba(15,23,42,0.12) !important;
  color: #0f172a !important;
}

.ob-container.ob-light-theme .sp-offer-bridge .sp-section-heading-block {
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ob-container.ob-light-theme .sp-offer-bridge .sp-section-heading {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(2rem, 4.6vw, 3.8rem) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .sp-offer-bridge .sp-section-sub {
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: #4b5563 !important;
  font-weight: 600 !important;
}

.ob-container.ob-light-theme .sp-offer-compare {
  display: grid !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) !important;
  gap: 1rem !important;
  margin-top: 1.8rem !important;
}

.ob-container.ob-light-theme .sp-offer-column {
  padding: clamp(1.15rem, 3vw, 1.65rem) !important;
  border-radius: 24px !important;
  border: 1px solid rgba(124,58,237,0.12) !important;
  background: rgba(255,255,255,0.78) !important;
  box-shadow: 0 18px 45px rgba(15,23,42,0.08) !important;
}

.ob-container.ob-light-theme .sp-offer-full {
  border-color: rgba(124,58,237,0.24) !important;
  background:
    radial-gradient(circle at 80% 0%, rgba(139,92,246,0.14), transparent 36%),
    #ffffff !important;
}

.ob-container.ob-light-theme .sp-offer-tag {
  display: inline-flex;
  margin-bottom: 0.85rem;
  padding: 0.42rem 0.65rem;
  border-radius: 999px;
  background: #f5f3ff;
  border: 1px solid rgba(124,58,237,0.20);
  color: #6d28d9;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ob-container.ob-light-theme .sp-offer-column h3 {
  margin: 0 0 0.35rem;
  color: #0f172a;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(1.55rem, 3vw, 2.1rem);
  line-height: 1.05;
}

.ob-container.ob-light-theme .sp-offer-column p {
  margin: 0 0 1rem;
  color: #596273;
  font-weight: 600;
}

.ob-container.ob-light-theme .sp-offer-column ul {
  display: grid;
  gap: 0.72rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ob-container.ob-light-theme .sp-offer-column li {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  color: #263244;
  font-weight: 800;
  line-height: 1.45;
}

.ob-container.ob-light-theme .sp-offer-column li svg {
  flex-shrink: 0;
  margin-top: 0.1rem;
  color: #8b5cf6;
}

.ob-container.ob-light-theme .sp-bonus-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.7rem;
  margin-top: 1.25rem;
}

.ob-container.ob-light-theme .sp-bonus-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.72rem 0.9rem;
  border-radius: 999px;
  background: #07101e;
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 900;
  box-shadow: 0 14px 30px rgba(15,23,42,0.12);
}

.ob-container.ob-light-theme .sp-bonus-pill svg {
  color: #c4b5fd;
}

.ob-container.ob-light-theme .sp-conflict-section {
  margin-top: 2.5rem !important;
  padding: clamp(1.5rem, 4vw, 3rem) !important;
  border: 1px solid rgba(124,58,237,0.16) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 12% 10%, rgba(139,92,246,0.12), transparent 30%),
    radial-gradient(circle at 88% 6%, rgba(139,92,246,0.16), transparent 36%),
    linear-gradient(160deg, #030712 0%, #07101e 58%, #101827 100%) !important;
  box-shadow: 0 32px 90px rgba(15,23,42,0.22) !important;
  color: #ffffff !important;
}

.ob-container.ob-light-theme .sp-conflict-section .sp-section-title,
.ob-container.ob-light-theme .sp-conflict-section .sp-section-sub,
.ob-container.ob-light-theme .sp-conflict-section .sp-conflict-body,
.ob-container.ob-light-theme .sp-conflict-section .sp-conflict-quote {
  color: #ffffff !important;
  -webkit-text-fill-color: currentColor !important;
}

.ob-container.ob-light-theme .sp-conflict-section .sp-section-title {
  max-width: 820px !important;
  margin: 0 0 0.8rem !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: clamp(2.15rem, 4.8vw, 4.2rem) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .sp-conflict-section .sp-section-sub {
  max-width: 780px !important;
  margin: 0 0 1.5rem !important;
  color: rgba(255,255,255,0.72) !important;
  font-weight: 600 !important;
}

.ob-container.ob-light-theme .sp-conflict-card {
  margin: 1.5rem 0 1.2rem !important;
  padding: clamp(1.1rem, 3vw, 1.75rem) !important;
  border: 1px solid rgba(124,58,237,0.2) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,0.07) !important;
  box-shadow: none !important;
}

.ob-container.ob-light-theme .sp-conflict-label {
  color: #c4b5fd !important;
}

.ob-container.ob-light-theme .sp-conflict-body {
  margin: 0 !important;
  color: rgba(255,255,255,0.88) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
}

.ob-container.ob-light-theme .sp-conflict-quote {
  margin: 0 !important;
  border-left-color: #c4b5fd !important;
  color: rgba(255,255,255,0.82) !important;
}

.ob-container.ob-light-theme .sp-solution-section {
  margin-top: 1.5rem !important;
  padding: clamp(1.5rem, 4vw, 3rem) !important;
  border: 1px solid rgba(124,58,237,0.16) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 82% 12%, rgba(139,92,246,0.12), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfaff 100%) !important;
  box-shadow: 0 32px 90px rgba(15,23,42,0.12) !important;
  color: #0f172a !important;
}

.ob-container.ob-light-theme .sp-solution-section .sp-section-title,
.ob-container.ob-light-theme .sp-solution-section .sp-solution-title {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  letter-spacing: 0 !important;
}

.ob-container.ob-light-theme .sp-solution-section .sp-section-title {
  max-width: 720px !important;
  margin: 0 0 0.75rem !important;
  font-size: clamp(2.15rem, 4.6vw, 3.8rem) !important;
  line-height: 1.02 !important;
}

.ob-container.ob-light-theme .sp-solution-section .sp-section-sub {
  max-width: 760px !important;
  margin: 0 0 1.6rem !important;
  color: #4b5563 !important;
  font-weight: 600 !important;
}

.ob-container.ob-light-theme .sp-solution-feature {
  border: 1px solid #eee3d1 !important;
  background: #ffffff !important;
  box-shadow: 0 18px 45px rgba(15,23,42,0.08) !important;
}

.ob-container.ob-light-theme .sp-solution-text {
  color: #596273 !important;
  font-weight: 600 !important;
}

.ob-container.ob-light-theme .sp-included-section {
  border: 1px solid rgba(124,58,237,0.12) !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(139,92,246,0.12), transparent 34%),
    #ffffff !important;
  box-shadow: 0 18px 45px rgba(15,23,42,0.08) !important;
}

.ob-container.ob-light-theme .sp-included-header h3,
.ob-container.ob-light-theme .sp-chapter-item {
  color: #0f172a !important;
}

.ob-container.ob-light-theme .sp-included-header p {
  color: #596273 !important;
}

.ob-container.ob-light-theme .sp-chapter-item {
  border-color: #eee3d1 !important;
  background: rgba(255,250,241,0.78) !important;
}

.ob-container.ob-light-theme .sp-chapter-number {
  color: #9a6b20 !important;
}

.ob-container.ob-light-theme .sp-features-section,
.ob-container.ob-light-theme .sp-process-section,
.ob-container.ob-light-theme .sp-testimonials,
.ob-container.ob-light-theme .sp-faq-section {
  padding-left: clamp(0.25rem, 2vw, 1rem) !important;
  padding-right: clamp(0.25rem, 2vw, 1rem) !important;
}

@media (max-width: 640px) {
  .ob-container.ob-light-theme .sp-conflict-section,
  .ob-container.ob-light-theme .sp-solution-section,
  .ob-container.ob-light-theme .sp-offer-bridge,
  .ob-container.ob-light-theme .sp-features-section,
  .ob-container.ob-light-theme .sp-transform-grid,
  .ob-container.ob-light-theme .sp-process-section,
  .ob-container.ob-light-theme .sp-testimonials,
  .ob-container.ob-light-theme .sp-checkout-section,
  .ob-container.ob-light-theme .sp-faq-section {
    width: min(calc(100% - 1rem), 1080px) !important;
    border-radius: 22px !important;
  }

  .ob-container.ob-light-theme .sp-conflict-section,
  .ob-container.ob-light-theme .sp-solution-section,
  .ob-container.ob-light-theme .sp-offer-bridge {
    padding: 1.2rem !important;
  }

  .ob-container.ob-light-theme .sp-offer-compare {
    grid-template-columns: 1fr !important;
  }

  .ob-container.ob-light-theme .sp-transform-grid::before {
    background: linear-gradient(90deg, transparent, rgba(148,123,88,0.34), transparent);
  }

  .ob-container.ob-light-theme .sp-before {
    border-right: 1px solid rgba(93, 70, 149, 0.1);
    border-bottom: 0;
    border-radius: 22px 22px 0 0;
  }

  .ob-container.ob-light-theme .sp-after {
    border-left: 1px solid rgba(16, 185, 129, 0.34);
    border-top: 0;
    border-radius: 0 0 22px 22px;
  }
}

/* Variant B polish: centered first-screen headline with richer premium color. */
.ob-container.ob-light-theme .vb-fullpage-step-0 {
  background:
    radial-gradient(circle at 12% 12%, rgba(139, 92, 246, 0.18), transparent 32%),
    radial-gradient(circle at 86% 18%, rgba(20, 184, 166, 0.14), transparent 30%),
    radial-gradient(circle at 72% 84%, rgba(245, 158, 11, 0.12), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbf8ff 58%, #f5f0ff 100%) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-brand {
  align-self: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-body {
  width: 100% !important;
  margin-top: clamp(42px, 8vh, 82px) !important;
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 9px 15px !important;
  border-radius: 999px !important;
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    linear-gradient(135deg, #8b5cf6, #14b8a6, #f59e0b) border-box !important;
  border: 1px solid transparent !important;
  color: #6d35e8 !important;
  -webkit-text-fill-color: #6d35e8 !important;
  box-shadow: 0 12px 28px rgba(109, 53, 232, 0.12) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-body h1 {
  max-width: 12ch !important;
  margin: 16px auto 18px !important;
  text-align: center !important;
  background: linear-gradient(135deg, #070714 0%, #6d35e8 44%, #0f766e 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-body p {
  max-width: 470px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-points {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: min(100%, 430px) !important;
  margin: 26px auto 0 !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-point {
  justify-content: center !important;
  border-radius: 16px !important;
  border: 1px solid rgba(124, 58, 237, 0.12) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: #32245f !important;
  box-shadow: 0 12px 28px rgba(76, 29, 149, 0.08) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-point:nth-child(1) {
  border-color: rgba(139, 92, 246, 0.22) !important;
  background: rgba(245, 243, 255, 0.9) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-point:nth-child(2) {
  border-color: rgba(20, 184, 166, 0.22) !important;
  background: rgba(240, 253, 250, 0.9) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-point:nth-child(3) {
  border-color: rgba(245, 158, 11, 0.22) !important;
  background: rgba(255, 251, 235, 0.95) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .vb-flow-panel {
  background:
    radial-gradient(circle at 10% 0%, rgba(139, 92, 246, 0.11), transparent 34%),
    radial-gradient(circle at 92% 18%, rgba(20, 184, 166, 0.09), transparent 30%),
    rgba(255, 255, 255, 0.82) !important;
  border-color: rgba(124, 58, 237, 0.16) !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-0 .ob-hero-card.ob-consolidated-card {
  background:
    radial-gradient(circle at 12% 0%, rgba(139, 92, 246, 0.1), transparent 32%),
    radial-gradient(circle at 92% 12%, rgba(245, 158, 11, 0.08), transparent 28%),
    #ffffff !important;
}

@media (max-width: 760px) {
  .ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-body {
    margin-top: 28px !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-body h1 {
    max-width: 10.5ch !important;
    font-size: clamp(2.55rem, 11vw, 3.45rem) !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-body p {
    max-width: 24rem !important;
  }

  .ob-container.ob-light-theme .vb-fullpage-step-0 .vb-context-points {
    width: 100% !important;
    margin-top: 18px !important;
  }
}

/* Keep the email capture and precision-detail steps structurally centered. */
.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-context-panel,
.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-context-brand,
.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-brand {
  align-self: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-context-body,
.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-body {
  width: 100% !important;
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-context-kicker,
.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-kicker {
  display: inline-flex !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-context-body h1,
.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-body h1,
.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-context-body p,
.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-context-body p {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-reveal-card,
.ob-container.ob-light-theme .vb-fullpage-step-1 .vb-reveal-unlock,
.ob-container.ob-light-theme .vb-fullpage-step-2 .ob-card-header-minimal {
  text-align: center !important;
}

.ob-container.ob-light-theme .vb-fullpage-step-2 .vb-field-header {
  justify-content: center !important;
  gap: 16px !important;
}

/* Keep campaign-specific mobile rules last so legacy Variant B polish cannot override them. */
@media (max-width: 900px) {
  .ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage {
    background:
      radial-gradient(circle at 78% 8%, rgba(113,55,173,0.34), transparent 24rem),
      #100719 !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-shell {
    display: block !important;
    width: 100% !important;
    min-height: auto !important;
    padding: 12px 12px 34px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-panel {
    min-height: 0 !important;
    align-items: flex-start !important;
    padding: 18px 18px 28px !important;
    text-align: left !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-brand {
    align-self: flex-start !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body {
    margin: 28px 0 0 !important;
    text-align: left !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-kicker {
    margin: 0 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #d8b66b !important;
    -webkit-text-fill-color: #d8b66b !important;
    box-shadow: none !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body h1 {
    max-width: 11ch !important;
    margin: 0 0 14px !important;
    background: none !important;
    color: #f8f2e7 !important;
    -webkit-text-fill-color: #f8f2e7 !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: clamp(39px, 11vw, 48px) !important;
    font-weight: 400 !important;
    line-height: 0.98 !important;
    text-align: left !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-body p {
    max-width: 31rem !important;
    color: rgba(248,242,231,0.72) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-points,
  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-footer {
    display: none !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-flow-panel {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 25px 18px 30px !important;
    border-radius: 0 0 2px 2px !important;
  }
}

@media (max-width: 640px) {
  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-brand > span:last-child {
    color: #f8f2e7 !important;
    font-size: 14px !important;
    letter-spacing: 0.14em !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .meta-onboarding-mark {
    width: 30px !important;
    height: 30px !important;
  }

  .ob-container.ob-light-theme.meta-funnel-theme .vb-dob-eyebrow {
    margin-top: 20px !important;
  }
}

/* Final campaign lock: applies at every viewport after all shared funnel rules. */
.ob-container.ob-light-theme.meta-funnel-theme .vb-context-body h1 {
  background: none !important;
  color: #f8f2e7 !important;
  -webkit-text-fill-color: #f8f2e7 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 400 !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-points {
  display: grid !important;
  gap: 10px !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-point {
  padding: 10px 0 10px 20px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(216,182,107,0.16) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(248,242,231,0.72) !important;
  box-shadow: none !important;
  text-align: left !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .ob-hero-cta-v2 {
  width: 100% !important;
  min-height: 58px !important;
  justify-content: center !important;
  border-radius: 2px !important;
  background: linear-gradient(135deg, #7137ad, #3d1d62) !important;
  color: #ffffff !important;
}

@media (max-width: 900px) {
  .ob-container.ob-light-theme.meta-funnel-theme .vb-context-points {
    display: none !important;
  }
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-context-point {
  background-color: rgba(255,255,255,0.035) !important;
  background-image: none !important;
  border-color: rgba(216,182,107,0.16) !important;
}

.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-step-0 .vb-context-point,
.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-step-1 .vb-context-point,
.ob-container.ob-light-theme.meta-funnel-theme .vb-fullpage-step-2 .vb-context-point {
  background: rgba(255,255,255,0.035) !important;
  color: rgba(248,242,231,0.72) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(216,182,107,0.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.mf-page {
  --mf-plum: #241033;
  --mf-violet: #6f35a5;
  --mf-violet-soft: #a878cf;
  --mf-gold: #c9a65b;
  --mf-ivory: #fbf8f2;
  --mf-lilac: #f2ecf6;
  --mf-ink: #271d2c;
  --mf-muted: #706777;
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background:
    linear-gradient(rgba(111, 53, 165, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(111, 53, 165, 0.035) 1px, transparent 1px),
    var(--mf-ivory);
  background-size: 32px 32px;
  color: var(--mf-ink);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Helvetica Neue', Arial, sans-serif;
}

.mf-page * { box-sizing: border-box; }
.mf-page h1, .mf-page h2 { font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif; font-weight: 650; letter-spacing: -0.045em; }
.mf-page button, .mf-page input, .mf-page select { font: inherit; }

.mf-atmosphere { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.mf-orb { position: absolute; border-radius: 50%; filter: blur(4px); }
.mf-orb-one { width: 430px; height: 430px; right: -260px; top: 80px; background: radial-gradient(circle, rgba(139, 91, 180, 0.16), transparent 68%); }
.mf-orb-two { width: 360px; height: 360px; left: -240px; bottom: -80px; background: radial-gradient(circle, rgba(201, 166, 91, 0.12), transparent 68%); }

.mf-header {
  width: min(1120px, calc(100% - 32px));
  min-height: 70px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(80, 48, 102, 0.11);
}

.mf-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--mf-plum); text-decoration: none; font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif; font-size: 14px; font-weight: 750; letter-spacing: 0.11em; }
.mf-brand-symbol { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(111, 53, 165, 0.35); border-radius: 50%; color: var(--mf-violet); font-family: inherit; font-size: 13px; font-weight: 700; }
.mf-header-trust { display: inline-flex; align-items: center; gap: 7px; color: var(--mf-muted); font-size: 11px; font-weight: 700; }
.mf-lock { position: relative; width: 12px; height: 10px; display: inline-block; border: 1.5px solid currentColor; border-radius: 2px; }
.mf-lock::before { content: ''; position: absolute; left: 2px; right: 2px; bottom: 8px; height: 6px; border: 1.5px solid currentColor; border-bottom: 0; border-radius: 6px 6px 0 0; }

.mf-progress { width: min(760px, calc(100% - 32px)); margin: 20px auto 0; }
.mf-progress-meta { display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; gap: 10px; margin-bottom: 9px; color: #8d8491; font-size: 10px; letter-spacing: 0.11em; text-transform: uppercase; }
.mf-progress-meta span { color: var(--mf-violet); font-family: inherit; font-size: 13px; font-weight: 700; }
.mf-progress-meta strong { text-align: center; font-size: 9px; }.mf-progress-meta small { text-align: right; font-size: 10px; }
.mf-progress-line { height: 2px; overflow: hidden; background: rgba(83, 53, 102, 0.10); }
.mf-progress-line span { display: block; height: 100%; background: linear-gradient(90deg, var(--mf-violet), var(--mf-gold)); transition: width 0.45s ease; }

.mf-main { width: min(920px, calc(100% - 32px)); flex: 1; margin: 0 auto; padding: 38px 0 26px; }
.mf-stage { position: relative; width: min(760px, 100%); margin: 0 auto; text-align: center; }
.mf-step-mark { width: 44px; height: 44px; margin: 0 auto 18px; display: grid; place-items: center; border: 1px solid rgba(111, 53, 165, 0.22); border-radius: 50%; color: var(--mf-violet); font-family: inherit; font-weight: 700; }
.mf-step-mark span { font-size: 13px; }
.mf-eyebrow { margin: 0 0 11px; color: var(--mf-violet); font-size: 10px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.mf-stage > h1 { max-width: 690px; margin: 0 auto; font-size: clamp(43px, 6vw, 66px); line-height: 1.02; text-wrap: balance; }
.mf-intro { max-width: 590px; margin: 18px auto 0; color: var(--mf-muted); font-size: 14px; line-height: 1.65; }

.mf-date-fields { display: grid; grid-template-columns: 1.1fr 0.8fr 1fr; gap: 10px; max-width: 610px; margin: 32px auto 0; text-align: left; }
.mf-page label { display: grid; gap: 8px; color: #514657; font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.mf-control { width: 100%; min-width: 0; height: 58px; padding: 0 16px; appearance: none; border: 1px solid rgba(77, 48, 96, 0.18); border-radius: 8px; outline: 0; background: rgba(255,255,255,0.88); color: var(--mf-ink); font-size: 15px !important; font-weight: 600; letter-spacing: 0; text-transform: none; box-shadow: 0 10px 30px rgba(66, 41, 82, 0.05); transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; }
.mf-control:focus { border-color: var(--mf-violet); background: #fff; box-shadow: 0 0 0 3px rgba(111, 53, 165, 0.10), 0 14px 34px rgba(66, 41, 82, 0.08); }
select.mf-control { background-image: linear-gradient(45deg, transparent 50%, #765c84 50%), linear-gradient(135deg, #765c84 50%, transparent 50%); background-position: calc(100% - 18px) 25px, calc(100% - 13px) 25px; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.mf-reassurance { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 9px; margin-top: 20px; color: #817786; font-size: 10px; font-weight: 600; }
.mf-reassurance i { width: 3px; height: 3px; border-radius: 50%; background: var(--mf-gold); }

.mf-action { width: min(610px, 100%); margin: 28px auto 0; text-align: center; }
.mf-action > button { width: 100%; min-height: 60px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 0 22px; border: 0; border-radius: 8px; background: linear-gradient(135deg, #7138a4, #3c1b50); color: #fff; font-weight: 800; cursor: pointer; box-shadow: 0 18px 38px rgba(60, 27, 80, 0.21); transition: transform 0.2s ease, box-shadow 0.2s ease; }
.mf-action > button:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 22px 44px rgba(60, 27, 80, 0.27); }
.mf-action > button:disabled { opacity: 0.65; cursor: wait; }
.mf-action > p { margin: 11px 0 0; color: #8a818e; font-size: 10px; }
.mf-error { width: min(610px, 100%); margin: 18px auto 0; padding: 11px 14px; border: 1px solid rgba(170, 48, 74, 0.17); border-radius: 7px; background: rgba(170, 48, 74, 0.06); color: #9f2d47; font-size: 12px; font-weight: 700; text-align: center; }

.mf-reveal-layout { display: grid; grid-template-columns: 1.08fr 0.92fr; gap: 18px; text-align: left; }
.mf-insight, .mf-lead-form { padding: 30px; border: 1px solid rgba(82, 48, 105, 0.13); border-radius: 12px; }
.mf-insight { position: relative; overflow: hidden; background: linear-gradient(150deg, #2c143b, #160b20); color: #faf5ed; box-shadow: 0 20px 50px rgba(41,20,54,0.18); }
.mf-insight::after { content: ''; position: absolute; width: 240px; height: 240px; top: -130px; right: -120px; border: 1px solid rgba(201,166,91,0.18); border-radius: 50%; box-shadow: 0 0 0 38px rgba(201,166,91,0.035), 0 0 0 76px rgba(201,166,91,0.025); }
.mf-sign-token { position: relative; z-index: 1; display: grid; grid-template-columns: 42px 1fr; column-gap: 12px; align-items: center; margin-bottom: 32px; }
.mf-sign-token > span { grid-row: 1 / 3; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(201,166,91,0.4); border-radius: 50%; font-size: 20px; }
.mf-sign-token small, .mf-sign-token strong { display: block; }.mf-sign-token small { color: #a99eac; font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; }.mf-sign-token strong { color: #f0d691; font-family: inherit; font-size: 19px; font-weight: 700; }
.mf-insight .mf-eyebrow { color: #c5a765; }
.mf-insight h1 { position: relative; z-index: 1; margin: 0 0 18px; font-size: clamp(32px, 4.1vw, 46px); line-height: 1.04; }
.mf-insight-lines { display: grid; gap: 8px; }.mf-insight-lines p { margin: 0; color: #d5ccd7; font-size: 12px; line-height: 1.55; }
.mf-insight-shadow { margin-top: 18px; padding-top: 15px; border-top: 1px solid rgba(201,166,91,0.18); color: #e8dcbf; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1.45; }
.mf-lead-form { display: flex; flex-direction: column; justify-content: center; background: rgba(255,255,255,0.68); }
.mf-lead-form h2 { margin: 0; font-size: 38px; line-height: 1.02; }.mf-lead-form > p:not(.mf-eyebrow) { margin: 13px 0 20px; color: var(--mf-muted); font-size: 12px; line-height: 1.6; }
.mf-lead-form label + label { margin-top: 13px; }
.mf-privacy { display: flex; align-items: center; gap: 7px; margin-top: 14px; color: #817685; font-size: 9px; }
.mf-text-button { width: fit-content; margin-top: 14px; padding: 0; border: 0; background: transparent; color: var(--mf-violet); font-size: 10px; font-weight: 700; cursor: pointer; }
.mf-stage-reveal + .mf-error, .mf-step-1 .mf-action { width: min(920px, 100%); }

.mf-stage-precision { max-width: 820px; }
.mf-precision-grid { display: grid; grid-template-columns: 0.82fr 1.18fr; gap: 14px; margin-top: 30px; text-align: left; }
.mf-precision-grid > label { position: relative; padding: 20px; border: 1px solid rgba(80,48,102,0.13); border-radius: 10px; background: rgba(255,255,255,0.67); }
.mf-field-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mf-field-heading em { color: var(--mf-violet); font-size: 8px; font-style: normal; letter-spacing: 0.07em; }
.mf-unknown { display: flex; align-items: center; gap: 7px; margin-top: 9px; color: #776d7c; font-size: 9px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.mf-unknown input { width: 14px; height: 14px; accent-color: var(--mf-violet); }
.mf-control-disabled { opacity: 0.45; }
.mf-location-control { position: relative; }.mf-location-control > svg { position: absolute; z-index: 1; top: 20px; left: 15px; color: var(--mf-violet); }.mf-location-control .mf-control { padding-left: 43px; }
.mf-results { position: absolute; z-index: 20; top: calc(100% - 12px); left: 20px; right: 20px; overflow: hidden; border: 1px solid rgba(80,48,102,0.18); border-radius: 8px; background: #fff; box-shadow: 0 22px 50px rgba(55,31,69,0.17); }
.mf-results button { width: 100%; display: flex; align-items: flex-start; gap: 9px; padding: 12px 13px; border: 0; border-bottom: 1px solid rgba(80,48,102,0.08); background: #fff; color: #3e3343; text-align: left; font-size: 11px; cursor: pointer; }.mf-results button:hover { background: #f8f3fa; }.mf-results svg { flex: 0 0 auto; color: var(--mf-violet); }
.mf-unlocks { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 18px; }.mf-unlocks span { padding: 7px 10px; border: 1px solid rgba(111,53,165,0.13); border-radius: 999px; background: rgba(255,255,255,0.58); color: #695b70; font-size: 9px; font-weight: 700; }

.mf-footer { width: min(1120px, calc(100% - 32px)); min-height: 48px; margin: auto auto 0; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgba(80,48,102,0.09); color: #978e9a; font-size: 9px; }.mf-footer > span { color: #716777; font-family: inherit; font-weight: 750; letter-spacing: 0.11em; }

@media (max-width: 720px) {
  .mf-header { min-height: 62px; }
  .mf-brand { font-size: 14px; }.mf-brand-symbol { width: 29px; height: 29px; }
  .mf-header-trust { font-size: 9px; }
  .mf-progress { margin-top: 15px; }
  .mf-main { width: min(100% - 28px, 920px); padding: 28px 0 22px; }
  .mf-stage > h1 { font-size: clamp(39px, 10.8vw, 51px); }
  .mf-intro { margin-top: 14px; font-size: 12px; line-height: 1.55; }
  .mf-step-mark { width: 38px; height: 38px; margin-bottom: 14px; }
  .mf-date-fields { margin-top: 25px; gap: 7px; }.mf-date-fields label { gap: 6px; }.mf-date-fields .mf-control { height: 54px; padding: 0 11px; font-size: 14px !important; }
  select.mf-control { background-position: calc(100% - 14px) 23px, calc(100% - 10px) 23px; background-size: 4px 4px, 4px 4px; }
  .mf-reassurance { gap: 7px; font-size: 8.5px; }
  .mf-action { margin-top: 24px; }.mf-action > button { min-height: 58px; }.mf-action > p { font-size: 9px; }
  .mf-reveal-layout { grid-template-columns: 1fr; }
  .mf-insight, .mf-lead-form { padding: 24px 20px; border-radius: 9px; }
  .mf-sign-token { margin-bottom: 23px; }
  .mf-insight h1 { font-size: 38px; }
  .mf-lead-form h2 { font-size: 34px; }
  .mf-precision-grid { grid-template-columns: 1fr; margin-top: 24px; }
  .mf-precision-grid > label { padding: 16px; }
  .mf-results { left: 16px; right: 16px; }
  .mf-footer { display: none; }
}

@media (max-width: 380px) {
  .mf-header-trust { font-size: 0; }.mf-header-trust::after { content: 'Secure'; font-size: 9px; }
  .mf-date-fields { grid-template-columns: 1fr 0.75fr 0.9fr; }
  .mf-reassurance span:nth-of-type(2), .mf-reassurance i:nth-of-type(2) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .mf-page *, .mf-page *::before, .mf-page *::after { animation: none !important; transition: none !important; }
}