.choice-page {
  min-height: 100svh;
  background:
    radial-gradient(circle at 16% 88%, rgba(111, 47, 170, .17), transparent 36%),
    radial-gradient(circle at 86% 18%, rgba(185, 129, 62, .13), transparent 32%),
    #020611;
}

.choice-page::before,
.choice-page::after {
  position: fixed;
  z-index: 0;
  width: 44vw;
  height: 44vw;
  border: 1px solid rgba(214, 167, 94, .13);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.choice-page::before { top: -31vw; left: -10vw; }
.choice-page::after { right: -20vw; bottom: -32vw; }

.choice-shell {
  position: relative;
  z-index: 1;
  width: min(100% - 34px, 1240px);
  min-height: 100svh;
  margin-inline: auto;
  padding: max(22px, env(safe-area-inset-top)) 0 max(30px, env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
}

.choice-brand {
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 15px;
}

.choice-brand .brand-logo-image { width: 145px; height: 70px; }
.choice-brand .brand-logo-image img { top: -48px; left: -30px; width: 200px; }
.choice-eyebrow { color: #8c8995; font-size: 11px; letter-spacing: .2em; white-space: nowrap; }

.choice-intro {
  margin: clamp(28px, 5vh, 64px) auto clamp(25px, 4vh, 48px);
  text-align: center;
}

.choice-kicker {
  margin: 0 0 13px;
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .32em;
}

.choice-intro h1 {
  margin: 0;
  color: var(--gold-light);
  font-family: var(--display);
  font-size: clamp(40px, 7vw, 74px);
  font-weight: 200;
  line-height: 1.18;
  letter-spacing: .03em;
}

.choice-intro > p:last-child {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: clamp(13px, 2vw, 17px);
  line-height: 1.8;
}

.path-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 2.5vw, 30px);
}

.path-card {
  position: relative;
  min-height: clamp(380px, 48vh, 530px);
  overflow: hidden;
  border: 1px solid rgba(214, 167, 94, .4);
  border-radius: 24px;
  background: #090d1e;
  box-shadow: 0 25px 70px rgba(0, 0, 0, .32);
  isolation: isolate;
  transition: transform .36s var(--ease), border-color .36s ease, box-shadow .36s ease;
}

.path-card:hover {
  border-color: rgba(241, 207, 147, .82);
  box-shadow: 0 34px 92px rgba(0, 0, 0, .48);
  transform: translateY(-7px);
}

.path-card:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 5px; }

.path-card > img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease), filter .5s ease;
}

.path-card:hover > img { transform: scale(1.035); }

.path-card::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(2, 6, 17, .03) 4%, rgba(2, 6, 17, .36) 42%, rgba(2, 6, 17, .97) 92%);
}

.path-card-virtual > img,
.path-card-real > img {
  inset: 0 0 auto;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
}
.path-card-virtual > img { filter: saturate(.85) brightness(.72) contrast(1.08); }
.path-card-real > img { filter: saturate(.78) brightness(.7) sepia(.05); }
.path-card-real::after { background: linear-gradient(180deg, rgba(24, 11, 6, .03) 4%, rgba(13, 8, 8, .35) 42%, rgba(16, 9, 8, .98) 92%); }

.path-glow {
  position: absolute;
  z-index: -1;
  inset: auto -12% -28% 20%;
  height: 55%;
  border-radius: 50%;
  background: rgba(119, 53, 177, .25);
  filter: blur(70px);
}

.path-card-real .path-glow { inset: auto 10% -28% -12%; background: rgba(205, 142, 70, .21); }

.path-content {
  position: absolute;
  inset: auto 0 0;
  padding: clamp(23px, 3.5vw, 40px);
}

.path-index {
  position: absolute;
  right: clamp(23px, 3.5vw, 40px);
  bottom: clamp(25px, 3.5vw, 41px);
  color: rgba(241, 207, 147, .18);
  font-family: var(--display);
  font-size: clamp(64px, 8vw, 110px);
  font-weight: 200;
  line-height: .8;
}

