/* ============================================================
   AURORA — Responsive System
   Breakpoints: 480 / 768 / 1024 / 1280 / 1536
   ============================================================ */

/* ---- MOBILE SMALL (< 480px) ---- */
@media (max-width: 479px) {
  :root { --container-gutter: 16px; }

  .nav__pill {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-inline: 14px !important;
  }
  .nav__brand { font-size: 22px !important; }
  .footer__brand .brand-font,
  .footer__brand a.brand-font { font-size: 22px !important; }

  .nav__links { display: none !important; }
  .nav__actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    gap: 4px !important;
  }
  .nav__actions .btn--primary { display: none !important; }
  .nav__hamburger { display: flex !important; }

  /* Mobile menu: full-width, tight */
  .nav__mobile-menu {
    left: 8px !important;
    right: 8px !important;
    padding: var(--space-sm) var(--space-md) !important;
    gap: 4px !important;
  }
  .nav__mobile-menu .nav__link {
    padding: 10px 12px !important;
    font-size: var(--text-body-md) !important;
  }

  .contact-form .form-row { grid-template-columns: 1fr !important; }
  .contact-form textarea { min-height: 100px !important; }
  .contact-form input, .contact-form select, .contact-form textarea {
    font-size: 16px !important;
  }

  .hero {
    padding: var(--space-section) var(--container-gutter);
    min-height: 100dvh;
    min-height: 100svh;
    align-items: flex-start;
    padding-top: calc(72px + var(--space-section));
  }
  .hero__content { text-align: left; }
  .hero__title { font-size: clamp(28px, 8vw, 40px) !important; }
  .hero__subtitle { font-size: var(--text-body-md) !important; }
  .hero__actions { flex-direction: column; align-items: stretch; width: 100%; gap: 8px; }
  .hero__actions .btn { width: 100%; }
  .hero__scroll { display: none; }

  .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
  .grid--auto { grid-template-columns: 1fr; }

  .section { padding-block: var(--space-xl); }
  .section--loose { padding-block: var(--space-section); }
  .section--tight { padding-block: var(--space-lg); }

  .section__title { font-size: var(--text-h4) !important; }
  .section__subtitle { font-size: var(--text-body-sm) !important; }
  .section__desc { font-size: var(--text-body-sm) !important; }

  .card, .card--feature { padding: var(--space-md); }
  .card--feature { padding: var(--space-lg); }

  .footer__top { flex-direction: column; gap: var(--space-md); }
  .footer__links { flex-wrap: wrap; gap: var(--space-sm); }
  .footer__link { font-size: var(--text-body-sm); }
  .footer__bottom { gap: 4px; }

  .cta-banner { padding: var(--space-xl) var(--space-md); }
  .cta-banner h2 { font-size: var(--text-h4) !important; }
  .cta-banner p { font-size: var(--text-body-sm) !important; }

  .timeline__item { flex-wrap: wrap; }

  /* Buttons: full-width on mobile */
  .btn--lg { width: 100%; text-align: center; }
  .btn--block { width: 100%; }

  /* Explore cards compact */
  .explore-card { padding: var(--space-md) !important; }
  .explore-card h3 { font-size: var(--text-h4) !important; }
  .explore-card p { font-size: var(--text-body-sm) !important; }

  /* ROS domain grid: single column */
  .ros-domain-grid { grid-template-columns: 1fr !important; gap: var(--space-sm) !important; }
  .ros-domain-card { padding: var(--space-md) !important; }

  /* Brief preview compact */
  .ros-brief-preview { padding: var(--space-md) !important; font-size: var(--text-body-sm) !important; max-height: 300px !important; }

  /* Confirmation compact */
  .ros-confirmation { padding: var(--space-md) !important; }
}

