/* ── Reset & Base ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: #000;
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button { cursor: pointer; background: none; border: none; color: inherit; font-family: inherit; }
img { display: block; max-width: 100%; }
ul, ol { list-style: none; }

/* ── Typography helpers ───────────────────────────────────────────────────── */
.text-9px  { font-size: 9px; }
.text-10px { font-size: 10px; }
.text-11px { font-size: 11px; }
.text-xs   { font-size: 12px; }
.text-sm   { font-size: 14px; }
.text-base { font-size: 16px; }
.text-lg   { font-size: 18px; }
.text-xl   { font-size: 20px; }
.text-2xl  { font-size: 24px; }
.text-3xl  { font-size: 30px; }
.text-4xl  { font-size: 36px; }
.text-5xl  { font-size: 48px; }
.text-6xl  { font-size: 60px; }
.text-7xl  { font-size: 72px; }
.text-8xl  { font-size: 96px; }

/* ── Navbar ───────────────────────────────────────────────────────────────── */
.navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  transition: background 0.3s, border-color 0.3s;
  background: transparent;
  border-bottom: 1px solid transparent;
}
.navbar.scrolled {
  background: rgba(0,0,0,0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom-color: rgba(255,255,255,0.1);
}
.navbar-inner {
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 24px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) { .navbar-inner { padding: 0 48px; } }

/* Left: logo + back link */
.navbar-left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}
.navbar-logo img {
  height: 28px;
  width: auto;
  object-fit: contain;
}
@media (min-width: 768px) { .navbar-logo img { height: 32px; } }

.navbar-back-link {
  display: none;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  border-left: 1px solid rgba(255,255,255,0.1);
  padding-left: 16px;
  transition: color 0.3s;
}
.navbar-back-link:hover { color: rgba(255,255,255,0.7); }
@media (min-width: 640px) { .navbar-back-link { display: flex; } }

/* Center: desktop nav links */
.navbar-links {
  display: none;
  align-items: center;
  gap: 32px;
}
@media (min-width: 1024px) { .navbar-links { display: flex; } }

.navbar-links a {
  position: relative;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  transition: color 0.3s;
}
.navbar-links a:hover { color: #fff; }
.navbar-links a::after {
  content: '';
  position: absolute;
  bottom: -6px; left: 0;
  height: 1px;
  background: #fff;
  width: 0;
  transition: width 0.3s;
  transform-origin: left;
}
.navbar-links a:hover::after { width: 100%; }

/* Right */
.navbar-right { display: flex; align-items: center; }

.navbar-right-desktop {
  display: none;
  align-items: center;
  gap: 24px;
}
@media (min-width: 1024px) { .navbar-right-desktop { display: flex; } }

.navbar-login-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  background: #fff;
  color: #000;
  padding: 8px 20px;
  transition: background 0.2s;
}
.navbar-login-btn:hover { background: #e0e0e0; }

.navbar-powered {
  display: flex;
  align-items: center;
  gap: 6px;
  transition: opacity 0.2s;
}
.navbar-powered:hover { opacity: 0.8; }
.powered-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
}
.powered-brand {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

/* Mobile right side */
.navbar-right-mobile {
  display: flex;
  align-items: center;
  gap: 16px;
}
@media (min-width: 1024px) { .navbar-right-mobile { display: none; } }

.navbar-hamburger {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
}

/* ── Mobile Menu Overlay ──────────────────────────────────────────────────── */
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: #000;
  display: flex;
  flex-direction: column;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-12px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.mobile-menu.open {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0);
}

.mm-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  height: 80px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  flex-shrink: 0;
}
.mm-logo { height: 28px; width: auto; object-fit: contain; }
.mm-close { color: #fff; display: flex; align-items: center; justify-content: center; padding: 4px; }

.mm-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 32px;
  gap: 32px;
}

.mm-back {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  transition: color 0.2s;
}
.mm-back:hover { color: #fff; }

.mm-link {
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  transition: color 0.2s;
  display: block;
}
.mm-link:hover { color: rgba(255,255,255,0.5); }

.mm-login-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  color: #000;
  padding: 16px 32px;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  transition: background 0.2s;
  width: fit-content;
}
.mm-login-btn:hover { background: #e0e0e0; }

/* ── Shared Sections ─────────────────────────────────────────────────────── */
.section-border { border-bottom: 1px solid rgba(255,255,255,0.1); }
.page-container { max-width: 1920px; margin: 0 auto; }
.px-section { padding-left: 16px; padding-right: 16px; }
@media (min-width: 768px) {
  .px-section { padding-left: 48px; padding-right: 48px; }
}

/* ── HERO ────────────────────────────────────────────────────────────────── */
.hero-section {
  padding-top: 112px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
@media (min-width: 768px) { .hero-section { padding-top: 144px; } }

.hero-inner {
  padding: 48px 16px;
}
@media (min-width: 768px) { .hero-inner { padding: 80px 48px; } }

.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}
.hero-eyebrow-text {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #99A1AF;
}
.hero-badge {
  background: #fff;
  color: #000;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  padding: 4px 10px;
  line-height: 1;
}

.hero-title {
  font-size: 48px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 0.92;
  color: #fff;
  margin-bottom: 48px;
  text-align: center;
}
@media (min-width: 480px) { .hero-title { font-size: 60px; } }
@media (min-width: 768px) { .hero-title { font-size: 72px; text-align: left; } }
@media (min-width: 1024px) { .hero-title { font-size: 96px; } }

.hero-cycling-wrap {
  display: block;
  overflow: hidden;
  line-height: 0.92;
}
.cycling-word {
  display: block;
  color: rgba(255,255,255,0.5);
  transition: none;
}
.cycling-word span { color: #fff; }

.hero-meta {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 32px;
}
.hero-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  max-width: 512px;
}
@media (min-width: 480px) { .hero-meta-grid { grid-template-columns: repeat(4, 1fr); } }

.hero-meta-item {
  padding: 12px 16px;
}
.hero-meta-label {
  font-size: 9px;
  color: rgba(255,255,255,0.3);
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.hero-meta-value {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

/* ── RATING / COHORT SLIDER ──────────────────────────────────────────────── */
.rating-section {
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  overflow: hidden;
  height: 680px;
}

.cohort-slide {
  position: absolute;
  inset: 0;
  transition: opacity 1.8s ease-in-out;
  opacity: 0;
}
.cohort-slide.active { opacity: 1; }
.cohort-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  pointer-events: none;
}

.rating-top-fade {
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 80px;
  background: linear-gradient(to bottom, rgba(0,0,0,0.6), transparent);
  z-index: 10;
  pointer-events: none;
}
.rating-bottom-fade {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 42%;
  background: linear-gradient(to top, #000, rgba(0,0,0,0.8), transparent);
  z-index: 10;
  pointer-events: none;
}

.cohort-label {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 20;
  text-align: right;
}
@media (min-width: 768px) { .cohort-label { right: 40px; } }
.cohort-label-text {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

.rating-content {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  z-index: 20;
  padding: 0 16px 40px;
  text-align: center;
}
@media (min-width: 768px) { .rating-content { padding: 0 48px 40px; } }

.stars {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 12px;
}
.star-icon {
  width: 18px;
  height: 18px;
  fill: #fff;
  color: #fff;
}
.star-partial {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}
.star-partial .star-bg {
  position: absolute;
  inset: 0;
  fill: rgba(255,255,255,0.25);
  color: rgba(255,255,255,0.25);
}
.star-partial .star-fg-clip {
  position: absolute;
  inset: 0;
  overflow: hidden;
  width: 90%;
}
.star-partial .star-fg {
  fill: #fff;
  color: #fff;
}

.rating-number {
  font-size: 18vw;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1;
  color: #fff;
}
@media (min-width: 480px) { .rating-number { font-size: 15vw; } }
@media (min-width: 768px) { .rating-number { font-size: 11vw; } }

.rating-tagline {
  font-size: 14px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #fff;
  margin-top: 12px;
}
@media (min-width: 768px) { .rating-tagline { font-size: 20px; } }

.rating-sub {
  color: rgba(255,255,255,0.45);
  font-weight: 300;
  font-size: 14px;
  margin-top: 8px;
}

.cohort-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}
.cohort-dot {
  height: 2px;
  border-radius: 9999px;
  background: rgba(255,255,255,0.3);
  width: 8px;
  transition: width 0.5s, background 0.5s;
  border: none;
  padding: 0;
}
.cohort-dot.active { width: 32px; background: #fff; }
.cohort-dot:hover:not(.active) { background: rgba(255,255,255,0.5); }

/* ── VIDEO / CTA BLOCK ───────────────────────────────────────────────────── */
.video-cta-section {
  max-width: 1920px;
  margin: 0 auto;
  padding: 48px 16px;
}
@media (min-width: 768px) { .video-cta-section { padding: 80px 48px; } }

.video-placeholder {
  position: relative;
  width: 100%;
  aspect-ratio: 16/5;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  cursor: pointer;
  transition: background 0.5s;
  margin-bottom: 32px;
  overflow: hidden;
}
/* .video-placeholder:hover { background: rgba(255,255,255,0.055); } */
.video-grid-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  inset: 0;
  object-fit: contain; 
  /* background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px); */
  background-size: 60px 60px;
  /* pointer-events: none; */
}
.video-play-btn {
  position: relative;
  z-index: 1;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.4s, border-color 0.4s;
}
@media (min-width: 768px) { .video-play-btn { width: 64px; height: 64px; } }
.video-placeholder:hover .video-play-btn {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.4);
}
.video-play-btn svg { margin-left: 2px; }
.video-label {
  position: relative;
  z-index: 1;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  transition: color 0.3s;
}
.video-placeholder:hover .video-label { color: rgba(255,255,255,0.5); }

.mini-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}
.mini-cta-price { }
.mini-cta-strike {
  color: #4b5563;
  text-decoration: line-through;
  font-size: 14px;
  font-weight: 300;
  display: block;
}
.mini-cta-amount {
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: #fff;
  line-height: 1;
}
@media (min-width: 768px) { .mini-cta-amount { font-size: 30px; } }
.mini-cta-tag {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin-top: 4px;
}
.mini-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  color: #000;
  padding: 16px 32px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  transition: background 0.2s;
  cursor: pointer;
}
@media (min-width: 768px) { .mini-cta-btn { padding: 20px 40px; font-size: 14px; } }
.mini-cta-btn:hover { background: #e8e8e8; }

/* ── TESTIMONIALS ────────────────────────────────────────────────────────── */
.testimonials-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.testimonials-header {
  padding: 64px 16px 8px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (min-width: 768px) {
  .testimonials-header {
    padding: 64px 48px 8px;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
  }
}
.testimonials-headline {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 1;
  color: #fff;
  text-align: center;
}
@media (min-width: 768px) { .testimonials-headline { font-size: 60px; text-align: left; } }
@media (min-width: 1024px) { .testimonials-headline { font-size: 72px; } }

/* Desktop slider */
.testimonials-desktop {
  display: none;
  padding: 56px 16px;
}
@media (min-width: 768px) { .testimonials-desktop { display: block; padding: 56px 48px; } }

.testimonials-track-wrap { overflow: hidden; width: 100%; }
.testimonials-track {
  display: flex;
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
  /* width set by JS */
}
.testimonial-card {
  padding: 0 12px;
  flex-shrink: 0;
}
.testimonial-card:first-child { padding-left: 0; }
.testimonial-card:last-child { padding-right: 0; }
.testimonial-card-inner {
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.02);
  padding: 32px;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
  transition: background 0.4s;
}
@media (min-width: 1024px) { .testimonial-card-inner { padding: 40px; } }
.testimonial-card-inner:hover { background: rgba(255,255,255,0.05); }

.t-photo {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.1);
  flex-shrink: 0;
}
.t-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top; filter: grayscale(1); }
.t-quote {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: #fff;
  flex: 1;
}
@media (min-width: 1024px) { .t-quote { font-size: 20px; } }
.t-meta { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px; }
.t-name { font-weight: 900; font-size: 14px; letter-spacing: -0.01em; color: #fff; line-height: 1; }
.t-role { font-size: 12px; font-weight: 300; color: rgba(255,255,255,0.4); margin-top: 4px; }
.t-cohort { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.25); margin-top: 4px; }

