/* ==========================================================================
   GW Flip Card 3D
   ========================================================================== */

.elementor-widget-gw_flip_card_3d,
.elementor-widget-gw_flip_card_3d > .elementor-widget-container,
.elementor-widget-gw_flip_card_3d .elementor-widget-container,
.gwflip-overflow-visible {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
    mask: none !important;
    -webkit-mask: none !important;
    contain: none !important;
    isolation: auto !important;
}

.gwflip-carousel-open,
.gwflip-carousel-open.gwflip-overflow-visible,
.gwflip-carousel-clip,
.gwflip-carousel-clip.gwflip-overflow-visible,
.gwflip-carousel-open .swiper-wrapper,
.gwflip-carousel-open .swiper-slide,
.gwflip-carousel-track-visible {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    clip-path: none !important;
    -webkit-clip-path: none !important;
    contain: none !important;
    isolation: auto !important;
}

.gwflip-carousel-open .gwflip-slide-outside {
    visibility: hidden !important;
    pointer-events: none !important;
}

.gwflip-carousel-base-mask,
.gwflip-carousel-base-mask.gwflip-overflow-visible {
    position: relative;
    overflow: clip !important;
    overflow-clip-margin: 0;
    clip-path: none !important;
    -webkit-clip-path: none !important;
    contain: none !important;
    isolation: auto !important;
}

@supports not (overflow: clip) {
    .gwflip-carousel-base-mask,
    .gwflip-carousel-base-mask.gwflip-overflow-visible {
        overflow: hidden !important;
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }
}

.gwflip {
    --gwflip-accent: #c4a676;
    --gwflip-dark: #272535;
    --gwflip-radius: 10px;
    --gwflip-height: 366px;
    --gwflip-overlay-opacity: .6;
    --gwflip-back-overlay-opacity: .6;
    --gwflip-duration: .9s;
    --gwflip-ease: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    --gwflip-front-bg-size: cover;
    --gwflip-front-bg-position: 50% 50%;
    --gwflip-back-bg-size: cover;
    --gwflip-back-bg-position: 50% 50%;
    --gwflip-bg-hover-scale: 1.01;
    --gwflip-depth: 95px;
    --gwflip-depth-scale: .81;
    --gwflip-border-inset: 15px;
    --gwflip-border-width: 1px;
    --gwflip-border-style: solid;
    --gwflip-back-border-style: solid;
    --gwflip-border-radius: var(--gwflip-radius);
    --gwflip-border-color: rgba(255, 255, 255, .3);
    --gwflip-back-border-color: rgba(255, 255, 255, .1);
    --gwflip-sep-line-color: #eee;
    --gwflip-sep-line-width: 70px;
    --gwflip-sep-gap: 70px;
    --gwflip-sep-icon-color: var(--gwflip-accent);
    --gwflip-sep-icon-size: 18px;

    position: relative;
    width: 100%;
    height: var(--gwflip-height);
    min-height: var(--gwflip-height);
    perspective: 1000px;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition: var(--gwflip-duration) var(--gwflip-ease);
    outline: none;
    overflow: visible;
}

.gwflip *,
.gwflip *::before,
.gwflip *::after {
    box-sizing: border-box;
}

.gwflip:focus-visible {
    outline: 2px solid var(--gwflip-accent);
    outline-offset: 4px;
}

.gwflip__inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    perspective: 1000px;
    overflow: visible;
}

.gwflip__front,
.gwflip__back {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: var(--gwflip-height);
    transform-style: preserve-3d;
    perspective: 1000px;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--gwflip-radius);
    box-shadow: 0 10px 34px 0 rgba(0, 0, 0, .2);
    transition: transform var(--gwflip-duration) var(--gwflip-ease), box-shadow .3s ease;
    overflow: visible;
}

.gwflip__front {
    background: var(--gwflip-dark);
    cursor: pointer;
    z-index: 2;
}

.gwflip__back {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    transform: rotateY(180deg);
    background: var(--gwflip-dark);
}

@media (hover: hover) {
    .gwflip--horizontal:hover .gwflip__front {
        transform: rotateY(-180deg);
        z-index: 1;
    }

    .gwflip--horizontal:hover .gwflip__back {
        transform: rotateY(0deg);
        z-index: 3;
    }

    .gwflip--vertical:hover .gwflip__front {
        transform: rotateX(-180deg);
        z-index: 1;
    }

    .gwflip--vertical:hover .gwflip__back {
        transform: rotateX(0deg);
        z-index: 3;
    }
}

.gwflip--horizontal.is-flipped .gwflip__front {
    transform: rotateY(-180deg);
    z-index: 1;
}

.gwflip--horizontal.is-flipped .gwflip__back {
    transform: rotateY(0deg);
    z-index: 3;
}

.gwflip--vertical .gwflip__back {
    transform: rotateX(180deg);
}

.gwflip--vertical.is-flipped .gwflip__front {
    transform: rotateX(-180deg);
    z-index: 1;
}

.gwflip--vertical.is-flipped .gwflip__back {
    transform: rotateX(0deg);
    z-index: 3;
}

.gwflip__face {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 130px 40px;
    border-radius: var(--gwflip-radius);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform-style: preserve-3d;
    perspective: 1000px;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    overflow: visible;
}

