:root {
    --primaryColor: #C70B45;
    --secondaryColor: #3BA0B8;
    --red: #C70B45;
    --blue: #3BA0B8;
    --bluebg: #ACECFF;
    --bluelightbg: #F0F7F9;
    --redlightbg: #FFF8FB;
    --green: #15B500;
    --orange: #FF9900;
    --greybg: #CBE6F6;
    --border: #CDDBE3;
    --grey: #8A9595;
    --white: #fff;
    --titleColor: #252525;
    --textColor: #252525;
    --black: #252525;
    --titleFont: "Poppins", sans-serif;
    --textFont: "Roboto", sans-serif;
    --semibold: 600;
    --medium: 500;
    --bold: 800;
    --normal: 400;
    --topbar-height: 0px
}

.swiper__arrow::before,
.checkout__checkbox label:after,
.icon::before,
.sendmethod::before {
    display: inline-flex;
    font-family: "icons-1748438194000";
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.checkout__checkbox label:after,
.icon-check::before,
.sendmethod::before {
    content: ""
}

.swiper__arrow::before,
.icon-chevron::before {
    content: ""
}

.icon-facebook::before {
    content: ""
}

.icon-instagram::before {
    content: ""
}

.icon-linkedin::before {
    content: ""
}

.icon-star::before {
    content: ""
}

.icon-youtube::before {
    content: ""
}

.icon-cart::before {
    content: ""
}

.icon-heart::before {
    content: ""
}

.icon-login::before {
    content: ""
}

.icon-search::before {
    content: ""
}

.icon-fabric::before {
    content: ""
}

.icon-shine::before {
    content: ""
}

.icon-cross::before {
    content: ""
}

@view-transition {
    navigation: auto
}

.wrapper {
    --wrapperWidth: 1500px;
    padding-inline: max(20px, (100% - var(--wrapperWidth))/2)
}

.wrapper--1600 {
    --wrapperWidth: 1600px
}

.wrapper--1550 {
    --wrapperWidth: 1550px
}

.wrapper--1500 {
    --wrapperWidth: 1500px
}

.wrapper--1400 {
    --wrapperWidth: 1400px
}

.wrapper--1350 {
    --wrapperWidth: 1350px
}

.grid-btgr {
    --width: 200px;
    --gap: 0px;
    --gapY: var(--gap);
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--width, 100%)), 1fr));
    gap: var(--gapY) var(--gap)
}

.grid-btgr--center {
    --cols: 1;
    width: min(100%, var(--width)*var(--cols) + var(--gap)*(var(--cols) - 1));
    margin: 0 auto
}

.grid-btgr--center:has(>div:nth-child(1):last-child) {
    --cols: 1
}

.grid-btgr--center:has(>div:nth-child(2):last-child) {
    --cols: 2
}

.grid-btgr--center:has(>div:nth-child(3):last-child) {
    --cols: 3
}

.grid-btgr--center:has(>div:nth-child(4):last-child) {
    --cols: 4
}

.grid-btgr--center:has(>div:nth-child(5):last-child) {
    --cols: 5
}

.grid-btgr--center:has(>div:nth-child(6):last-child) {
    --cols: 6
}

.grid-btgr--center:has(>div:nth-child(7):last-child) {
    --cols: 7
}

.grid-btgr--center:has(>div:nth-child(8):last-child) {
    --cols: 8
}

.grid-btgr--center:has(>div:nth-child(9):last-child) {
    --cols: 9
}

.grid-btgr--center:has(>div:nth-child(10):last-child) {
    --cols: 10
}

.grid-btgr--center:has(>div:nth-child(11):last-child) {
    --cols: 11
}

.grid-btgr--center:has(>div:nth-child(12):last-child) {
    --cols: 12
}

.grid-btgr--center:has(>div:nth-child(13):last-child) {
    --cols: 13
}

.grid-btgr--center:has(>div:nth-child(14):last-child) {
    --cols: 14
}

.grid-btgr--center:has(>div:nth-child(15):last-child) {
    --cols: 15
}

.grid-btgr--center:has(>div:nth-child(16):last-child) {
    --cols: 16
}

.grid-btgr--center:has(>div:nth-child(17):last-child) {
    --cols: 17
}

.grid-btgr--center:has(>div:nth-child(18):last-child) {
    --cols: 18
}

.grid-btgr--center:has(>div:nth-child(19):last-child) {
    --cols: 19
}

.grid-btgr--center:has(>div:nth-child(20):last-child) {
    --cols: 20
}

.cols {
    --cols: 1;
    --gap: 0px;
    --gapY: var(--gap);
    display: flex;
    flex-wrap: wrap;
    gap: var(--gapY) var(--gap)
}

.cols>* {
    width: calc((100% - var(--gap)*(var(--cols) - 1))/var(--cols))
}

.m120 {
    margin-top: clamp(20px, 6.25vw, 120px);
    margin-bottom: clamp(20px, 6.25vw, 120px)
}

.mt120 {
    margin-top: clamp(20px, 6.25vw, 120px)
}

.mb120 {
    margin-bottom: clamp(20px, 6.25vw, 120px)
}

.p120 {
    padding-top: clamp(20px, 6.25vw, 120px);
    padding-bottom: clamp(20px, 6.25vw, 120px)
}

.pt120 {
    padding-top: clamp(20px, 6.25vw, 120px)
}

.pb120 {
    padding-bottom: clamp(20px, 6.25vw, 120px)
}

.m100 {
    margin-top: clamp(20px, 5.2083333333vw, 100px);
    margin-bottom: clamp(20px, 5.2083333333vw, 100px)
}

.mt100 {
    margin-top: clamp(20px, 5.2083333333vw, 100px)
}

.mb100 {
    margin-bottom: clamp(20px, 5.2083333333vw, 100px)
}

.p100 {
    padding-top: clamp(20px, 5.2083333333vw, 100px);
    padding-bottom: clamp(20px, 5.2083333333vw, 100px)
}

.pt100 {
    padding-top: clamp(20px, 5.2083333333vw, 100px)
}

.pb100 {
    padding-bottom: clamp(20px, 5.2083333333vw, 100px)
}

.m90 {
    margin-top: clamp(20px, 4.6875vw, 90px);
    margin-bottom: clamp(20px, 4.6875vw, 90px)
}

.mt90 {
    margin-top: clamp(20px, 4.6875vw, 90px)
}

.mb90 {
    margin-bottom: clamp(20px, 4.6875vw, 90px)
}

.p90 {
    padding-top: clamp(20px, 4.6875vw, 90px);
    padding-bottom: clamp(20px, 4.6875vw, 90px)
}

.pt90 {
    padding-top: clamp(20px, 4.6875vw, 90px)
}

.pb90 {
    padding-bottom: clamp(20px, 4.6875vw, 90px)
}

.m80 {
    margin-top: clamp(20px, 4.1666666667vw, 80px);
    margin-bottom: clamp(20px, 4.1666666667vw, 80px)
}

.mt80 {
    margin-top: clamp(20px, 4.1666666667vw, 80px)
}

.mb80 {
    margin-bottom: clamp(20px, 4.1666666667vw, 80px)
}

.p80 {
    padding-top: clamp(20px, 4.1666666667vw, 80px);
    padding-bottom: clamp(20px, 4.1666666667vw, 80px)
}

.pt80 {
    padding-top: clamp(20px, 4.1666666667vw, 80px)
}

.pb80 {
    padding-bottom: clamp(20px, 4.1666666667vw, 80px)
}

.m70 {
    margin-top: clamp(20px, 3.6458333333vw, 70px);
    margin-bottom: clamp(20px, 3.6458333333vw, 70px)
}

.mt70 {
    margin-top: clamp(20px, 3.6458333333vw, 70px)
}

.mb70 {
    margin-bottom: clamp(20px, 3.6458333333vw, 70px)
}

.p70 {
    padding-top: clamp(20px, 3.6458333333vw, 70px);
    padding-bottom: clamp(20px, 3.6458333333vw, 70px)
}

.pt70 {
    padding-top: clamp(20px, 3.6458333333vw, 70px)
}

.pb70 {
    padding-bottom: clamp(20px, 3.6458333333vw, 70px)
}

.m50 {
    margin-top: clamp(20px, 2.6041666667vw, 50px);
    margin-bottom: clamp(20px, 2.6041666667vw, 50px)
}

.mt50 {
    margin-top: clamp(20px, 2.6041666667vw, 50px)
}

.mb50 {
    margin-bottom: clamp(20px, 2.6041666667vw, 50px)
}

.p50 {
    padding-top: clamp(20px, 2.6041666667vw, 50px);
    padding-bottom: clamp(20px, 2.6041666667vw, 50px)
}

.pt50 {
    padding-top: clamp(20px, 2.6041666667vw, 50px)
}

.pb50 {
    padding-bottom: clamp(20px, 2.6041666667vw, 50px)
}

.m40 {
    margin-top: clamp(20px, 2.0833333333vw, 40px);
    margin-bottom: clamp(20px, 2.0833333333vw, 40px)
}

.mt40 {
    margin-top: clamp(20px, 2.0833333333vw, 40px)
}

.mb40 {
    margin-bottom: clamp(20px, 2.0833333333vw, 40px)
}

.p40 {
    padding-top: clamp(20px, 2.0833333333vw, 40px);
    padding-bottom: clamp(20px, 2.0833333333vw, 40px)
}

.pt40 {
    padding-top: clamp(20px, 2.0833333333vw, 40px)
}

.pb40 {
    padding-bottom: clamp(20px, 2.0833333333vw, 40px)
}

.m20 {
    margin-top: clamp(20px, 1.0416666667vw, 20px);
    margin-bottom: clamp(20px, 1.0416666667vw, 20px)
}

.mt20 {
    margin-top: clamp(20px, 1.0416666667vw, 20px)
}

.mb20 {
    margin-bottom: clamp(20px, 1.0416666667vw, 20px)
}

.p20 {
    padding-top: clamp(20px, 1.0416666667vw, 20px);
    padding-bottom: clamp(20px, 1.0416666667vw, 20px)
}

.pt20 {
    padding-top: clamp(20px, 1.0416666667vw, 20px)
}

.pb20 {
    padding-bottom: clamp(20px, 1.0416666667vw, 20px)
}

*,
*::before,
*::after {
    box-sizing: border-box
}

* {
    margin: 0
}

body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased
}

img,
picture,
video,
canvas,
svg {
    display: block;
    max-width: 100%
}

input,
button,
textarea,
select {
    font: inherit
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word
}

#root,
#__next {
    isolation: isolate
}

*,
::before,
::after {
    box-sizing: border-box
}

html {
    overflow-x: hidden
}

a {
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none
}

p,
h1,
h2,
h3,
h4 {
    margin: 0
}

p+p,
p+.btn,
h1+p,
h1+.btn,
h2+p,
h2+.btn,
h3+p,
h3+.btn,
h4+p,
h4+.btn {
    margin-top: 15px
}

.wrapper h2 + p {
    margin-top: -15px;
}

.icon,
.sendmethod {
    line-height: 0
}

.btn {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    cursor: pointer;
    border: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(45px, 2.6041666667vw, 50px);
    padding: clamp(7px, 0.5208333333vw, 10px) clamp(10px, 1.0416666667vw, 20px);
    transition: .2s;
    border-radius: 5px;
    transform: translateY(0);
    font-weight: 500;
    font-family: var(--titleFont);
    background-color: var(--primaryColor);
    color: #fff
}

.btn:focus,
.btn:hover {
    transform: translateY(-2px)
}

.btn:active {
    transform: translateY(1px)
}

.btn:has(.icon, .sendmethod) {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 0.78125vw, 15px)
}

.btn--small {
    padding: clamp(2px, 0.2604166667vw, 5px) clamp(5px, 0.5208333333vw, 10px);
    font-size: clamp(10px, 1.5vw, 15px);
    font-weight: 500;
    min-height: auto;
    gap: 7px
}

.btn--white {
    background-color: #fff;
    color: var(--primaryColor)
}

.btn--black {
    background-color: var(--black)
}

.btn--shadow {
    box-shadow: 0px 2px 2px rgba(37, 37, 37, .1019607843)
}

.btn--big {
    padding: clamp(7px, 0.5208333333vw, 10px) clamp(10px, 1.5625vw, 30px)
}

.btn--green {
    background-color: var(--green)
}

.btn--lightred {
    background-color: var(--redlightbg);
    color: var(--primaryColor)
}

.redtext {
    font-size: clamp(13px, 1.6vw, 16px);
    font-weight: var(--medium);
    color: var(--primaryColor);
    display: flex;
    gap: clamp(5px, 0.5208333333vw, 10px);
    align-items: center;
    align-content: center
}

.redtext .icon,
.redtext .sendmethod {
    font-size: clamp(20px, 2.2vw, 22px)
}

.arrow-button {
    aspect-ratio: 1/1;
    width: clamp(40px, 2.6041666667vw, 50px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    font-size: 14px;
    background-color: var(--primaryColor);
    color: #fff;
    border-radius: 50%;
    transition: .4s ease;
    opacity: 1
}

.arrow-button::after {
    display: none
}

.arrow-button:hover {
    background-color: var(--secondaryColor);
    cursor: pointer
}

.arrow-button.swiper-button-disabled {
    opacity: .5;
    pointer-events: none
}

.arrow-button--white {
    background-color: #fff;
    color: var(--primaryColor);
    box-shadow: 0px 4px 3px rgba(37, 37, 37, .1019607843)
}

.arrow-button--white:hover {
    color: #fff;
    background-color: var(--primaryColor)
}

.arrow-button--small {
    max-width: clamp(35px, 2.0833333333vw, 40px);
    font-size: 12px
}

.arrow-button--gallery.swiper-button-disabled {
    opacity: 0
}

.arrow-button--next .icon,
.arrow-button--next .sendmethod {
    rotate: 180deg
}

.arrow-buttonthread--next {
    position: absolute;
    top: 50%;
    left: -10px;
    z-index: 11;
    transform: translateY(-50%)
}

.arrow-buttonthread--next span {
    rotate: 180deg
}

.arrow-buttonthread--prev {
    position: absolute;
    top: 50%;
    right: -10px;
    z-index: 11;
    transform: translateY(-50%)
}

.card__label {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background-color: #fff;
    padding: 2px clamp(5px, 0.5208333333vw, 10px);
    font-size: clamp(10px, 1.4vw, 14px);
    border-radius: 4px;
    color: var(--primaryColor);
    background-color: #fff
}

.card__label--red {
    background: var(--primaryColor);
    color: #fff
}

.card__label--black {
    background-color: var(--black);
    color: #fff
}

.product-overview__backbutton {
    border: 1px solid #e9d8da;
    color: var(--primaryColor);
    background-color: #fff
}

.product-overview__backbutton .icon::before,
.product-overview__backbutton .sendmethod::before {
    transform: rotate(-180deg);
    font-size: 12px
}

.content-row {
    --contentRowSpacing: clamp(20px, 6.25vw, 120px);
    --contentRowBackground: #fbfaff;
    position: relative
}

.content-row:not(.content-row--bg) {
    margin-block: var(--contentRowSpacing)
}

.content-row:not(.content-row--bg)+.content-row:not(.content-row--bg) {
    margin-top: 0;
    padding-top: var(--contentRowSpacing);
    border-top: 1px solid var(--contentRowSeperator)
}

.content-row--bg {
    background: var(--contentRowBackground);
    padding-block: var(--contentRowSpacing)
}

.content-row--rowname {
    margin-block: 0 !important;
    padding-block: 0 !important;
    border-top: none !important;
    margin-bottom: -1px !important
}

.content-row--row-a+.content-row--row-b:not(.content-row--row-a+.content-row--row-b--bg) {
    border-top: none !important;
    padding-top: 0 !important
}

.content-row__debug {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 1;
    cursor: default;
    color: #fff;
    background: rgba(0, 0, 0, .5);
    padding: 4px 10px;
    font-family: "Lucida Sans Typewriter", monospace;
    letter-spacing: 1px;
    line-height: 1.5;
    font-size: 10px
}

.content-row__debug i {
    display: block;
    font-size: .8em;
    opacity: .7;
    font-style: normal
}

@media(max-width: 1250px) {
    .content-row__debug {
        display: none
    }
}

html:has(#frontend-debug.frontend-debug--hidden) .content-row__debug {
    display: none
}

.content-row:has(.content-row__debug:hover)::before {
    content: "";
    position: absolute;
    inset: 0;
    background: red;
    opacity: .05
}

:root {
    --inputTextColor: var(--textColor);
    --inputPlaceholderColor: var(--textColor);
    --inputBackgroundColor: #fff;
    --inputBorderColor: #E5E8F0;
    --inputFocusColor: var(--primaryColor)
}

input[type=text]:not(.default-style),
input[type=password]:not(.default-style),
input[type=email]:not(.default-style),
input[type=number]:not(.default-style),
input[type=tel]:not(.default-style),
input[type=url]:not(.default-style),
input[type=search]:not(.default-style),
input[type=date]:not(.default-style),
input[type=time]:not(.default-style),
textarea:not(.default-style),
select:not(.default-style) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    box-shadow: none;
    font: inherit;
    color: var(--inputTextColor);
    padding: 0 clamp(10px, 1.0416666667vw, 20px);
    height: clamp(45px, 2.6041666667vw, 50px);
    border: 1px solid var(--inputBorderColor);
    border-radius: 5px;
    background-color: var(--inputBackgroundColor);
    transition: .2s
}