.path-label {
  width: fit-content;
  margin-bottom: 13px;
  padding: 7px 11px;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(185, 104, 234, .45);
  border-radius: 999px;
  color: #d8aff0;
  background: rgba(56, 18, 78, .42);
  font-size: 12px;
  letter-spacing: .08em;
  backdrop-filter: blur(12px);
}

.path-card-real .path-label {
  border-color: rgba(230, 177, 98, .43);
  color: var(--gold-light);
  background: rgba(86, 48, 18, .42);
}

.path-content h2 {
  margin: 0;
  color: #faf2e7;
  font-family: var(--display);
  font-size: clamp(29px, 4vw, 48px);
  font-weight: 200;
  line-height: 1.35;
}

.path-content p {
  position: relative;
  z-index: 2;
  max-width: 82%;
  margin: 12px 0 19px;
  color: #aaa6b1;
  font-size: 12px;
  line-height: 1.8;
}

.path-action {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--gold-light);
  font-size: 13px;
  font-weight: 500;
}

.path-action i { transition: transform .25s ease; }
.path-card:hover .path-action i { transform: translateX(4px); }

.choice-note {
  margin: auto 0 0;
  padding-top: clamp(22px, 4vh, 38px);
  color: #797783;
  font-size: 11px;
  line-height: 1.7;
  text-align: center;
}
.choice-note i { margin-right: 5px; color: var(--gold); }

