@font-face {
    font-family: 'RedHatDisplay';
    src: url('../fonts/Red_Hat_Display/static/RedHatDisplay-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RedHatDisplayItalic';
    src: url('../fonts/Red_Hat_Display/static/RedHatDisplay-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Arial Black';
    src: url('../fonts/Arial_Black/Arial-Black.ttf') format('truetype');
    font-weight: normal;
    font-style: bolt;
}

html {
    margin-top: 0rem !important;
}

/* Initial styles */

*,
::before,
::after {
    padding: 0;
    margin: 0;
    border: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: inherit;
}

ul,
ol,
li {
    list-style: none;
}

img {
    vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: inherit;
    font-size: inherit;
}

html,
body {
    height: 100%;
    line-height: 1;
    margin: 0;
    padding: 0;
}

body {
    overflow-x: hidden;
}

.fullpage section {
    min-height: 100vh;
    display: flex;
    justify-content: space-between !important;
    overflow: hidden;
}

textarea,
button,
input {
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    font-family: inherit;
}

button {
    cursor: pointer;
    background-color: inherit;
}

body {
    font-family: 'RedHatDisplay';
    color: #000000;
    background: #FFFFFF;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

[class*="__container"] {
    /* max-width: 121.875rem; */
    padding: 0 calc((15 / 1920) * 100vw) 0 calc((15 / 1920) * 100vw);
    margin: 0 auto;
    width: 100%;
}

h2 {
    font-family: 'Arial Black', Arial, Helvetica, sans-serif !important;
}

/* Full-page styles */

.swiper-slide {
    justify-content: center;
    align-items: center;
    position: relative;
    background: #F8C700;
    display: flex;
    overflow: hidden;
}

.mySwiper .swiper-slide {
    height: 100vh !important;
}

.swiper-slide img {
    width: 100%;
    height: 55vh;
    object-fit: cover;
    object-position: center;
    mix-blend-mode: screen;
}

.drawer-slide-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: calc((45 / 1920) * 100vw);
    font-weight: 900;
    line-height: calc((198.45 / 1920) * 100vw);
    color: #FFFFFF;
    text-transform: uppercase;
    z-index: 999;
    text-align: center;
    letter-spacing: calc((30 / 1920) * 100vw);
}

.hero-slide-text {
    max-width: calc((750 / 1920) * 100vw);
    overflow-x: hidden;
    position: absolute;
    top: 50%;
    font-size: calc((45 / 1920) * 100vw);
    font-weight: 900;
    line-height: calc((198.45 / 1920) * 100vw);
    color: #FFFFFF;
    text-transform: uppercase;
    z-index: 999;
    text-align: left;
    letter-spacing: calc((30 / 1920) * 100vw);
    right: 0;
    transform: translateY(-50%);
    margin-right: calc((55 / 1920) * 100vw);
}

.header-navigation {
    display: flex;
    flex-direction: column;
    height: 50vh;
    height: 50dvh;
    justify-content: space-around;
    border: none;
}

nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#drawer nav {
    align-items: flex-start;
}

#drawer .nav-block nav a {
    line-height: calc((28 / 1920)* 100vw);
    line-height: calc((28 / 1920)* 100dvw);
    padding-bottom: calc((21 / 1920)* 100vw);
    padding-bottom: calc((21 / 1920)* 100dvw);
    font-size: calc((42 / 1920)* 100vw);
    font-size: calc((42 / 1920)* 100dvw);
}

#drawer .nav-block nav li:not(:first-child) a {
    padding-top: calc((28 / 1920) * 100vw);
    padding-top: calc((28 / 1920) * 100dvw);
}

#drawer .nav-block nav li:last-child a {
    display: flex;
    align-items: center;
    gap: calc((23 / 1920) * 100vw);
    gap: calc((23 / 1920) * 100dvw);
}

#drawer .nav-block nav li:last-child a img {
    width: calc((40 / 1920) * 100vw);
    width: calc((40 / 1920) * 100dvw);
    height: calc((40 / 1920) * 100vw);
    height: calc((40 / 1920) * 100dvw);
}

.what-block {
    background: black;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100vh;
    height: 100dvh;
}

.what-block .fp-overflow {
    overflow-x: hidden;
}

#section-hero .fp-overflow {
    height: 100vh;
}

#section-hero .logo-box {
    padding-left: calc((75 / 1920) * 100vw);
    padding-top: 7vh;
    display: flex;
    position: relative;
}

#section-hero nav {
    font-family: "Arial Black", Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    font-size: 1.5vw;
    justify-content: flex-end;
    /* gap: 5vw; */
    gap: 3.4vw;
    margin-right: calc((80 / 1920)* 100vw);
    font-weight: 900;
}

#section-hero nav a.account-but {

    display: flex;
    align-items: center;

    img {
        width: calc((30 / 1920)* 100vw);
        height: calc((30 / 1920)* 100vw);
    }

}

.logo-box img {
    width: calc((886 / 1920) * 100vw);
    object-fit: cover;
    transition: opacity 0.3s ease-in-out;
}

.logo-box img.white {
    opacity: 0;
    position: absolute;
}

.what-block h2 {
    color: rgba(255, 255, 255, 1);
    margin-left: 0;
    font-size: calc((200 / 1920) * 100vw);
    font-weight: 900;
    margin-left: 8vw;
    line-height: calc((269 / 1920) * 100vw);
}

