@font-face {
    font-display: swap;
    font-family: 'Merriweather';
    font-style: normal;
    font-weight: 400;
    src: url('./assets/fonts/merriweather-v33-latin-regular.eot');
    src: local('Merriweather Regular'), local('Merriweather-Regular'), url('./assets/fonts/merriweather-v33-latin-regular.eot?#iefix') format('embedded-opentype'), url('./assets/fonts/merriweather-v33-latin-regular.woff2') format('woff2'), url('./assets/fonts/merriweather-v33-latin-regular.woff') format('woff'), url('./assets/fonts/merriweather-v33-latin-regular.ttf') format('truetype'), url('./assets/fonts/merriweather-v33-latin-regular.svg#Merriweather') format('svg')
}

@font-face {
    font-display: swap;
    font-family: 'Merriweather';
    font-style: italic;
    font-weight: 400;
    src: url('./assets/fonts/merriweather-v33-latin-italic.eot');
    src: local('Merriweather Italic'), local('Merriweather-Italic'), url('./assets/fonts/merriweather-v33-latin-italic.eot?#iefix') format('embedded-opentype'), url('./assets/fonts/merriweather-v33-latin-italic.woff2') format('woff2'), url('./assets/fonts/merriweather-v33-latin-italic.woff') format('woff'), url('./assets/fonts/merriweather-v33-latin-italic.ttf') format('truetype'), url('./assets/fonts/merriweather-v33-latin-italic.svg#Merriweather') format('svg')
}

@font-face {
    font-display: swap;
    font-family: 'Albert Sans';
    font-style: normal;
    font-weight: 400;
    src: url('./assets/fonts/albert-sans-v4-latin-regular.eot');
    src: local('Albert Sans Regular'), local('AlbertSans-Regular'), url('./assets/fonts/albert-sans-v4-latin-regular.eot?#iefix') format('embedded-opentype'), url('./assets/fonts/albert-sans-v4-latin-regular.woff2') format('woff2'), url('./assets/fonts/albert-sans-v4-latin-regular.woff') format('woff'), url('./assets/fonts/albert-sans-v4-latin-regular.ttf') format('truetype'), url('./assets/fonts/albert-sans-v4-latin-regular.svg#AlbertSans') format('svg')
}

@font-face {
    font-display: swap;
    font-family: 'Albert Sans';
    font-style: normal;
    font-weight: 600;
    src: url('./assets/fonts/albert-sans-v4-latin-600.eot');
    src: local('Albert Sans SemiBold'), local('AlbertSans-SemiBold'), url('./assets/fonts/albert-sans-v4-latin-600.eot?#iefix') format('embedded-opentype'), url('./assets/fonts/albert-sans-v4-latin-600.woff2') format('woff2'), url('./assets/fonts/albert-sans-v4-latin-600.woff') format('woff'), url('./assets/fonts/albert-sans-v4-latin-600.ttf') format('truetype'), url('./assets/fonts/albert-sans-v4-latin-600.svg#AlbertSans') format('svg')
}

:root {
    --black: #000;
    --white: #fff;
    --white-transparent: rgba(255, 255, 255, 0.8);
    --color-accent: #ef7f28;
    --color-accent-highlight: #db711f;
    --color-background: #fff;
    --color-text: #1F1F1F;
    --color-accent: #D7A050;
    --color-accent-transparent: rgba(215, 160, 80, 0.1);
    --font-family-heading: 'Merriweather', Georgia, serif;
    --font-family-body: 'Albert Sans', 'Helvetica Neue', Helvetica, sans-serif;

    --green: #2A3E0C;
    --green-highlight: #213009;
    --beige-light: #F5F0EB;
    --masthead-offset: 132px;
    --masthead-fixed-top: 71px;
    --text-primary: #404040;
    --text-secondary-color: #4C4C4C;
    --text-negative-color: var(--white);
    --text-green-color: #28A835;
    --text-red-color: #CC3014;
    --grey-darkest:#1F1F1F;
    --grey-dark: #423f3c;
    --grey-normal: #CCCCCC;
    --grey-medium:#e9e9e9;
    --grey-light:hsla(0, 0%, 97%, 1.00);
    --grey-lightest: #F2F2F2;
    --grey-blue:#142131;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    -webkit-tap-highlight-color: transparent
}

html,
body {
    font-family: 'Albert Sans', sans-serif;
    font-weight: 300;
    min-height: 100%
}

body {
    line-height: 1.5;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    background-color: var(--color-background);
    color: var(--color-text)
}

.site-header {
    position: relative;
    top: auto;
        z-index: 99999999;
        background-color: var(--white);
        border-bottom: 1px solid var(--beige-light)
}

:root.kd-preheader-collapsed .site-header {
    position: sticky;
    top: 0;
}

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

button,
input,
select,
textarea {
    border: 0;
    background: none;
    color: inherit;
}

ul,
ol {
    list-style: none
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-family-heading);
    font-weight: 400;
}

h1 .highlight,
h2 .highlight,
h3 .highlight,
h4 .highlight,
h5 .highlight,
h6 .highlight {
    color: var(--color-accent);
    font-style: italic;
}

a {
    color: inherit;
    vertical-align: baseline;
    background: transparent;
    color: var(--black);
    text-decoration: none;
    border-bottom: none;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: 7.5%;
    text-underline-offset: 20%;
    text-underline-position: from-font;
}

p ~ p  {
    margin-top: 20px;
}
.text-regular,
.regular {
    font-weight: 400
}

.text-bold,
.bold, 
.strong,
b,
strong {
    font-weight: 600
}

.f-12,
.f-13,
.f-14,
.f-15,
.f-16,
.f-17,
.f-18,
.f-19,
.f-20,
.f-21,
.f-22,
.f-23,
.f-24,
.f-26,
.f-28,
.f-30,
.f-32,
.f-34,
.f-36,
.f-38,
.f-40,
.f-42,
.f-44,
.f-48,
.f-96,
.f-50,
.f-60,
.f-80,
.f-128 {
  line-height: 1.5;
  leading-trim: both;
  text-edge: cap alphabetic
}

.f-12 {
    font-size: 12px
}

.f-13 {
    font-size: 13px
}

.f-14 {
    font-size: 14px
}

.f-15 {
    font-size: 15px
}

.f-16 {
    font-size: 16px
}

.f-17 {
    font-size: 17px
}

.f-18 {
    font-size: 18px
}

.f-19 {
    font-size: 19px
}

.f-20 {
    font-size: 20px
}

.f-21 {
    font-size: 21px
}

.f-22 {
    font-size: 22px
}

.f-23 {
    font-size: 23px
}

.f-24 {
    font-size: 24px
}

.f-26 {
    font-size: 26px
}

.f-28 {
    font-size: 28px
}

.f-30 {
    font-size: 30px
}

.f-32 {
    font-size: 32px
}

.f-34 {
    font-size: 34px
}

.f-36 {
    font-size: 36px
}

.f-38 {
    font-size: 38px
}

.f-40 {
    font-size: 40px
}

.f-42 {
    font-size: 42px
}

.f-44 {
    font-size: 44px
}

.f-48 {
    font-size: 48px
}

.f-96 {
    font-size: 96px
}
.f-80 {
    font-size: 80px;
    line-height: 1.2;
}

.f-50 {
    font-size: 50px
}

.f-60 {
    font-size: 60px
}

.f-64 {
    font-size: 64px
}

.f-80 {
    font-size: 80px
}

.f-128 {
    font-size: 128px
}


.right-auto {
    margin-right: auto
}

.top-auto {
    margin-top: auto
}

.left-auto {
    margin-left: auto
}

.top-0 {
    margin-top: 0
}

.top-5 {
    margin-top: 5px
}

.top-10 {
    margin-top: 10px
}

.top-15 {
    margin-top: 15px
}

.top-20 {
    margin-top: 20px
}

.top-25 {
    margin-top: 25px
}

.top-30 {
    margin-top: 30px
}

.top-35 {
    margin-top: 35px
}

.top-40 {
    margin-top: 40px
}

.top-45 {
    margin-top: 45px
}

.top-50 {
    margin-top: 50px
}

.top-55 {
    margin-top: 55px
}

.top-60 {
    margin-top: 60px
}

.top-65 {
    margin-top: 65px
}

.top-70 {
    margin-top: 70px
}

.top-80 {
    margin-top: 80px
}

.top-90 {
    margin-top: 90px
}

.top-100 {
    margin-top: 100px
}

.top-120 {
    margin-top: 120px
}

.top-130 {
    margin-top: 130px
}

.top-140 {
    margin-top: 140px
}

.top-150 {
    margin-top: 150px
}

.top-160 {
    margin-top: 160px
}

.top-180 {
    margin-top: 180px
}

.top-200 {
    margin-top: 200px
}

.bottom-0 {
    margin-bottom: 0
}

.bottom-5 {
    margin-bottom: 5px
}

.bottom-10 {
    margin-bottom: 10px
}

.bottom-15 {
    margin-bottom: 15px
}

.bottom-20 {
    margin-bottom: 20px
}

