/* Media query para ajustar el espaciado en pantallas pequeñas */
@media (max-width: 600px) {
    .pinterest-boards {
        flex-direction: column; /* Cambia a columna cuando la pantalla es pequeña */
    }

    .man-board, .woman-board {
        margin: 10px 0; /* Margen entre los tableros apilados */
    }
}

/* Tamaños específicos para dispositivos más pequeños */
@media (max-width: 1200px) {
    .header,
    .header h1 {
        font-size: 4rem; /* Ajusta el tamaño para pantallas grandes */
    }
}

@media (max-width: 992px) {
    .header,
    .header h1 {
        font-size: 3rem; /* Ajusta el tamaño para pantallas medianas */
    }
}

@media (max-width: 768px) {
    .header,
    .header h1 {
        font-size: 2.5rem; /* Ajusta el tamaño para pantallas pequeñas */
    }
}

@media (max-width: 576px) {
    .header,
    .header h1 {
        font-size: 2rem; /* Ajusta el tamaño para dispositivos extra pequeños */
    }
}

@media (max-width: 768px) {
    .parent-boxes {
        flex-direction: column;
        align-items: center;
    }

    .parent-box {
        width: 80%; /* Cambia el ancho en dispositivos pequeños */
        margin-bottom: 20px; /* Espaciado entre cajas */
    }
}

@media (max-width: 768px) {
    .new-section {
        min-height: 100vh; /* Establece una altura mínima para mantener una buena presentación */
    }
}

@media (max-width: 768px) {
    .event-date > span {
        margin: 0 20px; /* Reduce el margen en pantallas pequeñas */
    }
}

@media (max-width: 576px) {
    .event-date > span {
        margin: 0 10px; /* Margen aún menor en pantallas extra pequeñas */
    }
}

@media (max-width: 768px) {
    .godparents-invitation,
    .godmothers-invitation {
        width: 100%; /* Toma todo el ancho en resoluciones pequeñas */
        margin-top: 10px;
    }
}

@media (max-width: 768px) {
    .slider-parents {
        width: 90%; /* Aumenta el ancho a 80% en pantallas pequeñas */
    }
}