/* ============================================================
   Yourswaiting — design tokens (LOCKED, anti-AI-slop)
   ============================================================ */

:root {
  /* — Type stack ————————————————————————————————————— */
  --yw-font-display: "Geist", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif;
  --yw-font-text:    "Geist", -apple-system, BlinkMacSystemFont, "SF Pro Text",    system-ui, sans-serif;
  --yw-font-mono:    "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* — Surfaces ————————————————————————————————————— */
  --yw-bg:          #FAFAF9;    /* off-white page background — never pure white */
  --yw-bg-elev:     #FFFFFF;    /* card / panel surface */
  --yw-bg-alt:      #F5F5F4;    /* alt section background, hover surfaces */
  --yw-bg-deep:     #0A0A0A;    /* off-black for dark sections — never pure #000 */
  --yw-bg-tint:     #ECFDF5;    /* faint emerald tint (50) for accent surfaces */

  /* — Text ————————————————————————————————————— */
  --yw-fg:          #0A0A0A;    /* primary text — near-black */
  --yw-fg-muted:    #525252;    /* secondary text */
  --yw-fg-subtle:   #737373;    /* labels, eyebrows, captions */
  --yw-fg-faint:    #A3A3A3;    /* dividers / placeholders */
  --yw-fg-inverse:  #FAFAF9;    /* text on dark backgrounds */

  /* — Lines ————————————————————————————————————— */
  --yw-line:        rgba(10, 10, 10, 0.07);
  --yw-line-strong: rgba(10, 10, 10, 0.13);
  --yw-line-dark:   rgba(250, 250, 249, 0.10);

  /* — Single accent: Emerald-700 ——————————————————————— */
  --yw-accent:        #15803D;   /* emerald-700 — the only accent */
  --yw-accent-hover:  #16A34A;   /* emerald-600 — hover state */
  --yw-accent-deep:   #14532D;   /* emerald-900 — pressed state */
  --yw-accent-soft:   rgba(21, 128, 61, 0.10);
  --yw-accent-tint:   #DCFCE7;   /* emerald-100 — soft halo */

  /* — Status (used sparingly) ——————————————————————— */
  --yw-success: var(--yw-accent);
  --yw-warning: #B45309;        /* amber-700 */
  --yw-danger:  #B91C1C;        /* red-700 */

  /* — Shadows (tinted, never flat black) ——————————————— */
  --yw-shadow-color: 25 5% 12%; /* hsl: warm dark, slight green-grey tint */
  --yw-shadow-sm:  0 1px 2px hsl(var(--yw-shadow-color) / 0.04);
  --yw-shadow-md:  0 1px 2px hsl(var(--yw-shadow-color) / 0.04),
                   0 8px 24px -8px hsl(var(--yw-shadow-color) / 0.12);
  --yw-shadow-lg:  0 1px 2px hsl(var(--yw-shadow-color) / 0.04),
                   0 24px 48px -16px hsl(var(--yw-shadow-color) / 0.20);
  --yw-shadow-xl:  0 1px 2px hsl(var(--yw-shadow-color) / 0.04),
                   0 40px 80px -20px hsl(var(--yw-shadow-color) / 0.28);
  --yw-shadow-emerald: 0 1px 2px rgba(21, 128, 61, 0.10),
                       0 8px 20px -6px rgba(21, 128, 61, 0.30);

  /* — Type scale (fluid, clamp-based) ——————————————— */
  --yw-text-hero:    clamp(56px, 9vw, 128px);
  --yw-text-display: clamp(44px, 6vw, 80px);
  --yw-text-h1:      clamp(36px, 4.5vw, 64px);
  --yw-text-h2:      clamp(30px, 3.5vw, 48px);
  --yw-text-h3:      clamp(22px, 2.2vw, 28px);
  --yw-text-lede:    21px;
  --yw-text-body:    17px;
  --yw-text-small:   14px;
  --yw-text-micro:   12px;

  /* — Radii ————————————————————————————————————— */
  --yw-radius-sm:    8px;
  --yw-radius-md:    14px;
  --yw-radius-lg:    20px;
  --yw-radius-xl:    28px;
  --yw-radius-pill:  100px;

  /* — Spacing primitives ——————————————————————————— */
  --yw-space-section: clamp(80px, 11vw, 160px);
  --yw-space-block:   clamp(48px, 6vw, 96px);
  --yw-space-edge:    clamp(20px, 4vw, 48px);
  --yw-content-max:   1200px;
  --yw-wide-max:      1440px;
  --yw-prose-max:     680px;

  /* — Motion ————————————————————————————————————— */
  --yw-ease:       cubic-bezier(0.28, 0.11, 0.32, 1);
  --yw-ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --yw-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --yw-dur-fast:   180ms;
  --yw-dur-base:   240ms;
  --yw-dur-slow:   500ms;
  --yw-dur-slower: 800ms;

  /* — Z-index scale ——————————————————————————————— */
  --yw-z-nav:     50;
  --yw-z-overlay: 80;
  --yw-z-modal:   90;
  --yw-z-toast:   100;
}

/* ============================================================
   Reset + base
   ============================================================ */

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

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100dvh;
  font-family: var(--yw-font-text);
  font-size: var(--yw-text-body);
  line-height: 1.5;
  letter-spacing: -0.011em;
  color: var(--yw-fg);
  background: var(--yw-bg);
  font-feature-settings: "ss01", "cv11", "tnum";
  overflow-x: hidden;
}

::selection { background: var(--yw-accent); color: #fff; }

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

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--yw-dur-fast) var(--yw-ease);
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: transparent;
}

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
}

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