/* ==========================================================================
   SETTINGS (language switcher) — Desktop (1280px – 1920px)
   Design reference: 1920x922. Sizes are in rem so it scales proportionally
   with the viewport width (see global.css fluid scale).
   ========================================================================== */

.settings-btn {
    position: absolute;
    right: 5rem;
    bottom: 7rem;
    width: 4.6rem;
    height: 4.6rem;
    z-index: 5000;
    transition: opacity 0.2s ease;
}

.settings-btn:hover {
    opacity: 0.5;
}

/* Hidden off-screen to the right until opened; .hero's overflow: hidden
   keeps it fully out of view in the meantime. Sits below the main menu
   (z-index 6000/6001) so the menu overlay always covers it when open. */
.settings-panel {
    position: absolute;
    right: 5rem;
    bottom: 13rem;
    width: 35.3rem;
    height: 31rem;
    z-index: 4999;
    transform: translateX(150%);
    transition: transform 0.4s ease;
    pointer-events: none;
}

.settings-panel.is-open {
    transform: translateX(0);
    pointer-events: auto;
}

.settings-panel__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.settings-lang-btn {
    position: absolute;
    left: 2.5rem;
    padding: 0;
    text-align: left;
    white-space: nowrap;
    font-family: 'Atyp Display', sans-serif;
    font-weight: 400;
    font-size: 3rem;
    line-height: 3rem;
    letter-spacing: -0.08em;
    text-transform: uppercase;
    color: #000000;
    opacity: 1;
    z-index: 1;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.settings-lang-btn:hover,
.settings-lang-btn.is-active {
    opacity: 0.5;
}

.settings-lang-btn--en { top: 14rem; }
.settings-lang-btn--uk { top: 17.5rem; }
.settings-lang-btn--ja { top: 21rem; }