/* ===========================================================
   HEALTHLIVE
   JADŁOSPIS - DIETA O NISKIM INDEKSIE GLIKEMICZNYM
=========================================================== */


/* ===========================================================
   ZMIENNE
=========================================================== */

:root{

--nav-bg: #1b233d;

--bg:#1f2638;

--surface:#283250;

--surface-light:#323e63;

--surface-dark:#1b233d;

--card:#2f3a5d;

--card-hover:#38466e;

--text:#eef3ff;

--text-light:#c9d3ee;

--muted:#8fa1c0;

--accent:#3fa795;

--accent-light:#53c4b0;

--highlight:#f5a35c;

--danger:#ef6b6b;

--shadow:
0 18px 40px rgba(0,0,0,.25);

--radius:22px;

--radius-small:14px;

--transition:.35s ease;

--container:1100px;

--nav-height:72px;

}



/* ===========================================================
   RESET
=========================================================== */

*,
*::before,
*::after{

margin:0;

padding:0;

box-sizing:border-box;

}

html{

scroll-behavior:smooth;

}

body{

background:var(--bg);

color:var(--text);

font-family:"Montserrat",sans-serif;

font-size:clamp(.95rem,1vw,1.05rem);

line-height:1.8;

-webkit-font-smoothing:antialiased;

overflow-x:hidden;

padding-top:72px;

}


/* NAVIGATION */
.nav-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: var(--nav-bg);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	padding: 0.5rem 1rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 0.5rem;
	z-index: 9999;
	height: 72px;
	padding: 0 1rem;
}

.brand a {
	color: orange;
	font-weight: 550;
	font-size: clamp(1.2rem, 2.5vw, 1.8rem);
	text-decoration: none;
	white-space: nowrap;
}

