/* ============================================================
   DESIGN TOKENS — [COMPANY NAME]
   Direction: clean · structured · editorial-industrial.
   Near-monochrome warm-neutral base + ONE confident accent.
   Modern grotesk type (Archivo). Restraint over effects.
   (Built with the cinematic-ui premium-calibration guardrails.)
   ============================================================ */

:root {
  /* ---- base (warm neutral, light, clean) ---- */
  --bg:        #F4F3EF;   /* page */
  --bg-2:      #FFFFFF;   /* surfaces / alt */
  --bg-3:      #EAE8E1;   /* deeper band */
  --surface:   #FFFFFF;
  --surface-2: #FBFAF7;
  --tint:      #EFEDE6;

  /* legacy names remapped */
  --void:      #16171B;   /* dark anchor (footer / CTA / arc text) */
  --slate-900: #F4F3EF; --slate-850: #FFFFFF; --slate-800: #FBFAF7;
  --slate-700: #EAE8E1; --slate-600: #DDDBD3; --slate-500: #B6B4AB;
  --concrete:  #EAE8E1; --warm-white:#FFFFFF; --paper:#FFFFFF;

  /* ---- text ---- */
  --ink:       #17181C;
  --text:      #3D3E44;
  --text-soft: #6C6D74;
  --mist:      #98979E;
  --muted:     #98979E;

  /* ---- lines ---- */
  --line-faint: rgba(22,22,28,.07);
  --line:       rgba(22,22,28,.12);
  --line-strong:rgba(22,22,28,.20);

  /* ---- single accent (warm construction amber) ---- */
  --accent:      #DA5A1B;
  --accent-2:    #C24A12;
  --accent-soft: rgba(218,90,27,.10);
  --accent-line: rgba(218,90,27,.35);
  /* kept aliases so existing markup resolves to the one accent */
  --amber: var(--accent); --amber-2: #E8743A; --amber-deep: var(--accent-2);
  --cyan: var(--accent); --blue: var(--accent); --violet: var(--accent);
  --violet-2: var(--accent); --indigo: var(--accent); --magenta: var(--accent);
  --ok:  #1E8E5A; --err: #C8392E;

  /* gradients neutralised to flat accent (no tech-gradient) */
  --grad: var(--accent); --grad-cool: var(--accent); --grad-warm: var(--accent);
  --grad-text: none; --grad-duo: rgba(22,22,28,.0);

  /* ---- glass → clean translucent ---- */
  --glass: rgba(255,255,255,.7); --glass-2: rgba(255,255,255,.55);
  --glass-bg: rgba(255,255,255,.7); --glass-bg-2: rgba(255,255,255,.55);
  --glass-border: var(--line); --glass-hi: var(--line-strong); --glass-blur: 14px;

  /* ---- shadows (clean, subtle) ---- */
  --shadow-1: 0 1px 2px rgba(22,22,30,.06);
  --shadow-2: 0 20px 44px -28px rgba(22,22,40,.22);
  --shadow-3: 0 36px 80px -36px rgba(22,22,40,.28);
  --glow-blue: var(--shadow-2); --glow-violet: var(--shadow-2); --glow-amber: var(--shadow-2);
  --glow-cyan: var(--shadow-2); --glow-soft: var(--shadow-2);

  /* ---- unified cinematic photo grade (color-grades library) ---- */
  --photo-grade: contrast(1.05) saturate(1.06) brightness(1.0);

  /* ---- type (modern grotesk) ---- */
  --font-display: "Archivo", "Inter", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", "SFMono-Regular", ui-monospace, monospace;

  --fs-eyebrow:  .76rem;
  --fs-mono-sm:  .72rem;
  --fs-small:    clamp(.88rem, .85rem + .2vw, .95rem);
  --fs-body:     clamp(1rem, .97rem + .2vw, 1.075rem);
  --fs-lead:     clamp(1.12rem, 1.02rem + .55vw, 1.4rem);
  --fs-h4:       clamp(1.18rem, 1.05rem + .6vw, 1.5rem);
  --fs-h3:       clamp(1.5rem, 1.2rem + 1.4vw, 2.2rem);
  --fs-h2:       clamp(2.1rem, 1.5rem + 2.8vw, 3.6rem);
  --fs-display:  clamp(2.8rem, 1.6rem + 5.6vw, 6rem);
  --fs-mega:     clamp(3.6rem, 1.6rem + 9vw, 9rem);

  --lh-tight: 1.04; --lh-snug: 1.1; --lh-body: 1.62;
  --tracking-wide: .2em; --tracking-mono: .02em;

  /* ---- spacing / rhythm ---- */
  --space-1: .5rem; --space-2: 1rem; --space-3: 1.5rem; --space-4: 2rem;
  --space-5: 3rem;  --space-6: 4.5rem; --space-7: 7rem;
  --section-y: clamp(4.5rem, 3rem + 7vw, 9rem);
  --gutter:    clamp(1.25rem, .6rem + 2.6vw, 4rem);
  --maxw:      1440px;
  --maxw-text: 64ch;

  /* ---- radius (crisp / structured) ---- */
  --r-sm: 4px; --r: 8px; --r-lg: 12px; --r-xl: 16px; --r-pill: 999px;

  /* ---- motion ---- */
  --ease-out: cubic-bezier(.16,1,.3,1); --ease-in-out: cubic-bezier(.65,.05,.36,1);
  --dur-1: .25s; --dur-2: .45s; --dur-3: .7s;

  /* ---- layout ---- */
  --header-h: 86px; --grid-size: 64px;
}

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; }