/* ---- MOBILE LARGE (480 – 767px) ---- */
@media (min-width: 480px) and (max-width: 767px) {
  :root { --container-gutter: 20px; }

  .nav__pill {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-inline: 18px !important;
  }
  .nav__brand { font-size: 24px !important; }
  .footer__brand .brand-font,
  .footer__brand a.brand-font { font-size: 24px !important; }

  .nav__links { display: none !important; }
  .nav__actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    gap: 6px !important;
  }
  .nav__actions .btn--primary { display: none !important; }
  .nav__hamburger { display: flex !important; }

  /* Mobile menu: tight */
  .nav__mobile-menu {
    left: 12px !important;
    right: 12px !important;
    padding: var(--space-sm) var(--space-md) !important;
    gap: 4px !important;
  }
  .nav__mobile-menu .nav__link {
    padding: 10px 14px !important;
    font-size: var(--text-body-md) !important;
  }

  .contact-form .form-row { grid-template-columns: 1fr !important; }
  .contact-form input, .contact-form select, .contact-form textarea {
    font-size: 16px !important;
  }

  .hero { padding: var(--space-section) var(--container-gutter); }
  .hero__title { font-size: clamp(32px, 7vw, 48px) !important; }
  .hero__subtitle { font-size: var(--text-body-md) !important; }
  .hero__actions { flex-direction: column; align-items: stretch; width: 100%; gap: 10px; }
  .hero__actions .btn { width: 100%; }

  .grid--2 { grid-template-columns: 1fr; }
  .grid--3, .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .grid--auto { grid-template-columns: 1fr; }
  .grid--auto-lg { grid-template-columns: 1fr; }

  .section { padding-block: var(--space-xl); }
  .section--tight { padding-block: var(--space-lg); }

  .section__title { font-size: var(--text-h3) !important; }
  .section__subtitle { font-size: var(--text-body-sm) !important; }

  .card, .card--feature { padding: var(--space-lg); }

  .footer__top { flex-direction: column; gap: var(--space-lg); }
  .footer__links { flex-wrap: wrap; gap: var(--space-md); }

  .cta-banner { padding: var(--space-xl) var(--space-lg); }

  /* Buttons: full-width on mobile */
  .btn--lg { width: 100%; text-align: center; }

  /* ROS domain grid: 2 columns on larger phones */
  .ros-domain-grid { grid-template-columns: repeat(2, 1fr) !important; gap: var(--space-sm) !important; }

  /* Brief preview compact */
  .ros-brief-preview { padding: var(--space-lg) !important; max-height: 350px !important; }
}

/* ---- TABLET (768 – 1023px) ---- */
@media (min-width: 768px) and (max-width: 1023px) {
  :root { --container-gutter: 24px; }

  .nav__pill {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-inline: 20px !important;
  }
  .nav__links { display: none !important; }
  .nav__actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    gap: 8px !important;
  }
  .nav__hamburger { display: flex !important; }

  .grid--3, .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .grid--auto { grid-template-columns: repeat(2, 1fr); }
  .grid--auto-lg { grid-template-columns: repeat(2, 1fr); }

  .footer__top { flex-wrap: wrap; gap: var(--space-xxl); }

  .section__title { font-size: var(--text-h3) !important; }

  /* ROS domain grid: 2 columns on tablet */
  .ros-domain-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* WMMS score grid: 2 columns on tablet */
  .wmms-score-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ---- DESKTOP (1024 – 1279px) ---- */
@media (min-width: 1024px) {
  .nav__hamburger { display: none; }
  .nav__mobile-menu { display: none !important; }
  .nav__mobile-backdrop { display: none !important; }
  body.mobile-menu-open { overflow: auto !important; }

  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .grid--4 { grid-template-columns: repeat(4, 1fr); }
  .grid--auto { grid-template-columns: repeat(3, 1fr); }
  .grid--auto-lg { grid-template-columns: repeat(3, 1fr); }
}

/* ---- WIDE DESKTOP (≥ 1280px) ---- */
@media (min-width: 1280px) {
  :root { --container-gutter: 32px; }
  .grid--auto { grid-template-columns: repeat(4, 1fr); }
  .grid--auto-lg { grid-template-columns: repeat(3, 1fr); }
}

/* ---- ULTRAWIDE (≥ 1536px) ---- */
@media (min-width: 1536px) {
  :root { --container-gutter: 40px; }
}

/* ---- ORIENTATION ---- */
@media (max-width: 1023px) and (orientation: landscape) {
  .hero { min-height: 100dvh; align-items: center; padding-block: var(--space-section); }
  .hero__scroll { display: none; }
}

/* ---- PRINT ---- */
@media print {
  .nav, .hero__scroll, .theme-toggle { display: none; }
  .hero { min-height: auto; padding: var(--space-xxl); }
  .card { box-shadow: none; border: 1px solid #ccc; backdrop-filter: none; }
  * { color: black !important; background: white !important; }
}