.what-block.section {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.what-block.section .main-content .content {
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
}

.sidebar__inner.menu-item {
    border-radius: calc((30 / 1920) * 100vw);
    max-width: fit-content;
    padding: calc((23 / 1920) * 100vw) calc((26 / 1920) * 100vw);
    z-index: 99999;
    right: calc((63 / 1920) * 100vw);
    top: calc((21 / 1920) * 100vw);
    position: fixed;
    z-index: 1000;
    cursor: pointer;
    display: none;
}

.sidebar__inner.menu-item span {
    display: flex;
    align-items: center;
    position: relative;
}

.sidebar__inner.menu-item span img {
    width: calc((45 / 1920) * 100vw);
}

.cart-box.top-item {
    position: fixed;
    z-index: 1000;
    right: calc((180 / 1920)* 100vw);
    top: calc((41 / 1920)* 100vw);
    display: none;
}

.cart-box.top-item .cart-contents {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cart-box.top-item .images-box {
    position: relative;
    display: inline-flex;
    width: calc((30 / 1920)* 100vw);
    height: calc((30 / 1920)* 100vw);
}

.cart-box.top-item .images-box img {
    position: absolute;
    top: 0;
    transition: opacity 0.3s ease-in-out;
    object-fit: cover;
    object-position: center;
    width: 100%;
}

.cart-box.top-item .images-box img.yellow-cart {
    opacity: 0;
}

.cart-box.top-item .cart-icon {
    font-size: calc((29 / 1920)* 100vw);
    line-height: calc((32 / 1920)* 100vw);
    color: white;
    transition: color 0.3s ease;
}

.what-block img.HOOKD-bottle-image {
    position: absolute;
    /* top: calc((218 / 1920)* 100vw); */
    /* left: calc((862 / 1920)* 100vw);
    pointer-events: none;
    transform: rotate(16deg) scale(1.25);
    width: calc((165 / 1920) * 100vw); */
    width: calc((165 / 1920) * 100vw);
    top: 8vw;
    left: 50vw;
    /* transform: translate(-50%, -50%); */
}

nav {
    position: relative;
}

.hero-container .swiper.mySwiper {
    height: 50vh;
    overflow: hidden;
}

.no-scroll {
    overflow: hidden;
}

.what-text-description {
    color: rgba(255, 255, 255, 1);
    /* background: #484444; */
    /* background-color: rgba(51, 51, 51, 1); */
    /* background-color: rgba(40, 40, 40, 1); */
    background-color: #161515;
    font-size: calc((23 / 1920)* 100vw);
    font-weight: 700;
    line-height: calc((30 / 1920)* 100vw);
    letter-spacing: 0.05em;
    height: fit-content;
    padding: calc((60 / 1920)* 100vw);
    /* text-align: justify; */
}

.what-block:not(.mobil) .what-text-description.left-first {
    max-width: calc((888 / 1920) * 100vw);
    padding-left: calc((100 / 1920) * 100vw);
    padding-top: calc((105 / 1920)* 100vw);
    padding-bottom: calc((105 / 1920)* 100vw);
}

.text-group-box .what-text-description {
    max-width: calc((676 / 1920) * 100vw);
    padding-right: calc((100 / 1920) * 100vw);
}

.fp-watermark {
    display: none !important;
}

/* scrollbar */
/* ::-webkit-scrollbar {
    width: 0rem !important;
}

::-webkit-scrollbar-thumb {
    background: rgba(254, 204, 26, 1) !important;
    border-radius: 100px !important;
    border: .0625rem solid rgba(0, 0, 0, 1) !important;
} */

/* scrollbar */

.what-text-block.mobil {
    flex-wrap: wrap;
}

.what-text-block {
    display: flex;
    justify-content: space-between;
    z-index: 2;
    position: relative;
    align-items: center;
}

.hero-container.section {
    overflow: hidden;
    height: 100vh;
    height: 100dvh;
}

.hero-container.section .fp-overflow {
    overflow: hidden !important;
}

.why-block,
.why-block .fp-overflow {
    overflow: hidden !important;
}

.why-block h2 {
    font-size: calc((200 / 1920) * 100vw);
    font-weight: 900;
    line-height: calc((215 / 1920) * 100vw);
    color: rgba(51, 51, 51, 1);
    margin-bottom: 3vw;
    padding-left: calc((225 / 1920) * 100vw);
}

.features {
    display: flex;
    flex-direction: column;
    padding-left: calc((225 / 1920) * 100vw);
    position: relative;
    max-width: calc((1230 / 1920) * 100vw);
}

.feature {
    position: relative;
    font-size: calc((38 / 1920)* 100vw);
    font-weight: 900;
    line-height: calc((56.3 / 1920)* 100vw);
    color: rgba(51, 51, 51, 1);
    display: flex;
    align-items: center;
    cursor: pointer;
}

.feature:hover span {
    opacity: 1 !important;
}

.disable-hover {
    pointer-events: none;
}

.feature span {
    padding-right: calc((35 / 1920) * 100vw);
    display: block;
    white-space: nowrap;
    transition: opacity 0.3s ease;
    opacity: .5;
}

.feature .line {
    height: calc((2 / 1920) * 100vw);
    width: 100%;
    background-color: #FFCE42;
    position: relative;
    transition: width 0.5s ease;
}

.feature .circle {
    position: absolute;
    top: 50%;
    right: 0;
    height: calc((10 / 1920) * 100vw);
    width: calc((10 / 1920) * 100vw);
    background-color: #FFCE42;
    border-radius: 50%;
    transform: translateY(-50%);
}

.why-block .content-box {
    display: flex;
    align-items: center;
    height: 100%;
}

.why-block .content-box .HOOKD-bottle {
    object-fit: cover;
    object-position: top;
    margin-right: calc((585 / 1920) * 100vw);
    height: 62%;
    margin-top: calc((56 / 1920)* 100vw);
}

.why-block .content-box .img-box {
    height: 100vh;
    overflow: hidden;
    margin-left: calc((152 / 1920) * 100vw);
    position: relative;
    display: flex;
    align-items: center;
}

.why-block .content-box .text-box {
    width: 100%;
    /* padding: calc((67 / 1920) * 100vw) 0 0 calc((87 / 1920) * 100vw); */
    padding: 0 0 0 calc((87 / 1920) * 100vw);
}

.how-block.section {
    background: rgba(254, 204, 26, 1);
    color: rgba(51, 51, 51, 1);
    overflow: hidden;
}

.how-block.section .fp-overflow {
    overflow: hidden;
    height: 100dvh;
}

.how-block.section h2 {
    font-size: calc((313 / 1920) * 100vw);
    font-weight: 900;
    line-height: calc((414 / 1920) * 100vw);
    padding-left: calc((175 / 1920)* 100vw);
    margin-bottom: calc((45 / 1920) * 100vw);
    white-space: nowrap;
    margin-top: calc((122 / 1920) * 100vw);
    color: rgba(255, 255, 255, 1);
}

.how-block.section .white-box {
    background: rgba(255, 255, 255, 1);
    width: fit-content;
    padding: calc((40 / 1920)* 100vw) 0;
}

.how-block.section p.text {
    font-size: calc((27 / 1920)* 100vw);
    font-weight: 700;
    line-height: calc((32 / 1920)* 100vw);
    max-width: calc((930 / 1920)* 100vw);
    padding-left: calc((190 / 1920)* 100vw);
    color: rgba(51, 51, 51, 1);
}

.how-block.section p.text:last-of-type {
    margin-top: calc((17 / 1920) * 100vw);
}

.how-block.section p.text.first {
    padding: calc((20 / 1920)* 100vw);
    padding-left: calc((187 / 1920)* 100vw);
    padding-top: 0;
}

.how-block.section img {
    position: absolute;
    bottom: -7.843vw;
    right: calc(50% + calc((-603 / 1920) * 100vw));
    transform: translateX(50%) rotate(18deg);
    width: calc((451 / 1920) * 100vw);
}

.buy-block.section {
    overflow: hidden;
    color: rgba(51, 51, 51, 1);
    position: relative;
}

.buy-block.section .yellow-info-box {
    background: rgba(254, 204, 26, 1);
    color: rgba(51, 51, 51, 1);
    font-size: calc((32 / 1920)* 100vw);
    line-height: calc((36 / 1920)* 100vw);
    padding: calc((40 / 1920)* 100vw);
    padding-left: calc((64 / 1920)* 100vw);
    margin-top: calc((197 / 1920)* 100vw);
}

.buy-block.section .yellow-info-box p {
    text-align: end;
    white-space: nowrap;
}

.buy-block.section .yellow-info-box .link-box {
    display: flex;
    margin-top: calc((50 / 1920)* 100vw);
    justify-content: flex-end;
}

.buy-block.section .yellow-info-box .link-box a {
    font-weight: 900;
    text-decoration: none;
    color: white;
    background-color: rgba(30, 30, 30, 1);
    padding: calc((7 / 1920)* 100vw) calc((25 / 1920)* 100vw);
    cursor: pointer;
    border-radius: calc((17 / 1920)* 100vw);
    font-family: 'Arial Black', Arial, Helvetica, sans-serif;
}

.woocommerce-message a.button.wc-forward,
.form-row.place-order .button.alt,
a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button,
:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button {
    font-weight: 900 !important;
    text-decoration: none !important;
    color: white !important;
    background-color: rgba(30, 30, 30, 1) !important;
    padding: calc((7 / 1920)* 100vw) calc((25 / 1920)* 100vw) !important;
    cursor: pointer !important;
    border-radius: calc((17 / 1920)* 100vw) !important;
    font-family: 'Arial Black', Arial, Helvetica, sans-serif !important;
    font-size: calc((18 / 1920)* 100vw);
    line-height: calc((22 / 1920)* 100vw);
}

a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained {
    max-width: 18.75rem;
    padding: 7.27125px 25.9688px;
    border-radius: 17.6588px;
    font-size: 18.6975px;
    line-height: 22.8525px;
}

.wc-block-cart__submit-container {
    display: flex;
    justify-content: center;
}

.buy-block.section img.bottle {
    width: calc((480 / 1920)* 100vw);
    position: absolute;
    /* left: calc(-1 * (84 / 1920)* 100vw);  */
    left: 113%;
}

.buy-block.section h2 {
    font-size: calc((200 / 1920)* 100vw);
    font-weight: 900;
    line-height: calc((175 / 1920)* 100vw);
}

.buy-block.section p.slogan {
    font-size: calc((52 / 1920)* 100vw);
    font-weight: 700;
    line-height: calc((240 / 1920)* 100vw);
    padding-right: calc((17 / 1920)* 100vw);
}

.buy-content {
    max-width: calc((855 / 1920) * 100vw);
    display: flex;
    width: 100%;
}

.buy-content .product-options {
    width: 100%;
    padding-top: calc((255 / 1920) * 100vw);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.option {
    font-size: calc((40 / 1920) * 100vw);
    font-weight: 700;
    line-height: calc((52.92 / 1920) * 100vw);
    text-align: right;
    font-family: Arial;
    display: flex;
    width: 100%;
    justify-content: flex-end;
    align-items: center;
    max-width: calc((525 / 1920) * 100vw);
    min-width: calc((504 / 1920) * 100vw);
}

.option .product-name {
    white-space: nowrap;
    text-transform: uppercase;
}

.option:not(:last-child) {
    margin-bottom: calc((24 / 1920) * 100vw);
}

.buy-button:not(:last-child) {
    margin-bottom: calc((17 / 1920) * 100vw);
}

.buy-buy-row {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.buy-button {
    /* background-color: rgba(51, 51, 51, 1); */
    width: 100%;
    max-width: calc((140 / 1920)* 100vw);
    height: calc((50 / 1920)* 100vw);
    border-radius: calc((17 / 1920) * 100vw);
    cursor: pointer;
    /* font-size: calc((32 / 1920) * 100vw); */
    /* font-weight: 900; */
    /* line-height: calc((42 / 1920) * 100vw); */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.5s ease-in-out, background-color 0.5s ease-in-out;
    /* color: white; */
    font-family: Arial;
    margin-left: calc((55 / 1920) * 100vw);

    background-color: rgba(254, 204, 26, 1);
    color: rgba(51, 51, 51, 1);
    font-size: calc((24 / 1920)* 100vw);
    font-weight: 700;
    line-height: calc((25 / 1920)* 100vw);
}

.buy-block.section .buy-block-box {
    position: relative;
    height: 100vh;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.buy-block-box .buy-description-row {
    margin-left: calc((240 / 1920) * 100vw);
    position: relative;
}

section.footer {
    overflow: hidden;
    color: rgba(51, 51, 51, 1);
    height: 72vh;
    min-height: auto;
    padding-right: calc((20 / 1920) * 100vw);
    padding-top: calc((50 / 1920) * 100vw);
    background: rgba(255, 255, 255, 1);
}

section.footer .fp-overflow {
    display: flex;
    justify-content: space-between;
}

section.footer nav {
    display: flex;
    flex-direction: column;
    font-size: calc((66 / 1920) * 100vw);
    font-weight: 400;
    line-height: calc((87 / 1920) * 100vw);
    padding: 0;
    max-height: 50vh;
}

section.footer nav a {
    text-align: left;
    display: block;
    width: 100%;
}

section.footer .footer-logo {
    width: calc((894 / 1920) * 100vw);
    height: calc((291 / 1920) * 100vw);
}

section.footer .instagram-icon {
    width: calc((213 / 1920) * 100vw);
    height: calc((213 / 1920) * 100vw);
}

section.footer nav a:not(:last-child) {
    margin-bottom: calc((40 / 1920) * 100vw);
}

section.footer .instagram-link .footer-copyright {
    margin-top: calc((51 / 1920) * 100vw);
    color: rgba(51, 51, 51, 1);
    text-align: center;
    font-family: Arial;
    font-size: calc((24 / 1920) * 100vw);
    font-weight: 700;
    line-height: calc((27.6 / 1920) * 100vw);
    letter-spacing: 0.05em;
}

main {
    position: relative;
}

#section-why .fp-overflow {
    height: 100dvh;
    height: 100vh;
}

#section-why.why-block img.HOOKD-bottle-mobil-why {
    display: block;
    position: absolute;
    right: calc((-64 / 390)* 100vw);
    top: calc((-28 / 390)* 100vw);
    height: 30vw;
}

/* DRAWER  */

#drawer.drawer-content {
    position: fixed;
    top: -100%;
    left: 0;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    background: rgba(255, 255, 255, 1);
    transition: top 0.4s ease;
    color: rgba(0, 0, 0, 1);
    z-index: 1001;
    padding-top: calc((85 / 1920) * 100vw);
    padding-right: calc((61 / 1920) * 100vw);
    overflow: hidden;
}

#drawer.drawer-content.open {
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#drawer .close-drawer {
    position: absolute;
    cursor: pointer;
    font-family: Arial;
    font-size: calc((45 / 1920) * 100vw);
    line-height: calc((56 / 1920) * 100vw);
    font-weight: 400;
    right: calc((61 / 1920) * 100vw);
    display: flex;
    align-items: center;
}

#drawer .close-drawer::before {
    content: '';
    display: block;
    width: calc((50 / 1920) * 100vw);
    height: 0rem;
    border-top: calc((3 / 1920) * 100vw) solid #000;
    margin-right: calc((24 / 1920) * 100vw);
}

#drawer .logo-box img {
    width: calc((919 / 1920) * 100vw);
}

#drawer .nav-block {
    margin-top: calc((70 / 1920) * 100vw);
    display: flex;
}

#drawer .mySwiper-drawer {
    max-width: calc((1205 / 1920) * 100vw);
    margin: 0 !important;
}

.nav-block nav {
    margin-left: calc((81 / 1920) * 100vw);
}

.nav-block nav a {
    border-bottom: calc((1 / 1920)* 100vw) solid #000;
    font-size: calc((52 / 1920) * 100vw);
    font-weight: 700;
    line-height: calc((94 / 1920) * 100vw);
    width: calc((500 / 1920) * 100vw);
    display: block;
    font-family: "Arial Black", Arial, Helvetica, sans-serif;
    font-weight: 900;
    text-transform: uppercase;
}

.gray-burger,
.yellow-burger-mobil {
    position: absolute;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.white-burger {
    transition: opacity 0.5s ease;
}

/* DRAWER  */

/* LOADER */
.loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(128, 128, 128, 0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loader .spinner {
    width: calc((50 / 1920) * 100vw);
    height: calc((50 / 1920) * 100vw);
    border: calc((10 / 1920) * 100vw) solid rgba(51, 51, 51, 1);
    border-top: calc((10 / 1920) * 100vw) solid rgba(254, 204, 26, 1);
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-left: calc((73 / 1920) * 100vw);
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* LOADER */

#section-buy.buy-block.section .buy-block-mobil,
#mobil-drawer,
.what-text-block__mobil,
.what-block.mobil {
    display: none;
}


#section-motivation {
    background: rgba(30, 30, 30, 1);
    color: rgba(254, 204, 26, 1);
    font-size: calc((60 / 1920)* 100vw);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.5vw;
    line-height: 4vw;
}

#section-motivation h2 {
    font-family: 'RedHatDisplay' !important;
}

#section-motivation h2.top {
    color: white;
}