.t-nav-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 32px;
}
.t-dots { display: flex; align-items: center; gap: 6px; }
.t-dot {
  height: 1px;
  background: rgba(255,255,255,0.15);
  width: 16px;
  border: none;
  padding: 0;
  transition: width 0.3s, background 0.3s;
  cursor: pointer;
}
.t-dot.active { width: 32px; background: rgba(255,255,255,0.6); }
.t-dot:hover:not(.active) { background: rgba(255,255,255,0.3); }
.t-arrows { display: flex; align-items: center; gap: 8px; }
.t-arrow {
  width: 36px; height: 36px;
  border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.3);
  transition: color 0.2s, border-color 0.2s;
}
.t-arrow:hover { color: #fff; border-color: rgba(255,255,255,0.3); }
.t-arrow:disabled { opacity: 0.2; cursor: default; }

/* Mobile slider */
.testimonials-mobile {
  display: block;
  padding: 48px 16px;
}
@media (min-width: 768px) { .testimonials-mobile { display: none; } }

.t-mobile-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  text-align: center;
  max-width: 768px;
  margin: 0 auto;
}
.t-mobile-photo {
  position: relative;
  flex-shrink: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.03);
  border-radius: 16px;
  width: 200px; height: 260px;
}
.t-mobile-photo img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: top;
  filter: grayscale(1) contrast(1.08) brightness(0.82);
  position: absolute; inset: 0;
}
.t-mobile-photo-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.8), rgba(0,0,0,0.1), transparent);
}
.t-mobile-text { min-height: 180px; display: flex; flex-direction: column; width: 100%; }
.t-mobile-quote {
  flex: 1;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; font-weight: 900; letter-spacing: -0.04em; line-height: 1.2; color: #fff;
}
.t-mobile-controls {
  display: flex; align-items: center; justify-content: center; gap: 24px;
  margin-top: 32px;
}
.t-progress-bar {
  display: flex; align-items: center; gap: 8px; max-width: 180px;
}
@media (max-width: 680px) { .t-progress-bar { display: none; } }

.t-progress-seg {
  flex: 1; height: 1px; background: rgba(255,255,255,0.1);
  position: relative; overflow: hidden;
  border: none; padding: 0; cursor: pointer;
}
.t-progress-fill {
  position: absolute; inset-y: 0; left: 0;
  background: rgba(255,255,255,0.5);
  width: 0%;
  transition: width 0.09s linear;
}
.t-progress-done { background: rgba(255,255,255,0.3); }

/* ── COMPANY TICKER ──────────────────────────────────────────────────────── */
@keyframes li-ticker-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes li-ticker-right {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}

.ticker-section {
  position: relative;
  background: #fff;
  color: #000;
  border-top: 1px solid rgba(0,0,0,0.1);
  max-width: 1920px;
  margin: 0 auto;
  padding: 40px 0;
  text-align: center;
  overflow: hidden;
}
@media (min-width: 768px) { .ticker-section { padding: 56px 0; } }

.ticker-headline {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #000;
  max-width: 768px;
  margin: 0 auto 28px;
  padding: 0 16px;
}
@media (min-width: 480px) { .ticker-headline { font-size: 20px; } }
@media (min-width: 768px) { .ticker-headline { font-size: 24px; margin-bottom: 40px; } }

.ticker-row { position: relative; margin-bottom: 20px; }
.ticker-row:last-child { margin-bottom: 0; }

.ticker-track {
  display: flex;
  align-items: center;
  gap: 40px;
  width: max-content;
}
@media (min-width: 768px) { .ticker-track { gap: 56px; } }
.ticker-track.left  { animation: li-ticker-left  28s linear infinite; }
.ticker-track.right { animation: li-ticker-right 32s linear infinite; }

.ticker-name {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: rgba(0,0,0,0.2);
  white-space: nowrap;
  user-select: none;
  cursor: default;
  transition: color 0.3s;
}
@media (min-width: 768px) { .ticker-name { font-size: 24px; } }
@media (min-width: 1024px) { .ticker-name { font-size: 30px; } }
.ticker-name:hover { color: rgba(0,0,0,0.6); }

.ticker-fade-left {
  pointer-events: none;
  position: absolute; inset-y: 0; left: 0;
  width: 96px;
  background: linear-gradient(to right, white, transparent);
}
.ticker-fade-right {
  pointer-events: none;
  position: absolute; inset-y: 0; right: 0;
  width: 96px;
  background: linear-gradient(to left, white, transparent);
}
@media (min-width: 768px) {
  .ticker-fade-left, .ticker-fade-right { width: 160px; }
}

/* ── PROBLEMS SECTION ────────────────────────────────────────────────────── */
.problems-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.problems-inner { padding: 80px 16px 64px; }
@media (min-width: 768px) { .problems-inner { padding: 80px 48px 64px; } }

.problems-header { margin-bottom: 56px; }
.problems-headline {
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
  text-align: center;
}
@media (min-width: 768px) { .problems-headline { font-size: 48px; text-align: left; } }
@media (min-width: 1024px) { .problems-headline { font-size: 60px; } }

.problems-sub {
  color: #6b7280;
  font-weight: 300;
  font-size: 14px;
  line-height: 1.6;
  max-width: 384px;
  margin-top: 16px;
}

.problems-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .problems-grid { grid-template-columns: 1fr 1fr; } }

.problem-card {
  background: #000;
  padding: 32px;
  display: flex;
  gap: 24px;
}
@media (min-width: 768px) { .problem-card { padding: 40px; } }

.problem-letter {
  flex-shrink: 0;
  width: 40px;
  padding-top: 4px;
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: rgba(255,255,255,0.06);
  line-height: 1;
  user-select: none;
}

