/* ============================================================
   DoctorReview Pro - Responsive (mobile-first overrides)
   Breakpoints: 1200 / 1024 / 768 / 560
   ============================================================ */

/* ---------- < 1200px ---------- */
@media (max-width: 1200px) {
  .float-keywords { right: -2%; }
  .float-templates { right: -2%; }
  .float-ai { left: -2%; }
  .float-typing { left: -2%; }
}

/* ---------- < 1024px (tablet) ---------- */
@media (max-width: 1024px) {
  .nav-links {
    display: none;
    position: fixed;
    inset: 72px 16px auto 16px;
    background: var(--white);
    border: var(--border);
    border-radius: var(--r-lg);
    padding: 14px;
    box-shadow: var(--shadow-xl);
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
  }
  .nav-links.is-open { display: flex; }
  .nav-links a { padding: 12px 14px; border-radius: 10px; font-size: 1rem; }
  .nav-burger { display: inline-flex; }

  .hero { padding: 40px 0 60px; }
  .hero-wrapper { grid-template-columns: 1.4fr 0.6fr; gap: 60px; align-items: center; min-height: 480px; }
  .hero-visual { max-width: 320px; justify-content: flex-end; }
  .dash { min-height: 0; }
  .dash-side { width: 200px; }

  .trust-grid { grid-template-columns: repeat(3, 1fr); }

  .solution-grid { grid-template-columns: 1fr; gap: 56px; }
  .fear-grid { grid-template-columns: 1fr; gap: 48px; }

  .safe-grid { grid-template-columns: 1fr; gap: 16px; }

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

  .notfor-grid { grid-template-columns: 1fr; max-width: 460px; margin-left: auto; margin-right: auto; }
  .nf-rail { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
  .nf-rail::before { display: none; }
  .nf-railitem { flex-direction: row; gap: 0; }
  .nf-node { display: none; }

  .whynow-grid { grid-template-columns: 1fr; gap: 48px; }

  .plan-grid { grid-template-columns: 1fr; gap: 18px; max-width: 460px; margin-left: auto; margin-right: auto; }
  .plan-popular { order: -1; }

  .founder-grid { grid-template-columns: 1fr; gap: 40px; max-width: 620px; margin-left: auto; margin-right: auto; }

  .audit-panel { grid-template-columns: 1fr; gap: 36px; }

  .steps::before { left: 24px; transform: none; }
  .step { grid-template-columns: 1fr; gap: 36px; padding-left: 56px; }
  .step.flip .step-copy { order: 1; }
  .step.flip .step-visual { order: 2; }
  .step-visual { max-width: 560px; }

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

  .bn-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-strip { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .stat { border-right: 0; border-bottom: 1px solid var(--hairline); padding-bottom: 18px; }
  .stat:nth-child(3), .stat:nth-child(4) { border-bottom: 0; padding-bottom: 0; padding-top: 18px; }
  .stat:nth-child(2) { border-right: 0; }

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

  .results-grid { grid-template-columns: 1fr; }
  .results-grid::before { display: none; }

  .testimonial-float { grid-template-columns: 1fr; }

  .foot-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}

/* ---------- < 768px (mobile) ---------- */
@media (max-width: 768px) {
  :root { --section-y: 56px; }

  .hero { padding: 30px 0 50px; text-align: left; }
  .hero-title { font-size: clamp(1.8rem, 6vw, 2.4rem); margin-bottom: 14px; color: #0C8A72; }
  .hero-sub { font-size: 0.95rem; margin-bottom: 20px; }
  .hero-wrapper { grid-template-columns: 1fr; gap: 24px; align-items: center; min-height: 420px; }
  .hero-content { margin-top: 0; }
  .hero-visual { max-width: 100%; justify-content: center; }
  .hero-media { max-width: 320px; margin: 0 auto; transform: none; }
  .hero-checks { gap: 8px 18px; }
  .hero-cta { gap: 12px; }
  .btn-getstarted, .btn-hero-ghost { width: 100%; justify-content: center; }
  .btn-getstarted { padding: 14px 28px; font-size: 0.95rem; }

  .hero-dash-wrap { margin-top: 40px; }
  .dash-side { display: none; }
  .dash-main { padding: 16px 16px 22px; }
  .dm-stats { grid-template-columns: repeat(2, 1fr); }

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

  .step { padding-left: 0; }
  .steps::before { display: none; }
  .step h3 { font-size: 1.5rem; }
  .step-visual { aspect-ratio: 1 / 1.05; }

  /* Hide some floating cards on small screens for clarity */
  .float-prescription, .float-whatsapp,
  .float-ai, .float-keywords, .float-templates, .float-typing,
  .float-success, .float-arrow, .float-protect,
  .float-scan, .float-conv {
    display: none;
  }

  .bento { grid-template-columns: 1fr; }
  /* let the one-line heading wrap on small screens */
  .features .section-head h2 { white-space: normal; }

  .bn-grid { grid-template-columns: 1fr; }
  .clinics-grid { grid-template-columns: 1fr; }

  .at-head { display: none; }
  .at-row {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 14px 18px;
  }
  .at-row .at-spec { font-size: 1rem; }
  .at-row .at-covers { color: var(--teal-700); }
  .stats-strip { grid-template-columns: 1fr 1fr; padding: 22px; }
  .stat { padding: 12px 8px; border-bottom: 1px solid var(--hairline); border-right: 0; }
  .stat:nth-last-child(-n+2) { border-bottom: 0; }

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

  .faq-q { padding: 16px 18px; font-size: 0.95rem; }
  .faq-a .inner { padding: 0 18px 18px; }

  .final-card { padding: 36px 24px; }
  .final-card .punch { flex-direction: column; gap: 8px; font-size: 1rem; }
  .final-card .float-mini { display: none; }
  .final-card .actions { width: 100%; }
  .final-card .actions .btn { flex: 1; justify-content: center; }

  .foot-grid { grid-template-columns: 1fr; gap: 28px; }
  .foot-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------- < 560px ---------- */
@media (max-width: 560px) {
  .nav { padding: 12px 0; }
  .nav.is-scrolled { padding: 10px 0; }
  .nav-brand { font-size: 0.98rem; }
  .nav-brand .brand-mark { width: 32px; height: 32px; }
  .nav-brand .brand-logo { height: 32px; }

  .eyebrow { font-size: 0.72rem; padding: 6px 12px; }

  .uc-grid { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr 1fr; }

  .review-mobile { width: 78%; }

  .hero-title { font-size: clamp(2rem, 8.4vw, 2.6rem); }
  .dm-welcome h3 { font-size: 1.25rem; }
  .sc-num { font-size: 1.6rem; }
  .stat-card { padding: 13px; }
  .dc-item { padding: 13px 14px; }

  /* new-section comfort on small phones */
  .proof-card { padding: 26px 20px; }
  .proof-points li { padding: 11px 14px; font-size: 0.88rem; }
  .audit-panel { padding: 24px 20px; }
  .audit-form { padding: 22px 18px; }
  .plan-card { padding: 24px 20px; }
  .nf-card { padding: 12px; }
  .founder-note p { font-size: 1rem; }
  .pt-unit { min-width: 38px; }
}

/* ---------- Ultra-wide ---------- */
@media (min-width: 1600px) {
  :root { --container: 1260px; }
  .hero { padding-top: 128px; }
}