input[type=text]:not(.default-style)::-moz-placeholder,
input[type=password]:not(.default-style)::-moz-placeholder,
input[type=email]:not(.default-style)::-moz-placeholder,
input[type=number]:not(.default-style)::-moz-placeholder,
input[type=tel]:not(.default-style)::-moz-placeholder,
input[type=url]:not(.default-style)::-moz-placeholder,
input[type=search]:not(.default-style)::-moz-placeholder,
input[type=date]:not(.default-style)::-moz-placeholder,
input[type=time]:not(.default-style)::-moz-placeholder,
textarea:not(.default-style)::-moz-placeholder,
select:not(.default-style)::-moz-placeholder {
    color: var(--inputPlaceholderColor);
    opacity: 1
}

input[type=text]:not(.default-style)::placeholder,
input[type=password]:not(.default-style)::placeholder,
input[type=email]:not(.default-style)::placeholder,
input[type=number]:not(.default-style)::placeholder,
input[type=tel]:not(.default-style)::placeholder,
input[type=url]:not(.default-style)::placeholder,
input[type=search]:not(.default-style)::placeholder,
input[type=date]:not(.default-style)::placeholder,
input[type=time]:not(.default-style)::placeholder,
textarea:not(.default-style)::placeholder,
select:not(.default-style)::placeholder {
    color: var(--inputPlaceholderColor);
    opacity: 1
}

input[type=text]:not(.default-style):focus,
input[type=password]:not(.default-style):focus,
input[type=email]:not(.default-style):focus,
input[type=number]:not(.default-style):focus,
input[type=tel]:not(.default-style):focus,
input[type=url]:not(.default-style):focus,
input[type=search]:not(.default-style):focus,
input[type=date]:not(.default-style):focus,
input[type=time]:not(.default-style):focus,
textarea:not(.default-style):focus,
select:not(.default-style):focus {
    outline: 0;
    box-shadow: none;
    border-color: var(--inputFocusColor)
}

input[type=date] {
    padding-right: 10px
}

input[type=date]:-moz-placeholder {
    color: var(--inputPlaceholderColor)
}

input[type=date]:placeholder-shown {
    color: var(--inputPlaceholderColor)
}

input[type=range] {
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: rgba(0, 0, 0, 0);
    cursor: pointer;
    width: 100%
}

input[type=range]:focus {
    outline: none
}

input[type=range]::-moz-range-progress,
input[type=range]::-ms-fill-lower {
    background-color: var(--inputFocusColor)
}

input[type=range]::-webkit-slider-runnable-track,
input[type=range]::-moz-range-track,
input[type=range]::-ms-fill-upper {
    background-color: var(--inputBorderColor);
    border-radius: 5px;
    height: 5px
}

input[type=range]::-webkit-slider-thumb,
input[type=range]::-moz-range-thumb {
    background-color: var(--inputFocusColor);
    height: 15px;
    width: 15px;
    border-radius: 100%
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    margin-top: -5px
}

input[type=range]::-moz-range-thumb {
    border: none;
    border-radius: 0
}

input[type=color] {
    padding: 0
}

textarea {
    padding-block: 10px;
    height: 157px
}

select {
    cursor: pointer;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 45px;
    --selectArrowColor: currentColor;
    background-image: linear-gradient(45deg, transparent calc(50% - 1px), var(--selectArrowColor) calc(50% - 1px), var(--selectArrowColor) calc(50% + 1px), transparent calc(50% + 1px)), linear-gradient(-45deg, transparent calc(50% - 1px), var(--selectArrowColor) calc(50% - 1px), var(--selectArrowColor) calc(50% + 1px), transparent calc(50% + 1px));
    background-repeat: no-repeat;
    background-size: 6px 15px;
    background-position: right 26px center, right 20px center
}

select:focus {
    --selectArrowColor: var(--inputFocusColor)
}

select:has(option[disabled]:first-child:checked) {
    color: var(--inputPlaceholderColor)
}

select option {
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    color: var(--inputTextColor)
}

select option[disabled] {
    color: var(--inputPlaceholderColor)
}

.check,
.webform__radio,
.webform__checkbox,
.webform__multicheckbox {
    --checkSize: 20px;
    display: flex;
    position: relative
}

.check input,
.webform__radio input,
.webform__checkbox input,
.webform__multicheckbox input {
    position: absolute;
    opacity: 0;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    cursor: pointer
}

.check label,
.webform__radio label,
.webform__checkbox label,
.webform__multicheckbox label {
    display: block;
    min-height: var(--checkSize);
    padding-left: calc(var(--checkSize) + 12px)
}

.check label::before,
.check label::after,
.webform__radio label::before,
.webform__radio label::after,
.webform__checkbox label::before,
.webform__checkbox label::after,
.webform__multicheckbox label::before,
.webform__multicheckbox label::after {
    content: "";
    display: block;
    pointer-events: none;
    position: absolute;
    top: 5px;
    left: 0;
    width: var(--checkSize);
    aspect-ratio: 1;
    transition: .2s
}

.check label::before,
.webform__radio label::before,
.webform__checkbox label::before,
.webform__multicheckbox label::before {
    background-color: #fff;
    border: 1px solid var(--inputBorderColor);
    border-radius: 2px
}

.check label::after,
.webform__radio label::after,
.webform__checkbox label::after,
.webform__multicheckbox label::after {
    opacity: 0;
    transform: scale(0);
    background: var(--inputFocusColor);
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 274.3 211.8"><path fill="currentColor" d="M105.8 154.5L27.5 79.9 0 108.9l108.1 102.9L274.3 26.7 244.6 0z"/></svg>');
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 274.3 211.8"><path fill="currentColor" d="M105.8 154.5L27.5 79.9 0 108.9l108.1 102.9L274.3 26.7 244.6 0z"/></svg>');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: auto calc(var(--checkSize)/2);
    mask-size: auto calc(var(--checkSize)/2)
}

.check:has(input[type=radio]) label::before,
.check:has(input[type=radio]) label::after,
.webform__radio:has(input[type=radio]) label::before,
.webform__radio:has(input[type=radio]) label::after,
.webform__checkbox:has(input[type=radio]) label::before,
.webform__checkbox:has(input[type=radio]) label::after,
.webform__multicheckbox:has(input[type=radio]) label::before,
.webform__multicheckbox:has(input[type=radio]) label::after {
    border-radius: 100%
}

.check:has(input[type=radio]) label::after,
.webform__radio:has(input[type=radio]) label::after,
.webform__checkbox:has(input[type=radio]) label::after,
.webform__multicheckbox:has(input[type=radio]) label::after {
    --whiteSpace: 5px;
    margin: var(--whiteSpace);
    width: calc(var(--checkSize) - var(--whiteSpace)*2);
    -webkit-mask: none;
    mask: none
}

.check:has(input:focus) label::before,
.webform__radio:has(input:focus) label::before,
.webform__checkbox:has(input:focus) label::before,
.webform__multicheckbox:has(input:focus) label::before {
    border-color: var(--inputFocusColor)
}

.check:has(input:checked) label::after,
.webform__radio:has(input:checked) label::after,
.webform__checkbox:has(input:checked) label::after,
.webform__multicheckbox:has(input:checked) label::after {
    opacity: 1;
    transform: scale(1)
}

.check:has(input:disabled) input,
.webform__radio:has(input:disabled) input,
.webform__checkbox:has(input:disabled) input,
.webform__multicheckbox:has(input:disabled) input {
    cursor: default
}

.check:has(input:disabled) label::before,
.webform__radio:has(input:disabled) label::before,
.webform__checkbox:has(input:disabled) label::before,
.webform__multicheckbox:has(input:disabled) label::before {
    opacity: .5
}

.webform-file-block .webform__file {
    padding: clamp(20px, 0.5208333333vw, 10px);
    border: 1px dashed #000;
    border-radius: 3px
}

.webform-file-block .webform-file-preview {
    margin-top: 10px
}

.webform-file-block .webform-file-preview .file--error .webform-file-preview__title,
.webform-file-block .webform-file-preview .file--error .webform-file-preview__delete,
.webform-file-block .webform-file-preview .file--error .webform-file-preview__icon {
    display: none
}

.webform-file-block .webform-file-preview .webform-file-preview__file {
    gap: clamp(20px, 0.5208333333vw, 10px);
    display: flex;
    align-items: center
}

.webform-file-block .webform-file-preview .webform-file-preview__content {
    flex-grow: 1;
    display: flex;
    align-items: center
}

.webform-file-block .webform-file-preview .webform-file-preview__title {
    margin-right: auto
}

.webform-file-block .webform-file-preview .webform-file-preview__delete {
    margin-left: 10px;
    flex: 0 0 18px;
    cursor: pointer
}

.webform-file-block .webform-file-preview .webform-file-preview__delete svg path {
    fill: var(--inputFocusColor)
}

.webform-file-block .webform-file-preview .webform-file-preview__bottom {
    width: 100%;
    padding: 10px;
    border: 1px solid red;
    font-size: 16px
}

.webform-file-block .webform-file-preview .webform-file-preview__bottom ul {
    margin: 0;
    padding: 0
}

.webform-file-block .webform-file-preview .webform-file-preview__bottom ul li {
    list-style-type: none
}

html {
    font-family: var(--textFont);
    font-weight: 400;
    font-size: clamp(16px, 1.8vw, 18px);
    line-height: 1.4;
    color: var(--textColor);
    margin-top: clamp(20px, 10.4166666667vw, 200px)
}

p a:not([class]) {
    color: var(--primaryColor)
}

.user-content .title,
h2,
h1,
.user-content h1,
.user-content h2,
.user-content h3,
.user-content h4,
.user-content h5,
.user-content h6,
.title {
    font-family: var(--titleFont);
    font-weight: 600;
    line-height: 1.2;
    text-wrap: balance
}

.title, h2, h1 {
    font-size: clamp(21px, 3.5vw, 35px)
}

.title--25 {
    font-size: clamp(16px, 2.5vw, 25px)
}

.title--30 {
    font-size: clamp(18px, 3vw, 30px)
}

.title--35 {
    font-size: clamp(21px, 3.5vw, 35px)
}

.title--40 {
    font-size: clamp(24px, 4vw, 40px)
}

.title--checkout-24 {
    font-size: 24px
}

.title--50 {
    font-size: clamp(30px, 5vw, 50px)
}

.title--60 {
    font-size: clamp(36px, 6vw, 60px)
}

.title--black {
    color: vaR(--black)
}

.title--white {
    color: #fff
}

.title--primary {
    color: var(--primaryColor)
}

.title--blue {
    color: #336a77
}

.user-content {
    line-height: 1.55
}

.user-content .title,
h2,
h1,
.user-content h1,
.user-content h2,
.user-content h3,
.user-content h4,
.user-content h5,
.user-content h6 {
    margin-bottom: 1em;
    margin-top: 1.2em
}

.user-content .title+.checkmarks,
.user-content h1+.checkmarks,
.user-content h2+.checkmarks,
.user-content h3+.checkmarks,
.user-content h4+.checkmarks,
.user-content h5+.checkmarks,
.user-content h6+.checkmarks {
    margin-top: -8px
}

.user-content *:first-child {
    margin-top: 0
}

.user-content p {
    margin-top: 0;
    margin-bottom: .8em
}

.user-content p+ul:not([class]) {
    margin-top: -0.8em
}

.user-content .checkmarks {
    margin-bottom: 2em
}

.user-content ul:not([class]) {
    list-style: none;
    padding: 0;
    margin: 0 0 .8em
}

.user-content ul:not([class]) li {
    padding-left: 20px;
    position: relative
}

.user-content ul:not([class]) li::before {
    content: "";
    display: inline-flex;
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background: #a7a9ac;
    position: absolute;
    left: 0;
    top: 13px
}

.user-content p a:not([class]),
.user-content li a:not([class]),
.user-content ul a:not([class]) {
    color: inherit;
    text-decoration: underline
}

.user-content table {
    margin: 20px 0;
    border-collapse: collapse;
    width: 100%
}

.user-content table th {
    padding: 10px 10px;
    text-align: left;
    background-color: var(--black);
    color: #fff
}

.user-content table td {
    padding: 10px
}

.user-content table tr:nth-child(even) {
    background-color: #f2f2f2
}

.webform {
    container: webform/inline-size
}

.webform input,
.webform textarea,
.webform select {
    width: 100%
}

.webform label {
    display: flex
}

.webform label:has(~[required]) {
    gap: 5px
}

.webform label:has(~[required])::after {
    content: "*";
    font-size: .7em
}

.webform__required-text,
.webform .required_text {
    display: none
}

.webform .error input,
.webform .error textarea,
.webform .webform__field--error input,
.webform .webform__field--error textarea {
    border-color: red !important
}

.webform .disabled input,
.webform .disabled textarea {
    pointer-events: none;
    background: #f1f4f5;
    color: #647684
}

.webform .webform-submit-classic {
    width: 0 !important
}

.webform .webform-button-block {
    display: flex
}

.webform .webform__errors {
    margin-bottom: 20px;
    color: red
}

.webform .webform__field {
    display: flex;
    flex-direction: column;
    gap: 5px
}

.webform .webform__field--half {
    --column-amount: 2
}

@container webform (max-width: 440px) {
    .webform .webform__field--half {
        width: 100%
    }
}

.webform .webform__field--third {
    --column-amount: 3
}

@container webform (max-width: 440px) {
    .webform .webform__field--third {
        width: 100%
    }
}

.banners {
    display: flex;
    gap: clamp(15px, 2.0833333333vw, 40px)
}

@media(max-width: 650px) {
    .banners {
        flex-direction: column;
        gap: clamp(20px, 1.0416666667vw, 20px)
    }
}

.banner {
    container-type: inline-size;
    border: 1px dashed var(--primaryColor);
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    gap: clamp(20px, 2.0833333333vw, 40px);
    align-items: center;
    align-content: center;
    width: 100%
}

.banner:last-child {
    border: 1px dashed #71b2c1
}

.banner:last-child .banner__image {
    background-color: var(--bluelightbg)
}

.banner:last-child .btn {
    background-color: var(--secondaryColor)
}

@container (max-width: 500px) {
    .banner {
        flex-direction: column;
        padding: clamp(20px, 1.0416666667vw, 20px)
    }
}

.banner__content {
    padding: clamp(30px, 2.6041666667vw, 50px) clamp(30px, 2.0833333333vw, 40px);
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 1.0416666667vw, 20px);
    justify-content: start;
    align-items: start;
    align-content: start;
    padding-right: 0
}

.banner__content .btn {
    margin-top: clamp(5px, 0.5208333333vw, 10px)
}

@container (max-width: 500px) {
    .banner__content {
        padding: clamp(10px, 1.0416666667vw, 20px);
        width: 100%;
        padding-right: clamp(10px, 1.0416666667vw, 20px)
    }
}

.banner__image {
    aspect-ratio: 224/266;
    max-width: 224px;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    background-color: var(--redlightbg);
    margin: clamp(4px, 0.5729166667vw, 11px);
    position: relative
}

.banner__image img {
    -o-object-fit: cover;
    object-fit: cover;
    width: 80%;
    height: 100%;
    right: 0;
    bottom: 0;
    position: absolute;
    -o-object-position: center center;
    object-position: center center
}

@container (max-width: 450px) {
    .banner__image {
        display: none
    }
}

.betalingsmerken {
    display: flex;
    gap: clamp(10px, 1.0416666667vw, 20px);
    align-items: center;
    align-content: center
}

.btgr-block {
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 0.78125vw, 15px);
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center
}

.btgr-block:hover .block__image img {
    scale: 1.1
}

.btgr-block:hover .block__title {
    text-decoration-color: currentColor
}

.block__image {
    max-width: 200px;
    width: 100%;
    aspect-ratio: 1/1;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    overflow: hidden;
    border-radius: 5px
}

.block__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    scale: 1;
    transition: .2s ease-in-out
}

.block__title {
    color: var(--black);
    text-decoration: underline;
    text-underline-offset: 5px;
    text-decoration-color: rgba(0, 0, 0, 0);
    transition: .2s ease-in-out;
    text-decoration-thickness: 2px;
    font-size: clamp(14px, 1.6vw, 16px)
}

.card {
    display: flex;
    flex-direction: column
}

.card:has(.card__image:hover) .card__title {
    color: var(--primaryColor)
}

