/* Coaches Landing Page — The Web Xpert */

.landing-page:not(.coaches-page) .futuristic-nav,
.landing-page:not(.coaches-page) .mobile-menu-offcanvas,
.landing-page .bottom-nav:not(.coaches-bottom-nav) {
  display: none !important;
}

.coaches-page {
  overflow-x: hidden;
}

/* Coaches page — centered layout */
.coaches-page .hero-content,
.coaches-page .hero-content .container,
.coaches-page .hero-text {
  text-align: center;
}

.coaches-page .hero-text {
  width: 100%;
  max-width: 900px;
  margin-left: auto !important;
  margin-right: auto !important;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.coaches-page .hero-badge {
  margin-left: auto;
  margin-right: auto;
}

.coaches-page .hero-title,
.coaches-page .hero-description,
.coaches-page .section-header,
.coaches-page .section-title,
.coaches-page .section-subtitle,
.coaches-page .coaches-section-sub,
.coaches-page .compare-note,
.coaches-page .offer-final-cta-sub {
  text-align: center;
}

.coaches-page section .container {
  text-align: center;
}

.coaches-page .process-steps,
.coaches-page .included-simple-grid,
.coaches-page .application-form-wrapper,
.coaches-page .coaches-faq-list,
.coaches-page .coaches-check-list,
.coaches-page .coaches-fix-list {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Simplified premium layout */
.coaches-narrow {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.coaches-section-header {
  margin-bottom: var(--spacing-xl);
}

.coaches-section-header .section-title {
  font-size: clamp(1.75rem, 4vw, 2.35rem);
  margin-bottom: var(--spacing-md);
}

.coaches-lead {
  color: var(--text-secondary);
  font-size: 1.05rem;
  line-height: 1.75;
  max-width: 600px;
  margin: 0 auto;
}

.hero-support-text {
  margin-top: var(--spacing-md);
  font-size: 0.9rem;
  color: var(--text-muted);
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.coaches-hero-copy {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  max-width: 640px;
}

.coaches-hero-copy p {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--text-secondary);
}

.coaches-problem-outro,
.coaches-why-outro {
  max-width: 640px;
  margin: clamp(2rem, 5vw, 3rem) auto 0;
  text-align: center;
}

.coaches-problem-outro p {
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--text-secondary);
  margin: 0 0 var(--spacing-sm);
}

.coaches-section-label {
  text-align: center;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(0, 212, 255, 0.75);
  margin: 0 0 var(--spacing-lg);
}

.coaches-pain-grid,
.coaches-benefit-grid {
  display: grid;
  gap: var(--spacing-md);
  grid-template-columns: 1fr;
}

.coaches-pain-card,
.coaches-benefit-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  padding: var(--spacing-lg);
  background: linear-gradient(160deg, rgba(22, 28, 38, 0.95) 0%, rgba(14, 14, 18, 0.95) 100%);
  border: 1px solid rgba(0, 212, 255, 0.14);
  border-radius: var(--radius-lg);
  text-align: left;
  overflow: hidden;
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}

.coaches-pain-card::before,
.coaches-benefit-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--gradient-primary);
  opacity: 0.7;
}

.coaches-pain-card:hover,
.coaches-benefit-card:hover {
  border-color: rgba(0, 212, 255, 0.35);
  box-shadow: 0 10px 32px rgba(0, 212, 255, 0.1);
  transform: translateY(-3px);
}

.coaches-pain-icon,
.coaches-benefit-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(0, 212, 255, 0.1);
  border: 1px solid rgba(0, 212, 255, 0.2);
  color: var(--primary);
  font-size: 1rem;
}

.coaches-pain-text,
.coaches-benefit-text {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.55;
  color: var(--text-primary);
  font-weight: 500;
  position: relative;
  z-index: 1;
}

.coaches-callout {
  margin-top: var(--spacing-xl);
  padding: var(--spacing-lg) var(--spacing-xl);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(0, 212, 255, 0.25);
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.08) 0%, rgba(0, 153, 204, 0.04) 100%);
  box-shadow: 0 8px 28px rgba(0, 212, 255, 0.08);
}

.coaches-callout p {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--text-primary);
  font-weight: 500;
}

.coaches-callout-soft p + p {
  margin-top: var(--spacing-sm);
}

.coaches-callout-soft p {
  font-weight: 400;
  color: var(--text-secondary);
}

.coaches-callout-soft p:last-child {
  color: var(--text-primary);
  font-weight: 500;
}

/* About Me */
.coaches-about-section {
  padding-top: clamp(2.5rem, 6vw, 4rem);
  padding-bottom: clamp(2.5rem, 6vw, 4rem);
}

.coaches-about-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-xl);
  max-width: 960px;
  width: 92%;
  margin: 0 auto;
  align-items: start;
  text-align: left;
}

.coaches-about-photo-wrap {
  justify-self: center;
}

.coaches-about-photo {
  display: block;
  width: min(200px, 42vw);
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center top;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(0, 212, 255, 0.22);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3);
}

.coaches-about-content {
  min-width: 0;
}

.coaches-about-heading {
  font-size: clamp(1.35rem, 3vw, 1.65rem);
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 var(--spacing-md);
  text-align: left;
}

.coaches-about-copy {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-lg);
}

.coaches-about-copy p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--text-secondary);
}

.coaches-about-skills {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  justify-content: flex-start;
}

.coaches-skill-tag {
  display: inline-block;
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-secondary);
  background: rgba(0, 212, 255, 0.08);
  border: 1px solid rgba(0, 212, 255, 0.18);
  border-radius: 999px;
}

@media (max-width: 1024px) {
  .coaches-about-layout {
    grid-template-columns: 1fr;
    text-align: center;
    width: 92%;
    max-width: 640px;
  }

  .coaches-about-photo-wrap {
    justify-self: center;
  }

  .coaches-about-heading {
    text-align: center;
  }

  .coaches-about-copy p {
    text-align: center;
  }

  .coaches-about-skills {
    justify-content: center;
  }
}

@media (min-width: 1025px) {
  .coaches-about-layout {
    grid-template-columns: minmax(160px, 200px) 1fr;
    gap: clamp(1.5rem, 4vw, 2.5rem);
    width: 100%;
    max-width: 960px;
  }

  .coaches-about-photo-wrap {
    justify-self: start;
  }

  .coaches-about-photo {
    width: 100%;
    max-width: 200px;
  }
}

/* What Happens Next */
.coaches-next-steps {
  list-style: none;
  padding: 0;
  margin: 0 auto var(--spacing-xl);
  max-width: 520px;
  display: flex;
  flex-direction: column;
  gap: 0;
  text-align: left;
}

.coaches-next-step {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-md);
  padding: var(--spacing-md) 0;
  border-bottom: 1px solid rgba(0, 212, 255, 0.1);
}

.coaches-next-step:last-child {
  border-bottom: none;
}

.coaches-next-num {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(0, 212, 255, 0.12);
  border: 1px solid rgba(0, 212, 255, 0.25);
  color: var(--primary);
  font-size: 0.85rem;
  font-weight: 700;
}

.coaches-next-text {
  margin: 0;
  padding-top: 0.25rem;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--text-secondary);
}

.coaches-next-close {
  text-align: center;
  max-width: 420px;
  margin: 0 auto;
}

.coaches-next-close p {
  margin: 0 0 var(--spacing-xs);
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--text-secondary);
}

.coaches-next-close p:last-child {
  margin-bottom: 0;
  color: var(--text-primary);
  font-weight: 500;
}

/* Problem */
.coaches-problem-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
}

.coaches-check-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.coaches-check-list li {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  color: var(--text-secondary);
  font-size: 1rem;
  padding: var(--spacing-sm) var(--spacing-md);
  background: rgba(17, 17, 17, 0.6);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-md);
}

.coaches-check-list li i {
  color: var(--secondary);
  font-size: 0.85rem;
  flex-shrink: 0;
}

/* Solution */
.coaches-solution-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.coaches-fix-list {
  list-style: none;
  padding: 0;
  margin: 0 auto var(--spacing-lg);
  max-width: 480px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-sm) var(--spacing-lg);
  text-align: left;
}

.coaches-fix-list li {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  color: var(--text-secondary);
  font-size: 0.95rem;
}

.coaches-fix-list li i {
  color: var(--primary);
  font-size: 0.75rem;
  flex-shrink: 0;
}

/* What's Included — simple */
.coaches-included-simple {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
}

.included-simple-grid {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  text-align: left;
}

.included-simple-item {
  padding: var(--spacing-md) 0;
  border-bottom: 1px solid var(--border-light);
}

.included-simple-item:last-child {
  border-bottom: none;
}

.included-simple-item h3 {
  font-size: 1rem;
  color: var(--text-primary);
  margin-bottom: var(--spacing-xs);
  font-weight: 600;
}

.included-simple-item p {
  font-size: 0.92rem;
  color: var(--text-secondary);
  line-height: 1.6;
  margin: 0;
}

.coaches-process-simple {
  margin-bottom: var(--spacing-lg);
}

.coaches-process-simple .process-step {
  padding: var(--spacing-lg);
}

.coaches-final-header {
  margin-bottom: var(--spacing-xl);
}

.coaches-form-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.section-cta-inline {
  margin-top: var(--spacing-xl);
}

.section-cta-inline .primary-button {
  min-width: 260px;
}

/* Hero */
.coaches-hero {
  min-height: auto;
  padding: 110px 0 var(--spacing-2xl);
}

.coaches-hero .hero-content .container {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.coaches-hero .hero-text {
  max-width: 900px;
  margin: 0 auto var(--spacing-xl);
}

.coaches-hero .hero-title {
  width: 100%;
  text-align: center;
}

.coaches-hero .hero-title .title-highlight {
  font-size: clamp(2rem, 5vw, 3.25rem);
  line-height: 1.15;
  margin-bottom: var(--spacing-md);
  display: block;
  text-align: center;
  opacity: 1;
  animation: none;
}

.coaches-hero .hero-description {
  font-size: clamp(1rem, 2.2vw, 1.15rem);
  color: var(--text-secondary);
  line-height: 1.7;
  max-width: 720px;
  margin: 0 auto var(--spacing-xl);
  opacity: 1;
  animation: none;
}

/* Countdown */
.offer-timer {
  background: rgba(255, 107, 107, 0.08);
  border: 1px solid rgba(255, 107, 107, 0.25);
  border-radius: var(--radius-lg);
  padding: var(--spacing-md) var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
  backdrop-filter: blur(12px);
}

.offer-timer-label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--secondary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--spacing-sm);
}

.countdown-clock {
  display: flex;
  justify-content: center;
  gap: var(--spacing-sm);
  flex-wrap: wrap;
}

.countdown-unit {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-md);
  padding: var(--spacing-sm) var(--spacing-md);
  min-width: 72px;
}

.countdown-value {
  display: block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--primary);
  line-height: 1.2;
}

.countdown-label {
  display: block;
  font-size: 0.7rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 2px;
}

/* Video Placeholder */
.video-placeholder {
  position: relative;
  width: 100%;
  max-width: 800px;
  margin: 0 auto var(--spacing-xl);
  aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, rgba(17, 17, 17, 0.95) 0%, rgba(26, 26, 36, 0.95) 100%);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
}

.video-placeholder::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 30% 40%, rgba(0, 212, 255, 0.12) 0%, transparent 55%),
    radial-gradient(circle at 70% 60%, rgba(78, 205, 196, 0.08) 0%, transparent 50%);
  pointer-events: none;
}

.video-placeholder-inner {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: var(--spacing-lg);
}

.video-play-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto var(--spacing-md);
  border-radius: 50%;
  background: var(--gradient-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: #fff;
  box-shadow: 0 0 32px rgba(0, 212, 255, 0.35);
  animation: video-pulse 2.5s ease-in-out infinite;
}

@keyframes video-pulse {
  0%, 100% { box-shadow: 0 0 32px rgba(0, 212, 255, 0.35); transform: scale(1); }
  50% { box-shadow: 0 0 48px rgba(0, 212, 255, 0.5); transform: scale(1.04); }
}

.video-placeholder-text {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: var(--spacing-xs);
}

.video-placeholder-sub {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.coaches-hero-cta {
  margin-top: var(--spacing-md);
}

.coaches-hero-cta.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
  justify-content: center;
  align-items: center;
  width: 100%;
  opacity: 1;
  animation: none;
}

.coaches-section-sub {
  text-align: center;
  color: var(--text-secondary);
  max-width: 640px;
  margin: 0 auto var(--spacing-xl);
  line-height: 1.7;
  font-size: 1.05rem;
}

.coaches-section-sub strong {
  color: var(--text-primary);
}

.section-cta-inline {
  text-align: center;
  margin-top: var(--spacing-xl);
}

.coaches-section-cta {
  position: relative;
  z-index: 1;
  margin-top: clamp(2rem, 5vw, 2.75rem);
  padding: 0 var(--spacing-md);
}

.coaches-section-cta .primary-button {
  display: inline-flex;
  min-width: 260px;
  width: auto;
  max-width: 100%;
}

.coaches-cta-note {
  margin: var(--spacing-sm) auto 0;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--text-muted);
  max-width: 340px;
}

.coaches-section-cta-reviews {
  padding-bottom: var(--spacing-lg);
}

@media (min-width: 1025px) {
  .coaches-page #reviews .coaches-cta-note {
    color: rgba(10, 24, 36, 0.75);
  }
}

.coaches-page #about .coaches-section-cta {
  margin-top: var(--spacing-xl);
}

/* What I Help With */
.coaches-help-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.help-outcomes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-lg);
  max-width: 1000px;
  margin: 0 auto;
}

.help-outcome-card {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg);
  text-align: center;
  transition: border-color var(--transition-normal), transform var(--transition-normal);
}

.help-outcome-card:hover {
  border-color: rgba(0, 212, 255, 0.3);
  transform: translateY(-3px);
}

.help-outcome-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto var(--spacing-md);
  border-radius: var(--radius-md);
  background: rgba(0, 212, 255, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  font-size: 1.2rem;
}

.help-outcome-card h3 {
  font-size: 1.05rem;
  color: var(--text-primary);
  margin-bottom: var(--spacing-sm);
}

.help-outcome-card p {
  color: var(--text-secondary);
  font-size: 0.92rem;
  line-height: 1.65;
  margin: 0;
}

.hero-trust-bullets li i {
  color: var(--primary);
  margin-right: 6px;
  font-size: 0.8rem;
}

/* What's Included */
.coaches-included-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
  position: relative;
}

