/* ─────────────────────────────────────────────────────────
   TASG · "Apex" design system — shared across all pages.
   Warm cream off-white on near-black, confident all-sans Inter
   display, oversized stat numerals, saturated brand-blue
   color-block sections, blue-rectangle media placeholders.

   Layout: the page is FLUID full-width so colored section
   backgrounds run edge-to-edge across the viewport, while
   content stays in a centered max-1440 column. A min-width
   keeps the fixed desktop composition intact below 1440.
   ───────────────────────────────────────────────────────── */

:root {
  --apx-ink: #f4f1ea;
  --apx-mute: rgba(244, 241, 234, .58);
  --apx-mute-2: rgba(244, 241, 234, .36);
  --apx-bg: #0a0a0c;
  --apx-bg-2: #0f0f12;
  --apx-line: rgba(244, 241, 234, .10);
  --apx-line-strong: rgba(244, 241, 234, .18);
  --apx-blue: #2e8cff;
  --apx-blue-deep: #1c6fe0;
  --apx-sky: #80c8f0;
  --apx-paper: #ece7da;
  --apx-paper-ink: #15161a;
  --apx-paper-mute: rgba(21, 22, 26, .62);
  --apx-paper-line: rgba(21, 22, 26, .16);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }
html, body { margin: 0; padding: 0; background: var(--apx-bg); }

.apx-page {
  width: 100%;
  min-width: 1440px;        /* preserve the fixed desktop composition */
  background: var(--apx-bg);
  color: var(--apx-ink);
  font-family: 'Inter', 'Inter Tight', system-ui, sans-serif;
  line-height: 1.5;
  font-feature-settings: "ss01", "cv11";
  overflow-x: hidden;
}

h1, h2, h3, p { margin: 0; }

/* containers — centered content column inside the full-width page */
.apx-cont { max-width: 1320px; margin: 0 auto; padding: 0 72px; }
.apx-cont-wide { max-width: 1440px; margin: 0 auto; padding: 0 56px; }

/* type */
.apx-display { font-weight: 600; letter-spacing: -0.045em; line-height: 0.98; }
.apx-display-md { font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; }
.apx-mono {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-weight: 500; font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
}
.apx-index { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px; color: var(--apx-mute-2); letter-spacing: 0.08em; }

