.partn body,

body {

    overflow-x: hidden
}

/* *{
     -webkit-text-fill-color: inherit !important;
} */



html {

    scroll-behavior: smooth;
    color-scheme: light !important;

    background-color: #fff !important;

}



.left-content {

    display: flex;

    margin: auto 0;

}



.get-in-icon-container img,

.nav-link:hover::after,

.navbar {

    width: 100%
}

.usernameCreator a {

    display: inline-block;
    /* ✅ needed for transform to work */

    transition: transform 0.2s ease, color 0.2s ease;

}



.usernameCreator a:hover {

    color: #fff;

    transform: scale(1.2);
    /* 20% bigger on hover */

}







.zestyy-component,

.zestyy-component.scrolled-100,

.zestyy-component.scrolled-25,

.zestyy-component.scrolled-50,

.zestyy-component.scrolled-75 {

    --fillColor: #F62681
        /* --fillColor: #bf14cf */

}



.nav-link,

.zesty-cta-button,

.zesty-legal-link,

.zesty-nav-link,

.zesty-social-link {

    text-decoration: none
}



* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

    box-sizing: border-box
}
@font-face {
  font-family: "Bodoni72";
    src: url("/wp-content/themes/zesty/assets/fonts/times-new-roman/Bodoni%2072.woff2") format("woff2"),
       url("/wp-content/themes/zesty/assets/fonts/times-new-roman/Bodoni%2072.woff") format("woff"),
       url("/wp-content/themes/zesty/assets/fonts/times-new-roman/Bodoni%2072.ttc") format("truetype");
  font-weight: normal;
  font-style: normal;
}



:root {

    --red: #e33b40;

    --white: #ffffff
}



