.premium-contact-fab {
    display: none;
}

@media (max-width: 767px) {
    .premium-contact-fab {
        position: fixed;
        inset: 0;
        z-index: 120;
        display: block;
        pointer-events: none;
        direction: rtl;
    }

    .premium-contact-fab__scrim {
        position: absolute;
        inset: 0;
        z-index: 0;
        background: rgba(0, 0, 0, .28);
        opacity: 0;
        pointer-events: none;
        backdrop-filter: blur(1px);
        -webkit-backdrop-filter: blur(1px);
    }

    .premium-contact-fab__stage {
        position: absolute;
        left: 50%;
        bottom: calc(16px + env(safe-area-inset-bottom, 0px));
        z-index: 1;
        width: min(344px, calc(100vw - 28px));
        height: 236px;
        transform: translateX(-50%);
        pointer-events: none;
    }

    .premium-contact-fab__main,
    .premium-contact-fab__action {
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        pointer-events: auto;
        border: 1px solid rgba(255, 255, 255, .28);
        background:
            linear-gradient(145deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .07)),
            rgba(255, 255, 255, .105);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .42),
            inset 0 -1px 0 rgba(255, 255, 255, .12),
            0 0 0 1px rgba(255, 255, 255, .08),
            0 14px 38px rgba(0, 0, 0, .44),
            0 0 28px rgba(255, 255, 255, .16),
            0 0 46px rgba(233, 193, 118, .12);
        backdrop-filter: blur(28px) saturate(1.6) brightness(1.08);
        -webkit-backdrop-filter: blur(28px) saturate(1.6) brightness(1.08);
        -webkit-tap-highlight-color: transparent;
        transition: border-color .22s ease, box-shadow .22s ease, background .22s ease, transform .22s ease;
    }

    .premium-contact-fab__main {
        display: grid;
        grid-template-columns: 58px 1fr 34px;
        align-items: center;
        width: min(280px, calc(100vw - 42px));
        height: 64px;
        padding: 0 13px;
        border-radius: 999px;
        color: #f6db9d;
        cursor: pointer;
        overflow: hidden;
    }

    .premium-contact-fab__main::before,
    .premium-contact-fab__action::before {
        content: "";
        position: absolute;
        inset: 1px;
        border-radius: inherit;
        background: linear-gradient(180deg, rgba(255, 255, 255, .095), rgba(255, 255, 255, .018));
        pointer-events: none;
    }

    .premium-contact-fab__main-icon {
        position: relative;
        display: grid;
        place-items: center;
        width: 50px;
        height: 50px;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, .24);
        background: rgba(255, 255, 255, .1);
        color: #f7d690;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
    }

    .premium-contact-fab__main-icon svg {
        width: 25px;
        height: 25px;
        stroke-width: 2.2;
    }

    .premium-contact-fab__close {
        position: absolute;
        opacity: 0;
        transform: scale(.65) rotate(-45deg);
        color: #ffdf91;
        filter: drop-shadow(0 0 18px rgba(255, 223, 145, .64));
    }

    .premium-contact-fab.is-open .premium-contact-fab__main-icon {
        color: #ffdf91;
    }

    .premium-contact-fab__copy {
        display: grid;
        gap: 3px;
        min-width: 0;
        color: #fff;
        text-align: right;
    }

    .premium-contact-fab__copy strong {
        display: block;
        color: #fff;
        font-size: 16px;
        line-height: 1.35;
        font-weight: 900;
        white-space: nowrap;
    }

    .premium-contact-fab__copy small {
        display: block;
        color: rgba(255, 255, 255, .78);
        font-size: 12px;
        line-height: 1.45;
        white-space: nowrap;
    }

    .premium-contact-fab__chevron {
        display: grid;
        place-items: center;
        color: #e9c176;
    }

    .premium-contact-fab__chevron svg {
        width: 24px;
        height: 24px;
        stroke-width: 2.4;
    }

    .premium-contact-fab__action {
        display: grid;
        place-items: center;
        width: 64px;
        height: 64px;
        border-radius: 999px;
        color: #e9c176;
        text-decoration: none;
        opacity: 0;
        visibility: hidden;
        will-change: transform, opacity;
    }

    .premium-contact-fab__action svg {
        position: relative;
        z-index: 1;
        width: 30px;
        height: 30px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.2;
        filter: drop-shadow(0 0 14px rgba(255, 221, 145, .38));
        transition: filter .22s ease, transform .22s ease;
    }

    .premium-contact-fab__action span {
        position: absolute;
        left: 50%;
        bottom: -31px;
        z-index: 1;
        min-width: 76px;
        transform: translateX(-50%);
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        line-height: 1.5;
        text-align: center;
        text-shadow: 0 2px 14px rgba(0, 0, 0, .72);
        white-space: nowrap;
    }

    .premium-contact-fab__action--whatsapp {
        color: #56d66d;
    }

    .premium-contact-fab__action--bale {
        color: #8ce66f;
    }

    .premium-contact-fab__action--instagram {
        color: #ff5fb7;
    }

    .premium-contact-fab__action--instagram .premium-contact-fab__brand-icon {
        width: 32px;
        height: 32px;
        stroke: none;
        stroke-linecap: round;
        stroke-linejoin: round;
        filter:
            drop-shadow(0 0 6px rgba(250, 126, 30, .46))
            drop-shadow(0 0 10px rgba(214, 41, 118, .48))
            drop-shadow(0 0 14px rgba(150, 47, 191, .28));
    }

    .premium-contact-fab__action--instagram .premium-contact-fab__brand-icon rect,
    .premium-contact-fab__action--instagram .premium-contact-fab__brand-icon circle {
        stroke-width: 2.05;
    }

    .premium-contact-fab__action--telegram {
        color: #50c7ff;
    }

    .premium-contact-fab__action--instagram svg {
        filter:
            drop-shadow(0 0 8px rgba(214, 41, 118, .42))
            drop-shadow(0 0 14px rgba(250, 126, 30, .24));
    }

    .premium-contact-fab__action--telegram svg {
        filter:
            drop-shadow(0 0 10px rgba(80, 199, 255, .34))
            drop-shadow(0 0 16px rgba(233, 193, 118, .16));
    }

    .premium-contact-fab__action--whatsapp svg,
    .premium-contact-fab__action--bale svg {
        filter:
            drop-shadow(0 0 10px rgba(86, 214, 109, .34))
            drop-shadow(0 0 16px rgba(233, 193, 118, .16));
    }

    .premium-contact-fab__main:hover,
    .premium-contact-fab__main:focus-visible,
    .premium-contact-fab__action:hover,
    .premium-contact-fab__action:focus-visible {
        border-color: rgba(255, 236, 181, 1);
        background:
            linear-gradient(145deg, rgba(255, 255, 255, .24), rgba(255, 255, 255, .09)),
            rgba(255, 255, 255, .13);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .52),
            inset 0 -1px 0 rgba(255, 255, 255, .18),
            0 0 0 1px rgba(255, 255, 255, .18),
            0 10px 28px rgba(0, 0, 0, .42),
            0 0 26px rgba(255, 255, 255, .26),
            0 0 58px rgba(233, 193, 118, .18);
    }

    .premium-contact-fab__action:hover,
    .premium-contact-fab__action:focus-visible {
        transform: translateX(-50%) scale(.92);
    }

    .premium-contact-fab__main:hover .premium-contact-fab__main-icon,
    .premium-contact-fab__main:focus-visible .premium-contact-fab__main-icon {
        border-color: rgba(255, 255, 255, .36);
        background: rgba(255, 255, 255, .14);
    }

    .premium-contact-fab__action:hover svg,
    .premium-contact-fab__action:focus-visible svg,
    .premium-contact-fab__main:hover svg,
    .premium-contact-fab__main:focus-visible svg {
        transform: scale(.92);
        filter: drop-shadow(0 0 18px rgba(255, 236, 181, .62));
    }

    .premium-contact-fab.is-open .premium-contact-fab__scrim {
        pointer-events: auto;
    }
}
