/* ============================================================
   DeckAgent.AI design tokens 1.1.0
   Design system: venture:deckagent@1.1.0
   Served with the DeckAgent app
   Custom properties use the --sv-* naming convention. Values: warm paper,
   near-black ink, monochrome page chrome. 1.1.0 adds the watermark palette and font stack.
   Pages link this file and use var(--sv-*) for every colour and font.
   ============================================================ */

/* Manrope (SIL Open Font License 1.1, fonts/OFL.txt). Source:
   github.com/google/fonts/tree/main/ofl/manrope, variable wght 200 to 800. */
@font-face {
  font-family: "Manrope";
  src: url("./fonts/Manrope-Variable.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---------------------------------------------------------
     COLOR / PRIMITIVES: BRAND
     The names are roles, not hues: --sv-green is this venture's
     single action colour, --sv-home-bg its page background,
     --sv-gray-* its neutral ramp (light → x-dark).
     --------------------------------------------------------- */
  --sv-black: #12110f;          /* warm near-black ink */
  --sv-white: #fffdf8;          /* warm white */
  --sv-off-white: #ebe6dc;      /* BRAND: sunken / print-leaning surface */
  --sv-home-bg: #f5f2eb;        /* BRAND: default page background (warm paper) */
  --sv-gray-light: #d6d0c4;     /* BRAND: hairlines on light */
  --sv-gray-mid: #948e82;       /* BRAND: large/decorative text only */
  --sv-gray-dark: #57534b;      /* BRAND: secondary text, 6.8:1 on --sv-home-bg */
  --sv-gray-xdark: #262420;     /* BRAND: raised surface on dark */
  --sv-green: #12110f;          /* BRAND: action colour = ink (monochrome system; name kept) */
  --sv-green-dark: #fffdf8;     /* BRAND: its pair on dark surfaces = warm white */

  /* ---------------------------------------------------------
     COLOR / SEMANTIC (light surfaces, default)
     Map roles to primitives; pages use these, not the primitives.
     --------------------------------------------------------- */
  --sv-surface: var(--sv-home-bg);
  --sv-surface-raised: var(--sv-white);
  --sv-surface-sunken: var(--sv-off-white);
  --sv-ink: var(--sv-black);
  --sv-ink-secondary: var(--sv-gray-dark);
  --sv-ink-tertiary: var(--sv-gray-mid);
  --sv-hairline: var(--sv-gray-light);
  --sv-accent: var(--sv-green);
  --sv-accent-ink: var(--sv-white);       /* BRAND: text on the accent, 18.6:1 */
  --sv-focus: var(--sv-ink);               /* neutral focus ring; keep neutral */

  /* ---------------------------------------------------------
     TYPOGRAPHY: BRAND family; the scale may stay
     --------------------------------------------------------- */
  --sv-font-sans: "Manrope", Arial, "Helvetica Neue", Helvetica, sans-serif; /* BRAND: Manrope (OFL) via @font-face above; Arial is the failure fallback only */

  --sv-text-display: clamp(3rem, 8vw, 6rem);
  --sv-text-h1: clamp(2.5rem, 5vw, 3.5rem);
  --sv-text-h2: clamp(2rem, 3.5vw, 2.5rem);
  --sv-text-h3: 1.75rem;
  --sv-text-h4: 1.25rem;
  --sv-text-intro: 1.5rem;
  --sv-text-body: 1.125rem;
  --sv-text-small: 0.9375rem;
  --sv-text-caption: 0.8125rem;
  --sv-text-stat: clamp(4rem, 10vw, 8rem);

  --sv-leading-display: 1.02;
  --sv-leading-heading: 1.1;
  --sv-leading-intro: 1.35;
  --sv-leading-body: 1.6;

  --sv-tracking-display: -0.02em;
  --sv-tracking-heading: -0.01em;
  --sv-tracking-body: 0;
  --sv-tracking-caps: 0.04em;

  /* ---------------------------------------------------------
     SPACE (4px base; use steps, never arbitrary values)
     --------------------------------------------------------- */
  --sv-space-1: 0.25rem;
  --sv-space-2: 0.5rem;
  --sv-space-3: 0.75rem;
  --sv-space-4: 1rem;
  --sv-space-6: 1.5rem;
  --sv-space-8: 2rem;
  --sv-space-12: 3rem;
  --sv-space-16: 4rem;
  --sv-space-24: 6rem;
  --sv-space-32: 8rem;
  --sv-space-48: 12rem;

  /* ---------------------------------------------------------
     LAYOUT
     --------------------------------------------------------- */
  --sv-container: 90rem;
  --sv-gutter: clamp(1.25rem, 4vw, 4rem);
  --sv-rail: 18rem;
  --sv-radius: 0;               /* BRAND: corner radius */
  --sv-hairline-w: 1px;

  /* ---------------------------------------------------------
     MOTION
     --------------------------------------------------------- */
  --sv-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --sv-ease-inout: cubic-bezier(0.76, 0, 0.24, 1);
  --sv-ease-linear: linear;

  --sv-dur-instant: 100ms;
  --sv-dur-fast: 200ms;
  --sv-dur-base: 300ms;
  --sv-dur-slow: 600ms;
  --sv-dur-cine: 1000ms;

  --sv-stagger: 80ms;
  --sv-reveal-distance: 24px;

  /* ---------------------------------------------------------
     Z-INDEX
     --------------------------------------------------------- */
  --sv-z-nav: 100;
  --sv-z-overlay: 200;
  --sv-z-modal: 300;

  /* ---------------------------------------------------------
     MATERIAL: Liquid Glass, product-mark key and data
     palette. The tint alphas are AA floors.
     --------------------------------------------------------- */
  --sv-glass-blur-thin: 8px;
  --sv-glass-blur-regular: 18px;
  --sv-glass-blur-thick: 32px;
  --sv-glass-clear-blur-thin: 0.5px;
  --sv-glass-clear-blur-regular: 1px;
  --sv-glass-clear-blur-thick: 2px;
  --sv-glass-saturate: 180%;
  --sv-glass-tint-thin: rgb(255 255 255 / 0.55);
  --sv-glass-tint-regular: rgb(255 255 255 / 0.72);
  --sv-glass-tint-thick: rgb(255 255 255 / 0.86);
  --sv-glass-clear-thin: rgb(255 255 255 / 0.12);
  --sv-glass-clear-regular: rgb(255 255 255 / 0.20);
  --sv-glass-clear-thick: rgb(255 255 255 / 0.32);
  --sv-glass-edge: rgb(255 255 255 / 0.7);
  --sv-glass-edge-shade: rgb(0 0 0 / 0.12);
  --sv-glass-specular: rgb(255 255 255 / 0.9);
  --sv-glass-bevel: 1.5px;
  --sv-glass-lensing: 4px;
  --sv-glass-radius-thin: 20px;
  --sv-glass-radius-regular: 28px;
  --sv-glass-radius-thick: 36px;
  --sv-glass-ink: var(--sv-black);
  --sv-glass-ink-secondary: var(--sv-gray-xdark);
  --sv-wordmark-os-weight: 400;
  --sv-wordmark-os-gap: 0.1em;
  --sv-wordmark-os-pad-x: 0.2em;
  --sv-wordmark-os-pad-bottom: 0.19em;
  --sv-wordmark-os-line: 0.68em;
  --sv-wordmark-os-radius: 0.26em;
  --sv-wordmark-os-fill: rgb(0 0 0 / 0.035);
  --sv-wordmark-os-edge: rgb(0 0 0 / 0.2);
  --sv-wordmark-os-bevel: rgb(255 255 255 / 0.75);
  --sv-wordmark-os-specular: rgb(255 255 255 / 1);
  --sv-wordmark-os-shade: rgb(0 0 0 / 0.1);
  --sv-wordmark-os-sheen: rgb(255 255 255 / 0.9);
  --sv-wordmark-os-media-fill: rgb(255 255 255 / 0.55);
  --sv-wordmark-os-media-edge: rgb(255 255 255 / 0.8);
  --sv-data-1: var(--sv-black);
  --sv-data-2: #2f5fd0;
  --sv-data-3: #0e7c86;
  --sv-data-4: #6e56cf;
  --sv-data-5: #b5651d;
  --sv-data-neutral: var(--sv-gray-dark);
  --sv-data-track: var(--sv-gray-light);
  --sv-data-grid: var(--sv-gray-light);

  /* ---------------------------------------------------------
     WATERMARK PALETTE (added in 1.1.0)
     Colour and font values for the deckagent.ai watermark.
     --------------------------------------------------------- */
  --sv-watermark-ink: #263442;
  --sv-watermark-ink-dark: #edf2f7;
  --sv-watermark-edge: rgb(255 255 255 / 0.65);
  --sv-watermark-edge-dark: rgb(255 255 255 / 0.35);
  --sv-watermark-edge-hover: rgb(255 255 255 / 0.9);
  --sv-watermark-fill-start: rgb(255 255 255 / 0.16);
  --sv-watermark-fill-end: rgb(255 255 255 / 0.035);
  --sv-watermark-specular: rgb(255 255 255 / 0.35);
  --sv-watermark-shadow: rgb(0 0 0 / 0.04);
  --sv-watermark-sweep: rgb(255 255 255 / 0.2);
  --sv-watermark-print-edge: #b8c1ca;
  --sv-watermark-stage-light-1: #c6d4e2;
  --sv-watermark-stage-light-2: #e5edf4;
  --sv-watermark-stage-light-3: #d1dfeb;
  --sv-watermark-stage-dark-1: #15212f;
  --sv-watermark-stage-dark-2: #334251;
  --sv-watermark-stage-dark-3: #192430;
  --sv-font-watermark: "Aeonik Pro", "Helvetica Neue", Arial, sans-serif;
}

/* Dark-surface context: apply .sv-dark to any section on a dark background. */
.sv-dark {
  color: var(--sv-ink);
  background: var(--sv-surface);
  --sv-surface: var(--sv-black);
  --sv-surface-raised: var(--sv-gray-xdark);
  --sv-surface-sunken: var(--sv-black);
  --sv-ink: var(--sv-white);
  --sv-ink-secondary: var(--sv-gray-light);
  --sv-ink-tertiary: var(--sv-gray-mid);
  --sv-hairline: var(--sv-gray-dark);
  --sv-accent: var(--sv-green-dark);
  --sv-accent-ink: var(--sv-black);
  --sv-focus: var(--sv-white);

  /* Material over dark (see :root). */
  --sv-glass-tint-thin: rgb(0 0 0 / 0.45);
  --sv-glass-tint-regular: rgb(0 0 0 / 0.62);
  --sv-glass-tint-thick: rgb(0 0 0 / 0.8);
  --sv-glass-clear-thin: rgb(0 0 0 / 0.16);
  --sv-glass-clear-regular: rgb(0 0 0 / 0.26);
  --sv-glass-clear-thick: rgb(0 0 0 / 0.40);
  --sv-glass-edge: rgb(255 255 255 / 0.28);
  --sv-glass-edge-shade: rgb(0 0 0 / 0.5);
  --sv-glass-specular: rgb(255 255 255 / 0.45);
  --sv-glass-ink: var(--sv-white);
  --sv-glass-ink-secondary: var(--sv-gray-light);
  --sv-wordmark-os-fill: rgb(255 255 255 / 0.1);
  --sv-wordmark-os-edge: rgb(255 255 255 / 0.32);
  --sv-wordmark-os-bevel: rgb(255 255 255 / 0.08);
  --sv-wordmark-os-specular: rgb(255 255 255 / 0.55);
  --sv-wordmark-os-shade: rgb(0 0 0 / 0.6);
  --sv-wordmark-os-sheen: rgb(255 255 255 / 0.18);
  --sv-wordmark-os-media-fill: rgb(0 0 0 / 0.45);
  --sv-wordmark-os-media-edge: rgb(255 255 255 / 0.34);
  --sv-data-1: var(--sv-white);
  --sv-data-2: #7ea6ff;
  --sv-data-3: #3fc1c9;
  --sv-data-4: #ad9bff;
  --sv-data-5: #f0a650;
  --sv-data-neutral: var(--sv-gray-light);
  --sv-data-track: var(--sv-gray-xdark);
  --sv-data-grid: var(--sv-gray-dark);
}

/* Reduced motion: opacity-only, near-instant. Non-negotiable. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --sv-dur-instant: 1ms;
    --sv-dur-fast: 1ms;
    --sv-dur-base: 1ms;
    --sv-dur-slow: 1ms;
    --sv-dur-cine: 1ms;
    --sv-reveal-distance: 0px;
  }
}