/* ==========================================================================
   Gulf Offshore Rentals — Design Tokens
   Palette sampled directly from the GOR logo (logo.png, opaque-pixel cluster):
   Rig Blue #0038A8 · Safety Orange #EF6C00
   Blue is used as an atmospheric field; orange is the sole interactive accent.
   ========================================================================== */

:root {
  /* ---- Substrate ------------------------------------------------------- */
  --void: #08090b;
  --bg: #0b0d10;
  --surface: #12151a;
  --surface-2: #191d24;
  --surface-3: #212630;

  --hairline: rgba(255, 255, 255, 0.09);
  --hairline-hi: rgba(255, 255, 255, 0.16);
  --hairline-lo: rgba(255, 255, 255, 0.05);

  /* ---- Brand: Rig Blue (atmospheric field) ----------------------------- */
  --blue: #0038a8;
  --blue-deep: #041a4d;
  --blue-abyss: #02102f;
  --blue-lift: #1b57d6;

  /* ---- Brand: Safety Orange (the accent) ------------------------------- */
  --orange: #ef6c00;
  --orange-hot: #ff7a14;
  --orange-dim: rgba(239, 108, 0, 0.14);
  --orange-ghost: rgba(239, 108, 0, 0.06);

  /* ---- Type ------------------------------------------------------------
     Every tier clears WCAG AA (4.5:1) against --surface, the lightest
     substrate body copy ever sits on. Do not darken these without
     re-checking; the quiet tiers carry real spec text, not decoration. */
  --text: #e8eaed;      /* 13.9:1 */
  --text-mid: #a8b0ba;  /*  8.4:1 */
  --text-dim: #838c98;  /*  5.3:1 */
  --text-faint: #78818d; /*  4.6:1 */
  --text-invert: #0b0d10;

  /* ---- Families --------------------------------------------------------
     Clash Display (ITF/Fontshare) — neo-grotesk with pinched apertures,
     loaded only at Bold so mega headlines keep the old black-cut weight.
     Supreme (ITF/Fontshare) — straight-sided engineered grotesque for body.
     Azeret Mono (Displaay/Fontshare) — OCR-descended mono for specs/labels. */
  --font-display: "Clash Display", "Arial Black", system-ui, sans-serif;
  --font-body: "Supreme", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Azeret Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* ---- Fluid type scale ------------------------------------------------ */
  --fs-mega: clamp(2.75rem, 8vw, 9rem);
  --fs-xxl: clamp(2.25rem, 5.5vw, 5rem);
  --fs-xl: clamp(1.75rem, 3.6vw, 3rem);
  --fs-lg: clamp(1.375rem, 2.2vw, 1.875rem);
  --fs-md: 1.125rem;
  --fs-body: 1.0625rem;
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;
  --fs-micro: 0.6875rem;

  /* ---- Spacing (dense by design — see build brief) --------------------- */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;

  --section-y: clamp(3.5rem, 7vw, 7rem);
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
  --shell: 1500px;

  /* ---- Motion ---------------------------------------------------------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 140ms;
  --t-base: 260ms;
  --t-slow: 520ms;

  /* ---- Layers ---------------------------------------------------------- */
  --z-grain: 40;
  --z-header: 100;
  --z-panel: 200;
  --z-modal: 300;

  --header-h: 80px;

  /* Photo-plate scanlines only. Wider gap, low white, never a full-page overlay. */
  --scanline: repeating-linear-gradient(
    0deg,
    transparent 0 5px,
    rgba(255, 255, 255, 0.05) 5px 6px
  );
}

@media (max-width: 640px) {
  :root {
    --header-h: 72px;
  }
}

/* Structural rule: nothing on this site is rounded. */
*,
*::before,
*::after {
  border-radius: 0;
}
