/*
 * Damian Zaborowski — Design Tokens
 * Wszystkie wartości projektowe jako CSS variables.
 * Importowane jako pierwsze, wszystkie inne pliki bazują na tych zmiennych.
 */

:root {
    /* ============ KOLORY ============ */
    /* Czerń jako baza, złoto jako akcent, granat jako warstwa wspierająca */

    --dz-cream:       #050505;   /* tło body — głęboka noc */
    --dz-paper:       #111111;   /* sekcje alt, "papier" węgielny */
    --dz-white:       #0a0a0a;   /* sekcje "jasne" — wciąż ciemne */
    --dz-charcoal:    #0a0a0a;   /* alias */

    --dz-ink:         #f4ecd8;   /* tekst body — ciepła kość słoniowa */
    --dz-ink-soft:    rgba(244, 236, 216, 0.85);
    --dz-ink-faint:   rgba(244, 236, 216, 0.55);
    --dz-ink-ghost:   rgba(244, 236, 216, 0.35);
    --dz-muted:       #8a8578;

    --dz-gold:        #D4AF37;
    --dz-gold-soft:   #e8cf7a;
    --dz-gold-faint:  rgba(212, 175, 55, 0.25);
    --dz-gold-ghost:  rgba(212, 175, 55, 0.08);

    --dz-navy:        #1E3A5F;
    --dz-navy-deep:   #0c1a2d;
    --dz-navy-soft:   #2a4970;
    --dz-blue:        #6aa6ee;
    --dz-blue-soft:   #1a2840;

    --dz-rule:        #3a321c;   /* ciemnozłota linia */
    --dz-rule-soft:   #1c1a14;

    /* ============ TYPOGRAFIA ============ */

    --dz-font-serif:  "Cormorant Garamond", "EB Garamond", Georgia, Times, serif;
    --dz-font-sans:   "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

    /* Skala — clamp(min, fluid, max) */
    --dz-step--1:     clamp(11px, 0.72vw, 12px);   /* labelki, captions, eyebrows */
    --dz-step-0:      clamp(15px, 1.05vw, 17px);   /* body */
    --dz-step-1:      clamp(18px, 1.3vw, 21px);    /* body large, sub */
    --dz-step-2:      clamp(24px, 2vw, 32px);      /* h4, sub-hero, blockquote */
    --dz-step-3:      clamp(36px, 3.8vw, 60px);    /* h2 */
    --dz-step-4:      clamp(56px, 7.5vw, 120px);   /* h1, display */
    --dz-step-5:      clamp(96px, 14vw, 220px);    /* mega numbers */

    /* ============ LAYOUT ============ */

    --dz-max:         1360px;                       /* główny kontener */
    --dz-max-narrow:  900px;                        /* kontener wąski (cytaty, manifest) */
    --dz-gutter:      clamp(24px, 4vw, 64px);       /* padding poziomy */

    /* ============ SPACING ============ */

    --dz-space-xs:    8px;
    --dz-space-sm:    16px;
    --dz-space-md:    24px;
    --dz-space-lg:    40px;
    --dz-space-xl:    64px;
    --dz-space-2xl:   96px;
    --dz-space-3xl:   clamp(80px, 10vw, 140px);    /* padding sekcji */

    /* ============ MOTION ============ */

    --dz-ease:        cubic-bezier(0.22, 1, 0.36, 1);
    --dz-ease-out:    cubic-bezier(0.2, 0.7, 0.2, 1);
    --dz-duration:    220ms;
    --dz-duration-slow: 700ms;

    /* ============ SHADOWS ============ */

    --dz-shadow-book:
        0 40px 80px -30px rgba(20, 33, 61, 0.55),
        0 12px 24px -10px rgba(20, 33, 61, 0.35);

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

    --dz-z-header:    30;
    --dz-z-overlay:   50;
    --dz-z-modal:     100;
}