/* S.E.T. — shared site styles
   Tokens, base typography, and responsive rules used across all pages.
   Page-specific styles live inline near the components that own them. */

:root {
  --navy:    #0B1A2B;
  --navy-2:  #112740;
  --cream:   #F4EFE7;
  --cream-2: #EAE3D3;
  --offwhite:#FAFAF8;
  --blue:    #01C9FF;
  --blue-2:  #1D5BA6;
  --char:    #1F2A38;
  --char-2:  #5A6573;
  --white:   #FFFFFF;
  --line:    #DCD5C5;
  --line-d:  rgba(255,255,255,0.18);
  --heading: "Nunito Sans", "Avenir Next", "Avenir", "Montserrat", system-ui, sans-serif;
  --body:    "Nunito Sans", "Open Sans", system-ui, sans-serif;
  --serif:   "Cormorant Garamond", "Garamond", "Times New Roman", serif;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 100px; }
body {
  font-family: var(--body);
  color: var(--char);
  background: var(--offwhite);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-size: 16px;
  line-height: 1.55;
}
a { color: inherit; text-decoration: none; }
::selection { background: var(--blue); color: var(--navy); }
h1, h2, h3, h4 {
  font-family: var(--heading);
  font-weight: 900;
  color: var(--navy);
  margin: 0;
  letter-spacing: -0.01em;
}

@keyframes setPulse {
  0%   { box-shadow: 0 0 0 0 rgba(1,201,255,0.55); }
  70%  { box-shadow: 0 0 0 14px rgba(1,201,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(1,201,255,0); }
}

/* ======================================================================
   HEADER / NAV
   ====================================================================== */
.set-nav {
  display: flex;
  gap: clamp(14px, 2vw, 36px);
  flex-wrap: nowrap;
  align-items: center;
}
.set-nav a { white-space: nowrap; }
.set-cta { white-space: nowrap; flex-shrink: 0; }
.set-burger { display: none; }
.set-mobile-cta-short { display: none; }

@media (max-width: 1180px) {
  .set-nav .opt-hide { display: none; }
}
@media (max-width: 980px) {
  .set-nav { display: none; }
  .set-burger { display: inline-flex; }
}
@media (max-width: 520px) {
  .set-cta-full { display: none; }
  .set-mobile-cta-short { display: inline-flex; }
}

/* ======================================================================
   SECTION / GRID — responsive (homepage + marine + contact + faq)
   ====================================================================== */
@media (max-width: 980px) {
  .set-container { padding-left: 24px !important; padding-right: 24px !important; }
  .set-section-pad { padding-top: 72px !important; padding-bottom: 72px !important; }
  .set-hero-pad { padding-top: 80px !important; padding-bottom: 90px !important; }

  .set-intro-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .set-grid-3,
  .set-grid-4 { grid-template-columns: 1fr 1fr !important; }
  .set-stats-row { grid-template-columns: 1fr 1fr !important; gap: 28px 0 !important; }
  .set-stats-row > * {
    border-left: none !important;
    padding-left: 0 !important;
    padding-right: 16px !important;
  }
  .set-cards-3 { grid-template-columns: 1fr !important; }
  .set-cards-2 { grid-template-columns: 1fr !important; }
  .set-featured-2col { grid-template-columns: 1fr !important; }
  .set-featured-2col .set-featured-body { padding: 32px 28px 32px !important; }
  .set-cta-band { grid-template-columns: 1fr !important; gap: 28px !important; padding: 36px 28px !important; }
  .set-closing-cta { grid-template-columns: 1fr !important; gap: 28px !important; }
  .set-closing-cta > div:last-child { justify-self: start !important; }
  .set-contact-grid { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }
  .set-footer-grid { grid-template-columns: 1fr 1fr !important; gap: 36px !important; }
  .set-footer-brand { grid-column: 1 / -1; }
  .set-prog-row { grid-template-columns: 1fr !important; gap: 16px !important; }
  .set-prog-stats { grid-template-columns: 1fr 1fr !important; }
  .set-outcomes-grid { grid-template-columns: 1fr 1fr !important; }
  .set-news-article { grid-template-columns: 1fr !important; gap: 18px !important; }
  .set-news-detail-grid { grid-template-columns: 1fr 1fr !important; gap: 0 !important; }
  .set-hero-grid { grid-template-columns: 1fr !important; gap: 36px !important; padding-left: 24px !important; padding-right: 24px !important; }

  /* Marine-ev */
  .set-platform-head { grid-template-columns: 1fr !important; gap: 24px !important; margin-bottom: 40px !important; }
  .set-vessel-detail { grid-template-columns: 1fr !important; gap: 28px !important; padding: 56px 0 !important; }
  .set-vessel-detail > * { order: 0 !important; }
  .set-vessel-mission { grid-template-columns: 1fr !important; gap: 18px !important; padding: 36px 28px !important; }
  .set-experience-row {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
    padding: 18px 0 !important;
  }
  .set-experience-row > div:nth-child(1) {
    font-size: 13px !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--char-2) !important;
    font-weight: 700 !important;
    margin-bottom: 4px !important;
  }
  .set-experience-head { display: none !important; }
  .set-charge-grid { grid-template-columns: 1fr !important; }
  .set-charge-grid > div { border-left: none !important; border-top: 1px solid var(--line-d); }
  .set-charge-grid > div:first-child { border-top: none; }
  .set-charge-foot { grid-template-columns: 1fr !important; gap: 24px !important; }

  /* Specs table → stacked rows on mobile */
  .set-specs-table {
    display: block !important;
    width: 100% !important;
  }
  .set-specs-table thead { display: none !important; }
  .set-specs-table tbody,
  .set-specs-table tr { display: block !important; width: 100% !important; }
  .set-specs-table tr {
    border-bottom: 1px solid var(--line) !important;
    padding: 14px 0 !important;
  }
  .set-specs-table td {
    display: block !important;
    width: 100% !important;
    padding: 4px 0 !important;
    border: none !important;
    text-align: left !important;
  }
  .set-specs-table td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--char-2);
    font-weight: 700;
    margin-bottom: 2px;
  }
}

@media (max-width: 600px) {
  .set-grid-3,
  .set-grid-4,
  .set-outcomes-grid,
  .set-cards-3,
  .set-cards-2,
  .set-news-detail-grid,
  .set-contact-grid { grid-template-columns: 1fr !important; }
  .set-stats-row { grid-template-columns: 1fr !important; gap: 24px 0 !important; }
  .set-prog-stats { grid-template-columns: 1fr 1fr !important; }
  .set-footer-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
}

@media (max-width: 420px) {
  .set-container { padding-left: 18px !important; padding-right: 18px !important; }
}

/* Mobile: make any wide selector card / vessel-thumb stack become 1-col */
@media (max-width: 720px) {
  .set-vessel-selector-grid { grid-template-columns: 1fr !important; }
  .set-vessel-selector-grid img,
  .set-vessel-selector-grid video { aspect-ratio: 16/9 !important; }
  .set-alloc-grid { grid-template-columns: 1fr !important; }
  .set-alloc-loss { grid-template-columns: 1fr !important; }
}