.zestyLogo {

    font-family: 'Times New Roman Bold';
    /* font-family: "Bodoni Moda", "Bodoni 72", Didot, "Times New Roman", serif; */
     /* font-family: "Bodoni72", Didot; */

    font-size: clamp(28px, 8vw, 95px);

    letter-spacing: -7px;

    /* background: linear-gradient(172deg, #bc0eff 6.63%, #C8254b 101.52%); */
background: linear-gradient(to bottom, #B72270 0%,  #C81F66 50%,  #662D91 100%);

    /* background: linear-gradient(66deg, #bc0eff 6.63%, #C8254b 101.52%); */

    background-clip: text;

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    position: relative;

    top: 0px
}



.partn body {

    background-color: #f8f9fa
}



body {

    font-family: Inter, sans-serif;

    line-height: 1.6
}



.navbar {

    background-color: rgb(255 255 255 / 22%);

    backdrop-filter: blur(50px);

    -webkit-backdrop-filter: blur(10px);

    box-shadow: 0 2px 10px rgba(0, 0, 0, .1);

    position: fixed;

    top: 0;

    z-index: 1000
}



.cta-button,

.hamburger-line {

    background: linear-gradient(135deg, #c026d3, #a21caf)
}



.navbar.scrolled {

    background-color: #fff;

    backdrop-filter: none;

    -webkit-backdrop-filter: none
}



.nav-container {

    max-width: 90%;

    margin: 0 auto;

    padding: 0 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    height: 70px
}



.logo-space {

    display: flex;

    align-items: center;

    min-width: 120px;

    border-radius: 8px;

    justify-content: center;

    color: #6b7280;

    font-size: 12px;

    font-weight: 500;

    position: relative;

    overflow: hidden
}



.cta-button,

.nav-link {

    font-size: 16px;

    overflow: hidden;

    position: relative
}



.nav-menu {

    display: flex;

    list-style: none;

    gap: 50px;

    margin: 0
}



.nav-link {

    color: #374151;

    font-weight: 500;

    padding: 8px 0;

    transition: color .3s
}



.nav-link:hover {

    color: #c026d3
}



.nav-link::after {

    content: '';

    position: absolute;

    bottom: -2px;

    left: 0;

    width: 0;

    height: 2px;

    background: linear-gradient(90deg, #c026d3, #a21caf);

    transition: width .3s
}



.cta-button {

    color: #fff;

    border: none;

    padding: 12px 24px;

    border-radius: 25px;

    font-weight: 600;

    cursor: pointer;

    transition: .3s;

    box-shadow: 0 4px 15px rgba(192, 38, 211, .3);

    transform: scale(.8)
}



.cta-button::before {

    content: '';

    position: absolute;

    top: -50%;

    left: -50%;

    width: 200%;

    height: 200%;

    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, .2), transparent);

    transform: rotate(45deg);

    transition: transform .6s
}



.cta-button:hover::before {

    transform: rotate(45deg) translate(100%, 100%)
}



.cta-button:hover {

    transform: translateY(-2px) scale(1.05);

    box-shadow: 0 6px 20px rgba(192, 38, 211, .4)
}



.mobile-menu-toggle {

    display: none;

    flex-direction: column;

    cursor: pointer;

    padding: 4px
}



.hamburger-line {

    width: 25px;

    height: 3px;

    margin: 3px 0;

    transition: .3s;

    border-radius: 2px
}



.zesty-notification-bubble,

.zesty-primary-button {

    background: linear-gradient(135deg, #d946ef, #a855f7)
}



.mobile-menu-toggle.active .hamburger-line:first-child {

    transform: rotate(-45deg) translate(-5px, 6px)
}



.flip-page-slide.flip-page-is-active .flip-page-thumb-inactive,

.flip-page-thumb-active,

.mobile-menu-toggle.active .hamburger-line:nth-child(2) {

    opacity: 0
}



.mobile-menu-toggle.active .hamburger-line:nth-child(3) {

    transform: rotate(45deg) translate(-5px, -6px)
}



.mobile-cta-button {

    display: none
}



.demo-content {

    max-width: 90%;

    margin: 0 auto;

    opacity: 0;

    transform: translateY(50px);

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 20px;

    padding-bottom: 40px;

}



.zesty-creative-video {

    width: 200px;

    position: relative;

    bottom: -23px
}



.zesty-creative-container {

    padding: 40px 20px;

    /* margin-top: 80px */

}



.zesty-notification-bubble {

    display: inline-block;

    color: #fff;

    padding: 12px 20px;

    border-radius: 20px;

    position: relative;

    margin-bottom: 30px;

    box-shadow: 0 4px 20px rgba(168, 85, 247, .3)
}



.zesty-notification-bubble::after {

    content: '';

    position: absolute;

    bottom: -10px;

    left: 48px;

    width: 0;

    height: 0;

    border-left: 15px solid transparent;

    border-right: 15px solid transparent;

    border-top: 15px solid #a855f7
}



.zesty-notification-content {

    display: flex;

    align-items: center;

    gap: 20px;

    font-weight: 600
}



.zesty-notification-item {

    display: flex;

    align-items: center;

    gap: 8px
}



.zesty-notification-icon {

    width: 20px;

    height: 20px;

    fill: currentColor
}



.zesty-main-heading {

    font-size: clamp(28px, 8vw, 80px);

    font-weight: 700;

    color: #2b2b2b;

    margin-bottom: 40px;

    line-height: 1.1;

    font-family: Poppins, sans-serif
}



@media (max-width:1440px) {

    .zesty-main-heading {

        font-size: clamp(28px, 8vw, 71px);

        font-weight: 700;

        color: #2b2b2b;

        margin-bottom: 30px;

        line-height: 1.1;

        font-family: Poppins, sans-serif
    }

}



.zesty-subtitle {

    font-size: 1.25rem;

    color: #000;

    margin-bottom: 30px;

    max-width: 600px
}



.zesty-features-container {

    display: flex;

    gap: 20px;

    margin-bottom: 40px;

    flex-wrap: wrap
}



.zesty-feature-item {

    display: flex;

    align-items: center;

    font-size: 1.1rem;

    font-weight: 500;

    color: #374151;

    box-shadow: rgba(99, 99, 99, .2) 0 2px 8px 0;

    border-radius: 20px;

    padding: 3px 16px
}



.zesty-feature-emoji {

    font-size: 1.5rem
}



.zesty-cta-buttons {

    display: flex;

    gap: 10px;

    flex-wrap: wrap
}



.zesty-cta-button {

    padding: 12px 22px;

    border-radius: 50px;

    font-size: 1rem;

    transition: .3s;

    cursor: pointer;

    border: 1px solid transparent;

    display: inline-block;

    font-family: Poppins, sans-serif;

    font-weight: 400
}



.zesty-primary-button {

    color: #fff;

    box-shadow: 0 4px 20px rgba(168, 85, 247, .3)
}



.zesty-primary-button:hover {

    transform: translateY(-2px);

    box-shadow: 0 6px 25px rgba(168, 85, 247, .4)
}



.zesty-secondary-button {

    background: #fff;

    color: #6b7280;

    border: 2px solid #e5e7eb
}



.zesty-secondary-button:hover {

    border-color: #d946ef;

    color: #d946ef;

    transform: translateY(-2px)
}



.zesty-scroll-container {

    display: flex;

    height: 100vh;

    width: 100%;

    padding: 4px;

    margin: 0 auto
}



.zesty-scroll-column {

    flex: 1;

    height: 100vh;

    overflow: hidden;

    position: relative;

    padding: 25px 0
}



.text-content,

.zesty-scroll-track {

    display: flex;

    flex-direction: column
}



.zesty-scroll-track {

    animation-timing-function: linear;

    animation-iteration-count: infinite
}



.zesty-scroll-track.slide-down {

    animation: 60s linear infinite zestySlideDown
}



.zesty-scroll-track.slide-up {

    animation: 60s linear infinite zestySlideUp
}



@keyframes zestySlideDown {

    0% {

        transform: translateY(0)
    }



    100% {

        transform: translateY(-50%)
    }

}



@keyframes zestySlideUp {

    0% {

        transform: translateY(-50%)
    }



    100% {

        transform: translateY(0)
    }

}



.zesty-scroll-card {

    width: 90%;

    height: 500px;

    margin: 20px 0;

    border-radius: 30px;

    overflow: hidden;

    position: relative;

    background: #fff;

    transition: transform .2s;

    box-shadow: 0 2px 8px rgba(0, 0, 0, .1)
}



.zesty-scroll-card:hover {

    transform: scale(1.02)
}



.zesty-scroll-card .zesty-scroll-thumbnail {

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 12px
}



.zesty-scroll-card video {

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 12px;

    display: block
}



.zesty-scroll-overlay {

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

    background: linear-gradient(transparent, rgba(0, 0, 0, .8));

    color: #fff;

    padding: 12px;

    border-radius: 0 0 12px 12px
}



.zesty-scroll-title {

    font-size: 14px;

    font-weight: 600;

    margin-bottom: 2px
}



.zesty-scroll-description {

    font-size: 12px;

    opacity: .8
}



@media (max-width:768px) {

    .zesty-subtitle {

        font-size: 16px;



    }



    .zesty-scroll-container {

        flex-direction: row;

        overflow-x: auto;

        overflow-y: hidden;

        gap: 15px;

        padding: 10px;

        scroll-snap-type: x mandatory
    }



    .zesty-scroll-column {

        min-width: 280px;

        height: 100vh;

        padding: 20px 0;

        scroll-snap-align: start
    }



    .zesty-scroll-track {

        animation: none
    }



    .zesty-scroll-card {

        height: 450px;

        margin: 8px 0;

        border-radius: 15px
    }

}



.test-section {

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 2rem;

    font-weight: 700;

    text-align: center;

    padding: 1rem
}



.test-section.top {

    background: linear-gradient(135deg, #667eea 0, #764ba2 100%);

    color: #fff
}



.test-section.bottom {

    background: linear-gradient(135deg, #f093fb 0, #f5576c 100%);

    color: #fff
}



.zestyy-component {

    height: 400vh;

    position: relative
}



.sticky-wrapper {

    position: sticky;

    top: 0;

    height: 100vh;

    background: #fff;

    z-index: 10;

    overflow: hidden
}



.container {

    max-width: 80%;

    margin: 0 auto;

    padding: 0 2rem;

    width: 100%;

    height: 100%
}



.content-wrapper {

    display: flex;

    align-items: center;

    gap: 4rem;

    height: 100%;

    margin-top: 50px;

}



.image-section {

    flex: 1;

    display: flex;

    justify-content: center;

    align-items: center;

    perspective: 1000px
}



.image-wrapper {

    position: relative;

    width: 100%;

    transform-style: preserve-3d
}



.image-section img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 20px;

    transform-origin: right center;

    backface-visibility: hidden
}



.text-section {

    flex: 1;

    padding: 2rem 0;

    position: relative;

    height: 100%;

    overflow: hidden
}



.text-content {

    position: relative;

    height: 100%;

    justify-content: center
}



.text-content p {

    font-size: 30px;

    line-height: 1.6;

    margin-bottom: 2rem;

    position: relative;

    transition: color 1.2s cubic-bezier(.25, .46, .45, .94);

    color: #000;

    font-weight: 700
}



.zestyy-component.scrolled-25 .text-content p {

    color: #40000c
}



.zestyy-component.scrolled-50 .text-content p {

    color: #801038
}



.zestyy-component.scrolled-75 .text-content p {

    color: #c01c64
}



.zestyy-component.scrolled-100 .text-content p {

    color: #f62681
}



@media (min-width:769px) {

    .sticky-wrapper {

        position: sticky;

        height: 90vh;

    }

}



.text-content .word {

    display: inline-block;

    background-image: linear-gradient(to right, var(--fillColor) 0, var(--fillColor) var(--p, 0), #5555554f var(--p, 0), #55555575 100%);

    -webkit-background-clip: text;

    background-clip: text;

    color: transparent;

    transition: background-position .1s linear
}



@media (max-width:890px) {

    .text-content .word {

        color: #000;

        background: 0 0 !important
    }

}



.section_fourth {

    height: 100vh;

    background-image: url('/wp-content/uploads/2025/08/numberbg.png');

    background-repeat: no-repeat;

    background-position: center;

    display: grid;

    grid-template-columns: 1.5fr 1fr;

    gap: 90px
}



.zesty-slider-container {

    width: 700px;

    height: 700px;

    max-width: 90vw;

    max-height: 90vh;

    position: relative;

    border-radius: 20px;

    overflow: hidden
}



@media (max-width:1024px) {

    .section_fourth {

        height: 100vh;

        background-image: url('/wp-content/uploads/2025/08/numberbg.png');

        background-repeat: no-repeat;

        background-position: center;

        display: grid;

        grid-template-columns: 1fr 1fr;

        gap: 0
    }



    .zesty-slider-container {

        width: 350px;

        height: 350px
    }



    .zesty-numb-classname {

        font-size: 3rem;

    }

}



@media (max-width:850px) {

    .zesty-slider-container {

        width: 350px;

        height: 350px
    }

}



@media (max-width:400px) {

    .zesty-slider-container {

        width: 300px;

        height: 300px
    }



    .zesty-subtitle {

        font-size: 14px;



    }

}



.zesty-slide-item,

.zesty-slide-item::before {

    position: absolute;

    height: 100%;

    background-position: center
}



.zesty-slide-item {

    width: 100%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    color: #fff;

    text-align: center;

    opacity: 0;

    transition: opacity .8s;

    background-size: contain;

    background-repeat: no-repeat
}



.zesty-slide-item::before {

    content: '';

    top: 0;

    left: 0;

    background-size: cover;

    filter: blur(8px);

    z-index: 0
}



.partners::after,

.partners::before {

    content: "";

    z-index: 1;

    pointer-events: none;

    inset: 0
}



.zesty-slide-1,

.zesty-slide-1::before,

.zesty-slide-4,

.zesty-slide-4::before {

    background-image: url('/wp-content/uploads/2025/08/bg1.png')
}



.zesty-slide-2,

.zesty-slide-2::before,

.zesty-slide-5,

.zesty-slide-5::before {

    background-image: url('/wp-content/uploads/2025/08/bg2.png')
}



.zesty-slide-3,

.zesty-slide-3::before {

    background-image: url('/wp-content/uploads/2025/08/bg3.png')
}



.zesty-slide-content {

    position: relative;

    z-index: 2;

    transform: translateY(80px);

    opacity: 0;

    transition: 1s cubic-bezier(.25, .46, .45, .94)
}



.flip-page-image-frame img.flip-page-show,

.flip-page-slide.flip-page-is-active .flip-page-thumb-active,

.flip-page-thumb-inactive,

.zesty-slide-item.zesty-active {

    opacity: 1
}



.zesty-slide-item.zesty-active .zesty-slide-content,

.zesty-slide-item.zesty-active .zesty-text-element {

    transform: translateY(0);

    opacity: 1
}



.zesty-numb-classname {

    font-size: clamp(3rem, 8vw, 5rem);

    font-weight: 700;

    margin-bottom: 30px;

    text-shadow: 2px 2px 4px rgba(0, 0, 0, .5);

    -webkit-background-clip: text;

    transform: translateY(60px) scale(.8);

    transition: .8s cubic-bezier(.68, -.55, .265, 1.55)
}



.zesty-slide-item.zesty-active .zesty-numb-classname {

    transform: translateY(0) scale(1)
}



.zesty-text-element {

    font-size: clamp(1.2rem, 3vw, 1.8rem);

    font-weight: 300;

    letter-spacing: 2px;

    text-transform: uppercase;

    text-shadow: 1px 1px 2px rgba(0, 0, 0, .5);

    transform: translateY(40px);

    opacity: 0;

    transition: .8s cubic-bezier(.25, .46, .45, .94) .3s
}



.eyebrow,

.get-in-form-header h2 {

    font-size: 48px;

    font-family: Poppins, sans-serif
}



.eyebrow,

.g-mark {

    line-height: 1.05;

    font-weight: 700
}



.animteVid {

    height: 80%
}



.get-in-form-group,

.make-div-relative,

.partners-wrap {

    position: relative
}



.bottomCutout,

.topCutout {

    position: absolute;

    left: 0;

    width: 100%
}



.rightNumb {

    display: flex;

    align-items: center;

    justify-content: center;

    height: 100%
}



.topCutout {

    top: 0
}



.bottomCutout {

    bottom: 0
}



.left-video {

    position: relative;

    width: 100%;

    height: 100%;

    overflow: hidden
}



.partner-bottom,

.partner-top {

    position: absolute;

    z-index: 999;

    width: 100%;

    left: 0
}



.rightMob-video {

    width: 100%;

    height: 100%;

    display: flex;

    justify-content: center;

    align-items: center
}



.animteVid,

.eyebrow span {

    display: block
}



.content,

.logo {

    align-items: center
}



.animteVid {

    object-fit: cover
}



.partner-top {

    top: 0
}



.partner-bottom {

    bottom: -2px
}



.partners {

    position: relative;

    height: 800px;

    overflow: hidden;

    isolation: isolate
}



.partners video.bg {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center;

    z-index: 0;

    filter: saturate(120%) contrast(105%)
}



.partners::before {

    position: absolute;

    background: radial-gradient(100% 80% at 80% -10%, rgba(255, 255, 255, .08) 0 40%, transparent 60%), linear-gradient(125deg, #7a2cff 0, #b44bff 20%, #c43cff 40%, #f34fb8 62%, #ff5470 78%, var(--red) 100%);

    mix-blend-mode: overlay
}



.partners::after {

    position: absolute;

    background: radial-gradient(140% 120% at 50% 75%, rgba(0, 0, 0, .25) 0 55%, rgba(0, 0, 0, .55) 100%)
}



.content {

    position: absolute;

    inset: 0;

    z-index: 2;

    display: flex;

    justify-content: center
}



.content-inner {

    width: 80%;

    margin-inline: clamp(16px, 6vw, 64px)
}



.eyebrow {

    letter-spacing: .02em;

    margin-bottom: 100px;

    color: #fff
}



.logos {

    margin-top: clamp(24px, 4vw, 56px);

    display: grid;

    grid-template-columns: repeat(5, 1fr);

    gap: clamp(12px, 2vw, 28px);

    align-items: end
}



.logo {

    display: flex;

    min-height: 56px
}



.g-mark {

    display: grid;

    letter-spacing: .2px;

    font-size: clamp(16px, 1.8vw, 22px);

    color: var(--white);

    text-shadow: 0 0 1px rgba(0, 0, 0, .05);

    font-family: Inter, sans-serif
}



.g-mark .g1 {

    font-weight: 600;

    font-size: 28px;

    margin-bottom: 10px
}



.g-mark .g2 {

    font-weight: 700;

    font-size: 40px
}



.logos.slick-initialized {

    display: block;

    position: relative
}



.logos .logo {

    padding: 4px 8px
}



.logos.slick-initialized .slick-dots {

    position: absolute;

    left: 50%;

    bottom: -170%;

    transform: translateX(-50%);

    display: flex !important;

    align-items: center;

    gap: 10px;

    padding: 8px 10px;

    margin: 0;

    list-style: none;

    z-index: 5
}



.slick-dots li {

    margin: 0
}



.slick-dots button {

    width: 8px;

    height: 8px;

    border-radius: 999px;

    border: 0;

    background: rgba(255, 255, 255, .45);

    text-indent: -9999px;

    overflow: hidden;

    padding: 0;

    cursor: pointer;

    transition: width .28s, background .28s, transform .28s
}



.slick-dots li.slick-active button {

    width: 26px;

    background: #fff;

    transform: translateY(-1px);

    box-shadow: 0 2px 10px rgba(0, 0, 0, .25)
}



@media (hover:none) {

    .slick-dots button {

        height: 10px
    }

}



@media (max-width:900px) {

    .content-inner {

        width: min(1000px, 92vw)
    }

}



@media (max-width:560px) {

    .content-inner {

        margin-inline: clamp(14px, 5vw, 22px)
    }

}



@media (prefers-reduced-motion:reduce) {

    .partners video.bg {

        animation: none
    }

}



.get-in-container {

    display: flex;

    max-width: 90%;

    width: 100%;

    background: #fff;

    border-radius: 20px;

    overflow: hidden;

    min-height: 600px;

    margin: 0 auto
}



.get-in-left-section {

    flex: 1;

    position: relative;

    min-height: 600px;

    overflow: hidden;

    bottom: -1px
}



.get-in-background-video {

    width: 100%;

    height: 100%;

    object-fit: contain;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 1
}



.get-in-video-overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    z-index: 2
}



.get-in-icon-container {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    width: 120px;

    height: 120px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 3
}



.get-in-thumbs-up-icon {

    width: 60px;

    height: 60px;

    stroke: white;

    stroke-width: 2;

    fill: none
}



.get-in-right-section {

    flex: 1;

    padding: 60px 50px;

    display: flex;

    flex-direction: column;

    justify-content: center
}



.get-in-form-input,

.get-in-form-select {

    width: 100%;

    padding: 15px 0;

    outline: 0;

    transition: border-color .3s;

    font-size: 16px
}



.get-in-form-header {

    margin-bottom: 50px
}



.get-in-form-header h2 {

    font-weight: 700;

    color: #333;

    line-height: 1.2;

    margin-bottom: 10px
}



.get-in-contact-form {

    display: grid;

    /* grid-template-columns: 1fr 1fr; */

    gap: 30px 40px;

    margin-bottom: 40px
}

.formGridContact {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 30px 40px;

    margin-bottom: 40px
}





.get-in-form-group.get-in-full-width {

    grid-column: 1/-1
}



.get-in-form-input {

    border: none;

    border-bottom: 2px solid #ddd;

    background: 0 0;

    color: #333
}



.get-in-form-input:focus {

    border-bottom-color: #9c27b0
}



.get-in-form-input::placeholder {

    color: #999;

    font-size: 16px
}



.get-in-form-select {

    border: none;

    border-bottom: 2px solid #ddd;

    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23999' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e") right 0 center/16px no-repeat;

    color: #999;

    cursor: pointer;

    appearance: none
}



.get-in-form-select:focus {

    border-bottom-color: #9c27b0;

    color: #333
}



.get-in-submit-btn {

    background: linear-gradient(135deg, #e91e63, #9c27b0);

    color: #fff;

    border: none;

    padding: 15px 40px;

    border-radius: 50px;

    font-size: 16px;

    font-weight: 600;

    cursor: pointer;

    transition: transform .2s, box-shadow .2s;

    align-self: flex-end;

    margin-top: 20px;

    text-decoration: none;

}



.get-in-submit-btn:hover {

    transform: translateY(-2px);

    box-shadow: 0 8px 25px rgba(156, 39, 176, .3)
}



.get-in-submit-btn:active {

    transform: translateY(0)
}



@media (max-width:1029px) {

    .get-in-container {

        max-width: 100%;



    }

}



/* @media only screen and (min-width: 900px) and (max-width: 1025px) {



} */



@media (max-width:992px) {

    .get-in-container {

        flex-direction: column;

        max-width: 100%;

        margin: 0;

        border-radius: 0
    }



    .get-in-left-section {

        min-height: 300px;

        width: 100%;

        flex: none
    }



    .get-in-background-video {

        width: 100%;

        height: 100%;

        object-fit: contain;

    }



    .get-in-right-section {

        padding: 40px 30px
    }



    .get-in-form-header h2 {

        font-size: 36px
    }

}



@media (max-width:768px) {

    .section_fourth {

        height: 117vh;

        background-image: url('/wp-content/uploads/2025/08/mobile-number.png');

        background-repeat: no-repeat;

        background-position: center;

        grid-template-columns: 1fr;

    }



    .rightMob-video {

        height: 77%;

    }



    .formGridContact {

        grid-template-columns: 1fr 1fr;

        gap: 25px
    }



    .get-in-form-header {

        margin-bottom: 30px
    }



    .get-in-form-header h2 {

        font-size: 32px
    }

}



@media (max-width:500px) {


    .zesty-cta-buttons {

        flex-direction: column;

    }



    .zesty-cta-button {

        font-size: 17px !important;

        text-align: center;

    }



    .rightMob-video {

        height: 80%;

    }



    .section_fourth {

        height: 90vh;

    }
    .creaTorProfileSection .get-in-submit-btn{
        width: unset;
            right: 11px;
    }



    .get-in-right-section {

        padding: 30px 20px
    }



    .get-in-form-header h2 {

        font-size: 28px
    }



    .get-in-submit-btn {

        width: 100%;

        padding: 15px
    }



    .formGridContact {

        grid-template-columns: 1fr;

        gap: 25px
    }



    .g-mark {

        text-align: center
    }



    .partners {

        height: 500px
    }



    .logos.slick-initialized .slick-dots {

        bottom: -44%
    }

}



.partnerLLogos {

    padding: 10px
}



.logos .slick-slide img {

    margin: auto
}



.zesty-main-container {

    display: flex;

    flex-direction: column;

    margin-top: 100px
}



.zesty-content-spacer::before {

    content: "Zestyy Website Content Area";

    color: #6c757d;

    font-size: 1.5rem;

    font-weight: 300
}



.zesty-footer-wrapper {

    background: #fff
}



.zesty-footer-container {

    max-width: 90%;

    padding: 60px 20px 40px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: 1fr 1fr 2fr;

    gap: 60px;

    align-items: start
}



.zesty-footer-wrapper .zesty-brand-section {

    display: flex;

    flex-direction: column;

    gap: 30px
}





.footerLogo {

    width: 60%;

    height: auto
}



.zesty-address-title {

    font-size: 1.4rem;

    font-weight: 600;

    color: #333;

    margin-bottom: 12px
}



.zesty-address-text {

    color: #666;

    font-size: .95rem;

    line-height: 1.5
}



.zesty-social-media-row {

    display: flex;

    gap: 25px;

    align-items: center
}



.zesty-social-link {

    width: 40px;

    height: 40px;

    border-radius: 50%;

    background: #b83dba;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #fff;

    font-size: 1.1rem
}



.zesty-social-link:hover {

    background: #9a2d9d;

    transform: translateY(-2px);

    box-shadow: 0 4px 12px rgba(184, 61, 186, .3)
}



.zesty-navigation-grid {

    display: grid;

    grid-template-columns: 1fr;

    gap: 40px
}



.zesty-nav-column {

    display: flex;

    flex-direction: column;
    padding-left: 50px;

}



.zesty-column-header {

    font-size: 1.1rem;

    font-weight: 600;

    color: #333;

    margin-bottom: 20px;

    padding-bottom: 8px
}



.zesty-copyright-text,

.zesty-legal-link {

    color: #666;

    font-size: .9rem
}



.zesty-nav-list {

    list-style: none;

    display: flex;

    flex-direction: column;

    gap: 12px
}



.zesty-nav-link {

    color: #666;

    font-size: .95rem;

    transition: color .25s
}



.zesty-legal-link:hover,

.zesty-nav-link:hover {

    color: #b83dba
}



.zesty-footer-bottom {

    border-top: 1px solid #e9ecef;

    padding: 20px 0
}



.zesty-footer-bottom-container {

    max-width: 90%;

    margin: 0 auto;

    padding: 0 20px;

    display: flex;

    justify-content: space-between;

    align-items: center
}



.zesty-legal-links {

    display: flex;

    align-items: center;

    gap: 10px
}



.zesty-separator {

    color: #ccc;

    font-size: .9rem
}



@media (max-width:1024px) {

    .zesty-footer-container {

        grid-template-columns: 1fr 1fr;

        gap: 40px;

        padding: 40px 20px 30px;

        max-width: 90%;



    }





}



@media (max-width:768px) {





    .zesty-footer-bottom-container {

        flex-direction: column;

        gap: 15px;

        text-align: center
    }



    .zesty-social-media-row {

        justify-content: center
    }





}



@media (max-width:480px) {

    .zesty-scroll-container {

        gap: 10px;

        padding: 5px
    }



    .zesty-scroll-column {

        min-width: 250px;

        padding: 15px 0
    }



    .zesty-scroll-card {

        height: 400px;

        margin: 5px 0
    }



    .zesty-navigation-grid {

        grid-template-columns: 1fr;

        gap: 25px
    }



    .zesty-footer-container {

        padding: 30px 15px 20px;

        max-width: 90%;

    }



    .zesty-social-link {

        width: 35px;

        height: 35px;

        font-size: 1rem
    }



    .zesty-legal-links {

        flex-direction: column;

        gap: 8px
    }



    .zesty-separator {

        display: none
    }



    .zesty-footer-container {

        grid-template-columns: 1fr;

        gap: 40px;

        padding: 40px 20px 30px
    }

}



.fixed-img {

    position: absolute;

    top: 10px;

    right: 10px;

    width: 50px;

    height: auto;

    z-index: 9999
}



.fixed-img.first {

    top: 20%;

    right: 76px;

    width: 250px
}



.fixed-img.second {

    top: 111px;

    width: 149px;

    right: 19%
}



.fixed-img.third {

    top: 161px;

    width: 150px;

    right: 31%
}



@media (max-width:768px) {

    .fixed-img.first {

        top: -1%;

        right: 0;

        width: 250px
    }



    .fixed-img.third {

        top: 161px;

        width: 150px;

        right: 17%
    }



    .fixed-img.second {

        top: 44px;

        width: 149px;

        right: 26%
    }

}



@media (max-width:425px) {

    .fixed-img.first {

        top: -1%;

        right: 0;

        width: 192px
    }

}



.flip-page-image-frame {

    perspective: 1200px;

    transform-style: preserve-3d
}



.flip-page-section {

    min-height: 100vh;

    padding: 80px 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: linear-gradient(135deg, #667eea 0, #764ba2 100%);

    color: #fff;

    font-size: 2rem;

    text-align: center
}



.flip-page-section:nth-child(2n) {

    background: linear-gradient(135deg, #f093fb 0, #f5576c 100%)
}



.flip-page-slider-container {

    width: 100%;

    margin: 0 auto;

    position: relative;

    min-height: 300vh
}



.flip-page-slider-wrapper {

    position: sticky;

    top: 0;

    height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    padding: 32px
}



.flip-page-sticky-grid {

    width: 100%;

    height: 100%;

    display: flex;

    gap: 24px;

    margin: 0 auto
}



.flip-page-left-pane,

.flip-page-right-pane {

    flex: 1 1 50%;

    height: 100%;

    position: relative;

    border-radius: 20px;

    overflow: hidden
}



.flip-page-left-pane {

    display: flex;

    align-items: center;

    justify-content: center;

    padding-inline: 12px;

    background-image: url('/wp-content/uploads/2025/08/flipbg.png');

    background-size: contain;

    background-position: bottom right;

    background-repeat: no-repeat
}



.flip-page-slider {

    position: relative;

    width: 100%;

    max-width: 680px;

    height: 640px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center
}



.flip-page-slide {

    position: absolute;

    width: clamp(280px, 100%, 560px);

    min-height: 170px;

    height: auto;

    background: rgba(255, 255, 255, .1);

    border-radius: 20px;

    display: flex;

    align-items: flex-start;

    justify-content: flex-start;

    gap: 16px;

    padding: 20px;

    border: 1px solid rgba(255, 255, 255, .2);

    transition: .6s cubic-bezier(.4, 0, .2, 1);

    transform-origin: center;

    color: #fff
}



.flip-page-slide-thumb {

    position: relative;

    width: 100px;

    height: 100px;

    flex-shrink: 0;

    overflow: hidden;

    background: #ffffff22
}



.flip-page-slide-thumb img {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    object-fit: contain;

    transition: opacity .3s
}



.flip-page-slide-title {

    font-size: 30px;

    /* font-weight: 700; */

    line-height: 1.4;

    word-break: break-word;

    white-space: normal;

    max-width: calc(100% - 76px);

    color: #000
}



.flip-page-slide:first-child {

    top: 225px;

    transform: scale(1) translateY(0);

    opacity: 1;

    filter: blur(0);

    z-index: 3
}



.flip-page-slide:nth-child(2) {

    top: 450px;

    transform: scale(.92) translateY(10px);

    opacity: .95;

    filter: blur(0);

    z-index: 2
}



.flip-page-slide:nth-child(3) {

    top: 40px;

    transform: scale(.82) translateY(-20px);

    opacity: .45;

    filter: blur(8px);

    z-index: 1
}



.flip-page-slide:nth-child(n+4) {

    opacity: 0;

    filter: blur(12px);

    z-index: 0
}



.flip-page-navigation {

    position: absolute;

    bottom: 18px;

    left: 50%;

    transform: translateX(-50%);

    display: flex;

    gap: 10px
}



.flip-page-nav-dot {

    width: 12px;

    height: 12px;

    border-radius: 50%;

    background: rgba(255, 255, 255, .3);

    cursor: pointer;

    transition: .3s
}



.flip-page-nav-dot.flip-page-active {

    background: #ff6b6b;

    transform: scale(1.2)
}



.flip-page-scroll-indicator {

    position: fixed;

    top: 50%;

    right: 30px;

    transform: translateY(-50%);

    width: 4px;

    height: 200px;

    background: rgba(255, 255, 255, .2);

    border-radius: 2px;

    opacity: 0;

    transition: opacity .3s
}



.flip-page-scroll-progress {

    width: 100%;

    background: linear-gradient(to bottom, #ff6b6b, #feca57);

    border-radius: 2px;

    transition: height .3s;

    height: 0%
}



.flip-page-right-pane {

    background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02));

    border: 1px solid rgba(255, 255, 255, .08);

    display: flex;

    align-items: center;

    justify-content: center
}



.flip-page-image-frame {

    position: relative;

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden
}



.flip-page-image-frame img {

    backface-visibility: hidden;

    transform-origin: center;

    position: absolute;

    inset: 0;

    margin: auto;

    max-width: 100%;

    max-height: 100%;

    object-fit: cover;

    opacity: 0;

    transition: opacity .5s;

    filter: contrast(1.05) saturate(1.05)
}



@media (max-width:1024px) {

    .flip-page-slide-title {

        font-size: 23px
    }



    .flip-page-left-pane,

    .flip-page-right-pane {

        flex-basis: auto;

        height: 80%;

    }



    .flip-page-slider {

        height: 515px
    }



    .flip-page-slide:first-child {

        top: 200px
    }



    .flip-page-slide:nth-child(2) {

        top: 400px
    }



    .flip-page-slide:nth-child(3) {

        top: 30px
    }

}



@media (min-width:769px) and (max-width:1024px) {

    .flip-page-sticky-grid {

        flex-direction: row;

        justify-content: center;

        align-items: center
    }

}



@media (max-width:640px) {

    .flip-page-slide {

        width: clamp(240px, 100%, 520px);

        padding: 0
    }



    .flip-page-slide-title {

        font-size: 16px
    }



    .zesty-main-container {

        display: flex;

        flex-direction: column;

        margin-top: 10px
    }



    .flip-page-slide-thumb {

        width: 50px;

        height: 50px
    }



    .flip-page-slider {

        height: 400px
    }

}



.eyebrow.zestyService {

    color: #000;

    position: absolute;

    top: 70px;

    left: 100px
}



@media (max-width:1024px) {

    .eyebrow.zestyService {

        color: #000;

        position: absolute;

        top: 0px;

        left: 100px
    }



    .flip-page-left-pane {

        object-fit: contain
    }

}



@media (max-width:768px) {

    .flip-page-sticky-grid {

        flex-direction: column
    }



    .eyebrow.zestyService {

        display: block;

        color: #000;

        position: absolute;

        top: 56px;

        left: 42px
    }



    .eyebrow span {

        text-align: center
    }



    .get-in-icon-container img {

        width: 50%
    }



    .fixed-img {

        opacity: .4
    }



    .zestyLogo {

        font-family: 'Times New Roman Bold';

        font-size: clamp(28px, 3rem, 95px);

        letter-spacing: 0;

        background: linear-gradient(262deg, #bc0eff 6.63%, #f62681 89.52%);

        background-clip: text;

        -webkit-background-clip: text;

        -webkit-text-fill-color: transparent;

        position: relative;

        top: 11px;

        font-size: 100px;

    }

}



.flip-page-slide-mobile {

    display: flex;

    flex-direction: row;

    gap: 20px;

    /* justify-content: center; */

    align-items: center;

    margin-bottom: 20px;

    max-width: 80%;

    margin: 30px auto;

    width: 80%;

}



.flip-page-slide-thumb-mobile img {

    /* width: 100%; */

    height: 42px;



}



.flip-page-slide-thumb-mobile {

    position: relative;

    top: 5px;

}



.pageFlipMMobile {

    display: none;

}







.video-wrapper-zesty {

    position: relative;

    width: 90%;

    /* responsive */

    overflow: hidden;

}



.video-wrapper-zesty video {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

}



.video-wrapper-zesty img {

    position: absolute;

    top: -2px;

    left: 0;

    width: 100%;

    height: 100%;

    object-fit: contain;

    /* keeps shape aspect */

    pointer-events: none;

    /* lets clicks pass through */

}



@media (max-width:850px) {

    .pageFlipMMobile {

        display: block;

        margin-top: 30px;

        margin-bottom: 30px;

    }



    .flip-page-slider-container {

        display: none !important;

    }



    .fixed-img {

        opacity: 0.4;

    }



    .partners {

        height: 500px;

    }



    .video-wrapper-zesty {

        width: 50%;

        display: block;

        margin: 0 auto;



    }



    .flip-page-slide-thumb-mobile img {

        height: 60px;

    }



}



@media only screen and (min-width: 768px) and (max-width: 850px) {

    .get-in-left-section {

        min-height: 400px;

    }

}

.AboutFooter .zesty-subtitle {

    font-size: 0.95rem;

    color: #666;

}





@media (max-width:500px) {
    .zesty-nav-column {
        padding-left: 0px;
    }

    .zesty-social-media-row {
        justify-content: start;
    }

    .text-content p {

        font-weight: 100;

    }



    .flip-page-slide-title-99 {

        font-size: 14px;

    }



    .video-wrapper-zesty {

        width: 90%;

        display: block;

        margin: 0 auto;



    }



    .zesty-footer-container {

        max-width: 90%;

    }

    .AboutFooter .zesty-subtitle {

        font-size: 14px;

        color: #000000b0;

        margin-bottom: 30px;

        max-width: 600px;

    }

}







.partners-wrap {

    display: none;

}



.zesty-loader {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: #fff;
    /* change background if needed */

    display: flex;

    justify-content: center;

    align-items: center;

    z-index: 9999;

}



.zesty-loader img {

    /* width: 50%;  */

    height: auto;

}



.LastLetter {

    letter-spacing: 0px;

    /* position: relative;

    left: -16px;

    top: 0px; */

}

.usernameCreator a {

    text-decoration: none;

    color: #bbb;

}



/* .scroll-sec-right-section.creatorPage{

flex-direction: column;

align-items: end;

} */

.serviceCta .zesty-secondary-button{
background: transparent !important;
color: #fff  !important;
}
.leftAlignText{
    text-align: left !important;
}