:root {

	--logo-light: url('/images/logo-aktywnelato-pl-pbsol-v1-light.svg');
	--logo-dark: url('/images/logo-aktywnelato-pl-pbsol-v1-dark.svg');

	--kolor-tlo: #c0c0c0;
	--kolor-ramka: #e0e3ea;
	--kolor-uwaga: #a00000;

	--kolor-tytul: #101828;
	--kolor-opis: #4a5565;

/* 	--kolor-light: #eaf4eb; */
/* 	--kolor-normal: #2e8c38; */
/* 	--kolor-dark: #23692a; */
/* 	--kolor-darker: #103114; */

/* Emerald */
	--kolor-light: #e9f0ef;
	--kolor-normal: #1f6b5c;
	--kolor-dark: #175045;
	--kolor-darker: #0b2520;

/* Warm Sand */
	--kolor-navi-tlo: #fbf8f4;
	--kolor-navi-border: #f2e9dc;

/* Coral Summer */
	--kolor-lato-normal: #ff6b4a;

/* Soft White */
	--kolor-softwhite-light: #fffffe;
	--kolor-softwhite-normal: #fafaf8;
	--kolor-softwhite-dark: #bcbcba;
	--kolor-softwhite-dark-hover: #969695;
	--kolor-softwhite-darker: #585857;

	--ramka: 1px solid var(--kolor-ramka);
	--ramka1normal: 1px solid var(--kolor-normal);
	--ramka2normal: 2px solid var(--kolor-normal);
	--ramka1disabled: 1px solid var(--kolor-softwhite-dark);

	--zaokraglenia: 8px;
	--zaokraglenia-form: 8px;
	--zaokraglenia-lato: 14px;

}

body > footer {background-color: var(--kolor-darker);}
body > footer > div > div:nth-of-type(1) > img {min-width: 200px; width: 65%;}

#logo {background-image: var(--logo-light); background-repeat: no-repeat; display: block; height: 44px; width: 206px;}
div.navi {position: fixed; top: 0; transition: background 0.4s ease, box-shadow 0.4s ease; z-index: 990;}
div.navi:not(.open) {max-width: 1920px; padding: 0; }
div.navi > nav {border-radius: 22px; grid-template-columns: 1fr 500px 1fr; margin: 0 auto; max-width: 1440px; padding: 0 40px;}
div.navi:not(.open) > nav {backdrop-filter: none; background: none; border: none; border-radius: 0; box-shadow: none;}
div.navi > nav > div:nth-of-type(2) {justify-content: space-evenly;}
div.navi:not(.open) > nav > div:nth-of-type(2) > a {color: var(--kolor-dark);}
div.navi > nav > div:nth-of-type(3) > form > input {width: 131px;}
div.navi > nav > button {background-image: url('/images/iko-menu-biale.svg');}
div.navi.open > nav > button, div.navi.solid.open > nav > button {background: url('/images/ikony/x_black.svg') no-repeat center; background-size: contain;}
div.navi.solid #logo, body:not(.has-hero) #logo, div.navi.open #logo {background-image: var(--logo-dark);}
div.navi.solid:not(.open), body:not(.has-hero) div.navi:not(.open) {background-color: var(--kolor-navi-tlo); border-bottom: 1px solid var(--kolor-navi-border); box-shadow: 0px 3px 15px 0px #0000001a;}
div.navi.solid > nav > button, body:not(.has-hero) > div.navi > nav > button {background-image: url('/images/iko-menu-lato.svg');}
body.has-hero > div.navi:not(.open):not(.solid) > nav > div:nth-of-type(2) > a {color: #fffffe;}
body:not(.has-hero) {margin-top: 88px;}

button {cursor: pointer; font-weight: 600; text-wrap-mode: nowrap; width: fit-content;}
button.jasny {background: #ffffff; border: var(--ramka1normal); border-radius: 32px; box-shadow: 0px -3px 10px 0px #13234a4d inset; color: var(--kolor-normal); padding: 16px 24px; transition: padding 0.2s ease, margin 0.2s ease;}
button.ciemny {background: var(--kolor-normal); border: 0; border-radius: 32px; box-shadow: 0px 2px 5px 0px #ffffffbf inset, 0px -3px 10px 0px #13234a80 inset; color: #ffffff; padding: 16px 24px; transition: padding 0.2s ease, margin 0.2s ease;}
button.ciemny_mini {background: var(--kolor-normal); border: 0; border-radius: 32px; box-shadow: 0px 2px 5px 0px #ffffffbf inset, 0px -3px 10px 0px #13234a80 inset; color: #ffffff; padding: 8px 24px; transition: padding 0.2s ease, margin 0.2s ease;}
button.ciemny:not([disabled]):hover, button.jasny:not([disabled]):hover {margin: -4px; padding: 20px 28px;}
button.ciemny_mini:not([disabled]):hover {margin: -4px; padding: 12px 28px;}
button.jasny:is([disabled]), button.ciemny:is([disabled]), button.ciemny_mini:is([disabled]) {background-color: var(--kolor-softwhite-normal); color: var(--kolor-softwhite-dark-hover);}
button.jasny:is([disabled]) {border: var(--ramka1disabled);}

@media (max-width: 1399px) {
	div.navi > nav {grid-template-columns: 1fr 430px 1fr; grid-template-areas: "logo dzialy wyszukiwarka";}
	div.navi > nav > div:nth-of-type(2) {display: flex; padding-bottom: 0;}
	div.navi > nav > button {display: none;}
}

@media (max-width: 999px) {
	body:not(.has-hero) {margin-top: 64px;}
	div.navi > nav {grid-template-columns: 1fr 1fr 30px; grid-template-areas: "logo wyszukiwarka menu" "dzialy dzialy dzialy"; padding: 0 24px;}
	div.navi > nav > div:nth-of-type(2) {display: none; margin-bottom: 30px;}
	div.navi > nav > button {display: block;}
}

@media (max-width: 599px) {
	body:not(.has-hero) {margin-top: 58px;}
	div.navi #logo {background-size: 172px 32px; height: 32px; width: 172px;}
	div.navi > nav {grid-template-columns: 1fr 30px; grid-template-areas: "logo menu" "dzialy dzialy" "wyszukiwarka wyszukiwarka";}
	div.navi > nav > div:nth-of-type(3) > form > input {width: 100%;}
}