.card__image {
    aspect-ratio: 1;
    width: 100%;
    padding: clamp(5px, 0.78125vw, 15px);
    flex-wrap: wrap;
    position: relative;
    display: flex;
    border-radius: 8px;
    transition: .2s ease-in-out;
    overflow: hidden;
    justify-content: space-between
}

.card__image:hover img {
    scale: 1.08
}

.card__image>img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    scale: 1;
    transition: .2s ease-in-out
}

.card__content {
    padding: 0 clamp(2px, 0.5208333333vw, 10px);
    padding-top: clamp(20px, 1.3020833333vw, 25px);
    padding-bottom: 3px;
    display: flex;
    flex-direction: column
}

.card__title {
    font-size: clamp(15px, 1.8vw, 18px);
    font-weight: var(--medium);
    color: var(--black);
    margin-bottom: clamp(5px, 0.78125vw, 15px);
    transition: .2s ease-in-out
}

.card__title:hover {
    color: var(--primaryColor)
}

.card__name {
    margin-bottom: clamp(0px, 0.2604166667vw, 5px);
    font-size: clamp(12px, 1.6vw, 16px);
    font-weight: 400;
    color: var(--grey)
}

.card__bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: clamp(0px, 0.2604166667vw, 5px);
    align-items: end
}

.card__bottom__left {
    display: flex;
    flex-direction: column;
    gap: clamp(0px, 0.2604166667vw, 5px)
}

.card__price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    align-content: center;
    flex-direction: row-reverse;
    gap: 5px;
    row-gap: 2px;
    color: var(--primaryColor);
    font-weight: var(--bold);
    justify-content: start
}

.card__price .strikethrough {
    display: flex;
    align-items: center;
    align-content: center;
    color: var(--black);
    font-weight: 400;
    text-decoration: line-through
}

.indicator {
    width: clamp(4px, 0.3645833333vw, 7px);
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border-radius: 50%;
    background-color: currentColor;
    color: currentColor
}

.stock * {
    font-size: clamp(13px, 1.6vw, 16px);
    font-weight: 400
}

.stock>span:has(.indicator) {
    display: flex;
    justify-content: start;
    align-items: center;
    align-content: center;
    gap: 5px
}

.stock .stock-available {
    color: var(--green)
}

.stock .stock-low {
    color: var(--orange)
}

.stock .stock-out {
    color: red
}

.card__labels {
    display: flex;
    gap: clamp(2px, 0.2604166667vw, 5px)
}

.langbadge {
    aspect-ratio: 1;
    box-shadow: 0px 4px 3px rgba(37, 37, 37, .1019607843);
    width: clamp(21px, 1.3541666667vw, 26px);
    height: clamp(21px, 1.3541666667vw, 26px);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border: 4px solid #fff
}

.langbadge img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    border-radius: 50%
}

.favoritebadge {
    aspect-ratio: 1/1;
    color: var(--primaryColor);
    box-shadow: 0px 4px 3px rgba(37, 37, 37, .1019607843);
    width: clamp(25px, 1.8229166667vw, 35px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background-color: #fff;
    border-radius: 50%;
    transition: .2s ease-in-out;
    cursor: pointer;
    font-size: clamp(13px, 1.5vw, 15px)
}

.favoritebadge.is-active {
    background-color: var(--primaryColor);
    color: #fff
}

.favoritebadge:hover .icon,
.favoritebadge:hover .sendmethod {
    scale: 1.1
}

.favoritebadge .icon,
.favoritebadge .sendmethod {
    font-size: clamp(15pxpx, 1.5pxvw, 15pxpx);
    scale: 1;
    display: flex;
    margin-bottom: -1px;
    transition: .2s ease-in-out
}

.favoritebadge--big {
    width: clamp(25px, 2.3958333333vw, 46px)
}

.favoritebadge--big .icon,
.favoritebadge--big .sendmethod {
    font-size: clamp(16px, 2.2pxvw, 22pxpx)
}

.card__labels {
    position: absolute;
    bottom: 10px;
    left: 10px
}

.card__botttom__cart {
    background-color: var(--green);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    color: #fff;
    border-radius: 8px;
    padding: clamp(6px, 0.5208333333vw, 10px) clamp(10px, 0.7291666667vw, 14px);
    transform: scale(1);
    transition: .2s ease-in-out;
    cursor: pointer
}

.card__botttom__cart:hover,
.card__botttom__cart:focus {
    transform: scale(1.05)
}

.cart-slider {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000002;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease
}

.cart-slider.is-active {
    opacity: 1;
    pointer-events: auto
}

.cart-slider.is-active .cart-slider__overlay {
    opacity: 1
}

.cart-slider.is-active .cart-slider__panel {
    transform: translateX(0)
}

.cart-slider__overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    opacity: 0;
    transition: opacity .3s ease
}

.cart-slider__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    max-width: 450px;
    height: 100%;
    background-color: #fff;
    transform: translateX(100%);
    transition: transform .4s ease;
    display: flex;
    flex-direction: column;
    box-shadow: -2px 0 10px rgba(0, 0, 0, .1);
    border-radius: 0 0 0 5px
}

.cart-slider__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: clamp(20px, 1.0416666667vw, 20px);
    border-bottom: 1px dashed rgba(199, 11, 69, 0.2509803922)
}

@media(max-width: 576px) {
    .cart-slider__header {
        padding: clamp(20px, 0.78125vw, 15px)
    }
}

.cart-slider__title {
    font-family: var(--titleFont);
    color: var(--primaryColor);
    font-size: clamp(20px, 2.4vw, 24px);
    font-weight: 600;
    margin: 0
}

.cart-slider__body {
    flex: 1;
    overflow-y: auto;
    padding: clamp(20px, 1.0416666667vw, 20px)
}

@media(max-width: 576px) {
    .cart-slider__body {
        padding: clamp(20px, 0.78125vw, 15px)
    }
}

.cart-slider__footer {
    padding: clamp(20px, 1.0416666667vw, 20px);
    border-top: 1px dashed #e9d8da
}

@media(max-width: 576px) {
    .cart-slider__footer {
        padding: clamp(20px, 0.78125vw, 15px)
    }
}

.cart-empty {
    text-align: center;
    padding: clamp(30px, 2.6041666667vw, 50px) 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(20px, 1.0416666667vw, 20px)
}

.cart-empty__icon .icon,
.cart-empty__icon .sendmethod {
    font-size: clamp(20px, 2.6041666667vw, 50px);
    color: var(--primaryColor);
    opacity: .5
}

.cart-empty p {
    color: var(--black);
    font-size: clamp(16px, 1.6vw, 16px);
    line-height: 1.7
}

.cart-items {
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 0.78125vw, 15px);
    margin-bottom: clamp(20px, 1.0416666667vw, 20px)
}

.cart-item {
    display: flex;
    padding: clamp(10px, 0.78125vw, 15px) 0;
    border-bottom: 1px dashed #e9d8da;
    position: relative;
    align-items: start
}

.cart-item:last-child {
    border-bottom: none
}

.cart-item__image {
    margin-right: clamp(20px, 0.78125vw, 15px);
    border-radius: 5px;
    overflow: hidden;
    aspect-ratio: 1/1;
    background-color: var(--redlightbg);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    overflow: hidden;
    transition: .2s ease-in-out;
    flex: 1 1 auto;
    max-width: 80px;
    width: 100%
}

.cart-item__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.cart-item__details {
    flex-grow: 1;
    padding-right: clamp(20px, 1.5625vw, 30px);
    display: flex;
    flex-direction: column
}

.cart-item__name {
    font-family: var(--titleFont);
    font-size: clamp(14px, 1.6vw, 16px);
    margin: 0 0 5px;
    font-weight: 500;
    color: var(--black)
}

.cart-item__meta {
    display: flex;
    align-items: center;
    margin-bottom: clamp(20px, 0.5208333333vw, 10px)
}

.cart-item__price {
    font-weight: 600;
    color: var(--primaryColor);
    font-family: var(--titleFont)
}

.cart-item__per {
    margin-left: clamp(20px, 0.2604166667vw, 5px);
    font-size: clamp(12px, 1.4vw, 14px);
    color: #666
}

.cart-item__quantity {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.cart-item__subtotal {
    font-weight: 600;
    font-family: var(--titleFont);
    color: var(--black)
}

.cart-item__remove {
    position: absolute;
    top: clamp(20px, 0.78125vw, 15px);
    right: 0;
    background: none;
    border: none;
    color: #999;
    cursor: pointer;
    padding: clamp(20px, 0.2604166667vw, 5px);
    transition: .2s ease-in-out
}

.cart-item__remove:hover {
    color: var(--primaryColor);
    transform: translateY(-2px)
}

.cart-item__remove:active {
    transform: translateY(1px)
}

.cart-item__remove .icon,
.cart-item__remove .sendmethod {
    font-size: clamp(14px, 1.6vw, 16px)
}

.cart-item__details {
    text-align: left;
    justify-content: start;
    align-items: start;
    gap: clamp(5px, 0.5208333333vw, 10px)
}

.cart-item__details--totalprice {
    padding-left: 0 !important;
    text-align: left !important
}

.quantity-control {
    display: flex;
    align-items: center;
    border: 1px solid #e9d8da;
    border-radius: 5px;
    overflow: hidden
}

.quantity-control__btn {
    width: clamp(20px, 1.5625vw, 30px);
    height: clamp(20px, 1.5625vw, 30px);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--redlightbg);
    border: none;
    cursor: pointer;
    font-size: clamp(16px, 1.6vw, 16px);
    font-weight: bold;
    color: var(--primaryColor);
    transition: .2s ease-in-out
}

.quantity-control__btn:hover {
    background-color: var(--primaryColor);
    color: #fff
}

.quantity-control__btn--minus {
    border-right: 1px solid #e9d8da
}

.quantity-control__btn--plus {
    border-left: 1px solid #e9d8da
}

.quantity-control__input {
    width: clamp(20px, 2.0833333333vw, 40px);
    height: clamp(20px, 1.5625vw, 30px);
    border: none;
    text-align: center;
    font-size: clamp(14px, 1.4vw, 14px);
    font-weight: 500;
    font-family: var(--titleFont)
}

.btgr-cart-summary {
    margin-bottom: clamp(20px, 1.0416666667vw, 20px);
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 0.4166666667vw, 8px)
}

.btgr-cart-summary__row {
    display: flex;
    justify-content: space-between;
    padding: clamp(5px, 0.4166666667vw, 8px) 0;
    font-size: clamp(15px, 1.5vw, 15px)
}

.btgr-cart-summary__row--total {
    padding-top: clamp(10px, 0.78125vw, 15px);
    border-top: 1px dashed #e9d8da;
    font-weight: 600;
    font-size: clamp(16px, 1.8vw, 18px);
    color: var(--primaryColor);
    font-family: var(--titleFont)
}

.cart-actions {
    display: flex;
    gap: 10px;
    flex-direction: column
}

.cart-timer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 4px;
    background-color: var(--primaryColor);
    transition: width .1s linear
}

.cart-timer.paused {
    animation-play-state: paused
}

.cart-slider__close .close-popup {
    position: relative;
    top: auto;
    right: auto;
    width: clamp(25px, 1.8229166667vw, 35px)
}

.catalog-row {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px
}

@media(max-width: 1200px) {
    .catalog-row {
        grid-template-columns: repeat(4, 1fr)
    }

    .catalog-row>*:nth-child(n+5) {
        display: none
    }
}

@media(max-width: 992px) {
    .catalog-row {
        grid-template-columns: repeat(3, 1fr)
    }

    .catalog-row>*:nth-child(n+4) {
        display: none
    }
}

@media(max-width: 768px) {
    .catalog-row {
        grid-template-columns: repeat(2, 1fr)
    }

    .catalog-row>*:nth-child(n+3) {
        display: none
    }
}

@media(max-width: 576px) {
    .catalog-row {
        grid-template-columns: repeat(2, 1fr)
    }

    .catalog-row>*:nth-child(n+3) {
        display: none
    }
}

.catalog-row .block__image {
    max-width: 2000px
}

.checkout__totals {
    max-width: 390px;
    width: 100%
}

@media(max-width: 1000px) {
    .checkout__totals {
        max-width: 350px
    }
}

@media(max-width: 960px) {
    .checkout__totals {
        max-width: 100%;
        margin-top: 20px
    }
}

.checkout__whereto {
    display: flex;
    position: relative;
    background-color: #fff;
    min-height: 220px
}

.checkout__totals__title {
    height: 53px;
    margin-bottom: clamp(20px, 2.0833333333vw, 40px);
    display: flex;
    align-items: center;
    align-content: center
}

@media(max-width: 800px) {
    .checkout__totals__title {
        height: auto;
        margin-bottom: 20px
    }
}

.checkout__totals__location {
    margin-bottom: 30px
}

@media(max-width: 800px) {
    .checkout__totals__location {
        margin-bottom: 0
    }
}

.checkout__totals__checks {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 30px
}

@media(max-width: 600px) {
    .checkout__totals__checks {
        display: none
    }
}

.checkout__totals__checks li {
    font-size: clamp(16px, 1.8vw, 18px)
}

.checkout__totals__checks li .icon,
.checkout__totals__checks li .sendmethod {
    font-size: 15px;
    color: #00b900;
    margin-right: 15px
}

.checkout__totals__checks+.checkout__totals__prices {
    margin-top: 40px
}

.checkout__totals__prices {
    border-radius: 2px
}

.checkout__totals__prices+.btn {
    margin-top: 20px
}

.checkout__totals__prices>span>div {
    border: 1px solid #e5e8f0;
    padding: 25px 20px;
    display: flex;
    justify-content: space-between;
    border-top: 0
}

.checkout__totals__prices>span>div>div {
    font-size: clamp(15px, 1.8vw, 18px);
    color: var(--black)
}

.checkout__totals__prices>span:first-child>div>div {
    font-weight: 500
}

.checkout__totals__prices>span:first-child>div {
    border: 1px solid #e5e8f0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.checkout__totals__prices>span:nth-last-child(2)>div {
    border-bottom: 0
}

.checkout__totals__prices>span:last-child>div {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}



.checkout__totals__prices>.total-segments>div {
    border: 1px solid #e5e8f0;
    padding: 25px 20px;
    display: flex;
    justify-content: space-between;
    border-top: 0
}

.checkout__totals__prices>.total-segments>div>div {
    font-size: clamp(15px, 1.8vw, 18px);
    color: var(--black)
}

.checkout__totals__prices>.total-segments>div:first-child>div {
    font-weight: 500
}

.checkout__totals__prices>.total-segments>div:first-child{
    border: 1px solid #e5e8f0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.checkout__totals__prices>.total-segments>div:nth-last-child(2)>div {
    border-bottom: 0
}

.checkout__totals__prices>.total-segments>div:last-child>div {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}


.checkout__totals__prices__total {
    border: 0 !important;
    background-color: #eefaed
}

.checkout__totals__prices__total>div {
    color: var(--green) !important;
    font-weight: 500
}

.checkout__totals__prices__kortingscode {
    display: flex;
    flex-direction: column;
    margin-bottom: clamp(10px, 1.0416666667vw, 20px);
    gap: 10px;
    padding: 20px;
    border: 1px solid #e5e8f0;
    border-radius: 5px
}

.checkout__totals__prices__kortingscode>div {
    font-weight: 500
}

.checkout__totals__prices__kortingscode.is-open {
    display: flex !important
}

.checkout__totals__prices__kortingscode input {
    border: 1px solid var(--border);
    width: 100%;
    font-weight: 400 !important;
    font-size: 16px !important
}

.checkout__totals__prices__kortingscode input:-moz-placeholder {
    border: 1px solid var(--border)
}

.checkout__totals__prices__kortingscode input:placeholder-shown {
    border: 1px solid var(--border)
}

.checkout__totals__prices__kortingscode__text {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

.checkout__totals__prices__kortingscode__text .icon,
.checkout__totals__prices__kortingscode__text .sendmethod {
    margin-right: 10px
}

.checkout__totals__prices__kortingscode__text--correct {
    color: var(--green) !important
}

.checkout__totals__prices__kortingscode__text--wrong {
    color: red !important
}

.checkout__totals__prices__kortingscode--correct input {
    border: 1px solid var(--green-color) !important
}

.checkout__totals__prices__kortingscode--wrong input {
    border: 1px solid red !important
}

.counter {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 5px;
    padding: 2px 5px;
    max-width: clamp(100px, 6.25vw, 120px);
    border: 1px solid #e9d8da;
    min-height: clamp(40px, 2.34375vw, 45px)
}

.counter:has(.counter-value:focus) {
    border-color: var(--primaryColor)
}

.counter-btn {
    background: none;
    border: none;
    color: #e91e63;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    padding: 8px;
    border-radius: 4px;
    transition: background-color .2s ease;
    width: clamp(22px, 1.6666666667vw, 32px);
    aspect-ratio: 1/1;
    display: flex;
    align-items: center;
    justify-content: center
}

.counter-btn:hover {
    background-color: #f5f5f5
}

.counter-btn:active {
    background-color: #e0e0e0
}

.counter-value {
    font-weight: 400;
    color: var(--black);
    font-size: clamp(14px, 1.6vw, 16px);
    min-width: 30px;
    text-align: center;
    border: none;
    background: rgba(0, 0, 0, 0);
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: textfield
}

.counter-value::-webkit-inner-spin-button,
.counter-value::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.topbar__top__item:hover+.menu,
.topbar__top__item:focus-within+.menu,
.topbar__top__item:has(a:hover)+.menu {
    top: 100%;
    opacity: 1;
    pointer-events: all
}

.menu {
    transition: .2s;
    top: calc(100% - 20px);
    opacity: 0;
    pointer-events: none;
    position: absolute;
    max-width: 1500px;
    width: calc(100% - 40px);
    background-color: #fff;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: inset 0px 5px 20px rgba(0, 8, 57, .0509803922);
    border-radius: 0px 0px 4px 4px
}

.menu::before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    background-color: rgba(0, 0, 0, 0);
    top: -33px;
    height: 50px
}