#section-motivation .fp-overflow {
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 1vw;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    /* margin-left: 13vw; */
}

#section-motivation .fp-overflow h2 {
    text-align: center;
}

#section-motivation .fp-overflow h2.bottom {
    white-space: nowrap;
}

#section-motivation h2 span {
    opacity: 0;
}

#section-motivation .footer-legal {
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: flex-end;
    letter-spacing: 0.3vw;
    line-height: 2vw;
    font-size: calc((9 / 1920)* 100vw);
    width: 100%;
    justify-content: center;
    gap: 2vw;
    color: white;
}


/*------------------------ mob version ------------------------*/


@media(max-width: 48rem) {

    .hero-slide-text {
        font-size: calc((31 / 390)* 100vw);
        font-size: calc((31 / 390)* 100dvw);
        transform: translate(-50%, -50%);
        text-align: center;
        right: auto;
        left: 50%;
        max-width: none;
        margin: 0;
        overflow: hidden;
    }

    .mySwiper .swiper-slide {
        height: 100dvh !important;
    }

    .swiper-slide img {
        height: 55dvh;
    }

    .sidebar__inner.menu-item,
    .what-text-block,
    #section-what .what-block {
        display: none;
    }

    .sidebar__inner.menu-item {
        padding: calc((10 / 390)* 100vw) calc((20 / 390)* 100vw) calc((6 / 390)* 100vw) calc((20 / 390)* 100vw);
        padding: calc((10 / 390)* 100dvw) calc((20 / 390)* 100dvw) calc((6 / 390)* 100dvw) calc((20 / 390)* 100dvw);
        right: calc((7 / 1920)* 100vw);
    }

    .sidebar__inner.menu-item span img {
        width: calc((28 / 390)* 100vw);
        width: calc((28 / 390)* 100dvw);
    }

    #section-hero {
        /* flex-direction: column; */
        display: block;
    }

    .what-text-block__mobil {
        display: flex;
        flex-direction: column;
        gap: calc((7 / 390)* 100vw);
        gap: calc((7 / 390)* 100dvw);
        padding-top: calc((71 / 1920)* 100vw);
        padding-top: calc((71 / 1920)* 100dvw);
        /* overflow-y: hidden; */
        align-items: flex-end;
        position: relative;
    }

    #section-hero nav {
        width: 100%;
        font-size: calc((19 / 390)* 100vw);
        font-size: calc((19 / 390)* 100dvw);
        margin: 0;
        justify-content: space-between;
        height: 8vh;
        height: 8dvh;
        padding: 0 9vw;
        padding: 0 9dvw;
        font-weight: 600;
        font-family: Arial, Helvetica, sans-serif;
    }

    #section-hero nav a.account-but img {
        width: calc((20 / 390)* 100vw);
        height: calc((20 / 390)* 100vw);
    }

    #section-hero.hero-container .swiper.mySwiper {
        height: 50vh;
        height: 50dvh;
    }

    #section-hero.hero-container #mobil-drawer {
        position: fixed;
        top: 0;
        z-index: 1000;
        padding: calc((10 / 390)* 100vw) calc((20 / 390)* 100vw) calc((6 / 390)* 100vw) calc((20 / 390)* 100vw);
        padding: calc((10 / 390)* 100dvw) calc((20 / 390)* 100dvw) calc((6 / 390)* 100dvw) calc((20 / 390)* 100dvw);
        display: none;
        right: 0;
        transition: background-color 1s ease-in-out;
    }

    #section-hero.hero-container #mobil-drawer .img-box {
        position: relative;
        display: flex;
    }

    #section-hero.hero-container #mobil-drawer img {
        width: calc((28 / 390)* 100vw);
        width: calc((28 / 390)* 100dvw);
    }

    #section-hero.hero-container .header-navigation {
        align-items: center;
        justify-content: space-between;
        overflow: hidden;
    }

    #section-hero.hero-container .logo-box {
        display: flex;
        justify-content: center;
        height: 100%;
        width: 100%;
        padding: 0;
        align-items: center;
    }

    #section-what.what-block.section,
    #section-what.what-block.section .what-block {
        width: 100%;
    }

    #section-what .what-text-block {
        height: auto;
    }

    #section-what .what-text-block {
        padding-top: calc((71 / 1920)* 100vw);
        padding-top: calc((71 / 1920)* 100dvw);
        align-content: center;
        justify-content: center;
        gap: calc((15 / 390)* 100vw);
        gap: calc((15 / 390)* 100dvw);
        flex-direction: column;
        align-items: center;
        height: 0;
    }

    #section-what h2 {
        font-size: calc((90 / 390)* 100vw);
        font-size: calc((90 / 390)* 100dvw);
        margin: 0;
        width: 100%;
        text-align: center;
        margin: 10.8vh 0 6vh 0;
        margin: 10.8dvh 0 6dvh 0;
    }

    #section-what.what-block.section .what-text-description {
        font-size: calc((12 / 390)* 100vw);
        font-size: calc((12 / 390)* 100svw);
        line-height: calc((15 / 390)* 100vw);
        line-height: calc((15 / 390)* 100svw);
        margin-top: 0;
        padding: calc((10 / 390)* 100vw) calc((14.5 / 390)* 100vw) calc((10 / 390)* 100vw) calc((14.5 / 390)* 100vw);
        padding: calc((10 / 390)* 100dvw) calc((14.5 / 390)* 100dvw) calc((10 / 390)* 100dvw) calc((14.5 / 390)* 100dvw);
        max-width: 63vw;
        font-weight: 600;
        border-radius: 0;
    }

    #section-what.what-block.section .text-group-box {
        display: flex;
        flex-wrap: wrap;
        gap: calc((15 / 390)* 100vw);
        gap: calc((15 / 390)* 100dvw);
        flex-direction: column;
    }

    #section-why.why-block .content-box {
        width: 100%;
        height: 100%;
        align-items: normal;
    }

    #section-what.what-block.section .text-group-box .what-text-description {
        padding-right: calc((40 / 1920)* 100vw);
        padding-right: calc((40 / 1920)* 100dvw);
        max-width: none;
    }

    #section-what.what-block.section .text-group-box .what-text-description:first-child {
        margin-bottom: 0;
    }

    #section-what.what-block.section .what-block.mobil {
        display: flex;
        flex-direction: column;
        justify-content: normal;
        padding: 0 calc((19 / 390)* 100vw);
        padding: 0 calc((19 / 390)* 100dvw);
        min-height: auto;
        height: 100%;
        padding-right: 0;
    }


    #section-what.what-block.section {
        height: 100dvh;
    }

    #section-what.what-block.section .fp-overflow {
        overflow-y: hidden;
        height: 100dvh;
        position: relative;
    }

    #section-what.what-block.section .main-content .content {
        height: fit-content;
    }

    .what-block img.HOOKD-bottle-image {
        top: 0vw;
        top: 0dvw;
        left: -1vw;
        left: -1dvw;
        transform: scale(1.25);
        top: 39%;
        transform: scale(3.25);
    }

    #section-why .text-box {
        display: flex;
        flex-direction: column;
        padding: 0;
    }

    #section-why.why-block .fp-overflow {
        height: 100vh;
        height: 100dvh;
    }

    #section-why.why-block .feature:not(:last-child) {
        margin-bottom: calc((12 / 390)* 100vw);
        margin-bottom: calc((12 / 390)* 100dvw);
    }

    #section-why.why-block .feature span {
        font-size: calc((18 / 390)* 100vw);
        font-size: calc((18 / 390)* 100dvw);
        line-height: calc((24 / 390)* 100vw);
        line-height: calc((24 / 390)* 100dvw);
        padding-right: 0;
        opacity: 1;
    }

    #section-why.why-block img.HOOKD-bottle-mobil-why {
        display: block;
        position: absolute;
        right: calc((-131 / 390)* 100vw);
        right: calc((-131 / 390)* 100dvw);
        height: calc((330 / 390)* 100vw);
        height: calc((330 / 390)* 100dvw);
        top: calc((-56 / 390)* 100vw);
        top: calc((-56 / 390)* 100dvw);
    }

    #section-why.why-block .img-box {
        display: none;
    }

    #section-why.why-block .feature .line {
        height: calc((4 / 1920)* 100vw);
        height: calc((4 / 1920)* 100dvw);
    }

    #section-why.why-block .feature .circle {
        height: calc((20 / 1920)* 100vw);
        height: calc((20 / 1920)* 100dvw);
        width: calc((20 / 1920)* 100vw);
        width: calc((20 / 1920)* 100dvw);
    }

    #section-why.why-block h2 {
        font-size: calc((90 / 390)* 100vw);
        font-size: calc((90 / 390)* 100dvw);
        text-align: center;
        margin-bottom: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 10.5vh 0 15vh 0;
        margin: 10.5dvh 0 15dvh 0;
        line-height: calc((269 / 1920)* 100dvw);
        color: #000;
    }

    #section-why.why-block .content-box .HOOKD-bottle {
        margin: 0;
        height: calc((290 / 390)* 100vw);
        height: calc((290 / 390)* 100dvw);
    }

    #section-why.why-block .feature {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    #section-why.why-block .content-box .img-box {
        margin-left: 0;
        position: absolute;
        right: calc((-18 / 390)* 100vw);
        right: calc((-18 / 390)* 100dvw);
        top: 60%;
        transform: translateY(-50%);
        height: fit-content;
    }

    #section-why.why-block .features {
        max-width: calc((277 / 390)* 100vw);
        max-width: calc((277 / 390)* 100dvw);
        height: 100%;
    }

    #section-how.how-block img {
        width: auto;
        height: 56vh;
        height: 56dvh;
        object-fit: cover;
        bottom: -18.843vw;
        bottom: -18.843dvw;
    }

    #section-how.how-block.section h2 {
        font-size: calc((90 / 390)* 100vw);
        font-size: calc((90 / 390)* 100dvw);
        line-height: calc((269 / 1920)* 100dvw);
        margin: 9dvh 0 3dvh 0;
        padding: 0;
        text-align: center;
    }

    .how-block.section .white-box {
        padding: calc((45 / 1920)* 100vw) 0;
        padding: calc((45 / 1920)* 100dvw) 0;
        position: absolute;
        background-color: rgba(254, 204, 26, 1);
        display: flex;
        width: 100%;
    }

    .how-block.section .container {
        background: rgba(255, 255, 255, 1);
        max-width: 95dvw;
        padding-left: 2dvw;
    }

    #section-how.how-block.section p.text {
        font-size: calc((16 / 390)* 100vw);
        font-size: calc((16 / 390)* 100dvw);
        line-height: calc((18 / 390)* 100vw);
        line-height: calc((18 / 390)* 100dvw);
        max-width: calc((1910 / 390)* 100vw);
        max-width: calc((1910 / 390)* 100dvw);
        padding: 3dvw;
    }

    .how-block.section p.text.first {
        background: none;
        color: rgba(51, 51, 51, 1);
    }

    #section-how.how-block.section p.text.second {
        margin-top: 1vh;
        margin-top: 1dvh;
    }

    #section-buy.buy-block.section .fp-overflow {
        height: 100vh;
        height: 100dvh;
        overflow: hidden;
    }

    #section-buy.buy-block.section .buy-block-box {
        display: none;
    }

    #section-buy.buy-block.section .buy-block-mobil {
        height: 100%;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        overflow: hidden;
    }

    #section-buy.buy-block.section .buy-block-mobil .content {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
    }

    #section-buy.buy-block.section .buy-block-mobil h2 {
        font-size: calc((90 / 390)* 100vw);
        font-size: calc((90 / 390)* 100dvw);
        font-weight: 900;
        line-height: calc((269 / 1920)* 100dvw);
        font-family: 'Arial Black', Arial, Helvetica, sans-serif;
        margin: 0 0 3dvh 5vw;
        margin: 0 0 3dvh 5dvw;
        position: relative;
        color: #000;
    }

    #section-buy.buy-block.section .buy-block-mobil .slogan {
        font-size: calc((18 / 390)* 100vw);
        font-size: calc((18 / 390)* 100dvw);
        font-weight: 900;
        line-height: calc((24 / 390)* 100vw);
        line-height: calc((24 / 390)* 100dvw);
        text-transform: uppercase;
        margin: 0 0 0 6.4vw;
        margin: 0 0 0 6.4dvw;
    }

    #section-buy.buy-block.section .buy-block-mobil .text {
        font-size: calc((16 / 390)* 100vw);
        font-size: calc((16 / 390)* 100dvw);
        font-weight: 500;
        line-height: calc((18 / 390)* 100vw);
        line-height: calc((18 / 390)* 100dvw);
        letter-spacing: 0.05em;
        margin: calc((17 / 390)* 100vw) 0 calc((17 / 390)* 100vw) 0;
        margin: calc((17 / 390)* 100dvw) 0 calc((17 / 390)* 100dvw) 0;
        padding: 0 calc((20 / 390)* 100vw);
        padding: 0 calc((20 / 390)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list {
        padding: 0 calc((20 / 390)* 100vw);
        padding: 0 calc((20 / 390)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .product-name {
        font-size: calc((18 / 390)* 100vw);
        font-size: calc((18 / 390)* 100dvw);
        font-weight: 700;
        line-height: calc((24 / 390)* 100vw);
        line-height: calc((24 / 390)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .product-options .option {
        max-width: none;
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .product-options .option:not(:last-child) {
        margin-bottom: calc((12 / 390)* 100vw);
        margin-bottom: calc((12 / 390)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .buy-button {
        width: 100%;
        max-width: calc((112 / 390)* 100vw);
        max-width: calc((112 / 390)* 100dvw);
        height: calc((42 / 390)* 100vw);
        height: calc((42 / 390)* 100dvw);
        background: rgba(254, 204, 26, 1);
        color: rgba(51, 51, 51, 1);
        border-radius: calc((17 / 390)* 100vw);
        border-radius: calc((17 / 390)* 100dvw);
        font-size: calc((18 / 390)* 100vw);
        font-size: calc((18 / 390)* 100dvw);
        font-weight: 700;
        line-height: calc((24 / 390)* 100vw);
        line-height: calc((24 / 390)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .footer-buy {
        font-size: calc((16 / 390)* 100vw);
        font-size: calc((16 / 390)* 100dvw);
        line-height: calc((21 / 390)* 100vw);
        line-height: calc((21 / 390)* 100dvw);
        letter-spacing: 0.05em;
        text-align: right;
        border-radius: calc((20 / 390)* 100vw) calc((20 / 390)* 100vw) 0 0;
        border-radius: calc((20 / 390)* 100dvw) calc((20 / 390)* 100dvw) 0 0;
        color: rgba(0, 0, 0, 1);
        display: flex;
        justify-content: flex-end;
        text-transform: uppercase;
    }

    #section-buy.buy-block.section .buy-block-mobil .footer-buy .yellow-box {
        background: rgba(254, 204, 26, 1);
        padding: calc((25 / 390)* 100vh) calc((20 / 390)* 100vw);
        padding: calc((25 / 390)* 100dvh) calc((20 / 390)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .footer-buy span {
        cursor: pointer;
        font-family: 'Arial Black', Arial, Helvetica, sans-serif;
        margin-top: 1dvh;
        display: inline-block;

        font-weight: 900;
        text-decoration: none;
        color: white;
        background-color: rgba(30, 30, 30, 1);
        padding: calc((7 / 390)* 100vw) calc((25 / 390)* 100vw);
        cursor: pointer;
        border-radius: calc((11 / 390)* 100vw);
    }

    #section-buy.buy-block.section .header-buy {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin: 9vh 0 8vh 0;
        margin: 9dvh 0 8dvh 0;
    }

    #section-buy.buy-block.section img {
        /* height: 27vw;
        height: 27dvw;
        position: absolute;
        left: calc((-48 / 390)* 100vw);
        left: calc((-48 / 390)* 100dvw);
        top: -1vh;
        top: -1dvh; */
        display: none;
    }

    #drawer.drawer-content.open {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding-right: 0;
        z-index: 999999;
        background: rgba(255, 255, 255, 1);
    }

    #drawer .logo-box img {
        width: calc((1200 / 1920)* 100vw);
        width: calc((1200 / 1920)* 100dvw);
        margin-top: calc((300 / 1920)* 100vh);
        margin-top: calc((300 / 1920)* 100dvh);
    }

    #drawer .logo-box {
        display: flex;
        justify-content: center;
    }

    #drawer .nav-block {
        display: flex;
        flex-direction: column-reverse;
    }

    #drawer .mySwiper-drawer {
        max-width: none;
    }

    #drawer nav {
        margin-left: 0;
    }

    #drawer nav ul {
        display: flex;
        margin-top: 0;
        margin-bottom: calc((70 / 1920)* 100vw);
        margin-bottom: calc((70 / 1920)* 100dvw);
        width: 100%;
        justify-content: space-around;
        align-items: center;
    }

    #drawer .nav-block nav li a {
        border: none;
        text-align: center;
        width: fit-content;
        font-size: calc((19 / 390) * 100vw);
        font-size: calc((19 / 390)* 100dvw);
        line-height: calc((94 / 1920)* 100vw);
        line-height: calc((94 / 1920)* 100dvw);
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 600;
    }

    #drawer .nav-block nav li:not(:first-child) a,
    #drawer .nav-block nav a {
        padding-top: 0;
        padding-bottom: 0;
    }

    #drawer .nav-block nav li:last-child a img {
        width: calc((23 / 390)* 100dvw);
        height: calc((23 / 390)* 100dvw);
    }

    #fp-nav,
    #drawer .nav-block nav li:last-child a span {
        display: none;
    }

    #drawer {
        max-height: 100vh;
        max-height: 100dvh;
    }

    #drawer.drawer-content {
        padding-right: 0;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    #section-motivation .fp-overflow {
        font-size: calc((27 / 390)* 100vw);
        font-size: calc((27 / 390)* 100dvw);
        line-height: calc((37 / 390)* 100vw);
        line-height: calc((37 / 390)* 100dvw);
        padding: 0;
    }

    .drawer-slide-text {
        font-size: calc((22 / 390) * 100vw);
        font-size: calc((22 / 390) * 100dvw);
    }

    .loader .spinner {
        width: calc((50 / 390)* 100vw);
        height: calc((50 / 390)* 100vw);
        border: calc((10 / 390)* 100vw) solid rgba(51, 51, 51, 1);
        border-top: calc((10 / 390)* 100vw) solid rgba(254, 204, 26, 1);
        border-radius: 50%;
        animation: spin 1s linear infinite;
    }

    #section-motivation .footer-legal {
        font-size: calc((7 / 390)* 100vw);
        line-height: 8vw;
        justify-content: space-between;
        padding-inline: 2vw;
    }
}


