html,
body {
    font-family: "Inter", sans-serif;
    box-sizing: border-box;
    overflow-x: hidden;
    background: #6F6F6F;
    color: #000;
    z-index: 1;
}

*,
*:after,
*:before {
    box-sizing: border-box;
    outline: none;
    color: #000;
    text-rendering: optimizeLegibility ;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

* {
  font-family: "Inter", sans-serif;
}

body.woocommerce {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

body {
    position: relative;
    background:  #fff;   
    color: #000;
    width: 100%;
    margin: 0;
    padding: 0 0 0 0;
    overflow-x: hidden;
    z-index:  1;    
}

.no-scroll {
    overflow: hidden !important;
}

a {
    text-decoration: none;
}

.btn {
    transition: 300ms;
}

b,
strong {
    font-weight: 600 !important;
}

i {
    font-style: italic !important;
}

.loader {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.6);
    z-index: 9999;
}

.loader svg {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
}

.flex-container {
    display: flex;
    display: -ms-flexbox;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-pack: center;
    justify-content: center;
}

.flex-container.align-center {
    -ms-flex-align: center;
    align-items: center;
}

.flex-container.wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.flex-container.no-center {
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.flex-container>.half {
    width: 50%;
}

[data-fancybox] {
    cursor: pointer;
}

.container {
    padding:  0 40px;
    width:  100%;
    max-width:  1440px;
    margin:  0 auto;
}

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 35px 0;
    background: rgba(105, 105, 105, 0.01);
    box-shadow: 0px 4px 4px 0px rgba(75, 75, 74, 0.00);
    backdrop-filter: blur(30px);
    z-index: 9999;
}

.header .flex-container {
    justify-content: space-between;
    align-items: center;
}

.header .flex-container a.logo svg {
    width: 138px;
}

.header .flex-container ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 35px;
    align-items: center;
    justify-content: space-between;
}

.header .flex-container ul li.active {
    border-bottom: 1px solid #fff;
}

.header.dark .flex-container ul li.active {
    border-bottom: 1px solid #363844;
}

.header .color {
    transition: 300ms;
}

.header.dark .color {
    fill: #363844;
}

