/* ============================================
   ENVELOPE STYLES - Simplificado
   ============================================ */

.envelope-wrapper {
    position: relative;
    cursor: pointer;
    z-index: 100;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.envelope {
    position: relative;
    width: 550px;
    height: 400px;
    background: url('../carta.png') center center / contain no-repeat;
    transition: transform 0.3s ease;
}

.envelope:hover {
    transform: scale(1.02);
}

/* Elementos escondidos */
.envelope-body,
.envelope-sparkles,
.envelope-corner,
.envelope-lines,
.wax-seal,
.click-hint,
.seal-burst,
.opening-particles {
    display: none;
}

/* Estado aberto */
.envelope-wrapper.opened .envelope {
    background: none;
}

.envelope-wrapper.opened {
    cursor: default;
}

/* ============================================
   RESPONSIVO MOBILE
   ============================================ */

@media (max-width: 768px) {
    .envelope {
        width: 340px;
        height: 246px;
    }
}

@media (max-width: 400px) {
    .envelope {
        width: 300px;
        height: 218px;
    }
}

@media (max-width: 350px) {
    .envelope {
        width: 280px;
        height: 203px;
    }
}