/* Dedicated route pages */
.track-page { background: var(--bg); }
.track-page.virtual-track { --track-accent: #a152dc; --track-soft: rgba(161, 82, 220, .18); }
.track-page.real-track { --track-accent: #d6a75e; --track-soft: rgba(214, 167, 94, .16); }

.track-nav { position: relative; z-index: 8; }
.track-nav .brand-logo-image { width: 142px; height: 74px; }
.track-nav .brand-logo-image img { top: -46px; left: -27px; width: 192px; }
.track-nav-actions { display: flex; align-items: center; gap: 9px; }
.track-back,
.track-consult {
  min-height: 39px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(3, 8, 23, .78);
  font-size: 11px;
  cursor: pointer;
}
.track-consult { color: var(--gold-light); }
.track-back:focus-visible, .track-consult:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }

.track-hero { min-height: 820px; }
.track-hero .hero-layout { padding-top: clamp(72px, 11vh, 125px); }
.track-tag {
  width: fit-content;
  margin-bottom: 19px;
  padding: 8px 13px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid color-mix(in srgb, var(--track-accent) 55%, transparent);
  border-radius: 999px;
  color: color-mix(in srgb, var(--track-accent) 78%, white);
  background: var(--track-soft);
  font-size: 12px;
  letter-spacing: .12em;
}
.track-hero .hero-copy > p { max-width: 590px; }
.track-hero .hero-static { border-radius: 26px; overflow: hidden; }
.track-hero.real-track-hero .hero-static > img { object-position: 50% center; }
.real-track .track-hero .hero-static {
  top: 128px;
  right: -2%;
  width: 58%;
  height: auto;
  aspect-ratio: 16 / 9;
}
.real-track .track-hero .hero-static::after {
  background:
    linear-gradient(90deg, rgba(3,8,23,.62) 0%, rgba(3,8,23,.08) 24%, transparent 48%),
    linear-gradient(0deg, var(--bg) 0%, transparent 17%, transparent 88%, rgba(3,8,23,.72) 100%);
}

.track-summary {
  margin-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.track-summary span {
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  color: #aca8b3;
  background: rgba(6, 10, 26, .55);
  font-size: 11px;
  backdrop-filter: blur(8px);
}

.route-switch {
  width: min(100% - 34px, 620px);
  margin: -30px auto 74px;
  padding: 5px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--line-soft);
  border-radius: 15px;
  background: #070c1c;
}
.route-switch a {
  min-height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 10px;
  color: #8e8b96;
  font-size: 12px;
}
.route-switch a.is-active { color: #171006; background: var(--gold-light); font-weight: 700; }

.virtual-track .avatar-showcase {
  width: 100%;
  aspect-ratio: 16 / 9;
}

.virtual-track .avatar-showcase > img { object-position: center; }

.visual-report-real { background: #090b15; }
.visual-report-real img { object-position: 50% 22%; }

.track-page .proof-nav {
  width: min(100%, 620px);
  padding: 5px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #070c1c;
}

.track-page .proof-tab {
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 9px;
}

.track-page .proof-tab::after { display: none; }
.track-page .proof-tab.is-active {
  border-color: rgba(214, 167, 94, .32);
  color: var(--gold-light);
  background: linear-gradient(135deg, rgba(214,167,94,.16), rgba(161,82,220,.12));
}

.two-report-deck {
  width: min(78%, 720px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.benefits-heading .route-heading-label {
  display: inline-flex;
  margin-bottom: 16px;
  color: var(--track-accent);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .22em;
}

.support-item.is-exclusive .support-marker {
  border-color: color-mix(in srgb, var(--track-accent) 65%, transparent);
  color: color-mix(in srgb, var(--track-accent) 76%, white);
  box-shadow: 0 0 35px var(--track-soft);
}
.support-exclusive-tag { display: inline-flex; margin-top: 10px; color: var(--track-accent); font-size: 10px; letter-spacing: .14em; }

.track-proof-note { margin: 15px 0 0; color: var(--muted-2); font-size: 11px; text-align: center; }
.real-short-grid { width: min(100%, 760px); margin-inline: auto; grid-template-columns: 1fr; }
.real-short-grid .case-cover { aspect-ratio: 16 / 9; }

@media (min-width: 900px) {
  .choice-shell { width: min(100% - 70px, 1240px); }
  .track-hero .hero-static { right: 0; width: 50%; height: 680px; }
  .virtual-track .track-hero .hero-static > img { object-position: center; }
  .real-track .track-hero .hero-static { top: 138px; width: 58%; height: auto; }
  .real-short-grid { grid-template-columns: 1fr; width: min(62%, 700px); }
}

@media (max-width: 720px) {
  .choice-shell { display: block; }
  .choice-brand .brand-rule { display: none; }
  .choice-eyebrow { margin-left: auto; }
  .choice-intro { margin-top: 35px; }
  .path-grid { grid-template-columns: 1fr; }
  .path-card { min-height: 390px; }
  .path-card-virtual > img,
  .path-card-real > img { object-position: center; }
  .choice-note { padding-bottom: 12px; }
  .track-nav .brand-rule { display: none; }
  .track-nav-actions { margin-left: auto; }
  .track-consult { display: none; }
  .track-hero { min-height: 790px; }
  .track-hero .hero-layout { padding-top: 52px; }
  .track-hero .hero-copy { position: relative; z-index: 3; }
  .track-hero .hero-static { top: 250px; right: -45%; width: 145%; height: 560px; opacity: .42; }
  .real-track .track-hero .hero-static {
    top: 318px;
    right: 0;
    left: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    opacity: .5;
  }
  .route-switch { margin-top: -22px; margin-bottom: 60px; }
  .two-report-deck { width: 100%; gap: 10px; }
}

@media (max-width: 420px) {
  .choice-shell { width: min(100% - 26px, 1240px); }
  .choice-brand .brand-logo-image {
    width: 145px;
    min-width: 145px;
    height: 70px;
  }
  .choice-brand .brand-logo-image img { left: -28px; }
  .choice-intro h1 { font-size: 39px; }
  .choice-intro > p:last-child { max-width: 300px; margin-inline: auto; }
  .path-card { min-height: 372px; border-radius: 20px; }
  .path-content p { max-width: 94%; }
  .path-index { display: none; }
  .track-nav .brand-logo-image {
    width: 142px;
    min-width: 142px;
    height: 74px;
  }
  .track-back { padding-inline: 10px; }
  .track-back span { display: none; }
  .track-hero .hero-static { top: 290px; height: 520px; }
  .real-track .track-hero .hero-static { top: 340px; height: auto; }
}