.problem-title {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -0.01em;
  color: #fff;
  margin-bottom: 12px;
  line-height: 1.2;
}
@media (min-width: 768px) { .problem-title { font-size: 20px; } }
.problem-body { color: #6b7280; font-weight: 300; font-size: 14px; line-height: 1.6; }

/* ── CAPABILITIES ────────────────────────────────────────────────────────── */
.capabilities-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.capabilities-header {
  padding: 80px 16px 56px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .capabilities-header { padding: 80px 48px 56px; } }

.capabilities-eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #99A1AF;
  margin-bottom: 16px;
}
.capabilities-headline {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
  margin-bottom: 16px;
  text-align: center;
}
@media (min-width: 768px) { .capabilities-headline { font-size: 48px; text-align: left; } }
@media (min-width: 1024px) { .capabilities-headline { font-size: 60px; } }

.capabilities-sub {
  color: #6b7280;
  font-weight: 300;
  font-size: 14px;
  line-height: 1.6;
  max-width: 672px;
}

.capabilities-video {
  position: relative;
  width: 100%;
  aspect-ratio: 16/6;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.02);
  cursor: pointer;
  overflow: hidden;
}
.cap-video-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(white 1px, transparent 1px),
    linear-gradient(90deg, white 1px, transparent 1px);
  background-size: 60px 60px;
  opacity: 0.03;
  pointer-events: none;
}
.cap-video-content {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;
}
.cap-video-btn {
  width: 64px; height: 64px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center;
  transition: border-color 0.3s, background 0.3s;
}
@media (min-width: 768px) { .cap-video-btn { width: 80px; height: 80px; } }
.capabilities-video:hover .cap-video-btn {
  border-color: rgba(255,255,255,0.5);
  background: rgba(255,255,255,0.05);
}
.cap-video-label {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  transition: color 0.3s;
}
.capabilities-video:hover .cap-video-label { color: rgba(255,255,255,0.4); }

.capabilities-grid-wrap {
  padding: 64px 16px;
}
@media (min-width: 768px) { .capabilities-grid-wrap { padding: 64px 48px; } }

.capabilities-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .capabilities-grid { grid-template-columns: 1fr 1fr; } }

