/* Mint Exteriors — design tokens (locked brand + hybrid theme)
   Source: 01-strategy-brand-web/WEBSITE-V1-DESIGN-DIRECTION.md */

:root {
  /* Brand — locked */
  --mint-primary: #08e8de;
  --mint-dark: #0a8f86;
  --mint-primary-dim: rgba(8, 232, 222, 0.5);
  --mint-glow: rgba(8, 232, 222, 0.14);
  --mint-dark-dim: rgba(10, 143, 134, 0.35);

  /* Surfaces — hybrid */
  --bg-dark: #0a1410;
  --bg-dark-2: #0f1c17;
  --bg-dark-3: #142621;
  --bg-light: #f7f5f0;
  --bg-light-2: #efeae3;
  --surface-light: #ffffff;
  --surface-dark: #1a2e27;

  /* Text */
  --text-on-dark: #e8f4ee;
  --text-on-dark-dim: #8a9994;
  --text-on-dark-mute: #5d6b65;
  --text-on-light: #0f1a17;
  --text-on-light-dim: #4a5c56;
  --text-on-light-mute: #5f7069; /* darkened to clear WCAG AA (4.8:1 on cream) for small label/note text */

  /* Functional */
  --verify-amber: #ffb547;
  --error: #c2362f; /* functional status — form validation only, not a brand hue */
  --error-bg: rgba(194, 54, 47, 0.08);
  --success: #0a7d54; /* functional status — form success confirmation; AA on white */
  --verify-bg: rgba(255, 181, 71, 0.1);
  --verify-border: rgba(255, 181, 71, 0.5);
  --cta-text: #06231f;
  --border-dark: rgba(8, 232, 222, 0.13);
  --border-dark-hover: rgba(8, 232, 222, 0.32);
  --border-light: rgba(10, 143, 134, 0.18);
  --border-light-hover: rgba(10, 143, 134, 0.35);

  /* Layout */
  --max-width: 1320px;
  --max-text: 1200px;
  --section-pad: clamp(4.5rem, 9vw, 8rem);
  --radius-card: 12px;
  --radius-pill: 999px;

  /* Type scale */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
}