.coaches-included-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 50%, rgba(0, 212, 255, 0.04) 0%, transparent 55%);
  pointer-events: none;
}

.included-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
  max-width: 640px;
  margin: 0 auto;
  position: relative;
}

.included-item {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg) var(--spacing-xl);
  transition: border-color var(--transition-normal);
  text-align: center;
}

.included-item:hover {
  border-color: rgba(0, 212, 255, 0.25);
}

.included-icon {
  color: var(--primary);
  font-size: 1.25rem;
  margin-bottom: var(--spacing-sm);
}

.included-item h3 {
  font-size: 1.05rem;
  color: var(--text-primary);
  margin-bottom: var(--spacing-sm);
}

.included-item p {
  color: var(--text-secondary);
  font-size: 0.92rem;
  line-height: 1.65;
  margin: 0;
}

/* Website vs Funnel */
.coaches-compare-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.compare-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-lg);
  max-width: 900px;
  margin: 0 auto var(--spacing-xl);
}

.compare-card {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  text-align: center;
}

.compare-card-alt {
  border-color: rgba(0, 212, 255, 0.2);
}

.compare-label {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--primary);
  margin-bottom: var(--spacing-sm);
}

.compare-card h3 {
  font-size: 1.2rem;
  color: var(--text-primary);
  margin-bottom: var(--spacing-md);
}

.compare-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.compare-list li {
  color: var(--text-secondary);
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: var(--spacing-sm);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: var(--spacing-sm);
  text-align: left;
}

.compare-list li i {
  color: var(--primary);
  margin-top: 4px;
  font-size: 0.8rem;
  flex-shrink: 0;
}

.compare-note {
  text-align: center;
  max-width: 680px;
  margin: 0 auto;
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.7;
}

/* Optional Upsells */
.coaches-upsell-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
}

.upsell-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-lg);
  max-width: 900px;
  margin: 0 auto;
}

.upsell-card {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  text-align: center;
}

.upsell-badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-bottom: var(--spacing-sm);
}

.upsell-card h3 {
  font-size: 1.2rem;
  color: var(--text-primary);
  margin-bottom: var(--spacing-xs);
}

.upsell-price {
  font-size: 1rem;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: var(--spacing-md);
}

.upsell-card p {
  color: var(--text-secondary);
  font-size: 0.95rem;
  line-height: 1.65;
  margin: 0 0 var(--spacing-md);
}

.upsell-note {
  font-size: 0.85rem !important;
  color: var(--text-muted) !important;
  margin-bottom: 0 !important;
  font-style: italic;
}

.coaches-process-section .process-steps {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

/* Process Section */
.coaches-process-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
  position: relative;
}

.coaches-process-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 0%, rgba(0, 212, 255, 0.05) 0%, transparent 60%);
  pointer-events: none;
}

.coaches-value-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.value-card {
  max-width: 800px;
  margin: 0 auto;
  background: rgba(17, 17, 17, 0.8);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  text-align: center;
  line-height: 1.8;
  font-size: clamp(1rem, 2vw, 1.15rem);
  color: var(--text-secondary);
}

.value-card strong {
  color: var(--text-primary);
}

/* Application Form */
.application-form-wrapper {
  max-width: 560px;
  margin: 0 auto;
}

.form-progress {
  margin-bottom: var(--spacing-xl);
}

.form-progress-bar {
  height: 4px;
  background: var(--border-light);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: var(--spacing-sm);
}

.form-progress-fill {
  height: 100%;
  width: 16.66%;
  background: var(--gradient-primary);
  border-radius: 2px;
  transition: width var(--transition-normal);
}

.form-progress-steps {
  display: flex;
  justify-content: space-between;
  gap: 4px;
}

.form-progress-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--border-light);
  transition: all var(--transition-fast);
}

.form-progress-dot.active {
  background: var(--primary);
  box-shadow: 0 0 10px rgba(0, 212, 255, 0.5);
}

.form-progress-dot.completed {
  background: var(--accent);
}

.coaches-form {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
}

.form-step {
  display: none;
  animation: form-step-in 0.35s ease;
}

.form-step.active {
  display: block;
}

@keyframes form-step-in {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: translateX(0); }
}

.form-step-title {
  font-size: 1.25rem;
  color: var(--text-primary);
  margin-bottom: var(--spacing-xs);
}

.form-step-subtitle {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin-bottom: var(--spacing-lg);
}

.coaches-form .form-group select {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 2px solid var(--border-light);
  padding: 1.35rem 1.75rem var(--spacing-sm) 0;
  color: var(--text-primary);
  font-size: 1rem;
  line-height: 1.4;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2300d4ff' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0 center;
}

.coaches-form .form-group select + label {
  top: 0;
  font-size: 0.8rem;
  color: var(--text-secondary);
}

.coaches-form .form-group select:focus {
  outline: none;
  border-bottom-color: var(--primary);
}

.coaches-form .form-group select:focus + label {
  color: var(--primary);
}

.coaches-form .form-group select:focus ~ .form-line {
  width: 100%;
}

.coaches-form .form-group select option {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.form-nav {
  display: flex;
  gap: var(--spacing-md);
  margin-top: var(--spacing-xl);
}

.form-nav .secondary-button,
.form-nav .submit-button {
  flex: 1;
  width: auto;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1.1rem;
  min-height: 38px;
  font-size: 0.9rem;
  line-height: 1.25;
  border-radius: var(--radius-md);
  font-weight: 600;
  cursor: pointer;
  transition: all var(--transition-normal);
}

.form-nav .secondary-button {
  background: transparent;
  border: 1px solid var(--border-medium);
  color: var(--text-secondary);
}

.form-nav .secondary-button:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.form-nav .secondary-button.hidden {
  visibility: hidden;
  pointer-events: none;
}

.form-success {
  display: none;
  text-align: center;
  padding: var(--spacing-xl);
}

.form-success.visible {
  display: block;
}

.form-success i {
  font-size: 3rem;
  color: var(--primary);
  margin-bottom: var(--spacing-md);
}

.form-success h3 {
  color: var(--text-primary);
  margin-bottom: var(--spacing-sm);
}

.form-success p {
  color: var(--text-secondary);
}

.form-error {
  display: none;
  background: rgba(231, 76, 60, 0.12);
  border: 1px solid rgba(231, 76, 60, 0.35);
  border-radius: var(--radius-md);
  color: #ff8a80;
  padding: var(--spacing-md) var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
  font-size: 0.9rem;
  line-height: 1.5;
  text-align: center;
}

.form-nav .submit-button:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  transform: none;
}

/* Trust Stats */
.coaches-stats-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.coaches-stats-section .stats-grid {
  max-width: 720px;
  margin: 0 auto;
}

/* Reviews Marquee */
.coaches-reviews-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
  position: relative;
  overflow: hidden;
}

.coaches-reviews-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 80% 50%, rgba(0, 212, 255, 0.04) 0%, transparent 55%);
  pointer-events: none;
}

.coaches-reviews-section .section-header {
  margin-bottom: var(--spacing-xl);
}

.reviews-marquee {
  position: relative;
  width: 100%;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.reviews-track {
  display: flex;
  width: max-content;
  animation: reviews-marquee 45s linear infinite;
  will-change: transform;
}

.reviews-marquee:hover .reviews-track {
  animation-play-state: paused;
}

.reviews-slide {
  display: flex;
  gap: var(--spacing-lg);
  padding-right: var(--spacing-lg);
}

.review-card {
  flex: 0 0 auto;
  width: 340px;
  max-width: 85vw;
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: var(--spacing-lg);
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}

.review-card:hover {
  border-color: rgba(0, 212, 255, 0.3);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  transform: translateY(-3px);
}

.review-stars {
  display: flex;
  gap: 4px;
  margin-bottom: var(--spacing-md);
  color: #f5c518;
  font-size: 0.9rem;
}

.review-text {
  color: var(--text-secondary);
  font-size: 0.95rem;
  line-height: 1.65;
  margin: 0 0 var(--spacing-md);
  font-style: italic;
}

.review-author {
  color: var(--text-primary);
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0;
}

.review-author span {
  display: block;
  font-weight: 400;
  color: var(--primary);
  font-size: 0.8rem;
  margin-top: 4px;
}

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

@media (prefers-reduced-motion: reduce) {
  .reviews-track {
    animation: none;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    gap: var(--spacing-lg);
    padding: 0 var(--spacing-md);
  }

  .reviews-slide[aria-hidden="true"] {
    display: none;
  }

  .reviews-marquee {
    mask-image: none;
    -webkit-mask-image: none;
  }
}

/* FAQ */
.coaches-faq-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.coaches-faq-list {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.coaches-faq-list .faq-item {
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color var(--transition-normal);
}

.coaches-faq-list .faq-item.active {
  border-color: rgba(0, 212, 255, 0.3);
}

.coaches-faq-list .faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
  padding: var(--spacing-lg) var(--spacing-xl);
  background: none;
  border: none;
  color: var(--text-primary);
  font-size: 1rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  transition: color var(--transition-fast);
}

.coaches-faq-list .faq-question:hover {
  color: var(--primary);
}

.coaches-faq-list .faq-question i {
  font-size: 0.85rem;
  color: var(--primary);
  transition: transform var(--transition-normal);
  flex-shrink: 0;
}

.coaches-faq-list .faq-item.active .faq-question i {
  transform: rotate(180deg);
}

.coaches-faq-list .faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}

.coaches-faq-list .faq-answer p {
  padding: 0 var(--spacing-xl) var(--spacing-lg);
  margin: 0;
  color: #e2e2e2;
  font-size: 1rem;
  line-height: 1.75;
}

/* Final CTA */
.coaches-final-cta {
  text-align: center;
  max-width: 480px;
  margin: 0 auto;
}

.coaches-final-cta .cta-button-large {
  display: inline-flex;
  width: 100%;
  justify-content: center;
}

/* Hero trust bullets */
.hero-trust-bullets {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-sm) var(--spacing-lg);
  margin: 0 auto var(--spacing-lg);
  padding: 0;
  list-style: none;
  width: 100%;
  max-width: 720px;
}

.hero-trust-bullets li {
  color: var(--text-secondary);
  font-size: 0.9rem;
  font-weight: 500;
}

/* Who This Is For */
.audience-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-primary);
}

.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-md);
  max-width: 960px;
  margin: 0 auto;
}

.audience-card {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-sm);
  background: rgba(17, 17, 17, 0.85);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-md);
  padding: var(--spacing-md) var(--spacing-lg);
  transition: border-color var(--transition-normal), transform var(--transition-normal);
}

.audience-card:hover {
  border-color: rgba(0, 212, 255, 0.3);
  transform: translateY(-2px);
}

.audience-card i {
  color: var(--primary);
  font-size: 1rem;
  margin-top: 3px;
  flex-shrink: 0;
}

.audience-card span {
  color: var(--text-secondary);
  font-size: 0.95rem;
  line-height: 1.5;
}

/* Value card — left-aligned paragraphs */
.value-card-stacked {
  text-align: left;
  max-width: 720px;
}

.value-card-stacked p {
  margin: 0 0 var(--spacing-md);
  color: var(--text-secondary);
  line-height: 1.8;
}

.value-card-stacked p:last-child {
  margin-bottom: 0;
}

/* Textarea in offer forms */
.coaches-form .form-group textarea {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 2px solid var(--border-light);
  padding: var(--spacing-md) 0;
  color: var(--text-primary);
  font-size: 1rem;
  font-family: inherit;
  resize: vertical;
  min-height: 100px;
  transition: all var(--transition-fast);
}

.coaches-form .form-group textarea:focus {
  outline: none;
  border-bottom-color: var(--primary);
}

.coaches-form .form-group textarea:focus + label,
.coaches-form .form-group textarea:valid + label {
  top: 0;
  font-size: 0.8rem;
  color: var(--primary);
}

/* Final CTA block */
.offer-final-cta-section {
  padding: var(--spacing-2xl) 0;
  background: var(--bg-secondary);
  text-align: center;
}

.offer-final-cta-section .section-title {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  max-width: 700px;
  margin: 0 auto var(--spacing-md);
}

.offer-final-cta-sub {
  color: var(--text-secondary);
  font-size: 1.05rem;
  max-width: 520px;
  margin: 0 auto var(--spacing-xl);
  line-height: 1.6;
}

/* Minimal Footer */
.coaches-footer {
  padding: var(--spacing-xl) 0;
  background: var(--bg-secondary);
  border-top: 1px solid var(--border-light);
  text-align: center;
}

.coaches-footer-logo img {
  height: 36px;
  margin-bottom: var(--spacing-sm);
  opacity: 0.85;
}

.coaches-footer p {
  color: var(--text-muted);
  font-size: 0.85rem;
  margin: 0 0 var(--spacing-sm);
}

.coaches-footer-alt {
  font-size: 0.8rem !important;
}

.coaches-footer-alt a {
  color: var(--text-secondary);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--transition-fast);
}

.coaches-footer-alt a:hover {
  color: var(--primary);
}

@media (max-width: 768px) {
  .coaches-hero {
    padding: var(--spacing-xl) 0 var(--spacing-md);
  }

  .coaches-hero .hero-content .container {
    width: 90% !important;
    max-width: 90% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .coaches-hero .hero-text,
  .coaches-hero .hero-description {
    max-width: 100% !important;
  }

  .coaches-cards-wrap,
  .coaches-about-layout {
    width: 90%;
  }

  .application-form-wrapper {
    width: 100% !important;
    max-width: 100% !important;
  }

  .value-card-stacked {
    text-align: center !important;
  }

  .value-card-stacked p {
    text-align: center !important;
  }

  .countdown-unit {
    min-width: 64px;
    padding: var(--spacing-xs) var(--spacing-sm);
  }

  .countdown-value {
    font-size: 1.25rem;
  }

  .coaches-form {
    padding: var(--spacing-lg);
  }

  .form-nav {
    flex-direction: column-reverse;
  }

  .form-nav .secondary-button.hidden {
    display: none;
  }

  .coaches-stats-section .stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md);
  }

  .review-card {
    width: 300px;
  }

  .reviews-track {
    animation-duration: 55s;
  }

  .coaches-faq-list .faq-question {
    padding: var(--spacing-md) var(--spacing-lg);
    font-size: 0.95rem;
  }

  .coaches-faq-list .faq-answer p {
    padding: 0 var(--spacing-lg) var(--spacing-md);
  }

  .audience-grid {
    grid-template-columns: 1fr;
  }

  .help-outcomes-grid {
    grid-template-columns: 1fr;
  }

  .included-grid {
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  .compare-grid,
  .upsell-grid {
    grid-template-columns: 1fr;
  }

  .coaches-fix-list {
    grid-template-columns: 1fr;
    max-width: 320px;
    text-align: center;
  }

  .coaches-fix-list li {
    justify-content: center;
  }

  .coaches-check-list {
    max-width: 100%;
  }

  .hero-support-text {
    margin-left: auto;
    margin-right: auto;
  }

  .coaches-page .help-outcome-card h3,
  .coaches-page .help-outcome-card p,
  .coaches-page .included-item h3,
  .coaches-page .included-item p,
  .coaches-page .compare-card h3,
  .coaches-page .upsell-card h3,
  .coaches-page .upsell-card p {
    text-align: center !important;
  }

  .coaches-hero-cta.hero-actions {
    flex-direction: column;
    align-items: center;
  }
}