.breadcrumbs {
    color: var(--KTI-GREY, var(--KTI-LIGHT-GREY, #D7D7D7));
}

.breadcrumbs,
.breadcrumbs * {
    font-size: 16px !important;
    text-transform: uppercase !important;
}

.header .flex-container ul li a {
    color: var(--Brand-colors-Off-Purple-Off-Purple_000, #FFF);
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%; /* 19.2px */
    text-transform: uppercase;
    transition: 300ms;

    transition: 300ms;
}

.header.dark .flex-container ul li a {
    color: #363844;
}

.header .flex-container ul li a svg {
    display: block;
}

.header .flex-container ul li a:hover {
    filter: brightness(0.7);
}
 
.newsletter {
    padding: 96px 0;
    background: #6F6F6F;
}

.newsletter .flex-container {
    justify-content: space-between;
    gap: 130px;
}

.newsletter .flex-container .half:first-of-type {
    width: calc(60% - 65px);
}

.newsletter .flex-container .half p.title {
    color: #FFF;
    font-family: Inter;
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: 110%; /* 39.6px */
    letter-spacing: -1.08px;
    margin: 0 auto;
}

.newsletter .flex-container .half:last-of-type {
    width: calc(40% - 65px);
}

.newsletter .flex-container .half form {
    width: 100%;
}

.newsletter .flex-container .half form div {
    display: flex;
    gap: 50px;
    justify-content: space-between;
    border-bottom: 1px solid #fff;
}

.newsletter .flex-container .half form div input {
    border: none;
    background: none;
    color: #FFF;
    /* Desktop/Text/body */
    font-family: Archivo;
    font-size: 19px;
    font-style: normal;
    font-weight: 400;
    line-height: 145%;
}

.newsletter .flex-container .half form div input::placeholder {
    color: #FFF;
    /* Desktop/Text/body */
    font-family: Archivo;
    font-size: 19px;
    font-style: normal;
    font-weight: 400;
    line-height: 145%;
}

.newsletter .flex-container .half form div button {
    background: none;
    border: none;
    transition: 300ms;
    cursor: pointer;
}

.newsletter .flex-container .half form div button:hover {
    background: #fff;
}

.newsletter .flex-container .half form div button svg path {
    transition: 300ms;
}

.newsletter .flex-container .half form div button:hover svg path {
    stroke: #6F6F6F;
}

.newsletter .flex-container .half form p.check {
    margin-top: 10px;
    margin-bottom: 0;
    color: var(--gray-gray-200, #B9B9B9);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 120%; 
}

footer {
    background: var(--gray-gray-600-primary, #252525);
    padding: 100px 0 60px 0;
}

footer .main .flex-container {
    justify-content: space-between;
    gap: 30px;
}

footer .main .flex-container .logo {
    width: 180px;
    height: auto;
}

footer .main .flex-container .column:first-of-type {
    width: 30%;
}

footer .main .flex-container .column {
    width: calc(17% - 30px);
}

footer .main .flex-container .column:nth-child(5) {
    width: calc(18.5% - 30px);
}

footer .main .flex-container .column p:not(.title) {
    color: var(--gray-gray-150, #CECECE);
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    margin: 0 auto;
}

footer .main .flex-container .column p.title {
    color: #FFF;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; 
    margin: 0 auto 15px auto;
    text-transform: uppercase;
}

footer .main .flex-container .column p.title.social {
    margin-top: 65px;
}

footer .main .flex-container .column ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

footer .main .flex-container .column ul li + li {
    margin-top: 5px;
}

footer .main .flex-container .column ul li a {
    color: var(--gray-gray-150, #CECECE);
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; 
    transition: 300ms;
}

footer .main .flex-container .column ul li a:hover {
    color: #fff;
}

footer .main .flex-container .column ul.social {
    display: flex;
    gap: 16px;
}

footer .main .flex-container .column ul.social li {
    display: inline-block;
}

footer .main .flex-container .column ul.social li + li {
    margin: 0;
}

footer .main .flex-container .column ul.social li a svg path {
    transition: 300ms;
}

footer .main .flex-container .column ul.social li a:hover svg path {
    fill: #fff;
}

footer .copy .flex-container {
    justify-content: space-between;
    align-items: center;
    margin-top: 55px;
    padding-top: 32px;
    border-top: 1px solid #4F4F4F;
}

footer .copy .flex-container .half {
    width: 50%;
}

footer .copy .flex-container .half p {
    color: var(--gray-gray-400, #7A7A7A);
    font-family: Inter;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; 
    margin: 0;
}

footer .copy .flex-container .half:last-of-type p {
    text-align: right;
}

footer .main .flex-container .column:last-of-type {
    display: none;
}

.mobile_menu,
.mega_menu {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100dvh;
    background: rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(5px);
    transition: 300ms;
    z-index: 999999;
}

.mobile_menu.open,
.mega_menu.open {
    opacity: 1;
}

.mobile_menu .in,
.mega_menu .in {
    position: absolute;
    width: 100%;
    height: 100dvh;
    max-width: 680px;
    background: #FAFAFA;
    top: 0;
    right: -100%;
    padding: 80px 96px 0 96px;
    transition: 500ms;
}

.mobile_menu .in.open,
.mega_menu .in.open {
    right: 0;
}

.mobile_menu .in p.title,
.mega_menu .in p.title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 48px;
}

.mobile_menu .in p.title span,
.mega_menu .in p.title span {
    color: var(--KTI-GREY, #363844);
    font-family: Inter;
    font-size: 48px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* 48px */
    letter-spacing: -0.96px;
}

.mobile_menu .in p.title a svg,
.mega_menu .in p.title a svg {
    display: block;
    width: 30px;
    height: 30px;
}

.mobile_menu .in>ul,
.mega_menu .in>ul {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: calc(100% - 200px);
    overflow-y: auto;
}

.mobile_menu .in ul li,
.mega_menu .in ul li {

}

.mobile_menu .in ul li + li,
.mega_menu .in ul li + li {
    margin-top: 24px;
}

.mobile_menu .in ul li a,
.mega_menu .in ul li a {
    display: flex;
    padding: 15px 12px;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #363844;
}

.mobile_menu .in ul li a span,
.mega_menu .in ul li a span {
    color: #363844;

    leading-trim: both;

    text-edge: cap;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.48px;
    text-transform: uppercase;
}

.mobile_menu .in ul:not(.submenu)>li>a>svg,
.mega_menu .in ul:not(.submenu)>li>a>svg {
    width: 10px;
    height: 10px;
}

.mobile_menu .in ul li form,
.mega_menu .in ul li form {

}

.mobile_menu .in ul li form div,
.mega_menu .in ul li form div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 5px 15px 12px;
    border-bottom: 1px solid #363844;
}

.mobile_menu .in ul li form div input,
.mega_menu .in ul li form div input {
    background: none;
    border: none;
    color: var(--KTI-GREY, #363844);
    leading-trim: both;
    text-edge: cap;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.48px;
}

.mobile_menu .in ul li form div input::placeholder,
.mega_menu .in ul li form div input::placeholder {
    color: var(--KTI-GREY, #363844);
    leading-trim: both;
    text-edge: cap;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    letter-spacing: -0.48px;
}

.mobile_menu .in ul li form div button,
.mega_menu .in ul li form div button {
    border: none;
    background: none;
}

.mobile_menu .in ul li form p,
.mega_menu .in ul li form p {
    margin: 10px 0 0 0;
    padding: 0 10px;
    color: var(--gray-gray-200, #B9B9B9);
    font-family: Inter;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
}

.mobile_menu .in ul.submenu,
.mega_menu .in ul.submenu {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile_menu .in ul.submenu li,
.mega_menu .in ul.submenu li {
    margin: 0;
}

.mobile_menu .in ul.submenu li a,
.mega_menu .in ul.submenu li a {
    color: var(--KTI-GREY, #363844);
    border-bottom: 0.5px solid var(--KTI-GREY, #363844);
    leading-trim: both;
    padding: 15px 12px;
    text-edge: cap;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 140%; /* 16.8px */
    letter-spacing: -0.36px;
}

.mobile_menu .in ul.submenu .subsubmenu, 
.mega_menu .in ul.submenu .subsubmenu {
    list-style: none;
    padding: 0;
}

.mobile_menu .in ul.submenu .subsubmenu li a, 
.mega_menu .in ul.submenu .subsubmenu li a {
    padding-left: 35px;
}

.mobile_menu .in ul li a svg.minus,
.mega_menu .in ul li a svg.minus {
    display: none;
}

.mobile_menu .in ul li a.open svg.plus,
.mega_menu .in ul li a.open svg.plus {
    display: none;
}

.mobile_menu .in ul li a.open svg.minus,
.mega_menu .in ul li a.open svg.minus {
    display: block;
}

.mobile_menu .in ul.submenu li p,
.mega_menu .in ul.submenu li p {
    border-bottom: 0.5px solid var(--KTI-GREY, #363844);
    padding: 15px 12px;
    margin: 0;
    color: var(--gray-gray-200, #B9B9B9);
    font-family: Inter;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
}

.mobile_menu .in ul.submenu li a
.mega_menu .in ul.submenu li a {
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.mobile_menu ul.sumbenu {
    display: none;
    padding: 0;
    list-style: none;
}

.mobile_menu ul.sumbenu li,
.mobile_menu ul.sumbenu li * {
    border: none !important;
}

.mobile_menu ul.sumbenu li a {
    padding: 0;
    color: #363844;
    border: none;
    leading-trim: both;
    text-edge: cap;
    padding: 0;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 140%;
    letter-spacing: -0.36px;
}

.mobile_menu ul.sumbenu li {
    border: none;
    color: #363844;
    leading-trim: both;
    padding: 15px 12px 15px 12px;
    text-edge: cap;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    margin-top: 0 !important;
    letter-spacing: -0.36px;
}

.mobile_menu ul.sumbenu li:not(:last-of-type) {
    margin-top: 0 !important;
    border-bottom: 0.5px solid #363844 !important;
}

@media only screen and (max-width: 996px) {
    body {
        padding-top: 0;
    }

    .header {
        padding: 25px 0;
    }

    .container {
        padding: 0 20px;
    }

    .header .flex-container ul li {
        display: none;
    }

    .header .flex-container ul li:last-of-type {
        display: block;
    }

    .newsletter {
        padding: 50px 0;
    }

    .newsletter .flex-container {
        flex-wrap: wrap;
        gap: 50px;
    }

    .newsletter .flex-container .half {
        width: 100% !important;
    }

    .newsletter .flex-container .half p.title {
        font-size: 28px;
    }

    footer {
        padding: 60px 0;
    }

    footer .copy .flex-container {
        flex-wrap: wrap;
    }

    footer .copy .flex-container .half {
        width: 100%;
        text-align: left;
    }

    footer .copy .flex-container .half:last-of-type p {
        text-align: left;
        margin-top: 0;
    }

    footer .main .flex-container {
        flex-wrap: wrap;
    }

    footer .main .flex-container .column {
        width: 100% !important;
    }

    footer .main .flex-container .column:first-of-type {
        width: 100% !important;
    }

    footer .main .flex-container .column:nth-child(5) ul li:nth-child(4),
    footer .main .flex-container .column:nth-child(5) ul li:nth-child(6),
    footer .main .flex-container .column:nth-child(2) p.title,
    footer .main .flex-container .column:nth-child(2) ul li:nth-child(5),
    footer .main .flex-container .column:nth-child(2) ul li:nth-child(6),
    footer .main .flex-container .column:nth-child(2) ul li:nth-child(7),
    footer .main .flex-container .column:nth-child(3),
    footer .main .flex-container .column:nth-child(4),
    footer .main .flex-container .column:nth-child(2) .social {
        display: none;
    }

    footer .main .flex-container .column:last-of-type {
        display: block;
        width: 100% !important;
        text-align: center;
    }

    footer .main .flex-container .column p.title {
        margin-top: 30px;
    }

    footer .main .flex-container .column ul.social {
        align-items: center;
        justify-content: flex-start;
    }

    footer .main .flex-container .column ul.social li a svg {
        width: auto;
        height: 22px;
    }

    footer .main .flex-container .column ul.social {
        gap: 16px;
        margin-top:0;
    }

    footer .main .flex-container .column p.title.social {
        margin-top: 30px;
        text-align: left;
    }

    footer .main .flex-container .column li .mobile {
        display: block;
        margin-top: 40px;
    }

    .mobile_menu .in,
    .mega_menu .in {
        padding: 20px;
    }

    .mobile_menu .in>ul,
    .mega_menu .in>ul {
        max-height: calc(100% - 120px);
    }
}