/* =========================================================
   QN_AI — Shared design tokens & base
   ========================================================= */

:root {
  /* Ink / paper */
  --ink:        #0a1628;       /* deep navy, near black */
  --ink-soft:   #16243d;
  --ink-mid:    #2a3a5c;
  --paper:      #f4f0e8;       /* warm ivory */
  --paper-2:    #ece6d8;
  --paper-3:    #e2dbc9;
  --rule:       rgba(10, 22, 40, 0.12);
  --rule-soft:  rgba(10, 22, 40, 0.06);

  /* Accents */
  --ember:      #c0532a;       /* quiet copper */
  --ember-soft: #e6a77f;
  --azure:      #2b5bd7;       /* precise technical blue */
  --azure-deep: #1a3f9e;

  /* Semantic */
  --muted:      rgba(10, 22, 40, 0.62);
  --muted-2:    rgba(10, 22, 40, 0.42);

  /* Typography */
  --f-display: "Instrument Serif", "EB Garamond", Georgia, serif;
  --f-body:    "Geist", -apple-system, "Helvetica Neue", sans-serif;
  --f-mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--f-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

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 {
  /* warm paper grain */
  background-image:
    radial-gradient(circle at 20% 30%, rgba(192, 83, 42, 0.025), transparent 60%),
    radial-gradient(circle at 80% 70%, rgba(10, 22, 40, 0.03), transparent 60%);
}

::selection { background: var(--ink); color: var(--paper); }

a { color: inherit; text-decoration: none; }

/* Type primitives */
.display {
  font-family: var(--f-display);
  font-weight: 400;
  letter-spacing: -0.015em;
  line-height: 0.95;
}
.mono {
  font-family: var(--f-mono);
  font-weight: 400;
  letter-spacing: 0.02em;
}
.tick {
  font-family: var(--f-mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-mid);
}

/* Layout */
.wrap {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 48px;
}
@media (max-width: 780px) {
  .wrap { padding: 0 24px; }
}

.hairline { height: 1px; background: var(--rule); width: 100%; }
.hairline-dk { height: 1px; background: rgba(244, 240, 232, 0.18); width: 100%; }

/* Hide default cursor over interactive content when custom cursor active */
html.has-custom-cursor,
html.has-custom-cursor * { cursor: none !important; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}