@media (max-width: 900px) {
  .audience-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .offer-timer {
    padding: var(--spacing-sm) var(--spacing-md);
  }

  .countdown-unit {
    min-width: 56px;
  }

  .video-play-icon {
    width: 56px;
    height: 56px;
    font-size: 1.2rem;
  }
}

/* ===========================================
   Coaches page v8 — clean human layout
   =========================================== */
.coaches-content-width {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}

.coaches-cards-wrap {
  max-width: 1140px;
  width: 92%;
  margin-left: auto;
  margin-right: auto;
}

.coaches-included-wrap {
  max-width: 860px;
}

.coaches-accent-text {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.coaches-top-label {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: var(--spacing-md);
  padding: 0.35rem 0.85rem;
  border: 1px solid rgba(0, 212, 255, 0.35);
  border-radius: 999px;
  background: rgba(0, 212, 255, 0.08);
}

.coaches-plain-title {
  font-size: clamp(1.85rem, 4.5vw, 2.75rem) !important;
  line-height: 1.2 !important;
  color: var(--text-primary) !important;
  font-weight: 700;
  margin-bottom: var(--spacing-md);
  max-width: 820px;
}

.coaches-plain-title .coaches-accent-text {
  display: inline;
}

.coaches-block-section {
  padding: clamp(3rem, 8vw, 5rem) 0;
  background: var(--bg-primary);
  position: relative;
}

.coaches-block-alt {
  background: var(--bg-secondary);
}

.coaches-block-alt::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 30%, rgba(0, 212, 255, 0.07) 0%, transparent 45%),
    radial-gradient(circle at 85% 70%, rgba(0, 153, 204, 0.06) 0%, transparent 40%);
  pointer-events: none;
}

.coaches-block-section > .container {
  position: relative;
  z-index: 1;
}

.coaches-block-header {
  text-align: center;
  margin-bottom: clamp(2rem, 5vw, 3rem);
}

.coaches-block-heading {
  font-size: clamp(1.5rem, 3.5vw, 2rem);
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: var(--spacing-md);
  color: var(--text-primary);
}

.coaches-block-intro {
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--text-secondary);
  max-width: 640px;
  margin: 0 auto;
}

.coaches-card-grid {
  display: grid;
  gap: var(--spacing-lg);
  text-align: left;
}

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

.coaches-card-grid-4 {
  grid-template-columns: repeat(2, 1fr);
}

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

.coaches-card {
  position: relative;
  background: linear-gradient(160deg, rgba(22, 28, 38, 0.95) 0%, rgba(14, 14, 18, 0.95) 100%);
  border: 1px solid rgba(0, 212, 255, 0.15);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl) var(--spacing-lg);
  overflow: hidden;
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}

.coaches-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gradient-primary);
  opacity: 0.85;
}

.coaches-card::after {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 140px;
  height: 140px;
  background: radial-gradient(circle, rgba(0, 212, 255, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

.coaches-card:nth-child(2)::before {
  background: linear-gradient(90deg, #7aebff 0%, #00d4ff 100%);
}

.coaches-card:nth-child(3)::before {
  background: linear-gradient(90deg, #00d4ff 0%, #0099cc 100%);
}

.coaches-card:nth-child(4)::before {
  background: linear-gradient(90deg, #5ee4ff 0%, #0088bb 100%);
}

.coaches-card:nth-child(5)::before {
  background: linear-gradient(90deg, #00d4ff 0%, #007aa3 100%);
}

.coaches-card:nth-child(6)::before {
  background: linear-gradient(90deg, #0099cc 0%, #006688 100%);
}

.coaches-card:hover {
  border-color: rgba(0, 212, 255, 0.4);
  box-shadow: 0 12px 40px rgba(0, 212, 255, 0.12);
  transform: translateY(-4px);
}

.coaches-card-heading {
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: var(--spacing-sm);
  line-height: 1.35;
  position: relative;
  z-index: 1;
}

/* Two headings exist per "What you get" card (full + a short mobile-only
   label) precisely so only one is ever visible/in the accessibility tree at
   a time — display:none is correctly skipped by screen readers, so this
   never reads as a duplicate heading. Short label only takes over at the
   narrow 2-per-row mobile width, where the full text no longer fits without
   making every card tall and portrait-shaped. */
.coaches-card-heading-short {
  display: none;
}

/* "Read more" toggle for a clamped .coaches-card-text. Hidden by default —
   coaches-landing.js shows it per-card via inline style, only where the text
   actually got cut off (checked with scrollHeight vs clientHeight), so this
   is the safe fallback before JS runs, not the real visibility control. */
.coaches-card-readmore {
  display: none;
  margin-top: 0.35rem;
  padding: 0;
  background: none;
  border: none;
  color: var(--primary, #00d4ff);
  font-size: 0.68rem;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  z-index: 1;
}


.coaches-card-text {
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--text-secondary);
  margin: 0;
  position: relative;
  z-index: 1;
}

.coaches-included-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  text-align: left;
  margin: 0 auto;
}

.coaches-included-row {
  padding: var(--spacing-lg) var(--spacing-md);
  border-bottom: 1px solid var(--border-light);
  border-left: 3px solid transparent;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  transition: border-color var(--transition-normal), background var(--transition-normal);
}

.coaches-included-row:hover {
  border-left-color: var(--primary);
  background: rgba(0, 212, 255, 0.04);
}

.coaches-included-row:first-child {
  padding-top: 0;
}

.coaches-included-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.coaches-included-heading {
  font-size: 1rem;
  font-weight: 600;
  color: var(--primary);
  margin-bottom: var(--spacing-xs);
}

.coaches-included-text {
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--text-secondary);
  margin: 0;
}

.coaches-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-lg);
  text-align: center;
}

.coaches-step {
  padding: var(--spacing-xl) var(--spacing-lg);
  background: linear-gradient(160deg, rgba(22, 28, 38, 0.9) 0%, rgba(14, 14, 18, 0.9) 100%);
  border: 1px solid rgba(0, 212, 255, 0.2);
  border-radius: var(--radius-lg);
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal);
}

.coaches-step:hover {
  border-color: rgba(0, 212, 255, 0.45);
  box-shadow: 0 10px 32px rgba(0, 212, 255, 0.1);
}

.coaches-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--gradient-primary);
  color: #fff;
  font-size: 0.95rem;
  font-weight: 700;
  margin-bottom: var(--spacing-md);
  box-shadow: 0 4px 16px rgba(0, 212, 255, 0.35);
}

.coaches-step:nth-child(2) .coaches-step-num {
  background: linear-gradient(135deg, #5ee4ff 0%, #00d4ff 100%);
  box-shadow: 0 4px 16px rgba(0, 212, 255, 0.35);
}

.coaches-step:nth-child(3) .coaches-step-num {
  background: linear-gradient(135deg, #0099cc 0%, #006688 100%);
  box-shadow: 0 4px 16px rgba(0, 153, 204, 0.35);
}

.coaches-step-heading {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: var(--spacing-sm);
}

.coaches-step-text {
  font-size: 0.92rem;
  line-height: 1.65;
  color: var(--text-secondary);
  margin: 0;
}

/* Section card color variants */
.coaches-page #problem .coaches-pain-card {
  background: linear-gradient(160deg, rgba(16, 30, 44, 0.95) 0%, rgba(8, 14, 22, 0.95) 100%);
  border-color: rgba(0, 212, 255, 0.2);
}

.coaches-page #problem .coaches-pain-card:nth-child(even) {
  background: linear-gradient(160deg, rgba(14, 26, 38, 0.95) 0%, rgba(10, 18, 28, 0.95) 100%);
  border-color: rgba(0, 153, 204, 0.22);
}

.coaches-page #problem .coaches-pain-card::before {
  background: var(--gradient-primary);
  opacity: 0.85;
}

.coaches-page #problem .coaches-pain-card:hover {
  border-color: rgba(0, 212, 255, 0.4);
  box-shadow: 0 10px 32px rgba(0, 212, 255, 0.12);
}

.coaches-page #problem .coaches-pain-icon {
  background: rgba(0, 212, 255, 0.1);
  border-color: rgba(0, 212, 255, 0.2);
  color: var(--primary);
}

.coaches-page #website-review .coaches-card {
  background: linear-gradient(160deg, rgba(16, 30, 44, 0.95) 0%, rgba(8, 14, 22, 0.95) 100%);
  border-color: rgba(0, 212, 255, 0.2);
}

.coaches-page #website-review .coaches-card:nth-child(even) {
  background: linear-gradient(160deg, rgba(14, 26, 38, 0.95) 0%, rgba(10, 18, 28, 0.95) 100%);
  border-color: rgba(0, 153, 204, 0.22);
}

.coaches-page #process .coaches-step {
  background: linear-gradient(160deg, rgba(16, 34, 36, 0.92) 0%, rgba(10, 18, 18, 0.95) 100%);
  border-color: rgba(78, 205, 196, 0.25);
}

.coaches-page #process .coaches-step:hover {
  border-color: rgba(78, 205, 196, 0.45);
  box-shadow: 0 10px 32px rgba(78, 205, 196, 0.14);
}

.coaches-page #why .coaches-benefit-card {
  background: linear-gradient(160deg, rgba(18, 32, 40, 0.95) 0%, rgba(10, 16, 24, 0.95) 100%);
  border-color: rgba(69, 183, 209, 0.2);
}

.coaches-page #why .coaches-benefit-card:nth-child(even) {
  background: linear-gradient(160deg, rgba(22, 28, 38, 0.95) 0%, rgba(12, 16, 22, 0.95) 100%);
  border-color: rgba(0, 212, 255, 0.16);
}

.coaches-page #why .coaches-benefit-card::before {
  background: var(--gradient-primary);
  opacity: 0.85;
}

.coaches-page #why .coaches-benefit-card:hover {
  border-color: rgba(0, 212, 255, 0.4);
  box-shadow: 0 10px 32px rgba(0, 212, 255, 0.12);
}

.coaches-page #why .coaches-benefit-icon {
  background: rgba(78, 205, 196, 0.12);
  border-color: rgba(78, 205, 196, 0.28);
  color: var(--accent);
}

.coaches-form-intro {
  font-size: 0.95rem;
  color: var(--primary);
  margin-top: var(--spacing-md);
  margin-bottom: 0;
}

.coaches-reviews-section {
  background: var(--bg-secondary);
  position: relative;
}

.coaches-reviews-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 0%, rgba(0, 212, 255, 0.06) 0%, transparent 55%);
  pointer-events: none;
}

.coaches-reviews-section .coaches-block-header {
  margin-bottom: var(--spacing-xl);
  position: relative;
  z-index: 1;
}

.coaches-reviews-section .review-card {
  text-align: left;
  border-color: rgba(69, 183, 209, 0.2);
  background: linear-gradient(160deg, rgba(18, 32, 40, 0.95) 0%, rgba(10, 16, 24, 0.95) 100%);
}

.coaches-reviews-section .review-card:nth-child(even) {
  background: linear-gradient(160deg, rgba(22, 28, 38, 0.95) 0%, rgba(12, 16, 22, 0.95) 100%);
  border-color: rgba(0, 212, 255, 0.16);
}

.coaches-reviews-section .review-card:hover {
  border-color: rgba(0, 212, 255, 0.35);
  box-shadow: 0 12px 36px rgba(0, 212, 255, 0.1);
}

.coaches-reviews-section .review-stars {
  display: flex;
}

.coaches-reviews-section .review-text {
  font-style: italic;
  font-size: 0.95rem;
}

.coaches-reviews-section .review-author {
  color: var(--primary);
}

.coaches-reviews-section .review-author span {
  display: inline;
  margin-left: 0.35rem;
  color: var(--text-muted);
  font-weight: 400;
  font-size: 0.85rem;
}

.coaches-reviews-section .review-author span::before {
  content: "·";
  margin-right: 0.35rem;
}

.coaches-faq-list {
  max-width: 720px;
  margin: 0 auto;
  text-align: left;
}

.coaches-faq-list .faq-item.active {
  border-color: rgba(0, 212, 255, 0.35);
  box-shadow: 0 8px 28px rgba(0, 212, 255, 0.08);
}

.coaches-faq-list .faq-question:hover,
.coaches-faq-list .faq-item.active .faq-question {
  color: var(--primary);
}

.coaches-form-section {
  background: linear-gradient(180deg, var(--bg-primary) 0%, rgba(0, 212, 255, 0.04) 100%);
}

.coaches-form .form-progress-fill {
  background: var(--gradient-primary);
}

.hero-support-text {
  color: rgba(0, 212, 255, 0.85);
  max-width: 480px;
}

@media (min-width: 768px) {
  .coaches-card-grid-3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .coaches-card-grid-6 {
    grid-template-columns: repeat(2, 1fr);
  }

  .coaches-pain-grid,
  .coaches-benefit-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .coaches-pain-card:nth-child(5),
  .coaches-benefit-card:nth-child(5) {
    grid-column: 1 / -1;
    width: calc((100% - var(--spacing-md)) / 2);
    justify-self: center;
  }
}

@media (min-width: 1024px) {
  .coaches-card-grid-6 {
    grid-template-columns: repeat(3, 1fr);
  }

  .coaches-pain-grid,
  .coaches-benefit-grid {
    grid-template-columns: repeat(6, 1fr);
  }

  .coaches-pain-card,
  .coaches-benefit-card {
    grid-column: span 2;
  }

  .coaches-pain-card:nth-child(4),
  .coaches-benefit-card:nth-child(4) {
    grid-column: 2 / span 2;
  }

  .coaches-pain-card:nth-child(5),
  .coaches-benefit-card:nth-child(5) {
    grid-column: 4 / span 2;
    width: auto;
    justify-self: stretch;
  }
}

