/* LeadsLean V6 — mobile compatibility and readability.
   Loaded after markers-v5.css. No desktop behavior changes above 900px. */

html body.visual-review-approved * {
  min-width: 0;
}

/* Prevent accidental horizontal page growth from long labels / flex items. */
html,
html body.visual-review-approved {
  max-width: 100%;
  overflow-x: clip;
}

/* Wide phones / landscape phones / small tablets:
   never leave Build / Repair / Diagnose in an orphaned 2+1 composition. */
@media (max-width: 900px) {
  html body.page-home.visual-review-approved .grid-3,
  html body.page-sprint.visual-review-approved .grid-3 {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  html body.page-home.visual-review-approved .grid-3 > :nth-child(3),
  html body.page-sprint.visual-review-approved .grid-3 > :nth-child(3) {
    grid-column: auto !important;
  }

  html body.visual-review-approved .hero .hero-actions {
    gap: 10px !important;
  }
}

/* Small-tablet / large-phone readability. */
@media (max-width: 820px) {
  html body.visual-review-approved .grid-2,
  html body.visual-review-approved .topic-grid,
  html body.visual-review-approved .article-grid,
  html body.visual-review-approved .principle-grid {
    grid-template-columns: 1fr !important;
  }

  html body.visual-review-approved .split {
    gap: 22px !important;
  }
}

/* Phone portrait. */
@media (max-width: 700px) {
  :root {
    --ll-wide-gutter: 14px;
  }

  html body.visual-review-approved .header-row {
    min-height: 66px !important;
  }

  html body.visual-review-approved .menu-button {
    min-width: 46px;
    min-height: 46px;
    justify-content: center;
    align-items: center;
    font-weight: 700;
  }

  html body.visual-review-approved .nav.is-open a {
    min-height: 46px;
    display: flex;
    align-items: center;
  }

  html body.visual-review-approved .hero {
    padding-top: 34px !important;
    padding-bottom: 30px !important;
  }

  html body.visual-review-approved .hero h1 {
    font-size: clamp(2.2rem, 9vw, 2.8rem) !important;
    line-height: 1.015 !important;
    letter-spacing: -.04em !important;
    text-wrap: pretty !important;
  }

  html body.visual-review-approved h2 {
    font-size: clamp(1.72rem, 7.3vw, 2.2rem) !important;
    line-height: 1.07 !important;
    letter-spacing: -.035em !important;
  }

  html body.visual-review-approved h3 {
    line-height: 1.16;
  }

  html body.visual-review-approved .hero .lede,
  html body.visual-review-approved .lede,
  html body.visual-review-approved .prose {
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }

  html body.visual-review-approved main > .section {
    padding-top: 30px !important;
    padding-bottom: 32px !important;
  }

  /* Build / Repair / Diagnose: compact mobile decision cards. */
  html body.page-home.visual-review-approved .grid-3 .card,
  html body.page-sprint.visual-review-approved .grid-3 .card {
    min-height: 0 !important;
    padding: 18px 18px 19px 20px !important;
    border: 1px solid rgba(11,31,51,.10) !important;
    border-left: 4px solid #146C43 !important;
    border-radius: 13px !important;
    background: #FFFFFF !important;
  }

  html body.page-home.visual-review-approved .grid-3 .card::after,
  html body.page-sprint.visual-review-approved .grid-3 .card::after {
    display: none !important;
    content: none !important;
  }

  html body.page-home.visual-review-approved .grid-3 .card-label,
  html body.page-sprint.visual-review-approved .grid-3 .card-label {
    margin-bottom: .48rem !important;
    font-size: .76rem !important;
    letter-spacing: .075em !important;
  }

  html body.page-home.visual-review-approved .grid-3 .card h3,
  html body.page-sprint.visual-review-approved .grid-3 .card h3 {
    font-size: 1.18rem !important;
    line-height: 1.22 !important;
    margin: 0 !important;
  }

  html body.page-home.visual-review-approved .grid-3 .card p,
  html body.page-sprint.visual-review-approved .grid-3 .card p {
    margin-top: .62rem !important;
    font-size: .96rem !important;
    line-height: 1.5 !important;
  }

  html body.page-home.visual-review-approved .grid-3 .card .text-link,
  html body.page-sprint.visual-review-approved .grid-3 .card .text-link {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin-top: .82rem !important;
    padding-top: .7rem !important;
    border-top: 1px solid rgba(11,31,51,.08);
    font-size: .94rem !important;
  }

  /* Touch-friendly action groups. */
  html body.visual-review-approved .hero .hero-actions,
  html body.visual-review-approved .cta-panel .hero-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 10px !important;
  }

  html body.visual-review-approved .hero .hero-actions .button,
  html body.visual-review-approved .cta-panel .hero-actions .button {
    width: 100% !important;
    min-height: 50px !important;
    padding-inline: 16px !important;
    text-align: center;
    font-size: .95rem !important;
  }

  html body.visual-review-approved .hero-proof {
    font-size: .88rem !important;
    line-height: 1.55 !important;
    text-align: left !important;
    overflow-wrap: break-word;
  }

  /* System / process blocks: tighter, easier to scan. */
  html body.visual-review-approved .system-strip div,
  html body.visual-review-approved .system-strip--7 div {
    min-height: 0 !important;
    grid-template-columns: 38px minmax(0,1fr) !important;
    gap: 10px !important;
    padding: 13px 14px !important;
    border-radius: 12px !important;
  }

  html body.visual-review-approved .system-strip div span,
  html body.visual-review-approved .system-strip--7 div span {
    width: 38px !important;
    font-size: .76rem !important;
  }

  html body.visual-review-approved .system-strip div strong,
  html body.visual-review-approved .system-strip--7 div strong {
    font-size: .94rem !important;
    line-height: 1.28 !important;
  }

  html body.visual-review-approved .flow-item {
    min-height: 0 !important;
    padding: 16px !important;
  }

  html body.visual-review-approved .card,
  html body.visual-review-approved .article-card {
    overflow-wrap: break-word;
  }

  /* Final CTA: prevent two-button squeeze on phones. */
  html body.visual-review-approved .cta-panel {
    padding: 24px 18px !important;
    border-radius: 14px !important;
  }

  html body.visual-review-approved .cta-panel p {
    font-size: 1rem !important;
    line-height: 1.5 !important;
  }
}

/* Smaller phones: footer and system layout simplify further. */
@media (max-width: 560px) {
  html body.visual-review-approved .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }

  html body.visual-review-approved .footer-brand {
    grid-column: auto !important;
  }

  html body.visual-review-approved .site-footer {
    padding-top: 2.3rem !important;
  }

  html body.visual-review-approved .footer-bottom {
    margin-top: 1.8rem !important;
    flex-direction: column !important;
    gap: .55rem !important;
  }
}

/* Very small phones. */
@media (max-width: 380px) {
  html body.visual-review-approved .hero h1 {
    font-size: 2.05rem !important;
  }

  html body.visual-review-approved h2 {
    font-size: 1.65rem !important;
  }

  html body.visual-review-approved .system-strip div,
  html body.visual-review-approved .system-strip--7 div {
    grid-template-columns: 32px minmax(0,1fr) !important;
    padding: 12px !important;
  }

  html body.visual-review-approved .system-strip div span,
  html body.visual-review-approved .system-strip--7 div span {
    width: 32px !important;
  }
}