.nav-toggle {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.nav-label {
	display: none;
	cursor: pointer;
	padding: 0.5rem;
	user-select: none;
}
.nav-label span,
.nav-label span::before,
.nav-label span::after {
	display: block;
	background: var(--text);
	height: 3px;
	width: 25px;
	border-radius: 2px;
	position: relative;
	transition: var(--transition);
}
.nav-label span::before,
.nav-label span::after {
	content: "";
	position: absolute;
	left: 0;
}
.nav-label span::before {
	top: -8px;
}
.nav-label span::after {
	top: 8px;
}

.nav-toggle:checked + .nav-label span {
	background: transparent;
}
.nav-toggle:checked + .nav-label span::before {
	transform: rotate(45deg);
	top: 0;
}
.nav-toggle:checked + .nav-label span::after {
	transform: rotate(-45deg);
	top: 0;
}

.nav-list {
	list-style: none;
	display: flex;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	align-items: center;
	flex-wrap: wrap;
}
.nav-list li a {
	font-size: clamp(0.9rem, 3vw, 1.4rem);
	padding: 0.4rem 0.8rem;
	border-radius: 6px;
	text-decoration: none;
	color: var(--text);
	font-weight: 600;
	transition: background var(--transition), color var(--transition);
	white-space: nowrap;
}
.nav-list li a:hover,
.nav-list li a.active {
	background: rgba(255, 255, 255, 0.08);
	color: var(--highlight);
}

@media (max-width: 900px) {
	.nav-label {
		display: flex;
		align-items: center;
	}

	.nav-list {
		flex-direction: column;
		width: 100vw;
		margin-left: calc(50% - 50vw);
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.2s ease, padding 0.4s ease;
		gap: 0;
		background-color: var(--nav-bg);
		padding: 0;
		margin-top: 0.5rem;
		will-change: max-height;
	}

	.nav-toggle:checked + .nav-label + .nav-list {
		max-height: 500px;
		padding: 1rem;
		border-radius: 6px;
	}

	.nav-list li {
		margin: 0.4rem 0;
		width: 100%;
	}

	.nav-list li a {
		width: 100%;
		box-sizing: border-box;
	}

	.brand a {
		margin-left: 10px;
		font-size: clamp(1.2rem, 1vw, 1.6rem);
	}

	.nav-wrapper {
		padding: 0.5rem 0.75rem;
	}
}



/* ===========================================================
   OBRAZY
=========================================================== */

img{

display:block;

max-width:100%;

height:auto;

border-radius:16px;

}



/* ===========================================================
   LINKI
=========================================================== */

a{

color:var(--accent);

text-decoration:none;

transition:var(--transition);

}





/* ===========================================================
   LISTY
=========================================================== */

ul{

padding-left:1.3rem;

}

li{

margin-bottom:.65rem;

}





/* ===========================================================
   KONTENER
=========================================================== */

.mealplan-container{

max-width:1300px;

margin:0 auto;

padding:5px clamp(20px,3vw,40px);

}






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

h1{

font-size:

clamp(2.1rem,4vw,3.8rem);

line-height:1.2;

margin-bottom:1rem;

font-weight:700;

color:var(--highlight);

text-align: center;

}

h2{

font-size:

clamp(1.8rem,3vw,2.6rem);

margin-bottom:1.4rem;

font-weight:700;

color:var(--highlight);

}

h3{

font-size:

clamp(1.25rem,2vw,1.65rem);

margin-bottom:.8rem;

font-weight:700;

font-style:normal;

padding:0;

color:#fff;

}

h4{

font-size:

clamp(1.05rem,1.5vw,1.2rem);

margin-bottom:.7rem;

font-weight:700;

color:var(--highlight);

}

p{

margin-bottom:1rem;

line-height:1.9;

color:var(--text-light);

text-indent:0;

}



/* ===========================================================
   SEKCJE
=========================================================== */

section{

margin:

clamp(50px,8vw,90px)

0;

}



/* ===========================================================
   TYTUŁY SEKCJI
=========================================================== */

.section-title{

text-align:center;

margin-bottom:1rem;

}

.opis-diety-info{

max-width:900px;

margin:

0 auto 2.5rem;

text-align:center;

font-size:

clamp(1rem,1.4vw,1.1rem);

color:var(--text-light);

}



/* ===========================================================
   WSPÓLNE KARTY
=========================================================== */

.card{

background:

linear-gradient(
180deg,
var(--surface-light),
var(--surface)
);

border-radius:var(--radius);

border:

1px solid rgba(255,255,255,.08);

box-shadow:var(--shadow);

transition:var(--transition);

}

.card:hover{

transform:translateY(-6px);

}



/* ===========================================================
   RESPONSYWNOŚĆ
=========================================================== */

@media(max-width:768px){

section{

margin:55px 0;

}

.mealplan-container{

padding:18px;

}

}

/* ===========================================================
   DZIEŃ JADŁOSPISU
=========================================================== */

.day{

display:flex;

flex-direction:column;

gap:40px;

}



/* ===========================================================
   NAGŁÓWEK DNIA
=========================================================== */

.day-header{

display:flex;

justify-content:space-between;

align-items:center;

gap:20px;

padding:22px 30px;

border-radius:var(--radius);

background:#34436b;

border-left:6px solid var(--accent);

box-shadow:

0 18px 40px rgba(0,0,0,.25);

position: relative;

}

.day-header:hover{

background:linear-gradient(
135deg,
#405384,
#4b6194
);

}


.day-header::after{

content:"Rozwiń ▼";

font-size:.9rem;

font-weight:500;

color:#d8e0ef;

margin-left:auto;

}
.day-details[open] .day-header::after{

content:"Zwiń ▲";

}

.day-header h2{

margin:0;

color:#fff;

font-size:

clamp(1.5rem,2vw,2.2rem);

}

.day-header span{

padding:

10px 18px;

border-radius:50px;

background:

rgba(255,255,255,.18);

font-size:

clamp(.9rem,1vw,1rem);

font-weight:700;

color:#fff;

white-space:nowrap;

}

.day-details[open] .day-header{


box-shadow:0 10px 25px rgba(63,167,149,.25);

}



/* ===========================================================
   KARTA POSIŁKU
=========================================================== */

.meal-card{

background:

linear-gradient(
180deg,
#34436a,
#2b3553
);

border-radius:24px;

padding:

clamp(22px,3vw,34px);

border:

1px solid rgba(255,255,255,.08);

box-shadow:

0 18px 35px rgba(0,0,0,.22);

transition:.35s;

overflow:hidden;

}

.meal-card:hover{

transform:

translateY(-8px);

box-shadow:

0 25px 55px rgba(0,0,0,.30);

}



/* ===========================================================
   TYTUŁ POSIŁKU
=========================================================== */

.meal-title{

margin-bottom:28px;

padding-bottom:18px;

border-bottom:

1px solid rgba(255,255,255,.08);

}

.meal-title h3{

display:flex;

align-items:center;

gap:10px;

margin:0;

padding:0;

font-size:

clamp(1.45rem,2vw,1.8rem);

color:var(--highlight);

}

.meal-title p{

margin-top:8px;

margin-bottom:0;

font-size:

clamp(1rem,1.3vw,1.15rem);

font-weight:600;

color:#dde5ff;

line-height:1.7;

}



/* ===========================================================
   ZDJĘCIE + SKŁADNIKI
=========================================================== */

.meal-content{

display:grid;

grid-template-columns:

340px 1fr;

gap:35px;

align-items:start;

}



/* ===========================================================
   ZDJĘCIE
=========================================================== */

.meal-image{

overflow:hidden;

border-radius:20px;

box-shadow:

0 15px 30px rgba(0,0,0,.25);

}

.meal-image img{

width:100%;

aspect-ratio:1/1;

object-fit:cover;

transition:.5s;

}

.meal-card:hover img{

transform:scale(1.05);

}



/* ===========================================================
   PRAWA KOLUMNA
=========================================================== */

.meal-details{

display:flex;

flex-direction:column;

justify-content:center;

height:100%;

}



/* ===========================================================
   NAGŁÓWEK SKŁADNIKÓW
=========================================================== */

.meal-details h4{

margin-bottom:18px;

font-size:

clamp(1.15rem,1.4vw,1.3rem);

color:var(--highlight);

}



/* ===========================================================
   LISTA SKŁADNIKÓW
=========================================================== */

.meal-details ul{

list-style:none;

padding:0;

margin:0;

display:grid;

gap:12px;

}

.meal-details li{

position:relative;

padding:

12px 18px 12px 48px;

margin:0;

background:

rgba(255,255,255,.04);

border-radius:12px;

border:

1px solid rgba(255,255,255,.05);

font-size:

clamp(.95rem,1vw,1.05rem);

line-height:1.6;

color:var(--text);

transition:.3s;

}

.meal-details li:hover{

background:

rgba(63,167,149,.12);

transform:translateX(5px);

}



/* ===========================================================
   IKONA LISTY
=========================================================== */

.meal-details li::before{

content:"✓";

position:absolute;

left:16px;

top:50%;

transform:translateY(-50%);

width:22px;

height:22px;

display:flex;

justify-content:center;

align-items:center;

background:var(--accent);

border-radius:50%;

color:#fff;

font-size:.8rem;

font-weight:bold;

}



/* ===========================================================
   RESPONSYWNOŚĆ
=========================================================== */

@media(max-width:900px){

.meal-content{

grid-template-columns:1fr;

}

.meal-image{

max-width:500px;

margin:auto;

}

}

@media(max-width:600px){

.day-header{

flex-direction:column;

text-align:center;

}

.meal-card{

padding:20px;

}

.meal-title{

text-align:center;

}

.meal-title h3{

justify-content:center;

}

}

/* ===========================================================
   MAKROSKŁADNIKI
=========================================================== */

.macro-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:18px;

margin-top:32px;

margin-bottom:30px;

}