@media (max-width: 767px) {
  .coaches-cards-wrap {
    width: 90%;
  }

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

  /* "What you get" only — 2 per row on mobile instead of stacked full-width.
     Padding/type sized down from the desktop card treatment (3rem/2rem,
     1.08rem heading) since a card is now roughly half the viewport width,
     not the full container. Body text is clamped to 3 lines so every card
     lands at a similar, closer-to-square height instead of the tallest
     description (originally 6 lines) stretching every card portrait-shaped
     — full text still shows at tablet/desktop widths, where a wider card
     naturally reads as fewer lines. This section's own copy is meant to be
     a scannable overview, not the full spec (see copy-standards.md), so a
     clamp here doesn't hide anything the page doesn't already say more
     elsewhere. */
  .coaches-card-grid-6 {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-sm);
    /* start, not the grid default stretch — otherwise expanding one card's
       text via "Read more" would stretch its row-mate to match, growing an
       empty gap in a card that has nothing new to show. */
    align-items: start;
  }

  .coaches-card-grid-6 .coaches-card {
    padding: 0.7rem;
    /* Real measured card width at this grid (2 columns, 375px viewport) is
       ~161px. Body text is unclamped (no "Read more" needed) below, so this
       min-height is calibrated to the tallest of the 6 real descriptions
       at full length (~186px, measured directly, not guessed) — every card
       lands at that same height, with the shorter descriptions getting a
       little breathing room at the bottom rather than looking stretched. */
    min-height: 188px;
  }

  /* Same selector shape as the desktop icon rule (.coaches-funnel-v2
     #deliverables .coaches-deliverable-icon) plus the grid-6 class, so this
     actually wins on specificity instead of being silently overridden by it. */
  .coaches-funnel-v2 #deliverables .coaches-card-grid-6 .coaches-deliverable-icon {
    width: 24px;
    height: 24px;
    font-size: 0.6rem;
  }

  .coaches-card-grid-6 .coaches-deliverable-icon {
    margin-bottom: 0.4rem;
  }

  .coaches-card-grid-6 .coaches-card-heading-full {
    display: none;
  }

  /* nowrap + ellipsis guarantees exactly 1 line regardless of exact label
     length, instead of hoping every short label happens to fit — needed to
     hit a real square instead of just a shorter portrait. */
  .coaches-card-grid-6 .coaches-card-heading-short {
    display: block;
    font-size: 0.82rem;
    margin-bottom: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* No clamp — card height (below) is calibrated to fit every description
     in full instead of cutting any of them off. The "Read more" JS still
     runs (see coaches-landing.js) but naturally shows nothing now, since it
     only reveals the button when text is actually being clipped. */
  .coaches-card-grid-6 .coaches-card-text {
    font-size: 0.72rem;
    line-height: 1.4;
  }

  .coaches-steps {
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
  }

  .coaches-step {
    padding: var(--spacing-lg);
  }

  .hero-support-text {
    margin-left: auto;
    margin-right: auto;
    padding: 0 var(--spacing-sm);
  }
}

/* Form nav buttons — override global submit-button mobile sizing */
@media (max-width: 768px) {
  .coaches-form .form-nav .secondary-button,
  .coaches-form .form-nav .submit-button {
    height: auto !important;
    min-height: 36px;
    padding: 0.45rem 1rem !important;
    font-size: 0.875rem !important;
    width: auto !important;
    max-width: none !important;
  }
}

@media (max-width: 480px) {
  .coaches-form .form-nav .secondary-button,
  .coaches-form .form-nav .submit-button {
    min-height: 34px;
    padding: 0.4rem 0.9rem !important;
    font-size: 0.85rem !important;
  }
}

/* Tablet & phone — chained fades: black → blues → light blue-white */
@media (max-width: 1024px) {
  .coaches-page .coaches-block-section,
  .coaches-page .coaches-reviews-section,
  .coaches-page .coaches-form-section,
  .coaches-page .coaches-hero {
    overflow: hidden;
    position: relative;
  }

  .coaches-page .coaches-block-alt::before,
  .coaches-page .coaches-block-section::after,
  .coaches-page .coaches-reviews-section::before {
    display: none;
  }

  /* 1. Hero — black → bright blue */
  .coaches-page #hero.coaches-hero,
  .coaches-page #hero .hero-background {
    background: linear-gradient(
      180deg,
      #040506 0%,
      #0c1a28 28%,
      #1a4a72 72%,
      #2d6a9f 100%
    ) !important;
  }

  .coaches-page #hero .hero-background {
    background: linear-gradient(
      180deg,
      #040506 0%,
      #0c1a28 28%,
      #1a4a72 72%,
      #2d6a9f 100%
    );
  }

  .coaches-page #hero .coaches-hero-cta {
    margin-top: var(--spacing-xs);
    margin-bottom: 0 !important;
  }

  .coaches-page #hero .coaches-hero-cta.hero-actions {
    margin-bottom: 0 !important;
  }

  .coaches-page #hero .hero-support-text {
    color: #ffffff !important;
    text-shadow: 0 1px 6px rgba(10, 24, 36, 0.65);
    opacity: 1 !important;
    margin-top: 0.25rem !important;
    margin-bottom: 0 !important;
  }

  .coaches-page #hero.coaches-hero {
    padding-top: var(--spacing-xl);
    padding-bottom: var(--spacing-md);
  }

  .coaches-page #hero .hero-text {
    margin-bottom: var(--spacing-sm);
  }

  .coaches-page #hero .hero-description,
  .coaches-page #hero .coaches-hero-copy {
    margin-bottom: var(--spacing-md);
  }

  .coaches-page #hero .video-placeholder {
    margin-bottom: var(--spacing-sm);
  }

  .coaches-page #who.coaches-block-section {
    padding-top: clamp(1.75rem, 4vw, 2.5rem);
  }

  /* 2. Who — bright blue → deep navy */
  .coaches-page #who {
    background: linear-gradient(
      180deg,
      #2d6a9f 0%,
      #1a3d5c 45%,
      #0e1824 100%
    ) !important;
  }

  /* 3. Build — navy → black */
  .coaches-page #build {
    background: linear-gradient(
      180deg,
      #0e1824 0%,
      #0a1218 50%,
      #040506 100%
    ) !important;
  }

  /* 4. Process — black → vivid blue */
  .coaches-page #process {
    background: linear-gradient(
      180deg,
      #040506 0%,
      #123250 40%,
      #2a7cb5 100%
    ) !important;
  }

  /* 5. About — vivid blue → light → dark blue */
  .coaches-page #about {
    background: linear-gradient(
      180deg,
      #2a7cb5 0%,
      #6eb0d8 42%,
      #0f2030 100%
    ) !important;
  }

  .coaches-page #about .coaches-about-heading {
    color: #f0f8fc;
  }

  .coaches-page #about .coaches-about-copy p {
    color: #d4e8f4;
  }

  .coaches-page #about .coaches-skill-tag {
    color: #0a1824;
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(255, 255, 255, 0.85);
  }

  /* 6. Testimonials — dark blue → black */
  .coaches-page #reviews.coaches-reviews-section {
    background: linear-gradient(
      180deg,
      #0f2030 0%,
      #0a141c 50%,
      #040506 100%
    ) !important;
  }

  .coaches-page #reviews .coaches-block-heading {
    color: #f0f8fc;
  }

  /* 7. FAQ — black → mid blue */
  .coaches-page #faq {
    background: linear-gradient(
      180deg,
      #040506 0%,
      #142838 48%,
      #1e5078 100%
    ) !important;
  }

  /* 8. Ready CTA — mid blue bridge */
  .coaches-page #ready {
    background: linear-gradient(
      180deg,
      #1e5078 0%,
      #255f8a 50%,
      #2a6a96 100%
    ) !important;
  }

  /* 9. Form — mid blue → ocean blue (footer) */
  .coaches-page #book.coaches-form-section {
    background: linear-gradient(
      180deg,
      #1e5078 0%,
      #255f8a 50%,
      #3a84b8 100%
    ) !important;
  }

  .coaches-page .coaches-footer {
    background: #3a84b8;
    border-top: none;
  }

  .coaches-page .coaches-footer p {
    color: rgba(240, 248, 252, 0.88);
  }

}

/* Coaches bottom navigation — tablet & phone only */
.coaches-page .coaches-bottom-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(10, 10, 10, 0.95);
  backdrop-filter: blur(20px);
  border-top: 1px solid var(--border-light);
  z-index: 1000;
  padding: 8px 0;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
}

.coaches-page .coaches-bottom-nav .bottom-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  text-decoration: none;
  color: var(--text-secondary);
  transition: all var(--transition-fast);
  padding: 8px 4px;
  border-radius: var(--radius-sm);
  position: relative;
}

.coaches-page .coaches-bottom-nav .bottom-nav-item i {
  font-size: 1.2rem;
  margin-bottom: 4px;
  transition: all var(--transition-fast);
}

.coaches-page .coaches-bottom-nav .bottom-nav-item span {
  font-size: 0.7rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.2;
}

.coaches-page .coaches-bottom-nav .bottom-nav-item:hover,
.coaches-page .coaches-bottom-nav .bottom-nav-item.active {
  color: var(--primary);
}

.coaches-page .coaches-bottom-nav .bottom-nav-item:hover i,
.coaches-page .coaches-bottom-nav .bottom-nav-item.active i {
  transform: translateY(-2px);
  color: var(--primary);
}

.coaches-page .coaches-bottom-nav .bottom-nav-item.active::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  background: var(--primary);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--primary);
}

.coaches-page {
  padding-bottom: 0;
}

.coaches-page #hero,
.coaches-page #who,
.coaches-page #build,
.coaches-page #process,
.coaches-page #about,
.coaches-page #reviews,
.coaches-page #faq,
.coaches-page #book,
.coaches-page #ready {
  scroll-margin-top: 88px;
}

/* Desktop — top nav like main site */
@media (min-width: 1025px) {
  .coaches-page .coaches-desktop-nav {
    display: block;
  }

  .coaches-page .coaches-bottom-nav {
    display: none !important;
  }

  .coaches-page .coaches-desktop-nav .nav-links {
    gap: var(--spacing-md);
  }

  .coaches-page .coaches-desktop-nav .nav-link::before {
    display: none;
  }

  .coaches-page .coaches-desktop-nav .nav-link::after {
    content: '';
    position: absolute;
    left: var(--spacing-md);
    right: var(--spacing-md);
    bottom: 4px;
    height: 2px;
    background: var(--primary);
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--transition-fast);
    box-shadow: 0 0 8px rgba(0, 212, 255, 0.35);
  }

  .coaches-page .coaches-desktop-nav .nav-link:hover,
  .coaches-page .coaches-desktop-nav .nav-link.active {
    color: var(--primary);
  }

  .coaches-page .coaches-desktop-nav .nav-link:hover::after,
  .coaches-page .coaches-desktop-nav .nav-link.active::after {
    transform: scaleX(1);
  }

  .coaches-page .coaches-nav-cta span {
    white-space: nowrap;
  }

  .coaches-page #hero.coaches-hero {
    padding-top: 165px;
  }

  .coaches-page #reviews.coaches-reviews-section {
    background: var(--bg-primary);
  }

  .coaches-page #reviews.coaches-reviews-section::before {
    display: none;
  }

  .coaches-page #reviews .coaches-block-heading {
    color: var(--text-primary);
  }

  .coaches-page #reviews .coaches-cta-note {
    color: var(--text-muted);
  }
}

/* iPad & smaller — bottom icon nav */
@media (max-width: 1024px) {
  .coaches-page .coaches-desktop-nav {
    display: none !important;
  }

  .coaches-page .coaches-bottom-nav {
    display: flex !important;
  }

  .coaches-page {
    padding-bottom: 80px;
  }

  .coaches-page #hero,
  .coaches-page #who,
  .coaches-page #build,
  .coaches-page #process,
  .coaches-page #about,
  .coaches-page #reviews,
  .coaches-page #faq,
  .coaches-page #book,
  .coaches-page #ready {
    scroll-margin-top: 12px;
  }
}

/* ===========================================
   Micro-Funnel — /coacheswebsitereview
   =========================================== */
.micro-funnel-page {
  overflow-x: hidden;
}

.micro-funnel-hero {
  position: relative;
  min-height: calc(100vh - 120px);
  display: flex;
  align-items: center;
  padding: clamp(3rem, 8vw, 5rem) 0 clamp(2rem, 5vw, 3rem);
  background: var(--bg-primary);
  /* .hero-grid's grid-move animation (futuristic-style.css) animates a real
     transform: translate(...) on the element itself, up to 50px in X and Y —
     not just a background-position shift — so at various points in its
     cycle it's genuinely up to 50px wider than this box, not a rounding
     artifact. body's overflow-x:hidden doesn't reliably clip that on every
     mobile browser. Every other hero section on the site already clips this
     via .hero-section's own overflow:hidden; .micro-funnel-hero never had
     it, since it's a separate class for this one page. */
  overflow: hidden;
}

.micro-funnel-hero .hero-background {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    #040506 0%,
    #0c1a28 35%,
    #1a4a72 100%
  );
  z-index: 0;
}

.micro-funnel-inner {
  position: relative;
  z-index: 1;
  width: 100%;
}

.micro-funnel-inner .container {
  max-width: 560px;
}

.micro-funnel-panel {
  text-align: center;
}

.micro-funnel-headline {
  font-size: clamp(1.65rem, 4.5vw, 2.35rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--text-primary);
  margin: 0 0 var(--spacing-md);
}

.micro-funnel-subheadline {
  font-size: clamp(1rem, 2.4vw, 1.1rem);
  line-height: 1.7;
  color: var(--text-secondary);
  margin: 0 0 var(--spacing-xl);
}

.micro-funnel-form {
  text-align: left;
  padding: var(--spacing-xl);
  background: linear-gradient(160deg, rgba(16, 30, 44, 0.95) 0%, rgba(8, 14, 22, 0.95) 100%);
  border: 1px solid rgba(0, 212, 255, 0.2);
  border-radius: var(--radius-lg);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
}

.micro-funnel-form .form-group {
  margin-bottom: var(--spacing-lg);
}

.micro-funnel-submit {
  display: flex;
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-top: var(--spacing-sm);
}

.micro-funnel-privacy {
  margin: var(--spacing-md) 0 0;
  font-size: 0.78rem;
  line-height: 1.55;
  color: var(--text-muted);
  text-align: center;
}

.micro-funnel-loading {
  padding: var(--spacing-2xl) var(--spacing-md);
}

