.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.scroll-to-top {
    position: fixed;
    right: max(20px, env(safe-area-inset-right));
    bottom: max(20px, env(safe-area-inset-bottom));
    width: 48px;
    height: 48px;
    border-radius: 0;
    background: #325390;
    border: none;
    cursor: pointer;
    padding: 0;
    -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.08);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(20px) scale(0.9);
    -ms-transform: translateY(20px) scale(0.9);
    transform: translateY(20px) scale(0.9);
    -webkit-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform, opacity;
    z-index: 99;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.08);
    pointer-events: all;
    -webkit-tap-highlight-color: transparent;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

.scroll-to-top.visible {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0) scale(1);
    -ms-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1);
}

.scroll-to-top.hidden-by-menu {
    opacity: 0 !important; /* Using !important to override other states */
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(20px) scale(0.9) !important;
    transition: all 0.3s ease !important;
}

/*.scroll-to-top.hidden-by-menu {*/
/*    opacity: 0;*/
/*    visibility: hidden;*/
/*    pointer-events: none;*/
/*    position: absolute;*/
/*    transform: translateY(20px) scale(0.9);*/
/*}*/

/*.scroll-to-top.menu-transition {*/
/*    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;*/
/*}*/

.scroll-to-top svg {
    width: 24px;
    height: 24px;
    fill: #FDFDFD;
    -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    shape-rendering: geometricPrecision;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

@media (hover: hover) {
    .scroll-to-top:hover {
        background: #2F3654;
        -webkit-transform: translateY(-2px) scale(1.02);
        -ms-transform: translateY(-2px) scale(1.02);
        transform: translateY(-2px) scale(1.02);
        -webkit-box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12), 0 3px 6px rgba(0, 0, 0, 0.1);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12), 0 3px 6px rgba(0, 0, 0, 0.1);
    }

    .scroll-to-top:hover svg {
        -webkit-transform: translateY(-1px);
        -ms-transform: translateY(-1px);
        transform: translateY(-1px);
    }
}

.scroll-to-top:active {
    -webkit-transform: translateY(1px) scale(0.98);
    -ms-transform: translateY(1px) scale(0.98);
    transform: translateY(1px) scale(0.98);
    -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.08);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.08);
}

.scroll-to-top:focus-visible {
    outline: none;
    background: #2F3654;
    -webkit-box-shadow: 0 0 0 3px rgba(50, 83, 144, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0 3px rgba(50, 83, 144, 0.4), 0 4px 12px rgba(0, 0, 0, 0.1);
}

@media (max-width: 767px) {
    .scroll-to-top {
        width: 44px;
        height: 44px;
        right: 15px;
        bottom: 15px;
    }

    .scroll-to-top svg {
        width: 22px;
        height: 22px;
    }

    .scroll-to-top::before {
        content: "";
        position: absolute;
        top: -12px;
        right: -12px;
        bottom: -12px;
        left: -12px;
    }

    .scroll-to-top:active {
        -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
        -webkit-transition: -webkit-transform 0.1s ease;
        transition: -webkit-transform 0.1s ease;
        transition: transform 0.1s ease;
        transition: transform 0.1s ease, -webkit-transform 0.1s ease;
    }
}

@media (max-width: 360px) {
    .scroll-to-top {
        width: 40px;
        height: 40px;
    }

    .scroll-to-top svg {
        width: 20px;
        height: 20px;
    }
}

@supports (padding: max(0px)) {
    @media (max-width: 767px) {
        .scroll-to-top {
            padding-bottom: max(env(safe-area-inset-bottom), 0px);
        }
    }
}

@media (prefers-reduced-motion: reduce) {
    .scroll-to-top {
        -webkit-transition: opacity 0.1s linear;
        transition: opacity 0.1s linear;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }

    .scroll-to-top svg {
        -webkit-transition: none;
        transition: none;
    }

    .scroll-to-top:hover, .scroll-to-top:active {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        -webkit-transition: none;
        transition: none;
    }
}

@media (forced-colors: active) {
    .scroll-to-top {
        border: 2px solid ButtonText;
    }

    .scroll-to-top svg {
        forced-color-adjust: auto;
    }
}

@media (prefers-color-scheme: dark) {
    .scroll-to-top {
        -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2), 0 2px 4px rgba(0, 0, 0, 0.15);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2), 0 2px 4px rgba(0, 0, 0, 0.15);
    }

    .scroll-to-top:hover {
        -webkit-box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25), 0 3px 6px rgba(0, 0, 0, 0.2);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25), 0 3px 6px rgba(0, 0, 0, 0.2);
    }
}

@media print {
    .scroll-to-top {
        display: none;
    }
}