/* ══════════════════════════════════════════════════
   TMI Cost Estimator — Mobile Overrides
   Minimum: 375px (iPhone SE)
══════════════════════════════════════════════════ */

@media (max-width: 767px) {

  #tmi-estimator {
    padding: 16px 12px;
  }

  /* Progress — compress pills */
  .tmi-progress {
    justify-content: flex-start;
    gap: 4px;
    padding-left: 4px;
    padding-right: 4px;
  }
  .tmi-pill-label { display: none; }
  .tmi-pill-num { width: 28px; height: 28px; font-size: 13px; }
  .tmi-progress-sep { width: 12px; }

  /* Service cards: 2 columns */
  #tmi-service-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .tmi-service-card {
    padding: 12px 8px;
  }
  .tmi-card-icon { width: 32px; height: 32px; }
  .tmi-card-label { font-size: 12px; }
  .tmi-card-desc  { display: none; }

  /* Button groups: wrap more aggressively */
  .tmi-btn-group {
    gap: 6px;
  }
  .tmi-btn-option {
    padding: 10px 12px;
    font-size: 13px;
    flex: 1 1 calc(50% - 6px);
    min-height: 44px;
  }

  /* Sliders: full width */
  .tmi-slider-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .tmi-slider {
    width: 100%;
    min-width: unset;
    height: 10px; /* fatter for fat-finger accuracy */
  }
  .tmi-slider::-webkit-slider-thumb { width: 28px; height: 28px; }
  .tmi-slider::-moz-range-thumb     { width: 28px; height: 28px; }

  .tmi-slider-num {
    width: 100%;
  }

  /* Number inputs: full width */
  .tmi-number-input { width: 100%; }

  /* Form: 2-col collapses to 1 */
  .tmi-form-row.tmi-row-2col {
    grid-template-columns: 1fr;
  }

  /* All inputs: 16px font to prevent iOS zoom */
  .tmi-form-input,
  .tmi-slider-num,
  .tmi-number-input,
  .tmi-select,
  .tmi-btn-option {
    font-size: 16px;
  }

  /* CTA button: full width, taller touch target */
  .tmi-btn-cta { min-height: 56px; font-size: 16px; }

  /* Nav row: stack if needed */
  .tmi-nav-row { gap: 8px; }
  .tmi-btn-nav { padding: 12px 16px; font-size: 14px; }
  .tmi-btn-nav.tmi-btn-next { flex: 1; }

  /* Results price: smaller on tiny screens */
  #tmi-blurred-price { font-size: 24px; }

  /* Thank you estimate block */
  .tmi-ty-estimate { min-width: unset; width: 100%; }
  .tmi-ty-estimate-range { font-size: 24px; }

  /* Action buttons: stack */
  .tmi-ty-actions { flex-direction: column; }
  .tmi-ty-actions .tmi-btn-nav { text-align: center; }

}

@media (max-width: 479px) {
  .tmi-step-header h2 { font-size: 19px; }
  #tmi-service-grid { gap: 6px; }
  .tmi-btn-option { flex: 1 1 100%; }

  .tmi-gate-form { padding: 16px; }
  .tmi-gate-form h3 { font-size: 16px; }
}

/* Tablet: 3-col service grid */
@media (min-width: 480px) and (max-width: 767px) {
  #tmi-service-grid { grid-template-columns: repeat(3, 1fr); }
  .tmi-card-desc { display: none; }
}

/* Ensure touch targets everywhere ≥ 44px */
@media (max-width: 1024px) {
  .tmi-service-card,
  .tmi-btn-option,
  .tmi-btn-nav,
  .tmi-btn-cta,
  .tmi-form-input,
  .tmi-checkbox-wrap {
    min-height: 44px;
  }
}