/* @media(max-width: 768px) and (min-height: 600px) {
    #section-what h2 {
        margin: 22vh 0 6vh 0;
        margin: 22dvh 0 6dvh 0;
    }

    #section-why.why-block h2 {
        margin: 21.9vh 0 15vh 0;
        margin: 21.9dvh 0 15dvh 0
    }

    #section-how.how-block.section h2 {
        margin: 20vh 0 5vh 0;
        margin: 20dvh 0 5dvh 0;
    }

    #section-how.how-block img {
        height: 47vh;
        height: 47dvh;
        bottom: -13.843vw;
        bottom: -13.843dvw;
    }

    #section-buy.buy-block.section .header-buy {
        margin: 21.5vh 0 10vh 0;
        margin: 21.5dvh 0 10dvh 0;
    }
}

@media (max-width: 530px) and (max-height: 650px) {
    #section-what h2 {
        margin: 10.8vh 0 6vh 0;
        margin: 10.8dvh 0 6dvh 0;
    }

    #section-why.why-block h2 {
        margin: 10.5vh 0 15vh 0;
        margin: 10.5dvh 0 15dvh 0;
    }

    #section-how.how-block.section h2 {
        margin: 9vh 0 3vh 0;
        margin: 9dvh 0 3dvh 0;
    }

    #section-how.how-block img {
        height: 62vh;
        height: 62dvh;
        bottom: -25.843vw;
        bottom: -25.843dvw;
    }

    #section-buy.buy-block.section .header-buy {
        margin: 9vh 0 8vh 0;
        margin: 9dvh 0 8dvh 0;
    }
} */

@media(max-width: 768px) {
    .what-block.mobil {
        justify-content: center !important;
    }

    .what-block.mobil .main-content h2 {
        margin-top: 9vh !important;
        margin-top: 9dvh !important;
    }

    #section-why.why-block .content-box .text-box {
        justify-content: center !important;
    }

    #section-why.why-block .content-box .text-box h2 {
        margin-top: 0 !important;
    }

    #section-why.why-block .content-box .text-box .features {
        height: auto;
    }

    .how-block.section .fp-overflow {
        display: flex;
        justify-content: center !important;
        flex-direction: column;
    }

    .how-block.section .fp-overflow h2 {
        margin-top: 0 !important;
    }

    .how-block.section .fp-overflow .white-box {
        position: relative;
        margin-bottom: calc((300 / 768* 100vw));
        margin-bottom: calc((300 / 768* 100dvw));
    }

    #section-buy.buy-block.section .buy-block-mobil .content {
        justify-content: center;
    }

    .cart-box.top-item {
        right: auto;
        left: calc((30 / 768)* 100vw);
        top: calc((26 / 768)* 100vw);
    }

    .cart-box.top-item .images-box {
        width: calc((37 / 768)* 100vw);
        height: calc((37 / 768)* 100vw);
    }

    .cart-box.top-item .cart-icon {
        font-size: calc((34 / 768)* 100vw);
        line-height: calc((38 / 768)* 100vw);
    }
}

