/**
 * Dr. Tiber Menteşe - Design Tokens (CSS Variables)
 * Tüm tema bu değişkenler üzerine inşa edilmiştir.
 */

:root {
    /* =====================================================
       RENK SİSTEMİ
       ===================================================== */

    /* Ana Renkler */
    --color-navy:          #0A192F;   /* Ana lacivert */
    --color-navy-dark:     #060F1C;   /* Çok koyu lacivert */
    --color-navy-medium:   #112240;   /* Orta lacivert */
    --color-navy-light:    #1E3A5F;   /* Açık lacivert */
    --color-navy-muted:    #233554;   /* Soluk lacivert */

    /* Vurgu Rengi - Altın */
    --color-gold:          #C5A059;   /* Ana altın */
    --color-gold-light:    #D4B578;   /* Açık altın */
    --color-gold-dark:     #A8883D;   /* Koyu altın */
    --color-gold-subtle:   rgba(197, 160, 89, 0.12); /* Çok soluk altın */

    /* Arka Plan Renkleri */
    --color-white:         #FFFFFF;
    --color-offwhite:      #F8F8F8;
    --color-offwhite-2:    #FAFAFA;
    --color-surface:       #F3F4F5;
    --color-surface-light: #EEF0F2;

    /* Metin Renkleri */
    --color-text-primary:  #0A192F;
    --color-text-secondary:#4A5568;
    --color-text-muted:    #718096;
    --color-text-light:    #A0AEC0;
    --color-text-white:    #FFFFFF;
    --color-text-white-80: rgba(255, 255, 255, 0.80);
    --color-text-white-60: rgba(255, 255, 255, 0.60);
    --color-text-white-40: rgba(255, 255, 255, 0.40);

    /* Kenarlık Renkleri */
    --color-border:        #E2E8F0;
    --color-border-light:  #EDF2F7;
    --color-border-dark:   #CBD5E0;
    --color-border-navy:   rgba(255, 255, 255, 0.10);

    /* WhatsApp */
    --color-whatsapp:      #25D366;
    --color-whatsapp-dark: #128C7E;

    /* =====================================================
       TİPOGRAFİ
       ===================================================== */

    --font-family:         'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;

    /* Font Ağırlıkları */
    --font-light:          300;
    --font-regular:        400;
    --font-medium:         500;
    --font-semibold:       600;
    --font-bold:           700;
    --font-extrabold:      800;

    /* Font Boyutları - Desktop */
    --text-xs:             0.75rem;    /* 12px */
    --text-sm:             0.875rem;   /* 14px */
    --text-base:           1rem;       /* 16px */
    --text-md:             1.125rem;   /* 18px */
    --text-lg:             1.25rem;    /* 20px */
    --text-xl:             1.375rem;   /* 22px */

    --h6:                  1rem;       /* 16px */
    --h5:                  1.125rem;   /* 18px */
    --h4:                  1.375rem;   /* 22px */
    --h3:                  1.75rem;    /* 28px */
    --h2:                  2.25rem;    /* 36px */
    --h1:                  3rem;       /* 48px */
    --display:             3.75rem;    /* 60px */
    --display-lg:          4.5rem;     /* 72px */

    /* Line Heights */
    --leading-tight:       1.1;
    --leading-snug:        1.2;
    --leading-normal:      1.5;
    --leading-relaxed:     1.7;
    --leading-loose:       1.9;

    /* Letter Spacing */
    --tracking-tight:      -0.03em;
    --tracking-snug:       -0.02em;
    --tracking-normal:     0;
    --tracking-wide:       0.05em;
    --tracking-wider:      0.1em;
    --tracking-widest:     0.2em;

    /* =====================================================
       SPACING SİSTEMİ (8px tabanlı)
       ===================================================== */

    --space-1:    0.25rem;   /* 4px */
    --space-2:    0.5rem;    /* 8px */
    --space-3:    0.75rem;   /* 12px */
    --space-4:    1rem;      /* 16px */
    --space-5:    1.25rem;   /* 20px */
    --space-6:    1.5rem;    /* 24px */
    --space-8:    2rem;      /* 32px */
    --space-10:   2.5rem;    /* 40px */
    --space-12:   3rem;      /* 48px */
    --space-14:   3.5rem;    /* 56px */
    --space-16:   4rem;      /* 64px */
    --space-20:   5rem;      /* 80px */
    --space-24:   6rem;      /* 96px */
    --space-32:   8rem;      /* 128px */
    --space-40:   10rem;     /* 160px */

    /* Section Padding */
    --section-padding-y:   var(--space-24);
    --section-padding-x:   var(--space-8);

    /* Container */
    --container-max:       1320px;
    --container-padding:   1.5rem;

    /* =====================================================
       BORDER RADIUS
       ===================================================== */

    --radius-sm:           0.375rem;   /* 6px */
    --radius-md:           0.625rem;   /* 10px */
    --radius-lg:           1rem;       /* 16px */
    --radius-xl:           1.5rem;     /* 24px */
    --radius-2xl:          2rem;       /* 32px */
    --radius-3xl:          2.5rem;     /* 40px */
    --radius-full:         9999px;

    /* =====================================================
       GÖLGE SİSTEMİ
       ===================================================== */

    --shadow-xs:    0 1px 2px rgba(10, 25, 47, 0.04);
    --shadow-sm:    0 2px 8px rgba(10, 25, 47, 0.06);
    --shadow-md:    0 4px 20px rgba(10, 25, 47, 0.10);
    --shadow-lg:    0 8px 32px rgba(10, 25, 47, 0.14);
    --shadow-xl:    0 16px 48px rgba(10, 25, 47, 0.18);
    --shadow-2xl:   0 24px 64px rgba(10, 25, 47, 0.22);
    --shadow-gold:  0 8px 32px rgba(197, 160, 89, 0.20);
    --shadow-navy:  0 8px 32px rgba(10, 25, 47, 0.40);

    /* =====================================================
       ANİMASYON / TRANSİSYON
       ===================================================== */

    --ease-default:  cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-in:       cubic-bezier(0.42, 0, 1, 1);
    --ease-out:      cubic-bezier(0, 0, 0.58, 1);
    --ease-bounce:   cubic-bezier(0.34, 1.56, 0.64, 1);

    --duration-fast:    150ms;
    --duration-normal:  300ms;
    --duration-slow:    500ms;
    --duration-slower:  800ms;

    /* =====================================================
       Z-INDEX KATMANLARI
       ===================================================== */

    --z-base:       0;
    --z-raised:     10;
    --z-dropdown:   100;
    --z-sticky:     200;
    --z-overlay:    300;
    --z-modal:      400;
    --z-notification: 500;
    --z-whatsapp:   600;

    /* =====================================================
       HEADER
       ===================================================== */

    --header-height:        80px;
    --header-height-mobile: 64px;
}

/* =====================================================
   RESPONSIVE OVERRIDES
   ===================================================== */

@media (max-width: 1024px) {
    :root {
        --h1:      2.25rem;    /* 36px */
        --h2:      1.875rem;   /* 30px */
        --h3:      1.5rem;     /* 24px */
        --h4:      1.25rem;    /* 20px */
        --display: 2.75rem;    /* 44px */
        --display-lg: 3.25rem;
        --section-padding-y: var(--space-16);
    }
}

@media (max-width: 768px) {
    :root {
        --h1:      2rem;       /* 32px */
        --h2:      1.625rem;   /* 26px */
        --h3:      1.375rem;   /* 22px */
        --h4:      1.25rem;    /* 20px */
        --display: 2.25rem;    /* 36px */
        --display-lg: 2.5rem;
        --section-padding-y: var(--space-12);
        --container-padding: 1.25rem;
    }
}