.gwflip__media,
.gwflip__bg,
.gwflip__overlay {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.gwflip__front::before,
.gwflip__back::before {
    content: "";
    position: absolute;
    inset: var(--gwflip-border-inset);
    border: var(--gwflip-border-width) var(--gwflip-border-style) var(--gwflip-border-color);
    border-radius: var(--gwflip-border-radius);
    z-index: 1;
    pointer-events: none;
}

.gwflip__back::before {
    border-color: var(--gwflip-back-border-color);
    border-style: var(--gwflip-back-border-style, var(--gwflip-border-style));
}

.gwflip--no-border .gwflip__front::before,
.gwflip--no-border .gwflip__back::before {
    display: none;
}

.gwflip--no-front-border .gwflip__front::before,
.gwflip--no-back-border .gwflip__back::before {
    display: none;
}

.gwflip__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    border-radius: var(--gwflip-radius);
    pointer-events: none;
}

.gwflip__bg {
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    transition: transform var(--gwflip-duration) var(--gwflip-ease);
}

.gwflip__media--front .gwflip__bg {
    background-size: var(--gwflip-front-bg-size);
    background-position: var(--gwflip-front-bg-position);
}

.gwflip__media--back .gwflip__bg {
    background-size: var(--gwflip-back-bg-size);
    background-position: var(--gwflip-back-bg-position);
}

.gwflip:hover .gwflip__bg,
.gwflip.is-flipped .gwflip__bg {
    transform: scale(var(--gwflip-bg-hover-scale));
}

.gwflip__overlay {
    position: absolute;
    inset: 0;
    background: var(--gwflip-dark);
    opacity: var(--gwflip-overlay-opacity);
}

.gwflip__media--back .gwflip__overlay {
    opacity: var(--gwflip-back-overlay-opacity, var(--gwflip-overlay-opacity));
}

.gwflip__content {
    position: relative;
    z-index: 2;
    text-align: center;
    width: 100%;
    max-width: 100%;
    transform-style: preserve-3d;
    perspective: 1000px;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform: translateZ(var(--gwflip-depth, 95px)) scale(var(--gwflip-depth-scale, .81));
    overflow: visible;
}

.gwflip__link {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: block;
    border-radius: var(--gwflip-radius);
    outline: none;
    background: transparent;
    text-decoration: none;
}

.gwflip__link:focus-visible {
    outline: 2px solid var(--gwflip-accent);
    outline-offset: 4px;
}

.gwflip__title {
    position: relative;
    display: inline-block;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 31px;
    font-weight: 500;
    color: #fff;
    margin: 0;
    line-height: normal;
    overflow-wrap: anywhere;
}

.gwflip__title::after {
    content: "";
    position: absolute;
    top: -20px;
    left: 50%;
    width: 50px;
    height: 1px;
    background: var(--gwflip-accent);
    transform: translateX(-50%);
}

.gwflip__subtitle {
    font-family: "Jost", Arial, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    text-transform: uppercase;
    margin: 0 4px;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.gwflip__sep {
    position: relative;
    height: 20px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gwflip__sep::before,
.gwflip__sep::after {
    content: "";
    position: absolute;
    top: 50%;
    width: var(--gwflip-sep-line-width);
    height: 1px;
    background: var(--gwflip-sep-line-color);
}

.gwflip__sep::before {
    left: 50%;
    margin-left: var(--gwflip-sep-gap);
}

.gwflip__sep::after {
    right: 50%;
    margin-right: var(--gwflip-sep-gap);
}

.gwflip__sep span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--gwflip-sep-icon-color);
    font-size: var(--gwflip-sep-icon-size);
    line-height: 1;
}

.gwflip__sep i,
.gwflip__sep svg {
    color: currentColor;
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: block;
}

.gwflip__sep-media {
    width: var(--gwflip-sep-icon-size);
    height: var(--gwflip-sep-icon-size);
    display: block;
    object-fit: contain;
}

.gwflip__num {
    position: absolute;
    bottom: 40px;
    left: 0;
    right: 0;
    text-align: center;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 22px;
    color: var(--gwflip-accent);
    z-index: 2;
    line-height: 1;
}

.gwflip__decicon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--gwflip-accent);
    font-size: 54px;
    line-height: 1;
}

.gwflip__decicon i,
.gwflip__decicon svg {
    color: currentColor;
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: block;
}

.gwflip__decicon-media {
    width: 1em;
    height: 1em;
    display: block;
    object-fit: contain;
}

.gwflip__text {
    font-family: "Jost", Arial, sans-serif;
    font-size: 13px;
    line-height: 24px;
    color: #fff;
    margin: 20px auto 0;
    max-width: 290px;
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    .gwflip {
        min-height: var(--gwflip-height);
    }

    .gwflip__face {
        padding: 96px 28px;
    }

    .gwflip__title {
        font-size: clamp(24px, 7vw, 31px);
    }

    .gwflip__sep::before,
    .gwflip__sep::after {
        max-width: 54px;
    }

    .gwflip__sep::before {
        margin-left: 48px;
    }

    .gwflip__sep::after {
        margin-right: 48px;
    }

    .gwflip__num {
        bottom: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gwflip,
    .gwflip__front,
    .gwflip__back,
    .gwflip__bg {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}
