/* ============================================================
   NOCTURA — tokens.css = PROFILE (inspiration: cinery.webflow.io)
   Dark monochrome cinematic studio. Pure-black bg, white ink,
   grayscale neutrals. NO chromatic accent (mono = white-on-black,
   CTAs invert on hover). Display + body = Space Grotesk; Inter fallback.
   Heavily rounded dark cards (radius up to 4rem). Brand suffix ®.
   ============================================================ */
:root{
  /* COLOR — mono accent (white on black); page is dark-first */
  --accent:#ffffff;            /* mono accent */
  --accent-ink:#000000;        /* black ink on white CTA */
  --bg:#000000;                /* pure black stage */
  --surface-alt:#0a0a0a;       /* near-black panel */
  --ink:#ffffff;               /* white ink */
  --body:#b0b0b0;              /* grey body text */
  --border:rgba(255,255,255,.10);
  --card:#121212;              /* dark card floating above black */
  /* dark palette (page is already dark — kept for parity / inverted blocks) */
  --bg-dark:#000000;
  --ink-dark:#ffffff;
  --body-dark:#aaadb0;
  --border-dark:rgba(255,255,255,.10);
  --card-dark:#121212;
  /* TYPO — one wide grotesk for display + body (Overused-Grotesk feel) */
  --font-display:"Space Grotesk",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  --w-reg:400; --w-med:500; --w-semi:600; --w-bold:700; --w-black:700;
  --tracking-tight:-.01em;
  --tracking-eyebrow:.12em;
  --eyebrow-glyph:"\25C9";        /* ◉ */
  --eyebrow-transform:uppercase;
  /* LAYOUT — heavy rounding distinguishes from norvik's tight radii */
  --container:80rem;
  --gutter:clamp(1.25rem,4vw,1.5rem);
  --section-y:clamp(4.5rem,9vw,7rem);
  --radius-sm:.5rem; --radius-md:1.5rem; --radius-lg:2.5rem;
  --radius-huge:4rem; --radius-pill:100rem;
  --bw:1px;
  /* SCALES — hard 65px cap wraps every heading (R3) */
  --fs-cap:65px;
  --fs-display:min(clamp(40px,7vw,65px), var(--fs-cap));
  --fs-h2:min(clamp(30px,5vw,52px), var(--fs-cap));
  --fs-h3:min(clamp(22px,2.6vw,30px), var(--fs-cap));
  --fs-body:clamp(16px,1.1vw,18px);
  --fs-lead:clamp(18px,1.6vw,21px);
  --fs-eyebrow:.8125rem;
  --lh-display:1.02; --lh-h2:1.06;
  /* footer oversized wordmark (inspiration has a giant footer wordmark) */
  --fs-wordmark:clamp(80px,18vw,260px);
  /* MOTION — all from PROFILE; baseline R2 = fade from LEFT + 0.15s delay */
  --ease:cubic-bezier(0.33,1,0.68,1); --dur:.35s;
  --reveal-shift:24px; --base-x:-24px; --base-delay:.15s; --stagger:.08s;
  --hover-card:translateY(-4px); --hover-img:scale(1.05); --hover-btn:none;
  --marquee-speed:28s; --marquee-fade:8%;
}
/* dark palette switch — applied per is-dark section (page is dark-first) */
.is-dark{ --bg:var(--bg-dark); --ink:var(--ink-dark); --body:var(--body-dark);
          --border:var(--border-dark); --card:var(--card-dark); }
/* inverted block: white surface, black ink (CTA-style invert) */
.is-invert{ --bg:#ffffff; --ink:#000000; --body:#3a3a3a;
            --border:rgba(0,0,0,.12); --card:#f2f2f2; --accent:#000000; --accent-ink:#ffffff; }
