/*
  GOODFEEL — shared design tokens.
  Source of truth: ~/.claude/CLAUDE.md (GOODFEEL Masterclass Markenguide, final 2026-09-14).
  Used by both the landing page (styles.css) and the Quick Check (quickcheck.css).
*/

:root {
  /* Colors */
  --ink: #121314;              /* text on light sections */
  --ivory: #f5f3ee;            /* base background */
  --stone: #e8e4dc;            /* subtle surfaces, card backgrounds */
  --sage: #8ca184;             /* primary accent */
  --sage-light: #b7c6ae;
  --sage-dark: #5f7358;        /* deep, elegant dark green accent / hover */
  --champagne: #d8c7a1;        /* sparse gold accent only — never dominant */

  --ink-90: rgba(18, 19, 20, 0.9);
  --ink-70: rgba(18, 19, 20, 0.7);
  --ink-60: rgba(18, 19, 20, 0.6);
  --ink-50: rgba(18, 19, 20, 0.5);
  --ink-40: rgba(18, 19, 20, 0.4);
  --ink-25: rgba(18, 19, 20, 0.25);
  --ink-15: rgba(18, 19, 20, 0.15);
  --sage-20: rgba(140, 161, 132, 0.2);
  --sage-30: rgba(140, 161, 132, 0.3);

  /* Type */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Layout */
  --max-w: 1180px;
  --max-w-narrow: 760px;
  --radius-lg: 28px;
  --radius-md: 20px;
  --radius-full: 999px;
  --space-section: clamp(64px, 10vw, 140px);

  color-scheme: light;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

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

body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img,
video {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
}

button {
  font: inherit;
}

:focus-visible {
  outline: 3px solid var(--sage-dark);
  outline-offset: 3px;
  border-radius: 4px;
}