/* =============================================
   Plataforma AP — Responsive
   Mobile-first breakpoints
   ============================================= */

/* ── Tablet (< 768px) ── */
@media (max-width: 768px) {
  .cob-grid { grid-template-columns: 1fr 1fr; }
  .resumen-grid { grid-template-columns: 1fr 1fr; }
  .stat-row { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .db-controls { flex-direction: column; align-items: stretch; }
  .db-controls .spacer { display: none; }
  .month-select { width: 100%; }
  .db-top { flex-direction: column; align-items: flex-start; }
  .cant-panel-step2 { flex-direction: column; align-items: flex-start; }
  .cert-top { flex-direction: column; align-items: flex-start; }
  .hero h1 { font-size: 22px; }
}
@media (max-width: 720px) {
  .person-row {
    flex-wrap: wrap;
  }
  .person-num-badge {
    order: 1;
  }
  .person-icon-btn--remove {
    order: 2;
    margin-left: auto;
  }
  .person-input--nombre {
    order: 3;
    flex: 1 1 100%;
  }
  .person-input--fecha {
    order: 4;
    flex: 1 1 100%;
  }
  .person-input--dni {
    order: 5;
    flex: 1 1 calc(100% - 44px);
  }
  .person-icon-btn--search {
    order: 6;
  }
  .person-row-errors {
    padding-left: 0;
  }
  
}


/* ── Mobile (< 480px) ── */
@media (max-width: 480px) {
  .cob-grid { grid-template-columns: 1fr; }
  .resumen-grid { grid-template-columns: 1fr; }
  .stat-row { grid-template-columns: 1fr; }
  .section { padding: 1rem; }
  .db-wrap { padding: 1rem; }
  .form-box { padding: 1rem; }
  .login-card { padding: 1.5rem 1.25rem; }
  .btn-row { flex-direction: column; align-items: stretch; }
  .btn-row .btn-next,
  .btn-row .btn-back { justify-content: center; }
  .nav { padding: 0 1rem; }
  .nav-tabs { padding: .5rem 1rem; }
  .cert-wrap { padding: 1rem; }
  .cert-tables { padding: 0 .75rem 1rem; }
  .berkley-logo-wrap { padding: 1rem; }
  .cert-title-area { padding: 1rem 1rem .5rem; }
  .tarifa-row { flex-direction: column; gap: .25rem; }
  .tarifa-val { text-align: left; }
  .modal-box { padding: 1.25rem; }
  .logo-text { display: none; }
  .nav-user-btn span { display: none; }
}

.form-row-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

@media (max-width: 768px) {
  .form-row-3 {
    grid-template-columns: 1fr;
  }
}