/* Performance/mobile tune injected over the approved static export. */
:root { --cc-fast: 160ms; }

.problem-section,
.strategy-section,
.coach-section,
.companion-section,
.onboarding-section,
.pricing-section,
.faq-section,
.final-cta-section {
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}

.action-link,
.nav-link,
.faq-item,
.pricing-card,
.tool-summary-card,
.pain-card,
.floating-card {
  transition-duration: var(--cc-fast) !important;
}

@media (max-width: 900px) {
  .glass-panel,
  .glass-panel-subtle,
  .navbar,
  .diagnostic-panel,
  .coach-dashboard,
  .assistant-interface,
  .question-generator,
  .onboarding-console,
  .pricing-card,
  .faq-item,
  .final-device-frame {
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
  }

  .particle,
  .bridge-particles,
  .companion-particles,
  .final-particles,
  .hero-grid,
  .problem-grid,
  .strategy-grid,
  .coach-grid,
  .companion-grid,
  .onboarding-grid,
  .pricing-grid,
  .visual-halo,
  .visual-ring,
  .orb,
  .spotlight,
  .problem-glow,
  .strategy-aura,
  .coach-aura,
  .companion-aura,
  .onboarding-aura,
  .pricing-aura,
  .faq-aura,
  .final-aura,
  .final-rays {
    display: none !important;
  }

  .phone-shadow,
  .final-device-shadow {
    filter: blur(14px) !important;
  }
}

@media (max-width: 580px) {
  body { overflow-x: hidden !important; }

  .hero-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
    padding-top: 42px !important;
  }

  .hero-content {
    display: contents !important;
  }

  .micro-badge {
    order: 1;
    max-width: calc(100vw - 28px);
    justify-content: center;
    text-align: center;
  }

  .hero-content h1 {
    order: 2;
    max-width: calc(100vw - 28px) !important;
    margin: 22px auto 16px !important;
    text-align: center !important;
    font-size: clamp(38px, 12vw, 48px) !important;
    line-height: 1.08 !important;
  }

  .hero-copy {
    order: 3;
    max-width: 338px !important;
    margin: 0 auto !important;
    text-align: center !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  .hero-visual {
    order: 4;
    width: 100% !important;
    height: 690px !important;
    min-height: 690px !important;
    margin: 24px 0 0 !important;
    transform: none !important;
  }

  .phone-stage {
    top: 0 !important;
    left: calc(50% - 132px) !important;
    width: 264px !important;
    height: 550px !important;
  }

  .hero-signal-grid {
    top: 575px !important;
    right: 0 !important;
    left: 0 !important;
    gap: 8px !important;
  }

  .hero-actions {
    order: 5;
    width: 100% !important;
    max-width: 350px !important;
    margin: 18px auto 0 !important;
  }

  .action-row {
    width: 100% !important;
    flex-direction: column !important;
  }

  .action-row .action-link,
  .hero-actions .action-link {
    width: 100% !important;
    min-height: 52px !important;
  }

  .hero-microcopy {
    max-width: 330px;
    margin-right: auto !important;
    margin-left: auto !important;
    text-align: center;
  }

  .trust-bar {
    margin-top: 8px !important;
  }

  .diagnostic-flow,
  .coach-dashboard-main,
  .pricing-cards,
  .final-cta-layout {
    gap: 18px !important;
  }

  .section-heading h2 {
    font-size: clamp(30px, 9.6vw, 40px) !important;
    line-height: 1.12 !important;
  }

  .section-heading p {
    max-width: 340px !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  main [style*="opacity:0"] {
    opacity: 1 !important;
  }
}