/* =========================================================================
   IFERP Membership Comparison — HTML/CSS/Bootstrap/JS
   Faithful reproduction of the original React (Tailwind) design — v4 variant.
   ========================================================================= */

:root {
  /* Slate */
  --slate-50:#f8fafc; --slate-100:#f1f5f9; --slate-200:#e2e8f0; --slate-300:#cbd5e1;
  --slate-400:#94a3b8; --slate-500:#64748b; --slate-600:#475569; --slate-650:#3f4d63; --slate-700:#334155;
  --slate-800:#1e293b; --slate-900:#0f172a; --slate-950:#020617;
  /* Indigo */
  --indigo-50:#eef2ff; --indigo-100:#e0e7ff; --indigo-150:#dadffb; --indigo-200:#c7d2fe;
  --indigo-300:#a5b4fc; --indigo-400:#818cf8; --indigo-500:#6366f1; --indigo-600:#4f46e5;
  --indigo-700:#4338ca; --indigo-800:#3730a3;
  /* Blue */
  --blue-50:#eff6ff; --blue-100:#dbeafe; --blue-600:#2563eb;
  /* Purple / Violet */
  --purple-500:#a855f7; --purple-600:#9333ea;
  --violet-50:#f5f3ff; --violet-600:#7c3aed;
  --emerald-500:#10b981;
  /* Orange (Virtual/Physical tags) */
  --orange-50:#fff7ed; --orange-100:#ffedd5; --orange-600:#ea580c;
  /* Brand (v4 signature purple) */
  --brand:#5f50f0; --brand-dark:#4d3ee0; --lav:#eae8ff; --lav-text:#222133;

  --font-sans:"Inter","Plus Jakarta Sans",ui-sans-serif,system-ui,sans-serif;
  --font-display:"Plus Jakarta Sans",sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;

  --header-h: 76px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-sans);
  color: var(--slate-900);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100vh;
  background: #ffffff;
  overflow-x: hidden;
}
main { min-height: 100vh; overflow-x: hidden; }
::selection { background: var(--indigo-100); color: var(--indigo-800); }

