.advyon-flip-carousel {
    --afc-desktop: 4;
    --afc-tablet: 2;
    --afc-mobile: 1;
    --afc-slides: var(--afc-desktop);
    --afc-gap: 30px;
    --afc-height: 355px;
    --afc-radius: 42px;
    --afc-padding: 30px;
    --afc-bg: #b7dada;
    --afc-card-bg: #061b53;
    --afc-text: #fff;
    --afc-overlay: rgba(6,27,83,.55);
    --afc-title-size: 26px;
    --afc-body-size: 16px;

    position: relative;
    width: 100%;
    padding: 60px 78px;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--afc-bg);
}

.advyon-flip-carousel *,
.advyon-flip-carousel *::before,
.advyon-flip-carousel *::after { box-sizing: border-box; }

.advyon-flip-carousel__viewport { width: 100%; overflow: hidden; }

.advyon-flip-carousel__track {
    display: flex;
    gap: var(--afc-gap);
    transform: translate3d(0,0,0);
    transition: transform .52s cubic-bezier(.22,.61,.36,1);
    will-change: transform;
}

.advyon-flip-carousel__slide {
    flex: 0 0 calc((100% - (var(--afc-gap) * (var(--afc-slides) - 1))) / var(--afc-slides));
    min-width: 0;
}

.advyon-flip-carousel__card {
    position: relative;
    width: 100%;
    height: var(--afc-height);
    perspective: 1200px;
    outline: none;
}

.advyon-flip-carousel__inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform .68s cubic-bezier(.2,.7,.2,1);
}

@media (hover:hover) and (pointer:fine) {
    .advyon-flip-carousel__card:hover .advyon-flip-carousel__inner,
    .advyon-flip-carousel__card:focus-within .advyon-flip-carousel__inner { transform: rotateY(180deg); }
}

.advyon-flip-carousel__card.is-flipped .advyon-flip-carousel__inner { transform: rotateY(180deg); }

.advyon-flip-carousel__face {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: var(--afc-radius);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.advyon-flip-carousel__front {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: var(--afc-padding);
    background: var(--afc-card-bg);
    color: var(--afc-text);
}

.advyon-flip-carousel__title,
.advyon-flip-carousel__back-title { margin: 0; color: inherit; }

.advyon-flip-carousel__title {
    margin-bottom: 22px;
    font-family: "Inter Tight", sans-serif;
    font-size: var(--afc-title-size);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.advyon-flip-carousel__description {
    color: inherit;
    font-family: "Instrument Serif", serif;
    font-size: var(--afc-body-size);
    font-style: italic;
    font-weight: 400;
    line-height: 1.58;
}

.advyon-flip-carousel__description p { margin: 0; }

.advyon-flip-carousel__back {
    transform: rotateY(180deg);
    background: var(--afc-card-bg);
    color: #fff;
}

.advyon-flip-carousel__media,
.advyon-flip-carousel__shade { position: absolute; inset: 0; }

.advyon-flip-carousel__media { background: var(--afc-card-bg); }

.advyon-flip-carousel__media-image,
.advyon-flip-carousel__video,
.advyon-flip-carousel__iframe,
.advyon-flip-carousel__poster { position: absolute; inset: 0; width: 100%; height: 100%; }

.advyon-flip-carousel__media-image,
.advyon-flip-carousel__video { display: block; object-fit: cover; }

.advyon-flip-carousel__iframe { border: 0; pointer-events: none; transform: scale(1.02); }
.advyon-flip-carousel__poster { background-size: cover; background-position: center; }

.advyon-flip-carousel__shade {
    z-index: 2;
    background: linear-gradient(to top, var(--afc-overlay) 0%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.04) 100%);
}

.advyon-flip-carousel__overlay-content {
    position: absolute;
    z-index: 3;
    left: var(--afc-padding);
    right: var(--afc-padding);
    bottom: var(--afc-padding);
}

.advyon-flip-carousel__back-title {
    margin-bottom: 16px;
    font-family: "Inter Tight", sans-serif;
    font-size: calc(var(--afc-title-size) * .92);
    font-weight: 700;
    line-height: 1.08;
    text-transform: uppercase;
    text-shadow: 0 1px 4px rgba(0,0,0,.2);
}

.advyon-flip-carousel__button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 9px 17px;
    border-radius: 999px;
    background: #fff;
    color: var(--afc-card-bg);
    font-family: "Inter Tight", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: transform .2s ease, opacity .2s ease;
}

.advyon-flip-carousel__button:hover { transform: translateY(-2px); }

.advyon-flip-carousel__nav {
    position: absolute;
    z-index: 8;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin: 0;
    padding: 0;
    border: 2px solid var(--afc-card-bg);
    border-radius: 50%;
    background: #fff;
    color: var(--afc-card-bg);
    cursor: pointer;
    transform: translateY(-50%);
    transition: transform .2s ease, opacity .2s ease;
}

.advyon-flip-carousel__nav:hover { transform: translateY(-50%) scale(1.06); }
.advyon-flip-carousel__nav:disabled { opacity: .35; cursor: default; }
.advyon-flip-carousel__nav--prev { left: 24px; }
.advyon-flip-carousel__nav--next { right: 24px; }
.advyon-flip-carousel__nav span { font-family: Arial,sans-serif; font-size: 28px; line-height: 1; transform: translateY(-1px); }

@media (max-width:1024px) {
    .advyon-flip-carousel { --afc-slides: var(--afc-tablet); padding-left: 64px; padding-right: 64px; }
    .advyon-flip-carousel__nav--prev { left: 12px; }
    .advyon-flip-carousel__nav--next { right: 12px; }
}

@media (max-width:767px) {
    .advyon-flip-carousel { --afc-slides: var(--afc-mobile); padding: 40px 52px; }
    .advyon-flip-carousel__nav { width: 38px; height: 38px; }
    .advyon-flip-carousel__nav--prev { left: 7px; }
    .advyon-flip-carousel__nav--next { right: 7px; }
    .advyon-flip-carousel__nav span { font-size: 22px; }
}

@media (prefers-reduced-motion:reduce) {
    .advyon-flip-carousel__track,
    .advyon-flip-carousel__inner { transition-duration: .01ms; }
}