.bottom-25 {
    margin-bottom: 25px
}

.bottom-30 {
    margin-bottom: 30px
}

.bottom-35 {
    margin-bottom: 35px
}

.bottom-40 {
    margin-bottom: 40px
}

.bottom-45 {
    margin-bottom: 45px
}

.bottom-50 {
    margin-bottom: 50px
}

.bottom-55 {
    margin-bottom: 55px
}

.bottom-60 {
    margin-bottom: 60px
}

.bottom-70 {
    margin-bottom: 70px
}

.bottom-80 {
    margin-bottom: 80px
}

.bottom-90 {
    margin-bottom: 90px
}

.bottom-100 {
    margin-bottom: 100px
}

.bottom-120 {
    margin-bottom: 120px
}

.bottom-200 {
    margin-bottom: 200px
}

.bottom-300 {
    margin-bottom: 300px
}

.left-0 {
    margin-left: 0
}

.left-5 {
    margin-left: 5px
}

.left-10 {
    margin-left: 10px
}

.left-15 {
    margin-left: 15px
}

.left-20 {
    margin-left: 20px
}

.left-25 {
    margin-left: 25px
}

.left-30 {
    margin-left: 30px
}

.left-35 {
    margin-left: 35px
}

.left-40 {
    margin-left: 40px
}

.left-45 {
    margin-left: 45px
}

.left-50 {
    margin-left: 50px
}

.left-55 {
    margin-left: 55px
}

.left-60 {
    margin-left: 60px
}

.left-70 {
    margin-left: 70px
}

.left-80 {
    margin-left: 80px
}

.left-90 {
    margin-left: 90px
}

.left-100 {
    margin-left: 100px
}

.right-0 {
    margin-right: 0
}

.right-5 {
    margin-right: 5px
}

.right-10 {
    margin-right: 10px
}

.right-15 {
    margin-right: 15px
}

.right-20 {
    margin-right: 20px
}

.right-25 {
    margin-right: 25px
}

.right-30 {
    margin-right: 30px
}

.right-35 {
    margin-right: 35px
}

.right-40 {
    margin-right: 40px
}

.right-45 {
    margin-right: 45px
}

.right-50 {
    margin-right: 50px
}

.right-55 {
    margin-right: 55px
}

.right-60 {
    margin-right: 60px
}

.right-70 {
    margin-right: 70px
}

.right-80 {
    margin-right: 80px
}

.right-90 {
    margin-right: 90px
}

.right-100 {
    margin-right: 100px
}

.padding-top-0 {
    padding-top: 0
}

.padding-top-5 {
    padding-top: 5px
}

.padding-top-10 {
    padding-top: 10px
}

.padding-top-15 {
    padding-top: 15px
}

.padding-top-20 {
    padding-top: 20px
}

.padding-top-25 {
    padding-top: 25px
}

.padding-top-30 {
    padding-top: 30px
}

.padding-top-35 {
    padding-top: 35px
}

.padding-top-40 {
    padding-top: 40px
}

.padding-top-45 {
    padding-top: 45px
}

.padding-top-50 {
    padding-top: 50px
}

.padding-top-55 {
    padding-top: 55px
}

.padding-top-60 {
    padding-top: 60px
}

.padding-top-70 {
    padding-top: 70px
}

.padding-top-80 {
    padding-top: 80px
}

.padding-top-90 {
    padding-top: 90px
}

.padding-top-100 {
    padding-top: 100px
}

.padding-bottom-0 {
    padding-bottom: 0
}

.padding-bottom-5 {
    padding-bottom: 5px
}

.padding-bottom-10 {
    padding-bottom: 10px
}

.padding-bottom-15 {
    padding-bottom: 15px
}

.padding-bottom-20 {
    padding-bottom: 20px
}

.padding-bottom-25 {
    padding-bottom: 25px
}

.padding-bottom-30 {
    padding-bottom: 30px
}

.padding-bottom-35 {
    padding-bottom: 35px
}

.padding-bottom-40 {
    padding-bottom: 40px
}

.padding-bottom-45 {
    padding-bottom: 45px
}

.padding-bottom-50 {
    padding-bottom: 50px
}

.padding-bottom-55 {
    padding-bottom: 55px
}

.padding-bottom-60 {
    padding-bottom: 60px
}

.padding-bottom-70 {
    padding-bottom: 70px
}

.padding-bottom-80 {
    padding-bottom: 80px
}

.padding-bottom-90 {
    padding-bottom: 90px
}

.padding-bottom-100 {
    padding-bottom: 100px
}

.padding-left-0 {
    padding-left: 0
}

.padding-left-5 {
    padding-left: 5px
}

.padding-left-10 {
    padding-left: 10px
}

.padding-left-15 {
    padding-left: 15px
}

.padding-left-20 {
    padding-left: 20px
}

.padding-left-25 {
    padding-left: 25px
}

.padding-left-30 {
    padding-left: 30px
}

.padding-left-35 {
    padding-left: 35px
}

.padding-left-40 {
    padding-left: 40px
}

.padding-left-45 {
    padding-left: 45px
}

.padding-left-50 {
    padding-left: 50px
}

.padding-left-55 {
    padding-left: 55px
}

.padding-left-60 {
    padding-left: 60px
}

.padding-left-70 {
    padding-left: 70px
}

.padding-left-80 {
    padding-left: 80px
}

.padding-left-90 {
    padding-left: 90px
}

.padding-left-100 {
    padding-left: 100px
}

.padding-right-0 {
    padding-right: 0
}

.padding-right-5 {
    padding-right: 5px
}

.padding-right-10 {
    padding-right: 10px
}

.padding-right-15 {
    padding-right: 15px
}

.padding-right-20 {
    padding-right: 20px
}

.padding-right-25 {
    padding-right: 25px
}

.padding-right-30 {
    padding-right: 30px
}

.padding-right-35 {
    padding-right: 35px
}

.padding-right-40 {
    padding-right: 40px
}

.padding-right-45 {
    padding-right: 45px
}

.padding-right-50 {
    padding-right: 50px
}

.padding-right-55 {
    padding-right: 55px
}

.padding-right-60 {
    padding-right: 60px
}

.padding-right-70 {
    padding-right: 70px
}

.padding-right-80 {
    padding-right: 80px
}

.padding-right-90 {
    padding-right: 90px
}

.padding-right-100 {
    padding-right: 100px
}

.padding-5 {
    padding: 5px
}

.padding-10 {
    padding: 10px
}

.padding-15 {
    padding: 15px
}

.padding-20 {
    padding: 20px
}

.flex {
    display: flex
}

.flex-row {
    flex-direction: row
}

