/* CallMeByZach shared phone readability layer (Phase 1, 2026-10-07).
   Injected on every public page by scripts/inject-site-enhancements.js.
   Everything is inside the phone media query: desktop and tablets (>640px) are untouched.
   Scale: body 16/1.6 · small print 13 · labels 12 (letter-spacing <= .12em)
          action buttons 15/600, min-height 48 · H1 40–48 · H2 30–34 · H3 22.
   Selectors come from the audited markup (scripts/mobile-qa.py lists anything below the floor).
   !important is used only to win over each page's inline <style> at equal specificity. */
@media (max-width: 640px) {
  :root { --cmbz-mobile: 1; --gut: 20px; }

  /* ---------- Headings (page display type, not wordmarks or prices) ---------- */
  main h1, header h1, section h1, .hero h1, h1.hl {
    font-size: clamp(40px, 11.5vw, 48px) !important;
    line-height: 1.02 !important;
  }
  main h2, section h2, article h2, aside h2, .final h2, .loop h2, .next h2, h2.hl, h2.section-title {
    font-size: clamp(30px, 8.4vw, 34px) !important;
    line-height: 1.08 !important;
  }
  main h3:not(.hl), section h3:not(.hl), article h3:not(.hl) {
    font-size: 22px !important;
    line-height: 1.2 !important;
  }

  /* ---------- Body copy: 16px / 1.6 (only copy that rendered below 16px) ---------- */
  .paths .path p, .loop-grid > div > p, .about > p, .consult > div > p, .feature-copy > p,
  .offers .offer > p:not(.olead):not(.ofine), .offers .offer > ul > li, .offers .offer > p:not(.olead) > strong, .faq details > p,
  .bundle > div > p, .notsure, ol.steps p,
  .form-card > p,
  .tips-list .tip > p, .tips-list .tip > p > strong, .next-grid > div > p, .next-grid > div > p > a,
  .card-body > p,
  .formats .format > ul > li, .formats .format > p, .audience-note > div > p, .work-copy > p, .booking-steps .booking-step {
    font-size: 16px !important;
    line-height: 1.6 !important;
  }
  /* Step descriptions (consultations, hotel upgrade, media kit) were 13–14px */
  .process .steps .step p, .steps .step > div > p { font-size: max(16px, 1em) !important; line-height: 1.6 !important; }

  /* ---------- Small print / captions: 13px (only what rendered below 13px) ---------- */
  .fine, .ofine, p.small, .small > p, .reassurance, .privacy, .disclaimer, .platform-summary, p.micro,
  .photo-caption, .art-label, .visual > figcaption, .portrait > figcaption, .places figcaption > span,
  .proof span, .composition > .note, table.compare th, .performance-source > span,
  .gender-legend > span, .metric > span, .stats .stat > span, #purchaseNotice {
    font-size: 13px !important;
    line-height: 1.5 !important;
    letter-spacing: .02em !important;
  }

  /* ---------- Eyebrows / short labels: 12px, letter-spacing <= .12em ---------- */
  .micro, .eyebrow, .kicker, .tag, .watch, .demo-group h4 {
    font-size: 12px !important;
    letter-spacing: .1em !important;
  }
  /* Wordmarks keep their design (letter-spacing untouched), just never below 12px */
  .brand-zach, .lockup .z, a.brand > i + span { font-size: 12px !important; }
  /* Destination-hub cards */
  .dest > span, .dest > span.eyebrow { font-size: 13px !important; letter-spacing: .06em !important; }
  /* Small utility links: readable, still links (not buttons) */
  .guide-link, .back, nav.top > a:not(.brand), nav.nav > a:not(.brand), .navlink, .textlink, button.more {
    font-size: 14px !important;
    letter-spacing: .06em !important;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* ---------- Action buttons: 15px / 600, min-height 48px ---------- */
  a.button, button.button, .button, a.btn, button.btn, .booking-button, .premium-button,
  form button[type="submit"], form button:not([type]), #submitBtn {
    font-size: 15px !important;
    font-weight: 600 !important;
    min-height: 48px !important;
    line-height: 1.25 !important;
    letter-spacing: .04em !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    box-sizing: border-box;
  }
  a.btn span, a.button span { font-size: inherit !important; }
  /* Full width inside offer / form cards */
  .offer .btn, .offer .button, .offers .button, .cards .card .button, .card-body .btn, .panel .btn,
  form .button, form button[type="submit"], form button:not([type]), .form-card .button, .bundle .btn,
  .after-booking .button, .free-actions .button {
    width: 100% !important;
  }
  /* Hero/closing button groups stack cleanly */
  .hero-actions { display: grid !important; grid-template-columns: 1fr; gap: 10px !important; }
  .hero-actions .button { width: 100% !important; }

  /* Exceptions stay link-like: nav, footer, menu toggles, accordions, skip links */
  nav a.button, .nav-cta, .cmbz-footer a, summary, .cmbz-menu-toggle, .menu-toggle, .skip-link {
    width: auto !important;
  }
  .nav-cta { font-size: 13px !important; min-height: 44px; display: inline-flex; align-items: center; }
  .menu-toggle, .cmbz-menu-toggle { min-height: 44px; }

  /* ---------- Footer: same design, readable ---------- */
  .cmbz-footer-bottom span, .cmbz-footer-bottom a, footer.wrap.micro span { font-size: 13px !important; }

  /* ---------- Forms ---------- */
  input[type="text"], input[type="email"], input:not([type]), select, textarea {
    font-size: 16px !important; /* also stops iOS zoom-on-focus */
    min-height: 48px;
  }

  /* ---------- Overflow safety (content images only; hero/cover images keep their sizing) ---------- */
  table { width: 100%; }

  /* ---------- AI / creator pages and travel card hub (Oct 20 audit) ---------- */
  /* Body copy that rendered at 13-15px. */
  .ai-more, .rs-more, .rs-by, .rs-when, .wb-when, .ty-when, .co-seats, .co-call, .co-also, .co-session,
  #guarantee .cos-include p,
  .ccard-top dl.facts dd, .ccard-top .earn-lead, .ccard details > ul > li, .ccard details > p, p.disclose {
    font-size: 16px !important;
    line-height: 1.55 !important;
  }
  .ai-more a, .rs-more a, .rs-by strong, .wb-when span, .ty-when span, .co-seats span, .co-call a, .co-also a { font-size: inherit !important; }
  /* Small print / pills: 13px floor. */
  .rs-meta span, .rs-meta .rs-live { font-size: 13px !important; }
  /* Countdown unit labels ("Days", "Hrs"): 12px label floor. */
  .rs-count small, .wb-count small { font-size: 13px !important; }
  .co-digits span { font-size: 12px !important; }
  /* Workshop "before" list labels and credit card hub details. */
  .cos-days li > span { font-size: 16px !important; letter-spacing: .02em !important; }
  .ccard .pc ul > li, div.pc > div > ul > li { font-size: 16px !important; line-height: 1.5 !important; }
  .ccard h4 { font-size: 16px !important; letter-spacing: .06em !important; }
}