.menu:hover {
    top: 100%;
    opacity: 1;
    pointer-events: all
}

.menu:focus-within {
    top: 100%;
    opacity: 1;
    pointer-events: all
}

.menu__content {
    padding: clamp(20px, 2.6041666667vw, 50px);
    display: flex;
    gap: clamp(20px, 2.0833333333vw, 40px)
}

.menu__content>div {
    flex: 1
}

.menu__group {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.menu__group:has(.dropdown__top__card) {
    align-items: end;
    display: flex;
    flex-direction: column;
    flex: 0
}

.menu__group:nth-child(n+5) {
    display: none
}

.dropdown__top__card {
    border-radius: 5px;
    height: 100%;
    width: 260px;
    max-height: 270px;
    background-color: var(--primaryColor);
    overflow: hidden;
    overflow: hidden
}

.dropdown__top__card:hover .btn--topbar--card {
    transform: translateY(0) !important;
    background-color: var(--secondary-btn-bg-color)
}

.dropdown__top__card:hover img {
    scale: 1.1
}

.dropdown__top__card__top {
    height: calc(100% - 75px);
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    position: relative
}

.dropdown__top__card__top .btn {
    margin-bottom: -25px;
    z-index: 3
}

.dropdown__top__card__top img {
    position: absolute;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    scale: 1;
    transition: .2s ease-in-out
}

.dropdown__top__card__bottom {
    background-color: var(--primaryColor);
    height: 75px;
    width: 100%;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    padding-top: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    color: #fff;
    font-family: var(--titleFont);
    font-weight: 400;
    font-size: clamp(16px, 1.8vw, 18px);
    z-index: 2;
    position: relative
}

.btn--topbar--card {
    position: absolute;
    bottom: -25px;
    min-height: 50px;
    font-family: var(--titleFont);
    font-size: clamp(16px, 1.9vw, 19px);
    font-weight: 600
}

.btn--topbar--card:hover {
    transform: translateY(0) !important;
    background-color: var(--secondary-btn-bg-color)
}

.menu__link {
    display: flex;
    gap: 20px;
    align-items: center;
    align-content: center;
    font-family: var(--titleFont);
    font-size: 16px;
    font-weight: 500;
    color: var(--primaryColor);
    transition: .2s ease-in-out;
    overflow: hidden;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    text-decoration-color: rgba(0, 0, 0, 0)
}

.menu__link img {
    scale: 1;
    transition: .2s ease-in-out
}

.menu__link:hover {
    text-decoration-color: currentColor
}

.menu__link:hover img {
    scale: 1.1
}

.menu__link-icon {
    aspect-ratio: 1/1;
    background-color: var(--redlightbg);
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-shrink: 0;
    max-width: 53px;
    width: 100%;
    overflow: hidden
}

.menu__button {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 15px;
    background-color: var(--redlightbg);
    gap: 10px;
    color: var(--red);
    font-weight: 400;
    font-family: var(--textFont);
    font-size: clamp(16px, 1.8vw, 18px);
    text-transform: lowercase;
    transition: .2s ease-in-out
}

.menu__button:hover {
    background-color: var(--primaryColor);
    color: #fff
}

.menu__button::first-letter {
    text-transform: uppercase
}

.menu__button span {
    font-size: 10px;
    rotate: 0deg
}

.fabricslider__wrapper {
    position: relative
}

.fabricslider {
    overflow: hidden
}

@media(hover: none) {
    .fabricslider {
        overflow: inherit
    }
}

.fabricslider-buttons {
    position: absolute;
    top: 0;
    width: calc(100% + 40px);
    left: -20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    z-index: 10;
    pointer-events: none
}

.fabricslider-buttons>div {
    pointer-events: all
}

.dropdown-container {
    position: relative
}

.dropdown-container.value-selected .dropdown-header {
    border-color: var(--primaryColor)
}

.dropdown-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: clamp(9px, 0.5208333333vw, 10px) clamp(10px, 1.3020833333vw, 25px);
    background-color: #fff;
    border-radius: 5px;
    cursor: pointer;
    border: 1px solid #e9d8da;
    transition: .2s ease-in-out
}

.dropdown-header h3 {
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    color: var(--textColor)
}

.dropdown-arrow {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center
}

.dropdown-menu {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
    z-index: 10;
    max-height: 320px;
    overflow-y: auto;
    border-radius: 5px;
    pointer-events: none;
    opacity: 0;
    transition: .2s ease-in-out
}

.dropdown-menu.is-selected {
    opacity: 1;
    pointer-events: all
}

.search-box {
    border-bottom: 1px solid var(--border)
}

.search-box input {
    border: 0;
    width: 100%;
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    color: var(--textColor);
    padding: clamp(9px, 0.5208333333vw, 10px) clamp(10px, 1.3020833333vw, 25px)
}

.option {
    padding: clamp(5px, 0.5208333333vw, 10px) clamp(10px, 1.0416666667vw, 20px);
    cursor: pointer;
    transition: background-color .2s;
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    color: var(--textColor)
}

.option.selected {
    background-color: var(--primaryColor);
    color: #fff
}

.option:hover {
    background-color: #f5f5f5
}

.no-results {
    padding: clamp(5px, 0.6770833333vw, 13px) clamp(10px, 1.3020833333vw, 25px);
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    color: var(--textColor)
}

.footer__top {
    border-bottom: 1px solid var(--border);
    border-top: 1px solid var(--border);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: clamp(10px, 1.5625vw, 30px)
}

@media(max-width: 800px) {
    .footer__top {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        align-content: center;
        display: flex;
        gap: clamp(10px, 2.0833333333vw, 40px)
    }
}

.footer__main {
    display: flex;
    justify-content: space-between;
    gap: clamp(20px, 4.1666666667vw, 80px);
    row-gap: 20px
}

@media(max-width: 1000px) {
    .footer__main {
        flex-wrap: wrap;
        flex-direction: column
    }
}

.footer__col {
    display: flex;
    flex-direction: column;
    gap: clamp(15px, 1.3020833333vw, 25px)
}

.footer__col:last-of-type ul li:last-child a {
    color: var(--black)
}

@media(max-width: 700px) {
    .footer__col {
        gap: 10px
    }
}

.footer__col .title {
    font-size: clamp(15px, 1.8vw, 18px);
    font-weight: var(--medium);
    color: var(--primaryColor)
}

@media(max-width: 400px) {
    .footer__col {
        width: 100%
    }
}

.footer__col ul {
    all: unset;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 2px
}

.footer__col ul a {
    font-size: clamp(13px, 1.5vw, 15px);
    font-weight: 500;
    font-family: var(--titleFont);
    color: var(--black);
    text-decoration: underline;
    transition: .2s ease-in-out;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
    text-decoration-color: rgba(0, 0, 0, 0)
}

.footer__col ul a:hover {
    text-decoration-color: currentColor
}

.footer_col-line {
    border: 1px dashed rgba(59, 160, 184, .5098039216)
}

.footer_col-line:last-child {
    display: none
}

.footer__bottom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

@media(max-width: 1100px) {
    .footer__bottom {
        flex-wrap: wrap;
        gap: 20px
    }
}

@media(max-width: 500px) {
    .footer__bottom {
        flex-direction: column
    }
}

.footer__bottom__left {
    display: flex;
    align-items: center;
    align-content: center;
    font-weight: 400;
    font-family: var(--textFont);
    font-size: clamp(16px, 1.8vw, 18px);
    transition: .2s ease-in-out;
    flex: 1
}

@media(max-width: 1000px) {
    .footer__bottom__left {
        flex-wrap: wrap;
        gap: 20px
    }
}

@media(max-width: 500px) {
    .footer__bottom__left {
        flex-direction: column;
        align-items: start;
        align-content: start
    }
}

.footer__bottom__left ul {
    all: unset;
    list-style: none;
    display: flex;
    gap: clamp(20px, 1.0416666667vw, 20px);
    margin-left: clamp(20px, 1.0416666667vw, 20px)
}

@media(max-width: 1000px) {
    .footer__bottom__left ul {
        flex-wrap: wrap;
        margin-left: 0
    }
}

@media(max-width: 500px) {
    .footer__bottom__left ul {
        flex-direction: column
    }
}

.footer__bottom__left ul li a {
    color: var(--textColor);
    font-weight: 400;
    font-family: var(--textFont);
    font-size: clamp(16px, 1.8vw, 18px);
    transition: .2s ease-in-out
}

.footer__bottom__left ul li a:hover {
    color: var(--blue)
}

.footer__logo {
    max-width: clamp(130px, 9.375vw, 180px);
    width: 100%;
    display: flex;
    margin-right: clamp(20px, 1.5625vw, 30px)
}

@media(max-width: 700px) {
    .footer__logo {
        max-width: 220px
    }
}

.footer__bottom__right {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    justify-content: end
}

@media(max-width: 700px) {
    .footer__bottom__right {
        justify-content: start
    }
}

@media(max-width: 400px) {
    .footer__bottom__right {
        justify-content: start
    }
}

.footer__bottom__right ul {
    all: unset;
    list-style: none;
    display: flex;
    gap: clamp(10px, 1.0416666667vw, 20px);
    flex-wrap: wrap
}

.footer__bottom__right ul li,
.footer__bottom__right ul a {
    color: var(--grey);
    font-size: clamp(13px, 1.5vw, 15px);
    font-weight: 400;
    transition: .2s ease-in-out
}

.footer__bottom__right ul li a:hover,
.footer__bottom__right ul a a:hover {
    color: var(--primaryColor)
}

.footer__bottom__right a {
    color: var(--primaryColor);
    font-weight: 600
}

.footer__social {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(10px, 1.3020833333vw, 25px);
    margin-top: auto;
    justify-content: flex-end;
    align-items: center
}

.footer__social a {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    color: var(--primaryColor);
    border-radius: 50%;
    font-size: 15px;
    transition: .2s ease-in-out
}

.footer__social a:hover {
    color: var(--primaryColor)
}

.footer__social-label {
    display: flex;
    width: 100%
}

.footer__text {
    display: flex;
    flex-direction: column;
    font-size: clamp(16px, 1.8vw, 18px);
    font-weight: 400;
    font-family: var(--textFont);
    color: var(--black)
}

.footer__text b {
    font-weight: 600
}

.footer__text div {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    -moz-column-gap: 5px;
    column-gap: 5px
}

.footer__text div:has(a) span {
    font-weight: 600
}

.footer__text a {
    color: var(--black)
}

.footer__text a:hover {
    color: var(--blue)
}

.ham {
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    transition: transform 400ms;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    zoom: .6;
    display: none
}

@media(max-width: 850px) {
    .ham {
        display: flex
    }
}

.hamRotate.is-open {
    transform: rotate(45deg)
}

.hamRotate180.is-open {
    transform: rotate(180deg)
}

.line {
    fill: none;
    transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
    stroke: var(--black);
    stroke-width: 4.5;
    stroke-linecap: round
}

.ham1 .top {
    stroke-dasharray: 40 139
}

.ham1 .bottom {
    stroke-dasharray: 40 180
}

.ham1.is-open .top {
    stroke-dashoffset: -98px
}

.ham1.is-open .bottom {
    stroke-dashoffset: -138px
}

.ham2 .top {
    stroke-dasharray: 40 121
}

.ham2 .bottom {
    stroke-dasharray: 40 121
}

.ham2.is-open .top {
    stroke-dashoffset: -102px
}

.ham2.is-open .bottom {
    stroke-dashoffset: -102px
}

.ham3 .top {
    stroke-dasharray: 40 130
}

.ham3 .middle {
    stroke-dasharray: 40 140
}

.ham3 .bottom {
    stroke-dasharray: 40 205
}

.ham3.is-open .top {
    stroke-dasharray: 75 130;
    stroke-dashoffset: -63px
}

.ham3.is-open .middle {
    stroke-dashoffset: -102px
}

.ham3.is-open .bottom {
    stroke-dasharray: 110 205;
    stroke-dashoffset: -86px
}

.ham4 .top {
    stroke-dasharray: 40 121
}

.ham4 .bottom {
    stroke-dasharray: 40 121
}

.ham4.is-open .top {
    stroke-dashoffset: -68px
}

.ham4.is-open .bottom {
    stroke-dashoffset: -68px
}

.ham5 .top {
    stroke-dasharray: 40 82
}

.ham5 .bottom {
    stroke-dasharray: 40 82
}

.ham5.is-open .top {
    stroke-dasharray: 14 82;
    stroke-dashoffset: -72px
}

.ham5.is-open .bottom {
    stroke-dasharray: 14 82;
    stroke-dashoffset: -72px
}

.ham6 .top {
    stroke-dasharray: 40 172
}

.ham6 .middle {
    stroke-dasharray: 40 111
}

.ham6 .bottom {
    stroke-dasharray: 40 172
}

.ham6.is-open .top {
    stroke-dashoffset: -132px
}

.ham6.is-open .middle {
    stroke-dashoffset: -71px
}

.ham6.is-open .bottom {
    stroke-dashoffset: -132px
}

.ham7 .top {
    stroke-dasharray: 40 82
}

.ham7 .middle {
    stroke-dasharray: 40 111
}

.ham7 .bottom {
    stroke-dasharray: 40 161
}

.ham7.is-open .top {
    stroke-dasharray: 17 82;
    stroke-dashoffset: -62px
}

.ham7.is-open .middle {
    stroke-dashoffset: 23px
}

.ham7.is-open .bottom {
    stroke-dashoffset: -83px
}

.ham8 .top {
    stroke-dasharray: 40 160
}

.ham8 .middle {
    stroke-dasharray: 40 142;
    transform-origin: 50%;
    transition: transform 400ms
}

.ham8 .bottom {
    stroke-dasharray: 40 85;
    transform-origin: 50%;
    transition: transform 400ms, stroke-dashoffset 400ms
}

.ham8.is-open .top {
    stroke-dashoffset: -64px
}

.ham8.is-open .middle {
    transform: rotate(90deg)
}

.ham8.is-open .bottom {
    stroke-dashoffset: -64px
}

.hero {
    display: flex;
    gap: clamp(20px, 10.4166666667vw, 200px);
    margin-top: clamp(20px, 3.125vw, 60px);
    margin-bottom: clamp(20px, 4.1666666667vw, 80px)
}

@media(max-width: 960px) {
    .hero {
        flex-direction: column;
        gap: 20px
    }
}

.hero__content {
    display: flex;
    gap: clamp(10px, 1.5625vw, 30px);
    flex-direction: column;
    flex: 1
}

.hero__title {
    font-size: clamp(18px, 5.5vw, 55px);
    margin-top: 0;
    margin-bottom: 0;
}

.hero__text {
    line-height: 1.6
}

.hero__image {
    aspect-ratio: 750/300;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    max-width: clamp(500px, 39.0625vw, 750px);
    width: 100%;
    align-items: end;
    padding: clamp(20px, 2.0833333333vw, 40px);
    display: flex
}

.hero__image img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0
}

.hero__image .search-container {
    width: 100%;
    margin: 0;
    padding-left: 0;
    padding-right: 0
}

.home-assortiment__wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 3.125vw, 60px)
}

@media(hover: none) {
    .home-assortiment__wrapper {
        overflow: hidden
    }
}

.home-assortiment__wrapper:has(+.home-assortiment__wrapper)::before {
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.home-assortiment__wrapper:has(+.home-assortiment__wrapper)+.home-assortiment__wrapper::before {
    border-top: 1px dashed rgba(199, 11, 69, .2509803922);
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.home-assortiment__wrapper::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 60px);
    height: 100%;
    background: #fef4f5;
    border-radius: 8px;
    z-index: -1
}

@media(max-width: 1620px) {
    .home-assortiment__wrapper::before {
        width: 100%
    }
}

.home-assortiment__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center
}

@media(max-width: 500px) {
    .home-assortiment__top {
        flex-wrap: wrap
    }
}

