.awk-slider {
    --awk-slider-gap: 18px;
    --awk-slider-duration: 500ms;
    --awk-slider-radius: 0;
    --awk-slider-boxed-width: 1280px;
    position: relative;
    width: 100%;
}

.awk-slider--full {
    margin-left: calc(50% - 50vw);
    width: 100vw;
}

.awk-slider--boxed {
    margin-inline: auto;
    max-width: var(--awk-slider-boxed-width);
}

.awk-slider__viewport {
    overflow: hidden;
    touch-action: pan-y;
    width: 100%;
}

.awk-slider__track {
    display: flex;
    transform: translate3d(0, 0, 0);
    transition: transform var(--awk-slider-duration) cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

.awk-slider__track.is-jumping {
    transition: none !important;
}

.awk-slider__slide {
    border-radius: var(--awk-slider-radius);
    flex: 0 0 100%;
    max-width: 100%;
    overflow: hidden;
    position: relative;
}

.awk-slider__link,
.awk-slider picture {
    display: block;
}

.awk-slider__link {
    border-radius: inherit;
    color: inherit;
    position: relative;
    text-decoration: none;
}

.awk-slider__image {
    border-radius: inherit;
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.awk-slider--premium,
.awk-slider--peek {
    overflow: hidden;
}

.awk-slider--peek .awk-slider__viewport {
    overflow: visible;
    width: 100%;
}

.awk-slider--peek .awk-slider__track {
    gap: var(--awk-slider-gap);
    padding: 0 8%;
}

.awk-slider--peek .awk-slider__slide {
    flex-basis: 84%;
    max-width: 84%;
    opacity: .58;
    transform: scale(.96);
    transition: opacity var(--awk-slider-duration) ease, transform var(--awk-slider-duration) ease;
}

.awk-slider--peek .awk-slider__slide.is-active {
    opacity: 1;
    transform: scale(1);
}

.awk-slider--carousel {
    overflow: hidden;
}

.awk-slider--carousel .awk-slider__track {
    gap: var(--awk-slider-gap);
}

.awk-slider--carousel .awk-slider__slide {
    flex-basis: calc((100% - (var(--awk-slider-gap) * 2)) / 3);
    max-width: calc((100% - (var(--awk-slider-gap) * 2)) / 3);
}

.awk-slider--carousel .awk-slider__image {
    aspect-ratio: 16 / 9;
    height: 100%;
}

.awk-slider--full.awk-slider--effect-fade .awk-slider__track,
.awk-slider--full.awk-slider--effect-zoom .awk-slider__track,
.awk-slider--boxed.awk-slider--effect-fade .awk-slider__track,
.awk-slider--boxed.awk-slider--effect-zoom .awk-slider__track,
.awk-slider--overlay.awk-slider--effect-fade .awk-slider__track,
.awk-slider--overlay.awk-slider--effect-zoom .awk-slider__track,
.awk-slider--premium .awk-slider__track {
    display: grid;
    padding: 0;
    transform: none !important;
}

.awk-slider--full.awk-slider--effect-fade .awk-slider__slide,
.awk-slider--full.awk-slider--effect-zoom .awk-slider__slide,
.awk-slider--boxed.awk-slider--effect-fade .awk-slider__slide,
.awk-slider--boxed.awk-slider--effect-zoom .awk-slider__slide,
.awk-slider--overlay.awk-slider--effect-fade .awk-slider__slide,
.awk-slider--overlay.awk-slider--effect-zoom .awk-slider__slide,
.awk-slider--premium .awk-slider__slide {
    grid-area: 1 / 1;
    max-width: 100%;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--awk-slider-duration) ease;
    width: 100%;
    z-index: 0;
}

.awk-slider--full.awk-slider--effect-zoom .awk-slider__slide,
.awk-slider--boxed.awk-slider--effect-zoom .awk-slider__slide,
.awk-slider--overlay.awk-slider--effect-zoom .awk-slider__slide,
.awk-slider--premium .awk-slider__slide {
    transform: scale(1.035);
    transition: opacity var(--awk-slider-duration) ease, transform var(--awk-slider-duration) ease;
}

.awk-slider--premium .awk-slider__slide {
    filter: saturate(.92);
}

.awk-slider--premium .awk-slider__slide.is-active {
    filter: saturate(1);
}

.awk-slider--premium .awk-slider__image {
    box-shadow: inset 0 -120px 120px rgba(8, 10, 15, .16);
}

.awk-slider--full.awk-slider--effect-fade .awk-slider__slide.is-active,
.awk-slider--full.awk-slider--effect-zoom .awk-slider__slide.is-active,
.awk-slider--boxed.awk-slider--effect-fade .awk-slider__slide.is-active,
.awk-slider--boxed.awk-slider--effect-zoom .awk-slider__slide.is-active,
.awk-slider--overlay.awk-slider--effect-fade .awk-slider__slide.is-active,
.awk-slider--overlay.awk-slider--effect-zoom .awk-slider__slide.is-active,
.awk-slider--premium .awk-slider__slide.is-active {
    opacity: 1;
    pointer-events: auto;
    transform: scale(1);
    z-index: 1;
}

.awk-slider--overlay .awk-slider__slide::after {
    background: linear-gradient(90deg, rgba(10, 12, 18, .5), rgba(10, 12, 18, .12) 55%, rgba(10, 12, 18, .02));
    border-radius: inherit;
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.awk-slider__content {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: min(520px, 80%);
    padding: clamp(24px, 5vw, 72px);
    position: absolute;
    z-index: 2;
}

.awk-slider__content--center-left {
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.awk-slider__content--center {
    align-items: center;
    left: 50%;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
}

.awk-slider__content--center-right {
    align-items: flex-end;
    right: 0;
    text-align: right;
    top: 50%;
    transform: translateY(-50%);
}

.awk-slider__content--bottom-left {
    bottom: 0;
    left: 0;
}

.awk-slider__content--bottom-center {
    align-items: center;
    bottom: 0;
    left: 50%;
    text-align: center;
    transform: translateX(-50%);
}

.awk-slider__content--light { color: #fff; }
.awk-slider__content--dark { color: #161a22; }

.awk-slider__title {
    display: block;
    font-size: clamp(28px, 4vw, 58px);
    font-weight: 700;
    line-height: 1.04;
}

.awk-slider__subtitle {
    display: block;
    font-size: clamp(15px, 1.6vw, 20px);
    line-height: 1.45;
}

.awk-slider__button {
    align-self: flex-start;
    background: #fff;
    border-radius: 999px;
    color: #14171c;
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    margin-top: 6px;
    padding: 13px 20px;
}

.awk-slider__content--center .awk-slider__button,
.awk-slider__content--bottom-center .awk-slider__button {
    align-self: center;
}

.awk-slider__content--center-right .awk-slider__button {
    align-self: flex-end;
}

.awk-slider__arrow {
    align-items: center;
    background: rgba(20, 23, 28, .7);
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 32px;
    height: 44px;
    justify-content: center;
    line-height: 1;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: background-color 160ms ease, opacity 160ms ease;
    width: 44px;
    z-index: 3;
}

.awk-slider__arrow:hover,
.awk-slider__arrow:focus-visible {
    background: rgba(20, 23, 28, .92);
}

.awk-slider__arrow:disabled {
    cursor: default;
    opacity: .35;
}

.awk-slider__arrow--prev { left: 16px; }
.awk-slider__arrow--next { right: 16px; }
.awk-slider__arrow span { margin-top: -2px; }

.awk-slider__dots {
    bottom: 12px;
    display: flex;
    gap: 7px;
    justify-content: center;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    z-index: 3;
}

.awk-slider__dot {
    background: rgba(255, 255, 255, .65);
    border: 1px solid rgba(20, 23, 28, .35);
    border-radius: 50%;
    cursor: pointer;
    height: 10px;
    padding: 0;
    transition: background-color 160ms ease, transform 160ms ease;
    width: 10px;
}

.awk-slider__dot.is-active {
    background: #fff;
    transform: scale(1.3);
}

@media (max-width: 767px) {
    .awk-slider { --awk-slider-gap: 10px; }
    .awk-slider--full {
        margin-left: calc(50% - 50vw);
        width: 100vw;
    }
    .awk-slider--peek .awk-slider__track { padding-inline: 6%; }
    .awk-slider--peek .awk-slider__slide { flex-basis: 88%; max-width: 88%; }
    .awk-slider--carousel .awk-slider__slide { flex-basis: 82%; max-width: 82%; }
    .awk-slider__content {
        gap: 8px;
        max-width: 92%;
        padding: 22px;
    }
    .awk-slider__title { font-size: clamp(24px, 8vw, 36px); }
    .awk-slider__subtitle { font-size: 14px; }
    .awk-slider__button { font-size: 13px; padding: 11px 16px; }
    .awk-slider__arrow { font-size: 28px; height: 36px; width: 36px; }
    .awk-slider__arrow--prev { left: 8px; }
    .awk-slider__arrow--next { right: 8px; }
    .awk-slider__dots { bottom: 8px; }
}

@media (prefers-reduced-motion: reduce) {
    .awk-slider__track,
    .awk-slider__slide { transition-duration: 1ms !important; }
}
