/* =========================================================
   S-AES LAB — RESPONSIVE STYLESHEET
   Breakpoints: Desktop (>1200px) / Laptop (992-1199px) /
                Tablet (768-991px) / Mobile (<767px)
   ========================================================= */

/* ---------- Laptop ---------- */
@media (max-width: 1199.98px) {
  .hero-title { font-size: clamp(1.9rem, 3.6vw, 2.6rem); }
  .glass-card { padding: 1.75rem; }
}

/* ---------- Tablet ---------- */
@media (max-width: 991.98px) {
  .hero-section { padding: 3.5rem 0 2.5rem; text-align: center; }
  .hero-actions, .hero-stats { justify-content: center; }
  .hero-desc { margin-left: auto; margin-right: auto; }
  .hero-illustration { margin-top: 1rem; max-width: 380px; margin-left: auto; margin-right: auto; }

  .section { padding: 3.25rem 0; }
  .section-heading { margin-left: auto; margin-right: auto; }

  .const-matrix { justify-content: center; }
  .state-matrix-wrapper { justify-content: center; }
}

/* ---------- Mobile ---------- */
@media (max-width: 767.98px) {
  .glass-card { padding: 1.35rem; border-radius: 16px; }
  .hero-stats { gap: 1.4rem; }
  .stat-num { font-size: 1.25rem; }

  .btn-hero-primary, .btn-hero-ghost { width: 100%; justify-content: center; }
  .hero-actions { flex-direction: column; }

  .saes-mode-tabs .nav-link { font-size: 0.85rem; padding: 0.5rem; }

  .result-row { flex-wrap: wrap; }
  .result-value { font-size: 0.92rem; }

  .state-matrix { grid-template-columns: repeat(2, 46px); grid-template-rows: repeat(2, 46px); }
  .nibble-cell { font-size: 1rem; border-radius: 10px; }

  .ref-table th, .ref-table td { font-size: 0.78rem; padding: 0.4rem 0.25rem; }
  .const-matrix .matcell { width: 46px; height: 46px; font-size: 1rem; }

  .navbar-nav { padding-top: 0.5rem; }
  .saes-navbar .nav-link { padding: 0.6rem 0.4rem; }

  .footer-note { text-align: left !important; margin-top: 1rem; }
}

/* ---------- Small mobile ---------- */
@media (max-width: 420px) {
  .hero-title { font-size: 1.7rem; }
  .eyebrow { font-size: 0.72rem; }
  .bit-counter { display: none; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}