@media(max-width: 445px) and (min-height: 775px) {
    #section-how.how-block img {
        height: 55dvh;
        bottom: -18.843dvw;
    }
}

@media(max-width: 768px) and (min-height: 1024px) {
    #section-how.how-block img {
        /* height: 57dvh;
        bottom: -12.843dvw; */
    }
}

.none-border {
    border: none;
    border-right: none !important;
}

.none-marginBott {
    margin-bottom: 0;
}

@media (max-width: 48.0625rem) and (max-height: 21.75rem) {
    .hero-slide-text {
        font-size: calc((26 / 769)* 100vw);
        font-size: calc((26 / 769)* 100dvw);
        transform: translate(-50%, -50%);
    }

    .logo-box img {
        width: calc((236 / 769)* 100vw);
    }

    #section-hero nav {
        width: 100%;
        font-size: calc((14 / 769)* 100vw);
        font-size: calc((14 / 769)* 100dvw);
        height: 20dvh;
        padding: 0 3vw;
        padding: 0 3dvw;
    }

    .sidebar__inner.menu-item {
        padding: calc((5 / 769)* 100vw) calc((10 / 769)* 100vw) calc((3 / 769)* 100vw) calc((10 / 769)* 100vw);
        padding: calc((5 / 769)* 100dvw) calc((10 / 769)* 100dvw) calc((3 / 769)* 100dvw) calc((10 / 769)* 100dvw);
        right: calc((7 / 769)* 100vw);
    }

    .sidebar__inner.menu-item span img {
        width: calc((28 / 769)* 100vw);
        width: calc((28 / 769)* 100dvw);
    }

    #section-what h2 {
        font-size: calc((60 / 769)* 100vw);
        font-size: calc((60 / 769)* 100dvw);
        line-height: calc((69 / 769)* 100vw);
    }

    .what-block img.HOOKD-bottle-image {
        width: calc((19 / 769)* 100vw);
        width: calc((19 / 769)* 100dvw);
        left: 17vw;
        left: 17dvw;
        transform: scale(5.25);
        top: 14%;
    }

    #section-what.what-block.section .what-text-description {
        font-size: calc((11 / 769)* 100vw);
        font-size: calc((11 / 769)* 100svw);
        line-height: calc((14 / 769)* 100vw);
        line-height: calc((14 / 769)* 100svw);
        padding: calc((10 / 769)* 100vw) calc((14.5 / 769)* 100vw) calc((10 / 769)* 100vw) calc((14.5 / 769)* 100vw);
        padding: calc((10 / 769)* 100dvw) calc((14.5 / 769)* 100dvw) calc((10 / 769)* 100dvw) calc((14.5 / 769)* 100dvw);
        border-radius: calc((20 / 769)* 100vw);
        border-radius: calc((20 / 769)* 100dvw);
        /* max-width: 65vw;
        max-width: 65dvw;
        margin: 0 auto; */
    }

    #section-what.what-block.section .what-block.mobil {
        padding: 0;
    }

    .what-text-block__mobil {
        gap: calc((5 / 769)* 100vw);
        gap: calc((5 / 769)* 100dvw);
        padding-top: calc((8 / 769)* 100vw);
        padding-top: calc((8 / 769)* 100dvw);
    }

    #section-why.why-block img.HOOKD-bottle-mobil-why {
        right: calc((-100 / 769)* 100vw);
        right: calc((-100 / 769)* 100dvw);
        height: calc((230 / 769)* 100vw);
        height: calc((230 / 769)* 100dvw);
        top: calc((-23 / 769)* 100vw);
        top: calc((-23 / 769)* 100dvw);
    }

    #section-why.why-block .feature span {
        font-size: calc((18 / 769)* 100vw);
        font-size: calc((15 / 769)* 100dvw);
        line-height: calc((24 / 769)* 100vw);
        line-height: calc((19 / 769)* 100dvw);
    }

    #section-why.why-block .feature:not(:last-child) {
        margin-bottom: calc((9 / 769)* 100vw);
        margin-bottom: calc((9 / 769)* 100dvw);
    }

    #section-why.why-block h2 {
        font-size: calc((90 / 769)* 100vw);
        font-size: calc((90 / 769)* 100dvw);
        line-height: calc((119.07 / 769)* 100vw);
        line-height: calc((119.07 / 769)* 100dvw);
        margin: -0.5vh 0 2vh 0;
        margin: -0.5dvh 0 2dvh 0;
    }

    #section-why.why-block .feature .line {
        height: calc((1 / 769)* 100vw);
        height: calc((1 / 769)* 100dvw);
    }

    #section-why.why-block .feature .circle {
        height: calc((6 / 769)* 100vw);
        height: calc((6 / 769)* 100dvw);
        width: calc((6 / 769)* 100vw);
        width: calc((6 / 769)* 100dvw);
    }

    #section-how.how-block.section h2 {
        font-size: calc((440 / 769)* 100vw);
        font-size: calc((440 / 769)* 100dvw);
        line-height: calc((447 / 769)* 100vw);
        line-height: calc((447 / 769)* 100dvw);
    }

    .how-block.section .white-box {
        padding: calc((16 / 769)* 100vw) 0;
        position: absolute;
    }

    #section-how.how-block.section p.text {
        font-size: calc((13 / 769)* 100vw);
        font-size: calc((13 / 769)* 100dvw);
        line-height: calc((15 / 769)* 100vw);
        line-height: calc((15 / 769)* 100dvw);
        max-width: calc((433 / 769)* 100vw);
        max-width: calc((433 / 769)* 100dvw);
        padding-right: calc((15 / 769)* 100vw);
        padding-right: calc((15 / 769)* 100dvw);
    }

    #section-how.how-block img {
        height: 40vw;
        height: 40dvw;
        bottom: -6.843vw;
        bottom: -6.843dvw;
    }

    #section-buy.buy-block.section .buy-block-mobil h2 {
        font-size: calc((70 / 769)* 100vw);
        font-size: calc((70 / 769)* 100dvw);
        line-height: calc((80 / 769)* 100vw);
        line-height: calc((80 / 769)* 100dvw);
    }

    #section-buy.buy-block.section img {
        height: 16vw;
        height: 10dvw;
        left: calc((-48 / 769)* 100vw);
        left: calc((-34 / 769)* 100dvw);
        top: 0vh;
        top: 0dvh;
    }

    #section-buy.buy-block.section .header-buy {
        margin: 2vh 0 5vh 0;
        margin: 2dvh 0 5dvh 0;
    }

    #section-buy.buy-block.section .buy-block-mobil .slogan {
        font-size: calc((18 / 769)* 100vw);
        font-size: calc((18 / 769)* 100dvw);
        line-height: calc((24 / 769)* 100vw);
        line-height: calc((24 / 769)* 100dvw);
        margin: 0 0 0 5.5vw;
        margin: 0 0 0 5.5dvw;
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list {
        padding: 0 calc((20 / 769)* 100vw);
        padding: 0 calc((20 / 769)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .product-options .option:not(:last-child) {
        margin-bottom: calc((12 / 769)* 100vw);
        margin-bottom: calc((12 / 769)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .product-name {
        font-size: calc((18 / 769)* 100vw);
        font-size: calc((18 / 769)* 100dvw);
        line-height: calc((24 / 769)* 100vw);
        line-height: calc((24 / 769)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .buy-button {
        width: calc((161 / 769)* 100vw);
        width: calc((161 / 769)* 100dvw);
        max-width: none;
        height: calc((32 / 769)* 100vw);
        height: calc((32 / 769)* 100dvw);
        border-radius: calc((100 / 769)* 100vw);
        border-radius: calc((100 / 769)* 100dvw);
        font-size: calc((18 / 769)* 100vw);
        font-size: calc((18 / 769)* 100dvw);
        line-height: calc((24 / 769)* 100vw);
        line-height: calc((24 / 769)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .footer-buy {
        font-size: calc((13 / 769)* 100vw);
        font-size: calc((13 / 769)* 100dvw);
        line-height: calc((16 / 769)* 100vw);
        line-height: calc((16 / 769)* 100dvw);
        letter-spacing: 0.05em;
        border-radius: calc((20 / 769)* 100vw) calc((20 / 769)* 100vw) 0 0;
        border-radius: calc((20 / 769)* 100dvw) calc((20 / 769)* 100dvw) 0 0;
    }

    #section-buy.buy-block.section .buy-block-mobil .footer-buy .yellow-box {
        padding: calc((13 / 769)* 100vw) calc((20 / 769)* 100vw);
        padding: calc((13 / 769)* 100dvw) calc((20 / 769)* 100dvw);
    }

    #section-buy.buy-block.section .buy-block-mobil .buy-list .product-options {
        margin: 0 auto;
        max-width: 41vw;
        max-width: 41dvw;
    }

    #section-motivation .fp-overflow {
        font-size: calc((34 / 769)* 100vw);
        font-size: calc((34 / 769)* 100dvw);
        line-height: calc((45 / 769)* 100vw);
        line-height: calc((45 / 769)* 100dvw);
    }

    #drawer.drawer-content.open {
        padding-top: calc((15 / 769)* 100vw);
    }

    #drawer .logo-box img {
        width: calc((180 / 769)* 100vw);
        width: calc((180 / 769)* 100dvw);
        margin-top: calc((38 / 769)* 100vw);
        margin-top: calc((38 / 769)* 100dvw);
    }

    #drawer nav ul {
        margin-bottom: calc((10 / 769)* 100vw);
        margin-bottom: calc((10 / 769)* 100dvw);
    }

    #drawer .nav-block nav li a {
        border: none;
        padding-right: calc((15 / 769)* 100vw);
        padding-right: calc((15 / 769)* 100dvw);
        font-size: calc((16 / 769)* 100vw);
        font-size: calc((16 / 769)* 100dvw);
        line-height: calc((24 / 769)* 100vw);
        line-height: calc((24 / 769)* 100dvw);
    }

    .drawer-slide-text {
        font-size: calc((22 / 769)* 100vw);
        font-size: calc((22 / 769)* 100dvw);
    }
}

@media (max-width: 28.125rem) {
    #section-motivation .fp-overflow {
        font-size: calc((24 / 390)* 100vw);
        font-size: calc((24 / 390)* 100dvw);
        line-height: calc((30 / 390)* 100vw);
        line-height: calc((30 / 390)* 100dvw);
    }
}

/*------------------------ mob version ------------------------*/