.cap-card {
  background: #000;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
@media (min-width: 768px) { .cap-card { padding: 40px; } }

.cap-card-top {
  display: flex; align-items: flex-start; gap: 20px;
}
.cap-icon-box {
  width: 48px; height: 48px;
  flex-shrink: 0;
  border: 1px solid rgba(255,255,255,0.15);
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.cap-icon-box svg { width: 100%; height: 100%; }
.cap-letter {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  margin-bottom: 4px;
}
.cap-title {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
}
@media (min-width: 768px) { .cap-title { font-size: 24px; } }
.cap-tagline { color: rgba(255,255,255,0.5); font-weight: 300; font-size: 14px; line-height: 1.6; margin-bottom: 4px; }
.cap-body { color: #6b7280; font-weight: 300; font-size: 14px; line-height: 1.6; }
.cap-skills {
  display: flex; flex-direction: column; gap: 12px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.1);
}
.cap-skill {
  display: flex; align-items: flex-start; gap: 12px;
}
.cap-skill-check {
  width: 13px; height: 13px;
  flex-shrink: 0; margin-top: 2px;
  color: rgba(255,255,255,0.3);
}
.cap-skill-text { font-size: 14px; color: #9ca3af; font-weight: 300; line-height: 1.6; }

/* ── WHO IS THIS FOR ─────────────────────────────────────────────────────── */
.for-who-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.for-who-header {
  padding: 80px 16px 48px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (min-width: 768px) {
  .for-who-header {
    padding: 112px 48px 48px;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
  }
}
.for-who-headline {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 1;
  color: #fff;
  text-align: center;
}
@media (min-width: 768px) { .for-who-headline { font-size: 60px; text-align: left; } }
@media (min-width: 1024px) { .for-who-headline { font-size: 72px; } }
.for-who-sub {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #99A1AF;
}

.for-who-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.1);
}
@media (min-width: 480px) { .for-who-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .for-who-grid { grid-template-columns: 1fr 1fr 1fr; } }

.for-who-card {
  background: #000;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  cursor: default;
  transition: background 0.5s;
}
@media (min-width: 768px) { .for-who-card { padding: 48px; } }
.for-who-card:hover { background: #fff; }
.for-who-card:hover .fw-num { color: #6b7280; }
.for-who-card:hover .fw-role { color: #000; }
.for-who-card:hover .fw-hook { color: #6b7280; }
.for-who-card:hover .fw-body { color: #4b5563; }

.fw-num {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  transition: color 0.5s;
}
.fw-role {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.2;
  transition: color 0.5s;
}
@media (min-width: 768px) { .fw-role { font-size: 24px; } }
.fw-hook {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #99A1AF;
  transition: color 0.5s;
}
.fw-body { font-size: 14px; color: #6b7280; font-weight: 300; line-height: 1.6; transition: color 0.5s; }

/* ── GOLD STANDARD ────────────────────────────────────────────────────────── */
.gold-standard-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.gold-standard-inner {
  padding: 96px 16px 40px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: start;
}
@media (min-width: 768px) {
  .gold-standard-inner { padding: 128px 48px 40px; grid-template-columns: 1fr 1fr; gap: 64px; }
}
.gold-headline {
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 1.15;
  color: #fff;
  text-align: center;
}
@media (min-width: 768px) { .gold-headline { font-size: 36px; text-align: left; } }
@media (min-width: 1024px) { .gold-headline { font-size: 48px; } }
.awards-list { display: flex; flex-direction: column; gap: 1px; background: rgba(255,255,255,0.1); }
.award-item {
  background: #000;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.award-item img { height: 36px; width: auto; object-fit: contain; flex-shrink: 0; }
.award-label { font-size: 14px; font-weight: 900; letter-spacing: 0.2em; text-transform: uppercase; color: #fff; }
.award-desc { font-size: 14px; font-weight: 500; letter-spacing: 0.05em; color: #99A1AF; margin-top: 2px; }

/* ── COHORT PHOTOS GALLERY ───────────────────────────────────────────────── */
.cohort-gallery-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
  overflow: hidden;
}
.cohort-gallery-header {
  padding: 64px 16px 40px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
@media (min-width: 768px) { .cohort-gallery-header { padding: 64px 48px 40px; } }
.gallery-sub { font-size: 14px; font-weight: 900; letter-spacing: 0.35em; text-transform: uppercase; color: rgba(255,255,255,0.25); margin-bottom: 8px; }
.gallery-headline { font-size: 24px; font-weight: 900; letter-spacing: -0.04em; text-transform: uppercase; color: #fff; line-height: 1; }
@media (min-width: 768px) { .gallery-headline { font-size: 30px; } }
.gallery-count { font-size: 14px; font-weight: 900; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.2); display: none; }
@media (min-width: 768px) { .gallery-count { display: block; } }

.gallery-row { overflow: hidden; margin-bottom: 20px; }
.gallery-row:last-child { margin-bottom: 48px; }
.gallery-track {
  display: flex;
  gap: 20px;
  width: max-content;
  will-change: transform;
}
.gallery-track.row1 { animation: li-ticker-left 38s linear infinite; }
.gallery-track.row2 { animation: li-ticker-right 30s linear infinite; }

.gallery-img-wrap {
  position: relative;
  flex-shrink: 0;
  overflow: hidden;
}
.gallery-img-wrap.tall { width: 520px; height: 320px; }
.gallery-img-wrap.short { width: 380px; height: 220px; }
.gallery-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: grayscale(1);
  transition: filter 0.7s, transform 0.7s;
  transform: scale(1);
}
.gallery-img-wrap:hover img { filter: grayscale(0); transform: scale(1.05); }

/* ── INSTRUCTOR SECTION ──────────────────────────────────────────────────── */
.instructor-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.instructor-header {
  padding: 80px 16px 48px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .instructor-header { padding: 112px 48px 48px; } }
.instructor-eyebrow { font-size: 14px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: #99A1AF; margin-bottom: 16px; }
.instructor-headline {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 1;
  color: #fff;
  text-align: center;
}
@media (min-width: 768px) { .instructor-headline { font-size: 60px; text-align: left; } }
@media (min-width: 1024px) { .instructor-headline { font-size: 72px; } }

.instructor-grid {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 680px;
}
@media (min-width: 1024px) { .instructor-grid { grid-template-columns: 1fr 1fr; } }

.instructor-photo-col {
  position: relative;
  background: #080808;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 520px;
}
@media (min-width: 1024px) { .instructor-photo-col { border-bottom: none; border-right: 1px solid rgba(255,255,255,0.1); min-height: 0; } }

.instructor-photo-bg {
  position: absolute; inset: 0;
}
.instructor-photo-bg img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  filter: grayscale(1) contrast(1.1) brightness(0.75);
}
.instructor-photo-overlay {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 70%;
  background: linear-gradient(to top, #080808, rgba(8,8,8,0.5), transparent);
}

@media (max-width: 667px) { 
  .instructor-photo-col{
    min-height: 620px;
  }

  .instructor-photo-bg img {
    object-position: 0px -120px;
  }  
}

.instructor-photo-content {
  position: relative;
  z-index: 10;
  padding: 32px;
}
@media (min-width: 768px) { .instructor-photo-content { padding: 48px; } }
@media (min-width: 1024px) { .instructor-photo-content { padding: 64px; } }

.instructor-curated {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #99A1AF;
  margin-bottom: 16px;
}
.instructor-name {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: #fff;
  line-height: 1;
  margin-bottom: 12px;
}
@media (min-width: 768px) { .instructor-name { font-size: 48px; } }
@media (min-width: 1024px) { .instructor-name { font-size: 60px; } }
.instructor-desc { font-size: 14px; color: #9ca3af; font-weight: 300; margin-bottom: 24px; max-width: 288px; }
@media (min-width: 768px) { .instructor-desc { font-size: 16px; } }
.instructor-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.instructor-badge {
  display: flex; align-items: center; gap: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.4);
  backdrop-filter: blur(4px);
  padding: 8px 12px;
}
.instructor-badge-label { font-size: 14px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.6); line-height: 1; }
.badge-sep { width: 1px; height: 12px; background: rgba(255,255,255,0.25); }
.badge-if { font-weight: 900; font-size: 14px; color: #fff; letter-spacing: -0.02em; }

.instructor-text-col {
  padding: 64px 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 40px;
}
@media (min-width: 768px) { .instructor-text-col { padding: 96px 48px; gap: 56px; } }
@media (min-width: 1024px) { .instructor-text-col { padding: 96px 64px; } }
@media (min-width: 1280px) { .instructor-text-col { padding: 96px 96px; } }

.instructor-bio {
  font-size: 18px;
  color: #d1d5db;
  font-weight: 300;
  line-height: 1.7;
}
@media (min-width: 768px) { .instructor-bio { font-size: 24px; } }
.instructor-bio strong { color: #fff; font-weight: 500; }

.instructor-quotes {
  display: flex; flex-direction: column; gap: 32px;
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 40px;
}
.instructor-quote {
  border-left: 2px solid rgba(255,255,255,0.15);
  padding-left: 24px;
  cursor: default;
  transition: border-color 0.5s;
}
.instructor-quote:hover { border-left-color: rgba(255,255,255,0.4); }
.iq-text { color: #9ca3af; font-style: italic; font-size: 14px; line-height: 1.6; margin-bottom: 12px; transition: color 0.5s; }
@media (min-width: 768px) { .iq-text { font-size: 16px; } }
.instructor-quote:hover .iq-text { color: #e5e7eb; }
.iq-attr { font-size: 14px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #99A1AF; }

.instructor-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 40px;
}

@media (max-width: 668px) { 
  .instructor-stats{
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
  }

  .instructor-stats > div{
    flex: 0 0 100%;
    text-align: center;
  }
}

.stat-value { font-size: 24px; font-weight: 900; letter-spacing: -0.04em; color: #fff; line-height: 1; }
@media (min-width: 768px) { .stat-value { font-size: 30px; } }
.stat-label { font-size: 14px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.3); margin-top: 4px; }

/* ── FIVE REASONS ────────────────────────────────────────────────────────── */
.reasons-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
  padding: 80px 16px;
}
@media (min-width: 768px) { .reasons-section { padding: 144px 48px; } }

.reasons-eyebrow { font-size: 14px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: #99A1AF; margin-bottom: 16px; }
.reasons-headline {
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 1;
  max-width: 768px;
  margin-bottom: 80px;
  text-align: center;
}
@media (min-width: 768px) { .reasons-headline { font-size: 48px; text-align: left; } }
@media (min-width: 1024px) { .reasons-headline { font-size: 60px; } }

.reasons-list { }
.reason-row {
  border-top: 1px solid rgba(255,255,255,0.1);
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 32px 0;
  transition: background 0.5s;
  cursor: default;
}
.reason-row:last-child { border-bottom: 1px solid rgba(255,255,255,0.1); }
.reason-row:hover { background: rgba(255,255,255,0.02); }
@media (min-width: 768px) { .reason-row { grid-template-columns: 5fr 7fr; gap: 48px; padding: 48px 0; } }

.reason-left { display: flex; align-items: center; gap: 16px; }
.reason-num {
  font-size: 48px;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: rgba(255,255,255,0.1);
  user-select: none;
  display: none;
}
@media (min-width: 768px) { .reason-num { display: block; } }
.reason-title {
  font-size: 18px;
  font-weight: 900;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
@media (min-width: 768px) { .reason-title { font-size: 24px; } }
.reason-body {
  font-size: 14px;
  color: #6b7280;
  font-weight: 300;
  line-height: 1.7;
  display: flex;
  align-items: center;
  transition: color 0.5s;
}
@media (min-width: 768px) { .reason-body { font-size: 18px; } }
.reason-row:hover .reason-body { color: #d1d5db; }

/* ── PRICING SECTION ─────────────────────────────────────────────────────── */
.pricing-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.pricing-inner { padding: 80px 16px; }
@media (min-width: 768px) { .pricing-inner { padding: 80px 48px; } }

.pricing-headline {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
  margin-bottom: 48px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  text-align: center;
}
@media (min-width: 768px) { .pricing-headline { font-size: 48px; text-align: left; } }

.pricing-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.1);
}
@media (min-width: 768px) { .pricing-grid { grid-template-columns: 1fr 1fr; } }

.pricing-left { background: #000; padding: 32px; display: flex; flex-direction: column; gap: 20px; }
@media (min-width: 768px) { .pricing-left { padding: 40px; } }

.pricing-included-label {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin-bottom: 8px;
}
.pricing-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.pricing-item:last-of-type { border-bottom: none; padding-bottom: 0; }
.pricing-check {
  width: 20px; height: 20px;
  border: 1px solid rgba(255,255,255,0.15);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 2px;
}
.pricing-item-text { font-size: 14px; color: #9ca3af; font-weight: 300; line-height: 1.6; }

/* @media (max-width: 768px) { .pricing-left { text-align: center; } .pricing-item { justify-content: center;} } */

.how-to-get-in { margin-top: 16px; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 16px; }
.how-label { font-size: 14px; font-weight: 900; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(255,255,255,0.2); margin-bottom: 12px; }
.how-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,0.08); }
.how-step { background: #000; padding: 12px; display: flex; align-items: flex-start; gap: 10px; }
.how-step-n { font-size: 14px; font-weight: 900; color: rgba(255,255,255,0.15); flex-shrink: 0; margin-top: 2px; }
.how-step-title { font-size: 14px; font-weight: 700; color: #9ca3af; letter-spacing: 0.05em; line-height: 1.2; }
.how-step-desc { font-size: 14px; font-weight: 300; color: #4b5563; line-height: 1.3; margin-top: 2px; }

.money-back {
  margin-top: 16px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.03);
  padding: 20px;
  display: flex; align-items: flex-start; gap: 16px;
}
.money-back-title { font-size: 14px; font-weight: 900; letter-spacing: 0.15em; text-transform: uppercase; color: #fff; margin-bottom: 4px; }
.money-back-body { font-size: 14px; color: #6b7280; font-weight: 300; line-height: 1.6; }

.pricing-right { background: #000; padding: 32px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
@media (min-width: 768px) { .pricing-right { padding: 40px; } }

.pricing-when-box {
  border: 1px solid rgba(255,255,255,0.2);
  padding: 20px;
  background: rgba(255,255,255,0.03);
}
.pricing-when-label { font-size: 14px; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: #99A1AF; margin-bottom: 6px; }
.pricing-date { font-size: 18px; font-weight: 900; letter-spacing: -0.04em; color: #fff; line-height: 1.2; }
@media (min-width: 768px) { .pricing-date { font-size: 24px; } }
.pricing-date-sub { font-size: 14px; color: #d1d5db; font-weight: 300; margin-top: 2px; }
@media (min-width: 768px) { .pricing-date-sub { font-size: 16px; } }
.pricing-cohort-tag { font-size: 14px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #99A1AF; margin-top: 8px; }

.pricing-amount-block { }
.pricing-invest-label { font-size: 14px; font-weight: 900; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(255,255,255,0.3); margin-bottom: 12px; }
.pricing-strike { color: #4b5563; text-decoration: line-through; font-size: 16px; font-weight: 300; display: block; margin-bottom: 4px; }
@media (min-width: 768px) { .pricing-strike { font-size: 18px; } }
.pricing-price { font-size: 48px; font-weight: 900; letter-spacing: -0.04em; color: #fff; line-height: 1; }
@media (min-width: 768px) { .pricing-price { font-size: 72px; } }

.early-bird-badge {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  padding: 10px 16px;
  border: 1px solid rgba(0,211,243,0.5);
  background: rgba(0,211,243,0.07);
}
.eb-dot-wrap {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  width: 8px; height: 8px;
}
.eb-dot-pulse {
  position: absolute;
  inset: 0;
  background: #00d3f3;
  border-radius: 50%;
  animation: eb-pulse 1.5s ease-out infinite;
}
@keyframes eb-pulse {
  0% { transform: scale(1); opacity: 0.8; }
  100% { transform: scale(2.8); opacity: 0; }
}
.eb-dot-solid {
  position: relative;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #00d3f3;
}
.eb-text {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #00d3f3;
  animation: eb-fade 2s ease-in-out infinite;
}
@keyframes eb-fade {
  0%, 100% { opacity: 0.75; }
  50% { opacity: 1; }
}

.pricing-note { font-size: 14px; color: #6b7280; font-weight: 300; margin-top: 16px; }

.pricing-actions { display: flex; flex-direction: column; gap: 16px; }
.apply-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #fff;
  color: #000;
  padding: 16px 32px;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  transition: background 0.2s;
  cursor: pointer;
  width: 100%;
  border: none;
}
.apply-btn:hover { background: #e8e8e8; }

.pricing-links { display: flex; flex-direction: column; gap: 8px; padding-top: 8px; }
.pricing-link-text { font-size: 14px; color: #4b5563; }
.pricing-link-text a { color: #9ca3af; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; transition: color 0.2s; }
.pricing-link-text a:hover { color: #fff; }

/* ── FAQ ─────────────────────────────────────────────────────────────────── */
.faq-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.faq-inner {
  padding: 80px 16px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 64px;
  align-items: start;
}
@media (min-width: 768px) { .faq-inner { padding: 80px 48px; grid-template-columns: 1fr 2fr; } }

.faq-headline {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
  text-align: center;
}
@media (min-width: 768px) { .faq-headline { font-size: 48px; text-align: left; } }

.faq-list { }
.faq-item { border-bottom: 1px solid rgba(255,255,255,0.1); }
.faq-trigger {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 0;
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
}
.faq-q {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -0.01em;
  color: #fff;
  text-transform: uppercase;
  line-height: 1.3;
  padding-right: 16px;
  transition: color 0.2s;
}
@media (min-width: 768px) { .faq-q { font-size: 16px; } }
.faq-trigger:hover .faq-q { color: rgba(255,255,255,0.8); }
.faq-icon { flex-shrink: 0; margin-top: 2px; color: rgba(255,255,255,0.3); transition: color 0.2s; }
.faq-trigger:hover .faq-icon { color: #fff; }
.faq-icon svg { width: 14px; height: 14px; }
.faq-answer {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.faq-answer.open { max-height: 400px; }
.faq-a { font-size: 14px; color: #9ca3af; font-weight: 300; line-height: 1.6; padding-bottom: 24px; max-width: 672px; }

/* ── FOOTER CTA ──────────────────────────────────────────────────────────── */
.footer-cta-section {
  border-bottom: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}
.footer-cta-inner {
  padding: 80px 16px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  text-align: center;
}
@media (min-width: 768px) {
  .footer-cta-inner {
    padding: 112px 48px;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    text-align: left;
  }
}
.footer-cta-headline {
  font-size: 30px;
  font-weight: 900;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.15;
}
@media (min-width: 768px) { .footer-cta-headline { font-size: 36px; } }
@media (min-width: 1024px) { .footer-cta-headline { font-size: 48px; } }
.footer-cta-actions { flex-shrink: 0; display: flex; flex-direction: column; gap: 12px; }

/* ── Footer ──────────────────────────────────────────────────────────────── */
.site-footer {
  background: #000;
  border-top: 1px solid rgba(255,255,255,0.1);
  max-width: 1920px;
  margin: 0 auto;
}

/* 4-column grid */
.footer-grid {
  padding: 64px 24px 48px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
@media (min-width: 768px) {
  .footer-grid {
    padding: 96px 48px 48px;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
  }
}
@media (min-width: 1024px) {
  .footer-grid {
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
}

/* Brand column */
.footer-col { display: flex; flex-direction: column; }
.footer-logo-link { display: inline-block; margin-bottom: 24px; }
.footer-logo { height: 32px; width: auto; object-fit: contain; }
.footer-desc {
  color: #6b7280;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.6;
  max-width: 280px;
  margin-bottom: 32px;
}
.footer-socials { display: flex; align-items: center; gap: 16px; }
.footer-social-icon {
  width: 36px; height: 36px;
  border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.4);
  transition: color 0.2s, border-color 0.2s;
}
.footer-social-icon:hover { color: #fff; border-color: rgba(255,255,255,0.3); }

/* Column headings */
.footer-col-heading {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin-bottom: 24px;
}

/* Link lists */
.footer-links-list { display: flex; flex-direction: column; gap: 16px; list-style: none; }

.footer-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #6b7280;
  transition: color 0.2s;
}
.footer-link:hover { color: #fff; }
.footer-link:hover .footer-link-arrow { opacity: 1; }

.footer-link-arrow { opacity: 0; transition: opacity 0.2s; flex-shrink: 0; }

/* Link with sub-label (Programs column) */
.footer-link-with-sub {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
}
.footer-link-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 16px;
  font-weight: 500;
  color: #6b7280;
  transition: color 0.2s;
}
.footer-link-with-sub:hover .footer-link-label { color: #fff; }
.footer-link-with-sub:hover .footer-link-arrow { opacity: 1; }
.footer-link-sub {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
}

/* Dimmer link variant (Connect column secondary links) */
.footer-link-dim { color: #4b5563; }
.footer-link-dim:hover { color: #fff; }

/* Divider item in Connect column */
.footer-divider-item {
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.1);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Bottom bar */
.footer-bottom {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media (min-width: 768px) {
  .footer-bottom {
    padding: 24px 48px;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}
.footer-copy {
  font-size: 16px;
  font-weight: 300;
  color: rgba(255,255,255,0.2);
}
.footer-bottom-links {
  display: flex;
  align-items: center;
  gap: 24px;
}
.footer-legal-link {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  transition: color 0.2s;
}
.footer-legal-link:hover { color: rgba(255,255,255,0.4); }
.footer-part-of {
  display: flex;
  align-items: center;
  gap: 6px;
  transition: opacity 0.2s;
}
.footer-part-of:hover .part-of-label { color: rgba(255,255,255,0.4); }
.footer-part-of:hover .part-of-brand { color: rgba(255,255,255,0.6); }
.part-of-label {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  transition: color 0.2s;
}
.part-of-brand {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  transition: color 0.2s;
}

/* ── Fade-in animation ───────────────────────────────────────────────────── */
.fade-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.fade-up.visible { opacity: 1; transform: translateY(0); }

/* ══════════════════════════════════════════════════════════════════════════
   APPLY PAGE (/apply/) — scoped via body.apply-page
   ══════════════════════════════════════════════════════════════════════════ */
body.apply-page { background: #0a0a0a; user-select: none; }

/* Progress bar */
#progress-bar-wrap { position: fixed; top: 0; left: 0; right: 0; height: 2px; background: rgba(255,255,255,0.08); z-index: 200; }
#progress-bar-fill { height: 100%; background: #fff; transition: width 0.4s cubic-bezier(0.16,1,0.3,1); width: 0%; }

/* Top bar */
.top-bar { position: fixed; top: 2px; left: 0; right: 0; z-index: 100; border-bottom: 1px solid rgba(255,255,255,0.08); padding: 16px; display: flex; align-items: center; justify-content: space-between; background: #0a0a0a; }
@media (min-width: 768px) { .top-bar { padding: 16px 48px; } }
.top-bar-back { font-size: 10px; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(255,255,255,0.3); display: flex; align-items: center; gap: 6px; transition: color 0.2s; cursor: pointer; }
.top-bar-back:hover { color: #fff; }
.top-bar-back svg { width: 12px; height: 12px; }
.top-bar-brand { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.15); }
.top-bar-step { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; color: rgba(255,255,255,0.3); }
.top-bar-step .step-total { color: rgba(255,255,255,0.15); }

/* Apply screens */
#screen-intro, #screen-form, #screen-success { min-height: 100vh; display: none; }
#screen-intro.active, #screen-form.active, #screen-success.active { display: flex; flex-direction: column; }

#screen-intro { align-items: stretch; }
.intro-top-bar { border-bottom: 1px solid rgba(255,255,255,0.08); padding: 16px; display: flex; align-items: center; justify-content: space-between; margin-top: 2px; }
@media (min-width: 768px) { .intro-top-bar { padding: 16px 48px; } }
.intro-back { font-size: 10px; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(255,255,255,0.3); display: flex; align-items: center; gap: 6px; transition: color 0.2s; }
.intro-back:hover { color: #fff; }
.intro-back svg { width: 12px; height: 12px; }
.intro-brand { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.15); }
.intro-center { flex: 1; display: flex; align-items: center; justify-content: center; padding: 48px 16px; }
.intro-card { width: 100%; max-width: 360px; border: 1px solid rgba(255,255,255,0.15); background: rgba(255,255,255,0.03); position: relative; opacity: 0; transform: translateY(24px); transition: opacity 0.55s cubic-bezier(0.16,1,0.3,1), transform 0.55s cubic-bezier(0.16,1,0.3,1); }
.intro-card.visible { opacity: 1; transform: translateY(0); }
.corner { position: absolute; width: 12px; height: 12px; }
.corner-tl { top: -1px; left: -1px; border-top: 2px solid rgba(255,255,255,0.6); border-left: 2px solid rgba(255,255,255,0.6); }
.corner-tr { top: -1px; right: -1px; border-top: 2px solid rgba(255,255,255,0.6); border-right: 2px solid rgba(255,255,255,0.6); }
.corner-bl { bottom: -1px; left: -1px; border-bottom: 2px solid rgba(255,255,255,0.6); border-left: 2px solid rgba(255,255,255,0.6); }
.corner-br { bottom: -1px; right: -1px; border-bottom: 2px solid rgba(255,255,255,0.6); border-right: 2px solid rgba(255,255,255,0.6); }
.intro-card-inner { padding: 32px; display: flex; flex-direction: column; gap: 24px; }
.ic-for { font-size: 10px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(255,255,255,0.3); margin-bottom: 8px; }
.ic-title { font-size: 20px; font-weight: 900; letter-spacing: -0.02em; text-transform: uppercase; line-height: 1.2; color: #fff; }
.ic-date { font-size: 12px; color: rgba(255,255,255,0.4); font-weight: 300; margin-top: 6px; }
.ic-divider { height: 1px; background: rgba(255,255,255,0.08); }
.ic-desc { font-size: 14px; color: #9ca3af; font-weight: 300; line-height: 1.6; }
.ic-meta { display: flex; flex-direction: column; gap: 8px; }
.ic-meta-row { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 300; color: rgba(255,255,255,0.35); }
.ic-meta-row.highlight { color: #fff; font-weight: 500; }
.ic-meta-row svg { width: 11px; height: 11px; flex-shrink: 0; }
.ic-start-btn { width: 100%; display: flex; align-items: center; justify-content: center; gap: 12px; background: #fff; color: #000; padding: 16px 32px; font-size: 12px; font-weight: 900; letter-spacing: 0.25em; text-transform: uppercase; transition: background 0.2s; margin-top: 4px; border: none; cursor: pointer; }
.ic-start-btn:hover { background: #e8e8e8; }

#screen-form { padding-top: 50px; }
.form-question-area { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 16px; min-height: 400px; }
@media (min-width: 768px) { .form-question-area { padding: 48px 32px; } }
.question-wrap { width: 100%; max-width: 672px; display: none; flex-direction: column; gap: 24px; animation: slideUp 0.5s cubic-bezier(0.16,1,0.3,1) forwards; }
.question-wrap.active { display: flex; }
@keyframes slideUp { from { opacity: 0; transform: translateY(60px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-60px); } to { opacity: 1; transform: translateY(0); } }
.question-wrap.slide-down { animation: slideDown 0.5s cubic-bezier(0.16,1,0.3,1) forwards; }
.q-label-row { display: flex; align-items: flex-start; gap: 12px; }
.q-num { font-size: 14px; font-weight: 900; letter-spacing: 0.1em; color: rgba(255,255,255,0.3); flex-shrink: 0; margin-top: 4px; }
.q-num span { color: rgba(255,255,255,0.2); }
.q-label { font-size: 24px; font-weight: 300; letter-spacing: 0.01em; line-height: 1.3; color: #fff; }
@media (min-width: 768px) { .q-label { font-size: 30px; } }
.q-required { color: rgba(255,255,255,0.25); font-weight: 100; margin-left: 4px; }
.q-body { padding-left: 32px; }
.q-hint { font-size: 10px; color: rgba(255,255,255,0.25); margin-top: 20px; letter-spacing: 0.05em; }

.text-input-wrap { position: relative; border: 1px solid rgba(255,255,255,0.2); transition: border-color 0.2s; width: 100%; max-width: 448px; }
.text-input-wrap:focus-within { border-color: rgba(255,255,255,0.6); }
.text-input-wrap input { width: 100%; background: transparent; padding: 16px; font-size: 24px; color: #fff; outline: none; font-weight: 300; letter-spacing: -0.02em; border: none; }
@media (min-width: 768px) { .text-input-wrap input { font-size: 30px; } }
.text-input-wrap input::placeholder { color: rgba(255,255,255,0.15); }

.phone-wrap { display: flex; max-width: 448px; }
.phone-code { border: 1px solid rgba(255,255,255,0.2); border-right: none; padding: 16px; font-size: 14px; color: #9ca3af; font-weight: 300; background: rgba(255,255,255,0.02); flex-shrink: 0; display: flex; align-items: center; }
.phone-input-wrap { flex: 1; border: 1px solid rgba(255,255,255,0.2); transition: border-color 0.2s; }
.phone-input-wrap:focus-within { border-color: rgba(255,255,255,0.6); }
.phone-input-wrap input { width: 100%; background: transparent; padding: 16px; font-size: 24px; color: #fff; outline: none; font-weight: 300; letter-spacing: 0.05em; border: none; }
@media (min-width: 768px) { .phone-input-wrap input { font-size: 30px; } }
.phone-input-wrap input::placeholder { color: rgba(255,255,255,0.15); }
.phone-hint { font-size: 10px; color: rgba(255,255,255,0.25); margin-top: 12px; }

.textarea-wrap { position: relative; border: 1px solid rgba(255,255,255,0.2); transition: border-color 0.2s; width: 100%; max-width: 100%; }
.textarea-wrap:focus-within { border-color: rgba(255,255,255,0.6); }
.textarea-wrap textarea { width: 100%; background: transparent; padding: 16px; font-size: 16px; color: #fff; outline: none; font-weight: 300; resize: none; line-height: 1.6; border: none; }
@media (min-width: 768px) { .textarea-wrap textarea { font-size: 18px; } }
.textarea-wrap textarea::placeholder { color: rgba(255,255,255,0.15); }

.options-list { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.option-btn { display: flex; align-items: center; gap: 16px; border: 1px solid rgba(255,255,255,0.15); padding: 14px 20px; text-align: left; transition: border-color 0.15s, background 0.15s, color 0.15s; color: #9ca3af; cursor: pointer; background: none; width: 100%; font-family: inherit; }
.option-btn:hover { border-color: rgba(255,255,255,0.4); color: #fff; }
.option-btn.selected { border-color: #fff; background: rgba(255,255,255,0.08); color: #fff; }
.opt-key { width: 20px; height: 20px; border: 1px solid rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 9px; font-weight: 900; color: rgba(255,255,255,0.2); transition: border-color 0.15s, background 0.15s, color 0.15s; }
.option-btn.selected .opt-key { border-color: #fff; background: #fff; color: #000; }
.opt-text { font-size: 14px; font-weight: 300; }

.checkbox-btn { display: flex; align-items: center; gap: 16px; border: 1px solid rgba(255,255,255,0.15); padding: 14px 20px; text-align: left; transition: border-color 0.15s, background 0.15s, color 0.15s; color: #9ca3af; cursor: pointer; background: none; width: 100%; font-family: inherit; }
.checkbox-btn:hover { border-color: rgba(255,255,255,0.4); color: #fff; }
.checkbox-btn.selected { border-color: #fff; background: rgba(255,255,255,0.08); color: #fff; }
.cb-box { width: 20px; height: 20px; border: 1px solid rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: border-color 0.15s, background 0.15s; }
.checkbox-btn.selected .cb-box { border-color: #fff; background: #fff; }
.cb-check { display: none; }
.checkbox-btn.selected .cb-check { display: block; }
.cb-text { font-size: 14px; font-weight: 300; }

.other-input-wrap { border: 1px solid rgba(255,255,255,0.2); transition: border-color 0.2s; margin-top: 8px; display: none; }
.other-input-wrap.visible { display: block; }
.other-input-wrap:focus-within { border-color: rgba(255,255,255,0.6); }
.other-input-wrap input { width: 100%; background: transparent; padding: 14px 16px; font-size: 14px; color: #fff; outline: none; font-weight: 300; border: none; }
.other-input-wrap input::placeholder { color: rgba(255,255,255,0.2); }

.form-bottom-nav { border-top: 1px solid rgba(255,255,255,0.08); padding: 16px; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
@media (min-width: 768px) { .form-bottom-nav { padding: 16px 48px; } }
.nav-back-btn { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.3); display: flex; align-items: center; gap: 8px; transition: color 0.2s; opacity: 0; pointer-events: none; background: none; border: none; cursor: pointer; font-family: inherit; }
.nav-back-btn.visible { opacity: 1; pointer-events: all; }
.nav-back-btn:hover { color: #fff; }
.nav-back-btn svg { width: 12px; height: 12px; }
.nav-right { display: flex; align-items: center; gap: 16px; }
.nav-enter-hint { display: none; font-size: 10px; color: rgba(255,255,255,0.25); align-items: center; gap: 6px; }
@media (min-width: 480px) { .nav-enter-hint { display: flex; } }

.ok-btn { display: inline-flex; align-items: center; gap: 8px; background: #fff; color: #000; padding: 12px 24px; font-size: 10px; font-weight: 900; letter-spacing: 0.2em; text-transform: uppercase; transition: background 0.2s, opacity 0.2s; cursor: pointer; border: none; font-family: inherit; }
.ok-btn:hover { background: #f0f0f0; }
.ok-btn:disabled { opacity: 0.3; cursor: default; }
.ok-btn svg { width: 12px; height: 12px; }
.spinner { display: none; width: 12px; height: 12px; border: 2px solid #000; border-top-color: transparent; border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.ok-btn.loading .spinner { display: inline-block; }
.ok-btn.loading .ok-label { display: none; }

/* Apply page internal success screen */
#screen-success { align-items: stretch; }
.success-top-bar { border-bottom: 1px solid rgba(255,255,255,0.08); padding: 16px; display: flex; align-items: center; justify-content: space-between; margin-top: 2px; }
@media (min-width: 768px) { .success-top-bar { padding: 16px 48px; } }
.success-center { flex: 1; display: flex; align-items: center; justify-content: center; padding: 96px 16px; }
.success-content { max-width: 512px; width: 100%; opacity: 0; transform: translateY(40px); transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1); }
.success-content.visible { opacity: 1; transform: translateY(0); }
.success-content.visible-center { opacity: 1; transform: translateY(0); margin: 0px auto; }
.success-check-box { width: 56px; height: 56px; border: 2px solid #fff; display: flex; align-items: center; justify-content: center; margin-bottom: 40px; transform: scale(0); transition: transform 0.5s cubic-bezier(0.16,1,0.3,1) 0.2s; }
.success-check-box.pop { transform: scale(1); }
.success-check-box svg { width: 24px; height: 24px; }
.success-check-box.error { border-color: red; }
.success-check-box.success { border-color: green; }
.success-eyebrow { font-size: 10px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: #99A1AF; margin-bottom: 16px; }
.success-title { font-size: 36px; font-weight: 900; letter-spacing: -0.04em; text-transform: uppercase; line-height: 1; color: #fff; margin-bottom: 24px; }
@media (min-width: 768px) { .success-title { font-size: 60px; } }
.success-body { font-size: 16px; color: #9ca3af; font-weight: 300; line-height: 1.6; margin-bottom: 40px; max-width: 448px; }
.success-body .white{color: white;}
.success-next-box { border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.02); padding: 24px; margin-bottom: 40px; }
.success-next-label { font-size: 10px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: #99A1AF; margin-bottom: 20px; }
.success-next-item { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 16px; }
.success-next-item:last-child { margin-bottom: 0; }
.sni-num { font-size: 10px; font-weight: 900; letter-spacing: 0.1em; color: #99A1AF; margin-top: 2px; width: 20px; flex-shrink: 0; }
.sni-text { font-size: 14px; color: #d1d5db; font-weight: 300; line-height: 1.6; }
.success-back { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #99A1AF; display: flex; align-items: center; gap: 8px; transition: color 0.2s; }
.success-back:hover { color: #fff; }
.success-back svg { width: 12px; height: 12px; }

/* ══════════════════════════════════════════════════════════════════════════
   SUCCESS PAGE (/success/) — scoped via body.success-page
   ══════════════════════════════════════════════════════════════════════════ */
body.success-page { background: #000; }
.success-page .sp-navbar { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(0,0,0,0.85); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid rgba(255,255,255,0.08); }
.success-page .sp-navbar-inner { max-width: 1920px; margin: 0 auto; padding: 0 16px; height: 64px; display: flex; align-items: center; justify-content: space-between; }
.success-page .sp-navbar-logo img { height: 28px; width: auto; }
.success-page .sp-navbar-links { display: flex; align-items: center; gap: 32px; }
.success-page .sp-navbar-links a { font-size: 11px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.5); transition: color 0.2s; }
.success-page .sp-navbar-links a:hover { color: #fff; }
@media (max-width: 767px) { .success-page .sp-navbar-links { display: none; } }
.success-page .sp-main { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 96px 16px; }
.success-page .sp-content { max-width: 512px; width: 100%; opacity: 0; transform: translateY(40px); animation: spFadeUp 0.7s cubic-bezier(0.16,1,0.3,1) 0.1s forwards; }
@keyframes spFadeUp { to { opacity: 1; transform: translateY(0); } }
.success-page .sp-check-box { width: 56px; height: 56px; border: 2px solid #fff; display: flex; align-items: center; justify-content: center; margin-bottom: 40px; transform: scale(0); animation: spPopIn 0.5s cubic-bezier(0.16,1,0.3,1) 0.3s forwards; }
@keyframes spPopIn { to { transform: scale(1); } }
.success-page .sp-check-box svg { width: 24px; height: 24px; }
.success-page .sp-eyebrow { font-size: 10px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: #99A1AF; margin-bottom: 16px; }
.success-page .sp-title { font-size: 36px; font-weight: 900; letter-spacing: -0.04em; text-transform: uppercase; line-height: 1; color: #fff; margin-bottom: 24px; }
@media (min-width: 768px) { .success-page .sp-title { font-size: 60px; } }
.success-page .sp-body { font-size: 16px; color: #9ca3af; font-weight: 300; line-height: 1.6; margin-bottom: 40px; max-width: 448px; }
.success-page .sp-next-box { border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.02); padding: 24px; margin-bottom: 40px; }
.success-page .sp-next-label { font-size: 10px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: #99A1AF; margin-bottom: 20px; }
.success-page .sp-next-item { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 16px; }
.success-page .sp-next-item:last-child { margin-bottom: 0; }
.success-page .sp-ni-num { font-size: 10px; font-weight: 900; letter-spacing: 0.1em; color: #99A1AF; margin-top: 2px; width: 20px; flex-shrink: 0; }
.success-page .sp-ni-text { font-size: 14px; color: #d1d5db; font-weight: 300; line-height: 1.6; }
.success-page .sp-back-link { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #99A1AF; display: inline-flex; align-items: center; gap: 8px; transition: color 0.2s; }
.success-page .sp-back-link:hover { color: #fff; }
.success-page .sp-back-link svg { width: 12px; height: 12px; }



/* ═══════════════════════════════════════════════════════════════════════════
   CHECKOUT PAGE STYLES
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Breadcrumb ── */
.breadcrumb{
  border-bottom:1px solid rgba(255,255,255,0.1);
  max-width:1920px;margin:0 auto;
  padding:0 1rem;height:56px;
  display:flex;align-items:center;gap:0.75rem;
}
@media(min-width:768px){.breadcrumb{padding:0 3rem;}}
/* text-[10px] */
.breadcrumb-back{
  font-size:10px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;
  color:#99A1AF;display:flex;align-items:center;gap:6px;transition:color 0.2s;
}
.breadcrumb-back:hover{color:#fff;}
.breadcrumb-sep{font-size:12px;color:rgba(255,255,255,0.15);}
.breadcrumb-current{font-size:10px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#fff;}

/* ── Page headline ── */
.checkout-header{
  border-bottom:1px solid rgba(255,255,255,0.1);
  max-width:1920px;margin:0 auto;
  padding:2rem 1rem 1.5rem;
}
@media(min-width:768px){.checkout-header{padding:3rem 3rem 2rem;}}
/* text-[10px] */
.checkout-cohort-label{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:#99A1AF;margin-bottom:0.75rem;}
/* text-4xl md:text-6xl = 36/60px */
.checkout-title{
  font-size:36px;font-weight:900;letter-spacing:-0.04em;
  text-transform:uppercase;line-height:0.9;color:#fff;margin-bottom:1.5rem;
}
@media(min-width:768px){.checkout-title{font-size:60px;}}

/* Mountain indicator */
.mountain-indicator{display:flex;align-items:center;gap:0;}
.mi-step{display:flex;align-items:center;gap:0;}
.mi-dot{
  width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:900;letter-spacing:0.1em;flex-shrink:0;
}
.mi-dot.active{background:#fff;color:#000;}
.mi-dot.done{background:rgba(255,255,255,0.2);color:#fff;}
.mi-dot.future{background:transparent;border:1px solid rgba(255,255,255,0.2);color:rgba(255,255,255,0.3);}
.mi-line{width:2rem;height:1px;background:rgba(255,255,255,0.2);}
.mi-label{font-size:9px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;margin-top:6px;}
.mi-wrap{display:flex;flex-direction:column;align-items:center;}

/* ── Checkout grid ── */
.checkout-grid{
  max-width:1920px;margin:0 auto;
  display:grid;grid-template-columns:1fr;
}
@media(min-width:1024px){.checkout-grid{grid-template-columns:1fr 420px;}}
@media(min-width:1280px){.checkout-grid{grid-template-columns:1fr 480px;}}

/* LEFT: form */
.checkout-left{padding:2rem 1rem 4rem;border-right:0;}
@media(min-width:768px){.checkout-left{padding:3.5rem 3rem 4rem;}}
@media(min-width:1024px){.checkout-left{border-right:1px solid rgba(255,255,255,0.1);}}

/* Urgency bar */
.urgency-bar{
  display:flex;align-items:center;gap:0.75rem;
  border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.025);
  padding:0.75rem 1rem;margin-bottom:2.5rem;
}
/* text-xs = 12px */
.urgency-bar p{font-size:12px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:#F5A524;}

/* text-[10px] */
.form-section-label{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:#99A1AF;margin-bottom:1.5rem;}

.form-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:2.5rem;}
@media(min-width:640px){.form-grid{grid-template-columns:1fr 1fr;gap:1.25rem;}}

.field-wrap{}
/* text-[10px] */
.field-label{display:block;font-size:10px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#99A1AF;margin-bottom:8px;}
.field-label .req{color:#F5A524;margin-left:2px;}
.field-input-wrap{position:relative;border:1px solid rgba(255,255,255,0.2);transition:border-color 0.2s;}
.field-input-wrap:focus-within{border-color:rgba(255,255,255,0.6);}
/* text-sm = 14px */
.field-input{
  width:100%;background:transparent;
  padding:14px 16px;
  font-size:14px;color:#fff;font-family:inherit;font-weight:300;
  outline:none;border:none;
}
.field-input::placeholder{color:rgba(255,255,255,0.2);}

.form-grid .full-width {
    grid-column: 1 / -1;
}

.custom-checkbox {
  display: inline-block;
}

.custom-checkbox .styled-checkbox {
  position: absolute;
  opacity: 0;
  width: 26px;
  height: 26px;
  cursor: pointer;
}

.custom-checkbox .styled-checkbox+label {
  position: relative;
  cursor: pointer;
  color: #99A1AF;
  font-size: 12px;
  padding-left: 30px;
}

.custom-checkbox .styled-checkbox+label:before {
  content: "";
  border: 1px solid rgba(255,255,255,0.4);
  margin-right: 10px;
  display: inline-block;
  width: 20px;
  height: 20px;
  position: absolute;
  left: 0;
}

.custom-checkbox .styled-checkbox:checked+label:after {
  content: "";
  position: absolute;
  left: 7px;
  top: 0px;
  width: 6px;
  height: 11px;
  border: solid rgba(255,255,255,0.8);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.custom-checkbox.error label:before{
  border-color: rgba(245,165,36,0.7);
}

.custom-checkbox a{
  border-bottom: dashed 1px #F4F4F4;
}

/* Submit btn */
/* text-sm = 14px */
.submit-btn{
  width:100%;background:#fff;color:#000;
  padding:1.25rem;
  font-size:14px;font-weight:900;letter-spacing:0.2em;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;gap:0.75rem;
  border:none;cursor:pointer;transition:background 0.2s;
  font-family:inherit;
}
.submit-btn:hover{background:#e8e8e8;}
.submit-btn:disabled{opacity:0.6;cursor:not-allowed;}
/* text-[10px] */
.submit-note{font-size:10px;color:#4b5563;text-align:center;margin-top:0.75rem;letter-spacing:0.1em;text-transform:uppercase;}

/* Trust badges */
.trust-badges{display:grid;grid-template-columns:1fr;gap:1rem;margin-top:2.5rem;padding-top:2.5rem;border-top:1px solid rgba(255,255,255,0.1);}
@media(min-width:640px){.trust-badges{grid-template-columns:repeat(3,1fr);}}
.trust-badge{display:flex;align-items:center;gap:0.75rem;}
.trust-badge svg{color:rgba(255,255,255,0.4);flex-shrink:0;margin-top:2px;}
/* text-[11px] = 11px */
.trust-badge p{font-size:11px;font-weight:300;color:#6b7280;line-height:1.4;}

/* Testimonial carousel */
/* text-[10px] */
.testi-carousel-label{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:#99A1AF;margin-bottom:1.25rem;margin-top:3rem;}
.testi-carousel{border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.02);padding:1.5rem;position:relative;overflow:hidden;}
.testi-carousel-top{width:100%;height:1px;background:linear-gradient(to right,transparent,rgba(255,255,255,0.2),transparent);margin-bottom:0;}
.carousel-stars{display:flex;gap:2px;margin-bottom:0.75rem;}
.carousel-star{width:12px;height:12px;fill:#F5A524;}
/* text-sm = 14px */
.carousel-quote{font-size:14px;font-weight:300;color:#d1d5db;line-height:1.6;margin-bottom:1rem;}
/* text-xs = 12px */
.carousel-name{font-size:12px;font-weight:700;letter-spacing:0.08em;color:#fff;}
/* text-[10px] */
.carousel-title{font-size:10px;letter-spacing:0.15em;text-transform:uppercase;color:#99A1AF;margin-top:2px;}
.carousel-dots{display:flex;gap:6px;margin-top:1rem;}
.carousel-dot{height:2px;background:rgba(255,255,255,0.25);transition:width 0.3s,background 0.3s;border:none;cursor:pointer;padding:0;}
.carousel-dot.active{background:#fff;}

/* Spinner */
.spinner{
  width:16px;height:16px;
  border:2px solid rgba(0,0,0,0.3);border-top-color:#000;
  border-radius:50%;animation:spin 0.8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}

/* RIGHT: cart */
.checkout-right{padding:2rem 1rem;background:#050505;border-top:1px solid rgba(255,255,255,0.1);}
@media(min-width:768px){.checkout-right{padding:3.5rem 2rem;}}
@media(min-width:1024px){.checkout-right{border-top:none;}}

/* text-[10px] */
.order-label{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:#99A1AF;margin-bottom:1.25rem;}

.product-card{border:1px solid rgba(255,255,255,0.15);background:rgba(255,255,255,0.02);margin-bottom:2rem;}
.product-card-head{border-bottom:1px solid rgba(255,255,255,0.1);padding:1.25rem;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;}
/* text-[10px] */
.product-tag{font-size:10px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:#99A1AF;margin-bottom:4px;}
/* text-base md:text-lg = 16/18px */
.product-name{font-size:16px;font-weight:900;letter-spacing:-0.02em;text-transform:uppercase;line-height:1.2;color:#fff;}
@media(min-width:768px){.product-name{font-size:18px;}}
/* text-xs = 12px */
.product-price-old{font-size:12px;color:#4b5563;text-decoration:line-through;text-align:right;display:block;margin-bottom:2px;}
/* text-xl = 20px */
.product-price-new{font-size:20px;font-weight:900;letter-spacing:-0.04em;color:#fff;text-align:right;display:block;}

.product-dates{border-bottom:1px solid rgba(255,255,255,0.1);padding:1rem 1.25rem;background:rgba(255,255,255,0.015);display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
/* text-[9px] */
.date-label{font-size:9px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#99A1AF;margin-bottom:4px;}
/* text-sm = 14px */
.date-val{font-size:14px;font-weight:900;letter-spacing:-0.01em;color:#fff;}
/* text-[10px] */
.date-sub{font-size:10px;color:#9ca3af;margin-top:2px;}

.product-includes{padding:1rem 1.25rem;}
/* text-[9px] */
.includes-label{font-size:9px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#99A1AF;margin-bottom:0.75rem;}
.includes-list{display:flex;flex-direction:column;gap:10px;}
.includes-item{display:flex;align-items:flex-start;gap:10px;}
.includes-item svg{color:rgba(255,255,255,0.6);flex-shrink:0;margin-top:2px;}
/* text-xs = 12px */
.includes-item span{font-size:12px;font-weight:300;color:#9ca3af;line-height:1.4;}

/* Early bird badge (cart) */
.cart-early-bird{
  border:1px solid rgba(245,165,36,0.4);
  background:rgba(245,165,36,0.05);
  padding:0.75rem 1rem;
  display:flex;align-items:center;gap:0.75rem;
  margin-bottom:2rem;
}
/* text-xs = 12px */
.cart-early-bird span{font-size:12px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:#F5A524;}

/* Stats grid */
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.1);margin-bottom:2rem;}
.stat-cell{background:#000;padding:0.75rem 1rem;text-align:center;}
/* text-lg md:text-xl = 18/20px */
.stat-cell .val{font-size:18px;font-weight:900;letter-spacing:-0.04em;color:#fff;}
@media(min-width:768px){.stat-cell .val{font-size:20px;}}
/* text-[9px] */
.stat-cell .lbl{font-size:9px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:#99A1AF;margin-top:2px;}

/* Instructors card */
.instructors-card{border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.015);padding:1.25rem;margin-bottom:2rem;}
/* text-[9px] */
.instructors-card-label{font-size:9px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#99A1AF;margin-bottom:0.75rem;}
.instructor-row{display:flex;align-items:center;gap:0.75rem;margin-bottom:0.75rem;}
.instructor-row:last-child{margin-bottom:0;}
.instructor-mono{
  width:32px;height:32px;border:1px solid rgba(255,255,255,0.2);
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:900;color:#fff;flex-shrink:0;
}
/* text-xs = 12px */
.instructor-row-name{font-size:12px;font-weight:700;letter-spacing:0.04em;color:#fff;}
/* text-[9px] */
.instructor-row-role{font-size:9px;letter-spacing:0.15em;text-transform:uppercase;color:#99A1AF;margin-top:2px;}

/* Cohort notice */
.cohort-notice{border:1px solid rgba(255,255,255,0.1);padding:0.75rem 1rem;}
/* text-[9px] */
.cohort-notice-label{font-size:9px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#99A1AF;margin-bottom:4px;}
/* text-xs = 12px */
.cohort-notice p{font-size:12px;font-weight:300;color:#9ca3af;line-height:1.5;}