.macro-box{

background:linear-gradient(
180deg,
#41527f,
#32405f
);

border-radius:18px;

padding:20px;

text-align:center;

border:1px solid rgba(255,255,255,.08);

transition:.35s;

box-shadow:

0 10px 22px rgba(0,0,0,.18);

}

.macro-box:hover{

transform:translateY(-6px);

background:linear-gradient(
180deg,
#48608f,
#39486d
);

}

.macro-box span{

display:block;

font-size:

clamp(1.8rem,2.5vw,2.5rem);

font-weight:700;

color:var(--highlight);

line-height:1;

margin-bottom:10px;

}

.macro-box p{

margin:0;

text-indent:0;

font-size:

clamp(.9rem,1vw,1rem);

font-weight:600;

color:var(--text-light);

letter-spacing:.5px;

text-transform:uppercase;

}



/* ===========================================================
   WARTOŚCI ODŻYWCZE
=========================================================== */

.nutrition-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:15px;

margin-bottom:32px;

}

.nutrition-item{

display:flex;

justify-content:space-between;

align-items:center;

padding:16px 20px;

background:rgba(255,255,255,.05);

border-radius:14px;

border:1px solid rgba(255,255,255,.06);

transition:.3s;

}

.nutrition-item:hover{

background:rgba(63,167,149,.10);

}