.micro-funnel-spinner {
  width: 52px;
  height: 52px;
  margin: 0 auto var(--spacing-lg);
  border: 3px solid rgba(0, 212, 255, 0.15);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: micro-funnel-spin 0.85s linear infinite;
}

@keyframes micro-funnel-spin {
  to {
    transform: rotate(360deg);
  }
}

.micro-funnel-loading-text {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--primary);
  margin: 0;
  letter-spacing: 0.02em;
}

.micro-funnel-result-card {
  position: relative;
  text-align: center;
  padding: clamp(2rem, 5vw, 2.75rem);
  background:
    linear-gradient(165deg, rgba(18, 32, 48, 0.98) 0%, rgba(8, 14, 24, 0.98) 55%, rgba(12, 22, 36, 0.98) 100%);
  border: 1px solid rgba(0, 212, 255, 0.28);
  border-radius: var(--radius-lg);
  box-shadow:
    0 0 0 1px rgba(0, 212, 255, 0.06) inset,
    0 20px 60px rgba(0, 0, 0, 0.45),
    0 0 48px rgba(0, 212, 255, 0.1);
  overflow: hidden;
  /* Some mobile browsers don't reliably clip an absolutely-positioned
     pseudo-element that's positioned *outside* its own bounds (::after
     below used to sit at right:-15%) even with overflow:hidden set — this
     forces real clipping of descendant boxes rather than just relying on
     overflow's own (browser-dependent) behavior. */
  contain: paint;
}

.micro-funnel-result-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gradient-primary);
  opacity: 0.95;
}

.micro-funnel-result-card::after {
  content: '';
  position: absolute;
  /* Kept fully inside the card's own box on purpose (was top:-30%;
     right:-15%, deliberately overflowing the card and relying on
     overflow:hidden to clip it back down — unreliable on some mobile
     browsers and the likely cause of the "extra width" report). A glow
     that never leaves its own box can't cause horizontal overflow no
     matter how any browser handles clipping. */
  top: 0;
  right: 0;
  width: min(220px, 60%);
  height: min(220px, 60%);
  background: radial-gradient(circle, rgba(0, 212, 255, 0.14) 0%, transparent 70%);
  pointer-events: none;
}

.micro-funnel-result-card,
.micro-funnel-diagnosis li,
#micro-funnel-error-message {
  box-sizing: border-box;
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
}

.micro-funnel-report-badge {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--primary);
  background: rgba(0, 212, 255, 0.08);
  border: 1px solid rgba(0, 212, 255, 0.22);
  border-radius: 999px;
  padding: 0.35rem 0.9rem;
  margin-bottom: var(--spacing-md);
}

.micro-funnel-score-headline {
  font-size: clamp(1.15rem, 3.2vw, 1.45rem);
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 var(--spacing-sm);
  line-height: 1.35;
  position: relative;
  z-index: 1;
}

.micro-funnel-score-headline #micro-funnel-score-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.15em;
  color: var(--warning);
  text-shadow: 0 0 24px rgba(243, 156, 18, 0.25);
}

.micro-funnel-score-label {
  font-size: clamp(1rem, 2.8vw, 1.15rem);
  font-weight: 600;
  color: var(--text-primary);
  margin: 0 0 var(--spacing-sm);
  line-height: 1.35;
}

.micro-funnel-score-label #micro-funnel-score-num {
  font-family: 'JetBrains Mono', monospace;
  color: var(--warning);
}

.micro-funnel-result-tag {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--text-secondary);
  background: rgba(0, 212, 255, 0.06);
  border: 1px solid rgba(0, 212, 255, 0.15);
  border-radius: var(--radius-sm);
  padding: 0.35rem 0.75rem;
  margin: 0 0 var(--spacing-md);
  position: relative;
  z-index: 1;
}

.micro-funnel-result-subtext {
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--text-secondary);
  margin: 0 0 var(--spacing-xl);
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}

.micro-funnel-diagnosis-wrap {
  position: relative;
  z-index: 1;
  margin-bottom: var(--spacing-xl);
  text-align: left;
}

.micro-funnel-diagnosis-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--primary);
  margin: 0 0 var(--spacing-sm);
}

.micro-funnel-score-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: clamp(2rem, 6vw, 2.75rem);
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 var(--spacing-sm);
  line-height: 1.1;
}

.micro-funnel-score-num {
  color: var(--warning);
}

.micro-funnel-score-status {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--warning);
  background: rgba(243, 156, 18, 0.12);
  border: 1px solid rgba(243, 156, 18, 0.35);
  border-radius: 999px;
  padding: 0.35rem 0.85rem;
  margin: 0 0 var(--spacing-md);
  position: relative;
  z-index: 1;
}

.micro-funnel-diagnosis {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  /* Flex items default to min-width:auto, meaning a child won't shrink
     below its own content's natural width (e.g. a long unbroken string) —
     that can silently push this flex container, and everything around it,
     wider than the viewport. min-width:0 lets word-break above actually
     take effect instead of being overridden by the flex sizing default. */
  min-width: 0;
}

.micro-funnel-diagnosis li {
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--text-secondary);
  margin: 0;
  padding: var(--spacing-md) var(--spacing-lg);
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.06) 0%, rgba(0, 212, 255, 0.02) 100%);
  border: 1px solid rgba(0, 212, 255, 0.16);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.micro-funnel-diagnosis strong {
  display: inline;
  color: var(--text-primary);
  font-weight: 600;
}

.micro-funnel-result-cta {
  position: relative;
  z-index: 1;
}

.micro-funnel-result-cta .primary-button {
  width: 100%;
  justify-content: center;
}

.micro-funnel-cta-subtext {
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--text-muted);
  margin: var(--spacing-md) 0 0;
}

.micro-funnel-rescan-block {
  margin-top: var(--spacing-xl);
  padding-top: var(--spacing-lg);
  border-top: 1px solid rgba(0, 212, 255, 0.12);
  text-align: left;
}

.micro-funnel-rescan-note {
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0 0 var(--spacing-md);
}

.micro-funnel-rescan-label {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-sm);
  font-size: 0.85rem;
  color: var(--text-secondary);
  margin-bottom: var(--spacing-md);
  cursor: pointer;
}

.micro-funnel-rescan-label input {
  margin-top: 0.2rem;
  accent-color: var(--primary);
}

.micro-funnel-rescan-btn {
  width: 100%;
  justify-content: center;
}

@media (max-width: 768px) {
  .micro-funnel-page {
    min-height: 100vh;
    min-height: 100dvh;
    min-height: -webkit-fill-available;
    background: linear-gradient(
      180deg,
      #040506 0%,
      #0c1a28 35%,
      #1a4a72 100%
    );
  }

  .micro-funnel-page .coaches-footer {
    display: none;
  }

  .micro-funnel-inner .container {
    width: 90% !important;
    max-width: 90% !important;
    min-height: calc(100dvh + 5rem);
  }

  .micro-funnel-form {
    padding: var(--spacing-lg);
  }

  .micro-funnel-inner {
    min-height: calc(100dvh + 5rem);
    width: 100%;
  }

  .micro-funnel-hero {
    /* min-height only (no fixed height) — a fixed height here would force
       this box to a set size even when real content (the form, or the
       results card with a full diagnosis list) is taller than that, and
       align-items:center would then center-crop the excess above the page's
       scroll origin, permanently hiding the top of the content with no way
       to scroll up to it. min-height lets the box grow to fit content
       instead, so centering only ever adds extra space — it never clips. */
    min-height: calc(100dvh + 5rem);
    padding-top: var(--spacing-2xl);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    align-items: center;
  }
}

/* Coaches launch funnel — no-site positioning */
.coaches-hero-lead {
  font-size: clamp(1.05rem, 2.2vw, 1.25rem);
  color: var(--text-secondary);
  max-width: 36rem;
  margin: 0 auto var(--spacing-lg);
  line-height: 1.55;
}

.coaches-check-list-wide {
  max-width: 520px;
}

.coaches-negative-line {
  text-align: center;
  color: var(--text-muted);
  font-size: 0.95rem;
  margin: var(--spacing-md) auto 0;
  max-width: 420px;
}

.coaches-simple-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.coaches-simple-list li {
  position: relative;
  padding: var(--spacing-sm) var(--spacing-md) var(--spacing-sm) calc(var(--spacing-md) + 1.1rem);
  color: var(--text-secondary);
  font-size: 1rem;
  background: rgba(17, 17, 17, 0.55);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-md);
  line-height: 1.45;
}

.coaches-simple-list li::before {
  content: '';
  position: absolute;
  left: var(--spacing-md);
  top: 1.15rem;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--secondary);
  box-shadow: 0 0 8px rgba(78, 205, 196, 0.45);
}

/* What I build — icon card grid */
.coaches-build-wrap {
  max-width: 1040px;
}

.coaches-build-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-lg);
}

.coaches-build-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  padding: var(--spacing-xl) var(--spacing-lg);
  min-height: 100%;
  background: linear-gradient(160deg, rgba(18, 32, 40, 0.96) 0%, rgba(10, 16, 24, 0.96) 100%);
  border: 1px solid rgba(0, 212, 255, 0.18);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}

.coaches-build-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gradient-primary);
  opacity: 0.85;
}

.coaches-build-card::after {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle, rgba(0, 212, 255, 0.1) 0%, transparent 70%);
  pointer-events: none;
}

.coaches-build-card:nth-child(even) {
  background: linear-gradient(160deg, rgba(16, 30, 44, 0.96) 0%, rgba(8, 14, 22, 0.96) 100%);
  border-color: rgba(78, 205, 196, 0.2);
}

.coaches-build-card:nth-child(2)::before {
  background: linear-gradient(90deg, #7aebff 0%, #00d4ff 100%);
}

.coaches-build-card:nth-child(3)::before {
  background: linear-gradient(90deg, #00d4ff 0%, #0099cc 100%);
}

.coaches-build-card:nth-child(4)::before {
  background: linear-gradient(90deg, #5ee4ff 0%, #0088bb 100%);
}

.coaches-build-card:nth-child(5)::before {
  background: linear-gradient(90deg, #0099cc 0%, #006688 100%);
}

.coaches-build-card:hover {
  border-color: rgba(0, 212, 255, 0.42);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.35), 0 0 20px rgba(0, 212, 255, 0.08);
  transform: translateY(-4px);
}

.coaches-build-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--spacing-md);
  border-radius: 14px;
  background: rgba(0, 212, 255, 0.1);
  border: 1px solid rgba(0, 212, 255, 0.25);
  color: var(--primary);
  font-size: 1.1rem;
  position: relative;
  z-index: 1;
}

.coaches-build-card:nth-child(even) .coaches-build-icon {
  background: rgba(78, 205, 196, 0.1);
  border-color: rgba(78, 205, 196, 0.25);
  color: var(--secondary);
}

.coaches-build-title {
  margin: 0 0 var(--spacing-sm);
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.35;
  position: relative;
  z-index: 1;
}

.coaches-build-text {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--text-secondary);
  position: relative;
  z-index: 1;
}

@media (min-width: 640px) {
  .coaches-build-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .coaches-build-card:last-child {
    grid-column: 1 / -1;
    max-width: calc(50% - var(--spacing-lg) / 2);
    justify-self: center;
    width: 100%;
  }
}

@media (min-width: 1024px) {
  .coaches-build-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .coaches-build-card {
    grid-column: span 2;
  }

  .coaches-build-card:nth-child(4) {
    grid-column: 2 / span 2;
  }

  .coaches-build-card:nth-child(5) {
    grid-column: 4 / span 2;
    max-width: none;
    justify-self: stretch;
  }
}

.coaches-section-note {
  text-align: center;
  color: var(--text-muted);
  font-size: 0.92rem;
  margin: var(--spacing-lg) auto 0;
  max-width: 480px;
  line-height: 1.5;
}

.coaches-pricing-section .coaches-block-intro strong {
  color: var(--primary);
}

.coaches-work-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-lg);
  max-width: 960px;
  margin: 0 auto;
}

.coaches-work-card {
  background: rgba(17, 17, 17, 0.65);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  overflow: hidden;
  padding-bottom: var(--spacing-md);
}

.coaches-work-thumb {
  aspect-ratio: 16 / 10;
  background:
    linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 153, 204, 0.06) 100%),
    linear-gradient(160deg, #1a2a38 0%, #0e141c 100%);
  border-bottom: 1px solid var(--border-light);
  background-size: cover;
  background-position: center top;
}

.coaches-work-thumb-2 {
  background:
    linear-gradient(135deg, rgba(78, 205, 196, 0.12) 0%, rgba(0, 153, 204, 0.06) 100%),
    linear-gradient(160deg, #1a2836 0%, #101820 100%);
}

.coaches-work-thumb-3 {
  background:
    linear-gradient(135deg, rgba(0, 212, 255, 0.1) 0%, rgba(0, 100, 140, 0.08) 100%),
    linear-gradient(160deg, #182430 0%, #0c1218 100%);
}

.coaches-work-caption {
  padding: var(--spacing-md) var(--spacing-md) var(--spacing-xs);
  color: var(--text-secondary);
  font-size: 0.95rem;
  line-height: 1.45;
  margin: 0;
}

.coaches-work-link {
  display: inline-block;
  margin: 0 var(--spacing-md);
  color: var(--primary);
  font-size: 0.9rem;
  text-decoration: none;
}

.coaches-work-link:hover {
  text-decoration: underline;
}

.coaches-about-trust {
  margin-top: var(--spacing-md);
  color: var(--primary);
  font-weight: 600;
  font-size: 0.98rem;
}

.coaches-final-cta-section {
  padding: var(--spacing-xl) 0 var(--spacing-2xl);
  text-align: center;
}

.coaches-final-cta-section .coaches-block-heading {
  margin-bottom: var(--spacing-md);
}

#form-success .primary-button {
  margin-top: var(--spacing-md);
  display: inline-flex;
}

/* ===========================================
   Offers hub — /offers
   =========================================== */
.offers-page {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

.offers-page-main {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--spacing-2xl) 0;
}

.offers-page-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.offers-page-inner {
  position: relative;
  z-index: 1;
  width: 100%;
}

.offers-page .container {
  max-width: 960px;
}

.offers-header {
  text-align: center;
  margin-bottom: var(--spacing-2xl);
}

.offers-profile-photo {
  width: 140px;
  height: 196px;
  border-radius: var(--radius-lg);
  object-fit: cover;
  object-position: center top;
  border: 2px solid rgba(0, 212, 255, 0.35);
  box-shadow: 0 10px 28px rgba(0, 212, 255, 0.12);
  margin: 0 auto var(--spacing-lg);
  display: block;
}

.offers-headline {
  font-size: clamp(1.5rem, 4vw, 2rem);
  line-height: 1.25;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 auto var(--spacing-md);
  max-width: 34rem;
}

.offers-subheadline {
  font-size: clamp(1rem, 2.2vw, 1.12rem);
  color: var(--text-secondary);
  margin: 0 auto;
  max-width: 28rem;
  line-height: 1.55;
}

/* Two free, low-commitment magnets grouped in their own row, then the paid-
   intent core offer as a full-width featured card below — not three
   equal-weight boxes. Visitors who aren't ready to commit get an easy free
   yes first; the real offer still reads as the main event, not one option
   among three. */
/* Plain grid, not a featured-card-plus-row layout: at 2 columns (768px+),
   a lone 3rd item naturally occupies column 1 at the same size as the two
   above it, with column 2 simply empty next to it — no stretching to fill,
   no special-casing needed. One column on mobile so each card gets the
   page's full width, which is what actually keeps these short: a wider
   card wraps its description into fewer lines than a half-width one would. */
.offers-cards-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
  max-width: 720px;
  margin: 0 auto;
}