.flex-column {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

.flex-nowrap {
    flex-wrap: nowrap
}

.flex-1 {
    flex: 1
}

.flex-25 {
    flex: 25%
}

.flex-33 {
    flex: 33%
}

.flex-align-center {
    align-items: center;
    align-content: center
}

.flex-align-stretch {
    align-items: stretch;
    align-content: stretch
}

.flex-align-start {
    align-items: flex-start;
    align-content: flex-start
}

.flex-align-end,
.flex-align-bottom {
    align-items: flex-end;
    align-content: flex-end
}

.flex-center,
.flex-justify-center {
    justify-content: center
}

.flex-justify-space-between {
    justify-content: space-between
}
.flex-justify-end {
    justify-content: flex-end
}

.flex-start {
    justify-content: flex-start
}

.flex-end {
    justify-content: flex-end
}

.flex-space-between {
    justify-content: space-between
}

.flex-space-around {
    justify-content: space-around
}

.flex-space-evenly {
    justify-content: space-evenly
}

.flex-gap-5 {
    gap: 5px
}

.flex-gap-10 {
    gap: 10px
}

.flex-gap-15 {
    gap: 15px
}

.flex-gap-20 {
    gap: 20px
}

.flex-gap-25 {
    gap: 25px
}

.flex-gap-30 {
    gap: 30px
}

.flex-gap-35 {
    gap: 35px
}

.flex-gap-40 {
    gap: 40px
}

.flex-gap-50 {
    gap: 50px
}

.flex-gap-60 {
    gap: 60px
}

.flex-gap-70 {
    gap: 70px
}

.flex-gap-80 {
    gap: 80px
}

.flex-gap-90 {
    gap: 90px
}

.flex-order-5 {
    order: 5
}

.flex-order-10 {
    order: 10
}

.flex-order-15 {
    order: 15
}

.flex-order-20 {
    order: 20
}

.flex-order-25 {
    order: 25
}

.flex-order-30 {
    order: 30
}

.text-italic,
.text-underline,
.underline {
    text-decoration: underline
}

.text-uppercase {
    text-transform: uppercase
}

.text-primary {
    color: var(--text-primary)
}

.text-center {
    text-align: center
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-secondary {
    color: var(--text-secondary-color)
}

.text-secondary a {
    color: var(--text-secondary-color)
}

.text-white {
    color: var(--text-negative-color)
}
.section.text-white .text-image__heading {
    color: var(--text-negative-color)
}

.text-orange {
    color: var(--color-accent)
}

.text-red {
    color: var(--text-red-color)
}

.position-relative {
    position: relative
}

.position-absolute {
    position: absolute
}

.position-fixed {
    position: fixed
}

.left {
    float: left
}

.right {
    float: right
}

.inline {
    display: inline
}

.table {
    display: table
}

.block {
    display: block
}

.no-margin {
    margin: 0 !important
}

.no-padding {
    padding: 0 !important
}

.full-wrapper,
.wrapper {
    max-width: calc(min(1440px, 100vw));
    width: 100%;
    margin-left: auto;
    margin-right: auto
}

.inner-wrapper {
    max-width: 1280px;
    width: 100%;
    margin-left: auto;
    margin-right: auto
}

.width-100,
.full-width {
    width: 100%
}

.full-width.left-10.right-10 {
    width: calc(100% - 20px)
}

.full-height {
    height: 100%
}
img.full-width {
    height: auto
}
img.full-width.banoa-img-width-300 {
  max-width: 300px;
  border-radius: 100%;
}

.center {
    margin: 0 auto;
    display: table
}

.max-width-20 {
    max-width: 20px
}

.max-width-50 {
    max-width: 50px
}

.max-width-54 {
    max-width: 54px
}

.max-width-50prz {
    max-width: 50%
}

.max-width-63prz {
    max-width: 63%
}

.max-width-64prz {
    max-width: 64%
}

.max-width-100 {
    max-width: 100px
}

.max-width-104 {
    max-width: 104px
}

.max-width-105 {
    max-width: 105px
}

.max-width-120 {
    max-width: 120px
}

.max-width-150 {
    max-width: 150px
}

.max-width-170 {
    max-width: 170px
}

.max-width-190 {
    max-width: 190px
}

.max-width-260 {
    max-width: 260px
}

.max-width-313 {
    max-width: 313px
}

.max-width-313calc {
    max-width: calc(((min(100vw, 1440px) - 80px) / 2 - 17.5px) / 2 - 17.5px)
}

.max-width-333 {
    max-width: 333px
}

.max-width-350 {
    max-width: 350px
}

.max-width-380 {
    max-width: 380px
}

.max-width-400 {
    max-width: 400px
}

.max-width-460 {
    max-width: 460px
}
.max-width-500 {
    max-width: 500px
}
.max-width-510 {
    max-width: 510px
}

.max-width-560 {
    max-width: 560px
}

.max-width-600 {
    max-width: 600px
}

.max-width-620 {
    max-width: 620px
}

.max-width-662 {
    max-width: 662px
}

.max-width-662calc {
    max-width: calc((min(100vw, 1440px) - 80px) / 2 - 17.5px)
}

.max-width-700 {
    max-width: 700px
}

.max-width-720 {
    max-width: 720px
}

.max-width-840 {
    max-width: 840px
}

.max-width-950 {
    max-width: 950px
}

.max-width-1000 {
    max-width: calc(min(1000px, 100vw))
}

.max-width-1150 {
    max-width: 1150px
}

.max-width-1280 {
    max-width: 1280px
}

.max-width-1440 {
    max-width: calc(min(1440px, 100vw))
}

.max-width-1400 {
    max-width: calc(min(1400px, 100vw))
}

.max-width-60prz {
    max-width: 60%
}

.max-width-70prz {
    max-width: 70%
}

.max-width-33prz {
    max-width: 33%
}

.max-width-32prz {
    max-width: 32%
}

.max-width-20prz {
    max-width: 20%
}

.max-width-25prz {
    max-width: 25%
}

.width-subproducts {
    min-width: calc((min(1440px, 100vw) - 40px) / 2.333);
    max-width: 600px
}

.width-subproducts:last-child,
.width-105px {
    width: 105px
}

.width-150px {
    width: 150px
}

.width-75 {
    width: 75%
}

.width-70 {
    width: 70%
}

.width-50 {
    width: 50%
}

.width-40 {
    width: 40%
}

.width-36 {
    width: 36%
}

.width-33 {
    width: 33%
}

.width-30 {
    width: 30%
}

.width-25 {
    width: 25%
}

.width-auto {
    width: auto
}

.width-100vw {
    width: 100vw
}

.border-radius-20 {
    border-radius: 20px
}

.border-radius-bottom-20 {
    border-radius: 0 0 20px 20px
}

.border-radius-top-5 {
    border-radius: 5px 5px 0 0
}

.border-radius-top-20 {
    border-radius: 20px 20px 0 0
}

.border-radius-25 {
    border-radius: 25px
}

.border-radius-20 {
    border-radius: 20px
}

.border-radius-10 {
    border-radius: 10px
}

.border-radius-10 {
    border-radius: 10px
}

.border-radius-4 {
    border-radius: 4px
}

.border-radius-5 {
    border-radius: 5px
}

.border-radius-top-left-50 {
    border-top-left-radius: 50px
}

.border-radius-bottom-left-50 {
    border-bottom-left-radius: 50px
}

.border-radius-right-top-50 {
    border-top-right-radius: 50px
}

.border-radius-right-bottom-50 {
    border-bottom-right-radius: 50px
}

.border-radius-100 {
    border-radius: 100px
}

.border-radius-100prz {
    border-radius: 100%
}

.border-purple {
    border: 3px solid var(--purple)
}

.border-grey {
    border: 1px solid var(--grey-medium)
}

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

.border-right {
    border-right: 1px solid var(--black)
}

.border-solid {
    border-style: solid
}


.bg-white-08 {
    background: rgba(255, 255, 255, 0.8)
}

.bg-white-06 {
    background: rgba(255, 255, 255, 0.6)
}

.bg-white-05 {
    background: rgba(255, 255, 255, 0.5)
}

.bg-white-04 {
    background: rgba(255, 255, 255, 0.4)
}

.bg-white-03 {
    background: rgba(255, 255, 255, 0.3)
}

.bg-white-02 {
    background: rgba(255, 255, 255, 0.2)
}

.bg-white-01 {
    background: rgba(255, 255, 255, 0.1)
}

.bg-white-cream-gradient-bottom {
    background: linear-gradient(0deg, var(--white) 0%, var(--beige-light) 100%)
}

.bg-white-cream-gradient {
    background: linear-gradient(180deg, var(--white) 0%, var(--beige-light) 100%)
}
.bg-gradient {
    background: linear-gradient(180deg, var(--white) 0%, var(--color-accent-transparent) 100%);
}
.bg-gradient-reverse {
  background: linear-gradient(180deg, var(--color-accent-transparent) 0%, var(--white) 100%);
}
.bg-black {
    background: var(--black)
}

.bg-none {
    background: none
}


.bg-white {
    background: var(--white)
}

.bg-beige-light,
.bg-creme {
    background: var(--beige-light)
}
.bg-darkblue {
    background: var(--grey-blue)
}
.bg-browngrey {
    background: var(--grey-dark)
}
.bg-darkgrey {
  background: var(--grey-darkest);
}
.bg-grey {
    background: var(--grey-medium)
}
.bg-lightgrey {
    background: var(--grey-light)
}
.bg-organge,
.bg-orange {
    background-color: var(--color-accent)
}
.bg-transparent {
    background: transparent
}

.bg-beige-gradient-32 {
    background: linear-gradient(to bottom, var(--white) 0%, var(--white) 32%, var(--beige-light) 32%)
}
.bg-accent {
    background-color: var(--color-accent)
}
.bg-accent-light {
    background-color: var(--color-accent-transparent)
}

.site-nav-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 18px;
    background: transparent;
    color: var(--color-accent);
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease
}

.site-nav-toggle:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 3px
}

.site-nav-toggle__icon {
    display: inline-flex;
    flex-direction: column;
    gap: 4px
}

.site-nav-toggle__icon span {
    width: 18px;
    height: 2px;
    background: currentColor;
    display: block;
    border-radius: 99px;
    transition: transform 0.2s ease
}

.site-nav-toggle.is-active .site-nav-toggle__icon span:first-child {
    transform: translateY(3px) rotate(45deg)
}

.site-nav-toggle.is-active .site-nav-toggle__icon span:last-child {
    transform: translateY(-3px) rotate(-45deg)
}

.stroke-white,
.stroke-white stroke {
    stroke: var(--white)
}

.stroke-black,
.stroke-black stroke {
    stroke: var(--black)
}

.hidden {
    display: none !important
}

[hidden] {
    display: none !important
}

.text-shadow {
    text-shadow: 0 0 5px var(--black)
}

.no-border {
    border: none !important
}

.image-link {
    border: none
}

.btn-nav a,
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 24px;
    border-radius: 24px;
    border: 2px solid transparent;
    background-color: transparent;
    color: inherit;
    font-family: 'Albert Sans', sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 0;
    text-decoration: none;
    cursor: pointer;
    appearance: none;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.btn-nav a,
.btn-primary {
    background-color: var(--white);
    border-color: var(--color-accent);
    color: var(--color-accent)
}

.btn-secondary {
    background-color: transparent;
    border-color: var(--color-accent);
    color: var(--color-accent)
}

