.bshScrollTop {
    --bsh-scroll-progress: 0deg;
    position: fixed;
    right: clamp(16px, 3vw, 48px);
    bottom: clamp(16px, 3vw, 42px);
    z-index: 64;
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    color: var(--bsh-color-white);
    background: conic-gradient(var(--bsh-color-pastel-1) var(--bsh-scroll-progress), rgb(255 255 255 / .22) 0);
    box-shadow: 0 12px 34px rgb(36 35 34 / .22);
    opacity: 0;
    pointer-events: none;
    transform: translateY(18px);
    transition: opacity var(--bsh-transition-fast), transform var(--bsh-transition-fast);
}

.bshScrollTop::before {
    position: absolute;
    inset: 3px;
    border-radius: inherit;
    background: var(--bsh-color-pastel-2);
    content: '';
}

.bshScrollTop svg {
    position: relative;
    z-index: 1;
    width: 19px;
    height: 19px;
}

.bshScrollTop.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

.bshScrollTop:hover,
.bshScrollTop:focus-visible {
    transform: translateY(-4px);
}

/* Keep Complianz' permanent settings control discreet and below the scroll button. */
.cmplz-manage-consent.manage-consent-1 {
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    padding: 4px 7px !important;
    border: 0 !important;
    border-radius: 3px 0 0 !important;
    color: var(--bsh-color-headline) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
    letter-spacing: .01em !important;
    transform: none !important;
}

.bshMediaDialog {
    width: min(1100px, calc(100vw - 32px));
    max-width: none;
    padding: 0;
    border: 0;
    color: var(--bsh-color-white);
    background: #171615;
    box-shadow: 0 34px 100px rgb(0 0 0 / .5);
}

.bshMediaDialog::backdrop {
    background: rgb(20 18 17 / .88);
    backdrop-filter: blur(8px);
}

.bshMediaDialog__frame {
    aspect-ratio: 16 / 9;
}

.bshMediaDialog__frame iframe,
.bshMediaDialog__frame video {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    object-fit: contain;
}

.bshMediaDialog__close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 50%;
    color: var(--bsh-color-white);
    background: rgb(20 18 17 / .62);
    backdrop-filter: blur(8px);
}

.bshMediaDialog__close svg {
    width: 20px;
}

.bshImageDialog {
    width: 100vw;
    max-width: none;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--bsh-color-white);
    background: rgb(8 8 8 / .98);
}

.bshImageDialog::backdrop { background: rgb(0 0 0 / .92); }

.bshImageDialog__stage {
    position: relative;
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    padding: clamp(18px, 4vw, 72px);
}

.bshImageDialog figure {
    display: grid;
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    place-items: center;
}

.bshImageDialog figure img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: calc(100dvh - clamp(70px, 10vw, 140px));
    object-fit: contain;
}

.bshImageDialog figcaption,
.bshImageDialog__counter {
    position: absolute;
    bottom: 20px;
    margin: 0;
    color: inherit;
    font-size: .75rem;
    letter-spacing: .08em;
}

.bshImageDialog figcaption { left: clamp(18px, 4vw, 72px); }
.bshImageDialog__counter { right: clamp(18px, 4vw, 72px); }

.bshImageDialog__close,
.bshImageDialog__nav {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    cursor: pointer;
}

.bshImageDialog__close {
    top: 16px;
    right: 20px;
    width: 48px;
    height: 48px;
    font-size: 2.4rem;
    font-weight: 200;
    line-height: 1;
}

.bshImageDialog__nav {
    top: 50%;
    width: 54px;
    height: 70px;
    font-family: serif;
    font-size: 3.4rem;
    font-weight: 200;
    line-height: 1;
    transform: translateY(-50%);
}

.bshImageDialog__nav--prev { left: clamp(4px, 2vw, 30px); }
.bshImageDialog__nav--next { right: clamp(4px, 2vw, 30px); }

.bshImageDialog[open] { animation: bsh-image-dialog-in .28s ease both; }

@keyframes bsh-image-dialog-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (max-width: 767px) {
    .bshScrollTop {
        right: 14px;
        bottom: 78px;
        width: 46px;
        height: 46px;
    }

    .cmplz-manage-consent.manage-consent-1 {
        padding: 4px 6px !important;
        font-size: 9px !important;
    }

    .bshImageDialog__stage { padding: 52px 12px; }
    .bshImageDialog__nav { width: 42px; background: rgb(0 0 0 / .28); }
}

@media (prefers-reduced-motion: reduce) {
    .bshScrollTop {
        transition: none;
    }


    .bshImageDialog[open] { animation: none; }
}