/*------------------------ checkout PAGE ------------------------*/
.wc-block-components-order-summary-item__image {
    width: fit-content;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__image {
    margin-top: 0 !important;
    padding-bottom: 0px !important;
}

.wc-block-components-order-summary-item__image img {
    display: none;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item {
    align-items: center;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__description {
    padding-bottom: 0;
    padding-right: 0;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__quantity {
    position: relative !important;
    display: inline-flex !important;
}

.wp-block-woocommerce-checkout-order-summary-discount-block.wc-block-components-totals-wrapper,
.wp-block-woocommerce-checkout-order-summary-fee-block.wc-block-components-totals-wrapper {
    border-top: none !important;
}

.wc-block-checkout__terms.wc-block-checkout__terms--with-separator.wp-block-woocommerce-checkout-terms-block {
    border-top: none;
}

button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.wc-block-components-checkout-place-order-button--full-width.contained {
    background: rgba(254, 204, 26, 1);
    max-width: calc((450 / 1920)* 100vw);
    margin-left: auto;
    margin-right: auto;
    font-size: calc((24 / 1920)* 100vw);
    font-weight: 900;
    border-radius: calc((17 / 1920) * 100vw);
}

/*------------------------ checkout PAGE ------------------------*/


/*------------------------ cart PAGE ------------------------*/
.wc-block-cart-item__image {
    display: none;
}

.article__box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    background: rgba(254, 204, 26, 1);
}

.article__box div:not([class]) a {
    width: fit-content;
    margin-bottom: 2.5rem;
}

.article__box div:not([class]) a .home-icon {
    background-image: url(../images/arrow-back-circle-outline.svg);
    width: 2.1875rem;
    height: 2.1875rem;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
}

table.wc-block-cart-items .wc-block-cart-items__header,
.is-large.wc-block-cart .wc-block-cart__totals-title,
.wp-block-woocommerce-cart.alignwide thead .wc-block-cart-items__header-image {
    font-size: 1.5rem !important;
    font-weight: 700;
    font-family: 'RedHatDisplay' !important;
}

.wc-block-components-totals-wrapper,
.wp-block-woocommerce-cart-order-summary-totals-block,
.is-large.wc-block-cart .wc-block-cart-items td {
    border-top: calc((1 / 1920)* 100vw) solid rgba(254, 204, 26, 1) !important;
}

.wp-block-woocommerce-cart-order-summary-totals-block .wc-block-components-totals-wrapper {
    border: none !important;
}

.is-large.wc-block-cart .wc-block-cart-items {
    border-bottom: calc((1 / 1920)* 100vw) solid rgba(254, 204, 26, 1) !important;
}

.wc-block-cart-item__total-price-and-sale-badge-wrapper {
    align-items: flex-start !important;
}

.wc-block-cart-item__total {
    display: flex !important;
    align-items: center !important;
}

.wc-block-cart-item__quantity {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.wc-block-cart__submit-container.wc-block-cart__submit-container--sticky {
    background: none !important;
}

.wc-block-cart .wc-block-cart__submit-container--sticky:before {
    display: none;
}

.wp-block-woocommerce-cart.alignwide .wc-block-cart-items__header th:nth-child(3) {
    display: none;
}


/*------------------------ cart PAGE ------------------------*/

.article__box .logo {
    position: relative;
}

.article__box .logo img {
    width: calc((460 / 1920)* 100vw);
    margin: 2vh 0;
    padding: calc((20 / 1920)* 100vw) 0;
}

.article-content {
    background: rgba(255, 255, 255, 1);
    border-radius: calc((20 / 1920)* 100vw) calc((20 / 1920)* 100vw) 0 0;
    padding: calc((30 / 1920)* 100vw);
    color: rgba(51, 51, 51, 1);
}

.wc-block-components-quantity-selector {
    color: rgba(51, 51, 51, 1);
    background: rgba(255, 255, 255, 1);
}

#fp-nav ul li a.active span,
#fp-nav ul li:hover a.active span {
    background: rgba(254, 204, 26, 1);
    border: calc((1 / 1920)* 100vw) solid #333;
}

#fp-nav ul li,
.fp-slidesNav ul li {
    display: block;
    width: calc((14 / 1920)* 100vw) !important;
    height: calc((13 / 1920)* 100vw) !important;
    margin: calc((7 / 1920)* 100vw) !important;
    position: relative;
    cursor: pointer !important;
}

#fp-nav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li a.active span,
.fp-slidesNav ul li:hover a.active span {
    height: calc((12 / 1920)* 100vw) !important;
    width: calc((12 / 1920)* 100vw) !important;
    margin: calc(-6 / 1920 * 100vw) 0 0 calc(6 / 1920 * -100vw) !important;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    height: calc((4 / 1920)* 100vw) !important;
    width: calc((4 / 1920)* 100vw) !important;
    margin: calc(-2 / 1920 * 100vw) 0 0 calc(-2 / 1920 * 100vw) !important;
}

@media(max-width: 768px) {

    .wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained span,
    button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.wc-block-components-checkout-place-order-button--full-width.contained {
        font-size: 15px;
        padding: 11px;
        border-radius: 17px;
    }

    .article__box .logo.logo__container {
        display: flex;
        justify-content: center;
    }

    .article__box a.logo img {
        margin: 3vh 0;
        margin: 3dvh 0;
        width: calc((200 / 390)* 100vw);
        width: calc((200 / 390)* 100dvw);
    }
}

/* COOKIES BANNER   */

.cc-window.cc-floating {
    border-radius: calc((30 / 1920)* 100vw);
    padding: calc((30 / 1920)* 100vw);
}

.cc-floating .cc-message {
    text-align: center;
}

.cc-floating .cc-message .box-cookie {
    background-color: rgba(30, 30, 30, 1);
    border-radius: 100%;
    padding: calc((7 / 1920)* 100vw);
    margin: 0 auto calc((10 / 1920)* 100vw) auto;
    width: fit-content;
}


.cc-floating .cc-message .icon-cookie {
    background-image: url(../images/half-cookie.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: calc((35 / 1920)* 100vw);
    height: calc((35 / 1920)* 100vw);
}

.cc-floating .cc-message a {
    border-bottom: solid calc((2 / 1920)* 100vw) #897f7f;
}

.cc-compliance {
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

.cc-compliance.cc-highlight .cc-btn.cc-allow,
.cc-compliance.cc-highlight .cc-btn.cc-deny {
    border: solid calc((2 / 1920)* 100vw) #897f7f;
    transition: background-color .5s ease-in-out, border .5s ease-in-out;
}

.cc-compliance.cc-highlight .cc-btn.cc-allow:hover,
.cc-compliance.cc-highlight .cc-btn.cc-deny:hover,
.cc-highlight .cc-btn:first-child:hover {
    background-color: rgba(254, 204, 26, 1);
    border: solid calc((2 / 1920)* 100vw) rgba(254, 204, 26, 1);
    text-transform: none;
    text-decoration: none;
}

.cc-compliance.cc-highlight .cc-btn.cc-allow {
    border-radius: calc((15 / 1920)* 100vw) calc((30 / 1920)* 100vw) calc((30 / 1920)* 100vw) calc((15 / 1920)* 100vw);
}


.cc-floating .cc-compliance>.cc-btn {
    flex: none;
    min-width: auto !important;
    max-width: 170px;
    border-radius: calc((30 / 1920)* 100vw);
    padding: calc((10 / 1920)* 100vw) calc((22 / 1920)* 100vw) calc((10 / 1920)* 100vw) calc((22 / 1920)* 100vw);
}


.cc-btn+.cc-btn {
    margin-left: 0;
}

.cc-revoke,
.cc-window {
    font-size: calc((16 / 1920)* 100vw);
}

@media(max-width: 764px) {

    .cc-window.cc-floating {
        border-radius: calc((19 / 564)* 100vw);
        padding: calc((30 / 564)* 100vw);
    }

    .cc-floating .cc-message .box-cookie {
        padding: calc((7 / 564)* 100vw);
        margin: 0 auto calc((10 / 564)* 100vw) auto;
    }

    .cc-floating .cc-message .icon-cookie {
        width: calc((35 / 564)* 100vw);
        height: calc((35 / 564)* 100vw);
    }

    .cc-floating .cc-message a {
        border-bottom: solid calc((2 / 564)* 100vw) #897f7f;
    }

    .cc-compliance.cc-highlight .cc-btn.cc-allow,
    .cc-compliance.cc-highlight .cc-btn.cc-deny {
        border: solid calc((2 / 564)* 100vw) #897f7f;
    }

    .cc-compliance.cc-highlight .cc-btn.cc-allow:hover,
    .cc-compliance.cc-highlight .cc-btn.cc-deny:hover,
    .cc-highlight .cc-btn:first-child:hover {
        border: solid calc((2 / 564)* 100vw) rgba(254, 204, 26, 1);
    }

    .cc-compliance.cc-highlight .cc-btn.cc-allow {
        border-radius: calc((15 / 564)* 100vw) calc((30 / 564)* 100vw) calc((30 / 564)* 100vw) calc((15 / 564)* 100vw);
    }

    .cc-floating .cc-compliance>.cc-btn {
        border-radius: calc((30 / 564)* 100vw);
        padding: calc((10 / 564)* 100vw) calc((22 / 564)* 100vw) calc((10 / 564)* 100vw) calc((22 / 564)* 100vw);
    }

    .cc-revoke,
    .cc-window {
        font-size: calc((16 / 564)* 100vw);
    }
}

@media(max-width: 414px) {

    .cc-window.cc-floating {
        border-radius: calc((19 / 390)* 100vw);
        padding: calc((30 / 390)* 100vw);
    }

    .cc-floating .cc-message .box-cookie {
        padding: calc((7 / 390)* 100vw);
        margin: 0 auto calc((10 / 390)* 100vw) auto;
    }

    .cc-floating .cc-message .icon-cookie {
        width: calc((35 / 390)* 100vw);
        height: calc((35 / 390)* 100vw);
    }

    .cc-floating .cc-message a {
        border-bottom: solid calc((2 / 390)* 100vw) #897f7f;
    }

    .cc-compliance.cc-highlight .cc-btn.cc-allow,
    .cc-compliance.cc-highlight .cc-btn.cc-deny {
        border: solid calc((2 / 390)* 100vw) #897f7f;
    }

    .cc-compliance.cc-highlight .cc-btn.cc-allow:hover,
    .cc-compliance.cc-highlight .cc-btn.cc-deny:hover,
    .cc-highlight .cc-btn:first-child:hover {
        border: solid calc((2 / 390)* 100vw) rgba(254, 204, 26, 1);
    }

    .cc-compliance.cc-highlight .cc-btn.cc-allow {
        border-radius: calc((15 / 390)* 100vw) calc((30 / 390)* 100vw) calc((30 / 390)* 100vw) calc((15 / 390)* 100vw);
    }


    .cc-floating .cc-compliance>.cc-btn {
        flex: none;
        border-radius: calc((30 / 390)* 100vw);
        padding: calc((10 / 390)* 100vw) calc((22 / 390)* 100vw) calc((10 / 390)* 100vw) calc((22 / 390)* 100vw);
    }

    .cc-revoke,
    .cc-window {
        font-size: calc((16 / 390)* 100vw);
    }
}

/* COOKIES BANNER END  */

/* LEGAL PAGES */

body.yellow {
    color: rgba(254, 204, 26, 1);
    background-color: rgb(66, 68, 68);
}

.legal__container {
    max-width: 121.875rem;
    display: flex;
    gap: calc((25 / 1920)* 100vw);
}

.legal__container main {
    margin-top: calc((30 / 1920)* 100vw);
}

.legal__container main section {
    margin-top: calc((40 / 1920)* 100vw);
}

.legal__container aside {
    min-width: 327px;
    padding: calc((213 / 1920)* 100vw) calc((20 / 1920)* 100vw) 0 calc((20 / 1920)* 100vw);
    background-color: rgba(30, 30, 30, 1);
    color: #FFFFFF;
    position: relative;
}

.legal__container aside .aside-content {
    position: fixed;
    display: flex;
    flex-direction: column;
    gap: calc((30 / 1920)* 100vw);
    top: calc((196 / 1920)* 100vw);
    max-width: 19.6875rem;
}

.legal__container aside h1 {
    font-size: 1.875rem;
    font-weight: 700;
    display: block;
}

.legal__container aside #toc {
    display: flex;
    flex-direction: column;
    gap: calc((20 / 1920)* 100vw);
}

.legal__container aside #toc a,
.legal__container aside .home-button,
.legal__container aside .account-button {
    color: darkgray;
    transition: color .5s ease-in-out;
}

.legal__container aside #toc a:hover,
.legal__container aside .home-button:hover,
.legal__container aside .account-button:hover {
    color: #fff;
}

.legal__container aside #toc a.active {
    color: #fff;
}

.legal__container aside .home-button,
.legal__container aside .account-button {
    position: fixed;
    bottom: calc((20 / 1920)* 100vw);
}

.legal__container aside .account-button {
    bottom: calc((45 / 1920)* 100vw);
}

.legal__container .legal-logo {
    margin: 0 auto;
    width: fit-content;
    display: block;
}


.legal__container .legal-logo img {
    width: calc((550 / 1920)* 100vw);
    min-width: 330px;
    margin: 0;
}

.legal__container main h1,
.legal__container main h2,
.legal__container main h3,
.legal__container main h4,
.legal__container main h5,
.legal__container main h6 {
    font-family: 'Roboto', Arial, sans-serif;
    margin: 1.25rem 0 .625rem;
    line-height: 1.3;
    font-weight: 600;
}

.legal__container main h1 {
    font-size: 2rem;
}

.legal__container main h2 {
    font-size: 1.75rem;
}

.legal__container main h3 {
    font-size: 1.5rem;
}

.legal__container main h4 {
    font-size: 1.25rem;
}

.legal__container main h5 {
    font-size: 1.125rem;
}

.legal__container main h6 {
    font-size: 1rem;
}

.legal__container main p {
    margin: 0 0 .9375rem;
}

.legal__container main a {
    color: #0078ff;
    text-decoration: none;
    transition: color 0.3s;
}

.legal__container main a:hover {
    text-decoration: underline;
    color: #0056b3;
}

.legal__container main ul,
.legal__container main ol {
    margin: 1.25rem 0;
    padding-left: 2.5rem;
}

.legal__container main ul li,
.legal__container main ol li {
    margin-bottom: .3125rem;
}

.legal__container main ul {
    list-style: disc;
}

.legal__container main ol {
    list-style: decimal;
}

.legal__container main blockquote {
    margin: 1.25rem 0;
    padding: .9375rem 1.25rem;
    border-left: .25rem solid #0078ff;
    background: #f9f9f9;
    font-style: italic;
    color: #555;
}

.legal__container main blockquote p {
    margin: 0;
}

.legal__container main cite {
    display: block;
    margin-top: .625rem;
    text-align: right;
    font-style: normal;
    font-size: .875rem;
    color: #777;
}

.legal__container main img {
    max-width: 100%;
    height: auto;
    margin: 1.25rem 0;
    display: block;
}

.legal__container main iframe,
.legal__container main video {
    max-width: 100%;
    margin: 1.25rem 0;
    display: block;
}

.legal__container main .wp-block-button__link {
    display: inline-block;
    padding: .625rem 1.25rem;
    font-size: 1rem;
    background-color: #0078ff;
    color: #fff;
    text-decoration: none;
    border-radius: .25rem;
    text-align: center;
    transition: background-color 0.3s;
}

.legal__container main .wp-block-button__link:hover {
    background-color: #0056b3;
}

.legal__container main table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.25rem 0;
    font-size: .875rem;
}

.legal__container main table th,
.legal__container main table td {
    border: .0625rem solid #ddd;
    padding: .5rem;
    text-align: left;
}

.legal__container main table th {
    background-color: #f4f4f4;
    font-weight: bold;
}

.legal__container main table tr:nth-child(even) {
    background-color: #f9f9f9;
}

.legal__container main pre {
    background: #f5f5f5;
    padding: .9375rem;
    border: .0625rem solid #ddd;
    border-radius: .25rem;
    overflow: auto;
    font-family: 'Courier New', Courier, monospace;
    font-size: .875rem;
}

.legal__container main code {
    font-family: 'Courier New', Courier, monospace;
    background-color: #f9f9f9;
    padding: .125rem .3125rem;
    border-radius: .1875rem;
    font-size: .875rem;
}

.legal__container main hr {
    border: none;
    border-top: .0625rem solid #ddd;
    margin: 1.875rem 0;
}

.legal__container main .wp-block-embed {
    margin: 1.25rem 0;
    max-width: 100%;
}

.legal__container main .alignleft {
    float: left;
    margin-right: 1.25rem;
    margin-bottom: .625rem;
}

.legal__container main .alignright {
    float: right;
    margin-left: 1.25rem;
    margin-bottom: .625rem;
}

.legal__container main .aligncenter {
    display: block;
    margin: 0 auto;
}

.legal__container main strong {
    font-weight: bold;
}

.legal__container main em {
    font-style: italic;
}

.legal__container main .wp-block {
    margin-bottom: 1.25rem;
}

@media(max-width: 1015px) {
    .legal__container aside {
        min-width: 252px;

        .aside-content {
            max-width: 12.6875rem;
        }
    }
}

@media(max-width: 768px) {

    .legal__container {
        padding: 0 calc((20 / 768) * 100vw) 0 calc((20 / 768) * 100vw);
    }

    .legal__container aside #toc {
        gap: calc((20 / 768)* 100vw);
    }

    .legal__container aside .aside-content {
        top: calc((39 / 768)* 100vw);
    }

    .legal__container aside {
        padding: calc((213 / 768)* 100vw) calc((20 / 768)* 100vw) 0 calc((20 / 768)* 100vw);
    }

    .legal__container main section {
        margin-top: calc((50 / 768)* 100vw);
    }
}

@media(max-width: 635px) {
    .legal__container aside {
        display: none;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        text-align: center;
    }
}

/*----------------------- LEGAL PAGES END -----------------------*/

/*----------------------- CHECKOUT PAGES -----------------------*/

.woocommerce-message,
.woocommerce-info {
    border-top-color: rgba(254, 204, 26, 1);
}

.woocommerce-info .showcoupon {
    font-weight: 900;
}

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
    background-color: #FBE790;
}