.btn-white {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--color-accent)
}

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

.btn:disabled,
.btn[aria-disabled="true"] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none
}

.btn-primary::after,
.btn-nav a::after {
    content: "";
    display: inline-block;
    width: 24px;
    height: 16px;
    max-width: 24px;
    max-height: 16px;
    flex: 0 0 auto;
    background-image: var(--banoa-button-inline-icon, none);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    vertical-align: middle;
}

.text-image-slider__button::after,
.text-image-hierachial__button::after,
.comparison-carousel__button::after,
.site-nav-toggle::after {
    content: none;
}

button:empty::after {
    content: none;
}

.btn-textlink {
    background: none;
    border: none;
    padding: 0;
    color: var(--text-primary);
    font-size: inherit;
    font-weight: 300;
    text-decoration: underline;
    cursor: pointer
}

.mxv-date-tooltip-trigger {
    width: 22px;
    height: 22px;
    min-width: 22px;
    border: 1px solid var(--color-accent);
    border-radius: 50%;
    color: var(--color-accent);
    background-color: var(--white);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    padding: 0;
    margin-left: 6px
}

.mxv-date-tooltip[popover] {
    inset: auto;
    margin: 0;
    top: calc(anchor(bottom) + 8px);
    left: anchor(center);
    translate: -50% 0;
    max-width: min(280px, calc(100vw - 32px));
    padding: 8px 10px;
    border: 1px solid var(--grey-normal);
    border-radius: 8px;
    background-color: var(--white);
    color: var(--text-primary)
}

.section--hero-frontpage {
    flex-wrap: wrap;
    gap: clamp(24px, 4vw, 72px)
}

.hero-frontpage__media {
    flex: 1 1 360px;
    max-width: 720px;
    width: 100%
}

.kd-gallery-slider {
    width: 100%;
    position: relative
}

.kd-gallery-slider__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    scroll-behavior: smooth;
    position: relative;
    scrollbar-gutter: stable both-edges;
    scrollbar-width: auto;
    padding-bottom: clamp(16px, 1.2vw, 28px)
}

.kd-gallery-slider__item {
    flex: 0 0 auto;
    scroll-snap-align: center;
    scroll-snap-stop: always
}

.kd-gallery-slider__picture {
    display: block;
    width: 100%
}

.kd-gallery-slider__image {
    width: 100%;
    height: auto;
    display: block
}

@media (prefers-reduced-motion:reduce) {
    .kd-gallery-slider__list {
        scroll-behavior: auto
    }
}

.kd-gallery-slider__list {
    scroll-padding-inline: 0;
    scrollbar-width: thin
}

.kd-gallery-slider {
    position: relative;
}

.kd-gallery-slider__picture {
    overflow: hidden
}

.kd-gallery-slider__image {
    height: 100%;
    object-fit: cover
}

.kd-gallery-slider__button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    inline-size: clamp(44px, 4vw, 56px);
    block-size: clamp(44px, 4vw, 56px);
    border-radius: 999px;
    border: 1px solid rgba(42, 62, 12, 0.25);
    background-color: rgba(255, 255, 255, 0.9);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 2;
    color: transparent;
    content: ""
}

.kd-gallery-slider__button {
    width: 48px;
    height: 48px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    position: absolute;
    top: 50%;
    cursor: pointer;
    border: 2px solid hsla(0, 0%, 0%, 0.3);
    background-color: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(30px);
    transition: background-color 0.3s ease, border-color 0.3s ease;
    border-radius: 100%
}

.slider-section__list--big~.kd-gallery-slider__button {
    top: calc(min(100vw, 600px) * 0.5)
}

.slider-section__list--medium~.kd-gallery-slider__button {
    top: calc(min(100vw, 400px) * 0.5)
}

.kd-gallery-slider__button:disabled {
    background-color: rgba(0, 0, 0, 0.2);
    cursor: not-allowed
}

.kd-gallery-slider__button--prev {
    content: "";
    left: 0
}

.kd-gallery-slider__button--next {
    content: "";
    right: 0
}

.hero-frontpage__slider .kd-gallery-slider__button--prev {
    top: unset;
    left: unset;
    right: 98px;
    bottom: 50px;
    border-right: none;
    border-radius: 24px 0 0 24px
}

.hero-frontpage__slider .kd-gallery-slider__button--next {
    top: unset;
    right: 50px;
    bottom: 50px;
    border-left: none;
    border-radius: 0 24px 24px 0
}

.kd-gallery-slider__button:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px
}

.kd-gallery-slider__button:disabled {
    opacity: 0.35
}

.kd-gallery-slider__list::scroll-marker {
    block-size: 4px;
    inline-size: 32px;
    border-radius: 999px;
    background-color: rgba(42, 62, 12, 0.3)
}

.kd-gallery-slider__list::scroll-marker(active) {
    background-color: var(--color-accent)
}

.slider-section__list--big .slider-section__body {
    display: flex;
    flex-direction: row;
    gap: 20px
}

.navigation-horizontal {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.navigation .menu-item {
    position: relative;
    flex: 1 0 auto
}
/*
.navigation .menu-item.current-menu-item:not(.btn-nav)::after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2248%22%20height%3D%224%22%20viewBox%3D%220%200%2048%204%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0%204C0%201.79086%201.79086%200%204%200H44C46.2091%200%2048%201.79086%2048%204H0Z%22%20fill%3D%22%23ef7f28%22%2F%3E%0A%3C%2Fsvg%3E%0A");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    transition: all 400ms ease
} /**/
.navigation.navigation-vertical .menu-item.current-menu-item:not(.btn-nav)::after {
    display: none;
}

.navigation .menu-item a {
    display: block;
    font-size: 16px;
    padding: 15px 25px;
    text-decoration: none;
    font-weight: 600;
    transition: all 400ms ease;
    white-space: nowrap
}

.navigation .menu-item.btn-nav a {
    padding: 15px;
    display:flex;
}

.site-logo .svg {
    display: block
}


.slider-section__overlay {
    position: absolute;
    top: 24px;
    left: 24px;
    padding: 8px 16px;
    border-radius: 24px;
    background: var(--white);
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 700
}

.section--purchase-process {
    overflow: hidden
}

.purchase-process__carousel {
    position: relative
}

.purchase-process__list {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-bottom: clamp(16px, 1.2vw, 28px)
}

.purchase-process__slide {
    min-width: min(400px, 85vw);
    display: flex;
    flex-direction: column;
    gap: 20px
}

.purchase-process__number-group {
    display: flex;
    align-items: center;
    gap: 24px
}

.change-color-path-green .path {
    fill: var(--color-accent)
}

.purchase-process__divider .svg-arrow {
    width: 27px;
    height: auto;
    opacity: 0.2
}

.section--faq {
    background-color: var(--white)
}

.section--comparison {
    --comparion-elements: 0px;
}

.faq-list {
    list-style: none;
    margin: 0;
    padding: 0
}

[data-faq-item][data-faq-hidden] {
    display: none
}

[data-faq-item] {
    border-radius: 24px;
    background: var(--white);
    transition: background-color 0.3s ease, box-shadow 0.3s ease
}

[data-faq-item].is-open {
    background: var(--beige-light)
}

[data-faq-item].is-open .faq-toggle {
    padding-bottom: 0
}

.faq-toggle {
    width: 100%;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    padding: 24px
}

.faq-toggle__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: var(--beige-light);
    transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
    aspect-ratio: 1 / 1
}

.faq-toggle__icon svg {
    transition: all 0.3s ease
}

[data-faq-item].is-open .svg-plus .path.horizontal {
    display: none
}

.faq-toggle.is-open .faq-toggle__icon {
    background: var(--white)
}

.faq-toggle.is-open .faq-toggle__icon svg {
    transform: rotate(90deg)
}

.faq-answer {
    padding: 0 24px 24px 24px
}

.text-image__icon {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center
}
.bg-browngrey .text-image__icon .svg-icon .path {
    fill:var(--color-accent);
}

.text-image__icon .svg-plus .path {
    fill: var(--white)
}

.text-image__icon--minus .svg-plus .vertical.path {
    display: none
}

.text-image__content-wrapper:has(.text-image__comparison) {
    align-items: flex-start
}

.text-image__comparison-toggle {
    border-radius: 24px;
    background-color: var(--white);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 4px;
    flex-wrap: nowrap
}

.text-image__comparison-toggle .text-image__comparison-btn {
    border-radius: 24px;
    background-color: var(--white);
    transition: all 0.3s ease;
    font-weight: 700;
    font-size: 14px;
    min-height: 40px;
    width: 50%;
    cursor: pointer
}

.text-image__comparison-toggle .text-image__comparison-btn.is-active {
    background-color: var(--beige-light)
}

.comparison-carousel {
    width: 100%;
}

.comparison-carousel__viewport {
    width: 100%;
}

.comparison-carousel__item {
    width: 100%;
}

