/* YY Tokens - Design system primitives */
:root {
  /* Colors - 2026 modern midnight blue palette (daha açık) */
  --yy-bg: #0D1527;
  --yy-bg-2: #0A1120;
  --yy-surface: #172037;
  --yy-surface-2: #1F2A44;
  --yy-surface-3: #28355A;
  --yy-border: rgba(255, 255, 255, 0.10);
  --yy-border-strong: rgba(255, 255, 255, 0.18);
  --yy-text: #EEF2FC;
  --yy-text-mute: #B4BED9;
  --yy-text-soft: #7E8AAB;
  --yy-brand: oklch(0.64 0.19 255);
  --yy-brand-2: oklch(0.54 0.18 255);
  --yy-brand-weak: color-mix(in srgb, var(--yy-brand) 16%, transparent);
  --yy-accent: oklch(0.82 0.13 210);
  --yy-accent-weak: rgba(34, 211, 238, 0.14);
  --yy-danger: #EF4444;
  --yy-danger-weak: rgba(239, 68, 68, 0.14);
  --yy-success: #10B981;
  --yy-warn: #F59E0B;
  --yy-whatsapp: #25D366;

  /* Typography */
  --yy-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --yy-font-display: var(--yy-font);
  --yy-lh-tight: 1.15;
  --yy-lh-base: 1.55;
  --yy-lh-loose: 1.75;

  /* Font sizes */
  --yy-fs-xs: 0.8125rem;
  --yy-fs-sm: 0.9375rem;
  --yy-fs-base: 1rem;
  --yy-fs-lg: 1.125rem;
  --yy-fs-xl: 1.375rem;
  --yy-fs-2xl: 1.625rem;
  --yy-fs-3xl: 2rem;
  --yy-fs-4xl: 2.5rem;
  --yy-fs-hero: clamp(2rem, 3.6vw, 3.4rem);

  /* Spacing (8px grid) */
  --yy-sp-0: 0;
  --yy-sp-1: 0.25rem;
  --yy-sp-2: 0.5rem;
  --yy-sp-3: 0.75rem;
  --yy-sp-4: 1rem;
  --yy-sp-5: 1.5rem;
  --yy-sp-6: 2rem;
  --yy-sp-7: 3rem;
  --yy-sp-8: 4rem;
  --yy-sp-9: 6rem;
  --yy-sp-10: 8rem;

  /* Radius */
  --yy-r-xs: 6px;
  --yy-r-sm: 10px;
  --yy-r-md: 14px;
  --yy-r-lg: 20px;
  --yy-r-xl: 28px;
  --yy-r-full: 9999px;

  /* Shadows */
  --yy-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
  --yy-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --yy-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.36);
  --yy-shadow-lg: 0 28px 80px rgba(0, 0, 0, 0.48);
  --yy-shadow-brand: 0 16px 40px rgba(36, 107, 253, 0.38);
  --yy-shadow-danger: 0 16px 40px rgba(239, 68, 68, 0.38);
  --yy-shadow-whatsapp: 0 10px 28px rgba(37, 211, 102, 0.42);

  /* Motion */
  --yy-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --yy-ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --yy-ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --yy-dur-fast: 150ms;
  --yy-dur-base: 260ms;
  --yy-dur-slow: 420ms;

  /* Layout */
  --yy-container: 1280px;
  --yy-container-sm: 960px;
  --yy-container-xs: 720px;
  --yy-header-h: 76px;
  --yy-header-h-scrolled: 64px;

  /* Effects */
  --yy-glass: rgba(23, 32, 55, 0.72);
  --yy-glass-strong: rgba(23, 32, 55, 0.86);
  --yy-blur: 16px;
  --yy-hero-grid: linear-gradient(120deg, rgba(36, 107, 253, 0.22), rgba(34, 211, 238, 0.08) 40%, rgba(13, 21, 39, 0) 70%);
  --yy-brand-gradient: linear-gradient(135deg, #246BFD 0%, #3A8DFF 50%, #22D3EE 100%);
  --yy-brand-gradient-vertical: linear-gradient(180deg, #246BFD 0%, #1A52D4 100%);
  --yy-dark-gradient: linear-gradient(180deg, #0D1527 0%, #172037 100%);
}

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