/* SFG Hub — shared responsive layer (backup; critical rules also live in page <style>) */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  overflow-x: hidden;
  overscroll-behavior-x: none;
  width: 100%;
  max-width: 100%;
  touch-action: pan-y;
}

body {
  overflow-x: hidden;
  overscroll-behavior-x: none;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  touch-action: pan-y;
}

img, svg, video {
  max-width: 100%;
  height: auto;
}

.site-shell {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

.site-header {
  width: 100%;
  max-width: 100%;
  display: flex !important;
  flex-direction: column !important;
}

.site-header-top {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  width: 100%;
  min-width: 0;
}

.site-brand { border-right: none !important; }
.site-ext { margin-left: 0 !important; min-width: 0; }

.site-nav {
  display: flex !important;
  width: 100%;
  border-top: 1px solid #232326;
  min-width: 0;
}

.site-nav a {
  flex: 1 1 0;
  justify-content: center !important;
  min-width: 0;
}

.board-row { min-width: 0; }

.exec-scroll {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}

.exec-head,
.exec-row { min-width: 0; }

.script-head { min-width: 0; }

.domain-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 100%;
}

@media (max-width: 900px) {
  .board-row {
    grid-template-columns: 34px minmax(0, 1fr) minmax(40px, 80px) 56px !important;
    gap: 10px !important;
  }
  .elsewhere-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 720px) {
  .site-ext a {
    padding: 0 12px !important;
    font-size: 0 !important;
    gap: 0 !important;
  }
  .site-ext a svg,
  .site-ext a img { width: 18px; height: 18px; }

  .hero-title { font-size: clamp(42px, 14vw, 72px) !important; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

  .board-row {
    grid-template-columns: 28px minmax(0, 1fr) 52px !important;
    gap: 8px !important;
  }
  .board-row > :nth-child(3) { display: none !important; }

  .script-head .live-pill { margin-left: 0 !important; }
  .feature-cols { columns: 1 !important; padding: 16px !important; }

  .exec-head { display: none !important; }
  .exec-row {
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "icon name link"
      "platform platform platform"
      "sunc sunc sunc"
      "unc unc unc" !important;
    gap: 8px 12px !important;
    padding: 14px !important;
  }
  .exec-row > :nth-child(1) { grid-area: icon; }
  .exec-row > :nth-child(2) { grid-area: name; }
  .exec-row > :nth-child(3) { grid-area: platform; padding-left: 52px; }
  .exec-row > :nth-child(4) { grid-area: sunc; }
  .exec-row > :nth-child(5) { grid-area: unc; }
  .exec-row > :nth-child(6) { grid-area: link; text-align: right !important; }
  .exec-row > :nth-child(4)::before,
  .exec-row > :nth-child(5)::before {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 10px;
    color: #55534d;
    margin-right: 8px;
  }
  .exec-row > :nth-child(4)::before { content: "sUNC"; }
  .exec-row > :nth-child(5)::before { content: "UNC"; }
}

@media (max-width: 420px) {
  .site-brand { padding: 0 14px !important; font-size: 15px !important; }
  .cta-row a { width: 100%; text-align: center; }
}