/* eyebrow rule with blue dot */
.apx-rule {
  display: flex; align-items: center; gap: 14px; color: var(--apx-mute);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
}
.apx-rule::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%;
  background: var(--apx-blue); box-shadow: 0 0 0 4px rgba(46, 140, 255, .18);
}
.apx-rule.paper { color: var(--apx-paper-mute); }
.apx-rule.paper::before { background: #15161a; box-shadow: 0 0 0 4px rgba(21, 22, 26, .08); }

/* buttons */
.apx-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 22px; font-size: 14px; font-weight: 500;
  background: var(--apx-blue); color: #fff; border: none; border-radius: 6px;
  cursor: pointer; transition: background .15s, transform .15s;
  font-family: inherit; text-decoration: none;
}
.apx-btn:hover { background: var(--apx-blue-deep); }
.apx-btn.ghost { background: transparent; color: var(--apx-ink); box-shadow: inset 0 0 0 1px var(--apx-line-strong); }
.apx-btn.ghost:hover { background: rgba(244, 241, 234, .05); }
.apx-btn.dark { background: #15161a; color: #fff; }
.apx-btn.dark:hover { background: #000; }
.apx-btn.paper { background: #15161a; color: #ece7da; }
.apx-btn.paper:hover { background: #000; }
.apx-btn.paper-ghost { background: transparent; color: #15161a; box-shadow: inset 0 0 0 1px var(--apx-paper-line); }
.apx-btn.paper-ghost:hover { background: rgba(21, 22, 26, .05); }
.apx-btn.outline-light { background: transparent; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5); color: #fff; }
.apx-btn.outline-light:hover { background: rgba(255, 255, 255, .08); }
.apx-btn.sm { padding: 10px 16px; font-size: 13px; }
.apx-btn .arrow { font-size: 16px; line-height: 1; }

/* nav links + hover dropdowns */
.apx-nav-link { font-size: 13px; color: var(--apx-mute); text-decoration: none; padding: 6px 0; position: relative; }
.apx-nav-link:hover { color: var(--apx-ink); }

.apx-navitem { position: relative; display: flex; align-items: center; }
.apx-nav-trigger { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; cursor: pointer; white-space: nowrap; }
.apx-caret { font-size: 9px; opacity: .55; transition: transform .16s ease; }
.apx-navitem:hover .apx-caret { transform: rotate(180deg); opacity: .9; }
.apx-navmenu {
  position: absolute; top: 100%; left: 0; margin-top: 12px; min-width: 252px;
  background: #0c0c10; border: 1px solid var(--apx-line-strong); border-radius: 12px; padding: 8px;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .16s ease, transform .16s ease;
  box-shadow: 0 40px 80px -28px rgba(0, 0, 0, .8); z-index: 50;
}
.apx-navmenu::before { content: ''; position: absolute; top: -16px; left: 0; right: 0; height: 16px; }
.apx-navitem:hover .apx-navmenu { opacity: 1; visibility: visible; transform: translateY(0); }
.apx-navmenu a {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 11px 14px; font-size: 14px; color: var(--apx-mute); text-decoration: none;
  border-radius: 8px; transition: background .12s, color .12s;
}
.apx-navmenu a .go { opacity: 0; color: var(--apx-blue); transition: opacity .12s, transform .12s; transform: translateX(-4px); }
.apx-navmenu a:hover { background: rgba(46, 140, 255, .10); color: var(--apx-ink); }
.apx-navmenu a:hover .go { opacity: 1; transform: translateX(0); }

/* blue rectangle media placeholder */
.apx-ph { background: var(--apx-blue); display: block; }

/* news room article cards */
.apx-news-card { display: block; text-decoration: none; color: inherit; }
.apx-news-card .apx-ph { transition: opacity .15s ease; }
.apx-news-card:hover .apx-ph { opacity: .88; }
.apx-news-title { transition: color .15s ease; }
.apx-news-card:hover .apx-news-title { color: var(--apx-sky); }

/* full-bleed: break a child of the centered column out to the viewport width */
.apx-bleed { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

/* sections */
.apx-sec { padding: 140px 0; border-top: 1px solid var(--apx-line); }

.apx-tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; padding: 5px 10px; border-radius: 4px;
  background: rgba(46, 140, 255, .10); color: var(--apx-sky);
  border: 1px solid rgba(46, 140, 255, .22);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  letter-spacing: 0.05em; text-transform: uppercase;
}

/* logo wordmark */
.apx-logo { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; }
.apx-logo .wm { font-family: 'Inter', sans-serif; font-weight: 700; letter-spacing: 0.22em; color: var(--apx-ink); }

/* accordion helpers */
.apx-acc-btn { width: 100%; background: transparent; border: none; cursor: pointer; color: var(--apx-ink); text-align: left; font-family: inherit; }
.apx-acc-panel { overflow: hidden; }
.apx-acc-panel[hidden] { display: none; }

/* headings sit flush on the background (no highlight box). The blue
   variant only recolors the text. */
.apx-hl { background: transparent; padding: 0; }
.apx-hl.blue { background: transparent; color: var(--apx-sky); }

/* white video-placeholder card with centered play button */
.apx-playcard {
  background: #f4f1ea; border-radius: 6px; aspect-ratio: 5/6;
  display: flex; align-items: center; justify-content: center;
}
.apx-playcard svg { color: #0a0a0c; }

/* outlined circular play button (over blue video placeholders) */
.apx-playcircle {
  width: 84px; height: 84px; border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .85);
  display: flex; align-items: center; justify-content: center; color: #fff;
}

/* subpage form fields */
.apx-field {
  width: 100%; padding: 13px 14px; background: #0a0a0c;
  border: 1px solid var(--apx-line); border-radius: 5px;
  font-size: 13px; color: var(--apx-ink); font-family: inherit;
}
.apx-field::placeholder { color: var(--apx-mute-2); }
.apx-field:focus { outline: none; border-color: var(--apx-blue); }
textarea.apx-field { min-height: 120px; resize: vertical; }

/* selectable role chips (contact form) */
.apx-chip {
  display: inline-flex; align-items: center; padding: 9px 16px;
  border-radius: 999px; font-size: 13px; font-family: inherit; cursor: pointer;
  background: transparent; color: var(--apx-mute);
  border: 1px solid var(--apx-line-strong); transition: color .15s, background .15s, border-color .15s;
}
.apx-chip:hover { color: var(--apx-ink); border-color: var(--apx-mute); }
.apx-chip[aria-pressed="true"] { background: var(--apx-blue); color: #fff; border-color: var(--apx-blue); }