.offers-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-decoration: none;
  text-align: left;
  padding: var(--spacing-md) var(--spacing-lg);
  background: linear-gradient(160deg, rgba(18, 32, 40, 0.98) 0%, rgba(10, 16, 24, 0.98) 100%);
  border: 1px solid rgba(0, 212, 255, 0.22);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}

.offers-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gradient-primary);
  opacity: 0.9;
}

.offers-card::after {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 140px;
  height: 140px;
  background: radial-gradient(circle, rgba(0, 212, 255, 0.1) 0%, transparent 70%);
  pointer-events: none;
}

.offers-card-accent {
  background: linear-gradient(160deg, rgba(16, 30, 44, 0.98) 0%, rgba(8, 14, 22, 0.98) 100%);
  border-color: rgba(78, 205, 196, 0.24);
}

.offers-card-accent::before {
  background: linear-gradient(90deg, #7aebff 0%, #4ecdc4 100%);
}

.offers-card:hover {
  border-color: rgba(0, 212, 255, 0.5);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.4), 0 0 28px rgba(0, 212, 255, 0.1);
  transform: translateY(-5px);
}

.offers-card-action {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  margin-top: 0.25rem;
  padding: 0.85rem 2rem;
  /* Same radius as the cards themselves, not a smaller/pill-ish one — on a
     properly-sized button this reads as a real rounded-rectangle button
     instead of a capsule. */
  border-radius: var(--radius-lg);
  background: var(--gradient-primary);
  border: 1px solid transparent;
  color: #06121c;
  font-size: 0.95rem;
  font-weight: 700;
  text-align: center;
  position: relative;
  z-index: 1;
  transition: filter var(--transition-normal), transform var(--transition-normal);
}

.offers-card:hover .offers-card-action {
  filter: brightness(1.08);
}

.offers-card-problem {
  color: var(--text-primary);
  font-size: clamp(1.05rem, 2.4vw, 1.2rem);
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 0.3rem;
  position: relative;
  z-index: 1;
}

.offers-card-desc {
  color: var(--text-secondary);
  font-size: 0.85rem;
  line-height: 1.5;
  margin: 0 0 0.75rem;
  position: relative;
  z-index: 1;
}

.offers-card-badge {
  display: inline-block;
  align-self: flex-start;
  padding: 0.22rem 0.6rem;
  margin-bottom: 0.5rem;
  border-radius: 999px;
  background: rgba(0, 212, 255, 0.12);
  border: 1px solid rgba(0, 212, 255, 0.3);
  color: var(--primary);
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  position: relative;
  z-index: 1;
}

.offers-card-badge-featured {
  background: rgba(78, 205, 196, 0.14);
  border-color: rgba(78, 205, 196, 0.35);
  color: #7aebff;
}

.offers-whatsapp-float {
  position: fixed;
  right: 1.25rem;
  bottom: 5rem;
  z-index: 1100;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #25d366;
  color: #ffffff;
  font-size: 1.75rem;
  text-decoration: none;
  box-shadow: 0 8px 28px rgba(37, 211, 102, 0.45);
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.offers-whatsapp-float:hover {
  transform: scale(1.08);
  box-shadow: 0 12px 36px rgba(37, 211, 102, 0.55);
  color: #ffffff;
}

@media (min-width: 768px) {
  .offers-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-lg) var(--spacing-xl);
  }
}

@media (max-width: 767px) {
  .offers-page .container {
    width: 90%;
    max-width: 90%;
  }

  .offers-page-main {
    justify-content: flex-start;
    padding: var(--spacing-lg) 0 var(--spacing-xl);
  }

  .offers-header {
    margin-bottom: var(--spacing-xl);
  }

  .offers-whatsapp-float {
    right: 1rem;
    bottom: 4.5rem;
  }
}

/* ===========================================
   Coaches GSAP — premium motion helpers
   =========================================== */
.coaches-page .hero-title .gs-word-mask {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  line-height: 1.12;
}

.coaches-page .hero-title .gs-word {
  display: inline-block;
  will-change: transform, opacity;
}

.coaches-page .coaches-build-card,
.coaches-page .coaches-step,
.coaches-page .primary-button,
.coaches-page .cta-button {
  will-change: transform;
}

html:not(.coaches-animations-ready) .coaches-page .coaches-hero .hero-title,
html:not(.coaches-animations-ready) .coaches-page .coaches-hero .coaches-hero-lead,
html:not(.coaches-animations-ready) .coaches-page .coaches-hero .video-placeholder,
html:not(.coaches-animations-ready) .coaches-page .coaches-hero .coaches-hero-cta,
html:not(.coaches-animations-ready) .coaches-page .coaches-desktop-nav {
  visibility: hidden;
}

html.coaches-animations-reduced .coaches-page .coaches-hero .hero-title,
html.coaches-animations-reduced .coaches-page .coaches-hero .coaches-hero-lead,
html.coaches-animations-reduced .coaches-page .coaches-hero .video-placeholder,
html.coaches-animations-reduced .coaches-page .coaches-hero .coaches-hero-cta,
html.coaches-animations-reduced .coaches-page .coaches-desktop-nav {
  visibility: visible !important;
  transform: none !important;
  opacity: 1 !important;
  clip-path: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .coaches-page .hero-title .gs-word,
  .coaches-page .coaches-build-card,
  .coaches-page .coaches-step {
    transform: none !important;
    opacity: 1 !important;
  }
}

/* ===========================================
   Coaches funnel v2 — focused conversion page
   =========================================== */
.coaches-funnel-v2 {
  --coaches-text: #f2f8ff;
  --coaches-muted: #b7c9db;
  --coaches-card: rgba(12, 22, 34, 0.92);
  background: #05070b;
}


/* ===========================================
   Funnel v2 background chain (base / mobile)
   Blue ~top 70%, black last ~30%.
   Desktop overrides below start black ~40%.
   =========================================== */
.coaches-funnel-v2 .coaches-block-section,
.coaches-funnel-v2 .coaches-reviews-section,
.coaches-funnel-v2 .coaches-mid-cta-section,
.coaches-funnel-v2 .coaches-funnel-hero {
  overflow: hidden;
  position: relative;
}

.coaches-funnel-v2 .coaches-block-alt::before,
.coaches-funnel-v2 .coaches-block-section::after,
.coaches-funnel-v2 .coaches-reviews-section::before {
  display: none !important;
}

/* 1. Hero — soft dark → blue */
.coaches-funnel-v2 #hero.coaches-hero,
.coaches-funnel-v2 #hero .hero-background {
  background: linear-gradient(
    180deg,
    #0a1520 0%,
    #123046 40%,
    #1a4a6e 78%,
    #1e4f78 100%
  ) !important;
}

/* 2. Objections — hold the blue */
.coaches-funnel-v2 #objections {
  background: linear-gradient(
    180deg,
    #1e4f78 0%,
    #1a4568 55%,
    #163852 100%
  ) !important;
}

/* 2b. What you get — continues the blue objections ends on, into what reviews starts on */
.coaches-funnel-v2 #deliverables {
  background: linear-gradient(
    180deg,
    #163852 0%,
    #17395a 50%,
    #163852 100%
  ) !important;
}

/* Deliverable cards get their own icon badge — a deliberately different
   structure from the plain checklist in #objections right above it. */
.coaches-funnel-v2 #deliverables .coaches-deliverable-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--gradient-primary);
  color: #06121c;
  font-size: 0.95rem;
  margin-bottom: var(--spacing-sm);
  position: relative;
  z-index: 1;
}

/* 3. Client projects — still blue, slight deepen */
.coaches-funnel-v2 #reviews.coaches-reviews-section {
  background: linear-gradient(
    180deg,
    #163852 0%,
    #14405f 45%,
    #123046 100%
  ) !important;
}

/* 4. Mid CTA — start fading to black */
.coaches-funnel-v2 #mid-cta {
  background: linear-gradient(
    180deg,
    #123046 0%,
    #0a1826 55%,
    #070d14 100%
  ) !important;
}

/* 5. About — deep into black */
.coaches-funnel-v2 #about {
  background: linear-gradient(
    180deg,
    #070d14 0%,
    #05070b 55%,
    #040506 100%
  ) !important;
}

.coaches-funnel-v2 #about .coaches-about-heading {
  color: #f2f8ff !important;
}

.coaches-funnel-v2 #about .coaches-about-copy p {
  color: #c5d7e8 !important;
}

/* 6. FAQ — finish black fade */
.coaches-funnel-v2 #faq {
  background: linear-gradient(
    180deg,
    #040506 0%,
    #030405 55%,
    #020303 100%
  ) !important;
}

.coaches-funnel-v2 #faq .coaches-block-heading,
.coaches-funnel-v2 #faq .faq-question span,
.coaches-funnel-v2 #faq .faq-answer p {
  color: #f0f8fc !important;
}

.coaches-funnel-v2 #faq .faq-item {
  background: rgba(8, 14, 22, 0.72);
  border-color: rgba(0, 212, 255, 0.18);
}

.coaches-funnel-v2 .coaches-funnel-footer,
.coaches-funnel-v2 .coaches-footer {
  background: #030405 !important;
  border-top: 1px solid rgba(0, 212, 255, 0.12);
}

.coaches-funnel-v2 .coaches-footer p,
.coaches-funnel-v2 .coaches-footer-legal a {
  color: rgba(184, 204, 220, 0.9);
}

.coaches-funnel-v2 .coaches-footer-legal a:hover,
.coaches-funnel-v2 .coaches-footer-legal a:focus-visible {
  color: #7adfff;
}

/* Desktop only: black fade starts ~40% down (after hero + objections) */
@media (min-width: 1025px) {
  /* Still blue through objections */
  .coaches-funnel-v2 #objections {
    background: linear-gradient(
      180deg,
      #1e4f78 0%,
      #1a4568 50%,
      #143a58 100%
    ) !important;
  }

  /* Still blue — What you get continues the hold before reviews starts deepening */
  .coaches-funnel-v2 #deliverables {
    background: linear-gradient(
      180deg,
      #143a58 0%,
      #15395a 50%,
      #143a58 100%
    ) !important;
  }

  /* ~40%: Client projects begin the fade toward black */
  .coaches-funnel-v2 #reviews.coaches-reviews-section {
    background: linear-gradient(
      180deg,
      #143a58 0%,
      #0c1c2c 48%,
      #070d14 100%
    ) !important;
  }

  /* Mid CTA — deep into black */
  .coaches-funnel-v2 #mid-cta {
    background: linear-gradient(
      180deg,
      #070d14 0%,
      #05070b 45%,
      #040506 100%
    ) !important;
  }

  /* About + FAQ — hold black */
  .coaches-funnel-v2 #about {
    background: linear-gradient(
      180deg,
      #040506 0%,
      #030405 100%
    ) !important;
  }

  .coaches-funnel-v2 #faq {
    background: linear-gradient(
      180deg,
      #030405 0%,
      #020303 100%
    ) !important;
  }
}


/* Never hide readable text / hero media on this funnel */
.coaches-funnel-v2 .hero-title,
.coaches-funnel-v2 .coaches-hero-lead,
.coaches-funnel-v2 .video-placeholder,
.coaches-funnel-v2 .coaches-macbook,
.coaches-funnel-v2 .coaches-hero-devices,
.coaches-funnel-v2 .coaches-hero-cta,
.coaches-funnel-v2 .coaches-desktop-nav,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .hero-title,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .coaches-hero-lead,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .video-placeholder,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .coaches-macbook,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .coaches-hero-devices,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .coaches-hero-cta,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-desktop-nav {
  visibility: visible !important;
  opacity: 1 !important;
  clip-path: none !important;
}

/* Do NOT force transform:none on .coaches-macbook — 3D lid open needs transforms */
.coaches-funnel-v2 .hero-title,
.coaches-funnel-v2 .coaches-hero-lead,
.coaches-funnel-v2 .video-placeholder,
.coaches-funnel-v2 .coaches-hero-cta,
.coaches-funnel-v2 .coaches-desktop-nav,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .hero-title,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .coaches-hero-lead,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .video-placeholder,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-hero .coaches-hero-cta,
html:not(.coaches-animations-ready) .coaches-funnel-v2 .coaches-desktop-nav {
  transform: none !important;
}

.coaches-funnel-v2 .coaches-desktop-nav {
  backdrop-filter: blur(12px);
}

.coaches-funnel-v2 .coaches-desktop-nav .nav-links {
  display: none;
}

.coaches-funnel-v2 .coaches-funnel-hero {
  min-height: auto;
  padding: clamp(3.5rem, 8vw, 5.5rem) 0 clamp(2.5rem, 5vw, 3.5rem);
}

/* Desktop only: pull hero up (no top nav on funnel v2; override 165px coaches padding) */
@media (min-width: 1025px) {
  .coaches-funnel-v2 #hero.coaches-hero,
  .coaches-funnel-v2 .coaches-funnel-hero {
    padding-top: 4.25rem;
  }
}

.coaches-funnel-v2 .coaches-funnel-hero .hero-particles {
  display: none;
}

.coaches-funnel-v2 .coaches-funnel-hero .hero-content,
.coaches-funnel-v2 .coaches-funnel-hero .hero-text {
  position: relative;
  z-index: 2;
}

