/* ─────────────────────────────────────────────────────────
   SAWT (STM) — Shared design tokens for the redesigned site
   ───────────────────────────────────────────────────────── */

:root {
  /* Midnight (deeper than original) */
  --ink-1000: #04090f;
  --ink-950:  #070d18;
  --ink-900:  #0b1426;
  --ink-850:  #101c34;
  --ink-800:  #18253f;
  --ink-700:  #233354;

  /* Light parchment + warm neutrals */
  --paper:      #faf7f1;   /* warm off-white */
  --paper-2:    #f3ede2;   /* sandstone tint */
  --paper-3:    #e8dfd0;   /* warmer wash */
  --line:       rgba(11,20,38,0.08);
  --line-2:     rgba(11,20,38,0.14);

  /* Accents — jade + copper (Oman heritage tones) */
  --jade:        #3dd9b6;  /* warmer jade-teal */
  --jade-deep:   #1faf91;
  --jade-soft:   rgba(61,217,182,0.12);
  --copper:      #d4915a;  /* refined copper */
  --copper-deep: #b87440;
  --copper-soft: rgba(212,145,90,0.14);
  --gold:        #c8a565;  /* gold highlight on dark */

  /* Type */
  --font-display: 'IBM Plex Sans', 'Plex Sans Arabic', system-ui, -apple-system, sans-serif;
  --font-body:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;
  --font-arabic:  'IBM Plex Sans Arabic', system-ui, sans-serif;

  /* Radii */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;

  /* Shadows */
  --shadow-soft:  0 1px 2px rgba(7,13,24,0.04), 0 8px 24px rgba(7,13,24,0.06);
  --shadow-card:  0 1px 0 rgba(255,255,255,0.04) inset, 0 24px 48px -12px rgba(0,0,0,0.5);
  --shadow-elev:  0 30px 80px -20px rgba(7,13,24,0.55);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "ss02", "cv11";
}

/* Text helpers */
.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.eyebrow-num {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.06em;
}
.display-tight {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 0.98;
}
.display-light {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.022em;
  line-height: 1.02;
}

/* Logo on dark — gentle glow so transparent PNG blends */
.logo-on-dark {
  filter: drop-shadow(0 0 6px rgba(255,255,255,0.45));
}
.logo-on-light {
  filter: invert(1) brightness(0.16);
}

/* Subtle micro-grid pattern (used on dark hero backgrounds) */
.bg-grid-soft {
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 64px 64px;
}

/* Number ticker / metric display */
.metric-num {
  font-family: var(--font-mono);
  font-weight: 500;
  letter-spacing: -0.01em;
  font-feature-settings: "tnum", "zero";
}

/* Underline link */
.under-link {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 1px;
  background-repeat: no-repeat;
  background-position: 0 100%;
  transition: background-size .35s ease;
}
.under-link:hover { background-size: 100% 1px; }

/* Reveal-on-scroll */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .8s ease, transform .8s ease; }
.reveal.in { opacity: 1; transform: none; }

/* Selection */
::selection { background: rgba(61,217,182,0.30); color: #fff; }