/* ============================================================
   RESPONSIVE STYLESHEET
   ============================================================ */

@media (max-width: 1180px) {
  .container { padding: 0 30px; }
  .card-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .terminal-grid { grid-template-columns: 1fr; }
  .stat-row { grid-template-columns: repeat(2, 1fr); }
  .stat { border-bottom: 1px solid var(--c-border); }
}

@media (max-width: 960px) {
  .main-nav { position: fixed; top: 0; right: -100%; width: min(340px, 86vw); height: 100vh;
    background: rgba(8,14,20,0.98); flex-direction: column; align-items: flex-start; padding: 110px 30px 30px;
    transition: right var(--transition); overflow-y: auto; }
  .main-nav.is-open { right: 0; }
  .main-nav > ul { flex-direction: column; align-items: flex-start; width: 100%; gap: 0; }
  .main-nav a.nav-link { padding: 16px 4px; width: 100%; }
  .has-dropdown .dropdown { position: static; opacity: 1; visibility: visible; transform: none; border: none;
    box-shadow: none; background: rgba(255,255,255,0.03); display: none; }
  .has-dropdown.is-open .dropdown { display: block; }
  .dropdown li a { color: #E4E8EC; }
  .dropdown li a:hover { background: var(--c-primary); }
  .nav-toggle { display: block; }
  .header-cta { margin: 20px 0 0; }

  .card-grid--3, .card-grid--2 { grid-template-columns: 1fr; }
  .split, .contact-grid { grid-template-columns: 1fr; gap: 40px; }
  .form-row { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 34px; }
}

@media (max-width: 680px) {
  .container { padding: 0 20px; }
  .section { padding: 66px 0; }
  .hero-content { padding-bottom: 70px; }
  .hero-cta-row { flex-direction: column; align-items: flex-start; }
  .card-grid--4, .card-grid--2 { grid-template-columns: 1fr; }
  .stat-row { grid-template-columns: 1fr; }
  .stat { border-right: none; border-bottom: 1px solid var(--c-border); }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; padding-bottom: 40px; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .weather-grid { grid-template-columns: repeat(2, 1fr); }
  .terminal-body { padding: 26px 18px; }
  .terminal-kv { grid-template-columns: 1fr; }
  .page-header { padding: 150px 0 50px; }
  .vessel-search { flex-direction: column; }
  .scroll-indicator { display: none; }
}