.coaches-funnel-v2 .coaches-eyebrow {
  display: inline-block;
  margin: 0 0 1rem;
  color: #7adfff;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.coaches-funnel-v2 .hero-title {
  color: var(--coaches-text) !important;
  font-size: clamp(1.85rem, 4.8vw, 3rem);
  line-height: 1.15;
  font-weight: 800;
  margin: 0 auto 1rem;
  max-width: 22ch;
  text-shadow: none;
  -webkit-text-fill-color: currentColor;
  background: none;
}

.coaches-funnel-v2 .coaches-hero-lead {
  color: var(--coaches-muted) !important;
  font-size: clamp(1.05rem, 2.2vw, 1.2rem);
  line-height: 1.65;
  max-width: 52rem;
  margin: 0 auto 0.55rem;
}

.coaches-funnel-v2 .coaches-content-width {
  max-width: 920px;
}

@media (min-width: 992px) {
  .coaches-funnel-v2 .hero-title {
    max-width: 28ch;
    font-size: clamp(2.2rem, 3.4vw, 3.15rem);
  }

  .coaches-funnel-v2 .coaches-hero-lead {
    max-width: 58rem;
  }

  .coaches-funnel-v2 .coaches-content-width {
    max-width: 980px;
  }

  .coaches-funnel-v2 .coaches-macbook {
    max-width: 720px;
  }
}

/* ===========================================
   Hero device mockup image (replaces 3D MacBook)
   Display as uploaded — no card bg, no filters
   =========================================== */
.coaches-hero-devices {
  width: min(100%, 720px);
  margin: 0.1rem auto 0.35rem;
  background: none;
  border: 0;
  box-shadow: none;
  line-height: 0;
}

.coaches-hero-devices-img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  /* Keep the file exactly as provided */
  object-fit: contain;
  image-rendering: auto;
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

@media (max-width: 768px) {
  .coaches-hero-devices {
    width: min(100%, 520px);
    margin: 0.05rem auto 0.3rem;
  }
}

/* ===========================================
   Hero 3D MacBook — closed → opens on load
   Flat face-on view so the screen stays a true rectangle
   =========================================== */
.coaches-macbook {
  --mb-open-duration: 1.45s;
  --mb-open-ease: cubic-bezier(0.22, 1, 0.36, 1);
  width: min(100%, 640px);
  margin: 0.35rem auto 1.65rem;
  perspective: 1400px;
  perspective-origin: 50% 100%;
}

.coaches-macbook-scene {
  position: relative;
  width: 100%;
  transform-style: preserve-3d;
  /* No scene tilt — tilt was making the screen a trapezoid */
  transform: none;
}

.coaches-macbook.is-open .coaches-macbook-scene {
  transform: none;
}

.coaches-macbook-lid {
  position: relative;
  z-index: 2;
  width: 100%;
  aspect-ratio: 16 / 10.2;
  transform-style: preserve-3d;
  transform-origin: 50% 100%;
  transform: rotateX(-90deg);
  transition: transform var(--mb-open-duration) var(--mb-open-ease);
  will-change: transform;
}

.coaches-macbook.is-open .coaches-macbook-lid {
  transform: rotateX(0deg);
}

.coaches-macbook-screen-front,
.coaches-macbook-screen-back {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  border-radius: 10px;
}

.coaches-macbook-screen-front {
  background: linear-gradient(180deg, #1a1d22 0%, #0c0e12 100%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.5),
    0 18px 40px rgba(0, 0, 0, 0.35);
  /* No translateZ — keeps screen edges parallel (perfect rectangle) */
  transform: none;
  display: flex;
  padding: 2.2%;
}

.coaches-macbook-screen-back {
  background: linear-gradient(145deg, #d5dae0 0%, #aeb6c0 45%, #8e97a3 100%);
  border: 1px solid rgba(255, 255, 255, 0.35);
  transform: rotateY(180deg);
  box-shadow: inset 0 0 24px rgba(0, 0, 0, 0.12);
}

.coaches-macbook-screen-back::after {
  content: '';
  position: absolute;
  top: 46%;
  left: 50%;
  width: 14%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f2f4f6 0%, #9aa3ae 55%, #6d7682 100%);
  opacity: 0.55;
}

.coaches-macbook-bezel {
  position: relative;
  flex: 1;
  background: #05070b;
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.coaches-macbook-camera {
  position: absolute;
  top: 6px;
  left: 50%;
  width: 6px;
  height: 6px;
  margin-left: -3px;
  border-radius: 50%;
  background: #1a222c;
  box-shadow: inset 0 0 0 1px rgba(0, 212, 255, 0.25);
  z-index: 3;
}

.coaches-macbook-display {
  position: relative;
  flex: 1;
  margin-top: 14px;
  background:
    radial-gradient(circle at 30% 35%, rgba(0, 212, 255, 0.14) 0%, transparent 50%),
    radial-gradient(circle at 70% 65%, rgba(78, 205, 196, 0.1) 0%, transparent 48%),
    linear-gradient(145deg, #0a121c 0%, #101e2c 100%);
  overflow: hidden;
}

.coaches-macbook-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.45s ease;
  background: #05070b;
}

.coaches-macbook.has-video .coaches-macbook-video {
  opacity: 1;
}

.coaches-macbook.has-video .coaches-macbook-placeholder {
  opacity: 0;
  pointer-events: none;
}

.coaches-macbook-placeholder {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1rem;
  transition: opacity 0.45s ease;
}

.coaches-macbook .video-play-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 0.75rem;
  border-radius: 50%;
  background: var(--gradient-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  color: #fff;
  box-shadow: 0 0 28px rgba(0, 212, 255, 0.35);
}

.coaches-macbook.is-open:not(.has-video) .video-play-icon {
  animation: video-pulse 2.5s ease-in-out infinite;
}

.coaches-macbook .video-placeholder-text {
  font-size: 0.95rem;
  font-weight: 600;
  color: #f2f8ff !important;
  margin-bottom: 0.25rem;
}

.coaches-macbook .video-placeholder-sub {
  font-size: 0.8rem;
  color: #9eb4c8 !important;
  margin: 0;
}

.coaches-macbook-base {
  position: relative;
  z-index: 1;
  margin-top: -1px;
  height: clamp(10px, 2.2vw, 16px);
  border-radius: 0 0 10px 10px;
  background: linear-gradient(180deg, #dfe3e8 0%, #b4bbc4 40%, #8f98a3 100%);
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.35),
    0 2px 0 rgba(255, 255, 255, 0.35) inset;
  transform: translateZ(0);
}

.coaches-macbook-base::before {
  content: '';
  position: absolute;
  left: 8%;
  right: 8%;
  top: -1px;
  height: 3px;
  border-radius: 0 0 4px 4px;
  background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.28), transparent);
}

.coaches-macbook-chin {
  position: absolute;
  left: 50%;
  top: 35%;
  width: 16%;
  height: 28%;
  transform: translateX(-50%);
  border-radius: 0 0 3px 3px;
  background: #7d8692;
  opacity: 0.85;
}

.coaches-macbook-keyboard,
.coaches-macbook-trackpad {
  display: none;
}

.coaches-macbook::after {
  content: '';
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -18px;
  height: 28px;
  background: radial-gradient(ellipse at center, rgba(0, 212, 255, 0.28) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.6s ease 0.7s;
  pointer-events: none;
  z-index: 0;
}

.coaches-macbook.is-open::after {
  opacity: 1;
}

@media (max-width: 640px) {
  .coaches-macbook {
    margin-bottom: 1.25rem;
  }

  .coaches-macbook-scene {
    transform: rotateX(10deg) rotateY(0deg);
  }

  .coaches-macbook.is-open .coaches-macbook-scene {
    transform: rotateX(6deg) rotateY(0deg);
  }

  .coaches-macbook .video-play-icon {
    width: 52px;
    height: 52px;
    font-size: 1.15rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .coaches-macbook-lid,
  .coaches-macbook-scene,
  .coaches-macbook::after {
    transition: none !important;
  }

  .coaches-macbook .coaches-macbook-lid {
    transform: rotateX(0deg) !important;
  }

  .coaches-macbook .coaches-macbook-scene {
    transform: rotateX(6deg) rotateY(0deg) !important;
  }
}

.coaches-funnel-v2 .video-placeholder {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0 auto 1.5rem;
  max-width: 640px;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 220px;
  background: linear-gradient(145deg, rgba(10, 18, 28, 0.98) 0%, rgba(16, 32, 48, 0.98) 100%);
  border: 1px solid rgba(0, 212, 255, 0.35);
  border-radius: var(--radius-lg);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
}

.coaches-funnel-v2 .video-play-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto var(--spacing-md);
  border-radius: 50%;
  background: var(--gradient-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: #fff;
  box-shadow: 0 0 32px rgba(0, 212, 255, 0.35);
}

.coaches-funnel-v2 .coaches-macbook .video-play-icon {
  margin-bottom: 0.75rem;
  width: 64px;
  height: 64px;
  font-size: 1.35rem;
}

.coaches-funnel-v2 .video-placeholder-text {
  color: #f2f8ff !important;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0.35rem;
}

.coaches-funnel-v2 .video-placeholder-sub {
  color: #9eb4c8 !important;
  font-size: 0.85rem;
}

.coaches-funnel-v2 .coaches-hero-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  margin-top: 0.15rem;
}

.coaches-funnel-v2 .coaches-hero-helper {
  margin: 0;
  color: #9eb4c8;
  font-size: 0.95rem;
  line-height: 1.5;
  max-width: 28rem;
  text-align: center;
}

.coaches-funnel-v2 .primary-button,
.coaches-funnel-v2 .submit-button,
.coaches-funnel-v2 .cta-button {
  color: #041018 !important;
  font-weight: 700;
}

.coaches-funnel-visual-section {
  padding-top: 0.5rem;
  padding-bottom: clamp(2rem, 5vw, 3rem);
}

.coaches-funnel-diagram {
  background: linear-gradient(160deg, rgba(14, 28, 42, 0.98) 0%, rgba(8, 14, 22, 0.98) 100%);
  border: 1px solid rgba(0, 212, 255, 0.28);
  border-radius: var(--radius-lg);
  padding: clamp(1.25rem, 3vw, 2rem);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}

.coaches-funnel-diagram-title {
  margin: 0 0 1.25rem;
  text-align: center;
  color: var(--coaches-text);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.coaches-funnel-stages {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.65rem;
}

.coaches-funnel-stage {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(0, 212, 255, 0.08);
  border: 1px solid rgba(0, 212, 255, 0.22);
  border-radius: 14px;
  padding: 0.95rem 1rem;
}

.coaches-funnel-stage-final {
  background: rgba(78, 205, 196, 0.12);
  border-color: rgba(78, 205, 196, 0.35);
}

.coaches-funnel-stage-num {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 212, 255, 0.18);
  color: #7adfff;
  font-weight: 700;
  font-size: 0.9rem;
}

.coaches-funnel-stage-label {
  color: var(--coaches-text);
  font-weight: 650;
  font-size: 1rem;
}

.coaches-funnel-arrow {
  display: flex;
  justify-content: center;
  height: 1rem;
}

.coaches-funnel-arrow-icon {
  width: 2px;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 212, 255, 0.15), rgba(0, 212, 255, 0.75));
  border-radius: 2px;
  position: relative;
}

.coaches-funnel-arrow-icon::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 8px;
  height: 8px;
  border-right: 2px solid rgba(0, 212, 255, 0.8);
  border-bottom: 2px solid rgba(0, 212, 255, 0.8);
  transform: translateX(-50%) rotate(45deg);
}

@media (min-width: 900px) {
  .coaches-funnel-stages {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
  }

  .coaches-funnel-stage {
    flex: 1;
    flex-direction: column;
    text-align: center;
    min-height: 118px;
    justify-content: center;
    padding: 1.15rem 0.75rem;
  }

  .coaches-funnel-arrow {
    width: 28px;
    height: auto;
    align-items: center;
  }

  .coaches-funnel-arrow-icon {
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, rgba(0, 212, 255, 0.15), rgba(0, 212, 255, 0.75));
  }

  .coaches-funnel-arrow-icon::after {
    left: auto;
    right: -2px;
    bottom: 50%;
    transform: translateY(50%) rotate(-45deg);
  }
}

.coaches-funnel-form-section {
  padding-top: clamp(2rem, 5vw, 3.5rem);
}

.coaches-funnel-v2 .coaches-block-heading,
.coaches-funnel-v2 .form-step-title,
.coaches-funnel-v2 .review-text,
.coaches-funnel-v2 .review-author,
.coaches-funnel-v2 .faq-question span {
  color: var(--coaches-text) !important;
}

.coaches-funnel-v2 .coaches-block-intro,
.coaches-funnel-v2 .form-step-subtitle,
.coaches-funnel-v2 .coaches-check-list li,
.coaches-funnel-v2 .faq-answer p {
  color: var(--coaches-muted) !important;
}

.coaches-funnel-v2 .application-form-wrapper,
.coaches-funnel-v2 .review-card,
.coaches-funnel-v2 .faq-item {
  background: var(--coaches-card);
  border: 1px solid rgba(0, 212, 255, 0.22);
}

.coaches-funnel-v2 .form-group input,
.coaches-funnel-v2 .form-group select,
.coaches-funnel-v2 .form-group textarea {
  color: var(--coaches-text) !important;
  caret-color: #7adfff;
}

.coaches-funnel-v2 .form-group label {
  color: #9eb4c8 !important;
}

.coaches-objections-section {
  padding-top: 0.5rem;
}

.coaches-funnel-v2 .coaches-objections-list li {
  font-size: 1.02rem;
  line-height: 1.55;
}

.coaches-mid-cta-section {
  padding-top: 0.5rem;
  padding-bottom: clamp(2rem, 5vw, 3rem);
}

.coaches-mid-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  text-align: center;
}

.coaches-funnel-reviews {
  padding: clamp(2.5rem, 6vw, 4rem) 0;
}

.coaches-funnel-v2 .coaches-funnel-reviews .coaches-block-header {
  margin-bottom: 1.75rem;
}

.coaches-funnel-v2 .reviews-marquee {
  margin-top: 0.5rem;
}

.coaches-funnel-v2 .review-card {
  background: rgba(12, 22, 34, 0.96);
  border: 1px solid rgba(0, 212, 255, 0.24);
  width: min(360px, 85vw);
}

.coaches-funnel-v2 .review-text {
  color: #e8f2fb !important;
  font-size: 1.05rem;
  line-height: 1.55;
  font-style: normal;
}

.coaches-funnel-v2 .review-author {
  color: #f2f8ff !important;
}

.coaches-funnel-v2 .review-author span {
  color: #7adfff !important;
}