.nutrition-item strong{

font-size:

clamp(.95rem,1vw,1.05rem);

color:#fff;

font-weight:600;

}

.nutrition-item span{

font-weight:700;

color:var(--highlight);

font-size:

clamp(.95rem,1vw,1.05rem);

}



/* ===========================================================
   PRZYGOTOWANIE
=========================================================== */

.preparation{

margin-top:35px;

padding:26px;

background:linear-gradient(
180deg,
rgba(255,255,255,.04),
rgba(255,255,255,.02)
);

border-left:5px solid var(--accent);

border-radius:18px;

}

.preparation h4{

margin-bottom:15px;

}

.preparation p{

margin:0;

text-indent:0;

font-size:

clamp(1rem,1.1vw,1.08rem);

line-height:1.95;

color:var(--text);

}



/* ===========================================================
   WSKAZÓWKA
=========================================================== */

.meal-tip{

margin-top:25px;

padding:26px;

background:linear-gradient(
135deg,
rgba(63,167,149,.16),
rgba(245,163,92,.10)
);

border:1px solid rgba(63,167,149,.25);

border-radius:18px;

position:relative;

overflow:hidden;

}

.meal-tip::before{

content:"";

position:absolute;

top:0;

left:0;

width:6px;

height:100%;

background:var(--accent);

}

.meal-tip h4{

margin-bottom:15px;

padding-left:8px;

}

.meal-tip p{

margin:0;

padding-left:8px;

text-indent:0;

font-size:

clamp(1rem,1.1vw,1.08rem);

line-height:1.95;

color:var(--text);

}



/* ===========================================================
   RESPONSYWNOŚĆ
=========================================================== */

@media(max-width:900px){

.macro-grid{

grid-template-columns:repeat(2,1fr);

}

.nutrition-grid{

grid-template-columns:1fr;

}

}

@media(max-width:520px){

.macro-grid{

grid-template-columns:1fr;

}

.macro-box{

padding:18px;

}

.nutrition-item{

padding:14px 16px;

}

.preparation,
.meal-tip{

padding:20px;

}

}


/* ===========================================================
   PODSUMOWANIE DNIA
=========================================================== */

.daily-summary{

margin-top:40px;

padding:clamp(28px,3vw,40px);

background:linear-gradient(
135deg,
#30406a,
#24314f
);

border-radius:24px;

border:1px solid rgba(255,255,255,.08);

box-shadow:var(--shadow);

}

.daily-summary h2{

text-align:center;

margin-bottom:18px;

color:var(--highlight);

}

.summary-intro{

max-width:900px;

margin:0 auto 35px;

text-align:center;

font-size:clamp(1rem,1.2vw,1.08rem);

line-height:1.9;

color:var(--text-light);

}



/* ===========================================================
   PODSUMOWANIE - KAFELKI
=========================================================== */

.summary-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(180px,1fr));

gap:18px;

}

.summary-box{

background:linear-gradient(
180deg,
#41527f,
#334260
);

padding:22px;

border-radius:18px;

text-align:center;

border:1px solid rgba(255,255,255,.08);

transition:.35s;

}

.summary-box:hover{

transform:translateY(-6px);

background:linear-gradient(
180deg,
#496191,
#39496e
);

}

.summary-box span{

display:block;

font-size:clamp(1.7rem,2vw,2.2rem);

font-weight:700;

color:var(--highlight);

margin-bottom:10px;

}

.summary-box p{

margin:0;

text-indent:0;

font-weight:600;

text-transform:uppercase;

font-size:.92rem;

letter-spacing:.5px;

color:var(--text-light);

}



/* ===========================================================
   LISTA ZAKUPÓW
=========================================================== */

.shopping-list{

margin-top:70px;

}

.shopping-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

gap:28px;

margin-top:35px;

}



/* ===========================================================
   KARTA ZAKUPÓW
=========================================================== */

.shopping-card{

background:linear-gradient(
180deg,
#34436b,
#283452
);

border-radius:22px;

padding:28px;

border:1px solid rgba(255,255,255,.08);

transition:.35s;

box-shadow:

0 15px 30px rgba(0,0,0,.20);

}

