/* Blanka Privé — Design System
   Global entry point. Consumers link THIS file only.
   Import order: fonts, then tokens (color, type, spacing, effects),
   then base element defaults. Keep this file a list of @imports + a small
   base layer only. */

@import "tokens/fonts.css";
@import "tokens/colors.css";
@import "tokens/typography.css";
@import "tokens/spacing.css";
@import "tokens/effects.css";

/* ── Base layer ── */
html, body {
  margin: 0;
  padding: 0;
  background: var(--surface-page);
  color: var(--text-body);
}
body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: var(--font-sans);
  font-weight: var(--weight-light);
  font-size: var(--text-body);
  line-height: var(--leading-body);
}

/* Links are quiet and editorial: ink, no default underline; on hover the
   ink simply deepens toward black. (The signature CTA is the ArrowLink
   component, not a raw <a>.) */
a {
  color: var(--bp-ink);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease);
}
a:hover { color: #000; }

*, *::before, *::after { box-sizing: border-box; }

::selection { background: rgba(168, 132, 46, 0.22); color: var(--bp-ink); }