#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
    background-color: #F3EAAF;
}

#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before {
    border: 1em solid #F3EAAF;
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}


#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods {
    border-bottom: 1px solid #E3C565;
}

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt {
    background-color: rgba(254, 204, 26, 1);
}

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:hover {
    background-color: #DCD7A0;
}

#custom_checkout_field {
    display: none;
}

#custom_checkout_field input {
    pointer-events: none;
}

.woocommerce-billing-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 22px;
}

.woocommerce form .form-row label {
    font-weight: bold;
}

.woocommerce form input {
    border: 1px solid #aaa;
    border-radius: 4px;
}

h3#order_review_heading {
    font-weight: bold;
    font-size: 1.5rem;
    margin: 4vw 0 2vw 0;
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
    width: 100%;
}

.woocommerce #payment #place_order {
    float: none;
    margin: 2vw auto;
    display: block;
    font-size: 23px !important;
    padding: 11px 39px !important;
    font-size: 23px !important;
    line-height: 22px !important;
}

.woocommerce table.my_account_orders .button,
.woocommerce-button.woocommerce-button--next.woocommerce-Button.woocommerce-Button--next.button,
.woocommerce-button.woocommerce-button--previous.woocommerce-Button.woocommerce-Button--previous.button {
    font-size: 14.025px !important;
    line-height: 19px !important;
    padding: 7px 19px !important;
}

.woocommerce-address-fields button.button,
.woocommerce-MyAccount-content .woocommerce-Button.button[type=submit] {
    font-size: 18px!important;
    line-height: 19px !important;
    padding: 7px 19px !important;
    margin-top: 24px;
}

@media(max-width: 768px) {

    .woocommerce-billing-fields h3,
    .woocommerce-additional-fields h3,
    h3#order_review_heading {
        text-align: center;
        font-size: 1.5rem;
        font-weight: 700;
        margin: 3.5vw 0;
    }


    .woocommerce #payment #place_order,
    .woocommerce-page #payment #place_order {
        max-width: 60%;
        margin: 3vw auto;
        display: block;
    }

    .woocommerce-message {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .woocommerce-message a.button.wc-forward {
        align-self: flex-start;
    }

    .woocommerce table.my_account_orders .button,
    .woocommerce-button.woocommerce-button--next.woocommerce-Button.woocommerce-Button--next.button,
    .woocommerce-button.woocommerce-button--previous.woocommerce-Button.woocommerce-Button--previous.button {
        font-size: 12px !important;
        line-height: 16px !important;
        padding: 7px 19px !important;
    }
}

@media(max-width: 550px) {
    .woocommerce-billing-fields__field-wrapper {
        display: grid;
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .woocommerce #payment #place_order {
        padding: 6px 35px !important;
        font-size: 18px !important;
        line-height: 22px !important;
        max-width: 50%;
    }
}

/*----------------------- CHECKOUT PAGES END -----------------------*/

/*----------------------- ORDER RECEIVED -----------------------*/

p.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
    margin: 2vw 0 4vw 0;
}

.woocommerce ul.order_details li strong {
    line-height: 2.5;
}

h2.woocommerce-column__title,
h2.woocommerce-order-details__title {
    font-size: 1.2rem;
    margin-bottom: 1vw;
}

.woocommerce .woocommerce-customer-details address {
    display: flex;
    flex-direction: column;
    gap: 4px;
    line-height: 1.5;
}


@media(max-width: 768px) {
    .woocommerce ul.order_details {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin: 0 0 3vw 33%;
    }

    .woocommerce ul.order_details li {
        border: none;
    }

}

/*----------------------- ORDER RECEIVED END -----------------------*/

/*----------------------- ACCOUNT DASHBOARD -----------------------*/

nav.woocommerce-MyAccount-navigation {
    justify-content: center;
    margin-bottom: 3vw;
}

nav.woocommerce-MyAccount-navigation ul {
    display: flex;
    gap: 1.5rem;
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'RedHatDisplay';
}

nav.woocommerce-MyAccount-navigation ul .woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--downloads {
    display: none;
}

nav.woocommerce-MyAccount-navigation ul li a {
    font-weight: 400;
}

nav.woocommerce-MyAccount-navigation li.is-active a {
    font-weight: 700;
}

