/* ============================================================
   reset.css
   Global base layer — bare tag selectors, CSS custom properties,
   utility resets. Load once as the site's foundation.
   No component-specific class names live here.
   ============================================================ */

/* ── Custom properties (global theme tokens) ── */
:root {
  --ink: #0c1018; --ink-2: #11161f; --ink-3: #171d28; --panel: #131924;
  --line: rgba(255,255,255,0.08); --line-2: rgba(255,255,255,0.14);
  --paper: #f4f5f7; --paper-dim: #b9c1cd; --paper-dimmer: #86909e;
  --orange: #f58220; --orange-2: #ffb15a; --orange-soft: rgba(245,130,32,0.12);
  --green: #3ecf8e; --on-orange: #ffffff;
  --nav-bg: rgba(12,16,24,0.72); --glass-bg: rgba(17,22,31,0.9); --overlay-bg: rgba(12,16,24,0.85);
  --hero-fade: #0c1018; --map-1: #141b26; --map-2: #0c1119; --map-line: rgba(255,255,255,0.05); --map-dot: rgba(180,196,220,0.22);
  --chip-bg: rgba(12,16,24,0.9); --chip-label: #ffffff;
  --font-sans: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: "Fraunces", Georgia, "Times New Roman", serif;
  --wrap: 1240px; --gutter: clamp(20px, 5vw, 64px); --radius: 16px; --radius-lg: 26px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

[data-theme="light"] {
  --ink: #ffffff; --ink-2: #f6f7f9; --ink-3: #eef1f5; --panel: #f6f7f9;
  --line: rgba(12,16,24,0.10); --line-2: rgba(12,16,24,0.16);
  --paper: #0c1018; --paper-dim: #46505f; --paper-dimmer: #667081;
  --orange: #d96f12; --orange-2: #b85a0c; --orange-soft: rgba(245,130,32,0.14); --on-orange: #ffffff;
  --nav-bg: rgba(255,255,255,0.82); --glass-bg: rgba(255,255,255,0.94); --overlay-bg: rgba(255,255,255,0.86);
  --hero-fade: #ffffff; --map-1: #eef2f7; --map-2: #e2e8f1; --map-line: rgba(12,16,24,0.06); --map-dot: rgba(12,16,24,0.20);
  --chip-bg: rgba(255,255,255,0.95); --chip-label: #0c1018;
}

/* ── Logo visibility helpers (theme-aware, global) ── */
.logo-dark { display: block; }
.logo-light { display: none; }
[data-theme="light"] .logo-dark { display: none; }
[data-theme="light"] .logo-light { display: block; }

/* ── Box-sizing reset ── */
*, *::before, *::after { box-sizing: border-box; }

/* ── HTML / body base ── */
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

/* ── Lenis smooth-scroll integration ── */
html.lenis,
html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

body {
  margin: 0;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--font-sans);
  font-size: 19px;
  line-height: 1.65;
  font-weight: 400;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: background 0.4s var(--ease), color 0.4s var(--ease);
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:focus, a:hover {
    text-decoration: none;
    color: var(--paper);
}
button { font-family: inherit; cursor: pointer; }

h1, h2, h3, h4 {
  margin: 0;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -0.02em;
}

p  { margin: 0; font-weight: 300; }
ul { margin: 0; padding: 0; list-style: none; }

/* ── Screen-reader only utility (global) ── */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
  padding: 0;
  margin: -1px;
}

/* ── Reduced motion ──
   "Animation off" means LESS MOVEMENT, not "nothing works".
   Transitions (hover / focus / open-close / colour / opacity), smooth scrolling and one-shot state changes stay on.
   Only non-essential movement is removed: sliding / parallax reveals, endless decorative loops, auto-spinning models.
   Those rules live next to their components (vt1-components.css, style.css). */