/* =========================
   TABLET / DESKTOP – 768px+
========================== */
@media (min-width: 768px) {

    /* Fondo: columnas en lugar de filas */
    .background {
        flex-direction: row;
    }

    /* Tipografía mayor */
    h1 {
        font-size: 3rem;
    }

    p {
        font-size: 1.3rem;
    }

    /* Botones en fila */
    .buttons {
        flex-direction: row;
    }

    .buttons a {
        flex: 1;
    }
}

/* =========================
   15-ANOS – MOBILE (max 768px)
========================== */
@media (max-width: 768px) {

    /* Hero */
    .hero-content h1 {
        font-size: 2.2rem;
    }

    .hero-subtitle {
        font-size: 1.1rem;
    }

    /* Banner precios */
    .banner-precios {
        padding: 50px 25px;
    }

    .banner-precios h2 {
        font-size: 2rem;
    }

    .sello-ahorro {
        top: 15px;
        right: 15px;
        font-size: .9rem;
    }

    /* Urgencia */
    .urgencia-box h2 {
        font-size: 2.1rem;
    }

    .contador {
        grid-template-columns: repeat(2, 1fr);
    }

    .btn-urgencia {
        width: 100%;
    }

    /* Video premium */
    .seccion-video-premium {
        padding: 100px 20px;
    }

    .video-premium-content h2 {
        font-size: 2.1rem;
    }

    .video-premium-content p {
        font-size: 1.05rem;
    }

    .btn-video {
        width: 100%;
        padding: 18px;
    }

    /* Photobook */
    .photobook-content h2 {
        font-size: 2.2rem;
    }

    .photobook-content p {
        font-size: 1.05rem;
    }

    .video-photobook {
        max-width: 100%;
    }

    /* Cupos */
    .cupos-box h2 {
        font-size: 2rem;
    }

    .cupos-destacado {
        font-size: 1.2rem;
    }

    /* Sobre mí */
    .sobre-mi-container {
        grid-template-columns: 1fr;
    }

    .sobre-mi-texto {
        padding: 45px 30px;
    }

    .sobre-mi-galeria {
        grid-template-columns: 1fr;
    }
}

/* =========================
   15-ANOS – MOBILE PEQUEÑO (max 500px)
========================== */
@media (max-width: 500px) {

}

/* =========================
   15-ANOS – DESKTOP (min 900px)
========================== */
@media (min-width: 900px) {

    .sobre-mi-container {
        grid-template-columns: 1fr 1fr;
    }

    .sobre-mi-galeria {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* =========================
   15-ANOS – VIDEO WRAPPER DESKTOP (min 1024px)
========================== */
@media (min-width: 1024px) {

    .video-wrapper {
        aspect-ratio: 16 / 9;
        max-width: 1000px;
        padding-top: 0; /* anula el padding-top del mobile */
    }
}

/* =========================
   PRE-15 – TABLET (max 1000px)
========================== */
@media (max-width: 1000px) {

    /* Grid de 4 paquetes → 2 columnas */
    .paquetes-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* =========================
   PRE-15 – MOBILE (max 600px)
========================== */
@media (max-width: 600px) {

    /* Grid de paquetes → 1 columna */
    .paquetes-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================
   PRE-15 – BANNER MOBILE (max 600px)
========================== */
@media (max-width: 600px) {

    /* El sello pasa a posición estática arriba del texto */
    .banner-precios .sello-ahorro {
        position: static;
        display: inline-block;
        margin-bottom: 20px;
        transform: none;
    }

    /* El texto ya no necesita padding-right */
    .banner-precios .texto {
        padding-right: 0;
    }

    .texto h2 {
        font-size: 1.6rem;
    }
}
