/* Design tokens for the editorial light theme (Claude Design "Myelink.dc") */

:root {
  --bg: #FAFAF8;
  --bg-alt: #F3F1EC;
  --fg: #1C1917;
  --muted: #57534E;
  --muted-2: #78716C;
  --faint: #A8A29E;
  --line: #E7E5E0;
  --line-strong: #D6D3CE;
  --card: #ffffff;
  --accent: #2452E0;

  /* Dark sections (services, contact footer) */
  --dark-bg: #1C1917;
  --dark-bg-hover: #252220;
  --dark-fg: #FAFAF8;
  --dark-muted: #A8A29E;
  --dark-line: #3A3633;
  --accent-on-dark: #8FA6F5;

  --font-sans: "Space Grotesk", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

html { background: var(--bg); }
body { color: var(--fg); }

/* Header right-side group: language switch */
.header-actions { display: flex; align-items: center; gap: 14px; }

/* Keyboard-only "skip to content" link, first focusable element of every page */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--fg);
  color: var(--bg);
  padding: 8px 14px;
  text-decoration: none;
  font-weight: 500;
  z-index: 100;
}
.skip-link:focus { left: 0; }