.home-assortiment__top .btn .icon,
.home-assortiment__top .btn .sendmethod {
    font-size: 22px
}

@media(hover: none) {
    .home-slider-wrapper {
        overflow: hidden
    }
}

.home-slider {
    overflow: inherit !important
}

.home-slide {
    display: flex;
    overflow: hidden;
    border-radius: 8px
}

@media(max-width: 600px) {
    .home-slide {
        flex-direction: column
    }
}

.home-slide:nth-child(even) .home-slide__content__wrapper {
    background-color: #eefbff
}

.home-slide:nth-child(even) .home-slide__content {
    border: 1px dashed #71b2c1
}

.home-slide:nth-child(even) .btn {
    color: #fff;
    background-color: var(--secondaryColor)
}

.home-slide:nth-child(even) .home-slide__content__title {
    color: var(--secondaryColor)
}

.home-slide:nth-child(even) .home-slide__content__text {
    color: #71b2c1
}

.home-slide__content__wrapper {
    background-color: #f5949a;
    max-width: 40%;
    padding: clamp(10px, 1.0416666667vw, 20px);
    width: 100%
}

@media(max-width: 650px) {
    .home-slide__content__wrapper {
        max-width: 50%
    }
}

@media(max-width: 600px) {
    .home-slide__content__wrapper {
        max-width: 100%
    }
}

.home-slide__content {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: column;
    border: 1px dashed #fff;
    height: 100%;
    border-radius: 8px
}

.home-slide__content__title {
    font-size: clamp(18px, 4vw, 40px)
}

.home-slide__content__wraps {
    max-width: 470px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    gap: clamp(10px, 2.0833333333vw, 40px);
    padding: clamp(10px, 1.0416666667vw, 20px)
}

.home-slide__content__text {
    color: #fff
}

.home-slide__image {
    aspect-ratio: 900/560;
    width: 100%;
    max-width: 60%;
    position: relative
}

@media(max-width: 650px) {
    .home-slide__image {
        max-width: 50%
    }
}

@media(max-width: 600px) {
    .home-slide__image {
        max-width: 100%
    }
}

.home-slide__image img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    width: 100%;
    height: 100%
}

/* Home Slider uses gallery-buttons styles */

.image-cols__wrapper:has(+.newsletter) .image-cols {
    padding-bottom: clamp(20px, 5.2083333333vw, 100px);
    border-bottom: 1px dashed rgba(199, 11, 69, .2509803922)
}

.image-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(20px, 2.8645833333vw, 55px)
}

@media(max-width: 850px) {
    .image-cols {
        grid-template-columns: repeat(2, 1fr);
        justify-content: center;
        align-items: stretch;
        align-content: center
    }
}

@media(max-width: 750px) {
    .image-cols {
        flex-direction: column;
        gap: 20px
    }
}

@media(max-width: 600px) {
    .image-cols {
        grid-template-columns: repeat(1, 1fr)
    }
}

.image-col {
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 1.5625vw, 30px)
}

.image-col__image {
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    aspect-ratio: 465/200
}

.image-col__image img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    width: 100%;
    height: 100%
}

.image-col__content {
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 1.3020833333vw, 25px);
    flex: 1 1 auto
}

.image-col__title {
    line-height: 1.5
}

.image-col__text {
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    font-family: var(--textFont);
    line-height: 1.75
}

.image-col .btn {
    margin-top: auto
}

.imagebig {
    display: flex;
    max-width: calc(100% - 60px);
    margin: 0 auto;
    border-radius: 8px;
    overflow: hidden;
    margin-top: clamp(20px, 4.6875vw, 90px);
    margin-bottom: clamp(20px, 4.6875vw, 90px)
}

.imagebig>div {
    width: 50%
}

@media(max-width: 700px) {
    .imagebig {
        flex-direction: column;
        max-width: calc(100% - 40px)
    }

    .imagebig>div {
        width: 100%
    }
}

.imagebig__content__wrapper {
    background-color: var(--redlightbg);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    align-content: center;
    box-sizing: border-box;
    padding-top: clamp(20px, 4.6875vw, 90px);
    padding-bottom: clamp(20px, 4.6875vw, 90px)
}

.imagebig__content__gallery {
    aspect-ratio: 930/800
}

.imagebig__content__gallery.swiper {
    background-color: var(--redlightbg);
    box-sizing: border-box;
    padding-top: clamp(20px, 4.6875vw, 90px);
    padding-bottom: clamp(20px, 4.6875vw, 90px)
}

.imagebig__content {
    display: flex;
    justify-content: flex-start;
    align-items: start;
    align-content: center;
    flex-direction: column;
    max-width: 520px;
    padding: 0 20px;
    gap: clamp(10px, 1.5625vw, 30px)
}

@media(max-width: 700px) {
    .imagebig__content {
        max-width: 100%
    }
}

@media(max-width: 700px) {
    .imagebig__content__gallery {
        aspect-ratio: 2/1
    }
}

.imagebig__content__gallery .swiper-slide {
    position: relative
}

.imagebig__content__gallery .swiper-slide img {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    position: absolute;
    height: 100%;
    -o-object-position: center center;
    object-position: center center
}

.imagebig__text {
    line-height: 1.7
}

.imagebig__text a {
    color: var(--primaryColor);
    text-decoration: underline
}

.galleryimage-buttons {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    display: none;
    flex-direction: column;
    gap: 10px;
    z-index: 11
}

.infobenefits {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

@media(max-width: 1100px) {
    .infobenefits>div {
        max-width: 50%;
        width: 100%
    }
}

@media(max-width: 960px) {
    .infobenefits {
        gap: clamp(20px, 2.6041666667vw, 50px)
    }
}

@media(max-width: 800px) {
    .infobenefits {
        flex-direction: column
    }

    .infobenefits>div {
        width: 100%;
        max-width: 100%
    }
}

.infobenefits__content {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 2.0833333333vw, 40px);
    margin-right: clamp(20px, 5.2083333333vw, 100px);
    flex: 1;
    max-width: 576px
}

@media(max-width: 960px) {
    .infobenefits__content {
        margin-right: 0
    }
}

.infobenefits__text {
    line-height: 1.77;
    font-size: clamp(15px, 1.8vw, 18px)
}

.infobenefits__usps {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: clamp(20px, 5.2083333333vw, 100px);
    border-left: 1px dashed rgba(113, 178, 193, .3019607843);
    max-width: 715px
}

@media(max-width: 960px) {
    .infobenefits__usps {
        border-left: 0;
        padding-left: 0
    }
}

.infobenefits__usp {
    display: flex;
    gap: clamp(10px, 0.9375vw, 18px);
    display: flex;
    justify-content: start;
    align-items: center;
    background-color: #f6fafb;
    align-content: center;
    color: #336a77;
    padding: clamp(8px, 0.7291666667vw, 14px) clamp(10px, 1.0416666667vw, 20px);
    border-radius: 5px
}

.infobenefits__usp .icon,
.infobenefits__usp .sendmethod {
    font-size: clamp(12px, 1.5vw, 15px)
}

.lang-switch {
    display: flex;
    flex-direction: column;
    gap: 5px;
    position: relative;
    border-radius: 3px;
    transition: .2s;
    background: #fff;
    padding-right: 10px;
    color: var(--secondaryColor);
    box-shadow: 0px 1px 1px rgba(113, 178, 193, .3019607843)
}

.lang-switch--topbar .lang-switch__list {
    top: calc(100% + 1px);
    bottom: auto
}

.lang-switch a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    color: inherit;
    font-family: var(--Roboto);
    font-size: 11px;
    font-weight: var(--bold)
}

.lang-switch .lang-switch__flag {
    border-radius: 100%;
    width: 17px;
    height: 17px;
    overflow: hidden;
    margin-top: -1px
}

.lang-switch .lang-switch__flag img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center
}

.lang-switch__list {
    overflow: hidden;
    position: absolute;
    bottom: calc(100% + 1px);
    left: -1px;
    right: -1px;
    padding-block: 5px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0px 6px 5px rgba(11, 28, 74, .031372549);
    z-index: 11;
    border: 1px solid rgba(0, 0, 0, 0);
    border-bottom: none;
    transition: .2s;
    opacity: 0;
    pointer-events: none;
    transform: translateY(5px)
}

.lang-switch:focus .lang-switch__list,
.lang-switch:focus-within .lang-switch__list,
.lang-switch:hover .lang-switch__list {
    opacity: 1;
    pointer-events: all;
    transform: translateY(0)
}

.lang-switch__current {
    padding-block: 3px;
    display: flex;
    align-items: center
}

.lang-switch__current .icon,
.lang-switch__current .sendmethod {
    font-size: 10px;
    transform: rotate(90deg)
}

.lang-switch__current a {
    pointer-events: none;
    padding-right: 7px
}

.maps {
    height: 500px
}

.maps__marker {
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

.maps__marker-inner {
    position: absolute;
    bottom: 20px;
    border-radius: 3px;
    transform: translateX(-50%);
    padding: 20px 25px;
    background: #fff;
    box-shadow: 0px 5px 20px 0px rgba(0, 23, 42, .06);
    z-index: 0
}

.maps__marker-inner::before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    top: 100%;
    left: calc(50% - 10px);
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #fff rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    box-shadow: 0px 5px 20px 0px rgba(0, 23, 42, .06)
}

.maps__marker-inner img {
    width: 192px;
    display: block
}

.hamburger {
    display: inline-flex;
    width: clamp(18px, 1.09375vw, 21px);
    height: clamp(14px, 0.8333333333vw, 16px);
    position: relative;
    cursor: pointer;
    top: 1px
}

.hamburger span {
    display: block;
    position: absolute;
    height: 15%;
    width: 100%;
    background: var(--primaryColor);
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out
}

.hamburger span:nth-child(1) {
    top: 0
}

.hamburger span:nth-child(2),
.hamburger span:nth-child(3) {
    top: 40%
}

.hamburger span:nth-child(4) {
    top: 80%
}

.topbar__mobile.is-open .hamburger span:nth-child(1),
.topbar__mobile.is-open .hamburger span:nth-child(4) {
    top: 50%;
    width: 0;
    left: 50%;
    opacity: 0
}

.topbar__mobile.is-open .hamburger span:nth-child(2) {
    transform: rotate(45deg)
}

.topbar__mobile.is-open .hamburger span:nth-child(3) {
    transform: rotate(-45deg)
}

.topbar__mobile {
    display: none;
    font-size: clamp(16px, 1.8vw, 18px);
    color: var(--textColor);
    font-weight: var(--regular);
    gap: clamp(20px, 0.5208333333vw, 10px);
    cursor: pointer;
    height: clamp(20px, 4.1666666667vw, 80px);
    left: clamp(20px, 1.0416666667vw, 20px);
    top: 0;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 104
}

@media(max-width: 500px) {
    .topbar__mobile>span {
        display: none
    }
}

@media(max-width: 1150px) {
    .topbar__mobile {
        display: flex
    }
}

.mobile--phone {
    margin: clamp(20px, 1.0416666667vw, 20px) 0
}

.mobile-menu {
    width: 320px;
    background-color: #fff;
    position: fixed;
    right: -320px;
    height: 100%;
    opacity: 0;
    top: 0;
    transition: .2s ease-in-out;
    z-index: 111111;
    overflow-y: scroll;
    overflow-x: hidden
}

.mobile-menu .ham {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 111
}

.mobile-menu .lang-switch {
    margin-top: auto;
    background: var(--bluelightbg);
    box-shadow: none
}

.mobile-menu.is-open {
    right: 0;
    opacity: 1
}

.mobile-menu.is-open+.mobile-menu--gradient {
    opacity: 1;
    pointer-events: all
}

.mobile-menu--slide {
    padding: 90px 30px 50px 36px;
    position: absolute;
    width: 100%;
    height: 100%
}

.mobile-menu__submain {
    position: absolute;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: .3s ease-in-out;
    transform: translateX(100%)
}

.mobile-menu__submain.is-active {
    transform: translateX(0)
}

.mobile-menu__submain.is-active-left {
    transform: translateX(-100%)
}

.mobile-menu__submain.is-active-left.is-active {
    transform: translateX(0)
}

.mobile-menu__main {
    display: flex;
    flex-direction: column
}

.mobile-menu__items {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.mobile-menu__item {
    color: var(--textColor);
    font-size: clamp(20px, 2.2vw, 22px);
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--titleFont)
}

.mobile-menu__item .icon,
.mobile-menu__item .sendmethod {
    font-size: 12px
}

.mobile--logo {
    padding-top: clamp(20px, 2.0833333333vw, 40px);
    margin-top: 40px;
    margin-bottom: 20px;
    position: relative
}

.mobile--logo::before {
    content: "";
    border-top: 1px dashed rgba(199, 11, 69, 0.2509803922);
    top: 0;
    width: 320px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    position: absolute
}

.topbar__socials {
    display: flex;
    gap: clamp(20px, 0.5208333333vw, 10px);
    margin-top: 0;
    justify-content: center;
    align-items: center;
    align-content: center
}

.topbar__socials a {
    background-color: var(--secondaryBgColor);
    color: var(--primaryColor);
    width: clamp(20px, 2.34375vw, 45px);
    height: clamp(20px, 2.34375vw, 45px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border-radius: 50%
}

.mobile-menu__item__back {
    display: flex;
    justify-content: normal;
    font-size: clamp(16px, 2vw, 20px);
    margin-bottom: clamp(20px, 1.5625vw, 30px)
}

.mobile-menu__item__back span {
    transform: rotate(-180deg) !important;
    margin-right: clamp(20px, 1.0416666667vw, 20px);
    font-size: clamp(11px, 1.1vw, 11px) !important
}

.mobile-menu__item--small {
    font-size: clamp(16px, 1.8vw, 18px);
    color: var(--primaryColor);
    font-weight: 400;
    font-family: var(--textFont)
}

.mobile-menu__item--title {
    margin-bottom: clamp(20px, 1.0416666667vw, 20px);
    font-size: clamp(26px, 3vw, 30px);
    font-weight: 500
}

.mobile-menu--gradient {
    background: rgba(18, 18, 18, .36);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    z-index: 102;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
    transition: .2s ease-in-out
}

.newsletter__wrapper {
    display: flex;
    background-color: var(--redlightbg);
    border-radius: 8px;
    padding-top: clamp(20px, 4.1666666667vw, 80px);
    padding-bottom: clamp(20px, 4.1666666667vw, 80px);
    padding-left: clamp(20px, 4.1666666667vw, 80px);
    padding-right: clamp(20px, 4.1666666667vw, 80px);
    justify-content: center;
    align-items: center;
    align-content: center
}

@media(max-width: 600px) {
    .newsletter__wrapper {
        flex-direction: column;
        gap: 20px;
        align-items: start
    }
}

.newsletter__left {
    padding-right: clamp(20px, 4.1666666667vw, 80px);
    border-right: 1px dashed rgba(199, 11, 69, 0.2509803922);
    margin-right: clamp(20px, 4.1666666667vw, 80px);
    max-width: 550px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 0.6770833333vw, 13px)
}

@media(max-width: 600px) {
    .newsletter__left {
        padding-right: 0;
        border-right: none;
        margin-right: 0
    }
}

.newsletter__form {
    max-width: 410px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 0.6770833333vw, 13px)
}

.newsletter__form input {
    width: 100%
}

.pagination-holder {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    align-content: center
}

.pagination-holder+.usps,
#product-list+div {
    margin: 0;
    margin-top: clamp(20px, 5.2083333333vw, 100px);
    padding-top: clamp(20px, 5.2083333333vw, 100px);
    margin-bottom: clamp(20px, 5.2083333333vw, 100px);
    border-top: 1px dashed var(--primaryColor)
}

@media(max-width: 700px) {
    .pagination-holder {
        flex-direction: column;
        display: flex;
        gap: 20px
    }
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(5px, 0.5208333333vw, 10px)
}

.toolbar-results {
    font-size: clamp(14px, 1.6vw, 16px)
}

.toolbar-results span {
    color: var(--primaryColor);
    font-weight: 500
}


.pagination__prev {
    rotate: 180deg
}

.pagination__prev,
.pagination__next {
    background-color: var(--redlightbg);
    border: 1px solid var(--redlightbg) !important;
    font-size: 14px
}

.pagination__prev:hover,
.pagination__next:hover {
    color: #fff;
    background-color: var(--primaryColor)
}

