/* --- NIEUWE ACTION CARDS (NEUBRUTALISME STIJL) --- */

.action-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2.5rem;
    margin: 4rem 0;
    padding: 1rem;
}

.action-card {
    background: white;
    border: 3px solid #000; /* De dikke zwarte rand uit je foto */
    border-radius: 2rem;
    padding: 2.5rem;
    text-align: center;
    position: relative;
    transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    
    /* De harde zwarte schaduw voor het 3D effect */
    box-shadow: 8px 8px 0px #000;
}

/* Verschillende kleurtjes voor de kaartjes passend bij jouw thema */
.card-recycle { background-color: #fff0f3; }
.card-repair  { background-color: #fff9f0; }
.card-connect { background-color: #f0f9ff; }

/* DE BEWEGING: Het kaartje "springt" omhoog bij hover */
.action-card:hover {
    transform: translate(-4px, -4px); /* Beweegt schuin omhoog */
    box-shadow: 12px 12px 0px #000; /* Schaduw wordt groter */
    background-color: white;
}

.card-icon {
    font-size: 4rem;
    display: block;
    margin-bottom: 1.5rem;
}

.action-card h4 {
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 1rem;
    color: #000;
}

.action-card p {
    font-size: 1.4rem;
    line-height: 1.4;
    margin-bottom: 0; /* Overschrijft de standaard p margin */
    color: #333;
}
iframe{
    max-width:100%;
}
/* Mobiel: iets minder grote schaduw */
@media (max-width: 600px) {
    .action-grid {
        grid-template-columns: 1fr;
    }
}