/* ============================================================
   PAMPLEMOUSSE — base resets & element defaults.
   Kept minimal so consumers inherit sensible brand defaults
   without heavy opinionation.
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg-canvas);
  color: var(--text-primary);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--grapefruit-500); color: var(--on-accent); }

a {
  color: var(--accent);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
a:hover { color: var(--accent-hover); }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: var(--fw-semi);
  letter-spacing: var(--tracking-display);
  margin: 0;
  color: var(--text-primary);
}

p { margin: 0; }

/* thin custom scrollbars fit the technical aesthetic */
* { scrollbar-width: thin; scrollbar-color: var(--ink-500) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: var(--ink-500); border-radius: var(--radius-pill); }
*::-webkit-scrollbar-track { background: transparent; }

/* Screen-print grain overlay helper — subtle noise via layered gradients */
.pm-grain::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.5;
  background-image: radial-gradient(rgba(255,92,77,0.05) 1px, transparent 1px);
  background-size: 3px 3px;
  mix-blend-mode: screen;
}