.pagination__block {
    transition: .2s ease-in-out;
    aspect-ratio: 1/1;
    width: clamp(40px, 2.5vw, 48px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    color: var(--primaryColor);
    transition: .2s ease-in-out;
    font-weight: 500;
    font-family: var(--titleFont);
    border: 1px solid #e5e8f0;
    border-radius: 5px
}

.pagination__block:hover {
    border: 1px solid var(--primaryColor) !important
}

.pagination__block.is-active {
    color: #fff !important;
    background-color: var(--primaryColor) !important;
    border: 1px solid var(--primaryColor) !important
}

.pagination__block.is-active:hover {
    color: #fff !important
}

.pagination__inner {
    display: flex;
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 500;
    gap: clamp(5px, 0.5208333333vw, 10px);
    align-items: center
}

.pagination__inner a {
    color: var(--primaryColor);
    transition: .2s ease-in-out
}

.pagination__inner a:hover {
    color: var(--primaryColor)
}

.path {
    display: flex;
    align-items: center;
    align-content: center;
    gap: 25px;
    row-gap: 10px;
    flex-wrap: wrap;
    overflow: hidden
}

.path__back {
    color: var(--primaryColor);
    font-weight: 500;
    font-size: clamp(16px, 1.6vw, 16px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 0.78125vw, 15px)
}

.path__back:hover span {
    background-color: var(--primaryColor);
    border-color: var(--primaryColor);
    color: #fff
}

.path__back span {
    transition: .2s ease-in-out;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    font-size: clamp(9px, 1.1vw, 11px);
    border-radius: 5px;
    width: clamp(30px, 2.0833333333vw, 40px);
    border: 1px solid #e9d8da
}

.path__back span::before {
    transform: rotate(180deg)
}

.path__item {
    color: var(--black);
    font-size: clamp(16px, 1.6vw, 16px);
    position: relative
}

.path__item::before {
    content: "";
    position: absolute;
    left: -12.5px;
    top: 50%;
    transform: translateY(-50%);
    height: 3px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: #e9d8da
}

.popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 10001;
    opacity: 0;
    pointer-events: none;
    transition: .2s ease-in-out
}

.popup.active {
    opacity: 1;
    pointer-events: all
}

.popup--login .popup-content {
    max-width: 500px
}

.popup-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: clamp(20px, 2.0833333333vw, 40px);
    border-radius: 5px;
    max-width: 640px;
    width: 90%;
    flex-direction: column;
    display: flex;
    gap: clamp(20px, 1.5625vw, 30px)
}

.close-popup {
    position: absolute;
    top: clamp(10px, 1.0416666667vw, 20px);
    right: clamp(10px, 1.0416666667vw, 20px);
    cursor: pointer;
    display: flex;
    color: var(--primaryColor);
    font-size: clamp(10px, 1.2vw, 12px);
    max-width: clamp(25px, 1.8229166667vw, 35px);
    width: 100%;
    aspect-ratio: 1/1;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    box-shadow: 0px 2px 2px rgba(37, 37, 37, .1019607843);
    border-radius: 50%
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 1.0416666667vw, 20px)
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.form-footer {
    display: flex;
    justify-content: start;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 1.0416666667vw, 20px);
    margin-top: clamp(0px, 0.5208333333vw, 10px)
}

.form-footer a {
    color: vaR(--primaryColor)
}

.popup-content__cart {
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: start;
    align-items: start
}

.popup-content__cart .stockstatus {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px 0
}

.popup-content__cart .stockstatus__info {
    font-size: clamp(14px, 1.6vw, 16px)
}

.popupextra {
    max-width: 910px;
    display: flex;
    position: fixed;
    top: 100px;
    right: 10px;
    padding: clamp(20px, 2.0833333333vw, 40px);
    overflow: hidden;
    transition: .4s ease-in-out;
    width: 100%;
    z-index: 1111111;
    background-color: #fff;
    box-shadow: 0px 4px 3px rgba(37, 37, 37, .1019607843);
    overflow: hidden;
    opacity: 0;
    pointer-events: none
}

.popupextra.is-active {
    pointer-events: all;
    opacity: 1
}

.popupextra .swiper-container {
    position: relative
}

@media(max-width: 1000px) {
    .popupextra {
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        top: auto;
        right: auto;
        padding: clamp(20px, 1.0416666667vw, 20px);
        max-width: calc(100% - 20px);
        width: 100%;
        display: flex;
        flex-direction: column
    }
}

.popupextra__content {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 1.5625vw, 30px);
    max-width: 100%
}

.card-small {
    display: flex;
    flex-direction: column
}

.card-small__image {
    aspect-ratio: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

.card-small__image img {
    -o-object-fit: contain;
    object-fit: contain;
    width: auto !important
}

.card-small__title {
    display: flex;
    flex-direction: column;
    margin-top: 10px;
    margin-bottom: 5px
}

.card-small__content {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap
}

.card-small__content__right {
    display: flex;
    justify-content: end;
    align-items: end;
    align-content: end
}

.card-small__content__right .btn {
    background-color: var(--green);
    padding: 8px 10px;
    min-height: auto
}

.card-small__content__price {
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 500;
    color: var(--primaryColor)
}

.card-small__content__price .strikethrough {
    color: var(--black);
    font-weight: 400;
    text-decoration: line-through
}

.product__details {
    padding-left: clamp(20px, 4.6875vw, 90px);
    display: flex;
    gap: clamp(20px, 3.125vw, 60px)
}

@media(max-width: 1200px) {
    .product__details {
        padding-left: 0
    }
}

@media(max-width: 1200px) {
    .product__details>div {
        max-width: 50%
    }
}

@media(max-width: 700px) {
    .product__details>div {
        max-width: 100%
    }
}

@media(max-width: 700px) {
    .product__details {
        flex-direction: column
    }
}

.product__detail__content {
    max-width: 650px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: clamp(40px, 3.90625vw, 75px)
}

.product__detail__block {
    display: flex;
    flex-direction: column;
    gap: clamp(15px, 1.3020833333vw, 25px);
    position: relative
}

.product__detail__block:first-child::before {
    display: none
}

.product__detail__block::before {
    content: "";
    border-top: 1px dashed rgba(199, 11, 69, .2509803922);
    top: calc(-1*clamp(20px, 1.953125vw, 37.5px));
    width: 100%;
    position: absolute
}

.product__details__content p {
    line-height: 1.7
}

.product__details__content p a {
    color: var(--primaryColor);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    transition: .2s ease-in-out
}

.product__details__content p a:hover {
    color: var(--secondaryColor)
}

.product__details__extra {
    flex: 1;
    max-width: 560px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 2.0833333333vw, 40px);
    container-type: inline-size;
    container-name: related-section
}

.related {
    display: flex;
    gap: clamp(10px, 1.40625vw, 27px);
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: column
}

.related__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 1.0416666667vw, 20px);
    flex-wrap: wrap;
    width: 100%
}

.related__top__btn {
    gap: clamp(5px, 0.5208333333vw, 10px)
}

.related__top__btn .icon,
.related__top__btn .sendmethod {
    font-size: 10px;
    transform: rotate(90deg)
}

.related__items {
    width: 100%;
    overflow: hidden;
    --width: 70px;
    --gap: 9px;
    --gapY: var(--gap);
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--width, 100%)), 1fr));
    gap: var(--gapY) var(--gap);
    max-height: 75px
}

.related__items.expanded {
    max-height: 10000px
}

@media(max-width: 400px) {
    .related__items {
        overflow: inherit !important
    }
}

.related__usps {
    display: flex;
    gap: clamp(20px, 3.125vw, 60px);
    flex-wrap: wrap;
    background-color: #f6fafb;
    padding: clamp(20px, 2.0833333333vw, 40px) clamp(20px, 2.34375vw, 45px);
    border-radius: 8px;
    row-gap: clamp(10px, 1.3020833333vw, 25px)
}

@container related-section (max-width: 400px) {
    .related__usps {
        flex-direction: column
    }
}

.related__usps>div {
    max-width: calc(50% - 30px);
    font-size: clamp(13px, 1.5vw, 15px);
    justify-content: start
}

@container related-section (max-width: 400px) {
    .related__usps>div {
        max-width: 100%
    }
}

.related__usps>div svg * {
    fill: #336a77
}

.product__details__icons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.product__details__icon {
    border-radius: 4px;
    max-width: clamp(40px, 2.8645833333vw, 55px);
    width: 100%;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.product__details__icon svg {
    max-width: 40px
}

.product-grid {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 5px
}

@media(max-width: 768px) {
    .product-grid {
        grid-template-columns: 1fr
    }
}

.grid-btgr-item:nth-child(odd) {
    font-weight: var(--medium)
}

.grid-btgr-item:nth-last-child(-n+2) {
    border-bottom: none
}

.productfilters__wrapper {
    background-color: #fef4f5;
    padding: clamp(20px, 2.0833333333vw, 40px);
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(5, 1fr)
}

@media(max-width: 880px) {
    .productfilters__wrapper {
        grid-template-columns: repeat(4, 1fr)
    }
}

@media(max-width: 650px) {
    .productfilters__wrapper {
        display: none
    }
}

.products {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 2.6041666667vw, 50px)
}

.products__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap
}

@media(max-width: 550px) {
    .products__top {
        flex-direction: column;
        gap: 20px
    }
}

.products__top__left {
    display: flex;
    gap: clamp(10px, 1.3020833333vw, 25px);
    align-items: end;
    align-content: center;
    flex-wrap: wrap
}

@media(max-width: 400px) {
    .products__top__left {
        align-items: center;
        flex-direction: column
    }
}

.products__results {
    font-size: clamp(14px, 1.6vw, 16px)
}

.products__results span {
    color: var(--primaryColor);
    font-weight: 500
}

.products__filters {
    display: flex;
    gap: 10px
}

.products__filter {
    display: flex;
    gap: 5px;
    color: var(--primaryColor);
    padding: 5px 12px;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, 0);
    justify-content: center;
    align-items: center;
    align-content: center;
    font-weight: 500;
    font-family: var(--titleFont);
    font-size: clamp(12px, 1.5vw, 15px);
    background-color: rgba(0, 0, 0, 0);
    transition: .2s ease-in-out
}

.products__filter .icon,
.products__filter .sendmethod {
    font-size: 11px
}

.products__filter:hover {
    background-color: var(--redlightbg)
}

.products__items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: clamp(15px, 1.5625vw, 30px);
    width: 100%
}

@media(max-width: 600px) {
    .products__items {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        row-gap: 30px
    }
}

.products__catalog {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: clamp(15px, 1.5625vw, 30px);
    row-gap: clamp(30px, 2.6041666667vw, 50px);
    width: 100%
}

@media(max-width: 600px) {
    .products__catalog {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        row-gap: 30px
    }
}

.products__catalog .block__image {
    max-width: 2000px
}

.productslider {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 2.6041666667vw, 50px)
}

@media(hover: none) {
    .productslider {
        overflow: hidden
    }
}

.productslider__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    gap: 10px
}

.productslider__top .btn {
    padding: clamp(7px, 0.5208333333vw, 10px) clamp(10px, 1.0416666667vw, 20px)
}

.productslider__top .btn .icon,
.productslider__top .btn .sendmethod {
    font-size: 20px
}

.productdetail+.productslider {
    margin: 0 !important;
    padding-top: clamp(25px, 4.6875vw, 90px);
    margin-bottom: clamp(25px, 5.2083333333vw, 100px) !important;
    border-top: 1px dashed rgba(199, 11, 69, 0.2509803922)
}

@media(max-width: 400px) {
    .productdetail {
        overflow: hidden
    }
}

.product__main {
    display: flex;
    gap: clamp(20px, 3.125vw, 60px)
}

@media(max-width: 850px) {
    .product__main {
        flex-direction: column
    }

    .product__main>div {
        max-width: 100%;
        width: 100%
    }
}

.product__images {
    display: flex;
    gap: 10px;
    max-width: 740px;
    width: 100%;
    flex: 1;
    align-self: start;
    overflow: hidden
}

.product__images>.swiper {
    overflow: initial
}


.product__gallerythumbs {
    flex: 1;
    max-width: clamp(60px, 4.1666666667vw, 80px) !important
}

.product__gallerythumbs .swiper-slide {
    max-height: 80px;
    border: 2px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    aspect-ratio: 1/1
}

.product__gallerythumbs .swiper-slide.swiper-slide-thumb-active {
    border: 2px solid var(--primaryColor)
}

.product__gallerythumbs img {
    border-radius: 5px
}

.product__gallery {
    max-width: 650px;
    flex: 1;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    overflow: hidden !important
}

@media(max-width: 400px) {
    .product__gallery {
        overflow: inherit
    }
}

.product__gallery img {
    width: 100%;
    height: 100%
}

.product__gallery__buttons {
    position: absolute;
    bottom: clamp(10px, 1.0416666667vw, 20px);
    right: clamp(10px, 1.0416666667vw, 20px);
    display: flex;
    gap: 10px;
    z-index: 11;
    flex-direction: row
}

.product__gallery__buttons .arrow-button--prev .icon,
.product__gallery__buttons .arrow-button--prev .sendmethod {
    transform: rotate(180deg)
}

.product__gallery__buttons .arrow-button--next .icon,
.product__gallery__buttons .arrow-button--next .sendmethod {
    transform: rotate(-180deg)
}

.product__labels {
    position: absolute;
    top: clamp(10px, 1.0416666667vw, 20px);
    left: clamp(10px, 1.0416666667vw, 20px);
    z-index: 11;
    display: flex;
    gap: clamp(5px, 0.5208333333vw, 10px)
}

.product__favorite {
    position: absolute;
    top: clamp(10px, 1.0416666667vw, 20px);
    right: clamp(10px, 1.0416666667vw, 20px);
    z-index: 11
}

.product__gallerythumbs {
    max-width: 80px;
    width: 100%
}

@media(max-width: 400px) {
    .product__gallerythumbs {
        display: none
    }
}

.product__content {
    max-width: 560px;
    width: 100%
}

@media(max-width: 500px) {
    .product__content .btn--winkelwagen {
        width: 100%
    }
}

@media(max-width: 1200px) {
    .product__content {
        max-width: 50%
    }
}

.product__content .stockstatus {
    display: flex;
    font-size: clamp(13px, 1.6vw, 16px);
    gap: clamp(5px, 0.5208333333vw, 10px);
    margin-top: clamp(15px, 1.3020833333vw, 25px);
    margin-bottom: clamp(20px, 1.8229166667vw, 35px);
    flex-wrap: wrap
}

.product__content__titles {
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 1.5625vw, 30px);
    margin-bottom: clamp(20px, 1.5625vw, 30px);
    padding-bottom: clamp(20px, 1.5625vw, 30px);
    border-bottom: 1px dashed rgba(113, 178, 193, .3019607843)
}

.product__content__title {
    font-size: clamp(20px, 4vw, 40px)
}

.product__content__pricewrapper {
    display: flex;
    gap: clamp(10px, 1.0416666667vw, 20px);
    justify-content: space-between;
    align-items: center;
    align-content: center;
    margin-bottom: clamp(15px, 1.5625vw, 30px);
    flex-wrap: wrap
}

.product__price {
    display: flex;
    gap: clamp(5px, 0.625vw, 12px);
    justify-content: center;
    align-items: center;
    align-content: center
}

.product__price .strikethrough {
    text-decoration: line-through
}

.product__price .final-price span.price {
    font-size: clamp(18px, 2.8vw, 28px);
    color: var(--primaryColor);
    font-weight: var(--bold);
    font-family: var(--titleFont)
}

.size-selector {
    padding: clamp(15px, 1.3020833333vw, 25px) clamp(15px, 1.5625vw, 30px);
    background-color: #fef4f5;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    gap: clamp(15px, 1.0416666667vw, 20px);
    margin-bottom: clamp(15px, 1.5625vw, 30px);
}

.size-selector__title {
    font-size: clamp(15px, 1.8vw, 18px);
    font-weight: 500;
    color: var(--primaryColor);
    font-family: var(--titleFont)
}

.size-selector__sizes {
    display: flex;
    gap: clamp(5px, 0.5208333333vw, 10px);
    flex-wrap: wrap
}

.size-selector__size {
    background-color: #fff;
    padding: clamp(7px, 0.5208333333vw, 10px) clamp(10px, 0.8854166667vw, 17px);
    border-radius: 5px;
    border: 1px solid #e9d8da;
    font-size: clamp(14px, 1.6vw, 16px);
    transition: .2s ease-in-out;
    outline: 1px solid rgba(0, 0, 0, 0);
    cursor: pointer;
    color: var(--black)
}

.size-selector__size:hover,
.size-selector__size.selected,
.size-selector__size:focus {
    outline: 1px solid var(--primaryColor);
    border: 1px solid var(--primaryColor);
    color: var(--primaryColor)
}

.size-selector__customsize {
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 1.0416666667vw, 20px)
}

.size-selector__customsize label {
    font-size: clamp(15px, 1.8vw, 18px);
    font-weight: 500;
    color: var(--primaryColor);
    font-family: var(--titleFont)
}

.btn--winkelwagen {
    padding: clamp(7px, 0.5208333333vw, 10px) clamp(10px, 2.0833333333vw, 40px)
}


.footer .back-stars {
    color: #feca0a
}

.footer .review-stars .icon,
.footer .review-stars .sendmethod {
    color: rgba(254, 202, 10, .4588235294);
    font-size: clamp(15px, 1.8vw, 18px)
}