.comparison-reveal {
    --banoa-compare-position: 50%;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.comparison-reveal__base {
    position: relative;
    width: 100%;
    aspect-ratio: 1020 / 640;
    overflow: hidden;
}

.comparison-reveal__overlay {
    width: 100%;
}

.comparison-reveal__base picture,
.comparison-reveal__overlay picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}

.comparison-reveal__base img,
.comparison-reveal__overlay img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.comparison-reveal__overlay {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden;
    clip-path: inset(0 calc(100% - var(--banoa-compare-position)) 0 0);
}

.comparison-reveal__base,
.comparison-reveal__overlay {
    max-height: calc(100vh - var(--masthead-offset) - var(--comparion-elements, 0px));
}

.comparison-reveal__overlay picture,
.comparison-reveal__overlay img {
    position: absolute;
    inset: 0;
}

.comparison-reveal__divider {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--banoa-compare-position);
    width: 2px;
    background-color: var(--white);
    transform: translateX(-50%);
    box-shadow: 0 0 0 1px rgb(from var(--grey-darkest) r g b / 0.2);
    pointer-events: none;
}

.comparison-reveal__handle {
    position: absolute;
    top: 50%;
    left: var(--banoa-compare-position);
    transform: translate(-50%, -50%);
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--white);
    border: 1px solid rgb(from var(--grey-darkest) r g b / 0.2);
    box-shadow: 0 8px 20px rgb(from var(--grey-darkest) r g b / 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    pointer-events: none;
}

.comparison-reveal__handle-arrow {
    width: 8px;
    height: 8px;
    border-top: 2px solid var(--grey-dark);
    border-right: 2px solid var(--grey-dark);
}

.comparison-reveal__handle-arrow--left {
    transform: rotate(-135deg);
}

.comparison-reveal__handle-arrow--right {
    transform: rotate(45deg);
}

.comparison-reveal__range {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: ew-resize;
    z-index: 3;
}

.comparison-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.comparison-carousel__counter {
    margin: 0;
    color: var(--grey-darkest);
}

.comparison-carousel__buttons {
    display: flex;
    align-items: center;
    gap: 12px;
}

.comparison-carousel__button--prev svg {
    transform: scaleX(-1);
}
.footer-company-links__icon {
    height: 20px;
    width: auto;
    display: block;
}

.footer-menu.navigation.navigation-vertical {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex-wrap: wrap;
}
.footer-menu.navigation.navigation-vertical .menu-item a {
    font-size: 24px;
    font-weight: 600;
    padding: 5px 0;
    font-family: var(--font-family-heading);
    color: var(--text-primary);
}

.footer-menu.navigation.navigation-vertical .menu-item .menu-item a {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--font-family-body);
}

.footer-contact__icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--color-accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
}

.footer-contact__icon svg,
.footer-contact__icon img {
    max-width: 20px;
    max-height: 20px;
    width: 100%;
    height: auto;
    display: block
}

.footer-contact__link {
    display: inline-block;
    border-bottom: 2px solid var(--color-accent);
    padding-bottom: 4px
}

.footer-contact__action-link {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
    width: 100%
}
.opening-status__indicator {
    border-radius: 100%;
    width: 10px;
    height: 10px;
    background: var(--grey-medium);
}
.status-opening-soon .opening-status__indicator {
    background: var(--grey-medium);
}
.status-open .opening-status__indicator {
    background: var(--text-green-color);
}
.status-closed .opening-status__indicator {
    background: var(--text-red-color);
}

.footer-contact__action-icon svg,
.footer-contact__action-icon img {

    max-width: 20px;
    max-height: 20px;
    height: 100%;
    width: 100%;
    display: block;
    
}


.contact-method-outer-wrapper {
    max-width: 640px;
    margin: 20px auto 0;
    text-align: center
}

.contact-method-wrapper {
    display: table;
    margin: 0 auto;
    padding: 3px;
    border-radius: 8px;
    border: 1px solid #dbdbdb;
    background: #e6e6e6
}

.contact-method-wrapper::after {
    content: "";
    display: table;
    clear: both
}

.contact-method-wrapper .contact-method-element {
    position: relative;
    display: inline-block;
    float: left;
    padding: 6px 24px;
    font-size: 14px;
    line-height: 18px;
    font-family: var(--font);
    font-weight: var(--font-weight-medium);
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.4s ease, color 0.4s ease
}

.contact-method-wrapper .contact-method-element.selected {
    background: var(--white)
}
.section--contact .userFeedback {
    padding-bottom:50px;
    padding-top:50px;
}

.contact-method-wrapper .contact-method-input,
.contact-method-wrapper .contact-method-country-input {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    border: 0;
    opacity: 0
}

.contact-method-content {
    margin-top: 30px
}

.contact-method-content:not(.active),
.contact-method-country-content:not(.active) {
    display: none
}

.contact-method-content:not(.active),
.contact-method-caption {
    display: flex;
    align-items: center;
    gap: 8px
}

.online-state-wrapper .today-opening-times {
    min-width: 210px
}

.online-state-wrapper.loading .today-opening-times {
    background: #000;
    height: 30px;
    width: 210px;
    opacity: 0.05
}

.call-link {
    display: table;
    margin: 0 auto 24px;
    padding: 10px 40px;
    border: none;
    text-decoration: none;
    color: inherit
}

.online-state-wrapper {
    margin-top: 40px;
    padding: 24px 20px;
    border-radius: 24px;
    background: var(--white);
    border: 1px solid var(--grey);
    position: relative
}

.online-state-circle {
    border-radius: 100%;
    aspect-ratio: 1 / 1;
    width: 10px;
    height: 10px;
    background: var(--mediumGrey)
}

.online-state-wrapper.online .online-state-circle {
    background: var(--text-green-color)
}

.online-state-wrapper.offline .online-state-circle {
    background: var(--text-red-color)
}

.online-state-wrapper.offline .online-state-text:not(.online-state-offline) {
    display: none
}

.online-state-wrapper.online .online-state-text:not(.online-state-online) {
    display: none
}

.online-state-wrapper.soon-online .online-state-text:not(.online-state-soon-online) {
    display: none
}

.online-state-wrapper.loading .online-state-text:not(.online-state-loading) {
    display: none
}

.online-state-wrapper .online-state-loading {
    background: #000;
    height: 30px;
    width: 150px;
    opacity: 0.05
}

.align-items-centered {
    display: flex;
    align-items: center
}

.justify-center {
    display: flex;
    justify-content: center
}

.online-state-wrapper.loading::after {
    display: none
}

.toggle-all-opening-times {
    background: none;
    padding: 0 10px;
    margin: 0;
    border: none;
    color: var(--primary-text-color);
    text-transform: none;
    text-decoration: underline
}

.all-opening-times {
    margin-top: 24px
}

.contact-special-closings {
    font-weight: var(--font-weight-medium)
}


.contact-form .wrapup::after,
.contact-form::after {
    content: "";
    display: table;
    clear: both
}

.contact-form__status {
    margin-top: 10px;
    font-size: 0.9rem;
    min-height: 1.2em
}

.contact-form__status.is-loading {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--primary-text-color)
}

.contact-form__status.is-loading::before {
    content: "";
    width: 0.9em;
    height: 0.9em;
    border: 2px solid var(--grey-normal);
    border-top-color: var(--color-accent);
    border-radius: 50%;
    animation: banoa-contact-spin 0.8s linear infinite
}

.contact-form__status.is-error {
    color: #b33a3a
}

.contact-form__status.is-success {
    color: #2a3e0c
}

.contact-form__participants {
    margin-top: 10px
}

.contact-form__participants.is-complete {
    --contact-participants-state: complete
}

.contact-form__participants.is-incomplete {
    --contact-participants-state: incomplete
}

@keyframes banoa-contact-spin {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg)
    }
}

.contact-participant-card {
    border: 1px solid var(--grey-normal);
    border-radius: 5px;
    background: var(--grey-lightest)
}

.contact-participant-card.is-complete {
    border-color: var(--green)
}

.contact-participant-card__toggle {
    width: 100%;
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 14px 15px;
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left
}

.contact-participant-card__title {
    font-size: 18px;
    line-height: 1.2;
    flex: 1 1 auto
}

.contact-participant-card__status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    line-height: 1;
    color: var(--text-secondary-color)
}

.contact-participant-card__status.is-open {
    --contact-participant-status: open
}

.contact-participant-card__status.is-complete {
    --contact-participant-status: complete
}

.contact-participant-card__status-icon {
    display: inline-flex;
    align-items: center;
    line-height: 0
}

.contact-participant-card__status-icon .svg,
.contact-participant-card__status-icon svg {
    width: 14px;
    height: 14px
}

.contact-participant-card.is-complete .contact-participant-card__status {
    color: var(--primary-text-color)
}

.contact-participant-card__toggle-label {
    font-size: 14px;
    line-height: 1;
    color: var(--text-secondary-color);

        border: 1px solid #333;
            padding: 5px 7px;
            border-radius: 4px;;
}

.contact-participant-card__body {
    padding: 0 15px 15px 15px
}

.input-wrapper {
    position: relative
}

