/* ==================== RESPONSIVE ==================== */

@media (max-width: 768px) {
    .hero h2 {
        font-size: 2.5rem;
    }

    .sticker {
        display: none;
    }

    .decorative-images {
        flex-direction: column;
        gap: 30px;
        height: auto;
    }

    .postal {
        width: 200px;
    }

    .led-message {
        font-size: 1.8rem;
    }

    .led-display {
        height: 60px;
    }

    .miku-gif {
        width: 100px;
        bottom: 10px;
    }

    .miku-gif-left {
        left: 10px;
    }

    .miku-gif-right {
        right: 10px;
    }

    .gallery-container {
        width: 95%;
        padding: 20px;
        max-height: 95vh;
    }

    .gallery-title {
        font-size: 1.4rem;
    }

    .gallery-image {
        max-width: 100%;
    }

    .gallery-controls {
        flex-wrap: wrap;
        gap: 10px;
    }

    .flowers-container {
        width: 280px;
        height: 280px;
    }

    .intro-message {
        font-size: 1.5rem;
    }

    .modal-content {
        padding: 30px 20px;
        margin: 20px auto;
    }

    .page-1 .corner-flower {
        width: 50px;
    }

    .page-2 h1 {
        font-size: 4rem;
    }

    .page-4 h1 {
        font-size: 2.5rem;
    }

    .carta-envelope {
        width: 240px;
        height: 150px;
    }
    
    .envelope-flap {
        border-left: 120px solid transparent;
        border-right: 120px solid transparent;
        border-top: 75px solid #ff69b4;
    }
    
    .love-letter {
        width: 200px;
        height: 120px;
        padding: 12px;
    }
    
    .letter-title {
        font-size: 0.75rem;
    }
    
    .envelope-seal {
        font-size: 1.5rem;
        top: 30px;
        right: 20px;
    }

    .footer h3 {
        font-size: 1.4rem;
    }
    
    .footer-stats {
        font-size: 0.95rem;
    }
    
    .cupon-note {
        min-width: 250px;
        padding: 15px 20px;
    }
    
    .cupon-text {
        font-size: 0.95rem;
    }
}