.footer .back-stars .icon,
.footer .back-stars .sendmethod {
    color: rgba(254, 202, 10, .4509803922)
}

.ratings {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

.stars-wrapper {
    display: flex;
    align-items: center
}

.review-stars {
    position: relative;
    display: flex;
    justify-content: space-between;
    min-height: 20px
}

.review-stars .icon,
.review-stars .sendmethod {
    color: #c8e6ec;
    line-height: 1;
    margin-left: 5px;
    display: flex;
    font-size: clamp(10px, 1.5vw, 15px)
}

.review-stars .icon:first-child,
.review-stars .sendmethod:first-child {
    margin-left: 0
}

.back-stars {
    color: var(--secondaryColor);
    overflow: hidden;
    display: flex;
    transition: all .5s;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.back-stars .icon,
.back-stars .sendmethod {
    color: var(--secondaryColor)
}

.review__number {
    font-family: var(--textFont);
    font-size: clamp(13px, 1.5vw, 15px);
    font-weight: 700;
    color: var(--black);
    margin-left: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

.review__nummerviews {
    margin-left: 14px;
    font-family: var(--textFont);
    font-size: clamp(14px, 1.4vw, 14px);
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 1px;
    transition: .2s ease-in-out;
    min-height: 20px
}

.review__nummerviews:hover {
    color: var(--secondaryColor)
}

.search-container {
    max-width: 840px;
    margin: 0 auto;
    position: relative;
    padding-right: clamp(20px, 1.0416666667vw, 20px);
    padding-left: clamp(20px, 1.0416666667vw, 20px);
    margin-top: clamp(20px, 2.0833333333vw, 40px);
    margin-bottom: clamp(20px, 2.0833333333vw, 40px)
}

.search-wrapper {
    position: relative;
    display: flex;
    overflow: hidden;
    border-radius: 8px
}

.search-wrapper:has(+.show) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.search-wrapper:has(+.show) .search-input {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important
}

.search-input {
    flex: 1;
    border: none;
    padding: clamp(10px, 0.7291666667vw, 14px) clamp(15px, 1.0416666667vw, 20px);
    font-size: clamp(15px, 1.8vw, 18px) !important;
    background: rgba(0, 0, 0, 0);
    outline: none;
    border-radius: 8px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    color: var(--black);
    height: auto !important
}

.search-input::-moz-placeholder {
    color: var(--black) !important;
    opacity: 1
}

.search-input::placeholder {
    color: var(--black) !important;
    opacity: 1
}

.search-button {
    background: var(--black);
    border: none;
    padding: 16px 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    transition: background-color .2s;
    outline: 1px solid var(--black)
}

.search-button:hover {
    background: var(--black)
}

.search-icon {
    width: 20px;
    height: 20px;
    fill: #fff
}

.dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
    max-height: 300px;
    overflow-y: auto;
    z-index: 1000;
    display: none;
    max-width: 800px;
    margin: 0 auto
}

.dropdown.show {
    display: block
}

.dropdown-item {
    padding: clamp(6px, 0.625vw, 12px) clamp(10px, 1.0416666667vw, 20px);
    cursor: pointer;
    border-bottom: 1px solid rgba(205, 219, 227, .368627451);
    transition: background-color .2s
}

.dropdown-item:hover {
    background-color: #f8f8f8
}

.dropdown-item:last-child {
    border-bottom: none
}

.dropdown-item.highlighted {
    background-color: var(--bluelightbg)
}

.no-results {
    padding: 20px;
    text-align: center;
    color: var(--grey);
    font-style: italic
}

.select-controls {
    display: flex;
    gap: clamp(10px, 1.5625vw, 30px);
    align-items: center
}

@media(max-width: 700px) {
    .select-controls {
        flex-direction: column
    }
}

.custom-select {
    position: relative;
    display: inline-block
}

.select-trigger {
    background: rgba(0, 0, 0, 0);
    border: none;
    padding: 4px 0;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all .2s ease;
    outline: none
}

.select-label {
    color: vaR(--black);
    font-weight: 400;
    font-size: clamp(14px, 1.6vw, 16px)
}

.select-value {
    color: var(--primaryColor);
    font-weight: 500
}

.select-arrow {
    color: var(--primaryColor);
    font-size: 12px;
    transition: transform .2s ease, color .2s ease;
    margin-left: 2px;
    transform: rotate(90deg)
}

.select-options {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 150px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-5px);
    transition: all .15s ease;
    margin-top: 8px
}

.select-options.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

.select-option {
    padding: clamp(5px, 0.4166666667vw, 8px) clamp(8px, 0.8333333333vw, 16px);
    cursor: pointer;
    color: var(--black);
    transition: background-color .15s ease;
    white-space: nowrap
}

.select-option:first-child {
    border-radius: 4px 4px 0 0
}

.select-option:last-child {
    border-radius: 0 0 4px 4px
}

.select-option:hover {
    background-color: #f5f5f5
}

.select-option.active {
    background-color: var(--primaryColor);
    color: #fff
}

.select-option.active:hover {
    background-color: var(--primaryColor)
}

.text-image {
    display: flex;
    gap: clamp(20px, 5.2083333333vw, 100px);
    align-items: center;
    align-content: center;
    padding-left: clamp(20px, 5.2083333333vw, 100px)
}

@media(max-width: 800px) {
    .text-image {
        padding-left: 0
    }
}

@media(max-width: 680px) {
    .text-image {
        flex-direction: column
    }
}

.text {
    display: flex;
    flex-direction: column;
    gap: clamp(10px, 1.5625vw, 30px)
}

.text__text {
    display: flex;
    line-height: 1.77;
    font-family: var(--textFont);
    max-width: 577px;
    width: 100%
}

.gallery {
    max-width: 46%;
    border-radius: 8px;
    position: relative;
    aspect-ratio: 650/400
}

@media(max-width: 680px) {
    .gallery {
        max-width: 100%
    }
}

.gallery img {
    border-radius: 8px
}

.gallery-buttons {
    position: absolute;
    width: calc(100% + 40px);
    top: 50%;
    transform: translateY(-50%);
    left: -20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    z-index: 10;
    pointer-events: none
}

.home-slider {
    position: relative;
}

.home-slider .gallery-buttons {
    width: calc(100% + 20px);
    left: -10px;
}

.gallery-buttons div {
    pointer-events: all
}

.topbar-container {
    container-type: inline-size;
    container-name: topbar-container;
    width: 100%
}

@container topbar-container (min-width: 300px) {}

.topbar {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10001;
    transition: .4s ease-in-out
}

.topbar.is-sticky {
    box-shadow: 0px 4px 3px rgba(37, 37, 37, 0.1019607843)
}

.topbar.is-sticky .topbar__banner {
    margin-top: -45px
}

.topbar.is-sticky.scrolled--up {
    margin-top: 0
}

.topbar__top {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    background-color: var(--bluelightbg);
    padding-top: clamp(5px, 0.6770833333vw, 13px);
    padding-bottom: clamp(5px, 0.6770833333vw, 13px);
    height: 60px
}

@media(max-width: 600px) {
    .topbar__top {
        display: none
    }
}

.topbar__bottom {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    justify-content: center;
    background-color: #fff;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 1.40625vw, 27px);
    min-height: clamp(60px, 4.1666666667vw, 80px);
    z-index: 3;
    position: relative
}

@media(max-width: 850px) {
    .topbar__bottom {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width: 600px) {
    .topbar__bottom {
        padding-top: 5px;
        padding-bottom: 5px;
        padding-right: 0
    }
}

.topbar__top__item span {
    display: flex
}

.topbar__top__item:has(+.menu) span {
    display: flex
}

.topbar__top__items {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 1.0416666667vw, 20px)
}

.topbar__top__items ul {
    all: unset;
    list-style: none;
    display: flex;
    gap: clamp(10px, 0.9375vw, 18px)
}

.topbar__top__items ul li a {
    color: var(--secondaryColor);
    font-size: clamp(12px, 1.4vw, 14px);
    font-weight: 400;
    transition: .2s ease-in-out
}

.topbar__top__items ul li a:hover {
    color: var(--primaryColor)
}

.topbar-logo {
    padding-top: clamp(5px, 0.78125vw, 15px);
    padding-bottom: clamp(5px, 0.78125vw, 15px)
}

@media(max-width: 600px) {
    .topbar-logo {
        padding: 0
    }
}

.topbar-logo svg,
.topbar-logo img {
    max-width: clamp(150px, 10.8333333333vw, 208px)
}

.topbar__menu {
    display: flex;
    height: 100%
}

@media(max-width: 850px) {
    .topbar__menu {
        display: none
    }
}

.topbar__menu ul {
    all: unset;
    list-style: none;
    display: flex;
    height: 100%;
    gap: clamp(20px, 1.40625vw, 27px)
}

.topbar__menu ul li {
    display: flex;
    gap: clamp(5px, 0.5208333333vw, 10px);
    justify-content: center;
    align-items: center;
    align-content: center;
    height: 100%;
    position: relative
}

.topbar__menu ul li::before {
    content: "";
    width: 100%;
    bottom: 0;
    position: absolute;
    height: 3px;
    background-color: var(--primaryColor);
    scale: 0;
    transition: .2s ease-in-out
}

.topbar__menu ul li a {
    color: var(--textColor);
    font-family: var(--titleFont);
    font-size: clamp(16px, 2vw, 20px);
    font-weight: var(--medium);
    transition: .2s ease-in-out;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

.topbar__menu ul li a:hover {
    color: var(--primaryColor)
}

.topbar__menu ul li .icon,
.topbar__menu ul li .sendmethod {
    font-size: 12px;
    color: var(--primaryColor)
}

.topbar__menu ul li .icon::before,
.topbar__menu ul li .sendmethod::before {
    transform: rotate(90deg)
}

.topbar__menu ul li:has(a:hover)::before {
    scale: 1
}

.topbar__buttons {
    display: flex;
    justify-content: end;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 1.8229166667vw, 35px)
}

.topbar__buttons a {
    color: var(--black);
    font-size: clamp(20px, 2.5vw, 25px);
    display: flex;
    position: relative;
    transition: .2s ease-in-out
}

.topbar__buttons a:hover {
    color: var(--primaryColor)
}

.topbar__buttons a .counternmbr {
    background: #c70b45 0% 0% no-repeat padding-box;
    border: 2px solid #fff;
    aspect-ratio: 1/1;
    height: clamp(17px, 1.09375vw, 21px);
    width: clamp(17px, 1.09375vw, 21px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border-radius: 50%;
    color: #fff;
    position: absolute;
    right: -5px;
    top: -6px;
    font-size: 11px
}

.topbar__banner {
    background-color: var(--primaryColor);
    padding: clamp(5px, 0.5208333333vw, 10px) 0;
    justify-content: center;
    align-items: center;
    align-content: center;
    font-size: clamp(12px, 1.4vw, 14px);
    font-weight: 400;
    padding-left: clamp(20px, 1.0416666667vw, 20px);
    padding-right: clamp(20px, 1.0416666667vw, 20px);
    color: #fff;
    text-align: center;
    margin-top: 0;
    max-height: 45px;
    transition: .4s ease-in-out
}

.topbar__banner a {
    text-decoration: underline;
    color: #fff
}

.usp-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(20px, 10.4166666667vw, 200px);
    padding-top: clamp(20px, 6.25vw, 120px);
    padding-bottom: clamp(20px, 6.25vw, 120px);
    position: relative
}

@media(max-width: 1000px) {
    .usp-cols {
        overflow: hidden
    }
}

.usp-cols::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 30px;
    width: calc(100% - 60px);
    height: 100%;
    background-color: var(--bluelightbg);
    z-index: -1
}

@media(max-width: 1620px) {
    .usp-cols::before {
        width: 100%;
        left: 0
    }
}

@media(max-width: 1000px) {
    .usp-cols {
        display: flex;
        flex-direction: column
    }
}

.usp-col {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 1.5625vw, 30px);
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    color: #336a77;
    position: relative
}

.usp-col::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 100%;
    border-right: 1px dashed #71b2c1;
    right: -100px
}

.usp-col:first-of-type {
    padding-left: 0
}

.usp-col:last-of-type {
    padding-right: 0
}

.usp-col:last-of-type::before {
    display: none
}

@media(max-width: 700px) {
    .usp-col {
        margin: 0 auto;
        text-align: left
    }
}

.usp-col .title {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 1.5625vw, 30px);
    justify-content: center;
    align-items: center;
    align-content: center
}

@media(max-width: 1000px) {
    .usp-col .title {
        flex-direction: row;
        justify-content: center;
        align-items: center
    }
}

.usp-col p {
    line-height: 1.66
}

.usp-col__icon svg {
    max-height: clamp(70px, 4.6875vw, 90px);
    fill: #71b2c1 !important
}

@media(max-width: 700px) {
    .usp-col__icon svg {
        height: 40px
    }
}

.usp-col__icon svg *,
.usp-col__icon svg>* {
    fill: #71b2c1 !important
}

.usps {
    justify-content: center;
    align-items: center;
    align-content: center;
    display: flex;
    flex-wrap: wrap;
    gap: clamp(5px, 0.5208333333vw, 10px)
}

.usps--red svg * {
    fill: var(--primaryColor)
}

.usps:has(+.footer) {
    margin-bottom: clamp(20px, 5.2083333333vw, 100px)
}

.usps-swiper {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

@media(max-width: 500px) {
    .usps-swiper {
        max-width: 90%
    }
}

.usp__item {
    display: flex;
    gap: clamp(10px, 0.78125vw, 15px);
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100%
}

.usp__item__titles {
    display: flex;
    flex-direction: column
}

.usp__item__titles b {
    font-weight: var(--bold)
}

.checkout__step1>div {
    display: flex;
    gap: clamp(20px, 2.6041666667vw, 50px)
}

@media(max-width: 960px) {
    .checkout__step1>div {
        flex-direction: column
    }
}

.checkout__step1+.footer .footer__top {
    display: none
}

.checkout__step1__left {
    width: calc(100% - 440px)
}

@media(max-width: 1000px) {
    .checkout__step1__left {
        width: calc(100% - 400px)
    }
}

@media(max-width: 960px) {
    .checkout__step1__left {
        width: 100%
    }
}

.checkout__step1__left__top {
    display: flex;
    gap: clamp(10px, 1.5625vw, 30px);
    margin-bottom: clamp(20px, 2.0833333333vw, 40px);
    flex-wrap: wrap
}

@media(max-width: 500px) {
    .checkout__step1__left__top {
        gap: 20px
    }
}

.checkout__step1__left__top--final {
    margin-bottom: 0px;
    flex-direction: column;
    gap: clamp(10px, 1.0416666667vw, 20px)
}

@media(max-width: 800px) {
    .checkout__step1__left__top--final {
        margin-bottom: 0
    }
}

.checkout__step1__left__text {
    font-size: clamp(16px, 2vw, 20px);
    color: var(--seventh-text-color)
}

.product-overview__backbutton--checkout {
    margin-top: 0 !important
}

.checkout__step1__left__items {
    display: grid;
    grid-template-columns: clamp(80px, 5.2083333333vw, 100px) 1fr auto auto clamp(30px, 2.8645833333vw, 55px);
    gap: 0px
}

.checkout__step1__left__item {
    padding: clamp(10px, 1.5625vw, 30px) 0;
    border-top: 1px dashed rgba(199, 11, 69, 0.2509803922);
    gap: clamp(10px, 1.0416666667vw, 20px);
    align-items: center;
    align-content: center;
    display: grid;
    grid-column: 1/-1;
    gap: 20px;
    grid-template-columns: subgrid
}

@media(max-width: 500px) {
    .checkout__step1__left__item {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        padding: 20px 0;
        position: relative;
        justify-content: center;
        align-items: center;
        align-content: center;
        text-align: center
    }
}

.checkout__step1__left__title {
    display: flex;
    align-items: center;
    align-content: center
}

.checkout__step__left__item__image {
    aspect-ratio: 1/1;
    background-color: var(--redlightbg);
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    overflow: hidden;
    transition: .2s ease-in-out;
    flex: 1 1 auto;
    max-width: clamp(60px, 4.1666666667vw, 80px);
    width: 100%
}

@media(max-width: 500px) {
    .checkout__step__left__item__image {
        width: 100%;
        max-width: clamp(60px, 4.1666666667vw, 80px)
    }
}

.checkout__step__left__item__image:hover img {
    scale: 1.05
}

.checkout__step__left__item__image img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    transition: .2s ease-in-out;
    scale: 1;
    transition: .2s ease-in-out
}

.checkout__totals__prices__item__titles {
    display: flex;
    flex-direction: column;
    gap: 5px
}

.checkout__step__left__item__titlewrapper {
    display: flex;
    flex-direction: column;
    gap: 5px;
    max-width: 490px
}

@media(max-width: 500px) {
    .checkout__step__left__item__titlewrapper {
        margin-left: 0;
        max-width: 100%
    }
}

