/* Reset, typography, and body defaults
 * Depends on: css/tokens.css (must be linked before this file)
 *
 * Contrast note: --color-text-primary (#e8e0f0) on --color-bg (#0a0a0f)
 * yields a contrast ratio of ~14.5:1, well above the WCAG 2.1 AA
 * minimum of 4.5:1 (Requirement 1.4).
 */

/* ── Box-sizing reset ───────────────────────────────────────────────────── */

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* ── Margin / padding reset ─────────────────────────────────────────────── */

html,
body {
  margin: 0;
  padding: 0;
}

/* ── Content protection — user-select ───────────────────────── */

/*
 * Prevents text selection / highlighting across the entire site.
 * Form inputs and textareas are explicitly re-enabled so users
 * can still type, select their own input, and use the contact form.
 */
body {
  user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

/* Re-enable selection inside form controls so the site remains usable */
input,
textarea,
select,
[contenteditable="true"] {
  user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
}

/* ── Body defaults ──────────────────────────────────────────────────────── */

body {
  background-color: var(--color-bg);
  color: var(--color-text-primary);
  font-family: var(--font-body);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── Headings ───────────────────────────────────────────────────────────── */

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  color: var(--color-accent);
  line-height: 1.2;
  margin: 0;
}

/* ── Links ──────────────────────────────────────────────────────────────── */

a {
  color: var(--color-accent);
  text-decoration: none;
}

a:hover {
  color: var(--color-accent-hover);
}

/* ── Focus-visible (accessibility) ─────────────────────────────────────── */
/* Applies to all interactive elements; replaces the default browser outline
 * with one that uses the site's accent color so focus indicators remain
 * visible against the dark background (Requirement 1.4, WCAG 2.1 AA). */

a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ── Images ─────────────────────────────────────────────────────────────── */

img {
  max-width: 100%;
  height: auto;
  display: block;
}
