/* ============================================================
   SHRIMAT — Responsive Rules
   ============================================================ */

/* ----- Large desktop refinement ----- */
@media (min-width: 1400px) {
  .container { max-width: 1320px; }
}

/* ----- Laptop / small desktop ----- */
@media (max-width: 1180px) {
  .portal-grid { grid-template-columns: repeat(2, 1fr); margin-top: 32px; }
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .announce-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .dash-grid-2 { grid-template-columns: 1fr; }
  .nitome-list { grid-template-columns: 1fr; }
}

/* ----- Tablet ----- */
@media (max-width: 960px) {
  .main-nav { display: none; }
  .hamburger { display: flex; }
  .header-actions .btn-outline { display: none; }

  .hero .container { grid-template-columns: 1fr; gap: 36px; }
  .hero-visual { order: -1; max-width: 320px; margin: 0 auto; }
  .hero p.lead { max-width: none; }

  .auth-wrap { grid-template-columns: 1fr; }
  .auth-panel { display: none; }

  .timeline { grid-template-columns: 1fr; gap: 28px; text-align: left; }
  .timeline-step { display: flex; align-items: flex-start; gap: 18px; padding: 0; text-align: left; }
  .timeline-step::before { margin: 0; flex-shrink: 0; }
  .timeline-step::after { display: none; }

  .nitome-section { grid-template-columns: 1fr; padding: 36px 28px; }

  .footer-grid { grid-template-columns: 1fr 1fr; row-gap: 32px; }

  .dash-sidebar {
    position: fixed; left: 0; top: 0; z-index: 300;
    transform: translateX(-100%);
    width: 280px;
  }
  .dash-sidebar.open { transform: translateX(0); box-shadow: var(--shadow-lg); }
  .dash-sidebar-toggle { display: flex; }
  .dash-content { padding: 20px; }
}

/* ----- Mobile (414px and below) ----- */
@media (max-width: 640px) {
  .section { padding: 56px 0; }
  .section-tight { padding: 40px 0; }
  .container { padding: 0 18px; }

  .header-actions .btn { padding: 10px 14px; font-size: 13.5px; }
  .header-actions .btn span.full { display: none; }

  .portal-grid { grid-template-columns: 1fr; margin-top: 28px; }
  .card-grid, .card-grid.cols-3, .card-grid.cols-2 { grid-template-columns: 1fr; }
  .announce-grid { grid-template-columns: 1fr; }
  .stat-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .stat-card { padding: 16px; }
  .stat-card .stat-value { font-size: 22px; }

  .form-row, .form-row-3 { grid-template-columns: 1fr; gap: 0; }
  .reg-section { padding: 22px; }

  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  .dash-topbar { padding: 0 16px; }
  .dash-topbar .page-title p { display: none; }
  .user-chip .name, .user-chip .role { display: none; }

  .table-toolbar { flex-direction: column; align-items: stretch; }
  .table-search { max-width: none; }

  /* Responsive table -> stacked cards */
  .data-table.stack-mobile thead { display: none; }
  .data-table.stack-mobile, .data-table.stack-mobile tbody, .data-table.stack-mobile tr, .data-table.stack-mobile td { display: block; width: 100%; }
  .data-table.stack-mobile { min-width: 0; }
  .data-table.stack-mobile tr { border: 1px solid var(--border-light); border-radius: var(--radius-sm); margin-bottom: 12px; padding: 6px 14px; }
  .data-table.stack-mobile td { border-bottom: 1px solid var(--border-light); padding: 10px 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
  .data-table.stack-mobile td:last-child { border-bottom: none; }
  .data-table.stack-mobile td::before { content: attr(data-label); font-family: var(--font-display); font-weight: 600; font-size: 12px; color: var(--text-secondary); }

  .nitome-panel { padding: 20px; }
}

/* ----- Very small (320px) ----- */
@media (max-width: 360px) {
  .hero h1 { font-size: 30px; }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .btn { padding: 12px 18px; font-size: 14px; }
}

/* Print */
@media print {
  .site-header, .site-footer, .dash-sidebar, .dash-topbar { display: none; }
}
