/* ============================================================
   Vita Med — Design Tokens
   Estetik: etibar + dəqiqlik + istilik. Klişe deyil.
   Palitra: həyat təravəti (teal) + isti mərcan (coral) + dərin mürəkkəb (ink)
   ============================================================ */

:root {
    /* ── Primary — Vitality Teal ──────────────────────────── */
    --c-primary-50:  #ecfbf7;
    --c-primary-100: #d0f5ec;
    --c-primary-200: #a3e9da;
    --c-primary-300: #6dd6c3;
    --c-primary-400: #38bba6;
    --c-primary-500: #18a08c;
    --c-primary-600: #0e8073;   /* əsas brend rəngi */
    --c-primary-700: #0e665d;
    --c-primary-800: #11514b;
    --c-primary-900: #12433f;
    --c-primary-950: #032725;

    /* ── Secondary — Deep Ink (etibar) ───────────────────── */
    --c-secondary-50:  #f1f6fb;
    --c-secondary-100: #e1ebf5;
    --c-secondary-200: #c9dcec;
    --c-secondary-300: #a3c4df;
    --c-secondary-400: #76a4ce;
    --c-secondary-500: #5586bd;
    --c-secondary-600: #426ca6;
    --c-secondary-700: #395887;
    --c-secondary-800: #1e3a5f;   /* dərin naviqasiya/footer */
    --c-secondary-900: #16263b;
    --c-secondary-950: #0d1826;

    /* ── Accent — Warm Coral (istilik) ───────────────────── */
    --c-accent-50:  #fff4f1;
    --c-accent-100: #ffe5de;
    --c-accent-200: #ffcdc0;
    --c-accent-300: #ffaa94;
    --c-accent-400: #fb7e60;
    --c-accent-500: #f15a39;   /* isti vurğu / ikinci CTA */
    --c-accent-600: #de3f1f;
    --c-accent-700: #b92f16;
    --c-accent-800: #992a17;
    --c-accent-900: #7e281a;

    /* ── Neutral — Slate ─────────────────────────────────── */
    --c-neutral-0:   #ffffff;
    --c-neutral-50:  #f8fafb;
    --c-neutral-100: #eef2f4;
    --c-neutral-200: #dde4e8;
    --c-neutral-300: #c2ccd3;
    --c-neutral-400: #94a3ad;
    --c-neutral-500: #6b7984;
    --c-neutral-600: #515e68;
    --c-neutral-700: #3e4951;
    --c-neutral-800: #283036;
    --c-neutral-900: #161c21;

    /* ── Semantic ────────────────────────────────────────── */
    --c-success-50:  #ecfdf3; --c-success-500: #16a34a; --c-success-700: #15803d;
    --c-warning-50:  #fffbeb; --c-warning-500: #f59e0b; --c-warning-700: #b45309;
    --c-error-50:    #fef2f2; --c-error-500:   #dc2626; --c-error-700:   #b91c1c;

    /* ── Rol əsaslı aliaslar ─────────────────────────────── */
    --color-bg:          var(--c-neutral-0);
    --color-bg-subtle:   var(--c-neutral-50);
    --color-bg-muted:    var(--c-primary-50);
    --color-surface:     var(--c-neutral-0);
    --color-text:        var(--c-neutral-800);
    --color-text-soft:   var(--c-neutral-600);
    --color-text-faint:  var(--c-neutral-500);
    --color-heading:     var(--c-secondary-900);
    --color-border:      var(--c-neutral-200);
    --color-brand:       var(--c-primary-600);
    --color-brand-ink:   var(--c-primary-800);
    --color-on-brand:    #ffffff;

    /* ── Tipoqrafiya ─────────────────────────────────────── */
    --font-display: "Fraunces", Georgia, "Times New Roman", serif;
    --font-body: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

    --fs-xs:   0.78rem;   /* 12.5px */
    --fs-sm:   0.875rem;  /* 14px   */
    --fs-base: 1rem;      /* 16px   */
    --fs-md:   1.125rem;  /* 18px   */
    --fs-lg:   1.333rem;
    --fs-xl:   1.6rem;
    --fs-2xl:  2rem;
    --fs-3xl:  2.5rem;
    --fs-4xl:  3.15rem;
    --fs-5xl:  3.95rem;

    --lh-tight: 1.12;
    --lh-snug:  1.3;
    --lh-base:  1.65;
    --fw-reg: 400; --fw-med: 500; --fw-semi: 600; --fw-bold: 700; --fw-black: 800;

    /* ── Spacing (4px base) ──────────────────────────────── */
    --sp-1: 0.25rem; --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
    --sp-5: 1.25rem; --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-10: 2.5rem;
    --sp-12: 3rem;   --sp-16: 4rem;   --sp-20: 5rem;   --sp-24: 6rem;
    --sp-32: 8rem;

    /* ── Radius ──────────────────────────────────────────── */
    --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-xl: 24px; --r-2xl: 32px; --r-full: 999px;

    /* ── Shadow ──────────────────────────────────────────── */
    --sh-xs: 0 1px 2px rgba(14,32,45,.06);
    --sh-sm: 0 2px 8px rgba(14,32,45,.07);
    --sh-md: 0 8px 24px rgba(14,32,45,.09);
    --sh-lg: 0 16px 48px rgba(14,32,45,.12);
    --sh-brand: 0 12px 30px rgba(14,128,115,.22);

    /* ── Transition ──────────────────────────────────────── */
    --t-fast: 140ms cubic-bezier(.4,0,.2,1);
    --t-base: 240ms cubic-bezier(.4,0,.2,1);
    --t-slow: 420ms cubic-bezier(.22,1,.36,1);

    /* ── Layout ──────────────────────────────────────────── */
    --container: 1200px;
    --container-narrow: 820px;
    --header-h: 76px;

    /* ── Z-index ─────────────────────────────────────────── */
    --z-base: 1; --z-dropdown: 100; --z-sticky: 200; --z-header: 300;
    --z-drawer: 400; --z-modal: 500; --z-toast: 600; --z-top: 700;
}

@media (max-width: 768px) {
    :root {
        --fs-4xl: 2.4rem; --fs-5xl: 2.75rem; --fs-3xl: 2rem; --fs-2xl: 1.6rem;
        --header-h: 64px;
    }
}