.woocommerce-MyAccount-content p {
    text-align: center;
    margin-bottom: 3.5vw;
    font-weight: 800;
}

.woocommerce-MyAccount-content p a {
    color: blue;
}

.woocommerce-MyAccount-content .woocommerce-Address address {
    line-height: 1.5;
}

.woocommerce form .show-password-input,
.woocommerce-page form .show-password-input {
    top: 4px;
}

.woocommerce-Address-title.title h2 {
    font-weight: 800;
}

.woocommerce-Address-title.title a.edit {
    color: blue;
    margin: .9vw 0 .3vw 0;
    display: inline-block;
    font-weight: 600;
}

.woocommerce .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper .form-row .select2-container,
.woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account input {
    max-width: 46vw;
}

.woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 0 auto;
    max-width: 70vw;
}

.woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account .clear {
    display: none;
}

.woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account>* {
    grid-column: span 1;
}

.woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account p:last-of-type {
    grid-column: 1 / -1;
    margin: 0 auto;
}

.woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account fieldset legend {
    text-align: center;
    font-weight: 800;
    font-size: 1.25rem;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
    padding-left: .8125rem;
}

.woocommerce-MyAccount-content form h2:first-of-type:not([class]):not([id]) {
    text-align: center;
    font-size: 1.4375rem;
    margin: 2vw;
    font-weight: 700;
}

.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
    max-width: 890px;
    width: 100%;
    margin: 0 auto;
}

.woocommerce .woocommerce-notices-wrapper+h2 {
    text-align: center;
    margin-bottom: 25px;
    font-size: 1.4375rem;
    font-family: 'RedHatDisplay' !important;
    font-weight: 700;
    text-transform: uppercase;
}

.woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone,
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email {
    text-align: left;
    margin: 0;
}

h2.wp-block-heading.has-text-align-center.with-empty-cart-icon.wc-block-cart__empty-cart__title {
    display: block;
}

h2.wp-block-heading.has-text-align-center,
div.wc-block-grid.wp-block-product-new.wc-block-product-new.has-4-columns {
    display: none;
}

table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}

li.woocommerce-home-nav-link a {
    display: flex;
    align-items: center;
    gap: .3125rem;
}

li.woocommerce-home-nav-link a div.woocommerce-home-nav-link-icon {
    background-image: url(../images/arrow-back-circle-outline.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 20px;
    height: 20px;
}

.modal-window {
    font-family: 'RedHatDisplay' !important;
    display: flex;
    gap: 1rem;
    align-items: center;
}

.modal-window .product-photo-box {
    position: relative;
    width: 6.6667rem;
}

.modal-window .product-photo-box img {
    position: absolute;
    top: -60px;
    left: 50%;
    object-fit: cover;
    transform: translateX(-50%);
    height: 8.875rem;
}

.modal-window .product-photo-box img.last {
    height: 6.875rem;
    top:-45px;
}

.modal-window h3 {
    font-size: 1.6667rem;
    font-weight: 600;
}

.modal-window .modal-info-line {
    display: flex;
    justify-content: space-between;
}

.modal-window .modal-info-line:nth-of-type(1) {
    margin-top: 18%;
}

.modal-window .modal-info-line span {
    font-size: 1.2rem;
    font-weight: 600;
}

.swal2-footer .buttons-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.swal2-footer .buttons-box>div {
    width: 100%;
}

.swal2-footer .buttons-box .addBag-container {
    display: flex;
    justify-content: center;
}

.swal2-footer .buttons-container {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
}

.swal2-footer .buttons-box #viewCart,
.swal2-footer .buttons-box #checkout,
.swal2-footer .buttons-box #addBag{
    width: 100%;
    max-width: 140px;
    height: 42px;
    border-radius: 17px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(254, 204, 26, 1);
    color: rgba(51, 51, 51, 1);
    font-size: 21px;
    font-weight: 700;
    line-height: 22px;
}

.swal2-footer #continueShopping {
    font-weight: 900;
    text-decoration: none;
    color: white;
    background-color: rgba(30, 30, 30, 1);
    padding: 7px 17px;
    cursor: pointer;
    border-radius: 17px;
    font-size: 21px;
    line-height: 22px;
}

.swal2-footer .disabled-btn {
  background-color: #ccc !important;
  color: #666 !important;
  cursor: not-allowed !important;
  border: none !important;
}

@media(max-width: 768px) {
    nav.woocommerce-MyAccount-navigation ul {
        font-size: 1.2rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    nav.woocommerce-MyAccount-navigation {
        margin-top: 4vw;
    }

    .woocommerce .col2-set .col-1,
    .woocommerce .col2-set .col-2,
    .woocommerce-page .col2-set .col-1,
    .woocommerce-page .col2-set .col-2 {
        float: none;
        width: 100%;
        max-width: fit-content;
        margin: 0 auto 5vw auto;
        display: block;
    }

    .woocommerce .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper .form-row input.input-text,
    .woocommerce form .form-row textarea,
    .woocommerce .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper .form-row .select2-container {
        max-width: 80vw;
    }

    .woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
        margin: 0 auto;
        max-width: 600px;
    }

    .woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account input {
        display: block;
        margin: 0 auto;
        max-width: none;
    }

    .woocommerce .woocommerce-MyAccount-content form.woocommerce-EditAccountForm.edit-account .password-input {
        width: fit-content;
        margin: 0 auto;
        display: inline-block;
    }

    .modal-window .product-photo-box img {
        top: -3.125rem;
        height: 7.875rem;
    }

    .modal-window .product-photo-box img.last {
        height: 5.875rem;
        top: -38px;
    }
}

@media(max-width: 560px) {
    nav.woocommerce-MyAccount-navigation {
        margin-bottom: 6vw;
    }

    nav.woocommerce-MyAccount-navigation ul {
        font-size: 1.1rem;
    }
}

/*----------------------- ACCOUNT DASHBOARD END -----------------------*/

@media(max-width: 723px) {

    .is-medium table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity,
    .is-small table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity,
    .is-mobile table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity {
        padding: 0 !important;
    }

    .wc-block-cart .wc-block-components-product-name {
        margin: 0 auto .75rem auto !important;
    }

    .wc-block-cart .wc-block-components-product-price {
        text-align: center;
    }

    .wc-block-cart-item__total {
        justify-content: flex-start;
    }

    .is-medium table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product,
    .is-small table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product,
    .is-mobile table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product {
        grid-column-start: 1 !important;
    }

    table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-cart-item__remove-link {
        font-size: 1.1em !important;
    }

    table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-quantity-selector {
        margin-bottom: 24px !important;
    }
}

@media(max-width: 500px) {

    .swal2-footer .buttons-box #viewCart,
    .swal2-footer .buttons-box #checkout {
        font-size: 15px;
        line-height: 18px;
        height: 33px;
    }

    .swal2-footer #continueShopping {
        font-size: 13px;
        line-height: 18px;
        padding: 8px 12px;
        max-width: 140px;
    }

    .swal2-footer .buttons-box {
        flex-wrap: wrap;
    }

    .modal-window h3 {
        font-size: 1.267rem;
    }

    .modal-window .modal-info-line:nth-of-type(1) {
        margin-top: 26%;
    }

    .modal-window .modal-info-line span {
        font-size: 1rem;
    }
}

@media(max-width: 340px) {
    .modal-window .product-photo-box {
        width: 5.6667rem;
    }
}

@media(max-width: 300px) {
    div:where(.swal2-container) div:where(.swal2-html-container) {
        padding: 1em 1.2em .3em!important;
    }
}

/*----------------------- HOLIDAY BANNER -----------------------*/

.holiday-banner {
  background-color: #0056b3; /* Rich professional blue background */
  color: #ffffff !important; /* Forces all standard text elements to crisp white */
  font-family: 'RedHatDisplay', sans-serif;
  padding: 24px 60px 24px 25px;
  position: absolute;        
  top: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  font-size: 18px;           
  line-height: 1.5;
  z-index: 9999999 !important; 
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.15);
}

.banner-content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  max-width: 1400px;
  margin: 0 auto;
  text-align: center;
}

.banner-text-wrapper {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.banner-text-main {
  margin: 0;
  font-weight: 500;
  color: #ffffff !important; /* Guarantees main message text is white */
}

.banner-text-sub {
  margin: 0;
  font-size: 15px;
  opacity: 0.95;
  font-weight: 400;
  color: #ffffff !important; /* Guarantees shipping info text is white */
}

/* Stylized Promo Coupon Pill Box (White Border with White Text) */
.banner-code {
  background-color: rgba(255, 255, 255, 0.15); /* Semi-transparent white backing */
  color: #ffffff !important;                   /* Pure white coupon text */
  border: 1px solid #ffffff;                  /* White boundary frame line */
  padding: 2px 10px;
  border-radius: 4px;
  font-weight: bold;
  letter-spacing: 0.5px;
  display: inline-block;
  margin: 0 4px;
}

.banner-emoji {
  font-size: 32px;
}

/* Crisp White X Closing Button styling */
.banner-close-btn {
  position: absolute;
  right: 25px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  font-size: 36px;
  font-weight: bold;
  color: #ffffff !important; /* Forces the "X" mark text characters to white */
  cursor: pointer;
  opacity: 0.85;
  transition: opacity 0.2s;
  padding: 5px 10px;
}

.banner-close-btn:hover {
  opacity: 1; /* Fully bright white on hover */
}

/* GLOBAL SPACING HOOKS WHILE ACTIVE */
.has-holiday-banner #content.drawer {
  padding-top: 110px !important;
}

.has-holiday-banner #mobil-drawer, 
.has-holiday-banner .cart-box.top-item, 
.has-holiday-banner .sidebar__inner.menu-item,
.has-holiday-banner .woocommerce-page,
.has-holiday-banner #archive-product,
.has-holiday-banner .woocommerce-cart,
.has-holiday-banner .woocommerce-checkout {
  transform: translateY(110px) !important;
  transition: transform 0.3s ease;
}

/* RESPONSIVE MOBILE OPTIMIZATIONS */
@media (max-width: 48rem) {
  .holiday-banner {
    font-size: 14px;              
    padding: 16px 35px 16px 15px; 
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
  }
  
  .banner-text-sub {
    font-size: 12px;
  }
  
  .banner-content {
    gap: 10px;
    text-align: left;             
    padding-right: 20px;          
  }

  .banner-emoji { font-size: 22px; }

  .banner-close-btn {
    right: 8px;
    top: 8px;                    
    transform: none;
    font-size: 24px;              
    padding: 2px 6px;
  }

  .has-holiday-banner #content.drawer {
    padding-top: 140px !important; 
  }
  
  .has-holiday-banner #mobil-drawer, 
  .has-holiday-banner .cart-box.top-item, 
  .has-holiday-banner .sidebar__inner.menu-item,
  .has-holiday-banner .woocommerce-page,
  .has-holiday-banner #archive-product,
  .has-holiday-banner .woocommerce-cart,
  .has-holiday-banner .woocommerce-checkout {
    transform: translateY(140px) !important;
  }
}

/*----------------------- HOLIDAY BANNER END -----------------------*/