.input-wrapper.width-50 {
    max-width: calc(50% - 10px)
}

.input-label:not(.unstyled) {
    background: var(--white);
    border: 1px solid var(--mediumGrey);
    border-radius: 5px;
    display: block;
    position: relative;
    min-height: 66px
}

.input-label.checkbox {
    background: none;
    border: none;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px
}
.input-label.checkbox.focused .input-caption,
.input-label.checkbox.filled .input-caption,
.input-label.checkbox .input-caption {
    position: static;
    padding: 0;
    top: unset
}

.input-caption {
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
    top: 15px;
    transition: all 0.4s ease
}

.checkbox .input-caption {
    top: 1px
}
.input-label:not(.unstyled).radio-label {
    min-height: unset;
    padding: 5px 10px;
    cursor: pointer;
}
.input-wrapper .input.input-radio {
    width: auto;
    margin: 5px;
}

.input-wrapper .checkout-input.input-text:required:not(:placeholder-shown),
.input-wrapper .checkout-input.input-email:required:not(:placeholder-shown),
.input-wrapper .checkout-input.input-tel:required:not(:placeholder-shown) {
    background: url('data:image/svg+xml;utf8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2019.06%2019.06%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22%23d4381b%22%20stroke-miterlimit%3D%2211.34%22%20stroke-width%3D%221.5%22%20d%3D%22m18.53.53-18%2018m0-18%2018%2018%22%2F%3E%3C%2Fsvg%3E') no-repeat right center;
    background-size: 15px
}

.input-wrapper .checkout-input.input-text:valid:required,
.input-wrapper .checkout-input.input-email:valid:required,
.input-wrapper .checkout-input.input-tel:valid:required {
    background: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214.01%22%20height%3D%2210.428%22%20viewBox%3D%220%200%2014.01%2010.428%22%3E%3Cpath%20class%3D%22path%22%20d%3D%22M12.06%2C19.42l-4.77-4.8a1%2C1%2C0%2C0%2C1%2C1.39-1.43l.02.02%2C3.35%2C3.37L19.28%2C9.3a1%2C1%2C0%2C0%2C1%2C1.44%2C1.38l-.02.02-8.65%2C8.71Z%22%20transform%3D%22translate(-6.987%20-8.992)%22%20fill%3D%22%2328a835%22%2F%3E%3C%2Fsvg%3E') no-repeat right center;
    background-size: 15px
}

.input-wrapper .input.input-checkbox,
.input-wrapper .input.input-checkbox:focus {
    margin: 0;
    width: auto;
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--white);
    font: inherit;
    color: var(--color-accent);
    width: 1.15em;
    height: 1.15em;
    border: 2px solid var(--mediumGrey);
    border-radius: 0.15em;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
    cursor: pointer;
    aspect-ratio: 1 / 1;
}

.input-wrapper .input.input-checkbox:checked {
    background-color: var(--color-accent);
    border-color: var(--color-accent)
}

.input.input-checkbox::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
    transform: scale(0);
    transform-origin: bottom left;
    transition: 0.4s transform ease-in-out;
    box-shadow: inset 1em 1em var(--white);
    background-color: var(--white)
}

.input.input-checkbox:checked::before {
    transform: scale(1)
}

.input-label.filled .input-caption,
.input-label.focused .input-caption {
    font-size: 12px;
    line-height: 21px;
    color: var(--text-secondary-color);
    padding-top: 7px;
    top: 0;
    padding-bottom: 2px
}

.input-wrapper .input {
    border: none;
    background: transparent;
    padding: 0;
    margin: 0 15px 7px 15px;
    font-size: 18px;
    line-height: 23px;
    width: calc(100% - 30px)
}

.input::placeholder {
    color: transparent
}

.input-wrapper .input.input-textarea {
    margin-top: 15px;
    transition: all 0.4s ease;
    min-height: 10px;
}
.input-wrapper .filled .input.input-textarea {
    min-height: 120px;
}

.input.input-textarea::placeholder {
    color: var(--text-secondary-color);
    font-size: 16px
}

.input:focus::placeholder {
    color: var(--text-secondary-color)
}

.input-wrapper .input:focus,
.input-wrapper .input:focus-visible {
    outline: none;
    border: none
}

.input:-webkit-autofill,
.input:-webkit-autofill:hover,
.input:-webkit-autofill:focus,
.input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px var(--white) inset !important;
    background: var(--white);
    background-clip: content-box !important
}

@view-transition {
    navigation: auto
}

