/* ==========================================
   font Google and all fonts
   ==========================================*/
/* Poppins */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* anton */
@import url('https://fonts.googleapis.com/css2?family=Mozilla+Text:wght@200..700&display=swap');




/* ==========================================
   MODERN CSS all styles
   ==========================================*/

/* CSS Custom Properties */
:root {
                      
    --background-color: #fff;
    --background-color2: #153e92;
    --background-color3: #d2dae2;
    --color-0: #153e92;
    --color-1: #ffcc00;
    --color-2: #ffffff;
    --color-3: #0f0f1c;
    --color-4: #0088d0;

    --background-gradient: linear-gradient(90deg, #f39300, #ffcd00, #ffcc00);
    --background-gradient2: linear-gradient(50deg, #0088d0, #0055a4, #0088d0, #ffcd00);
     --background-gradient3: linear-gradient(90deg, #0088d0, #0055a4, #153e92);
   



    --border-color: #ff3f34;
    --border-color2: 255,255,255;
    --border-image: linear-gradient(90deg, #ea6a50, #cd492f, #db745f) 1;
    --border-image2: linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.15), #0f191d, rgba(255,255,255,.15)) 1;

    --font-family-text: "Poppins", sans-serif;
    --font-family-heading: "Mozilla Text", sans-serif;

    --font-size-text1: 0.7rem;
	 --font-size-text-line-height-1: 0.9rem; 
    --font-size-text2: 1.1rem;
    --font-size-text-line-height2: 1.3rem; 
    --font-size-text3: 1.6rem;
    --font-size-text-line-height3: 1.6rem; 
    --font-size-text4: 2rem;
    --font-size-text-line-height4: 2rem; 
    --font-size-text5: 2.5rem;
    --font-size-text-line-height5: 2.5rem; 
    --font-size-text6: 3rem;
    --font-size-text-line-height6: 3rem; 

    --font-size-h1: 3rem;
    --font-size-text-line-height35: 3.5rem;

    --font-weight2: 200;
    --font-weight3: 300;
    --font-weight4: 400;
    --font-weight5: 500;
    --font-weight6: 600;
    --font-weight7: 700;
    --font-weight8: 800;
    --font-weight9: 900;

    /*-- animacje */
    /* Animacja nie może być ustawiona jako zmienna CSS, ale możesz ustawić kolory gradientu jako zmienne */
    --border-gradient-1: linear-gradient(90deg, #6c8cec, #b568f4, #eea73a, #dc5ac3);
    --border-gradient-2: linear-gradient(90deg, #b568f4, #eea73a, #dc5ac3, #6c8cec);
    --border-gradient-3: linear-gradient(90deg, #eea73a, #dc5ac3, #6c8cec, #b568f4);
    --border-gradient-4: linear-gradient(90deg, #dc5ac3, #6c8cec, #b568f4, #eea73a);
    --border-gradient-5: linear-gradient(90deg, #eba139, #dc5ac3);
}







body{
    margin: 0;
    padding: 0;
    font-family: var(--font-family-text);
    font-size: var(--font-size-text2);
    color: var(--text-color);
    background-color: var(--background-color);
}

/* ==========================================
   Animacja //Efekt snap scroll, znany też jako scroll hijacking lub scroll snapping, polega na tym, że podczas przewijania strona zatrzymuje się "na sztywno" na kolejnych sekcjach — często pełnoekranowych.
   ========================================== */


/* ==========================================
   Animacja //Efekt snap scroll, znany też jako scroll hijacking lub scroll snapping, polega na tym, że podczas przewijania strona zatrzymuje się "na sztywno" na kolejnych sekcjach — często pełnoekranowych.
   ========================================== */


/* ==========================================
   SMALL MOBILE (max-width: 1199px)
   ========================================== */
@media (max-width: 1199px) {
/* CSS Custom Properties */
:root {

}
/* CSS Custom Properties */




}



/* ==========================================
   SMALL MOBILE (max-width: 767px)
   ========================================== */
@media (max-width: 767px) {
/* CSS Custom Properties */
:root {
    --font-size-text2: 1rem;
    --font-size-text-line-height2: 1.2rem; 
    --font-size-h1: 1.8rem;
    --font-size-text-line-height35: 2.3rem;
}
/* CSS Custom Properties */




}



/* ==========================================
   SMALL MOBILE (max-width: 480px)
   ========================================== */
@media (max-width: 480px) {
/* CSS Custom Properties */
:root {

   --font-size-text1: 0.9rem;
	 --font-size-text-line-height-1: 1.1rem; 
    --font-size-text2: 1rem;
    --font-size-text-line-height2: 1.2rem; 
    --font-size-text3: 1.4rem;
    --font-size-text-line-height3: 1.4rem; 
    --font-size-text4: 1.8rem;
    --font-size-text-line-height4: 1.8rem; 
    --font-size-text5: 2.3rem;
    --font-size-text-line-height5: 2.5rem; 
    --font-size-text6: 2.8rem;
    --font-size-text-line-height6: 2.8rem; 

    --font-size-h1: 1.5rem;
    --font-size-text-line-height35: 1.8rem;
}


/* CSS Custom Properties */




}