/* Mobile contact drawer */

.mobile-contact-drawer {
    position: fixed;
    right: 18px;
    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    z-index: 1200;
    display: none;
    align-items: flex-end;
    flex-direction: column;
    gap: 10px;
}

.mobile-contact-toggle,
.mobile-contact-option {
    width: 58px;
    height: 58px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #111;
    box-shadow: 0 16px 34px rgba(0, 0, 0, .24);
}

.mobile-contact-toggle {
    background: linear-gradient(135deg, #d7ac57, #f0cf7a);
}

.mobile-contact-option {
    background: #ffffff;
}

.mobile-contact-toggle {
    border: 0;
    cursor: pointer;
    transition: transform .55s cubic-bezier(.22, .8, .22, 1), box-shadow .25s ease;
}

.mobile-contact-toggle:hover,
.mobile-contact-toggle:focus-visible,
.mobile-contact-option:hover,
.mobile-contact-option:focus-visible {
    box-shadow: 0 18px 38px rgba(0, 0, 0, .32);
    outline: none;
}

.mobile-contact-toggle img,
.mobile-contact-option img {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.mobile-contact-drawer.is-open .mobile-contact-toggle {
    transform: rotate(360deg);
}

.mobile-contact-options {
    width: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    padding: 0;
    border-radius: 999px;
    background: transparent;
    border: 0;
    box-shadow: none;
    transform: translateY(18px) scaleY(.84);
    transform-origin: bottom center;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transition:
        opacity .24s ease,
        transform .36s cubic-bezier(.22, .8, .22, 1),
        visibility .24s ease;
}

.mobile-contact-drawer.is-open .mobile-contact-options {
    opacity: 1;
    transform: translateY(0) scaleY(1);
    pointer-events: auto;
    visibility: visible;
}

.mobile-contact-option {
    text-decoration: none;
    border: 0;
    transform: translateY(8px);
    opacity: 0;
    transition:
        opacity .26s ease,
        transform .32s cubic-bezier(.22, .8, .22, 1),
        box-shadow .22s ease;
}

.mobile-contact-drawer.is-open .mobile-contact-option {
    transform: translateY(0);
    opacity: 1;
}

.mobile-contact-drawer.is-open .mobile-contact-option:nth-child(1) {
    transition-delay: .03s;
}

.mobile-contact-drawer.is-open .mobile-contact-option:nth-child(2) {
    transition-delay: .08s;
}

.mobile-contact-drawer.is-open .mobile-contact-option:nth-child(3) {
    transition-delay: .13s;
}

@media (max-width: 768px) {
    .mobile-call {
        display: none !important;
    }

    .mobile-contact-drawer {
        display: flex;
    }
}

@media (max-width: 380px) {
    .mobile-contact-drawer {
        right: 14px;
        bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    }

    .mobile-contact-toggle,
    .mobile-contact-option,
    .mobile-contact-options {
        width: 54px;
    }

    .mobile-contact-toggle,
    .mobile-contact-option {
        height: 54px;
    }

    .mobile-contact-toggle img,
    .mobile-contact-option img {
        width: 28px;
        height: 28px;
    }
}