@keyframes kd-doc-fade-out {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes kd-doc-fade-in {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

::view-transition-old(root) {
    animation: kd-doc-fade-out 220ms ease both
}

::view-transition-new(root) {
    animation: kd-doc-fade-in 220ms ease both
}

.preheader {
    view-transition-name: none;
    position: relative;
    z-index: 100000000;
    overflow: hidden;
    max-height: none;
    opacity: 1;
    transform: translateY(0);
    will-change: max-height, margin-bottom, opacity
}

:root.kd-preheader-collapsed .preheader {
    pointer-events: none;
    visibility: hidden
}

.site-header {
    view-transition-name: kd-masthead
}

::view-transition-group(kd-masthead) {
    animation-duration: 320ms;
    animation-timing-function: cubic-bezier(.2, .8, .2, 1)
}

:root.kd-preheader-collapsed .preheader {
    view-transition-name: kd-preheader
}

@keyframes kd-preheader-out {
    from {
        transform: translateY(0);
        opacity: 1
    }

    to {
        transform: translateY(-100%);
        opacity: 0
    }
}

@keyframes kd-preheader-in {
    from {
        transform: translateY(-100%);
        opacity: 0
    }

    to {
        transform: translateY(0);
        opacity: 1
    }
}

:root.kd-preheader-collapsed::view-transition-old(kd-preheader) {
    animation: kd-preheader-out 320ms cubic-bezier(.2, .8, .2, 1) both
}

:root.kd-preheader-collapsed::view-transition-new(kd-preheader) {
    animation: kd-preheader-in 320ms cubic-bezier(.2, .8, .2, 1) both
}

@media (prefers-reduced-motion:reduce) {
    @view-transition {
        navigation: none
    }

    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation: none
    }

    ::view-transition-group(kd-masthead) {
        animation-duration: 1ms
    }

    :root.kd-preheader-collapsed::view-transition-old(kd-preheader),
    :root.kd-preheader-collapsed::view-transition-new(kd-preheader) {
        animation: none
    }
}

/* Text-Image Section: Text Overlay Styles */
.section--text-image.has-text-overlay {
    position: relative;
}

.section--text-image.has-text-overlay .text-image__content-wrapper {
    position: relative;
}

.section--text-image.has-text-overlay .text-image__content-image-wrapper {
    position: relative;
}

.section--text-image.has-text-overlay .text-image__content-content-wrapper {
    position: absolute;
    z-index: 10;
    color: var(--white);
}

/* Text Overlay: Zentriert mit schwarzem Hintergrund */
.section--text-image.text-overlay--text-overlay-black-center .text-image__content-content-wrapper {
    bottom:0;
    left:0;
    background-color: rgba(0, 0, 0, 0.6);
    color: var(--white);
    width: 100%;
    text-align: center;
}
.section--text-image.text-overlay--text-overlay-black-center .text-image__content-content-wrapper .text-image__heading {
    color: var(--white);
    font-weight: 300;
}

/* Text Overlay: Oben positioniert */
.section--text-image.text-overlay--text-overlay-top .text-image__content-content-wrapper,
.section--text-image.text-overlay--text-overlay-top-right .text-image__content-content-wrapper {
    top: 0;
    left: 0;
    text-align: left;

    top: 10%;
    left: 70px;
    font-size: 30px;
    color: #fff;
    font-weight: 400;
    font-style: italic;
    text-shadow: 1px 1px 2px #000000;
}

.section--text-image.text-overlay--text-overlay-top-right .text-image__content-content-wrapper {
    left: auto;
    right: 70px;
}
.text-image__content-content-wrapper {
    margin-left: auto;
    margin-right: auto;
}
.text-image__content-content-wrapper .btn-wrapper {
    text-align: center;
}

.text-image__content-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.text-image-content.image-text .text-image-content__media {
    order: 10;
}

.text-image-content.image-text .text-image-content__text {
    order: 20;
}

.text-image-content.text-image .text-image-content__text {
    order: 10;
}

.text-image-content.text-image .text-image-content__media {
    order: 20;
}

/* Multi-Small-Images: 100% Breite, feste Höhe, nahtlos übereinander */
.section--text-image[data-text-image-design="multi-small-images"] .text-image__content-image-wrapper,
.section--text-image[data-text-image-design="logo-bar"] .text-image__content-image-wrapper {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
}
.section--text-image[data-text-image-design="logo-bar"] .text-image__content-image-wrapper {
    gap:10px;
}

/* Bilder im multi-small-images Layout: feste Höhe und object-fit */
.section--text-image[data-text-image-design="multi-small-images"] .text-image__content-image-wrapper picture {
    flex: 1 1 calc(20% - 1px);
    min-width: calc(min(200px, 20vw) - 1px);
    height: 240px;
    overflow: hidden;
}

.section--text-image[data-text-image-design="multi-small-images"] .text-image__content-image-wrapper img,
.section--text-image[data-text-image-design="logo-bar"] .text-image__content-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.section--text-image[data-text-image-design="logo-bar"] .text-image__content-image-wrapper picture {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: calc(min(200px, 20vw) - 1px);
    width: auto;
    height: 240px;
    overflow: hidden;
    max-width: 220px;
    max-height: 80px;
}

.section--text-image[data-text-image-design="logo-bar"] .text-image__content-image-wrapper img {
    width: auto;
    height: auto;
    max-width: 220px;
    max-height: 80px;
    object-fit: contain;
}

/* 50-50 repeater grid: 2x2 without gaps */
.section--text-image[data-text-image-design="50-50"] .text-image__rpt-grid {
    gap: 0;
}

.section--text-image[data-text-image-design="50-50"] .text-image__rpt-grid > div {
    width: 50%;
}

.section--text-image[data-text-image-design="50-50"] .text-image__rpt-grid picture {
    display: block;
    width: 100%;
    height: 250px;
    overflow: hidden;
}

.section--text-image[data-text-image-design="50-50"] .text-image__rpt-grid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Floating image layout */
.section--text-image[data-text-image-design="floating-image"] .text-image__floating-container {
    overflow: auto;
}

.section--text-image[data-text-image-design="floating-image"] .text-image__floating-container::after {
    content: "";
    display: table;
    clear: both;
}
.section--text-image[data-text-image-design="3-column-image"] .text-image__content-image-wrapper {
    margin-top: 40px;
}

.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-item-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-item {
    position: relative;
    overflow: hidden;
}

.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-item .text-image__picture,
.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-item .text-image__image {
    width: 100%;
}

.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-overlay.text-overlay--text-overlay-black-center {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    background-color: rgb(from var(--color-accent) r g b / 0.8);
    color: var(--white);
    padding: 12px 14px;

    min-height: 51px;

    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}

.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-heading {
    margin: 0;
    color: var(--white);
    text-align: center;
    display: flex;
}
.section--text-image[data-text-image-design="4-column-text-overlay-image"] .text-image__4col-arrow {
    opacity: 0;
    margin-left: auto;
}
.section--text-image[data-text-image-design="4-column-text-overlay-image"] .svg-arrow-left {
    transform:rotate(180deg);
}

/* Image containers: Prevent CLS in flex layouts */
.text-image__content-image-wrapper {
    min-width: 0;
    flex-shrink: 1;
}

.text-image__content-content-wrapper {
    min-width: 0;
    flex-shrink: 1;
}

.text-image__picture {
    display: block;
    width: 100%;
    min-width: 0;
    line-height: 0;
    overflow: hidden;
}

.text-image__image {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

.site-footer hr {
    background: var(--grey-medium);
    border: none;
    max-width: 800px;
    height: 1px;
    margin: 0 auto;
}

.text-image__description {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto;
}


footer a {
    text-decoration: none;
}

.text-image__wrapper-link {
    color:inherit;
    text-decoration: none;
    display: block;
}

/* MXV Booking frontend styles (migrated from plugin) */
.mxv-hidden {
    display: none !important;
}

.mxv-checkout-form [hidden] {
    display: none !important;
}

.mxv-error {
    border-left: 4px solid var(--text-red-color);
    color: var(--text-red-color);
    background: var(--white);
    padding: 12px 16px;
    margin: 1em 0;
}

/* [mxv_prices] */
.mxv-prices-wrapper {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.mxv-product-card {
    border: 1px solid var(--grey-normal);
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    position: relative;
    display: grid;
    align-items: center;
    column-gap: 20px;
    row-gap: 10px;
}

.mxv-product-card .product-badge,
.mxv-product-card .product-description,
.mxv-product-card .price-additional {
    grid-column: 1 / -1;
}

.mxv-product-card h3 {
    margin: 0;
}

.mxv-product-card .product-badge {
    display: inline-block;
    background-color: var(--color-accent);
    color: var(--white);
    padding: 0.25em 0.75em;
    border-radius: 20px;
    font-size: 0.85em;
    margin-bottom: 0.5em;
}

.mxv-product-card .product-pricing {
    margin: 0;
    font-size: 1.3em;
    font-weight: 400;
    color: var(--text-red-color);
    text-align: right;
}

.mxv-product-card .price-additional {
    font-size: 0.9em;
    color: var(--text-secondary-color);
    margin-top: 0.5em;
}

/* [mxv_voucher_checkout] */
.mxv-checkout-form .radio-group {
    display: flex;
    flex-wrap: wrap;
}

.mxv-checkout-form .radio-label {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    padding: 0.75em 1.25em;
    border: 2px solid var(--grey-normal);
    border-radius: 4px;
    transition: all 0.3s ease;
    background: var(--white);
}

.mxv-checkout-form .radio-label:hover {
    border-color: var(--color-accent);
}

.mxv-checkout-form .radio-label input[type="radio"] {
    margin-right: 0.5em;
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.mxv-checkout-form .radio-label input[type="radio"]:checked {
    accent-color: var(--color-accent);
}

.mxv-checkout-form .radio-label:has(input[type="radio"]:checked) {
    border-color: var(--color-accent);
    background: var(--beige-light);
}

.mxv-checkout-form .radio-text {
    font-weight: 400;
}

.mxv-checkout-form .input-select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23333' d='M10.293.293a1 1 0 0 1 1.414 1.414l-5 5a1 1 0 0 1-1.414 0l-5-5A1 1 0 0 1 1.707.293L6 4.586z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1em center;
    background-size: 12px;
    padding-right: 2.5em !important;
}

.mxv-checkout-form .input-select:focus {
    border-color: var(--color-accent);
    outline: none;
    box-shadow: 0 0 0 3px rgba(239, 127, 40, 0.15);
}

.mxv-checkout-form .custom-amount-buttons .btn-secondary {
    flex: 1;
    min-width: 80px;
}

/* [mxv_order_status] */
.mxv-status-container {
    background: transparent;
}

.mxv-status-container .mxv-muted {
    color: var(--text-secondary-color);
}

.mxv-status-container .loading-box {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    min-height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.mxv-status-container .loading-spinner {
    margin: 0 auto;
    width: 60px;
    height: 60px;
    border: 5px solid #f3f3f3;
    border-top: 5px solid var(--color-accent);
    border-radius: 50%;
    animation: mxv-spin 0.8s linear infinite;
}

@keyframes mxv-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.mxv-status-container .mxv-status-loading {
    animation: mxv-fade-in 0.3s ease-in;
}

@keyframes mxv-fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.mxv-status-container .status-section {
    border-radius: 4px;
}

.mxv-status-container .status-badge {
    display: inline-block;
    padding: 0.5em 1em;
    border-radius: 4px;
    font-weight: 400;
    font-size: 1.1em;
    color: var(--white);
}

.mxv-status-container .status-paid,
.mxv-status-container .status-redeemed {
    background: var(--text-green-color);
}

.mxv-status-container .status-unpaid {
    background: var(--color-accent);
}

.mxv-status-container .status-open {
    background: var(--grey-dark);
}

.mxv-status-container .mxv-status-info {
    border-left: 4px solid var(--color-accent);
}

.mxv-status-container .mxv-status-error-message {
    border-left: 4px solid var(--text-red-color);
    color: var(--text-red-color);
}

.mxv-status-container .mxv-text-warning {
    color: var(--text-red-color);
}

/* [mxv_upcoming_dates] */
.mxv-upcoming-dates {
    display: flex;
    flex-direction: column;
    gap: 1.5em;
    margin: 2em 0;
}

.mxv-upcoming-dates .date-item {
    padding: 1em;
    border: 1px solid var(--grey-normal);
    border-radius: 5px;
    background: var(--grey-light);
}

.mxv-upcoming-dates .month-group {
    border: 1px solid var(--grey-normal);
    border-radius: 5px;
    background: var(--white);
    overflow: hidden;
}

.mxv-upcoming-dates .month-summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    padding: 1em 1.25em;
    background: var(--grey-lightest);
}

.mxv-upcoming-dates .month-summary::-webkit-details-marker {
    display: none;
}

.mxv-upcoming-dates .month-title {
    font-size: 1.1em;
    font-weight: 400;
    color: var(--text-primary);
}

.mxv-upcoming-dates .month-count {
    font-size: 0.9em;
    color: var(--text-secondary-color);
}

.mxv-upcoming-dates .month-content {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
    padding: 1em;
}

.mxv-upcoming-dates .date-detail-row {
    display: grid;
    grid-template-columns: minmax(120px, 180px) 1fr;
    gap: 0.5em;
    font-size: 0.95em;
    color: var(--text-primary);
}

.mxv-upcoming-dates .date-detail-row strong {
    color: var(--black);
}

/* [mx_google_reviews_badge] */
.mx-google-reviews-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 15px;
    background: var(--white);
    border: 1px solid var(--grey-normal);
    text-align: center;
    text-decoration: none;

    font-size: 14px;
}
.mx-google-reviews-badge.over-image {
    position: absolute;
    right: 0;
    top: calc(min(580px, (min(100vw, 1440px) * (580/1440))));
    transform: translateY(-100%);
}

.mx-google-reviews-badge:hover,
.mx-google-reviews-badge:focus,
.mx-google-reviews-badge:active {
    text-decoration: none;
}

.mx-google-reviews-badge__row-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mx-google-reviews-badge__row-rating-stars {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}
.mx-google-reviews-badge__row-rating-stars svg {
    width: auto;
    height: 22px;
}
.mx-google-reviews-badge__row-icon svg,
.mx-google-reviews-badge__row-icon .svg-google-logo {
    width: auto;
    height: 40px;
}
.mx-google-reviews-badge__row-rating-stars svg path {
    fill: #ffcc33;
}

.mx-google-reviews-badge__row-count {
    text-decoration-line: underline;
}

.section:has( .mx-google-reviews-badge__row-rating-stars) {
    position: relative;
}



.section--text-image[data-banoa-text-image-layout="horizontal_full_width"] .text-image-content {
  flex-direction: column;
  align-items: center;
}
.section--text-image[data-banoa-text-image-layout="horizontal_full_width"] .text-image-content__text.width-50 {
  width: 100%;
  max-width: 700px;
  text-align: center;
}
.section--text-image[data-banoa-text-image-layout="horizontal_full_width"] .text-image-content__media.width-50 {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: row;
  gap:100px;
}
.section--text-image[data-banoa-text-image-layout="horizontal_full_width"] .text-image-content__media img {
  width: auto;
  height: 60px;
  max-height: 36px;
  max-width: 122px;

}

.layout-horizontal-full-width .text-image-content__text .max-width-500 {
  max-width: 800px;
}

.layout-fullwidth-slider .text-image-content {
  flex-direction: column;
  align-items: center;
}

.layout-fullwidth-slider .text-image-content .text-image-content__text.width-50,
.layout-fullwidth-slider .text-image-content .text-image-content__media.width-50 {
    width:100%;
}
.layout-fullwidth-slider .text-image-content .text-image-content__text.width-50 {
  max-width: 800px;
  text-align: center;
}

.layout-fullwidth-slider .text-image-content .text-image-content__media {
    position: relative;
}

.text-image-slider {
    --text-image-slider-item-width: min(810px, 80vw);
    width: 100%;
    position: relative;
}

.text-image-slider__track {
    display: flex;
    flex-wrap: nowrap;
    gap: 25px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-inline: max(0px, calc((100% - var(--text-image-slider-item-width)) / 2));
}

.text-image-slider__track::-webkit-scrollbar {
    display: none;
}

.text-image-slider__item {
    flex: 0 0 var(--text-image-slider-item-width);
    width: var(--text-image-slider-item-width);
    scroll-snap-align: center;
    scroll-snap-stop: always;
}

.text-image-slider__item picture,
.text-image-slider__item img {
    width: 100%;
    display: block;
    height: auto;
}

.text-image-slider--match-media-size {
    width: 100%;
}

.text-image-slider--match-media-size .text-image-slider__track {
    padding-inline: 0;
}

.text-image-slider--match-media-size .text-image-slider__item {
    flex: 0 0 100%;
    width: 100%;
}

.text-image-slider__button,
.text-image-hierachial__button,
.comparison-carousel__button {
    width: 48px;
    height: 48px;
    border-radius: 999px;
    border: none;
    background-color: rgba(255, 255, 255, 0.8);
    color: var(--text-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity .2s ease;

    backdrop-filter: blur(20px);
    box-shadow: 0px 5px 10px 0px #1F1F1F1A;
}

.text-image-slider__button,
.text-image-hierachial__button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.text-image-slider__button--prev {
    left: 16px;
}

.text-image-slider__button--next {
    right: 16px;
}

.text-image-slider__button--prev > svg {
    transform: rotate(180deg);
}

.text-image-slider__button:disabled,
.text-image-hierachial__button:disabled,
.comparison-carousel__button:disabled {
    opacity: .35;
    cursor: not-allowed;
}

.checklist-ul {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin:20px 0 10px 0;
}
.checklist-li {
  position: relative;
  padding-left: 30px;
}
.preheader__item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.preheader__item::before {
  content: "";
  position: static;
  width: 20px;
  height: 16px;

  background-image: var(--banoa-button-inline-icon-secondary, none);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;

  display: flex;
  align-items: center;
  justify-content: center;
}
.checklist-li::before {  
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 16px;

  background-image: var(--banoa-button-inline-icon-secondary, none);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;

  display: flex;
  align-items: center;
  justify-content: center;
}

@media (prefers-reduced-motion: reduce) {
    .text-image-slider__track {
        scroll-behavior: auto;
    }
}

.text-image-hierachial {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.text-image-hierachial__category-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border: 1px solid var(--grey-medium);
    border-radius: 999px;
    padding: 8px;
    max-width: 860px;
    margin: 0 auto;

    box-shadow: 0px 5px 10px 0px #1F1F1F1A;
    backdrop-filter: blur(20px)
}

.text-image-hierachial__category {
    border: 1px solid transparent;
    background: transparent;
    color: var(--text-primary);
    border-radius: 999px;
    padding: 12px 22px;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.2;
    cursor: pointer;
    transition: all 0.2s ease;
}

.text-image-hierachial__category.is-active {
    background-color: var(--color-accent-transparent);
    border-color: var(--color-accent);
}

.text-image-hierachial__panel {
    width: 100%;
}

.text-image-hierachial__slider-wrap {
    position: relative;
}

.text-image-hierachial__slider {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    gap: 25px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.text-image-hierachial__slider::-webkit-scrollbar {
    display: none;
}

.text-image-hierachial__button[hidden] {
    display: none;
}

.text-image-hierachial__button--prev {
    left: 12px;
}

.text-image-hierachial__button--next {
    right: 12px;
}

.text-image-hierachial__button--prev > svg {
    transform: rotate(180deg);
}

.text-image-hierachial__subelement {
    flex: 0 0 calc(50% - 12.5px);
    width: calc(50% - 12.5px);
    min-width: calc(50% - 12.5px);
    scroll-snap-align: start;
}

.text-image-hierachial__media-wrapper {
    position: relative;
    margin-bottom: 18px;
}

.text-image-hierachial__picture,
.text-image-hierachial__image {
    width: 100%;
    display: block;
    height: auto;
}

.text-image-hierachial__tag {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 1;
    background-color: var(--white-transparent);
    color: var(--text-primary);
    border-radius: 999px;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;

    box-shadow: 0px 5px 10px 0px #1F1F1F1A;
    backdrop-filter: blur(20px)
}

.text-image-hierachial__heading {
    font-size: 24px;
}

.text-image-hierachial__content {
    font-size: 16px;
    color: var(--text-secondary);
}

.text-image-hierachial__content p {
    margin: 0;
}

@media (prefers-reduced-motion: reduce) {
    .text-image-hierachial__slider {
        scroll-behavior: auto;
    }
}

.process-steps {
    --process-steps-gap: 20px;
}

.process-steps.flex-gap-0 {
    --process-steps-gap: 0px;
}

.process-steps.flex-gap-10 {
    --process-steps-gap: 10px;
}

.process-steps.flex-gap-15 {
    --process-steps-gap: 15px;
}

.process-steps.flex-gap-20 {
    --process-steps-gap: 20px;
}

.process-steps.flex-gap-25 {
    --process-steps-gap: 25px;
}

.process-steps.flex-gap-30 {
    --process-steps-gap: 30px;
}

.process-steps.flex-gap-40 {
    --process-steps-gap: 40px;
}

.process-steps.flex-gap-50 {
    --process-steps-gap: 50px;
}

.process-steps.flex-gap-60 {
    --process-steps-gap: 60px;
}

.process-steps__item {
    flex: 0 0 calc((100% - (2 * var(--process-steps-gap))) / 3);
    width: calc((100% - (2 * var(--process-steps-gap))) / 3);
    cursor: pointer;
    position: relative;
}
.process-steps__counter {
    position: absolute;
    top:0;
    right:0;
    z-index: 1;
    color:var(--white);
    font-size: 70px;
    text-align: right;
    font-family: var(--font-family-heading);
    text-shadow: 2px 2px 4px rgba(0,0,0,0.05);
}
.process-steps__heading {
  position: relative;
  z-index: 10;
}
.process-steps__item:focus-visible {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

.process-steps__content {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 400ms ease, opacity 400ms ease;
    position: relative;
    z-index: 10;
}

.process-steps__item.is-open .process-steps__content {
    opacity: 1;
}

.section--legal-wysiwyg h1,
.section--legal-wysiwyg h2,
.section--legal-wysiwyg h3,
.section--legal-wysiwyg h4,
.section--legal-wysiwyg h5,
.section--legal-wysiwyg h6 {
    margin-top:40px;
    margin-bottom:15px;
}