/**
 * Design tokens — tüm frontend modülleri buradan türetilir
 */
:root {
    --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-display: 'Fraunces', 'Times New Roman', serif;
    --font-carousel: 'Fraunces', 'Times New Roman', serif;

    --color-bg: #f3f6f5;
    --color-surface: #fbfcfc;
    --color-surface-elevated: #ffffff;
    --color-border: #e4ebe9;
    --color-border-strong: #cfdad7;

    --color-text: #1a2b2a;
    --color-text-muted: #5c6f6d;
    --color-text-subtle: #8a9b98;

    --color-primary: #0d7377;
    --color-primary-hover: #14919b;
    --color-primary-soft: #e6f4f4;
    --color-primary-contrast: #ffffff;

    --color-accent: #c4a574;
    --color-success: #059669;
    --color-danger: #dc2626;
    --color-whatsapp: #25d366;

    --header-height: 4.25rem;
    --container-max: 1200px;
    --container-pad: clamp(1.1rem, 3vw, 2rem);

    --radius-sm: 0.5rem;
    --radius-md: 0.75rem;
    --radius-lg: 1rem;
    --radius-xl: 1.25rem;
    --radius-2xl: 1.5rem;
    --radius-full: 9999px;

    --shadow-xs: 0 1px 2px rgb(26 43 42 / 0.04);
    --shadow-sm: 0 6px 20px rgb(26 43 42 / 0.05);
    --shadow-md: 0 14px 36px rgb(26 43 42 / 0.07);
    --shadow-lg: 0 24px 48px rgb(26 43 42 / 0.09);
    --shadow-glow: 0 0 0 1px rgb(13 115 119 / 0.06), 0 10px 28px rgb(13 115 119 / 0.1);

    --transition: 220ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 380ms cubic-bezier(0.4, 0, 0.2, 1);

    /* legacy aliases — mevcut sınıflar kırılmasın */
    --primary: var(--color-primary);
    --primary-dark: #0a5c5f;
    --theme-topbar: var(--primary-dark);
    --theme-stars-bg: #0a2a2c;
    --primary-light: var(--color-primary-hover);
    --white: #fff;
    --gray-50: #f3f6f5;
    --gray-100: #eaf0ee;
    --gray-200: var(--color-border);
    --gray-300: var(--color-border-strong);
    --gray-400: var(--color-text-subtle);
    --gray-500: var(--color-text-muted);
    --gray-600: #475569;
    --gray-700: #334155;
    --gray-800: #1e293b;
    --gray-900: var(--color-text);
    --bg-primary: var(--color-surface);
    --bg-secondary: var(--color-bg);
    --bg-white: var(--color-surface-elevated);
    --bg-light: var(--color-bg);
    --bg-dark: #132221;
    --shadow-xl: var(--shadow-lg);
    --radius-3xl: 2rem;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;
    --font-size-5xl: 3rem;
    --transition-base: var(--transition);
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
}