.shopping-card:hover{

transform:translateY(-8px);

box-shadow:

0 25px 50px rgba(0,0,0,.28);

}



/* ===========================================================
   TYTUŁ KATEGORII
=========================================================== */

.shopping-card h3{

display:flex;

align-items:center;

gap:10px;

margin-bottom:20px;

color:var(--highlight);

font-size:clamp(1.2rem,1.8vw,1.45rem);

}



/* ===========================================================
   LISTA PRODUKTÓW
=========================================================== */

.shopping-card ul{

list-style:none;

padding:0;

margin:0;

display:grid;

gap:10px;

}

.shopping-card li{

position:relative;

padding-left:34px;

margin:0;

line-height:1.7;

color:var(--text);

font-size:clamp(.95rem,1vw,1.02rem);

}

.shopping-card li::before{

content:"🛒";

position:absolute;

left:0;

top:1px;

font-size:1rem;

}



/* ===========================================================
   RESPONSYWNOŚĆ
=========================================================== */

@media(max-width:768px){

.summary-grid{

grid-template-columns:repeat(2,1fr);

}

.shopping-grid{

grid-template-columns:1fr;

}

}

@media(max-width:520px){

.summary-grid{

grid-template-columns:1fr;

}

.daily-summary{

padding:22px;

}

.shopping-card{

padding:22px;

}

}


/* ===========================================================
   NAJWAŻNIEJSZE INFORMACJE
=========================================================== */

.quick-info{

margin-top:60px;

}

.quick-info-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:22px;

margin-top:35px;

}

