/* Envelope confirmation adapted from butoane-sigiliu.html. */
.contact-envelope { display: none; }
.contact-popup[data-state="success"] { padding: 0; background: #0a0705b8; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); overflow: hidden; }
.contact-popup[data-state="success"] .contact-popup__dialog { display: none; }
.contact-popup[data-state="success"] .contact-envelope { display: block; position: absolute; inset: 0; pointer-events: none; }
.contact-envelope__group { position: absolute; inset: 0; perspective: 1000px; }
.contact-envelope__paper { position: absolute; left: calc(50% - 140px); top: calc(50% - 90px); width: 280px; height: 180px; border-radius: 4px; background: linear-gradient(#f1e6cc, #e2d2ac); box-shadow: 0 30px 60px #000a; }
.contact-envelope__paper::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(#efe2c3, #d9c692); clip-path: polygon(0 0, 50% 58%, 100% 0, 100% 100%, 0 100%); }
.contact-envelope__flap { position: absolute; left: 0; right: 0; top: 0; height: 60%; z-index: 2; background: linear-gradient(#e6d6ae, #cdb885); clip-path: polygon(0 0, 100% 0, 50% 100%); transform-origin: 50% 0; }
.contact-envelope__wax { --s: 84px; position: absolute; left: calc(50% - var(--s)/2); top: calc(50% + 3px - var(--s)/2); width: var(--s); height: var(--s); border-radius: 52% 48% 55% 45% / 47% 55% 45% 53%; background: radial-gradient(circle at 34% 28%, #287354, #124832 55%, #06291b); box-shadow: 0 calc(var(--s)*.12) calc(var(--s)*.26) #000a, inset 0 calc(var(--s)*-.04) calc(var(--s)*.09) #0007, inset 0 3px 6px #ffffff22; display: grid; place-items: center; }
.contact-envelope__ring { position: absolute; inset: 11%; border-radius: 50%; border: 1.5px solid #ffffff2a; box-shadow: inset 0 2px 5px #0007, 0 1px 0 #ffffff22; }
.contact-envelope__candle { position: relative; width: 32px; height: 40px; color: #062c1d; fill: currentColor; filter: drop-shadow(0 1px 0 #ffffff40) drop-shadow(0 -1px 1px #0009); }
.contact-envelope__message { position: absolute; left: 16px; right: 16px; top: calc(50% + 110px); margin: 0; text-align: center; color: #f4e6cf; -webkit-text-fill-color: currentColor; font: 700 clamp(22px, 5.6vw, 31px)/1.25 'Lato', sans-serif; }
.contact-envelope__drop { position: absolute; z-index: 3; border-radius: 50%; background: #1a5a3f; pointer-events: none; }
@media (max-width: 320px) and (hover: none) and (pointer: coarse) {
 .contact-envelope__paper { width: 240px; height: 154px; left: calc(50% - 120px); top: calc(50% - 77px); }
 .contact-envelope__message { top: calc(50% + 96px); }
}
/* Failed contact message: red error mark and the mobile menu's rounded gold edges. */
#contactPopupDialog[data-state="error"] {
    --contact-error-gold: rgba(216, 187, 133, .65);
    --contact-error-glow: rgba(216, 187, 133, .4);
    border: 0 !important;
    box-shadow: 0 24px 65px rgba(0, 0, 0, .35);
}
#contactPopupDialog[data-state="error"] .contact-popup__icon {
    color: #e05b5b !important;
}
#contactPopupDialog[data-state="error"] .contact-popup__icon-error {
    stroke: #e05b5b;
}
#contactPopupDialog[data-state="error"]::before,
#contactPopupDialog[data-state="error"]::after {
    content: '';
    position: absolute;
    z-index: 1;
    inset: auto 0;
    height: 50%;
    background: none !important;
    pointer-events: none;
}
#contactPopupDialog[data-state="error"]::before {
    top: 0;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
    box-shadow: inset 0 1px 0 var(--contact-error-gold), inset 0 4px 6px -5px var(--contact-error-glow);
}
#contactPopupDialog[data-state="error"]::after {
    bottom: 0;
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
    box-shadow: inset 0 -1px 0 var(--contact-error-gold), inset 0 -4px 6px -5px var(--contact-error-glow);
}
@media (max-width: 768px) {
    #contactPopupDialog[data-state="error"] {
        --contact-error-gold: rgba(216, 187, 133, .85);
        --contact-error-glow: rgba(216, 187, 133, .55);
    }
}
/* Scale the complete envelope independently of its flight animation. */
.contact-envelope__art { position: absolute; inset: 0; transform: scale(1); transform-origin: center; }
@media (max-width: 768px) and (hover: none) and (pointer: coarse) {
    .contact-envelope__art { transform: scale(.8); }
    .contact-envelope__wax { --s: 74px; }
    .contact-envelope__candle { width: 28px; height: 35px; }
}
/* Enlarge only the desktop paper; the wax seal keeps its own dimensions. */
@media (min-width: 769px), (hover: hover) and (pointer: fine) {
    .contact-envelope__paper {
        left: calc(50% - 182px);
        top: calc(50% - 117px);
        width: 364px;
        height: 234px;
    }
    .contact-envelope__message { top: calc(50% + 170px); }
}