h1,h2,h3,h4,h5,h6,p,ul,figure { margin: 0; }
ul { list-style: none; padding: 0; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
img { display: block; max-width: 100%; }

.font-display { font-family: var(--font-display); }
.font-mono { font-family: var(--font-mono); }

/* ----- Layout helpers ----- */
.container-fluid-c { width: 100%; margin-inline: auto; padding-inline: 1.5rem; }
@media (min-width:640px){ .container-fluid-c{ max-width:640px; } }
@media (min-width:768px){ .container-fluid-c{ max-width:768px; } }
@media (min-width:1024px){ .container-fluid-c{ max-width:1024px; } }
@media (min-width:1280px){ .container-fluid-c{ max-width:1280px; } }
@media (min-width:1536px){ .container-fluid-c{ max-width:1536px; } }

.max-w-7xl { max-width: 80rem; margin-inline: auto; }
.max-w-4xl { max-width: 56rem; margin-inline: auto; }
.max-w-3xl { max-width: 48rem; margin-inline: auto; }

.lucide { width: 1em; height: 1em; stroke-width: 2; display: inline-block; vertical-align: middle; }

/* Eyebrow labels (plain text, v4) */
.eyebrow-plain { display:block; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.3em; color:var(--indigo-600); }
.eyebrow-plain.brand { color:var(--brand); }

/* ----- Scroll reveal ----- */
.reveal { opacity: 0; transition: opacity .6s ease, transform .6s ease; will-change: opacity, transform; }
.reveal.reveal-up { transform: translateY(20px); }
.reveal.reveal-left { transform: translateX(-20px); }
.reveal.reveal-right { transform: translateX(20px); }
.reveal.is-visible { opacity: 1; transform: none; }

/* Custom Scrollbars */
.custom-scrollbar::-webkit-scrollbar { width: 5px; height: 5px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: var(--slate-300); border-radius: 10px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: var(--slate-400); }
.custom-scrollbar-horizontal::-webkit-scrollbar { height: 5px; }
.custom-scrollbar-horizontal::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar-horizontal::-webkit-scrollbar-thumb { background: var(--slate-300); border-radius: 10px; }

.is-hidden { display:none !important; }

/* =========================================================================
   NAVBAR (v4) — fixed, white, gradient join button
   ========================================================================= */
.nav-v4 {
  position: fixed; top: 0; left: 0; right: 0; z-index: 150; width: 100%;
  background: #fff; border-bottom: 1px solid var(--slate-100);
  transition: padding .3s ease, box-shadow .3s ease;
  padding-block: 1.125rem;
}
.nav-v4.scrolled { padding-block: .75rem; box-shadow: 0 2px 12px rgba(0,0,0,.03); }
.nav-inner {
  max-width: 80rem; margin-inline: auto; padding-inline: 1rem;
  display: flex; align-items: center; justify-content: space-between; height: 3rem; gap: 1rem;
}
@media (min-width:640px){ .nav-inner{ padding-inline:1.5rem; } }
@media (min-width:1024px){ .nav-inner{ padding-inline:2rem; } }

.nav-logo { flex-shrink:0; display:inline-flex; align-items:center; }
.nav-logo-box { background:#fff; border-radius:.75rem; padding:.25rem .75rem; display:flex; align-items:center; height:2.5rem; }
.nav-logo-box img { height:2rem; width:auto; object-fit:contain; }
@media (min-width:768px){ .nav-logo-box img{ height:2.25rem; } }

.nav-links { display:none; align-items:center; gap:2rem; }
@media (min-width:1024px){ .nav-links{ display:flex; } }
@media (min-width:1280px){ .nav-links{ gap:2.5rem; } }
.nav-links a { font-size:.875rem; font-weight:500; color:var(--slate-600); transition:color .2s; white-space:nowrap; }
.nav-links a:hover { color:var(--indigo-600); }

.nav-join {
  display:none; align-items:center; justify-content:center;
  padding:.625rem 1.5rem; color:#fff; font-weight:600; font-size:.875rem; border-radius:9999px;
  background:linear-gradient(to right, var(--indigo-600), var(--violet-600));
  box-shadow:0 4px 14px rgba(79,70,229,.35); transition:all .3s; white-space:nowrap;
}
@media (min-width:1024px){ .nav-join{ display:inline-flex; } }
.nav-join:hover { box-shadow:0 6px 20px rgba(79,70,229,.5); transform:translateY(-2px);
  background:linear-gradient(to right, var(--indigo-700), #6d28d9); }
.nav-join:active { transform:scale(.95); }

/* Mobile burger */
.nav-burger { display:inline-flex; align-items:center; justify-content:center; padding:.5rem; border-radius:.5rem; color:var(--slate-600); }
@media (min-width:1024px){ .nav-burger{ display:none; } }
.nav-burger .ico-close { display:none; }
.nav-toggle-checkbox:checked ~ .nav-burger .ico-open { display:none; }
.nav-toggle-checkbox:checked ~ .nav-burger .ico-close { display:inline-flex; }

/* Mobile drawer */
.nav-links {
  /* mobile defaults overridden by desktop media above */
}
@media (max-width:1023px){
  .nav-links {
    display:flex; position:absolute; left:0; right:0; top:100%;
    flex-direction:column; align-items:stretch; gap:.5rem;
    background:#fff; border-top:1px solid var(--slate-100); box-shadow:0 10px 20px rgba(0,0,0,.06);
    padding:.75rem 1rem; max-height:0; overflow:hidden; opacity:0; transition:max-height .25s ease, opacity .2s ease, padding .25s ease;
  }
  .nav-toggle-checkbox:checked ~ .nav-links { max-height:460px; opacity:1; padding:.75rem 1rem 1.5rem; }
  .nav-links a { padding:.75rem 1rem; border-radius:.75rem; font-size:.875rem; font-weight:700; color:var(--slate-700); }
  .nav-links a:hover { background:var(--slate-50); color:var(--indigo-600); }
}

/* Section scroll offset under the fixed navbar */
#home-section, #why-membership-section, #compare-section, #pricing-section,
#for-you-section, #timeline-section, #ready-to-move-section, #faq-section {
  scroll-margin-top: var(--header-h);
}

/* =========================================================================
   HERO (v4)
   ========================================================================= */
.hero {
  position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden;
  background:linear-gradient(to bottom right, #ededf5, #f4f2ff, #e7ebee);
  border-bottom:1px solid rgba(226,232,240,.5); color:var(--slate-900);
  padding-top:9rem; padding-bottom:3rem; min-height:75vh;
}
.hero-bg { position:absolute; inset:0; z-index:0; pointer-events:none; }
.blob { position:absolute; border-radius:9999px; }
.hero-bg .b1 { top:5%; right:-10%; width:750px; height:750px; background:rgba(168,85,247,.15); filter:blur(140px); opacity:.9; }
.hero-bg .b2 { bottom:5%; left:-15%; width:650px; height:650px; background:rgba(99,102,241,.10); filter:blur(120px); opacity:.8; }
.hero-bg .rad { position:absolute; inset:0; background:radial-gradient(circle at center, rgba(255,255,255,.45), transparent 80%); }

.hero .inner { position:relative; z-index:10; width:100%; }
.hero-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; text-align:center; }
@media (min-width:1024px){ .hero-grid{ grid-template-columns:repeat(12,1fr); gap:4rem; text-align:left; } }
.hero-left { grid-column:span 7 / span 7; display:flex; flex-direction:column; align-items:center; gap:1.5rem; }
@media (min-width:1024px){ .hero-left{ align-items:flex-start; } }

.pill {
  display:inline-flex; align-items:center; gap:.5rem; font-size:10px; font-weight:700; text-transform:uppercase;
  letter-spacing:.25em; color:var(--indigo-600); background:rgba(238,242,255,.7);
  border:1px solid rgba(224,231,255,.5); padding:.5rem 1rem; border-radius:9999px; user-select:none;
}
@media (min-width:768px){ .pill{ font-size:11px; } }
.pill .lucide { color:var(--indigo-600); }

.hero h1 { font-size:1.875rem; font-weight:900; letter-spacing:-.025em; line-height:1.08; color:#0f172a; }
@media (min-width:768px){ .hero h1{ font-size:2.5rem; } }
@media (min-width:1024px){ .hero h1{ font-size:58px; } }
.hero h1 .accent { font-style:italic; font-weight:700; color:var(--indigo-600); display:inline-block; margin-top:.25rem; }
.hero .lead { color:#64748b; font-size:15px; line-height:1.625; max-width:36rem; }
@media (min-width:768px){ .hero .lead{ font-size:1rem; } }

.hero-actions { display:flex; flex-direction:column; align-items:center; gap:1.125rem; padding-top:.5rem; width:100%; }
@media (min-width:640px){ .hero-actions{ flex-direction:row; justify-content:center; } }
@media (min-width:1024px){ .hero-actions{ justify-content:flex-start; } }

.btn-primary-ind {
  width:100%; padding:1rem 2rem; background:var(--indigo-600); color:#fff; font-weight:700;
  text-transform:uppercase; letter-spacing:.1em; font-size:.75rem; border-radius:.75rem;
  box-shadow:0 10px 15px -3px rgba(79,70,229,.15); transition:all .3s ease-out;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
}
.btn-primary-ind:hover { background:var(--slate-950); box-shadow:0 10px 15px -3px rgba(79,70,229,.25); transform:translateY(-2px); }
.btn-primary-ind:active { transform:scale(.95); }
.btn-outline-ind {
  width:100%; padding:1rem 2rem; border:2px solid var(--brand); color:var(--brand);
  font-weight:900; text-transform:uppercase; letter-spacing:.1em; font-size:.75rem; border-radius:.75rem;
  background:linear-gradient(to right, var(--violet-50), var(--indigo-100));
  box-shadow:0 10px 15px -3px rgba(95,80,240,.15); transition:all .3s ease-out;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
}
.btn-outline-ind:hover { background:linear-gradient(to right, #fff, var(--indigo-50)); transform:translateY(-2px); }
.btn-outline-ind:active { transform:scale(.95); }
@media (min-width:640px){ .btn-primary-ind,.btn-outline-ind{ width:auto; } }
.btn-icon { transition: transform .2s; }
.btn-primary-ind:hover .btn-icon { transform:translateX(4px); }

.hero-right { grid-column:span 5 / span 5; position:relative; justify-content:center; width:100%; display:none; }
@media (min-width:768px){ .hero-right{ display:flex; } }
.hero-right .rb1 { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:20rem; height:20rem; border-radius:9999px; background:rgba(224,231,255,.4); filter:blur(48px); pointer-events:none; }
.hero-card {
  position:relative; width:100%; max-width:32rem; background:#fff; border:1px solid var(--slate-100);
  border-radius:2.5rem; padding:1.25rem; box-shadow:0 25px 60px -15px rgba(99,102,241,.08), 0 4px 16px rgba(99,102,241,.02);
  transition:box-shadow .5s; animation: float 6s ease-in-out infinite alternate;
}
.hero-card:hover { box-shadow:0 30px 70px -10px rgba(99,102,241,.18); }
@keyframes float { from { transform: translateY(-5px); } to { transform: translateY(5px); } }
.hero-card-img {
  position:relative; overflow:hidden; border-radius:2rem; aspect-ratio:4/3; background:#ecefff;
  border:1px solid #f8fafc; display:flex; align-items:center; justify-content:center;
}
.hero-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.hero-card:hover .hero-card-img img { transform:scale(1.05); }
.hero-badge {
  position:absolute; bottom:1.25rem; left:1.25rem; right:1.25rem; background:rgba(255,255,255,.9);
  backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.6); border-radius:1rem; padding:1rem;
  display:flex; align-items:center; justify-content:space-between; gap:.75rem; box-shadow:0 12px 32px rgba(0,0,0,.05);
}
.hero-badge .hb-left { display:flex; align-items:center; gap:.75rem; }
.hero-badge .ico { width:2.5rem; height:2.5rem; border-radius:9999px; background:var(--indigo-600); display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0; box-shadow:0 4px 6px -1px rgba(79,70,229,.15); }
.hero-badge .t1 { font-size:10px; font-weight:900; letter-spacing:.1em; color:#94a3b8; text-transform:uppercase; }
.hero-badge .t2 { font-size:.875rem; font-weight:900; color:#0f172a; }
.hero-badge .hb-pill { font-size:10px; font-weight:700; color:var(--emerald-500); background:#ecfdf5; border:1px solid #d1fae5; padding:.375rem .875rem; border-radius:9999px; text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; flex-shrink:0; }

/* =========================================================================
   MEMBERSHIP MATTERS (v4)
   ========================================================================= */
.matters { position:relative; background:#fff; border-block:1px solid rgba(226,232,240,.5); color:var(--slate-900); overflow:hidden; padding-block:4rem; }
.matters .bg { position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.matters .bg .g1 { position:absolute; top:20%; left:10%; width:350px; height:350px; background:rgba(238,242,255,.3); filter:blur(100px); border-radius:9999px; }
.matters .bg .g2 { position:absolute; bottom:20%; right:10%; width:350px; height:350px; background:rgba(239,246,255,.2); filter:blur(90px); border-radius:9999px; }
.matters .wrap { position:relative; z-index:10; }
.matters-grid { display:grid; grid-template-columns:1fr; gap:2rem; align-items:center; }
@media (min-width:1024px){ .matters-grid{ grid-template-columns:repeat(12,1fr); gap:2.75rem; } }
.matters-left { display:flex; flex-direction:column; gap:1.5rem; }
@media (min-width:1024px){ .matters-left{ grid-column:span 7 / span 7; } }
@media (min-width:1024px){ .matters-right{ grid-column:span 5 / span 5; } }
.matters .head-block { display:flex; flex-direction:column; gap:1rem; }
.matters h2 { font-size:1.625rem; font-weight:900; letter-spacing:-.025em; line-height:1.12; color:var(--slate-950); }
@media (min-width:768px){ .matters h2{ font-size:1.875rem; } }
@media (min-width:1024px){ .matters h2{ font-size:42px; } }
.matters .intro { color:var(--slate-500); font-size:.875rem; line-height:1.625; max-width:36rem; }
@media (min-width:768px){ .matters .intro{ font-size:15px; } }
.matters .list { display:flex; flex-direction:column; gap:1.5rem; padding-top:.5rem; max-width:36rem; }
.matter-item { display:flex; gap:1.25rem; align-items:flex-start; }
.matter-ico { width:3rem; height:3rem; border-radius:1rem; background:var(--indigo-50); border:1px solid var(--indigo-100); color:var(--indigo-600); display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 1px 2px rgba(0,0,0,.05); }
.matter-item h3 { font-weight:800; color:var(--slate-900); font-size:1rem; margin-bottom:.25rem; }
.matter-item p { color:var(--slate-500); font-size:.875rem; line-height:1.625; }

.matters-right { margin-top:2rem; }
@media (min-width:1024px){ .matters-right{ margin-top:0; } }
.reality { background:#fff; border:1px solid rgba(226,232,240,.9); border-radius:2.5rem; padding:2rem; position:relative; box-shadow:0 20px 50px -12px rgba(99,102,241,.08), 0 4px 16px rgba(0,0,0,.02); }
@media (min-width:768px){ .reality{ padding:2.5rem; } }
.reality-badge { position:absolute; top:-1rem; right:2.5rem; background:var(--indigo-600); color:#fff; font-weight:700; font-size:.75rem; padding:.625rem 1.25rem; border-radius:1rem; box-shadow:0 10px 15px -3px rgba(79,70,229,.2); user-select:none; }
.reality-title { font-size:1.25rem; font-weight:900; letter-spacing:-.025em; color:var(--slate-900); margin-bottom:1.5rem; }
.reality .rlist { display:flex; flex-direction:column; gap:1rem; }
.reality .ritem { display:flex; align-items:center; gap:1rem; padding:1rem; border-radius:1rem; border:1px solid var(--slate-50); background:rgba(248,250,252,.7); transition:background-color .3s; }
.reality .ritem:hover { background:rgba(241,245,249,.7); }
.reality .ritem .chk { width:1.5rem; height:1.5rem; border-radius:9999px; background:var(--indigo-50); border:1px solid var(--indigo-100); color:var(--indigo-600); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.reality .ritem p { color:#334155; font-weight:600; font-size:.875rem; line-height:1.375; }
.btn-elite { width:100%; margin-top:2rem; padding:1.125rem; background:var(--indigo-600); color:#fff; font-weight:700; font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; border-radius:1rem; transition:all .3s ease-out; display:flex; align-items:center; justify-content:center; gap:.5rem; box-shadow:0 20px 25px -5px rgba(79,70,229,.1); }
.btn-elite:hover { background:var(--slate-950); transform:translateY(-2px); }
.btn-elite:hover .btn-icon { transform:translateX(4px); }

/* =========================================================================
   COMPARISON TABLE (v4)
   ========================================================================= */
.compare { width:100%; background:linear-gradient(to bottom right, #eff6ff, #f5f8ff, #f4f2ff); border-block:1px solid rgba(226,232,240,.5); padding-block:2.75rem; position:relative; overflow:hidden; }
@media (min-width:768px){ .compare{ padding-block:4rem; } }
.compare .bg { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.compare .bg .g1 { position:absolute; top:5%; left:-10%; width:700px; height:700px; background:rgba(99,102,241,.05); filter:blur(130px); border-radius:9999px; }
.compare .bg .g2 { position:absolute; bottom:5%; right:-10%; width:700px; height:700px; background:rgba(59,130,246,.05); filter:blur(130px); border-radius:9999px; }
.compare .wrap { position:relative; z-index:10; padding-inline:1rem; }
@media (min-width:640px){ .compare .wrap{ padding-inline:1.5rem; } }
@media (min-width:768px){ .compare .wrap{ padding-inline:2rem; } }

.compare-head { text-align:center; margin-bottom:2.5rem; display:flex; flex-direction:column; gap:.75rem; align-items:center; }
.compare-head h1 { font-size:1.625rem; font-weight:900; letter-spacing:-.025em; color:var(--slate-900); max-width:56rem; margin-inline:auto; line-height:1.25; font-family:var(--font-display); }
@media (min-width:640px){ .compare-head h1{ font-size:1.875rem; } }
@media (min-width:768px){ .compare-head h1{ font-size:40px; } }
.compare-head p { font-size:.875rem; color:var(--slate-500); max-width:48rem; margin-inline:auto; line-height:1.625; }
@media (min-width:640px){ .compare-head p{ font-size:1rem; } }
@media (min-width:768px){ .compare-head p{ font-size:1.125rem; } }

/* Plan cards */
.plan-cards { display:grid; grid-template-columns:1fr; gap:2rem; max-width:56rem; margin-inline:auto; margin-bottom:4rem; }
@media (min-width:768px){ .plan-cards{ grid-template-columns:repeat(2,1fr); } }
.plan-card { position:relative; background:#fff; padding:2rem; border-radius:2.5rem; transition:all .3s; display:flex; flex-direction:column; justify-content:space-between; }
@media (min-width:640px){ .plan-card{ padding:2.5rem; } }
.plan-card.free { box-shadow:0 15px 40px -5px rgba(0,0,0,.03); border:1px solid var(--slate-200); }
.plan-card.free:hover { box-shadow:0 25px 50px rgba(15,23,42,.06); border-color:var(--slate-300); transform:translateY(-6px); }
.plan-card.premium { background:#fff; box-shadow:0 20px 50px rgba(79,70,229,.06); border:2px solid var(--brand); overflow:hidden; }
.plan-card.premium:hover { box-shadow:0 30px 70px rgba(79,70,229,.18); border-color:var(--indigo-400); transform:translateY(-6px); }
.plan-card.premium .grad-overlay { position:absolute; inset:0; background:linear-gradient(to bottom right, rgba(238,242,255,.4), transparent, transparent); opacity:0; transition:opacity .5s; pointer-events:none; }
.plan-card.premium:hover .grad-overlay { opacity:1; }
.reco-badge { position:absolute; top:0; right:0; background:var(--brand); color:#fff; font-size:9px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; padding:.625rem 1.25rem; border-bottom-left-radius:20px; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.plan-ico { width:3rem; height:3rem; border-radius:1rem; display:flex; align-items:center; justify-content:center; margin-bottom:1.5rem; flex-shrink:0; transition:transform .3s; }
.plan-card:hover .plan-ico { transform:scale(1.1); }
.plan-ico.blue { background:var(--blue-50); border:1px solid rgba(219,234,254,.5); color:var(--blue-600); }
.plan-ico.crown { width:46px; height:46px; border-radius:14px; background:var(--lav); color:var(--lav-text); box-shadow:0 1px 2px rgba(0,0,0,.05); }
.plan-card h3 { font-size:1.25rem; font-weight:900; color:var(--slate-900); margin-bottom:.25rem; }
.plan-card.premium h3 { font-size:22px; font-family:var(--font-display); color:#0f172a; margin-bottom:.5rem; line-height:1.2; }
.plan-sub { color:var(--slate-400); font-size:.75rem; font-weight:600; margin-bottom:1rem; line-height:1.5; }
.plan-card.premium .plan-sub { max-width:24rem; }
.plan-price { display:flex; align-items:baseline; gap:.25rem; margin-bottom:1.5rem; margin-top:1rem; }
.plan-price .cur { font-size:1.25rem; font-weight:700; color:var(--slate-950); }
.plan-price .amt { font-size:2.5rem; font-weight:900; color:var(--slate-950); line-height:1; }
.plan-price .per { color:var(--slate-400); font-size:.75rem; font-weight:600; margin-left:.375rem; }
.premium-plus { display:flex; align-items:center; gap:.375rem; font-size:.75rem; font-weight:900; text-transform:uppercase; letter-spacing:.05em; color:var(--brand); margin-bottom:1.25rem; }
.premium-plus .pp-check { font-size:.75rem; }
.plan-divider { width:100%; height:1px; background:rgba(241,245,249,.7); margin-block:1.25rem; }
.plan-feats { display:flex; flex-direction:column; gap:1rem; margin-bottom:2rem; }
.plan-feats li { display:flex; align-items:center; gap:.75rem; color:var(--slate-600); font-weight:600; font-size:.75rem; }
@media (min-width:640px){ .plan-feats li{ font-size:.875rem; } }
.premium-feats { margin-bottom:1.75rem; }
.premium-feats li { color:var(--slate-700); font-weight:800; font-size:.75rem; line-height:1.375; }
@media (min-width:640px){ .premium-feats li{ font-size:13px; } }
.feat-check { width:1.25rem; height:1.25rem; border-radius:9999px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.feat-check.blue { background:var(--blue-50); color:var(--blue-600); }
.feat-check.lav { background:var(--lav); color:var(--brand); box-shadow:0 1px 2px rgba(0,0,0,.05); }

/* Subscription options (premium card, v4) */
.sub-options { display:flex; flex-direction:column; gap:.5rem; margin-bottom:1.75rem; padding-top:1rem; border-top:1px solid var(--slate-100); }
.sub-row { display:flex; align-items:center; justify-content:space-between; padding:.75rem 1rem; border-radius:.75rem; background:rgba(248,250,252,.5); border:1px solid var(--slate-100); }
.sub-row.hot { background:rgba(95,80,240,.05); border-color:rgba(95,80,240,.1); box-shadow:0 1px 2px rgba(0,0,0,.05); }
.sub-row .sub-label { font-size:.75rem; font-weight:700; color:var(--slate-650); }
.sub-row.hot .sub-label { font-weight:900; color:var(--slate-800); }
.sub-row .sub-price { font-size:.75rem; font-weight:800; color:var(--slate-900); }
.sub-prices { display:flex; align-items:center; gap:.375rem; }
.sub-prices .now { font-size:.75rem; font-weight:900; color:var(--brand); }
.sub-prices .was { font-size:10px; font-weight:500; color:var(--slate-400); text-decoration:line-through; }

.btn-start-free { display:block; width:100%; padding:1rem; border-radius:.75rem; background:var(--slate-950); color:#fff; font-weight:700; font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; text-align:center; box-shadow:0 4px 6px -1px rgba(0,0,0,.1); transition:all .2s; }
.btn-start-free:hover { box-shadow:0 20px 25px -5px rgba(0,0,0,.1); background:var(--indigo-600); }
.btn-upgrade { display:block; width:100%; padding:1rem; border-radius:.75rem; background:var(--brand); color:#fff; font-weight:700; font-size:.75rem; letter-spacing:.02em; text-align:center; box-shadow:0 4px 6px -1px rgba(95,80,240,.15); transition:all .2s; position:relative; z-index:10; }
@media (min-width:640px){ .btn-upgrade{ font-size:.875rem; } }
.btn-upgrade:hover { background:var(--brand-dark); }
.view-all { margin-top:1rem; text-align:center; }
.view-all button { display:inline-flex; align-items:center; gap:.375rem; font-size:.75rem; font-weight:700; color:var(--brand); }
.view-all button:hover { text-decoration:underline; }
.plan-card.free .view-all button { font-weight:900; color:var(--indigo-600); }
.plan-card .relative-z { position:relative; z-index:10; }

/* Compare All Benefits */
.compare-all { max-width:80rem; margin-inline:auto; padding-top:.5rem; }
.compare-all .cah { text-align:center; margin-bottom:1.5rem; }
.compare-all .cah h2 { font-size:1.375rem; font-weight:900; color:var(--slate-900); letter-spacing:-.025em; font-family:var(--font-display); }
@media (min-width:640px){ .compare-all .cah h2{ font-size:1.625rem; } }

.table-shell { background:#fff; border:1px solid var(--indigo-100); border-radius:1.5rem; overflow:hidden; box-shadow:0 20px 25px -5px rgba(224,231,255,.5); }
.table-scroll-x { overflow-x:auto; display:flex; flex-direction:column; }
.table-inner { min-width:fit-content; width:100%; }

.thead-row { display:grid; grid-template-columns:54% 23% 23%; background:var(--indigo-600); border-bottom:1px solid var(--indigo-100); min-height:55px; align-items:center; min-width:800px; }
@media (min-width:768px){ .thead-row{ min-width:0; } }
.thead-row .c1 { padding:.75rem 2rem; font-size:.875rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:#fff; }
.thead-row .c2,.thead-row .c3 { padding:.75rem 2rem; text-align:center; border-left:1px solid rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:13px; color:#fff; }

.compact-body { background:#fff; }
.compact-row { display:grid; grid-template-columns:54% 23% 23%; min-height:42px; border-bottom:1px solid var(--indigo-50); align-items:center; transition:background-color .15s; min-width:800px; }
@media (min-width:768px){ .compact-row{ min-width:0; } }
.compact-row:hover { background:rgba(238,242,255,.3); }
.compact-row .c1 { padding:.5rem 2rem; color:var(--slate-900); font-weight:500; font-size:.75rem; }
@media (min-width:640px){ .compact-row .c1{ font-size:.875rem; } }
.compact-row .c2 { padding:.5rem 2rem; text-align:center; border-left:1px solid var(--indigo-50); font-size:13px; font-weight:400; color:var(--slate-500); display:flex; align-items:center; justify-content:center; height:100%; }
.compact-row .c3 { padding:.5rem 2rem; text-align:center; border-left:1px solid var(--indigo-50); background:rgba(238,242,255,.3); font-size:13px; font-weight:600; color:var(--indigo-600); display:flex; align-items:center; justify-content:center; height:100%; }

.expand-bar { background:rgba(248,250,252,.5); transition:background-color .15s; padding-block:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; user-select:none; border-top:1px solid var(--indigo-50); min-width:800px; }
@media (min-width:768px){ .expand-bar{ min-width:0; } }
.expand-bar:hover { background:var(--slate-100); }
.expand-bar.collapse-variant { background:var(--slate-50); border-top:1px solid var(--indigo-100); }
.expand-bar .label { display:flex; align-items:center; justify-content:center; gap:.5rem; color:var(--brand); font-weight:800; font-size:14px; letter-spacing:.02em; }
.expand-bar.collapse-variant .label { text-transform:uppercase; letter-spacing:.1em; font-size:13px; }

.detail-scroll { overflow-y:auto; max-height:min(75vh, 760px); scroll-behavior:smooth; color:var(--slate-900); min-width:800px; }
@media (min-width:768px){ .detail-scroll{ min-width:0; } }

/* Full detailed table rows */
.group-header { padding:.75rem 2rem; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.2em; position:sticky; top:0; z-index:20; background:var(--indigo-50); color:var(--indigo-600); border-top:1px solid var(--indigo-100); border-bottom:1px solid var(--indigo-100); min-width:800px; }
@media (min-width:768px){ .group-header{ min-width:0; } }
.detail-row { display:grid; grid-template-columns:54% 23% 23%; min-height:55px; border-bottom:1px solid var(--indigo-50); transition:background-color .15s; min-width:800px; }
@media (min-width:768px){ .detail-row{ min-width:0; } }
.detail-row:hover { background:rgba(238,242,255,.3); }
.detail-row .c1 { padding:.75rem 2rem; display:flex; align-items:center; color:var(--slate-900); }
.detail-row .c2 { padding:.75rem 2rem; font-size:13px; text-align:center; border-left:1px solid var(--indigo-50); color:var(--slate-500); display:flex; align-items:center; justify-content:center; }
.detail-row .c3 { padding:.75rem 2rem; font-size:13px; font-weight:400; text-align:center; border-left:1px solid var(--indigo-50); background:rgba(238,242,255,.3); color:var(--indigo-600); display:flex; align-items:center; justify-content:center; }
.benefit-text { color:var(--slate-900); font-size:.875rem; line-height:1.625; font-weight:400; }
.tag-vp { display:inline-flex; align-items:center; padding:.125rem .375rem; border-radius:.375rem; background:var(--orange-50); color:var(--orange-600); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; margin-inline:.125rem; border:1px solid var(--orange-100); vertical-align:middle; }
.dash { width:1rem; height:.125rem; background:var(--slate-300); border-radius:9999px; }
.cell-flex { display:inline-flex; align-items:center; justify-content:center; gap:.25rem; }

/* Tooltip */
.tip { position:relative; display:inline-flex; align-items:center; margin-left:.25rem; vertical-align:middle; }
.tip-btn { color:var(--slate-400); transition:color .15s; cursor:help; display:inline-flex; }
.tip-btn:hover { color:var(--indigo-500); }
.tip-bubble { position:absolute; z-index:50; top:0; width:16rem; background:var(--slate-900); color:#fff; font-size:11px; padding:.75rem; border-radius:.5rem; box-shadow:0 20px 25px -5px rgba(0,0,0,.2); pointer-events:none; opacity:0; transform:scale(.95); transition:opacity .15s, transform .15s; left:1.5rem; }
.tip:hover .tip-bubble { opacity:1; transform:scale(1); }
.tip-bubble::after { content:""; position:absolute; left:-.25rem; top:.5rem; width:.5rem; height:.5rem; background:var(--slate-900); transform:rotate(45deg); }
.tip.pos-left .tip-bubble { left:auto; right:1.5rem; }
.tip.pos-left .tip-bubble::after { left:auto; right:-.25rem; }

.collapse-full-wrap { margin-top:2rem; text-align:center; }
.btn-collapse-full { display:inline-flex; align-items:center; gap:.5rem; padding:.75rem 1.5rem; background:var(--indigo-50); border:1px solid var(--indigo-100); color:var(--indigo-600); font-weight:900; font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; border-radius:.75rem; transition:all .2s; box-shadow:0 1px 2px rgba(0,0,0,.05); }
.btn-collapse-full:hover { background:var(--indigo-100); }

/* =========================================================================
   MEMBERSHIP PRICING (v4) — light, 4 tiers
   ========================================================================= */
.pricing { position:relative; padding-block:4rem; border-block:1px solid rgba(226,232,240,.5); overflow:hidden; background:#fff; }
@media (min-width:768px){ .pricing{ padding-block:6rem; } }
.pricing .wrap { position:relative; z-index:10; }
.pricing-head { text-align:center; margin-bottom:2.5rem; max-width:48rem; margin-inline:auto; }
.pricing-head h2 { font-weight:900; margin-bottom:1.25rem; letter-spacing:-.025em; line-height:1.2; font-size:1.625rem; color:var(--slate-950); font-family:var(--font-display); }
@media (min-width:640px){ .pricing-head h2{ font-size:1.875rem; } }
@media (min-width:768px){ .pricing-head h2{ font-size:36px; } }
.pricing-head p { color:var(--slate-500); font-weight:500; font-size:.75rem; max-width:48rem; margin-inline:auto; line-height:1.625; }
@media (min-width:640px){ .pricing-head p{ font-size:.875rem; } }
@media (min-width:768px){ .pricing-head p{ font-size:15px; } }
.pricing-grid { display:grid; grid-template-columns:1fr; gap:1.75rem; max-width:80rem; margin-inline:auto; align-items:stretch; padding-block:1rem; }
@media (min-width:768px){ .pricing-grid{ grid-template-columns:repeat(2,1fr); gap:1.5rem; padding-inline:1rem; } }
@media (min-width:1024px){ .pricing-grid{ grid-template-columns:repeat(4,1fr); gap:2rem; } }

.price-card { position:relative; display:flex; flex-direction:column; padding:2rem; border-radius:2.5rem; background:linear-gradient(to bottom right, #fafaff, #f5f6ff); border:1px solid rgba(224,231,255,.7); transition:all .3s; height:100%; user-select:none; box-shadow:0 15px 40px -5px rgba(0,0,0,.03); z-index:10; cursor:pointer; }
.price-card:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
@media (min-width:640px){ .price-card{ padding:2.25rem; } }
.price-card:hover { border-color:var(--indigo-300); transform:translateY(-4px); box-shadow:0 25px 50px rgba(95,80,240,.06); }
.price-card.popular { background:linear-gradient(to bottom right, #fafaff, #f1edfe); border:2px solid var(--brand); box-shadow:0 25px 50px rgba(95,80,240,.14); z-index:20; }
@media (min-width:768px){ .price-card.popular{ transform:scale(1.03); } }
@media (min-width:768px){ .price-card.popular:hover{ transform:scale(1.03) translateY(-4px); } }
.price-elite { position:absolute; top:-15px; left:0; right:0; display:flex; justify-content:center; z-index:30; }
.price-elite span { background:var(--brand); color:#fff; font-size:10px; font-weight:900; letter-spacing:.2em; text-transform:uppercase; padding:.5rem 1.5rem; border-radius:9999px; box-shadow:0 10px 15px -3px rgba(95,80,240,.2); }
.price-head { text-align:center; margin-bottom:1rem; margin-top:.5rem; }
.price-type { display:block; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.2em; color:rgba(95,80,240,.9); margin-bottom:.5rem; font-family:var(--font-mono); }
@media (min-width:640px){ .price-type{ font-size:11px; } }
.price-card h3 { font-size:1.125rem; font-weight:900; letter-spacing:-.025em; color:var(--slate-950); }
@media (min-width:640px){ .price-card h3{ font-size:1.25rem; } }
@media (min-width:1024px){ .price-card h3{ font-size:22px; } }
.price-amount { display:flex; align-items:baseline; justify-content:center; gap:.25rem; margin-top:.25rem; }
.price-amount .amt { font-size:36px; font-weight:900; letter-spacing:-.025em; color:var(--slate-950); }
@media (min-width:640px){ .price-amount .amt{ font-size:2.5rem; } }
.price-amount .per { color:var(--slate-500); font-size:12px; font-weight:800; margin-left:.125rem; text-transform:uppercase; letter-spacing:.02em; }
@media (min-width:640px){ .price-amount .per{ font-size:13px; } }
.price-save { height:1.5rem; margin-top:.5rem; display:flex; align-items:center; justify-content:center; }
.price-save span { color:var(--brand); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.1em; }
@media (min-width:640px){ .price-save span{ font-size:11px; } }
.price-desc { color:var(--slate-800); font-size:.75rem; font-weight:700; font-style:italic; margin-top:1rem; line-height:1.625; max-width:240px; margin-inline:auto; min-height:44px; display:flex; align-items:center; justify-content:center; text-align:center; }
@media (min-width:640px){ .price-desc{ font-size:13px; } }
.price-feats { display:flex; flex-direction:column; gap:1rem; margin-block:1.5rem; flex-grow:1; }
.price-feats .divider { height:1px; background:rgba(224,231,255,.7); width:100%; margin-bottom:.25rem; }
.price-feat { display:flex; align-items:center; gap:.75rem; width:100%; max-width:210px; margin-inline:auto; padding-left:.25rem; }
.price-feat .chk { width:1.25rem; height:1.25rem; border-radius:9999px; background:var(--indigo-600); color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 1px 2px rgba(95,80,240,.1); }
.price-feat span { color:var(--slate-900); font-weight:800; font-size:.75rem; }
@media (min-width:640px){ .price-feat span{ font-size:13px; } }
.btn-choose { width:100%; padding:.875rem; border-radius:1rem; font-weight:900; font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; transition:all .2s; background:#fff; color:var(--brand); border:1px solid var(--indigo-100); box-shadow:0 1px 2px rgba(0,0,0,.04); }
.btn-choose:hover { background:var(--slate-50); border-color:var(--indigo-300); }
.btn-choose:active { transform:scale(.98); }
.price-card.popular .btn-choose { background:var(--brand); color:#fff; border:none; box-shadow:0 10px 15px -3px rgba(95,80,240,.2); }
.price-card.popular .btn-choose:hover { background:var(--brand-dark); }
.pricing-foot { margin-top:3rem; text-align:center; }
.pricing-foot a { display:inline-flex; align-items:center; gap:.375rem; color:var(--brand); font-weight:700; font-size:.75rem; transition:color .15s; }
@media (min-width:640px){ .pricing-foot a{ font-size:.875rem; } }
.pricing-foot a:hover { text-decoration:underline; }
.pricing-foot a:hover .btn-icon { transform:translateX(2px); }

/* =========================================================================
   AUDIENCE SECTION (v4)
   ========================================================================= */
.audience { position:relative; background:linear-gradient(to bottom right, #ecf0fe, #f1f3fe, #f4f2ff); border-bottom:1px solid rgba(226,232,240,.5); color:var(--slate-900); overflow:hidden; padding-block:5rem; }
.audience .bg { position:absolute; inset:0; z-index:0; pointer-events:none; }
.audience .bg .g1 { position:absolute; top:30%; left:5%; width:15rem; height:15rem; background:rgba(99,102,241,.1); filter:blur(100px); border-radius:9999px; }
.audience .bg .g2 { position:absolute; bottom:20%; right:10%; width:15rem; height:15rem; background:rgba(59,130,246,.1); filter:blur(90px); border-radius:9999px; }
.audience .wrap { position:relative; z-index:10; }
.audience-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; }
@media (min-width:1024px){ .audience-grid{ grid-template-columns:repeat(12,1fr); gap:4rem; } }
.audience-left { display:flex; flex-direction:column; gap:1.75rem; }
@media (min-width:1024px){ .audience-left{ grid-column:span 5 / span 5; } }
.audience-right { display:flex; flex-direction:column; gap:.875rem; }
@media (min-width:1024px){ .audience-right{ grid-column:span 7 / span 7; } }
.audience .head-block { display:flex; flex-direction:column; gap:1rem; }
.audience h2 { font-size:1.875rem; font-weight:900; letter-spacing:-.025em; line-height:1.2; color:var(--slate-950); font-family:var(--font-display); }
@media (min-width:768px){ .audience h2{ font-size:36px; } }
.audience h2 span { color:var(--slate-950); }
.audience .sub { color:var(--slate-400); font-size:.875rem; line-height:1.625; }
@media (min-width:768px){ .audience .sub{ font-size:1rem; } }
.audience-card { position:relative; padding:2rem; border-radius:24px; background:var(--brand); color:#fff; display:flex; flex-direction:column; gap:1rem; overflow:hidden; box-shadow:0 10px 15px -3px rgba(95,80,240,.1); }
.audience-card .ac-blob1 { position:absolute; right:-2.5rem; bottom:-2.5rem; width:11rem; height:11rem; background:rgba(255,255,255,.1); border-radius:9999px; filter:blur(40px); }
.audience-card .ac-blob2 { position:absolute; right:10%; top:10%; width:6rem; height:6rem; background:rgba(255,255,255,.05); border-radius:9999px; }
.audience-card h4 { position:relative; z-index:10; font-size:10px; font-weight:900; color:#eae8ff; text-transform:uppercase; letter-spacing:.05em; }
.audience-card p { position:relative; z-index:10; font-size:1rem; font-weight:900; line-height:1.375; }
@media (min-width:768px){ .audience-card p{ font-size:1.125rem; } }
.btn-journey { display:inline-flex; align-items:center; gap:.5rem; padding:1rem 1.5rem; border-radius:.75rem; background:var(--brand); color:#fff; font-weight:700; font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; box-shadow:0 10px 15px -3px rgba(95,80,240,.25); transition:all .3s; }
.btn-journey:hover { background:var(--brand-dark); box-shadow:0 20px 25px -5px rgba(95,80,240,.3); }
.btn-journey:hover .btn-icon { transform:translateX(4px); }

.audience-list { display:flex; flex-direction:column; gap:.875rem; }
.audience-chip { padding:1.25rem 1.5rem; border-radius:1rem; background:#fff; border:1px solid var(--slate-200); transition:all .3s; display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; }
.audience-chip:hover { border-color:var(--indigo-300); background:rgba(248,250,252,.5); box-shadow:0 4px 6px -1px rgba(0,0,0,.07); }
.audience-chip .chip-left { display:flex; align-items:center; gap:1rem; }
.audience-chip .ico { width:2.75rem; height:2.75rem; border-radius:.75rem; background:var(--indigo-50); border:1px solid rgba(224,231,255,.5); color:var(--brand); display:flex; align-items:center; justify-content:center; transition:all .3s; flex-shrink:0; }
.audience-chip:hover .ico { background:var(--brand); color:#fff; transform:scale(1.05); }
.audience-chip span.txt { font-size:.875rem; font-weight:900; color:var(--slate-800); line-height:1.375; transition:color .15s; }
@media (min-width:768px){ .audience-chip span.txt{ font-size:1rem; } }
.audience-chip:hover span.txt { color:var(--slate-900); }
.audience-chip .chev { color:var(--slate-300); flex-shrink:0; transition:all .3s; }
.audience-chip:hover .chev { color:var(--brand); transform:translateX(4px); }

/* =========================================================================
   TIMELINE SECTION (v4) — dark
   ========================================================================= */
.timeline { position:relative; background:linear-gradient(to bottom, #0e0f3a, #080824, #040412); color:#fff; overflow:hidden; padding-block:6rem; border-top:1px solid rgba(49,46,129,.4); }
.timeline .bg { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.t-glow { position:absolute; border-radius:9999px; }
.t-glow1 { top:-5%; left:5%; width:650px; height:650px; background:linear-gradient(to top right, rgba(95,80,240,.3), rgba(168,85,247,.2)); filter:blur(150px); opacity:.8; }
.t-glow2 { bottom:2%; right:5%; width:550px; height:550px; background:rgba(168,85,247,.2); filter:blur(140px); opacity:.75; }
.t-glow3 { top:25%; left:45%; transform:translateX(-50%); width:600px; height:600px; background:rgba(99,102,241,.15); filter:blur(160px); opacity:.9; }
.t-spark { position:absolute; border-radius:9999px; animation:tpulse 2.4s cubic-bezier(.4,0,.6,1) infinite; }
.t-spark1 { top:15%; right:25%; width:100px; height:100px; background:rgba(129,140,248,.25); filter:blur(50px); }
.t-spark2 { bottom:35%; left:20%; width:120px; height:120px; background:rgba(168,85,247,.2); filter:blur(65px); }
@keyframes tpulse { 0%,100%{ opacity:.6; } 50%{ opacity:1; } }
.t-mesh { position:absolute; inset:0; opacity:.4; mix-blend-mode:overlay; background-image:radial-gradient(circle at center, rgba(255,255,255,.02) 1.5px, transparent 1.5px); background-size:24px 24px; }
.timeline .wrap { position:relative; z-index:10; max-width:56rem; margin-inline:auto; }
.timeline-head { text-align:center; margin-bottom:4rem; display:flex; flex-direction:column; gap:1rem; }
.timeline-head .eb { font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.3em; color:var(--indigo-400); }
@media (min-width:768px){ .timeline-head .eb{ font-size:11px; } }
.timeline-head h2 { font-size:1.625rem; font-weight:900; letter-spacing:-.025em; color:#fff; max-width:48rem; margin-inline:auto; line-height:1.25; }
@media (min-width:640px){ .timeline-head h2{ font-size:1.875rem; } }
@media (min-width:768px){ .timeline-head h2{ font-size:40px; } }
.timeline-head h2 span { font-style:italic; color:transparent; -webkit-background-clip:text; background-clip:text; background-image:linear-gradient(to right, var(--indigo-400), #c7d2fe, #c084fc); }
.timeline-head .t-sub { color:var(--slate-400); font-size:.75rem; font-weight:500; max-width:36rem; margin-inline:auto; line-height:1.625; }
@media (min-width:640px){ .timeline-head .t-sub{ font-size:.875rem; } }
@media (min-width:768px){ .timeline-head .t-sub{ font-size:1rem; } }

.timeline-path { position:relative; max-width:42rem; margin-inline:auto; }
.timeline-line { position:absolute; left:23px; top:1.5rem; bottom:1.5rem; width:2px; background:linear-gradient(to bottom, rgba(99,102,241,.2), rgba(168,85,247,.4), rgba(99,102,241,.1)); }
@media (min-width:640px){ .timeline-line{ left:27px; } }
#timelineMilestones { display:flex; flex-direction:column; gap:1.25rem; }
.ms-row { display:flex; gap:1rem; align-items:flex-start; position:relative; }
@media (min-width:640px){ .ms-row{ gap:1.5rem; } }
.ms-badge-col { position:relative; z-index:10; flex-shrink:0; width:48px; height:48px; display:flex; align-items:center; justify-content:center; }
.ms-badge { width:44px; height:44px; border-radius:9999px; display:flex; align-items:center; justify-content:center; font-size:.75rem; font-weight:700; transition:all .3s; }
.ms-badge.plain { background:#070714; border:1px solid rgba(30,41,59,.8); color:var(--slate-400); font-family:var(--font-mono); font-weight:600; }
.ms-row:hover .ms-badge.plain { border-color:rgba(99,102,241,.5); }
.ms-badge.hot { background:var(--brand); border:1px solid var(--brand); color:#fff; box-shadow:0 0 20px rgba(95,80,240,.55); }
.ms-card { flex-grow:1; padding:1.25rem; border-radius:.75rem; transition:all .3s; }
@media (min-width:768px){ .ms-card{ padding:1.5rem; } }
.ms-card.plain { background:rgba(6,6,19,.9); border:1px solid rgba(255,255,255,.04); }
.ms-card.plain:hover { border-color:rgba(99,102,241,.25); background:#09091b; }
.ms-card.hot { background:linear-gradient(to right, #5a4ae3, #6355f2); border:1px solid transparent; box-shadow:0 4px 20px rgba(95,80,240,.25); }
.ms-card.hot:hover { transform:scale(1.01); }
.ms-month { display:block; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.25em; font-family:var(--font-mono); margin-bottom:.25rem; }
@media (min-width:768px){ .ms-month{ font-size:11px; } }
.ms-card.plain .ms-month { color:#818cf8; }
.ms-card.hot .ms-month { color:#c7d2fe; }
.ms-title { font-size:1rem; font-weight:900; letter-spacing:-.025em; margin-bottom:.25rem; }
@media (min-width:768px){ .ms-title{ font-size:1.125rem; } }
.ms-card.plain .ms-title { color:#fff; }
.ms-card.hot .ms-title { color:#fff; }
.ms-text { font-size:.75rem; font-weight:500; line-height:1.625; }
@media (min-width:768px){ .ms-text{ font-size:.875rem; } }
.ms-card.plain .ms-text { color:var(--slate-400); }
.ms-card.hot .ms-text { color:#eee9ff; }

.results { border-top:1px solid rgba(255,255,255,.05); max-width:56rem; margin-inline:auto; margin-top:5rem; padding-top:3rem; }
.results-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
@media (min-width:1024px){ .results-grid{ grid-template-columns:repeat(4,1fr); } }
.result-item { display:flex; flex-direction:column; gap:.5rem; padding:1rem; border-radius:.75rem; background:rgba(255,255,255,.01); border:1px solid rgba(255,255,255,.02); transition:all .3s; }
.result-item:hover { background:rgba(255,255,255,.02); border-color:var(--slate-800); }
.result-item .phase { font-size:10px; font-weight:900; color:var(--indigo-400); font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.05em; }
.result-item h4 { font-size:.875rem; font-weight:700; color:#fff; line-height:1.375; }
@media (min-width:768px){ .result-item h4{ font-size:1rem; } }

/* =========================================================================
   FINAL CTA SECTION (v4)
   ========================================================================= */
.finalcta { position:relative; overflow:hidden; background:linear-gradient(to bottom right, #f8f7ff, #f1edfe, #f4f7ff); border-top:1px solid rgba(226,232,240,.5); color:var(--slate-900); padding-block:5rem; }
.finalcta .bg { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.finalcta .bg .glow { position:absolute; border-radius:9999px; }
.finalcta .bg .glow.g1 { top:-10%; right:-10%; width:600px; height:600px; background:rgba(99,102,241,.1); filter:blur(130px); opacity:.8; }
.finalcta .bg .glow.g2 { bottom:-15%; left:-10%; width:600px; height:600px; background:rgba(168,85,247,.1); filter:blur(140px); opacity:.75; }
.finalcta .bg .grid-lines { position:absolute; inset:0; opacity:.03; background-image:linear-gradient(to right,#80808012 1px,transparent 1px),linear-gradient(to bottom,#80808012 1px,transparent 1px); background-size:32px 32px; }
.finalcta .wrap { position:relative; z-index:10; }
.finalcta-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; max-width:72rem; margin-inline:auto; }
@media (min-width:1024px){ .finalcta-grid{ grid-template-columns:5fr 7fr; gap:4rem; } }
.finalcta-left { display:flex; flex-direction:column; gap:1.75rem; text-align:center; align-items:center; }
@media (min-width:1024px){ .finalcta-left{ text-align:left; align-items:flex-start; } }
.finalcta-left .fc-head { display:flex; flex-direction:column; gap:1.25rem; }
.finalcta-left h2 { font-size:1.875rem; font-weight:900; letter-spacing:-.025em; line-height:1.12; color:var(--slate-950); font-family:var(--font-display); }
@media (min-width:768px){ .finalcta-left h2{ font-size:36px; } }
.finalcta-left h2 span { color:var(--brand); }
.finalcta-left .lead { color:var(--slate-500); font-size:.875rem; line-height:1.625; max-width:32rem; font-weight:500; }
@media (min-width:768px){ .finalcta-left .lead{ font-size:1rem; } }
.finalcta-points { display:flex; flex-direction:column; gap:1rem; padding-top:1.5rem; border-top:1px solid var(--slate-200); max-width:24rem; width:100%; }
.finalcta-points p { font-size:1rem; font-weight:700; color:var(--slate-950); }

.finalcta-form { padding:2rem; border-radius:2.5rem; background:#fff; border:1px solid transparent; box-shadow:0 25px 60px -15px rgba(95,80,240,.12); position:relative; width:100%; max-width:580px; margin-inline:auto; }
@media (min-width:640px){ .finalcta-form{ padding:3rem; } }
@media (min-width:1024px){ .finalcta-form{ margin-inline:0; } }
.finalcta-form form { display:flex; flex-direction:column; gap:1.25rem; }
.form-row { display:grid; grid-template-columns:1fr; gap:1.25rem; }
@media (min-width:640px){ .form-row{ grid-template-columns:repeat(2,1fr); } }
.field { display:flex; flex-direction:column; gap:.375rem; text-align:left; }
.field label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-left:.25rem; color:var(--slate-400); }
.field input { width:100%; padding:.875rem 1.25rem; border-radius:.75rem; background:#fff; border:1px solid var(--slate-200); color:var(--slate-800); transition:all .2s; box-shadow:0 1px 2px rgba(0,0,0,.05); font-size:.875rem; font-weight:500; }
.field input::placeholder { color:rgba(148,163,184,.75); }
.field input:focus { outline:none; box-shadow:0 0 0 4px rgba(99,102,241,.1); border-color:var(--brand); }
.field input:hover { border-color:var(--slate-300); }

/* Country dropdown */
.country-field { position:relative; }
.country-trigger { width:100%; padding:.875rem 1.25rem; border-radius:.75rem; background:#fff; border:1px solid var(--slate-200); color:var(--slate-800); font-size:.875rem; transition:all .2s; box-shadow:0 1px 2px rgba(0,0,0,.05); display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.country-trigger:hover { border-color:var(--slate-300); }
.country-trigger:focus { outline:none; box-shadow:0 0 0 4px rgba(99,102,241,.1); border-color:var(--brand); }
.country-trigger .ct-text { font-weight:500; }
/* Neutralize Bootstrap 5's .placeholder skeleton utility, which otherwise
   renders this label as a solid grey block hiding the text. */
.country-trigger .ct-text.placeholder { color:#64748b; background:transparent; opacity:1; display:inline; min-height:0; vertical-align:baseline; cursor:inherit; animation:none; }
.country-trigger .ct-chev { color:var(--slate-400); transition:transform .2s; flex-shrink:0; }
.country-field.open .ct-chev { transform:rotate(180deg); }
/* Validation error states */
.field.has-error input,
.country-field.has-error .country-trigger { border-color:#ef4444; box-shadow:0 0 0 4px rgba(239,68,68,.1); }
.field-error { display:block; font-size:11px; font-weight:600; color:#ef4444; margin-left:.25rem; }
.country-menu { position:absolute; left:0; right:0; margin-top:.375rem; background:#fff; border:1px solid rgba(226,232,240,.8); border-radius:1rem; box-shadow:0 20px 25px -5px rgba(0,0,0,.15); z-index:50; overflow:hidden; display:flex; flex-direction:column; max-height:220px; }
.cm-search { padding:.625rem; border-bottom:1px solid var(--slate-100); display:flex; align-items:center; gap:.5rem; background:var(--slate-50); }
.cm-search .lucide { color:var(--slate-400); flex-shrink:0; margin-left:.375rem; }
.cm-search input { width:100%; background:transparent; border:0; outline:none; font-size:.75rem; color:var(--slate-800); padding:.25rem 0; box-shadow:none; }
.cm-search input::placeholder { color:var(--slate-400); }
.cm-list { overflow-y:auto; flex:1; padding-block:.25rem; }
.cm-list button { width:100%; text-align:left; padding:.625rem 1rem; font-size:.75rem; font-weight:600; color:var(--slate-700); transition:background-color .12s, color .12s; display:flex; align-items:center; justify-content:space-between; border-top:1px solid rgba(241,245,249,.4); }
.cm-list button:first-child { border-top:none; }
.cm-list button:hover { background:var(--indigo-50); color:var(--brand); }
.cm-list button.selected { background:rgba(238,242,255,.5); color:var(--brand); }
.cm-list .cm-dot { width:.375rem; height:.375rem; border-radius:9999px; background:var(--brand); }
.cm-empty { text-align:center; padding-block:1.5rem; font-size:.75rem; color:var(--slate-400); font-weight:500; }

.form-submit { padding-top:.75rem; }
.btn-consult { width:100%; padding:15px; background:var(--brand); color:#fff; font-weight:700; font-size:.875rem; letter-spacing:.02em; border-radius:14px; transition:all .2s; display:flex; align-items:center; justify-content:center; gap:.375rem; box-shadow:0 10px 15px -3px rgba(95,80,240,.15); }
.btn-consult:hover { background:var(--brand-dark); }
.btn-consult:active { transform:scale(.985); }
.btn-consult:hover .send-icon { transform:translateX(4px); }
.send-icon { transition:transform .2s; }

.form-success { display:flex; align-items:center; gap:.625rem; margin-top:1rem; padding:.875rem 1.125rem; border-radius:.75rem; background:#ecfdf5; border:1px solid #a7f3d0; color:#047857; font-size:.875rem; font-weight:700; line-height:1.4; }
.form-success .fs-ico { width:1.25rem; height:1.25rem; border-radius:9999px; background:var(--emerald-500); color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0; }

.or-divider { position:relative; margin-block:1.5rem; display:flex; align-items:center; justify-content:center; }
.or-divider::before { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:rgba(224,231,255,.5); }
.or-divider span { position:relative; background:#fff; padding:.25rem 1rem; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.1em; color:var(--brand); border:1px solid rgba(224,231,255,.4); border-radius:9999px; }

.finalcta-altlink { text-align:center; }
.finalcta-altlink a { display:inline-flex; align-items:center; gap:.375rem; font-size:.875rem; font-weight:700; color:var(--brand); transition:color .15s; }
.finalcta-altlink a:hover { color:var(--brand-dark); }
.finalcta-altlink a:hover .btn-icon { transform:translateX(4px); }
.finalcta-altlink .disclaimer { display:block; font-size:11px; color:var(--slate-400); margin-top:1rem; line-height:1.5; }

/* =========================================================================
   FAQ SECTION (v4)
   ========================================================================= */
.faq { position:relative; padding-block:5rem; background:#fff; color:var(--slate-900); overflow:hidden; border-top:1px solid rgba(226,232,240,.5); }
.faq .bg { position:absolute; inset:0; z-index:0; pointer-events:none; }
.faq .bg .glow { position:absolute; top:50%; left:33%; width:600px; height:600px; background:rgba(99,102,241,.05); border-radius:9999px; filter:blur(120px); }
.faq .wrap { max-width:48rem; margin-inline:auto; padding-inline:1.5rem; position:relative; z-index:10; }
.faq-head { text-align:center; margin-bottom:2.5rem; }
.faq-head .eb { font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.3em; color:var(--indigo-600); background:var(--indigo-50); padding:.375rem .875rem; border-radius:9999px; display:inline-block; margin-bottom:1rem; }
.faq-head h2 { font-size:1.375rem; font-weight:900; letter-spacing:-.025em; color:var(--slate-950); font-family:var(--font-display); }
@media (min-width:640px){ .faq-head h2{ font-size:1.625rem; } }
@media (min-width:768px){ .faq-head h2{ font-size:1.875rem; } }
.faq-head p { font-size:.875rem; font-weight:500; color:var(--slate-500); margin-top:.75rem; max-width:32rem; margin-inline:auto; }
@media (min-width:640px){ .faq-head p{ font-size:1rem; } }
.faq-list { display:flex; flex-direction:column; gap:1rem; }
.faq-item { background:linear-gradient(to bottom right, #f8f6ff, #f1edfe, #f4f7ff); border:1px solid rgba(224,231,255,.8); border-radius:1rem; overflow:hidden; transition:all .3s; }
.faq-item:hover { border-color:rgba(165,180,252,.6); box-shadow:0 12px 36px rgba(95,80,240,.08); }
.faq-item.open { box-shadow:0 8px 30px rgba(95,80,240,.05); outline:2px solid rgba(99,102,241,.1); outline-offset:-2px; }
.faq-q { width:100%; display:flex; align-items:center; justify-content:space-between; padding:1.25rem; text-align:left; transition:color .2s; }
.faq-q .qt { font-weight:700; font-size:.875rem; color:var(--slate-900); transition:color .15s; padding-right:1rem; }
@media (min-width:640px){ .faq-q .qt{ font-size:1rem; } }
.faq-item:hover .faq-q .qt { color:var(--indigo-600); }
.faq-plus { width:2rem; height:2rem; display:flex; align-items:center; justify-content:center; color:var(--slate-400); flex-shrink:0; transition:transform .3s, color .3s; }
.faq-item:hover .faq-plus { color:var(--slate-600); }
.faq-item.open .faq-plus { transform:rotate(45deg); color:var(--brand); }
.faq-a { max-height:0; overflow:hidden; transition:max-height .25s ease-in-out, opacity .25s; opacity:0; }
.faq-item.open .faq-a { opacity:1; }
.faq-a-inner { padding:.25rem 1.25rem 1.5rem; color:var(--slate-700); font-weight:600; font-size:.875rem; line-height:1.625; }
@media (min-width:640px){ .faq-a-inner{ font-size:1rem; } }
.faq-a-inner .line { height:1px; background:rgba(224,231,255,.6); margin-bottom:1rem; }

/* =========================================================================
   FOOTER (v4) — dark
   ========================================================================= */
.site-footer { position:relative; background:#0b1120; color:var(--slate-300); padding-block:4rem; padding-inline:1.5rem; overflow:hidden; border-top:1px solid #0f172a; }
.site-footer .footer-glow { position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:350px; height:150px; background:rgba(99,102,241,.05); border-radius:9999px; filter:blur(80px); pointer-events:none; }
.site-footer .inner { position:relative; z-index:10; padding-inline:1rem; }
.footer-top { display:flex; flex-direction:column; gap:2.5rem; }
@media (min-width:768px){ .footer-top{ flex-direction:row; align-items:center; justify-content:space-between; } }
.footer-logo .fl-box { background:#fff; border-radius:.75rem; padding:.375rem .875rem; display:inline-flex; align-items:center; box-shadow:0 4px 12px rgba(255,255,255,.05); transition:transform .3s; }
.footer-logo:hover .fl-box { transform:scale(1.02); }
.footer-logo img { height:1.75rem; width:auto; object-fit:contain; }
.footer-nav { display:flex; flex-wrap:wrap; align-items:center; gap:1rem 2rem; font-size:.875rem; font-weight:600; color:var(--slate-400); }
.footer-nav a:hover { color:#fff; }
.footer-divider { height:1px; background:rgba(255,255,255,.06); margin-block:2.5rem; }
.footer-bottom { display:flex; flex-direction:column; gap:1.5rem; align-items:flex-start; }
@media (min-width:768px){ .footer-bottom{ flex-direction:row; align-items:center; justify-content:space-between; } }
.footer-bottom .copy { font-size:10px; font-weight:600; letter-spacing:.05em; color:var(--slate-500); text-transform:uppercase; font-family:var(--font-mono); }
@media (min-width:768px){ .footer-bottom .copy{ font-size:.75rem; } }
.footer-legal { display:flex; align-items:center; gap:2rem; font-size:11px; font-weight:700; letter-spacing:.1em; color:#a0aec0; text-transform:uppercase; font-family:var(--font-mono); }
@media (min-width:768px){ .footer-legal{ font-size:.75rem; } }
.footer-legal a:hover { color:#fff; }