.info-card{

background:linear-gradient(180deg,#34436b,#283452);

padding:28px;
margin-bottom: 1rem;

border-radius:22px;

text-align:center;

border:1px solid rgba(255,255,255,.08);

box-shadow:var(--shadow);

transition:.35s;

}

.info-card:hover{

transform:translateY(-8px);

background:linear-gradient(180deg,#405384,#32405f);

}

.info-card span{

display:block;

font-size:2.8rem;

margin-bottom:15px;

}

.info-card h3{

margin-bottom:12px;

color:var(--highlight);

font-size:clamp(1.15rem,1.6vw,1.35rem);

}

.info-card p{

margin:0;

text-indent:0;

line-height:1.7;

color:var(--text-light);

}


/* ===========================================================
   MEAL PREP
=========================================================== */

.prep-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

gap:25px;

margin-top:35px;

}

.prep-card{

background:linear-gradient(180deg,#34436b,#283452);

padding:28px;

border-radius:22px;

border:1px solid rgba(255,255,255,.08);

transition:.35s;

}

.prep-card:hover{

transform:translateY(-8px);

}

.prep-icon{

font-size:2.6rem;

margin-bottom:18px;

}

.prep-card h3{

color:var(--highlight);

margin-bottom:18px;

}

.prep-card ul{

padding-left:20px;

}

.prep-card li{

margin-bottom:12px;

line-height:1.7;

}

.tip-box{

margin-top:40px;

padding:30px;

background:linear-gradient(135deg,#2f4068,#24314e);

border-left:6px solid var(--accent);

border-radius:20px;

}

.tip-box h3{

margin-bottom:18px;

color:var(--highlight);

}


/* ===========================================================
   FAQ
=========================================================== */

.faq-container{

display:flex;

flex-direction:column;

gap:18px;

margin-top:35px;

}

.faq-item{

background:linear-gradient(180deg,#34436b,#283452);

border-radius:18px;

border:1px solid rgba(255,255,255,.08);

overflow:hidden;

transition:.3s;

}

.faq-item:hover{

border-color:var(--accent);

}

.faq-item summary{

cursor:pointer;

padding:22px 60px 22px 24px;

list-style:none;

position:relative;

font-weight:700;

font-size:clamp(1rem,1.3vw,1.1rem);

color:#fff;

}

.faq-item summary::-webkit-details-marker{

display:none;

}

.faq-item summary::after{

content:"+";

position:absolute;

right:24px;

top:50%;

transform:translateY(-50%);

font-size:2rem;

color:var(--accent);

transition:.3s;

}

.faq-item[open] summary::after{

content:"−";

}

.faq-item p{

padding:0 24px 24px;

margin:0;

text-indent:0;

line-height:1.9;

}


/* ===========================================================
   CO DALEJ
=========================================================== */

.next-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:25px;

margin-top:35px;

}

.next-card{

display:flex;

flex-direction:column;

text-decoration:none;

padding:30px;

border-radius:22px;

background:linear-gradient(180deg,#34436b,#283452);

border:1px solid rgba(255,255,255,.08);

transition:.35s;

box-shadow:var(--shadow);

}

.next-card:hover{

transform:translateY(-8px);

}

.next-icon{

font-size:2.8rem;

margin-bottom:18px;

}

.next-card h3{

margin-bottom:15px;

color:var(--highlight);

}

.next-card p{

flex:1;

margin-bottom:22px;

text-indent:0;

}

.next-card span{

font-weight:700;

color:var(--accent);

}


/* ===========================================================
   PODSUMOWANIE
=========================================================== */

.summary-note{

margin-top:35px;

padding:30px;

background:linear-gradient(135deg,#2f4068,#24314e);

border-left:6px solid var(--accent);

border-radius:20px;

}

.summary-note h3{

margin-bottom:18px;

color:var(--highlight);

}

.summary-note ul{

padding-left:22px;

}

.summary-note li{

margin-bottom:12px;

}


/* ===========================================================
   ŹRÓDŁA
=========================================================== */

.sources ol{

padding-left:22px;

margin-top:25px;

}

.sources li{

margin-bottom:16px;

line-height:1.8;

color:var(--text-light);

}


/* ===========================================================
   RESPONSYWNOŚĆ
=========================================================== */

@media(max-width:768px){

.quick-info-grid,
.prep-grid,
.next-grid{

grid-template-columns:1fr;

}

.info-card,
.prep-card,
.next-card{

padding:24px;

}

.tip-box,
.summary-note{

padding:24px;

}

.faq-item summary{

padding:20px 50px 20px 20px;

}

.faq-item p{

padding:0 20px 20px;

}

}


/* STOPKA */
footer {
	background: var(--nav-bg);
	text-align: center;
	padding: 1.5rem 1rem;
	color: var(--text);
	font-size: clamp(0.75rem, 2vw, 1rem);
	margin-top: 2rem;
}

footer a.polityka {
	color: var(--text);
	text-decoration: underline;
}

footer a.polityka:hover {
	color: var(--accent);
}

/* COOKIES */
#cookie-banner {
	display: flex;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	color: #333;
	padding: 20px;
	box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2);
	z-index: 1000;
	font-family: "Montserrat", system-ui, sans-serif;
	flex-wrap: wrap;
	gap: 10px;
}
#cookie-banner a {
	color: #0066cc;
	text-decoration: underline;
}
#cookie-banner button {
	background-color: #0066cc;
	color: white;
	padding: 10px 20px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
}

/* MAŁE EKRANY */
@media (max-width: 600px) {
	.nav-list li a {
		padding: 0.35rem 0.6rem;
	}
	header {
		height: clamp(150px, 28vw, 200px);
	}
}

@media (max-width: 400px) {
	.header-text p {
		font-size: 0.9rem;
	}
	.nav-label span,
	.nav-label span::before,
	.nav-label span::after {
		width: 20px;
	}
	.nav-list li a {
		font-size: 0.85rem;
		padding: 0.3rem 0.5rem;
	}
	footer {
		font-size: 0.75rem;
	}
}


.warning{
	font-size: clamp(0.9rem, 1.4vw, 1.8rem);
	color: rgb(73, 231, 67);
	font-weight: bold;
	text-align: center;
}


.ad-container {
    max-width: 760px;
    margin: 30px auto;
    text-align: center;
    font-family: Arial, sans-serif;
}

.ad-label {
    font-size: 12px;
    color: #888;
    margin: 6px 0;
 text-align: center;
}

/* REKLAMA */
.adslot {
    display: block;
    margin: 0 auto;
    width: 320px;
    height: 60px; /* MOBILE - MAŁA */
}

/* TABLET */
@media (min-width: 768px) {
    .adslot {
        width: 468px;
        height: 60px;
    }
}

/* KOMPUTER */
@media (min-width: 1024px) {
    .adslot {
        width: 728px;
        height: 90px;
    }
}


.mealplan-header{
    margin-top: 30px;
    margin-bottom: 175px;
}