/* ====================================================
   FONT DECLARATIONS
   ==================================================== */
@font-face {
    font-family: 'Asap Condensed';
    src: url('../fonts/AsapCondensed-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Asap Condensed';
    src: url('../fonts/AsapCondensed-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Asap Condensed';
    src: url('../fonts/AsapCondensed-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Asap Condensed';
    src: url('../fonts/AsapCondensed-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Asap Condensed';
    src: url('../fonts/AsapCondensed-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Asap Condensed';
    src: url('../fonts/AsapCondensed-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ====================================================
   DESIGN TOKENS
   ==================================================== */
:root {
    /* Kolory */
    --c-green:       #22b24c;
    --c-green-dark:  #1a8f3c;
    --c-green-pale:  #e8f8ee;
    --c-blue:        #61a4ff;
    --c-blue-dark:   #3a7fd4;
    --c-blue-light:  #cae4ff;
    --c-blue-pale:   #effbff;
    --c-purple:      #c162ff;
    --c-purple-dark: #9e3fd4;
    --c-yellow:      #fed228;
    --c-yellow-dark: #d4a800;
    --c-navy:        #021851;
    --c-navy-90:     rgba(2, 24, 81, 0.9);
    --c-white:       #ffffff;
    --c-gray-50:     #f8fbff;
    --c-gray-100:    #f1f1f1;
    --c-gray-200:    #e0e0e0;
    --c-text:        #1a1a2e;
    --c-text-muted:  #5a6070;

    /* Typografia */
    --font:          'Asap Condensed', 'Arial Narrow', Arial, sans-serif;
    --fw-light:      300;
    --fw-regular:    400;
    --fw-medium:     500;
    --fw-semibold:   600;
    --fw-bold:       700;

    /* Skalowanie nagłówków */
    --fs-h1:  clamp(1.7rem, 3.5vw, 2.8rem);
    --fs-h2:  clamp(1.3rem, 2.5vw, 1.9rem);
    --fs-h3:  clamp(1.0rem, 1.7vw, 1.4rem);
    --fs-h4:  clamp(1.05rem, 2vw, 1.35rem);
    --fs-body: 1.05rem;
    --fs-sm:  0.9rem;
    --lh:     1.7;

    /* Zaokrąglenia */
    --r-sm:  8px;
    --r-md:  16px;
    --r-lg:  24px;
    --r-xl:  36px;
    --r-full: 9999px;

    /* Cienie */
    --shadow-xs: 0 1px 4px rgba(2, 24, 81, 0.07);
    --shadow-sm: 0 2px 10px rgba(2, 24, 81, 0.09);
    --shadow-md: 0 4px 24px rgba(2, 24, 81, 0.12);
    --shadow-lg: 0 8px 48px rgba(2, 24, 81, 0.16);

    /* Layout */
    --container:        1400px;
    --container-narrow: 900px;
    --container-text:   720px;

    /* Spacing */
    --sp-xs:  0.5rem;
    --sp-sm:  1rem;
    --sp-md:  2rem;
    --sp-lg:  4rem;
    --sp-xl:  6rem;
    --sp-2xl: 8rem;

    /* Header */
    --header-h: 80px;

    /* Transitions */
    --t-fast:   0.15s ease;
    --t-normal: 0.25s ease;
    --t-slow:   0.4s ease;
}