.checkout__step__left__item__title {
    font-size: clamp(15px, 1.8vw, 18px);
    font-weight: 500;
    color: var(--black);
    font-family: var(--titleFont);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-color: rgba(0, 0, 0, 0);
    transition: .2s ease-in-out;
    text-decoration-thickness: 2px;
    display: flex;
    flex-direction: column;
    gap: 5px
}

.checkout__step__left__item__title:hover {
    text-decoration-color: var(--black)
}

.checkout__step__left__item__delay {
    font-size: clamp(14px, 1.6vw, 16px);
    color: #8a9595
}

.checkout__step__left__item__price {
    color: #8a9595;
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400
}

.checkout__step__left__item__input input {
    margin-left: auto
}

.checkout__step__left__item__input__right {
    margin-left: auto;
    display: flex;
    align-items: center;
    align-content: center;
    gap: 20px;
    min-width: 275px
}

@media(max-width: 1150px) {
    .checkout__step__left__item__input__right {
        margin-left: 0;
        margin-right: auto
    }
}

.checkout__step__left__item__totalprice {
    padding-left: clamp(0px, 1.5625vw, 30px);
    text-align: center;
    font-weight: var(--bold);
    color: var(--primaryColor);
    font-family: var(--titleFont);
    font-size: clamp(14px, 1.8vw, 18px)
}

@media(max-width: 800px) {
    .checkout__step__left__item__totalprice {
        padding-left: 0;
        padding-right: 0
    }
}

.checkout__step__left__item__remove {
    width: clamp(20px, 1.8229166667vw, 35px);
    aspect-ratio: 1/1;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background-color: var(--redlightbg);
    color: var(--primaryColor);
    position: relative
}

@media(max-width: 500px) {
    .checkout__step__left__item__remove {
        width: 35px
    }
}

.checkout__step__left__item__remove .icon,
.checkout__step__left__item__remove .sendmethod {
    display: flex;
    font-size: 9px
}

@media(max-width: 800px) {
    .checkout__button__next__next {
        margin-top: 20px;
        bottom: 10px;
        position: sticky;
        width: 100%;
        left: 0;
        z-index: 10;
        transition: .3s ease-in-out
    }
}

.checkout__button__next {
    margin-top: 30px;
    margin-bottom: 20px;
    width: 100%;
    min-height: 58px;
    font-weight: 600;
    font-size: clamp(16px, 1.9vw, 19px)
}

@media(max-width: 800px) {
    .checkout__button__next {
        margin: 0
    }
}

.checkout__button__next:hover {
    background-color: #00b900
}

.checkout__totals__payments {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center
}

.kortingscode-btn {
    border-radius: 5px;
    border: 1px solid #e5e8f0;
    padding: 25px 20px;
    padding-right: clamp(10px, 0.625vw, 12px);
    padding-bottom: clamp(10px, 0.625vw, 12px);
    padding-top: clamp(10px, 0.625vw, 12px);
    padding-left: clamp(20px, 1.3020833333vw, 25px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    color: var(--primaryColor);
    width: 100%;
    font-weight: 500;
    font-size: clamp(15px, 1.6vw, 16px);
    font-family: var(--titleFont);
    margin-bottom: clamp(10px, 1.0416666667vw, 20px)
}

.kortingscode-btn:has(+.is-open) .icon,
.kortingscode-btn:has(+.is-open) .sendmethod {
    transform: rotate(180deg)
}

.kortingscode-btn .icon,
.kortingscode-btn .sendmethod {
    aspect-ratio: 1/1;
    min-width: clamp(25px, 1.6145833333vw, 31px);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border-radius: 4px;
    background-color: var(--primaryColor);
    font-size: clamp(9px, 1.1vw, 11px);
    color: #fff;
    rotate: 90deg;
    transition: .4s ease-in-out
}

.checkout__step2>div {
    display: flex;
    gap: 60px
}

.checkout__step2__fieldwrapper label span.text-red {
    color: rgb(199 11 69 / var(--tw-text-opacity, 1));
}

@media(max-width: 1160px) {
    .checkout__step2>div {
        gap: 30px
    }
}

@media(max-width: 1090px) {
    .checkout__step2>div {
        flex-wrap: wrap
    }
}

@media(max-width: 740px) {
    .checkout__step2>div {
        flex-direction: column
    }
}

.checkout__step2+.footer .footer__top {
    display: none
}

.checkout__step__container {
    max-width: 495px;
    width: 100%
}

@media(max-width: 1090px) {
    .checkout__step__container {
        max-width: calc(50% - 15px)
    }
}

@media(max-width: 740px) {
    .checkout__step__container {
        max-width: 100%
    }
}

.checkout__step2__title {
    min-height: 83px;
    padding-bottom: 43px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    gap: 20px
}

.checkout__step2__title .checkout__checkbox {
    margin-top: 10px
}

@media(max-width: 740px) {
    .checkout__step2__title {
        min-height: 53px;
        padding-bottom: 20px
    }
}

.checkout__checkbox {
    display: flex
}

.checkout__checkbox+.btn {
    margin-top: 40px
}

@media(max-width: 800px) {
    .checkout__checkbox+.btn {
        margin-top: 20px
    }
}

.checkout__checkbox input[type=checkbox] {
    opacity: 0;
    position: absolute;
    left: -1000vw;
    pointer-events: none
}

.checkout__checkbox input[type=checkbox]:checked+label::before {
    background-color: var(--primaryColor);
    border: 1px solid var(--primaryColor)
}

.checkout__checkbox input[type=checkbox]:checked+label::after {
    color: var(--white);
    transform: translateY(-50%) scale(1)
}

.checkout__checkbox label {
    position: relative;
    display: flex;
    gap: 20px;
    align-items: center;
    align-content: center;
    cursor: pointer
}

.checkout__checkbox label:before {
    content: "";
    min-width: 31px;
    min-height: 31px;
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--primaryColor);
    display: flex;
    position: relative;
    transition: .2s ease-in-out;
    border-radius: 4px
}

.checkout__checkbox label:after {
    position: absolute;
    min-width: 31px;
    min-height: 31px;
    display: flex !important;
    justify-content: center;
    align-items: center;
    align-content: center;
    font-size: 13px;
    top: 50%;
    transform: translateY(-50%) scale(0);
    color: #fff;
    border-radius: 2px;
    transition: .2s ease-in-out;
    transition-timing-function: ease-in-out
}

.checkout__step2__bluebox {
    border-radius: 2px;
    background-color: var(--redlightbg);
    min-height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    font-size: clamp(16px, 1.8vw, 18px);
    gap: 10px;
    flex-wrap: wrap
}

.checkout__step2__bluebox a {
    color: var(--primaryColor);
    font-family: var(--titleFont);
    font-weight: 500;
    font-size: clamp(14px, 1.6vw, 16px)
}

.checkout__step2__fieldlist {
    margin-top: 30px
}

.checkout__step2__fieldwrapper+.checkout__step2__fieldwrapper {
    margin-top: 15px
}

.checkout__step2__fieldwrapper select {
    outline: 0;
    -webkit-appearance: none;
    width: 100%;
    padding: 0 20px;
    height: 50px;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    border-radius: 5px
}

.checkout__step2__fieldwrapper>div {
    display: flex;
    gap: 10px;
    flex-direction: column;
    width: 100%;
    overflow: hidden
}

.checkout__step2__fieldwrapper>div label {
    font-size: clamp(16px, 1.8vw, 18px);
    font-weight: 500
}

.checkout__step2__fieldwrapper .checkout__checkbox {
    margin-top: 20px
}

.checkout__step2__fieldwrapper .checkout__checkbox label {
    font-weight: 400
}

.checkout__step2__fieldwrapper {
    display: flex;
    gap: 10px
}

.checkout__step2__fieldwrapper label:has(span) {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: space-between;
    align-items: center;
    align-content: center
}

.checkout__step2__fieldwrapper label span {
    font-size: clamp(11px, 1.2vw, 12px);
    color: #252525;
    opacity: .6
}

.checkout__step2__fieldwrapper__rekening {
    margin-top: 10px !important;
    display: flex !important
}

.checkout__step2__sendmethods {
    display: flex;
    flex-direction: column
}

.checkout__step2__sendmethods+.checkout__step2__title {
    margin-top: clamp(20px, 2.6041666667vw, 50px)
}

.sendmethod__wrapper input {
    opacity: 0;
    left: -100vw;
    position: absolute;
    pointer-events: none
}

.sendmethod__wrapper input:checked+label:not(.sendmethod--extra) {
    border: 2px solid var(--primaryColor)
}

.sendmethod__wrapper input:checked+label:not(.sendmethod--extra)::after {
    background-color: var(--primaryColor);
    scale: 1
}

.sendmethod__wrapper:has(+.sendmethod__wrapper) .sendmethod {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.sendmethod__wrapper:has(+.sendmethod__wrapper):has(+.sendmethod__wrapper input:checked) .sendmethod {
    border-bottom: 0
}

.sendmethod__wrapper:has(+.sendmethod__wrapper):has(+.sendmethod__wrapper input:checked)+.sendmethod__wrapper .sendmethod {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-top: 2px solid var(--primaryColor)
}

.sendmethod__wrapper+.sendmethod__wrapper .sendmethod {
    border-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.sendmethod {
    display: flex;
    cursor: pointer;
    border-radius: 5px;
    flex-wrap: wrap;
    position: relative;
    border: 2px solid #e5e8f0;
    padding: 20px;
    padding-top: 15px;
    overflow: hidden;
    align-items: center
}

.sendmethod::before {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 1px solid var(--primaryColor);
    margin-right: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    color: #fff;
    font-size: 10px
}

.sendmethod::after {
    content: "";
    position: absolute;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0);
    scale: 0;
    transition: .2s ease-in-out;
    z-index: -1
}

.sendmethod__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    font-size: clamp(14px, 1.6vw, 16px);
    font-weight: 400;
    margin-left: auto;
    width: calc(100% - 43px);
    text-wrap: wrap;
    white-space: initial;
    line-height: 1.3
}

.sendmethod__top div:last-child {
    margin-left: auto;
    flex: 1 1 auto;
    max-width: 70px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: end;
    align-content: end
}

.sendmethod__top--paymentmethod img {
    max-height: 25px
}

.paymentmethod__imagewrapper {
    width: 40px;
    display: flex;
    justify-content: center
}

.sendmethod--paymentmethod::before {
    margin-right: 0
}

.checkout__step2__paymentmethods {
    display: flex;
    flex-direction: column
}

.paymentmethod__select {
    margin-top: 20px
}

.checkout__checkbox--totals {
    display: flex;
    align-items: center;
    align-content: center;
    margin-top: 30px
}

.checkout__checkbox--totals+.checkout__checkbox--totals {
    margin-top: 15px
}

.checkout__checkbox--totals a {
    margin-left: 5px;
    color: var(--primaryColor)
}

.checkout__totals__prices__items {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.checkout__totals__prices__item {
    display: grid;
    align-items: center;
    align-content: center;
    grid-template-columns: auto auto
}

.checkout__totals__prices__item__left {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
    align-content: center
}

.checkout__totals__prices__item__right {
    font-weight: 400;
    display: flex;
    flex-direction: column;
    text-align: right
}

.checkout__totals__prices__item__right span {
    color: var(--seventh-text-color);
    font-size: 14px;
    font-weight: 400
}

.checkout__totals__prices__item__title {
    font-size: clamp(15px, 1.7vw, 17px);
    font-weight: 500;
    color: var(--black);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
    text-decoration-color: rgba(0, 0, 0, 0);
    transition: .2s ease-in-out;
    text-wrap: balance
}

.checkout__totals__prices__item__title:hover {
    text-decoration-color: var(--black)
}

.checkout__step2__address2 {
    display: none;
    margin-top: 30px
}

@media(max-width: 1090px) {
    .checkout__totals--2 {
        max-width: 100% !important
    }
}

.note {
    margin-top: clamp(20px, 1.0416666667vw, 20px)
}

.note textarea {
    width: 100%;
    max-width: 100%;
    min-height: clamp(60px, 5.2083333333vw, 100px);
    padding: 10px clamp(15px, 1.0416666667vw, 20px);
    font-size: clamp(15px, 1.6vw, 16px);
    resize: none
}

.note textarea::-moz-placeholder {
    opacity: .5
}

.note textarea::placeholder {
    opacity: .5
}

.sendmethod__wrapper .sendmethod__extra {
    display: none;
    flex-direction: column;
    gap: 10px;
    padding: 0 clamp(20px, 2.0833333333vw, 40px);
    padding-bottom: clamp(10px, 1.0416666667vw, 20px);
    padding-right: clamp(10px, 2.0833333333vw, 40px);
    border: 2px solid var(--primaryColor);
    border-top: 1px solid rgba(0, 0, 0, 0);
    padding-left: clamp(20px, 3.125vw, 60px);
    font-size: clamp(15px, 1.6vw, 16px)
}

.sendmethod__wrapper .sendmethod__extra .webform__field {
    display: flex;
    flex-direction: column;
    gap: clamp(5px, 0.5208333333vw, 10px)
}

.sendmethod__wrapper .sendmethod__extra input {
    left: auto;
    opacity: 1;
    position: relative;
    pointer-events: all
}

.sendmethod__wrapper:has(>input:checked):has(.sendmethod__extra)>label {
    border-bottom: 0 !important;
    border-radius: 0
}

.sendmethod__wrapper:has(>input:checked):has(.sendmethod__extra) .sendmethod__extra {
    display: flex
}

.radio-group {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.radio-group__item input:checked+label::after {
    scale: .7
}

.radio-group__item label {
    display: flex;
    gap: clamp(10px, 0.7291666667vw, 14px);
    align-items: center;
    align-content: center;
    cursor: pointer
}

.radio-group__item label::before {
    content: "";
    border-radius: 50%;
    width: clamp(10px, 0.9895833333vw, 19px);
    height: clamp(10px, 0.9895833333vw, 19px);
    aspect-ratio: 1/1;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    border: 1px solid var(--primaryColor)
}

.radio-group__item label::after {
    content: "";
    border-radius: 50%;
    width: clamp(10px, 0.9895833333vw, 19px);
    height: clamp(10px, 0.9895833333vw, 19px);
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background-color: var(--primaryColor);
    position: absolute;
    scale: 0;
    transition: .2s ease-in-out
}

.radio-group__item input {
    position: absolute !important;
    left: -100vw !important;
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important
}

.swiper {
    width: 100%;
    max-width: 100%;
    max-height: 100vh;
    min-height: 0;
    min-width: 0
}

.swiper-slide {
    display: flex !important
}

.productsliderslider .swiper-slide {
    display: flex;
    height: auto;
    align-items: stretch;
}

/* Equal height for product slider slides */
.productsliderslider .swiper-slide {
    height: auto;
}

.productsliderslider .swiper-slide .btgr-card {
    height: 100% ;
    display: flex;
    flex-direction: column;
}

.swiper-slide img {
    display: block;
    width: 100%
}

.swiper-slide.is-hidden {
    opacity: .5
}

.swiper__arrows {
    --arrowHeight: clamp(20px, 4vw, 40px);
    position: absolute;
    top: calc(50% - (var(--arrowHeight))/2);
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 5px 10px;
    padding: 0 clamp(20px, 2.0833333333vw, 40px);
    z-index: 10;
    pointer-events: none
}

.swiper__arrow {
    cursor: pointer;
    pointer-events: all;
    outline: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: var(--arrowHeight);
    aspect-ratio: 1/1;
    color: #fff;
    opacity: .5;
    transition: .2s
}

.swiper__arrow:hover {
    opacity: 1
}

.swiper__arrow:active {
    transform: scale(0.9) translateX(5px)
}

.swiper__arrow--disabled,
.swiper__arrow.swiper-button-disabled {
    opacity: .2;
    pointer-events: none
}

.swiper__arrow--left::before,
.swiper__arrow--prev::before {
    transform: rotate(180deg)
}

.swiper-pagination,
.swiper-bullets {
    position: absolute;
    display: flex;
    left: 25px !important;
    right: 25px !important;
    bottom: 25px !important;
    width: auto !important;
    pointer-events: none;
    z-index: 200
}

.swiper-pagination--centered,
.swiper-bullets--centered {
    justify-content: center
}

@media(max-width: 500px) {

    .swiper-pagination,
    .swiper-bullets {
        right: 15px !important;
        bottom: 15px !important;
        left: 15px !important
    }
}

.swiper-pagination-bullet {
    background: none;
    width: 18px;
    height: 18px;
    pointer-events: all;
    cursor: pointer;
    padding: 5px;
    margin: 0 !important;
    opacity: .5;
    transition: .2s
}

.swiper-pagination-bullet::before {
    content: "";
    display: flex;
    border-radius: 100%;
    width: 100%;
    height: 100%;
    background: #fff
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1
}

.checkout__step2__fieldlist .field.required > label::after,
.checkout__step2__fieldlist .field._required > label::after {
    content: none;
}