.coaches-calendly-embed-wrap {
  margin-top: 1.25rem;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid rgba(0, 212, 255, 0.2);
  background: #0a121c;
}

.coaches-calendly-fallback {
  margin-top: 1rem;
  font-size: 0.92rem;
  color: #9eb4c8;
}

.coaches-calendly-fallback a {
  color: #7adfff;
  text-decoration: underline;
}

.coaches-funnel-footer {
  padding: 1.75rem 0 2rem;
  text-align: center;
}

.coaches-funnel-footer .coaches-footer-logo img {
  height: 34px;
  width: auto;
  margin-bottom: 0.65rem;
}

.coaches-footer-legal {
  margin: 0.35rem 0 0;
  font-size: 0.85rem;
}

.coaches-footer-legal a {
  color: #9eb4c8;
  text-decoration: none;
}

.coaches-footer-legal a:hover,
.coaches-footer-legal a:focus-visible {
  color: #7adfff;
}

.coaches-footer .twx-footer-legal,
.offers-page-footer .twx-footer-legal {
  margin: 0.35rem auto 0.75rem;
  max-width: 40rem;
  font-size: 0.7rem;
  line-height: 1.55;
  color: #8fa3b8;
}

.coaches-footer .twx-footer-legal a,
.offers-page-footer .twx-footer-legal a {
  color: #7adfff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.offers-page-footer {
  padding: 1.25rem 0 2rem;
  background: transparent;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* Hide legacy bottom nav if present */
.coaches-funnel-v2 .coaches-bottom-nav {
  display: none !important;
}

@media (max-width: 768px) {
  .coaches-funnel-v2 {
    padding-bottom: 0;
  }

  .coaches-funnel-v2 .coaches-funnel-hero {
    padding-top: 3rem;
  }

  .coaches-funnel-v2 .hero-title {
    max-width: none;
  }
}

/* ===========================================
   Coaches form popup modal (compact)
   =========================================== */
body.coaches-form-modal-open {
  overflow: hidden;
}

.coaches-form-modal[hidden] {
  display: none !important;
}

.coaches-form-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.coaches-form-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 8, 14, 0.78);
  backdrop-filter: blur(6px);
}

.coaches-form-modal-panel {
  position: relative;
  z-index: 1;
  width: min(640px, 100%);
  max-height: min(88vh, 720px);
  overflow-y: auto;
  padding: 1.15rem 1.15rem 1.1rem !important;
  margin: 0 !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(14, 26, 38, 0.98) 0%, rgba(8, 14, 22, 0.98) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.28) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);
}

/* The booking widget draws its own card chrome (background/border/padding) —
   the modal panel above already provides that, so strip the widget's own
   chrome when it's mounted inside this modal to avoid a card-in-a-card look. */
.coaches-form-modal .booking-card {
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.coaches-form-modal-x {
  position: absolute;
  top: 0.55rem;
  right: 0.65rem;
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: #e8f2fb;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}

.coaches-form-modal-x:hover,
.coaches-form-modal-x:focus-visible {
  background: rgba(0, 212, 255, 0.18);
  color: #fff;
}

.coaches-form-modal-intro {
  margin: 0 1.75rem 0.85rem 0;
  color: #b7c9db;
  font-size: 0.92rem;
  line-height: 1.45;
}

.coaches-funnel-v2 .coaches-form-modal .form-progress {
  display: none !important;
}

.coaches-funnel-v2 .coaches-form-modal .form-step-title {
  font-size: 1.15rem !important;
  margin-bottom: 0.2rem;
}

.coaches-funnel-v2 .coaches-form-modal .form-step-subtitle {
  font-size: 0.8rem !important;
  margin-bottom: 0.75rem;
}

.coaches-funnel-v2 .coaches-form-modal .form-group {
  margin-bottom: 0.85rem;
}

.coaches-funnel-v2 .coaches-form-modal .form-group input,
.coaches-funnel-v2 .coaches-form-modal .form-group select {
  padding-top: 0.7rem;
  padding-bottom: 0.55rem;
}

.coaches-funnel-v2 .coaches-form-modal .form-nav {
  margin-top: 0.75rem;
  gap: 0.65rem;
}

.coaches-funnel-v2 .coaches-form-modal .submit-button,
.coaches-funnel-v2 .coaches-form-modal .secondary-button {
  min-height: 42px;
  padding: 0.65rem 1rem;
  font-size: 0.92rem;
}

.coaches-funnel-v2 .coaches-form-modal .form-success {
  padding-top: 0.25rem;
}

.coaches-funnel-v2 .coaches-form-modal .form-success h3 {
  font-size: 1.15rem;
}

.coaches-funnel-v2 .coaches-form-modal .coaches-calendly-embed-wrap {
  margin-top: 0.75rem;
}

.coaches-funnel-v2 .coaches-form-modal.is-success .coaches-form-modal-panel,
.coaches-form-modal-panel:has(#form-success.visible) {
  max-height: min(90vh, 720px);
  width: min(560px, 100%);
}

/* ===========================================
   Coaches scroll FX — orbs + shooting stars
   Layer above section backgrounds, under copy.
   (Do not put z-index on main — it traps content.)
   =========================================== */
.coaches-fx-layer {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

.coaches-funnel-v2 main,
.coaches-funnel-v2 .coaches-footer {
  position: relative;
  z-index: auto;
}

/* Readable content sits above the ambient FX layer */
.coaches-funnel-v2 .hero-content,
.coaches-funnel-v2 main .container,
.coaches-funnel-v2 .reviews-marquee,
.coaches-funnel-v2 .projects-mac-marquee,
.coaches-funnel-v2 .coaches-footer > .container {
  position: relative;
  z-index: 2;
}

.coaches-fx-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(40px);
  opacity: 0.34;
  transform: translate3d(0, 0, 0) scale(1);
  will-change: transform, opacity;
  background: radial-gradient(circle, rgba(0, 212, 255, 0.6) 0%, rgba(0, 212, 255, 0) 70%);
}

.coaches-fx-orb-1 {
  width: 280px;
  height: 280px;
  top: 18%;
  left: -80px;
  animation: coaches-orb-float-a 14s ease-in-out infinite;
}

.coaches-fx-orb-2 {
  width: 220px;
  height: 220px;
  top: 52%;
  right: -60px;
  opacity: 0.24;
  background: radial-gradient(circle, rgba(90, 170, 255, 0.5) 0%, rgba(90, 170, 255, 0) 70%);
  animation: coaches-orb-float-b 18s ease-in-out infinite;
}

.coaches-fx-orb-3 {
  width: 180px;
  height: 180px;
  bottom: 12%;
  left: 35%;
  opacity: 0.2;
  background: radial-gradient(circle, rgba(78, 205, 196, 0.45) 0%, rgba(78, 205, 196, 0) 70%);
  animation: coaches-orb-float-c 16s ease-in-out infinite;
}

@keyframes coaches-orb-float-a {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(40px, 30px, 40px) scale(1.12); }
}

@keyframes coaches-orb-float-b {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-35px, -25px, 20px) scale(1.08); }
}

@keyframes coaches-orb-float-c {
  0%, 100% { transform: translate3d(0, 0, 0) scale(0.95); }
  50% { transform: translate3d(20px, -40px, 30px) scale(1.15); }
}

.coaches-fx-star,
.coaches-fx-star-b {
  position: absolute;
  top: 16%;
  left: -18%;
  width: 180px;
  height: 2px;
  border-radius: 999px;
  opacity: 0;
  /* Head on the right — trail fades left. Move only along local X after rotate so path matches angle. */
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(200, 245, 255, 0.15) 25%,
    rgba(230, 250, 255, 0.55) 58%,
    rgba(0, 212, 255, 0.4) 82%,
    transparent 100%
  );
  box-shadow:
    0 0 6px rgba(255, 255, 255, 0.35),
    0 0 14px rgba(0, 212, 255, 0.35),
    0 0 28px rgba(0, 212, 255, 0.2);
  transform: rotate(18deg) translateX(0);
  transform-origin: center center;
  will-change: transform, opacity;
}

.coaches-fx-star::before,
.coaches-fx-star-b::before {
  content: '';
  position: absolute;
  right: -2px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.75);
  box-shadow:
    0 0 8px rgba(255, 255, 255, 0.55),
    0 0 16px rgba(0, 212, 255, 0.45);
}

.coaches-fx-star.is-shooting {
  animation: coaches-shooting-star 1.35s cubic-bezier(0.33, 0, 0.2, 1) forwards;
}

.coaches-fx-star-b.is-shooting {
  animation: coaches-shooting-star-b 1.5s cubic-bezier(0.33, 0, 0.2, 1) forwards;
}

/* Straight diagonal: rotate first, then translateX along that axis (no extra Y drift) */
@keyframes coaches-shooting-star {
  0% {
    opacity: 0;
    transform: rotate(18deg) translateX(0) scaleX(0.45);
  }
  12% {
    opacity: 0.45;
  }
  55% {
    opacity: 0.5;
  }
  100% {
    opacity: 0;
    transform: rotate(18deg) translateX(130vw) scaleX(1);
  }
}

@keyframes coaches-shooting-star-b {
  0% {
    opacity: 0;
    transform: rotate(26deg) translateX(0) scaleX(0.4);
  }
  14% {
    opacity: 0.4;
  }
  58% {
    opacity: 0.45;
  }
  100% {
    opacity: 0;
    transform: rotate(26deg) translateX(125vw) scaleX(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .coaches-fx-orb,
  .coaches-fx-star,
  .coaches-fx-star-b {
    animation: none !important;
    opacity: 0 !important;
  }

  .coaches-hero-motion-ready .coaches-eyebrow,
  .coaches-hero-motion-ready .hero-title,
  .coaches-hero-motion-ready .coaches-hero-lead,
  .coaches-hero-motion-ready .coaches-hero-cta {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Hero Motion initial state (revealed by JS; CSS fallback if Motion fails) */
.coaches-hero-motion-ready .coaches-eyebrow,
.coaches-hero-motion-ready .hero-title,
.coaches-hero-motion-ready .coaches-hero-lead,
.coaches-hero-motion-ready .coaches-hero-cta {
  opacity: 0;
  transform: translateY(18px);
}


/* ===========================================
   Client projects — MacBook infinite carousel
   =========================================== */
.coaches-projects-section {
  padding-bottom: clamp(2.5rem, 6vw, 4rem);
}

.projects-mac-marquee {
  width: 100%;
  overflow: hidden;
  margin-top: 0.75rem;
  padding: 0.75rem 0 1.75rem;
  /* Soft edge fade — keep captions readable near the sides */
  mask-image: linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%);
}

.projects-mac-track {
  display: flex;
  align-items: flex-start;
  gap: clamp(2.25rem, 5vw, 3.5rem);
  width: max-content;
  /* JS-driven seamless loop (no CSS animation restart hitch) */
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

.projects-mac-item {
  flex: 0 0 auto;
  width: min(440px, 86vw);
  text-align: center;
}

.projects-mac-caption {
  position: relative;
  z-index: 3;
  min-height: 3.6rem;
  margin-top: 0.15rem;
  margin-inline: auto;
  opacity: 1 !important;
  width: 100%;
  max-width: 26rem;
  visibility: visible !important;
  pointer-events: none;
}

.projects-mac-title {
  margin: 0 0 0.4rem;
  font-size: clamp(1.1rem, 2.4vw, 1.25rem);
  font-weight: 700;
  color: #f2f8ff !important;
  letter-spacing: 0.01em;
  opacity: 1 !important;
  visibility: visible !important;
}

.projects-mac-desc {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #9eb4c8 !important;
  max-width: none;
  margin-inline: auto;
  opacity: 1 !important;
  visibility: visible !important;
}

.projects-macbook {
  width: 100%;
  max-width: 440px;
  margin: 0 auto 1.15rem;
  /* Flat view so the screen stays a true rectangle (no trapezoid) */
  perspective: 1400px;
  perspective-origin: 50% 100%;
}

.projects-macbook .coaches-macbook-scene {
  transform: none;
  transition: none;
}

.projects-macbook.is-open .coaches-macbook-scene {
  transform: none;
}

.projects-macbook .coaches-macbook-lid {
  aspect-ratio: 16 / 10.4;
  /* Hinge only — no scene tilt, so bezel/screen stay rectangular */
  transform: rotateX(-90deg);
}

.projects-macbook.is-open .coaches-macbook-lid {
  transform: rotateX(0deg);
}

.projects-macbook .coaches-macbook-screen-front,
.projects-macbook .coaches-macbook-screen-back {
  border-radius: 10px 10px 3px 3px;
}

.projects-macbook .coaches-macbook-bezel {
  border-radius: 4px;
}

.projects-macbook .coaches-macbook-base {
  height: 10px;
}

.projects-macbook::after {
  bottom: -12px;
  height: 18px;
  opacity: 0;
}

.projects-macbook.is-open::after {
  opacity: 0.7;
}

/* Screen shows long site screenshot that auto-pans after open */
.projects-mac-screen {
  margin-top: 12px !important;
  background: #05070b !important;
}

.projects-mac-screen-scroll {
  position: absolute;
  inset: 0;
  overflow: hidden;
  transform: translateZ(0);
}

.projects-mac-screen-scroll img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  /* Cover the screen; we pan with object-position (reliable on iOS) */
  object-fit: cover;
  object-position: 50% 0%;
  transform: none;
  image-rendering: auto;
  pointer-events: none;
}

@media (max-width: 1024px) {
  /* Faster lid open on phones */
  .projects-macbook {
    --mb-open-duration: 0.65s;
    --mb-open-ease: cubic-bezier(0.25, 0.9, 0.35, 1);
  }

  /* No side mask on phones — captions stay fully visible */
  .projects-mac-marquee {
    mask-image: none;
    -webkit-mask-image: none;
    padding-bottom: 2rem;
  }
}

.coaches-funnel-v2 .projects-mac-marquee {
  margin-top: 0.35rem;
}

@media (max-width: 640px) {
  .projects-mac-item {
    width: min(340px, 88vw);
  }

  .projects-macbook {
    max-width: 340px;
  }

  .projects-mac-track {
    animation-duration: 50s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-mac-track {
    animation: none !important;
    transform: none !important;
    flex-wrap: wrap;
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    justify-content: center;
    gap: 1.5rem;
  }

  .projects-macbook .coaches-macbook-lid {
    transform: rotateX(0deg) !important;
  }

  .projects-mac-screen-scroll img {
    animation: none !important;
    transform: none !important;
  }
}