/* ============================================================
   Softlogs shared MOBILE polish — loaded on every page after nav.css.
   Scope: <=880px. Goal: comfortable tap targets + legible micro-labels
   on phones, with zero visual drift on desktop.
   ============================================================ */
@media (max-width:880px){
  /* ---- Tap targets: expand hit areas without layout drift ---- */
  .form-grid{grid-template-columns:1fr}
  .nav-logo{padding:.6rem 0;margin:-.6rem 0}
  .nav-toggle{position:relative}
  .nav-toggle::after{content:'';position:absolute;inset:-7px}
  .cap-mark{padding:.55rem .5rem;margin:-.55rem -.5rem}
  .cap-mark img{max-width:none}
  .cap-cta{padding:.55rem 0;margin:-.55rem 0;margin-left:auto}
  .modal-close::after,#modalClose::after{content:'';position:absolute;inset:-9px}
  .modal-close,#modalClose{padding:7px;margin:-7px}

  .footer-col ul{gap:.15rem}
  .footer-col a{display:inline-block;padding:.5rem 0}
  .footer-bottom-links{gap:1.1rem}
  .footer-bottom-links a{display:inline-block;padding:.5rem 0;margin:-.5rem 0}

  .program-link,.work-foot-link,.ins-hub-link a,.closing-sub a,.amex-more,
  .ind-cta-link,.back-link,.lf-hint a,.legal-body a,.legal-wrap a,
  .cd-meta a,.ia-meta a,.csx-proj-link,.contact-info-block a,.info-card a,
  .work-head a,.breadcrumb a,.csx-crumb a,.review-card>a{padding:.45rem 0;margin:-.45rem 0}

  /* iOS: prevent focus auto-zoom (inputs must be >=16px to avoid it) */
  .input,.select,.textarea,input[type="text"],input[type="email"],input[type="tel"],
  input[type="url"],input[type="date"],input[type="number"],select,textarea{font-size:16px}

  .csx-chip,.ins-chip{min-height:38px;padding-top:.55rem;padding-bottom:.55rem}
  .ind-cta-link{padding-top:.55rem;padding-bottom:.55rem}
  .service-nav-item{padding-top:.75rem;padding-bottom:.75rem}
  .tab-btn{padding-top:1.1rem;padding-bottom:1.1rem}

  /* ---- Mobile menu: comfortable tap rows + bottom breathing room ---- */
  .mobile-menu{padding-top:calc(var(--nav-h) + 2rem);padding-bottom:5rem}
  .mobile-menu a{padding-top:.6rem;padding-bottom:.6rem}

  /* ---- Legibility: raise micro-label floors on small screens ---- */
  .scene-label,.scene-counter{font-size:.7rem}
  .cal-day-name{font-size:.72rem}
  .csx-badge,.proj-tags,.plan-badge{font-size:.66rem}
  .hero-visual-meta{font-size:.68rem}
}
