/* ===== HERO ===== */

.kamp-hero{
    background:url('../images/meikamp-banner.jpg') center center/cover;
    height:70vh;
}

.kamp-overlay{
    background:rgba(0,0,0,.55);
    height:100%;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    text-align:center;
    color:white;

    padding:20px;
}

.kamp-label{
    background:#ff9800;
    padding:10px 18px;
    border-radius:30px;
    font-weight:bold;
    margin-bottom:20px;
}

.kamp-overlay h1{
    font-size:4rem;
    margin-bottom:20px;
}

.kamp-overlay p{
    max-width:700px;
    font-size:1.2rem;
    margin-bottom:30px;
}

/* ===== BUTTON ===== */

.btn-primary{
    background:#ff9800;
    color:white;
    text-decoration:none;
    padding:15px 30px;
    border-radius:50px;
    font-weight:700;
}

/* ===== SECTIES ===== */

.kamp-info,
.activiteiten,
.eten-drinken,
.cta{
    padding:70px 20px;
}

.kamp-info h2,
.activiteiten h2,
.eten-drinken h2,
.cta h2{
    text-align:center;
    color:#0d2b52;
    margin-bottom:40px;
}

/* ===== INFO GRID ===== */

.info-grid{
    max-width:1100px;
    margin:auto;

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:25px;
}

.info-card{
    background:white;
    padding:30px;
    border-radius:20px;
    text-align:center;
    box-shadow:0 5px 20px rgba(0,0,0,.08);
}

/* ===== ACTIVITEITEN ===== */

.activiteiten-grid{
    max-width:1100px;
    margin:auto;

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:25px;
}

.activiteit{
    background:white;
    padding:25px;
    border-radius:20px;
    text-align:center;
    box-shadow:0 5px 20px rgba(0,0,0,.08);
    font-weight:600;
}

/* ===== INFO BOX ===== */

.info-box{
    max-width:900px;
    margin:auto;

    background:white;
    padding:35px;
    border-radius:20px;
    text-align:center;

    box-shadow:0 5px 20px rgba(0,0,0,.08);
}

/* ===== CTA ===== */

.cta{
    background:#0d2b52;
    color:white;
    text-align:center;
}

.cta h2{
    color:white;
}

/* ===== MOBIEL ===== */

@media(max-width:768px){

    .kamp-overlay h1{
        font-size:2.5rem;
    }

    .kamp-hero{
        height:60vh;
    }

}
.voorwaarden-knop{
    text-align:center;
    margin:30px 0;
}

.voorwaarden-button{
    display:inline-block;

    background:#0d2b52;
    color:white;

    text-decoration:none;

    padding:15px 30px;

    border-radius:50px;

    font-weight:700;

    transition:.3s;
}

.voorwaarden-button:hover{
    background:#17457f;
}