@charset "UTF-8";

/* Global styles */
:root,
:host {
    --font-family-sans: "Arial", sans-serif;
    --font-family-serif: "Times New Roman", serif;
    --font-family-mono: "Courier New", sans-serif;
    --font-size: 16px;
    --font-weight: 400;
    --line-height: var(--line-height-dense);
    --text-color: var(--foreground-style-dark);
    --link-color: var(--foreground-style-accent);
    /* Font sizes */
    --font-size-2x-small: 0.625rem;
    --font-size-x-small: 0.75rem;
    --font-size-small: 0.875rem;
    --font-size-medium: 1rem;
    --font-size-large: 1.25rem;
    --font-size-x-large: 1.5rem;
    --font-size-2x-large: 2.25rem;
    --font-size-3x-large: 3rem;
    --font-size-4x-large: 4rem;
    /* Font weights */
    --font-weight-x-light: 200;
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-black: 800;
    --font-weight-x-black: 900;
    /* Line heights */
    --line-height-denser: 1;
    --line-height-dense: 1.4;
    --line-height-normal: 1.8;
    --line-height-loose: 2.2;
    --line-height-looser: 2.6;
    /* Letter spacing */
    --letter-spacing-denser: -0.03em;
    --letter-spacing-dense: -0.015em;
    --letter-spacing-normal: normal;
    --letter-spacing-loose: 0.075em;
    --letter-spacing-looser: 0.15em;
    /* Spacings */
    --spacing-3x-small: 0.125rem;
    --spacing-2x-small: 0.25rem;
    --spacing-x-small: 0.5rem;
    --spacing-small: 0.75rem;
    --spacing-medium: 1rem;
    --spacing-large: 1.25rem;
    --spacing-x-large: 1.75rem;
    --spacing-2x-large: 2.25rem;
    --spacing-3x-large: 3rem;
    --spacing-4x-large: 4rem;
    /* Border radius */
    --border-radius-xxl: 0.5rem;
    --border-radius-xl: 0.375rem;
    --border-radius-lg: 0.25rem;
    --border-radius-md: 0.125rem;
    --border-radius-sm: 0.0625rem;
    --border-radius-xs: 0.03125rem;
    --border-radius-xxs: 0.015625rem;
    --border-radius-none: 0;
    --border-radius-full: 9999px;
    /* Colors */
    --focus-ring-border: solid 1px #0A74FF;
    --focus-ring-shadow: 0 0 0 1px #0A74FF;
}

*:not(umb-tiptap-toolbar, svg) {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: var(--font-family-sans);
    font-size: var(--font-size);
    font-style: normal;
    font-weight: var(--font-weight);
    font-feature-settings: var(--font-feature-settings);
    line-height: var(--line-height);
    text-decoration: none;
    list-style: none;
    border: none;
    outline: none;
    background: none;
    color: var(--foreground, var(--text-color));
    -webkit-font-smoothing: antialiased;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 0;
}

body.is-cookies-settings-open {
    background-image: none !important;
    background: #FFF;
}

body.is-cookies-settings-open header,
body.is-cookies-settings-open main,
body.is-cookies-settings-open footer,
body.is-cookies-settings-open aside,
body.is-cookies-settings-open .page-content-container,
body.is-cookies-settings-open .body-bg-image,
body.is-cookies-settings-open .section-main-navigation {
    display: none;
}

@media screen and (max-width: 1024px) {
    body {
        padding: var(--body-padding-mobile, 0);
    }
}

@media screen and (min-width: 1025px) {
    body {
        padding: var(--body-padding-desktop, 0);
    }
}

body main {
    flex: 1;
}

a {
    color: var(--link-color);
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 767px) {
    .hide-on-mobile {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .hide-on-tablet {
        display: none !important;
    }
}

@media (min-width: 1280px) {
    .hide-on-desktop {
        display: none !important;
    }
}

.flexible-fullwidth-item {
    flex: 1 1 auto;
    width: 100%;
}

.has-highlighted-item > *:first-child {
    grid-column: 1/-1;
}

.container-media {
    container-type: inline-size;
}

.transparent-background {
    --background: transparent;
}

.light-background {
    --background: var(--background-style-light);
}

.dark-background {
    --background: var(--background-style-dark);
}

.dark-alt-background {
    --background: var(--background-style-dark-alt);
}

.accent-background {
    --background: var(--background-style-accent);
}

.accent-alt-background {
    --background: var(--background-style-accent-alt);
}

.light-foreground {
    --foreground: var(--foreground-style-light);
}

.dark-foreground {
    --foreground: var(--foreground-style-dark);
}

.dark-alt-foreground {
    --foreground: var(--foreground-style-dark-alt);
}

.accent-foreground {
    --foreground: var(--foreground-style-accent);
}

.accent-alt-foreground {
    --foreground: var(--foreground-style-accent-alt);
}

.with-border {
    border: var(--border);
    border-radius: var(--border-radius);
}

.with-shadow {
    box-shadow: var(--shadow);
}

.relative-position {
    position: relative;
    z-index: 0;
}

.invisible {
    visibility: hidden;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 0 !important;
    border: 0 !important;
}

.transparent {
    --background: transparent !important;
}

.success {
    --foreground: var(--success-color, green);
}

.danger {
    --foreground: var(--danger-color, red);
}

.warning {
    --foreground: var(--warning-color, orange);
}

.faded {
    --foreground: var(--faded-color, rgba(0, 0, 0, 0.5));
}

.striked {
    text-decoration: line-through;
}

.expired {
    filter: grayscale(100%);
}

section,
header,
footer {
    --section-width: 100%;
    --section-wrapper-width: var(--wide-content-width);
    --wide-content-width: var(--section-wide-content-width, 1200px);
    --narrow-content-width: var(--section-narrow-content-width, 740px);
    width: var(--section-wrapper-width);
}

section > .wrapper,
header > .wrapper,
footer > .wrapper {
    color: inherit;
    width: var(--section-wrapper-width);
    max-width: 100%;
    margin-inline: auto;
}

section > .wrapper > .section__body,
header > .wrapper > .section__body,
footer > .wrapper > .section__body {
    max-width: 100%;
}

section.narrow-content > .wrapper,
header.narrow-content > .wrapper,
footer.narrow-content > .wrapper {
    width: var(--section-wrapper-width);
}

section.narrow-content > .wrapper > .section__body,
header.narrow-content > .wrapper > .section__body,
footer.narrow-content > .wrapper > .section__body {
    width: var(--narrow-content-width);
}

section.wide-content > .wrapper,
header.wide-content > .wrapper,
footer.wide-content > .wrapper {
    --section-wrapper-width: var(--wide-content-width);
}

section.full-content > .wrapper,
header.full-content > .wrapper,
footer.full-content > .wrapper {
    --section-wrapper-width: 100%;
}

section.fullwidth,
header.fullwidth,
footer.fullwidth {
    --section-width: 100%;
    max-width: 100%;
}

section:not(.fullwidth),
header:not(.fullwidth),
footer:not(.fullwidth) {
    margin: auto;
    width: var(--wide-content-width);
    max-width: 100%;
}

section.centered-content > .wrapper > .section__body,
header.centered-content > .wrapper > .section__body,
footer.centered-content > .wrapper > .section__body {
    justify-items: center;
}

section.centered-content > .wrapper > .section__body,
section.centered-content > .wrapper > .section__body > *,
header.centered-content > .wrapper > .section__body,
header.centered-content > .wrapper > .section__body > *,
footer.centered-content > .wrapper > .section__body,
footer.centered-content > .wrapper > .section__body > * {
    margin-inline: auto;
}

main {
    display: flex;
    flex-direction: column;
}

main > section:last-child {
    flex: 1;
}

.content-aligned-to-top {
    align-items: start !important;
}

.content-aligned-to-center {
    align-items: center !important;
}

.content-aligned-to-bottom {
    align-items: end !important;
}

.content-justified-to-left {
    justify-content: start !important;
}

.content-justified-to-center {
    justify-content: center !important;
}

.content-justified-to-right {
    justify-content: end !important;
}

@media (max-width: 1024px) {
    h1 {
        font-size: var(--h1-font-size-mobile, inherit);
        font-weight: var(--h1-font-weight-mobile, inherit);
        line-height: var(--h1-line-height-mobile, inherit);
        letter-spacing: var(--h1-letter-spacing-mobile, inherit);
    }
}

@media (min-width: 1025px) {
    h1 {
        font-size: var(--h1-font-size-desktop, inherit);
        font-weight: var(--h1-font-weight-desktop, inherit);
        line-height: var(--h1-line-height-desktop, inherit);
        letter-spacing: var(--h1-letter-spacing-desktop, inherit);
    }
}

@media (max-width: 1024px) {
    h2 {
        font-size: var(--h2-font-size-mobile, inherit);
        font-weight: var(--h2-font-weight-mobile, inherit);
        line-height: var(--h2-line-height-mobile, inherit);
        letter-spacing: var(--h2-letter-spacing-mobile, inherit);
    }
}

@media (min-width: 1025px) {
    h2 {
        font-size: var(--h2-font-size-desktop, inherit);
        font-weight: var(--h2-font-weight-desktop, inherit);
        line-height: var(--h2-line-height-desktop, inherit);
        letter-spacing: var(--h2-letter-spacing-desktop, inherit);
    }
}

@media (max-width: 1024px) {
    h3 {
        font-size: var(--h3-font-size-mobile, inherit);
        font-weight: var(--h3-font-weight-mobile, inherit);
        line-height: var(--h3-line-height-mobile, inherit);
        letter-spacing: var(--h3-letter-spacing-mobile, inherit);
    }
}

@media (min-width: 1025px) {
    h3 {
        font-size: var(--h3-font-size-desktop, inherit);
        font-weight: var(--h3-font-weight-desktop, inherit);
        line-height: var(--h3-line-height-desktop, inherit);
        letter-spacing: var(--h3-letter-spacing-desktop, inherit);
    }
}

@media (max-width: 1024px) {
    h4 {
        font-size: var(--h4-font-size-mobile, inherit);
        font-weight: var(--h4-font-weight-mobile, inherit);
        line-height: var(--h4-line-height-mobile, inherit);
        letter-spacing: var(--h4-letter-spacing-mobile, inherit);
    }
}

@media (min-width: 1025px) {
    h4 {
        font-size: var(--h4-font-size-desktop, inherit);
        font-weight: var(--h4-font-weight-desktop, inherit);
        line-height: var(--h4-line-height-desktop, inherit);
        letter-spacing: var(--h4-letter-spacing-desktop, inherit);
    }
}

@media (max-width: 1024px) {
    .display-xs {
        font-size: var(--display-xs-font-size-mobile, inherit);
        line-height: var(--display-xs-line-height-mobile, inherit);
        letter-spacing: var(--display-xs-letter-spacing-mobile, inherit);
    }
}

@media (min-width: 1025px) {
    .display-xs {
        font-size: var(--display-xs-font-size-desktop, inherit);
        line-height: var(--display-xs-line-height-desktop, inherit);
        letter-spacing: var(--display-xs-letter-spacing-desktop, inherit);
    }
}

@media screen and (max-width: 1024px) {
    .display-sm {
        font-size: var(--display-sm-font-size-mobile, inherit);
        line-height: var(--display-sm-line-height-mobile, inherit);
        letter-spacing: var(--display-sm-letter-spacing-mobile, inherit);
    }
}

@media screen and (min-width: 1025px) {
    .display-sm {
        font-size: var(--display-sm-font-size-desktop, inherit);
        line-height: var(--display-sm-line-height-desktop, inherit);
        letter-spacing: var(--display-sm-letter-spacing-desktop, inherit);
    }
}

@media screen and (max-width: 1024px) {
    .display-md {
        font-size: var(--display-md-font-size-mobile, inherit);
        line-height: var(--display-md-line-height-mobile, inherit);
        letter-spacing: var(--display-md-letter-spacing-mobile, inherit);
    }
}

@media screen and (min-width: 1025px) {
    .display-md {
        font-size: var(--display-md-font-size-desktop, inherit);
        line-height: var(--display-md-line-height-desktop, inherit);
        letter-spacing: var(--display-md-letter-spacing-desktop, inherit);
    }
}

@media screen and (max-width: 1024px) {
    .display-lg {
        font-size: var(--display-lg-font-size-mobile, inherit);
        line-height: var(--display-lg-line-height-mobile, inherit);
        letter-spacing: var(--display-lg-letter-spacing-mobile, inherit);
    }
}

@media screen and (min-width: 1025px) {
    .display-lg {
        font-size: var(--display-lg-font-size-desktop, inherit);
        line-height: var(--display-lg-line-height-desktop, inherit);
        letter-spacing: var(--display-lg-letter-spacing-desktop, inherit);
    }
}

@media screen and (max-width: 1024px) {
    .display-xl {
        font-size: var(--display-xl-font-size-mobile, inherit);
        line-height: var(--display-xl-line-height-mobile, inherit);
        letter-spacing: var(--display-xl-letter-spacing-mobile, inherit);
    }
}

@media screen and (min-width: 1025px) {
    .display-xl {
        font-size: var(--display-xl-font-size-desktop, inherit);
        line-height: var(--display-xl-line-height-desktop, inherit);
        letter-spacing: var(--display-xl-letter-spacing-desktop, inherit);
    }
}

@media screen and (max-width: 1024px) {
    .display-2xl {
        font-size: var(--display-2xl-font-size-mobile, inherit);
        line-height: var(--display-2xl-line-height-mobile, inherit);
        letter-spacing: var(--display-2xl-letter-spacing-mobile, inherit);
    }
}

@media screen and (min-width: 1025px) {
    .display-2xl {
        font-size: var(--display-2xl-font-size-desktop, inherit);
        line-height: var(--display-2xl-line-height-desktop, inherit);
        letter-spacing: var(--display-2xl-letter-spacing-desktop, inherit);
    }
}

.text-xs {
    font-size: var(--text-xs-font-size, var(--font-size-x-small));
    line-height: var(--text-xs-line-height, var(--line-height-dense));
}

.text-sm {
    font-size: var(--text-sm-font-size, var(--font-size-small));
    line-height: var(--text-sm-line-height, var(--line-height-dense));
}

p,
address,
ul,
ol,
li,
dl,
dt,
dd,
table,
th,
td,
.text-md {
    font-size: var(--text-md-font-size, var(--font-size-medium));
    line-height: var(--text-md-line-height, var(--line-height-dense));
}

.text-lg {
    font-size: var(--text-lg-font-size, var(--font-size-large));
    line-height: var(--text-lg-line-height, var(--line-height-dense));
}

.text-xl {
    font-size: var(--text-xl-font-size, var(--font-size-x-large));
    line-height: var(--text-xl-line-height, var(--line-height-dense));
}

.x-light {
    font-weight: var(--font-weight-x-light);
}

.light {
    font-weight: var(--font-weight-light);
}

.regular {
    font-weight: var(--font-weight-normal);
}

.medium {
    font-weight: var(--font-weight-medium);
}

.semibold,
strong,
b {
    font-weight: var(--font-weight-semibold);
}

.bold {
    font-weight: var(--font-weight-bold);
}

.black {
    font-weight: var(--font-weight-black);
}

.x-black {
    font-weight: var(--font-weight-x-black);
}

.italic,
em,
i {
    font-style: italic;
}

ul,
ol {
    padding: var(--list-padding, 0);
    margin: var(--list-margin, 0);
    font-size: inherit;
    line-height: inherit;
}

ul li,
ol li {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

ul li:not(:last-child),
ol li:not(:last-child) {
    margin-bottom: var(--list-item-margin-bottom, 0.5em);
}

ol {
    counter-reset: main-counter;
    list-style-type: none;
}

ol > li {
    counter-increment: main-counter;
    padding-left: var(--list-ordered-item-padding-left, 2em);
    position: relative;
}

ol > li:before {
    content: counter(main-counter, decimal) ".";
    display: inline-block;
    text-align: left;
    position: absolute;
    left: 0;
    top: 0;
}

ol > li ol {
    margin: var(--list-nested-margin, 1em);
}

ol > li ol > li {
    list-style-type: none;
    padding-left: var(--list-ordered-item-padding-left, 2em);
}

ol > li ol > li:before {
    content: counter(main-counter, lower-alpha) ")";
    display: inline-block;
    text-align: center;
}

ul {
    counter-reset: main-counter;
    list-style-type: none;
}

ul > li {
    counter-increment: main-counter;
    padding-left: var(--list-unsorted-item-padding-left, 2em);
    position: relative;
}

ul > li::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: var(--list-bullet-top-offset, 0.45em);
    left: 0;
    width: var(--list-bullet-width, auto);
    height: var(--list-bullet-height, auto);
    background-color: currentColor;
    mask: var(--list-bullet-svg) no-repeat center/contain;
    -webkit-mask: var(--list-bullet-svg) no-repeat center/contain;
}

ul > li ul {
    margin: var(--list-nested-margin, 1em);
}

ul > li ul > li {
    list-style-type: none;
    padding-left: var(--list-unsorted-item-padding-left, 2em);
}

ul > li ul > li::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: var(--list-bullet-top-offset, 0.45em);
    left: 0;
    width: var(--list-bullet-width, auto);
    height: var(--list-bullet-height, auto);
    background-color: currentColor;
    mask: var(--list-bullet-svg) no-repeat center/contain;
    -webkit-mask: var(--list-bullet-svg) no-repeat center/contain;
}

.reset ol,
.reset ul,
.reset li {
    all: unset;
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
}

.reset ol::after,
.reset ol::before,
.reset ul::after,
.reset ul::before,
.reset li::after,
.reset li::before {
    display: none;
}

h1,
h2,
h3,
h4,
p,
address,
ul,
ol,
li,
dl,
dt,
dd {
    max-width: var(--max-content-width, inherit);
    width: 100%;
}

h1.fullwidth,
h2.fullwidth,
h3.fullwidth,
h4.fullwidth,
p.fullwidth,
address.fullwidth,
ul.fullwidth,
ol.fullwidth,
li.fullwidth,
dl.fullwidth,
dt.fullwidth,
dd.fullwidth {
    --max-content-width: 100%;
}

.layout.apply-margins + *,
.grid.apply-margins + *,
picture.apply-margins + *,
figure.apply-margins + *,
img.apply-margins + * {
    margin-top: var(--default-margin-top, inherit);
}

* + *:not(.button-set):not(.badge-set):not(.bento-boxes):not(.signpost):not(h1):not(h2):not(h3):not(h4).apply-margins,
* + .layout:not(.button-set):not(.badge-set):not(.bento-boxes):not(.signpost).apply-margins,
* + .grid.apply-margins,
* + picture.apply-margins,
* + figure.apply-margins,
* + img.apply-margins {
    margin-top: var(--default-margin-top, inherit);
}

.badge-set.apply-margins + * {
    margin-top: var(--default-margin-top, inherit);
}

*.apply-margins + * {
    margin-top: var(--default-margin-top, inherit);
}

*.apply-margins + .button-set {
    margin-top: var(--buttons-margin-top, inherit);
}

*.apply-margins + .badge-set {
    margin-top: var(--badges-margin-top, inherit);
}

[class*=body] > * + p {
    margin-top: 12px;
}

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

    h1:not(:first-child),
    h1 + .apply-margins {
        margin-top: var(--h1-margin-top-mobile, 40px);
    }

    h1:not(:last-child) {
        margin-bottom: var(--h1-margin-bottom-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {

    h1:not(:first-child),
    h1 + .apply-margins {
        margin-top: var(--h1-margin-top-desktop, 48px);
    }

    h1:not(:last-child) {
        margin-bottom: var(--h1-margin-bottom-desktop, 24px);
    }
}

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

    h2:not(:first-child),
    h2 + .apply-margins {
        margin-top: var(--h2-margin-top-mobile, 32px);
    }

    h2:not(:last-child) {
        margin-bottom: var(--h2-margin-bottom-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {

    h2:not(:first-child),
    h2 + .apply-margins {
        margin-top: var(--h2-margin-top-desktop, 40px);
    }

    h2:not(:last-child) {
        margin-bottom: var(--h2-margin-bottom-desktop, 20px);
    }
}

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

    h3:not(:first-child),
    h3 + .apply-margins {
        margin-top: var(--h3-margin-top-mobile, 32px);
    }

    h3:not(:last-child) {
        margin-bottom: var(--h3-margin-bottom-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {

    h3:not(:first-child),
    h3 + .apply-margins {
        margin-top: var(--h3-margin-top-desktop, 32px);
    }

    h3:not(:last-child) {
        margin-bottom: var(--h3-margin-bottom-desktop, 16px);
    }
}

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

    h4:not(:first-child),
    h4 + .apply-margins {
        margin-top: var(--h4-margin-top-mobile, 20px);
    }

    h4:not(:last-child) {
        margin-bottom: var(--h4-margin-bottom-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {

    h4:not(:first-child),
    h4 + .apply-margins {
        margin-top: var(--h4-margin-top-desktop, 32px);
    }

    h4:not(:last-child) {
        margin-bottom: var(--h4-margin-bottom-desktop, 12px);
    }
}

h1 + .button-set,
h1 + .box-button,
h1 + .icon-button,
h1 + .link-button,
h2 + .button-set,
h2 + .box-button,
h2 + .icon-button,
h2 + .link-button,
h3 + .button-set,
h3 + .box-button,
h3 + .icon-button,
h3 + .link-button,
h4 + .button-set,
h4 + .box-button,
h4 + .icon-button,
h4 + .link-button,
p + .button-set,
p + .box-button,
p + .icon-button,
p + .link-button,
ul + .button-set,
ul + .box-button,
ul + .icon-button,
ul + .link-button,
ol + .button-set,
ol + .box-button,
ol + .icon-button,
ol + .link-button,
table + .button-set,
table + .box-button,
table + .icon-button,
table + .link-button {
    margin-top: var(--buttons-margin-top, 20px);
}

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

    p:not(:first-child),
    ul:not(:first-child),
    ol:not(:first-child),
    dl:not(:first-child),
    table:not(:first-child) {
        margin-top: var(--p-margin-top-mobile, 0);
    }

    p:not(:last-child),
    ul:not(:last-child),
    ol:not(:last-child),
    dl:not(:last-child),
    table:not(:last-child) {
        margin-bottom: var(--p-margin-bottom-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {

    p:not(:first-child),
    ul:not(:first-child),
    ol:not(:first-child),
    dl:not(:first-child),
    table:not(:first-child) {
        margin-top: var(--p-margin-top-desktop, 0);
    }

    p:not(:last-child),
    ul:not(:last-child),
    ol:not(:last-child),
    dl:not(:last-child),
    table:not(:last-child) {
        margin-bottom: var(--p-margin-bottom-desktop, 16px);
    }
}

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

    .badge-set:not(:first-child),
    .badge-set + h1,
    .badge-set + h2,
    .badge-set + h3,
    .badge-set + h4 {
        margin-top: var(--badge-set-margin-top-mobile, 12px);
    }

    .badge-set:not(:last-child) {
        margin-bottom: var(--badge-set-margin-bottom-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {

    .badge-set:not(:first-child),
    .badge-set + h1,
    .badge-set + h2,
    .badge-set + h3,
    .badge-set + h4 {
        margin-top: var(--badge-set-margin-top-desktop, 12px);
    }

    .badge-set:not(:last-child) {
        margin-bottom: var(--badge-set-margin-bottom-desktop, 12px);
    }
}

.reset-margins,
.reset-margins > * {
    margin: 0;
}

.background-layer + * {
    margin-top: 0;
}

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

@media screen and (max-width: 1024px) {
    .padding-top-xxs {
        padding-top: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-xxs {
        padding-top: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-top-xs {
        padding-top: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-xs {
        padding-top: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-top-sm {
        padding-top: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-sm {
        padding-top: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-top-md {
        padding-top: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-md {
        padding-top: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-top-lg {
        padding-top: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-lg {
        padding-top: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-top-xl {
        padding-top: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-xl {
        padding-top: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-top-xxl {
        padding-top: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-top-xxl {
        padding-top: var(--padding-xxl-desktop, 64px);
    }
}

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

@media screen and (max-width: 1024px) {
    .padding-bottom-xxs {
        padding-bottom: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-xxs {
        padding-bottom: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-bottom-xs {
        padding-bottom: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-xs {
        padding-bottom: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-bottom-sm {
        padding-bottom: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-sm {
        padding-bottom: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-bottom-md {
        padding-bottom: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-md {
        padding-bottom: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-bottom-lg {
        padding-bottom: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-lg {
        padding-bottom: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-bottom-xl {
        padding-bottom: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-xl {
        padding-bottom: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-bottom-xxl {
        padding-bottom: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-bottom-xxl {
        padding-bottom: var(--padding-xxl-desktop, 64px);
    }
}

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

@media screen and (max-width: 1024px) {
    .padding-left-xxs {
        padding-left: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-xxs {
        padding-left: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-left-xs {
        padding-left: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-xs {
        padding-left: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-left-sm {
        padding-left: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-sm {
        padding-left: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-left-md {
        padding-left: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-md {
        padding-left: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-left-lg {
        padding-left: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-lg {
        padding-left: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-left-xl {
        padding-left: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-xl {
        padding-left: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-left-xxl {
        padding-left: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-left-xxl {
        padding-left: var(--padding-xxl-desktop, 64px);
    }
}

.padding-right-none {
    padding-top: 0;
}

@media screen and (max-width: 1024px) {
    .padding-right-xxs {
        padding-right: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-xxs {
        padding-right: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-right-xs {
        padding-right: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-xs {
        padding-right: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-right-sm {
        padding-right: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-sm {
        padding-right: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-right-md {
        padding-right: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-md {
        padding-right: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-right-lg {
        padding-right: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-lg {
        padding-right: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-right-xl {
        padding-right: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-xl {
        padding-right: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-right-xxl {
        padding-right: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-right-xxl {
        padding-right: var(--padding-xxl-desktop, 64px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-xxs {
        padding-inline: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-xxs {
        padding-inline: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-xs {
        padding-inline: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-xs {
        padding-inline: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-sm {
        padding-inline: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-sm {
        padding-inline: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-md {
        padding-inline: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-md {
        padding-inline: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-lg {
        padding-inline: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-lg {
        padding-inline: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-xl {
        padding-inline: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-xl {
        padding-inline: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-inline-xxl {
        padding-inline: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-inline-xxl {
        padding-inline: var(--padding-xxl-desktop, 64px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-xxs {
        padding-block: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-xxs {
        padding-block: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-xs {
        padding-block: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-xs {
        padding-block: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-sm {
        padding-block: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-sm {
        padding-block: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-md {
        padding-block: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-md {
        padding-block: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-lg {
        padding-block: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-lg {
        padding-block: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-xl {
        padding-block: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-xl {
        padding-block: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-block-xxl {
        padding-block: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-block-xxl {
        padding-block: var(--padding-xxl-desktop, 64px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-xxs {
        padding: var(--padding-xxs-mobile, 4px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-xxs {
        padding: var(--padding-xxs-desktop, 8px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-xs {
        padding: var(--padding-xs-mobile, 8px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-xs {
        padding: var(--padding-xs-desktop, 16px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-sm {
        padding: var(--padding-sm-mobile, 12px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-sm {
        padding: var(--padding-sm-desktop, 24px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-md {
        padding: var(--padding-md-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-md {
        padding: var(--padding-md-desktop, 32px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-lg {
        padding: var(--padding-lg-mobile, 20px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-lg {
        padding: var(--padding-lg-desktop, 40px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-xl {
        padding: var(--padding-xl-mobile, 24px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-xl {
        padding: var(--padding-xl-desktop, 48px);
    }
}

@media screen and (max-width: 1024px) {
    .padding-xxl {
        padding: var(--padding-xxl-mobile, 32px);
    }
}

@media screen and (min-width: 1025px) {
    .padding-xxl {
        padding: var(--padding-xxl-desktop, 64px);
    }
}

.margin-top-none {
    margin-top: 0 !important;
}

.margin-top-xxs {
    margin-top: var(--spacing-2x-small);
}

.margin-top-xs {
    margin-top: var(--spacing-x-small);
}

.margin-top-sm {
    margin-top: var(--spacing-small);
}

.margin-top-md {
    margin-top: var(--spacing-medium);
}

.margin-top-lg {
    margin-top: var(--spacing-large);
}

.margin-top-xl {
    margin-top: var(--spacing-x-large);
}

.margin-top-2xl {
    margin-top: var(--spacing-2x-large);
}

.margin-top-3xl {
    margin-top: var(--spacing-3x-large);
}

.margin-top-4xl {
    margin-top: var(--spacing-4x-large);
}

.margin-bottom-none {
    margin-bottom: 0 !important;
}

.margin-bottom-xxs {
    margin-bottom: var(--spacing-2x-small);
}

.margin-bottom-xs {
    margin-bottom: var(--spacing-x-small);
}

.margin-bottom-sm {
    margin-bottom: var(--spacing-small);
}

.margin-bottom-md {
    margin-bottom: var(--spacing-medium);
}

.margin-bottom-lg {
    margin-bottom: var(--spacing-large);
}

.margin-bottom-xl {
    margin-bottom: var(--spacing-x-large);
}

.margin-bottom-2xl {
    margin-bottom: var(--spacing-2x-large);
}

.margin-bottom-3xl {
    margin-bottom: var(--spacing-3x-large);
}

.margin-bottom-4xl {
    margin-bottom: var(--spacing-4x-large);
}

.margin-left-none {
    margin-left: 0 !important;
}

.margin-left-xxs {
    margin-left: var(--spacing-2x-small);
}

.margin-left-xs {
    margin-left: var(--spacing-x-small);
}

.margin-left-sm {
    margin-left: var(--spacing-small);
}

.margin-left-md {
    margin-left: var(--spacing-medium);
}

.margin-left-lg {
    margin-left: var(--spacing-large);
}

.margin-left-xl {
    margin-left: var(--spacing-x-large);
}

.margin-left-2xl {
    margin-left: var(--spacing-2x-large);
}

.margin-left-3xl {
    margin-left: var(--spacing-3x-large);
}

.margin-left-4xl {
    margin-left: var(--spacing-4x-large);
}

.margin-right-none {
    margin-right: 0 !important;
}

.margin-right-xxs {
    margin-right: var(--spacing-2x-small);
}

.margin-right-xs {
    margin-right: var(--spacing-x-small);
}

.margin-right-sm {
    margin-right: var(--spacing-small);
}

.margin-right-md {
    margin-right: var(--spacing-medium);
}

.margin-right-lg {
    margin-right: var(--spacing-large);
}

.margin-right-xl {
    margin-right: var(--spacing-x-large);
}

.margin-right-2xl {
    margin-right: var(--spacing-2x-large);
}

.margin-right-3xl {
    margin-right: var(--spacing-3x-large);
}

.margin-right-4xl {
    margin-right: var(--spacing-4x-large);
}

.row-gap-3x-small {
    --row-gap: var(--spacing-3x-small);
}

.row-gap-2x-small {
    --row-gap: var(--spacing-2x-small);
}

.row-gap-x-small {
    --row-gap: var(--spacing-x-small);
}

.row-gap-small {
    --row-gap: var(--spacing-small);
}

.row-gap-medium {
    --row-gap: var(--spacing-medium);
}

.row-gap-large {
    --row-gap: var(--spacing-large);
}

.row-gap-x-large {
    --row-gap: var(--spacing-x-large);
}

.row-gap-2x-large {
    --row-gap: var(--spacing-2x-large);
}

.row-gap-3x-large {
    --row-gap: var(--spacing-3x-large);
}

.row-gap-4x-large {
    --row-gap: var(--spacing-4x-large);
}

.column-gap-3x-small {
    --column-gap: var(--spacing-3x-small);
}

.column-gap-2x-small {
    --column-gap: var(--spacing-2x-small);
}

.column-gap-x-small {
    --column-gap: var(--spacing-x-small);
}

.column-gap-small {
    --column-gap: var(--spacing-small);
}

.column-gap-medium {
    --column-gap: var(--spacing-medium);
}

.column-gap-large {
    --column-gap: var(--spacing-large);
}

.column-gap-x-large {
    --column-gap: var(--spacing-x-large);
}

.column-gap-2x-large {
    --column-gap: var(--spacing-2x-large);
}

.column-gap-3x-large {
    --column-gap: var(--spacing-3x-large);
}

.column-gap-4x-large {
    --column-gap: var(--spacing-4x-large);
}

/* Atoms */
.spacer {
    display: flow-root;
}

picture {
    overflow: hidden;
    max-width: 100%;
    border-radius: var(--image-border-radius);
}

picture.circle {
    --image-border-radius: 9999px;
    --image-aspect-ratio: 1 / 1;
}

picture,
picture img {
    position: relative;
    display: block;
    margin: 0;
    width: 100%;
    height: 100%;
    transition: all 0.35s;
    aspect-ratio: var(--image-aspect-ratio, auto);
    object-fit: cover;
}

picture.link:hover img {
    transform: var(--image-transform, scale(1.05));
}

picture > a.link {
    position: absolute;
    z-index: 99;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

picture .overlay {
    position: absolute;
    z-index: 10;
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--image-overlay-background, rgba(0, 0, 0, 0.5));
    color: var(--image-overlay-color, white);
}

picture .overlay span {
    display: flex;
    color: var(--image-overlay-color) !important;
    font-size: var(--image-overlay-size);
    font-weight: var(--image-overlay-font-weight, var(--font-weight-regular));
    line-height: var(--image-overlay-line-height, var(--line-height-x-large));
}

picture .overlay span svg {
    width: var(--image-overlay-size);
    height: var(--image-overlay-size);
    color: inherit !important;
}

picture .overlay span svg,
picture .overlay span svg > * {
    color: var(--image-overlay-color);
}

figure.picture figcaption {
    margin-top: var(--image-caption-margin-top, 1.25rem);
    font-family: var(--image-caption-font-family, inherit);
    font-size: var(--image-caption-font-size, inherit);
    color: var(--image-caption-color, rgba(0, 0, 0, 0.55));
}

figure.picture figcaption.left {
    text-align: left;
}

figure.picture figcaption.right {
    text-align: right;
}

figure.picture figcaption.center {
    text-align: center;
}

video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
    border-radius: var(--video-border-radius, inherit);
}

.video-embed {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    border-radius: var(--video-embed-border-radius, var(--image-border-radius, 0));
    overflow: hidden;
}

.video-embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

.box-button {
    --box-shadow: var(--button-box-shadow, none);
    --size: 40px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 150ms;
    outline: none;
    width: fit-content;
    min-height: var(--size);
    cursor: pointer;
    color: var(--foreground, inherit);
    background: var(--background, transparent);
    border: var(--border, none);
    border-radius: var(--border-radius, 0);
    box-shadow: var(--box-shadow, none);
    padding: var(--padding, 0);
}

.box-button span {
    font-family: var(--button-font-family, var(--font-family-sans));
    font-weight: var(--button-font-weight, var(--font-weight-regular));
    color: inherit;
}

.box-button > svg {
    color: var(--foreground);
}

.box-button.small {
    --border-radius: var(--button-small-border-radius);
    --size: var(--button-small-height);
    --padding: var(--button-small-padding, 10px 16px);
    gap: var(--button-small-gap, 4px);
}

.box-button.small svg {
    max-width: var(--button-small-icon-size, 20px);
    max-height: var(--button-small-icon-size, 20px);
}

.box-button.small span {
    font-size: var(--button-small-font-size, 14px);
    line-height: var(--button-small-line-height, 20px);
}

.box-button.medium {
    --border-radius: var(--button-medium-border-radius);
    --size: var(--button-medium-height);
    --padding: var(--button-medium-padding, 12px 20px);
    gap: var(--button-medium-gap, 4px);
}

.box-button.medium svg {
    max-width: var(--button-medium-icon-size, 20px);
    max-height: var(--button-medium-icon-size, 20px);
}

.box-button.medium span {
    font-size: var(--button-medium-font-size, 16px);
    line-height: var(--button-medium-line-height, 24px);
}

.box-button.large {
    --border-radius: var(--button-large-border-radius);
    --size: var(--button-large-height);
    --padding: var(--button-large-padding, 16px 28px);
    gap: var(--button-large-gap, 6px);
}

.box-button.large svg {
    max-width: var(--button-large-icon-size, 24px);
    max-height: var(--button-large-icon-size, 24px);
}

.box-button.large span {
    font-size: var(--button-large-font-size, 18px);
    line-height: var(--button-large-line-height, 28px);
}

.box-button.solid.color-a {
    --background: var(--button-color-a-solid-background, transparent);
    --foreground: var(--button-color-a-solid-color, inherit);
    --border: var(--button-color-a-solid-border, none);
    --box-shadow: var(--button-color-a-solid-box-shadow, none);
}

.box-button.solid.color-a:hover,
.box-button.solid.color-a.active {
    --background: var(--button-color-a-solid-background-hover, transparent);
    --foreground: var(--button-color-a-solid-color-hover, inherit);
    --border: var(--button-color-a-solid-border-hover, none);
    --box-shadow: var(--button-color-a-solid-box-shadow-hover, none);
}

.box-button.solid.color-b {
    --background: var(--button-color-b-solid-background, transparent);
    --foreground: var(--button-color-b-solid-color, inherit);
    --border: var(--button-color-b-solid-border, none);
    --box-shadow: var(--button-color-b-solid-box-shadow, none);
}

.box-button.solid.color-b:hover,
.box-button.solid.color-b.active {
    --background: var(--button-color-b-solid-background-hover, transparent);
    --foreground: var(--button-color-b-solid-color-hover, inherit);
    --border: var(--button-color-b-solid-border-hover, none);
    --box-shadow: var(--button-color-b-solid-box-shadow-hover, none);
}

.box-button.solid.inverse {
    --background: var(--button-inverse-solid-background, transparent);
    --foreground: var(--button-inverse-solid-color, inherit);
    --border: var(--button-inverse-solid-border, none);
    --box-shadow: var(--button-inverse-solid-box-shadow, none);
}

.box-button.solid.inverse:hover,
.box-button.solid.inverse.active {
    --background: var(--button-inverse-solid-background-hover, transparent);
    --foreground: var(--button-inverse-solid-color-hover, inherit);
    --border: var(--button-inverse-solid-border-hover, none);
    --box-shadow: var(--button-inverse-solid-box-shadow-hover, none);
}

.box-button.solid[disabled],
.box-button.solid[disabled]:hover,
.box-button.solid[aria-disabled=true],
.box-button.solid[aria-disabled=true]:hover,
.box-button.solid:disabled,
.box-button.solid:disabled:hover {
    --background: var(--button-disabled-solid-background, transparent);
    --foreground: var(--button-disabled-solid-color, inherit);
    --border: var(--button-disabled-solid-border, none);
    --box-shadow: var(--button-disabled-solid-box-shadow, none);
}

.box-button.outline.color-a {
    --background: var(--button-color-a-outline-background, transparent);
    --foreground: var(--button-color-a-outline-color, inherit);
    --border: var(--button-color-a-outline-border, none);
    --box-shadow: var(--button-color-a-outline-box-shadow, none);
}

.box-button.outline.color-a:hover,
.box-button.outline.color-a.active {
    --background: var(--button-color-a-outline-background-hover, transparent);
    --foreground: var(--button-color-a-outline-color-hover, inherit);
    --border: var(--button-color-a-outline-border-hover, none);
    --box-shadow: var(--button-color-a-outline-box-shadow-hover, none);
}

.box-button.outline.color-b {
    --background: var(--button-color-b-outline-background, transparent);
    --foreground: var(--button-color-b-outline-color, inherit);
    --border: var(--button-color-b-outline-border, none);
    --box-shadow: var(--button-color-b-outline-box-shadow, none);
}

.box-button.outline.color-b:hover,
.box-button.outline.color-b.active {
    --background: var(--button-color-b-outline-background-hover, transparent);
    --foreground: var(--button-color-b-outline-color-hover, inherit);
    --border: var(--button-color-b-outline-border-hover, none);
    --box-shadow: var(--button-color-b-outline-box-shadow-hover, none);
}

.box-button.outline.inverse {
    --background: var(--button-inverse-outline-background, transparent);
    --foreground: var(--button-inverse-outline-color, inherit);
    --border: var(--button-inverse-outline-border, none);
    --box-shadow: var(--button-inverse-outline-box-shadow, none);
}

.box-button.outline.inverse:hover,
.box-button.outline.inverse.active {
    --background: var(--button-inverse-outline-background-hover, transparent);
    --foreground: var(--button-inverse-outline-color-hover, inherit);
    --border: var(--button-inverse-outline-border-hover, none);
    --box-shadow: var(--button-inverse-outline-box-shadow-hover, none);
}

.box-button.outline[disabled],
.box-button.outline[disabled]:hover,
.box-button.outline[aria-disabled=true],
.box-button.outline[aria-disabled=true]:hover,
.box-button.outline:disabled,
.box-button.outline:disabled:hover {
    --background: var(--button-disabled-outline-background, transparent);
    --foreground: var(--button-disabled-outline-color, inherit);
    --border: var(--button-disabled-outline-border, none);
    --box-shadow: var(--button-disabled-outline-box-shadow, none);
}

.box-button.ghost.color-a {
    --background: var(--button-color-a-ghost-background, transparent);
    --foreground: var(--button-color-a-ghost-color, inherit);
    --border: var(--button-color-a-ghost-border, none);
    --box-shadow: var(--button-color-a-ghost-box-shadow, none);
}

.box-button.ghost.color-a:hover,
.box-button.ghost.color-a.active {
    --background: var(--button-color-a-ghost-background-hover, transparent);
    --foreground: var(--button-color-a-ghost-color-hover, inherit);
    --border: var(--button-color-a-ghost-border-hover, none);
    --box-shadow: var(--button-color-a-ghost-box-shadow-hover, none);
}

.box-button.ghost.color-b {
    --background: var(--button-color-b-ghost-background, transparent);
    --foreground: var(--button-color-b-ghost-color, inherit);
    --border: var(--button-color-b-ghost-border, none);
    --box-shadow: var(--button-color-b-ghost-box-shadow, none);
}

.box-button.ghost.color-b:hover,
.box-button.ghost.color-b.active {
    --background: var(--button-color-b-ghost-background-hover, transparent);
    --foreground: var(--button-color-b-ghost-color-hover, inherit);
    --border: var(--button-color-b-ghost-border-hover, none);
    --box-shadow: var(--button-color-b-ghost-box-shadow-hover, none);
}

.box-button.ghost.inverse {
    --background: var(--button-inverse-ghost-background, transparent);
    --foreground: var(--button-inverse-ghost-color, inherit);
    --border: var(--button-inverse-ghost-border, none);
    --box-shadow: var(--button-inverse-ghost-box-shadow, none);
}

.box-button.ghost.inverse:hover,
.box-button.ghost.inverse.active {
    --background: var(--button-inverse-ghost-background-hover, transparent);
    --foreground: var(--button-inverse-ghost-color-hover, inherit);
    --border: var(--button-inverse-ghost-border-hover, none);
    --box-shadow: var(--button-inverse-ghost-box-shadow-hover, none);
}

.box-button.ghost[disabled],
.box-button.ghost[disabled]:hover,
.box-button.ghost[aria-disabled=true],
.box-button.ghost[aria-disabled=true]:hover,
.box-button.ghost:disabled,
.box-button.ghost:disabled:hover {
    --background: var(--button-disabled-ghost-background, transparent);
    --foreground: var(--button-disabled-ghost-color, inherit);
    --border: var(--button-disabled-ghost-border, none);
    --box-shadow: var(--button-disabled-ghost-box-shadow, none);
}

.box-button.extra.color-a {
    --background: var(--button-color-a-extra-background, transparent);
    --foreground: var(--button-color-a-extra-color, inherit);
    --border: var(--button-color-a-extra-border, none);
    --box-shadow: var(--button-color-a-extra-box-shadow, none);
    --button-small-border-radius: var(--button-small-color-a-extra-border-radius, inherit);
    --button-small-height: var(--button-small-color-a-extra-height, inherit);
    --button-small-padding: var(--button-small-color-a-extra-padding, inherit);
    --button-small-gap: var(--button-small-color-a-extra-gap, inherit);
    --button-small-icon-size: var(--button-small-color-a-extra-icon-size, inherit);
    --button-small-font-size: var(--button-small-color-a-extra-font-size, inherit);
    --button-small-line-height: var(--button-small-color-a-extra-line-height, inherit);
    --button-medium-border-radius: var(--button-medium-color-a-extra-border-radius, inherit);
    --button-medium-height: var(--button-medium-color-a-extra-height, inherit);
    --button-medium-padding: var(--button-medium-color-a-extra-padding, inherit);
    --button-medium-gap: var(--button-medium-color-a-extra-gap, inherit);
    --button-medium-icon-size: var(--button-medium-color-a-extra-icon-size, inherit);
    --button-medium-font-size: var(--button-medium-color-a-extra-font-size, inherit);
    --button-medium-line-height: var(--button-medium-color-a-extra-line-height, inherit);
    --button-large-border-radius: var(--button-large-color-a-extra-border-radius, inherit);
    --button-large-height: var(--button-large-color-a-extra-height, inherit);
    --button-large-padding: var(--button-large-color-a-extra-padding, inherit);
    --button-large-gap: var(--button-large-color-a-extra-gap, inherit);
    --button-large-icon-size: var(--button-large-color-a-extra-icon-size, inherit);
    --button-large-font-size: var(--button-large-color-a-extra-font-size, inherit);
    --button-large-line-height: var(--button-large-color-a-extra-line-height, inherit);
}

.box-button.extra.color-a:hover,
.box-button.extra.color-a:active {
    --background: var(--button-color-a-extra-background-hover, transparent);
    --foreground: var(--button-color-a-extra-color-hover, inherit);
    --border: var(--button-color-a-extra-border-hover, none);
    --box-shadow: var(--button-color-a-extra-box-shadow-hover, none);
    --button-small-border-radius: var(--button-small-color-a-extra-border-radius-hover, inherit);
    --button-small-height: var(--button-small-color-a-extra-height-hover, inherit);
    --button-small-padding: var(--button-small-color-a-extra-padding-hover, inherit);
    --button-small-gap: var(--button-small-color-a-extra-gap-hover, inherit);
    --button-small-icon-size: var(--button-small-color-a-extra-icon-size-hover, inherit);
    --button-small-font-size: var(--button-small-color-a-extra-font-size-hover, inherit);
    --button-small-line-height: var(--button-small-color-a-extra-line-height-hover, inherit);
    --button-medium-border-radius: var(--button-medium-color-a-extra-border-radius-hover, inherit);
    --button-medium-height: var(--button-medium-color-a-extra-height-hover, inherit);
    --button-medium-padding: var(--button-medium-color-a-extra-padding-hover, inherit);
    --button-medium-gap: var(--button-medium-color-a-extra-gap-hover, inherit);
    --button-medium-icon-size: var(--button-medium-color-a-extra-icon-size-hover, inherit);
    --button-medium-font-size: var(--button-medium-color-a-extra-font-size-hover, inherit);
    --button-medium-line-height: var(--button-medium-color-a-extra-line-height-hover, inherit);
    --button-large-border-radius: var(--button-large-color-a-extra-border-radius-hover, inherit);
    --button-large-height: var(--button-large-color-a-extra-height-hover, inherit);
    --button-large-padding: var(--button-large-color-a-extra-padding-hover, inherit);
    --button-large-gap: var(--button-large-color-a-extra-gap-hover, inherit);
    --button-large-icon-size: var(--button-large-color-a-extra-icon-size-hover, inherit);
    --button-large-font-size: var(--button-large-color-a-extra-font-size-hover, inherit);
    --button-large-line-height: var(--button-large-color-a-extra-line-height-hover, inherit);
}

.box-button.extra.color-b {
    --background: var(--button-color-b-extra-background, transparent);
    --foreground: var(--button-color-b-extra-color, inherit);
    --border: var(--button-color-b-extra-border, none);
    --box-shadow: var(--button-color-b-extra-box-shadow, none);
    --button-small-border-radius: var(--button-small-color-b-extra-border-radius, inherit);
    --button-small-height: var(--button-small-color-b-extra-height, inherit);
    --button-small-padding: var(--button-small-color-b-extra-padding, inherit);
    --button-small-gap: var(--button-small-color-b-extra-gap, inherit);
    --button-small-icon-size: var(--button-small-color-b-extra-icon-size, inherit);
    --button-small-font-size: var(--button-small-color-b-extra-font-size, inherit);
    --button-small-line-height: var(--button-small-color-b-extra-line-height, inherit);
    --button-medium-border-radius: var(--button-medium-color-b-extra-border-radius, inherit);
    --button-medium-height: var(--button-medium-color-b-extra-height, inherit);
    --button-medium-padding: var(--button-medium-color-b-extra-padding, inherit);
    --button-medium-gap: var(--button-medium-color-b-extra-gap, inherit);
    --button-medium-icon-size: var(--button-medium-color-b-extra-icon-size, inherit);
    --button-medium-font-size: var(--button-medium-color-b-extra-font-size, inherit);
    --button-medium-line-height: var(--button-medium-color-b-extra-line-height, inherit);
    --button-large-border-radius: var(--button-large-color-b-extra-border-radius, inherit);
    --button-large-height: var(--button-large-color-b-extra-height, inherit);
    --button-large-padding: var(--button-large-color-b-extra-padding, inherit);
    --button-large-gap: var(--button-large-color-b-extra-gap, inherit);
    --button-large-icon-size: var(--button-large-color-b-extra-icon-size, inherit);
    --button-large-font-size: var(--button-large-color-b-extra-font-size, inherit);
    --button-large-line-height: var(--button-large-color-b-extra-line-height, inherit);
}

.box-button.extra.color-b:hover,
.box-button.extra.color-b:active {
    --background: var(--button-color-b-extra-background-hover, transparent);
    --foreground: var(--button-color-b-extra-color-hover, inherit);
    --border: var(--button-color-b-extra-border-hover, none);
    --box-shadow: var(--button-color-b-extra-box-shadow-hover, none);
    --button-small-border-radius: var(--button-small-color-b-extra-border-radius-hover, inherit);
    --button-small-height: var(--button-small-color-b-extra-height-hover, inherit);
    --button-small-padding: var(--button-small-color-b-extra-padding-hover, inherit);
    --button-small-gap: var(--button-small-color-b-extra-gap-hover, inherit);
    --button-small-icon-size: var(--button-small-color-b-extra-icon-size-hover, inherit);
    --button-small-font-size: var(--button-small-color-b-extra-font-size-hover, inherit);
    --button-small-line-height: var(--button-small-color-b-extra-line-height-hover, inherit);
    --button-medium-border-radius: var(--button-medium-color-b-extra-border-radius-hover, inherit);
    --button-medium-height: var(--button-medium-color-b-extra-height-hover, inherit);
    --button-medium-padding: var(--button-medium-color-b-extra-padding-hover, inherit);
    --button-medium-gap: var(--button-medium-color-b-extra-gap-hover, inherit);
    --button-medium-icon-size: var(--button-medium-color-b-extra-icon-size-hover, inherit);
    --button-medium-font-size: var(--button-medium-color-b-extra-font-size-hover, inherit);
    --button-medium-line-height: var(--button-medium-color-b-extra-line-height-hover, inherit);
    --button-large-border-radius: var(--button-large-color-b-extra-border-radius-hover, inherit);
    --button-large-height: var(--button-large-color-b-extra-height-hover, inherit);
    --button-large-padding: var(--button-large-color-b-extra-padding-hover, inherit);
    --button-large-gap: var(--button-large-color-b-extra-gap-hover, inherit);
    --button-large-icon-size: var(--button-large-color-b-extra-icon-size-hover, inherit);
    --button-large-font-size: var(--button-large-color-b-extra-font-size-hover, inherit);
    --button-large-line-height: var(--button-large-color-b-extra-line-height-hover, inherit);
}

.box-button.extra.inverse {
    --background: var(--button-inverse-extra-background, transparent);
    --foreground: var(--button-inverse-extra-color, inherit);
    --border: var(--button-inverse-extra-border, none);
    --box-shadow: var(--button-inverse-extra-box-shadow, none);
    --button-small-border-radius: var(--button-small-inverse-extra-border-radius, inherit);
    --button-small-height: var(--button-small-inverse-extra-height, inherit);
    --button-small-padding: var(--button-small-inverse-extra-padding, inherit);
    --button-small-gap: var(--button-small-inverse-extra-gap, inherit);
    --button-small-icon-size: var(--button-small-inverse-extra-icon-size, inherit);
    --button-small-font-size: var(--button-small-inverse-extra-font-size, inherit);
    --button-small-line-height: var(--button-small-inverse-extra-line-height, inherit);
    --button-medium-border-radius: var(--button-medium-inverse-extra-border-radius, inherit);
    --button-medium-height: var(--button-medium-inverse-extra-height, inherit);
    --button-medium-padding: var(--button-medium-inverse-extra-padding, inherit);
    --button-medium-gap: var(--button-medium-inverse-extra-gap, inherit);
    --button-medium-icon-size: var(--button-medium-inverse-extra-icon-size, inherit);
    --button-medium-font-size: var(--button-medium-inverse-extra-font-size, inherit);
    --button-medium-line-height: var(--button-medium-inverse-extra-line-height, inherit);
    --button-large-border-radius: var(--button-large-inverse-extra-border-radius, inherit);
    --button-large-height: var(--button-large-inverse-extra-height, inherit);
    --button-large-padding: var(--button-large-inverse-extra-padding, inherit);
    --button-large-gap: var(--button-large-inverse-extra-gap, inherit);
    --button-large-icon-size: var(--button-large-inverse-extra-icon-size, inherit);
    --button-large-font-size: var(--button-large-inverse-extra-font-size, inherit);
    --button-large-line-height: var(--button-large-inverse-extra-line-height, inherit);
}

.box-button.extra.inverse:hover,
.box-button.extra.inverse:active {
    --background: var(--button-inverse-extra-background-hover, transparent);
    --foreground: var(--button-inverse-extra-color-hover, inherit);
    --border: var(--button-inverse-extra-border-hover, none);
    --box-shadow: var(--button-inverse-extra-box-shadow-hover, none);
    --button-small-border-radius: var(--button-small-inverse-extra-border-radius-hover, inherit);
    --button-small-height: var(--button-small-inverse-extra-height-hover, inherit);
    --button-small-padding: var(--button-small-inverse-extra-padding-hover, inherit);
    --button-small-gap: var(--button-small-inverse-extra-gap-hover, inherit);
    --button-small-icon-size: var(--button-small-inverse-extra-icon-size-hover, inherit);
    --button-small-font-size: var(--button-small-inverse-extra-font-size-hover, inherit);
    --button-small-line-height: var(--button-small-inverse-extra-line-height-hover, inherit);
    --button-medium-border-radius: var(--button-medium-inverse-extra-border-radius-hover, inherit);
    --button-medium-height: var(--button-medium-inverse-extra-height-hover, inherit);
    --button-medium-padding: var(--button-medium-inverse-extra-padding-hover, inherit);
    --button-medium-gap: var(--button-medium-inverse-extra-gap-hover, inherit);
    --button-medium-icon-size: var(--button-medium-inverse-extra-icon-size-hover, inherit);
    --button-medium-font-size: var(--button-medium-inverse-extra-font-size-hover, inherit);
    --button-medium-line-height: var(--button-medium-inverse-extra-line-height-hover, inherit);
    --button-large-border-radius: var(--button-large-inverse-extra-border-radius-hover, inherit);
    --button-large-height: var(--button-large-inverse-extra-height-hover, inherit);
    --button-large-padding: var(--button-large-inverse-extra-padding-hover, inherit);
    --button-large-gap: var(--button-large-inverse-extra-gap-hover, inherit);
    --button-large-icon-size: var(--button-large-inverse-extra-icon-size-hover, inherit);
    --button-large-font-size: var(--button-large-inverse-extra-font-size-hover, inherit);
    --button-large-line-height: var(--button-large-inverse-extra-line-height-hover, inherit);
}

.box-button.extra[disabled],
.box-button.extra[disabled]:hover,
.box-button.extra[aria-disabled=true],
.box-button.extra[aria-disabled=true]:hover,
.box-button.extra:disabled,
.box-button.extra:disabled:hover {
    --background: var(--button-disabled-extra-background, transparent);
    --foreground: var(--button-disabled-extra-color, inherit);
    --border: var(--button-disabled-extra-border, none);
    --box-shadow: var(--button-disabled-extra-box-shadow, none);
}

.box-button:focus-visible {
    box-shadow: var(--focus-ring-shadow) !important;
}

.box-button[disabled],
.box-button[aria-disabled=true],
.box-button:disabled {
    cursor: not-allowed;
}

.icon-button {
    --box-shadow: var(--button-box-shadow, none);
    --size: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color 150ms;
    outline: none;
    width: var(--size);
    height: var(--size);
    cursor: pointer;
    color: var(--foreground, inherit);
    background: var(--background, transparent);
    border: var(--border, none);
    border-radius: var(--border-radius, 0);
    box-shadow: var(--box-shadow, none);
}

.icon-button span {
    display: flex;
    color: var(--foreground);
    width: var(--icon-size);
    height: var(--icon-size);
}

.icon-button span svg {
    color: var(--foreground);
    width: var(--icon-size);
    height: var(--icon-size);
}

.icon-button.solid.color-a {
    --background: var(--button-color-a-solid-background, transparent);
    --foreground: var(--button-color-a-solid-color, inherit);
    --border: var(--button-color-a-solid-border, none);
    --box-shadow: var(--button-color-a-solid-box-shadow, none);
}

.icon-button.solid.color-a:hover,
.icon-button.solid.color-a.active {
    --background: var(--button-color-a-solid-background-hover, transparent);
    --foreground: var(--button-color-a-solid-color-hover, inherit);
    --border: var(--button-color-a-solid-border-hover, none);
    --box-shadow: var(--button-color-a-solid-box-shadow-hover, none);
}

.icon-button.solid.color-b {
    --background: var(--button-color-b-solid-background, transparent);
    --foreground: var(--button-color-b-solid-color, inherit);
    --border: var(--button-color-b-solid-border, none);
    --box-shadow: var(--button-color-b-solid-box-shadow, none);
}

.icon-button.solid.color-b:hover,
.icon-button.solid.color-b.active {
    --background: var(--button-color-b-solid-background-hover, transparent);
    --foreground: var(--button-color-b-solid-color-hover, inherit);
    --border: var(--button-color-b-solid-border-hover, none);
    --box-shadow: var(--button-color-b-solid-box-shadow-hover, none);
}

.icon-button.solid.inverse {
    --background: var(--button-inverse-solid-background, transparent);
    --foreground: var(--button-inverse-solid-color, inherit);
    --border: var(--button-inverse-solid-border, none);
    --box-shadow: var(--button-inverse-solid-box-shadow, none);
}

.icon-button.solid.inverse:hover,
.icon-button.solid.inverse.active {
    --background: var(--button-inverse-solid-background-hover, transparent);
    --foreground: var(--button-inverse-solid-color-hover, inherit);
    --border: var(--button-inverse-solid-border-hover, none);
    --box-shadow: var(--button-inverse-solid-box-shadow-hover, none);
}

.icon-button.solid[disabled],
.icon-button.solid[disabled]:hover,
.icon-button.solid[aria-disabled=true],
.icon-button.solid[aria-disabled=true]:hover,
.icon-button.solid:disabled,
.icon-button.solid:disabled:hover {
    --background: var(--button-disabled-solid-background, transparent);
    --foreground: var(--button-disabled-solid-color, inherit);
    --border: var(--button-disabled-solid-border, none);
    --box-shadow: var(--button-disabled-solid-box-shadow, none);
}

.icon-button.outline.color-a {
    --background: var(--button-color-a-outline-background, transparent);
    --foreground: var(--button-color-a-outline-color, inherit);
    --border: var(--button-color-a-outline-border, none);
    --box-shadow: var(--button-color-a-outline-box-shadow, none);
}

.icon-button.outline.color-a:hover,
.icon-button.outline.color-a.active {
    --background: var(--button-color-a-outline-background-hover, transparent);
    --foreground: var(--button-color-a-outline-color-hover, inherit);
    --border: var(--button-color-a-outline-border-hover, none);
    --box-shadow: var(--button-color-a-outline-box-shadow-hover, none);
}

.icon-button.outline.color-b {
    --background: var(--button-color-b-outline-background, transparent);
    --foreground: var(--button-color-b-outline-color, inherit);
    --border: var(--button-color-b-outline-border, none);
    --box-shadow: var(--button-color-b-outline-box-shadow, none);
}

.icon-button.outline.color-b:hover,
.icon-button.outline.color-b.active {
    --background: var(--button-color-b-outline-background-hover, transparent);
    --foreground: var(--button-color-b-outline-color-hover, inherit);
    --border: var(--button-color-b-outline-border-hover, none);
    --box-shadow: var(--button-color-b-outline-box-shadow-hover, none);
}

.icon-button.outline.inverse {
    --background: var(--button-inverse-outline-background, transparent);
    --foreground: var(--button-inverse-outline-color, inherit);
    --border: var(--button-inverse-outline-border, none);
    --box-shadow: var(--button-inverse-outline-box-shadow, none);
}

.icon-button.outline.inverse:hover,
.icon-button.outline.inverse.active {
    --background: var(--button-inverse-outline-background-hover, transparent);
    --foreground: var(--button-inverse-outline-color-hover, inherit);
    --border: var(--button-inverse-outline-border-hover, none);
    --box-shadow: var(--button-inverse-outline-box-shadow-hover, none);
}

.icon-button.outline[disabled],
.icon-button.outline[disabled]:hover,
.icon-button.outline[aria-disabled=true],
.icon-button.outline[aria-disabled=true]:hover,
.icon-button.outline:disabled,
.icon-button.outline:disabled:hover {
    --background: var(--button-disabled-outline-background, transparent);
    --foreground: var(--button-disabled-outline-color, inherit);
    --border: var(--button-disabled-outline-border, none);
    --box-shadow: var(--button-disabled-outline-box-shadow, none);
}

.icon-button.ghost.color-a {
    --background: var(--button-color-a-ghost-background, transparent);
    --foreground: var(--button-color-a-ghost-color, inherit);
    --border: var(--button-color-a-ghost-border, none);
    --box-shadow: var(--button-color-a-ghost-box-shadow, none);
}

.icon-button.ghost.color-a:hover,
.icon-button.ghost.color-a.active {
    --background: var(--button-color-a-ghost-background-hover, transparent);
    --foreground: var(--button-color-a-ghost-color-hover, inherit);
    --border: var(--button-color-a-ghost-border-hover, none);
    --box-shadow: var(--button-color-a-ghost-box-shadow-hover, none);
}

.icon-button.ghost.color-b {
    --background: var(--button-color-b-ghost-background, transparent);
    --foreground: var(--button-color-b-ghost-color, inherit);
    --border: var(--button-color-b-ghost-border, none);
    --box-shadow: var(--button-color-b-ghost-box-shadow, none);
}

.icon-button.ghost.color-b:hover,
.icon-button.ghost.color-b.active {
    --background: var(--button-color-b-ghost-background-hover, transparent);
    --foreground: var(--button-color-b-ghost-color-hover, inherit);
    --border: var(--button-color-b-ghost-border-hover, none);
    --box-shadow: var(--button-color-b-ghost-box-shadow-hover, none);
}

.icon-button.ghost.inverse {
    --background: var(--button-inverse-ghost-background, transparent);
    --foreground: var(--button-inverse-ghost-color, inherit);
    --border: var(--button-inverse-ghost-border, none);
    --box-shadow: var(--button-inverse-ghost-box-shadow, none);
}

.icon-button.ghost.inverse:hover,
.icon-button.ghost.inverse.active {
    --background: var(--button-inverse-ghost-background-hover, transparent);
    --foreground: var(--button-inverse-ghost-color-hover, inherit);
    --border: var(--button-inverse-ghost-border-hover, none);
    --box-shadow: var(--button-inverse-ghost-box-shadow-hover, none);
}

.icon-button.ghost[disabled],
.icon-button.ghost[disabled]:hover,
.icon-button.ghost[aria-disabled=true],
.icon-button.ghost[aria-disabled=true]:hover,
.icon-button.ghost:disabled,
.icon-button.ghost:disabled:hover {
    --background: var(--button-disabled-ghost-background, transparent);
    --foreground: var(--button-disabled-ghost-color, inherit);
    --border: var(--button-disabled-ghost-border, none);
    --box-shadow: var(--button-disabled-ghost-box-shadow, none);
}

.icon-button.small {
    --border-radius: var(--button-small-border-radius);
    --size: var(--button-small-height);
}

.icon-button.small svg {
    --icon-size: var(--button-small-icon-size, 20px);
}

.icon-button.medium {
    --border-radius: var(--button-medium-border-radius);
    --size: var(--button-medium-height);
}

.icon-button.medium svg {
    --icon-size: var(--button-medium-icon-size, 20px);
}

.icon-button.large {
    --border-radius: var(--button-large-border-radius);
    --size: var(--button-large-height);
}

.icon-button.large svg {
    --icon-size: var(--button-large-icon-size, 24px);
}

.icon-button:focus-visible {
    box-shadow: var(--focus-ring-shadow) !important;
}

.icon-button[disabled],
.icon-button[aria-disabled=true],
.icon-button:disabled {
    cursor: not-allowed;
}

a:not(.box-button, .link-button, .icon-button) {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap, var(--link-gap, 4px));
    width: fit-content;
    color: var(--foreground, inherit);
    border: var(--border, none);
    box-shadow: var(--box-shadow, none);
    border-radius: var(--border-radius, 0);
    transition: all 150ms;
    padding: var(--padding, 0);
    font-family: var(--link-font-family, inherit);
    font-weight: var(--link-font-weight, inherit);
    font-size: var(--link-font-size, inherit);
    line-height: var(--link-line-height, inherit);
    text-decoration: var(--link-decoration, inherit);
    text-underline-offset: 0.3em;
    vertical-align: baseline;
}

a:not(.box-button, .link-button, .icon-button) svg {
    color: inherit;
    height: 1em;
    width: 1em;
}

a:not(.box-button, .link-button, .icon-button).color-a {
    --foreground: var(--link-color-a-foreground, inherit);
    --background: var(--link-color-a-background, transparent);
    --border: var(--link-color-a-border, none);
    --box-shadow: var(--link-color-a-box-shadow, none);
    --border-radius: var(--link-color-a-border-radius, 0);
    --padding: var(--link-color-a-padding, 0);
    --link-decoration: var(--link-color-a-decoration, inherit);
}

a:not(.box-button, .link-button, .icon-button).color-a:hover {
    --foreground: var(--link-color-a-foreground-hover, inherit);
    --background: var(--link-color-a-background-hover, transparent);
    --border: var(--link-color-a-border-hover, none);
    --box-shadow: var(--link-color-a-box-shadow-hover, none);
    --border-radius: var(--link-color-a-border-radius-hover, 0);
    --padding: var(--link-color-a-padding-hover, 0);
    --link-decoration: var(--link-color-a-decoration-hover, inherit);
}

a:not(.box-button, .link-button, .icon-button).color-b {
    --foreground: var(--link-color-b-foreground, inherit);
    --background: var(--link-color-b-background, transparent);
    --border: var(--link-color-b-border, none);
    --box-shadow: var(--link-color-b-box-shadow, none);
    --border-radius: var(--link-color-b-border-radius, 0);
    --padding: var(--link-color-b-padding, 0);
    --link-decoration: var(--link-color-b-decoration, inherit);
}

a:not(.box-button, .link-button, .icon-button).color-b:hover {
    --foreground: var(--link-color-b-foreground-hover, inherit);
    --background: var(--link-color-b-background-hover, transparent);
    --border: var(--link-color-b-border-hover, none);
    --box-shadow: var(--link-color-b-box-shadow-hover, none);
    --border-radius: var(--link-color-b-border-radius-hover, 0);
    --padding: var(--link-color-b-padding-hover, 0);
    --link-decoration: var(--link-color-b-decoration-hover, inherit);
}

a:not(.box-button, .link-button, .icon-button).inverse {
    --foreground: var(--link-inverse-foreground, inherit);
    --background: var(--link-inverse-background, transparent);
    --border: var(--link-inverse-border, none);
    --box-shadow: var(--link-inverse-box-shadow, none);
    --border-radius: var(--link-inverse-border-radius, 0);
    --padding: var(--link-inverse-padding, 0);
    --link-decoration: var(--link-inverse-decoration, inherit);
}

a:not(.box-button, .link-button, .icon-button).inverse:hover {
    --foreground: var(--link-inverse-foreground-hover, inherit);
    --background: var(--link-inverse-background-hover, transparent);
    --border: var(--link-inverse-border-hover, none);
    --box-shadow: var(--link-inverse-box-shadow-hover, none);
    --border-radius: var(--link-inverse-border-radius-hover, 0);
    --padding: var(--link-inverse-padding-hover, 0);
    --link-decoration: var(--link-inverse-decoration-hover, inherit);
}

.link-button {
    --box-shadow: var(--button-box-shadow, none);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color 150ms;
    outline: none;
    width: fit-content;
    cursor: pointer;
    color: var(--foreground, inherit);
    border-radius: var(--border-radius, 0);
    box-shadow: var(--box-shadow, none);
}

.link-button span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--button-gap);
    font-family: var(--button-font-family, var(--font-family-sans));
    font-weight: var(--button-font-weight, var(--font-weight-regular));
    color: var(--foreground);
}

.link-button span span {
    white-space: normal;
    overflow-wrap: anywhere;
}

.link-button:not([disabled]):hover span {
    text-decoration: underline;
    text-underline-offset: 0.25rem;
}

.link-button > svg {
    color: var(--foreground);
}

.link-button.color-a {
    --foreground: var(--link-button-color-a-color, var(--button-color-a-ghost-color, inherit));
    --border: var(--link-button-color-a-border, var(--button-color-a-ghost-border, none));
    --box-shadow: var(--link-button-color-a-box-shadow, var(--button-color-a-ghost-box-shadow, none));
}

.link-button.color-a:hover,
.link-button.color-a.active {
    --foreground: var(--link-button-color-a-color-hover, var(--button-color-a-ghost-color-hover, inherit));
    --border: var(--link-button-color-a-border-hover, var(--button-color-a-ghost-border-hover, none));
    --box-shadow: var(--link-button-color-a-box-shadow-hover, var(--button-color-a-ghost-box-shadow-hover, none));
}

.link-button.color-b {
    --foreground: var(--link-button-color-b-color, var(--button-color-b-ghost-color, inherit));
    --border: var(--link-button-color-b-border, var(--button-color-b-ghost-border, none));
    --box-shadow: var(--link-button-color-b-box-shadow, var(--button-color-b-ghost-box-shadow, none));
}

.link-button.color-b:hover,
.link-button.color-b.active {
    --foreground: var(--link-button-color-b-color-hover, var(--button-color-b-ghost-color-hover, inherit));
    --border: var(--link-button-color-b-border-hover, var(--button-color-b-ghost-border-hover, none));
    --box-shadow: var(--link-button-color-b-box-shadow-hover, var(--button-color-b-ghost-box-shadow-hover, none));
}

.link-button.inverse {
    --foreground: var(--link-button-inverse-color, var(--button-inverse-ghost-color, inherit));
    --border: var(--link-button-inverse-border, var(--button-inverse-ghost-border, none));
    --box-shadow: var(--link-button-inverse-box-shadow, var(--button-inverse-ghost-box-shadow, none));
}

.link-button.inverse:hover,
.link-button.inverse.active {
    --foreground: var(--link-button-inverse-color-hover, var(--button-inverse-ghost-color-hover, inherit));
    --border: var(--link-button-inverse-border-hover, var(--button-inverse-ghost-border-hover, none));
    --box-shadow: var(--link-button-inverse-box-shadow-hover, var(--button-inverse-ghost-box-shadow-hover, none));
}

.link-button[disabled],
.link-button[disabled]:hover,
.link-button[aria-disabled=true],
.link-button[aria-disabled=true]:hover,
.link-button:disabled,
.link-button:disabled:hover {
    --foreground: var(--button-disabled-ghost-color, inherit);
    --border: var(--button-disabled-ghost-border, none);
    --box-shadow: var(--button-disabled-ghost-box-shadow, none);
}

.link-button.small {
    --button-gap: var(--button-small-gap, 4px);
}

.link-button.small svg {
    width: var(--button-small-icon-size, 20px);
    height: var(--button-small-icon-size, 20px);
}

.link-button.small span {
    font-size: var(--button-small-font-size, 14px);
    line-height: var(--button-small-line-height, 20px);
}

.link-button.medium {
    --button-gap: var(--button-medium-gap, 4px);
}

.link-button.medium svg {
    width: var(--button-medium-icon-size, 20px);
    height: var(--button-medium-icon-size, 20px);
}

.link-button.medium span {
    font-size: var(--button-medium-font-size, 16px);
    line-height: var(--button-medium-line-height, 24px);
}

.link-button.large {
    --button-gap: var(--button-large-gap, 6px);
}

.link-button.large svg {
    width: var(--button-large-icon-size, 24px);
    height: var(--button-large-icon-size, 24px);
}

.link-button.large span {
    font-size: var(--button-large-font-size, 18px);
    line-height: var(--button-large-line-height, 28px);
}

.link-button:focus-visible {
    box-shadow: var(--focus-ring-shadow) !important;
}

.link-button[disabled],
.link-button[aria-disabled=true],
.link-button:disabled {
    cursor: not-allowed;
}

section {
    width: var(--section-width, 100%);
    background: var(--background, transparent);
    color: var(--foreground);
    border: var(--border);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    padding: var(--padding-block, 0) var(--padding-inline, 0);
}

section.style-default {
    --background: var(--section-background-default-style);
    --foreground: var(--section-foreground-default-style);
    --border: var(--section-border-default-style);
    --border-radius: var(--section-border-radius-default-style);
    --box-shadow: var(--section-box-shadow-default-style);
}

@media screen and (max-width: 1024px) {
    section.style-default {
        --padding-block: var(--section-padding-block-default-style-mobile);
        --padding-inline: var(--section-padding-inline-default-style-mobile);
    }
}

@media screen and (min-width: 1025px) {
    section.style-default {
        --padding-block: var(--section-padding-block-default-style-desktop);
        --padding-inline: var(--section-padding-inline-default-style-desktop);
    }
}

section.style-alt-a {
    --background: var(--section-background-alt-a-style);
    --foreground: var(--section-foreground-alt-a-style);
    --border: var(--section-border-alt-a-style);
    --border-radius: var(--section-border-radius-alt-a-style);
    --box-shadow: var(--section-box-shadow-alt-a-style);
}

@media screen and (max-width: 1024px) {
    section.style-alt-a {
        --padding-block: var(--section-padding-block-alt-a-style-mobile);
        --padding-inline: var(--section-padding-inline-alt-a-style-mobile);
    }
}

@media screen and (min-width: 1025px) {
    section.style-alt-a {
        --padding-block: var(--section-padding-block-alt-a-style-desktop);
        --padding-inline: var(--section-padding-inline-alt-a-style-desktop);
    }
}

section.style-alt-b {
    --background: var(--section-background-alt-b-style);
    --foreground: var(--section-foreground-alt-b-style);
    --border: var(--section-border-alt-b-style);
    --border-radius: var(--section-border-radius-alt-b-style);
    --box-shadow: var(--section-box-shadow-alt-b-style);
}

@media screen and (max-width: 1024px) {
    section.style-alt-b {
        --padding-block: var(--section-padding-block-alt-b-style-mobile);
        --padding-inline: var(--section-padding-inline-alt-b-style-mobile);
    }
}

@media screen and (min-width: 1025px) {
    section.style-alt-b {
        --padding-block: var(--section-padding-block-alt-b-style-desktop);
        --padding-inline: var(--section-padding-inline-alt-b-style-desktop);
    }
}

section.style-alt-c {
    --background: var(--section-background-alt-c-style);
    --foreground: var(--section-foreground-alt-c-style);
    --border: var(--section-border-alt-c-style);
    --border-radius: var(--section-border-radius-alt-c-style);
    --box-shadow: var(--section-box-shadow-alt-c-style);
}

@media screen and (max-width: 1024px) {
    section.style-alt-c {
        --padding-block: var(--section-padding-block-alt-c-style-mobile);
        --padding-inline: var(--section-padding-inline-alt-c-style-mobile);
    }
}

@media screen and (min-width: 1025px) {
    section.style-alt-c {
        --padding-block: var(--section-padding-block-alt-c-style-desktop);
        --padding-inline: var(--section-padding-inline-alt-c-style-desktop);
    }
}

section.style-alt-d {
    --background: var(--section-background-alt-d-style);
    --foreground: var(--section-foreground-alt-d-style);
    --border: var(--section-border-alt-d-style);
    --border-radius: var(--section-border-radius-alt-d-style);
    --box-shadow: var(--section-box-shadow-alt-d-style);
}

@media screen and (max-width: 1024px) {
    section.style-alt-d {
        --padding-block: var(--section-padding-block-alt-d-style-mobile);
        --padding-inline: var(--section-padding-inline-alt-d-style-mobile);
    }
}

@media screen and (min-width: 1025px) {
    section.style-alt-d {
        --padding-block: var(--section-padding-block-alt-d-style-desktop);
        --padding-inline: var(--section-padding-inline-alt-d-style-desktop);
    }
}

section.background-image {
    --background: transparent;
    overflow: hidden;
    position: relative;
}

section.full-height {
    min-height: 100vh;
}

section.full-height.content-aligned-to-top {
    align-content: start;
}

section.full-height.content-aligned-to-center {
    align-content: center;
}

section.full-height.content-aligned-to-bottom {
    align-content: end;
}

.section-main-navigation.fixed {
    padding: var(--section-main-navigation-fixed-padding, 0);
    --background: var(--section-main-navigation-fixed-background, inherit);
    overflow: visible;
}

.box {
    position: relative;
    overflow: hidden;
    width: var(--section-width, 100%);
    background: var(--background, transparent);
    color: var(--foreground);
    border: var(--box-border);
    border-radius: var(--box-border-radius);
    box-shadow: var(--box-shadow);
    padding: var(--box-padding);
    transition: all 0.15s ease-in-out;
    transform: var(--transform, none);
}

.box.style-default {
    --background: var(--box-background-default-style);
    --foreground: var(--box-foreground-default-style);
    --box-border: var(--box-border-default-style);
    --box-border-radius: var(--box-border-radius-default-style);
    --box-shadow: var(--box-box-shadow-default-style);
}

.box.style-default.clickable:hover {
    --background: var(--box-background-default-style-hover);
    --foreground: var(--box-foreground-default-style-hover);
    --box-border: var(--box-border-default-style-hover);
    --box-border-radius: var(--box-border-radius-default-style-hover);
    --box-shadow: var(--box-box-shadow-default-style-hover);
    --transform: var(--box-transform-default-style-hover);
}

.box.style-alt-a {
    --background: var(--box-background-alt-a-style);
    --foreground: var(--box-foreground-alt-a-style);
    --box-border: var(--box-border-alt-a-style);
    --box-border-radius: var(--box-border-radius-alt-a-style);
    --box-shadow: var(--box-box-shadow-alt-a-style);
}

.box.style-alt-a.clickable:hover {
    --background: var(--box-background-alt-a-style-hover);
    --foreground: var(--box-foreground-alt-a-style-hover);
    --box-border: var(--box-border-alt-a-style-hover);
    --box-border-radius: var(--box-border-radius-alt-a-style-hover);
    --box-shadow: var(--box-box-shadow-alt-a-style-hover);
    --transform: var(--box-transform-alt-a-style-hover);
}

.box.style-alt-b {
    --background: var(--box-background-alt-b-style);
    --foreground: var(--box-foreground-alt-b-style);
    --box-border: var(--box-border-alt-b-style);
    --box-border-radius: var(--box-border-radius-alt-b-style);
    --box-shadow: var(--box-box-shadow-alt-b-style);
}

.box.style-alt-b.clickable:hover {
    --background: var(--box-background-alt-b-style-hover);
    --foreground: var(--box-foreground-alt-b-style-hover);
    --box-border: var(--box-border-alt-b-style-hover);
    --box-border-radius: var(--box-border-radius-alt-b-style-hover);
    --box-shadow: var(--box-box-shadow-alt-b-style-hover);
    --transform: var(--box-transform-alt-b-style-hover);
}

.box.style-alt-c {
    --background: var(--box-background-alt-c-style);
    --foreground: var(--box-foreground-alt-c-style);
    --box-border: var(--box-border-alt-c-style);
    --box-border-radius: var(--box-border-radius-alt-c-style);
    --box-shadow: var(--box-box-shadow-alt-c-style);
}

.box.style-alt-c.clickable:hover {
    --background: var(--box-background-alt-c-style-hover);
    --foreground: var(--box-foreground-alt-c-style-hover);
    --box-border: var(--box-border-alt-c-style-hover);
    --box-border-radius: var(--box-border-radius-alt-c-style-hover);
    --box-shadow: var(--box-box-shadow-alt-c-style-hover);
    --transform: var(--box-transform-alt-c-style-hover);
}

.box.style-alt-d {
    --background: var(--box-background-alt-d-style);
    --foreground: var(--box-foreground-alt-d-style);
    --box-border: var(--box-border-alt-d-style);
    --box-border-radius: var(--box-border-radius-alt-d-style);
    --box-shadow: var(--box-box-shadow-alt-d-style);
}

.box.style-alt-d.clickable:hover {
    --background: var(--box-background-alt-d-style-hover);
    --foreground: var(--box-foreground-alt-d-style-hover);
    --box-border: var(--box-border-alt-d-style-hover);
    --box-border-radius: var(--box-border-radius-alt-d-style-hover);
    --box-shadow: var(--box-box-shadow-alt-d-style-hover);
    --transform: var(--box-transform-alt-d-style-hover);
}

@media screen and (max-width: 1024px) {
    .box.padding-sm {
        --box-padding: var(--box-padding-sm-mobile);
    }
}

@media screen and (min-width: 1025px) {
    .box.padding-sm {
        --box-padding: var(--box-padding-sm-desktop);
    }
}

@media screen and (max-width: 1024px) {
    .box.padding-lg {
        --box-padding: var(--box-padding-lg-mobile);
    }
}

@media screen and (min-width: 1025px) {
    .box.padding-lg {
        --box-padding: var(--box-padding-lg-desktop);
    }
}

.box.clickable {
    position: relative;
    cursor: pointer;
}

.box.clickable a,
.box.clickable a.box-button,
.box.clickable a.link-button,
.box.clickable a.icon-button,
.box.clickable a.link {
    position: static;
}

.box.clickable a::after,
.box.clickable a.box-button::after,
.box.clickable a.link-button::after,
.box.clickable a.icon-button::after,
.box.clickable a.link::after {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.avatar {
    --background: var(--avatar-background);
    --foreground: var(--avatar-foreground);
    --border: var(--avatar-border);
    --border-radius: var(--avatar-border-radius, 9999px);
    display: grid;
    position: relative;
    aspect-ratio: var(--avatar-aspect-ratio, 1/1);
    font-size: var(--avatar-font-size);
    height: max-content;
}

.avatar > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    align-self: center;
    justify-self: center;
    border-radius: var(--border-radius);
    background: var(--background);
    font-size: inherit;
}

.avatar > span > svg {
    width: var(--avatar-font-size);
    height: var(--avatar-font-size);
}

.avatar .button {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 0;
    right: 0;
    width: var(--avatar-button-size);
    height: var(--avatar-button-size);
}

.avatar .button > svg {
    width: var(--avatar-button-size);
    height: var(--avatar-button-size);
}

.avatar > picture {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: var(--border-radius);
    overflow: hidden;
}

.avatar > picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar.clickable {
    cursor: pointer;
}

.avatar.xxs {
    width: var(--avatar-size-xxs);
    --avatar-button-size: var(--avatar-button-size-xxs);
    --avatar-font-size: var(--avatar-font-size-xxs);
}

.avatar.xs {
    width: var(--avatar-size-xs);
    --avatar-button-size: var(--avatar-button-size-xs);
    --avatar-font-size: var(--avatar-font-size-xs);
}

.avatar.sm {
    width: var(--avatar-size-sm);
    --avatar-button-size: var(--avatar-button-size-sm);
    --avatar-font-size: var(--avatar-font-size-sm);
}

.avatar.md {
    width: var(--avatar-size-md);
    --avatar-button-size: var(--avatar-button-size-md);
    --avatar-font-size: var(--avatar-font-size-md);
}

.avatar.lg {
    width: var(--avatar-size-lg);
    --avatar-button-size: var(--avatar-button-size-lg);
    --avatar-font-size: var(--avatar-font-size-lg);
}

.avatar.xl {
    width: var(--avatar-size-xl);
    --avatar-button-size: var(--avatar-button-size-xl);
    --avatar-font-size: var(--avatar-font-size-xl);
}

.avatar.xxl {
    width: var(--avatar-size-xxl);
    --avatar-button-size: var(--avatar-button-size-xxl);
    --avatar-font-size: var(--avatar-font-size-xxl);
}

.avatar-name {
    --background: var(--avatar-name-background, transparent);
    --foreground: var(--avatar-name-foreground, inherit);
    --border: var(--avatar-name-border, none);
    --border-radius: var(--avatar-name-border-radius, 9999px);
    --padding: var(--avatar-name-padding, 0);
    --gap: var(--avatar-name-gap, var(--spacing-small));
    display: inline-flex;
    flex-direction: var(--avatar-name-flex-direction, row);
    flex-wrap: wrap;
    position: relative;
    align-items: var(--avatar-name-align-items, center);
    justify-content: var(--avatar-name-justify-content, flex-start);
    gap: var(--gap);
    width: fit-content;
    height: fit-content;
    background: var(--background);
    color: var(--foreground);
    border: var(--border);
    border-radius: var(--border-radius);
    padding: var(--padding);
}

.avatar-name .avatar {
    flex-shrink: 0;
}

.avatar-name__body {
    --p-margin-bottom-mobile: 0;
    --p-margin-bottom-desktop: 0;
    --p-margin-top-desktop: 0;
    --p-margin-top-mobile: 0;
}

.badge {
    --background: inherit;
    --color: inherit;
    --border: inherit;
    --border-radius: inherit;
    display: inline-flex;
    align-items: center;
    background: var(--background);
    color: var(--foreground);
    border: var(--border);
    border-radius: var(--border-radius);
    width: fit-content;
    height: fit-content;
    font-weight: var(--badge-font-weight);
    font-size: var(--font-size);
    line-height: var(--line-height);
    padding: var(--padding);
    gap: var(--gap);
}

.badge .badge__close-button {
    align-self: center;
    display: flex;
    cursor: pointer;
    opacity: 0.5;
    --foreground: var(--badge-close-button-color, var(--foreground));
}

.badge .badge__close-button svg {
    width: var(--badge-close-button-size, 1em);
    height: var(--badge-close-button-size, 1em);
}

.badge.xxs {
    --padding: var(--badge-padding-xxs);
    --font-size: var(--badge-font-size-xxs);
    --line-height: var(--badge-line-height-xxs);
    --gap: var(--badge-gap-xxs);
    --border-radius: var(--badge-border-radius-xxs);
}

.badge.xs {
    --padding: var(--badge-padding-xs);
    --font-size: var(--badge-font-size-xs);
    --line-height: var(--badge-line-height-xs);
    --gap: var(--badge-gap-xs);
    --border-radius: var(--badge-border-radius-xs);
}

.badge.sm {
    --padding: var(--badge-padding-sm);
    --font-size: var(--badge-font-size-sm);
    --line-height: var(--badge-line-height-sm);
    --gap: var(--badge-gap-sm);
    --border-radius: var(--badge-border-radius-sm);
}

.badge.md {
    --padding: var(--badge-padding-md);
    --font-size: var(--badge-font-size-md);
    --line-height: var(--badge-line-height-md);
    --gap: var(--badge-gap-md);
    --border-radius: var(--badge-border-radius-md);
}

.badge.lg {
    --padding: var(--badge-padding-lg);
    --font-size: var(--badge-font-size-lg);
    --line-height: var(--badge-line-height-lg);
    --gap: var(--badge-gap-lg);
    --border-radius: var(--badge-border-radius-lg);
}

.badge.xl {
    --padding: var(--badge-padding-xl);
    --font-size: var(--badge-font-size-xl);
    --line-height: var(--badge-line-height-xl);
    --gap: var(--badge-gap-xl);
    --border-radius: var(--badge-border-radius-xl);
}

.badge.xxl {
    --padding: var(--badge-padding-xxl);
    --font-size: var(--badge-font-size-xxl);
    --line-height: var(--badge-line-height-xxl);
    --gap: var(--badge-gap-xxl);
    --border-radius: var(--badge-border-radius-xxl);
}

.badge.default {
    --background: var(--badge-default-background);
    --foreground: var(--badge-default-color);
    --border: var(--badge-default-border);
}

.badge.brand {
    --background: var(--badge-brand-background);
    --foreground: var(--badge-brand-color);
    --border: var(--badge-brand-border);
}

.badge.success {
    --background: var(--badge-success-background);
    --foreground: var(--badge-success-color);
    --border: var(--badge-success-border);
}

.badge.warning {
    --background: var(--badge-warning-background);
    --foreground: var(--badge-warning-color);
    --border: var(--badge-warning-border);
}

.badge.danger {
    --background: var(--badge-danger-background);
    --foreground: var(--badge-danger-color);
    --border: var(--badge-danger-border);
}

.badge.info {
    --background: var(--badge-info-background);
    --foreground: var(--badge-info-color);
    --border: var(--badge-info-border);
}

.badge.light {
    --background: var(--badge-light-background);
    --foreground: var(--badge-light-color);
    --border: var(--badge-light-border);
}

.badge.dark {
    --background: var(--badge-dark-background);
    --foreground: var(--badge-dark-color);
    --border: var(--badge-dark-border);
}

.badge.outline.default {
    --background: var(--badge-outline-default-background);
    --foreground: var(--badge-outline-default-color);
    --border: var(--badge-outline-default-border);
}

.badge.outline.brand {
    --background: var(--badge-outline-brand-background);
    --foreground: var(--badge-outline-brand-color);
    --border: var(--badge-outline-brand-border);
}

.badge.outline.success {
    --background: var(--badge-outline-success-background);
    --foreground: var(--badge-outline-success-color);
    --border: var(--badge-outline-success-border);
}

.badge.outline.warning {
    --background: var(--badge-outline-warning-background);
    --foreground: var(--badge-outline-warning-color);
    --border: var(--badge-outline-warning-border);
}

.badge.outline.danger {
    --background: var(--badge-outline-danger-background);
    --foreground: var(--badge-outline-danger-color);
    --border: var(--badge-outline-danger-border);
}

.badge.outline.info {
    --background: var(--badge-outline-info-background);
    --foreground: var(--badge-outline-info-color);
    --border: var(--badge-outline-info-border);
}

.badge.outline.light {
    --background: var(--badge-outline-light-background);
    --foreground: var(--badge-outline-light-color);
    --border: var(--badge-outline-light-border);
}

.badge.outline.dark {
    --background: var(--badge-outline-dark-background);
    --foreground: var(--badge-outline-dark-color);
    --border: var(--badge-outline-dark-border);
}

.layout.badge-set {
    --column-gap: var(--badge-set-column-gap, 12px);
    --row-gap: var(--badge-set-row-gap, 8px);
}

hr,
.line {
    --line-length: inherit;
    --line-width: inherit;
    --line-svg: url('data:image/svg+xml;utf8,<svg width="100" height="1" viewBox="0 0 100 1" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="0.5" x2="100" y2="0.5" stroke="red" stroke-width="1"/></svg>');
    box-sizing: content-box;
    outline: none;
    border: none;
    height: var(--line-width, 1px);
    width: var(--line-length, 100%);
    background-color: var(--line-color, var(--text-color, #aaa));
    background-image: var(--line-background-image);
    background-repeat: var(--line-background-repeate);
    max-width: 100%;
    margin: var(--line-margin, 1rem 0);
}

hr.style-default,
.line.style-default {
    --line-width: var(--line-default-width, 1px);
    --line-color: var(--line-default-color, var(--text-color, #aaa));
    --line-background-image: var(--line-default-background-image);
    --line-background-repeat: var(--line-default-background-repeat);
    --line-margin: var(--line-default-margin, 1rem 0);
}

@media (max-width: 1024px) {

    hr.style-default,
    .line.style-default {
        --line-length: var(--line-default-length-mobile, inherit);
    }
}

@media (min-width: 1025px) {

    hr.style-default,
    .line.style-default {
        --line-length: var(--line-default-length-desktop, inherit);
    }
}

hr.style-inverse,
.line.style-inverse {
    --line-width: var(--line-inverse-width, 1px);
    --line-color: var(--line-inverse-color, var(--text-color, #fff));
    --line-background-image: var(--line-inverse-background-image);
    --line-background-repeat: var(--line-inverse-background-repeat);
    --line-margin: var(--line-inverse-margin, 1rem 0);
}

@media (max-width: 1024px) {

    hr.style-inverse,
    .line.style-inverse {
        --line-length: var(--line-inverse-length-mobile, inherit);
    }
}

@media (min-width: 1025px) {

    hr.style-inverse,
    .line.style-inverse {
        --line-length: var(--line-inverse-length-desktop, inherit);
    }
}

.tab {
    --background: var(--tab-background);
    --foreground: var(--tab-foreground);
    --border: var(--tab-border);
    --border-radius: var(--tab-border-radius);
    --box-shadow: var(--tab-box-shadow);
    --font-weight: var(--tab-font-weight);
    --font-size: var(--tab-font-size);
    --line-height: var(--tab-line-height);
    --padding: var(--tab-padding);
    --gap: var(--tab-gap);
    --background-active: var(--tab-background-active);
    --foreground-active: var(--tab-foreground-active);
    --border-active: var(--tab-border-active);
    --border-radius-active: var(--tab-border-radius-active);
    --font-weight-active: var(--tab-font-weight-active);
    --font-size-active: var(--tab-font-size-active);
    --line-height-active: var(--tab-line-height-active);
    display: inline-flex;
    align-items: center;
    width: fit-content;
    height: fit-content;
    background: var(--background);
    color: var(--foreground);
    border: var(--border);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    font-weight: var(--font-weight);
    font-size: var(--font-size);
    line-height: var(--line-height);
    padding: var(--padding);
    gap: var(--gap);
    cursor: pointer;
}

.tab.active,
.tab[aria-selected=true],
.tab:hover {
    --background: var(--tab-background-active);
    --foreground: var(--tab-foreground-active);
    --border: var(--tab-border-active);
    --border-radius: var(--tab-border-radius-active);
    --box-shadow: var(--tab-box-shadow-active);
    --font-weight: var(--tab-font-weight-active);
    --font-size: var(--tab-font-size-active);
    --line-height: var(--tab-line-height-active);
}

.quote {
    --background: var(--quote-background);
    --foreground: var(--quote-foreground);
    --border: var(--quote-border, none);
    --border-radius: var(--quote-border-radius, 0);
    --box-shadow: var(--quote-box-shadow, none);
    --padding: var(--quote-padding, 0);
    --gap: var(--quote-gap, var(--spacing-large));
    --width: var(--quote-width, 740px);
    --text-align: var(--quote-text-align, left);
    display: flex;
    flex-direction: column;
    gap: var(--gap);
    width: var(--width);
    max-width: 100%;
    background: var(--background);
    color: var(--foreground);
    border: var(--border);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    padding: var(--padding);
}

.quote blockquote {
    display: block;
    text-align: var(--text-align);
}

.quote blockquote p + p {
    margin-top: var(--quote-blockquote-paragraph-gap, var(--spacing-small));
}

.quote blockquote h1,
.quote blockquote h2,
.quote blockquote h3,
.quote blockquote h4,
.quote blockquote h5,
.quote blockquote h6,
.quote blockquote p,
.quote blockquote div,
.quote blockquote ul,
.quote blockquote ol,
.quote blockquote li {
    color: var(--quote-foreground);
    max-width: 100%;
}

.quote blockquote h1:last-child,
.quote blockquote h2:last-child,
.quote blockquote h3:last-child,
.quote blockquote h4:last-child,
.quote blockquote h5:last-child,
.quote blockquote h6:last-child,
.quote blockquote p:last-child,
.quote blockquote div:last-child,
.quote blockquote ul:last-child,
.quote blockquote ol:last-child,
.quote blockquote li:last-child {
    margin-bottom: 0;
}

.quote figcaption {
    display: flex;
    flex-direction: column;
    align-self: var(--quote-caption-align-self, center);
    justify-self: var(--quote-caption-justify-self, flex-start);
}

.quote figcaption,
.quote figcaption > * {
    text-align: var(--quote-caption-text-align, center) !important;
}

.quote .faded {
    --foreground: var(--quote-faded-color, var(--faded-color, rgba(0, 0, 0, 0.5)));
}

@media screen and (max-width: 1024px) {
    .quote {
        --quote-padding: var(--quote-padding-mobile, inherit);
    }
}

@media screen and (min-width: 1025px) {
    .quote {
        --quote-padding: var(--quote-padding-desktop, inherit);
    }
}

@media screen and (max-width: 1024px) {
    .gallery {
        --grid-column-gap-mobile: var(--gallery-column-gap-mobile);
        --grid-row-gap-mobile: var(--gallery-row-gap-mobile);
        --layout-column-gap-default-mobile: var(--gallery-column-gap-desktop);
        --layout-row-gap-default-mobile: var(--gallery-row-gap-desktop);
    }
}

@media screen and (min-width: 1025px) {
    .gallery {
        --grid-column-gap-desktop: var(--gallery-column-gap-desktop);
        --grid-row-gap-desktop: var(--gallery-row-gap-desktop);
        --layout-column-gap-default-desktop: var(--gallery-column-gap-desktop);
        --layout-row-gap-default-desktop: var(--gallery-row-gap-desktop);
    }
}

.gallery.has-highlighted-photo > .grid > *:first-child {
    grid-column: 1/-1;
}

.grid {
    --max-col-count: 3;
    --min-col-size: 300px;
    --col-size-calc: calc((100% - var(--column-gap) * var(--max-col-count)) / var(--max-col-count));
    --grid-col-min-size-calc: min(max(var(--min-col-size), var(--col-size-calc)), 100%);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--grid-col-min-size-calc), 1fr));
    gap: var(--row-gap) var(--column-gap);
}

@media screen and (max-width: 1024px) {
    .grid {
        --column-gap: var(--grid-column-gap-mobile, var(--spacing-large));
        --row-gap: var(--grid-row-gap-mobile, var(--spacing-large));
    }

    .grid.scrollable {
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        /* Hide scrollbar for Firefox */
        -ms-overflow-style: none;
        /* Hide scrollbar for Internet Explorer and Edge */
    }

    .grid.scrollable::-webkit-scrollbar {
        display: none;
        /* Hide scrollbar for Chrome, Safari, and Opera */
    }

    .grid.scrollable > * {
        flex: 0 0 auto;
        flex-basis: var(--grid-scrollable-col-size, 90%);
    }
}

@media screen and (min-width: 1025px) {
    .grid {
        --column-gap: var(--grid-column-gap-desktop, var(--spacing-4x-large));
        --row-gap: var(--grid-row-gap-desktop, var(--spacing-4x-large));
    }
}

.grid.has-1-columns {
    --max-col-count: 1;
}

.grid.has-2-columns {
    --max-col-count: 2;
}

.grid.has-3-columns {
    --max-col-count: 3;
}

.grid.has-4-columns {
    --max-col-count: 4;
}

.grid.has-5-columns {
    --max-col-count: 5;
}

.grid.has-6-columns {
    --max-col-count: 6;
}

.grid.item-width-xxs {
    --min-col-size: 100px;
}

.grid.item-width-xs {
    --min-col-size: 200px;
}

.grid.item-width-sm {
    --min-col-size: 300px;
}

.grid.item-width-md {
    --min-col-size: 400px;
}

@media screen and (max-width: 420px) {
    .grid.item-width-md {
        --max-col-count: 1;
        grid-template-columns: 1fr;
    }
}

.grid.item-width-lg {
    --min-col-size: 500px;
}

@media screen and (max-width: 525px) {
    .grid.item-width-lg {
        --max-col-count: 1;
        grid-template-columns: 1fr;
    }
}

.grid.item-width-xl {
    --min-col-size: 600px;
}

@media screen and (max-width: 640px) {
    .grid.item-width-xl {
        --max-col-count: 1;
        grid-template-columns: 1fr;
    }
}

.grid.item-width-xxl {
    --min-col-size: 700px;
}

@media screen and (max-width: 768px) {
    .grid.item-width-xxl {
        --max-col-count: 1;
        grid-template-columns: 1fr;
    }
}

.grid > .grid-item,
.grid > * {
    max-width: 100% !important;
}

.layout {
    --columns-mobile: 1fr;
    --columns-tablet: 1fr 1fr;
    --columns-desktop: 1fr 1fr 1fr;
    --columns-wide: 1fr 1fr 1fr 1fr;
    column-gap: var(--column-gap);
    row-gap: var(--row-gap);
}

.layout.columns {
    display: grid;
    grid-template-columns: var(--columns);
    align-items: var(--layout-columns-align-items, stretch);
    justify-content: var(--layout-columns-justify-content, flex-start);
    /* Mobile */
    /* Tablet */
    /* Desktop */
    /* Wide */
}

.layout.columns > *:not(hr, .bento-box, .full-height) {
    height: fit-content;
}

@media (max-width: 767px) {
    .layout.columns {
        --columns: var(--columns-mobile);
    }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .layout.columns {
        --columns: var(--columns-tablet);
    }
}

@media (min-width: 1280px) and (max-width: 1679px) {
    .layout.columns {
        --columns: var(--columns-desktop);
    }
}

@media (min-width: 1680px) {
    .layout.columns {
        --columns: var(--columns-wide);
    }
}

.layout.flexible {
    display: flex;
    flex-wrap: wrap;
    flex-direction: var(--flexible-direction, row);
    align-items: var(--layout-flexible-align-items, stretch);
    justify-content: var(--layout-flexible-justify-content, flex-start);
    width: 100%;
    max-width: 100%;
}

.layout.flexible > *:not(hr, a[class*=button]) {
    width: var(--flexible-col-size, max-content);
    max-width: 100%;
}

@media screen and (max-width: 1023px) {
    .layout {
        --column-gap: var(--layout-column-gap-default-mobile);
        --row-gap: var(--layout-row-gap-default-mobile);
    }

    .layout.column-gap-small {
        --column-gap: var(--layout-column-gap-small-mobile);
    }

    .layout.row-gap-small {
        --row-gap: var(--layout-row-gap-small-mobile);
    }

    .layout.scrollable {
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        /* Hide scrollbar for Firefox */
        -ms-overflow-style: none;
        /* Hide scrollbar for Internet Explorer and Edge */
    }

    .layout.scrollable::-webkit-scrollbar {
        display: none;
        /* Hide scrollbar for Chrome, Safari, and Opera */
    }

    .layout.scrollable > * {
        flex: 0 0 auto;
        flex-basis: var(--layout-scrollable-col-size, 90%);
    }
}

@media screen and (min-width: 1024px) {
    .layout {
        --column-gap: var(--layout-column-gap-default-desktop);
        --row-gap: var(--layout-row-gap-default-desktop);
    }

    .layout.column-gap-small {
        --column-gap: var(--layout-column-gap-small-desktop);
    }

    .layout.row-gap-small {
        --row-gap: var(--layout-row-gap-small-desktop);
    }
}

.breadcrumbs {
    --breadcrumbs-gap: inherit;
    --breadcrumbs-separator-color: inherit;
    --breadcrumbs-link-text-decoration: inherit;
    --breadcrumbs-link-text-decoration-hover: inherit;
    --breadcrumbs-link-color: inherit;
    --breadcrumbs-link-color-hover: var(--breadcrumbs-link-color);
    --breadcrumbs-link-font-family: var(--font-family-sans);
    --breadcrumbs-link-font-weight: var(--font-weight-normal);
    --breadcrumbs-link-font-size: inherit;
    --breadcrumbs-link-line-height: inherit;
}

.breadcrumbs > ol {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: var(--breadcrumbs-gap);
}

.breadcrumbs > ol > li {
    display: flex;
    margin-bottom: 0;
}

.breadcrumbs > ol > li .separator {
    display: flex;
    color: var(--breadcrumbs-separator-color);
}

.breadcrumbs > ol > li .separator svg,
.breadcrumbs > ol > li .separator svg > * {
    color: var(--breadcrumbs-separator-color);
}

.breadcrumbs > ol > li a.icon-button {
    --size: max-content;
}

.breadcrumbs > ol > li a.link {
    --link-text-decoration: var(--breadcrumbs-link-text-decoration);
    --link-text-decoration-hover: var(--breadcrumbs-link-text-decoration-hover);
    --link-color: var(--breadcrumbs-link-color);
    --link-color-hover: var(--breadcrumbs-link-color-hover);
    --link-font-family: var(--breadcrumbs-link-font-family, var(--font-family-sans));
    --link-font-weight: var(--breadcrumbs-link-font-weight);
    --link-font-size: var(--breadcrumbs-link-font-size);
    --link-line-height: var(--breadcrumbs-link-line-height);
}

.breadcrumbs > ol > li:last-child > a.link {
    --link-color: var(--breadcrumbs-link-last-color);
}

.breadcrumbs > ol > li:last-child > a.link:hover {
    --link-color-hover: var(--breadcrumbs-link-last-color-hover);
}

.button-set {
    --layout-column-gap-default-mobile: var(--button-set-column-gap-mobile, 12px);
    --layout-row-gap-default-mobile: var(--button-set-row-gap-mobile, 12px);
    --layout-column-gap-default-desktop: var(--button-set-column-gap-desktop, 16px);
    --layout-row-gap-default-desktop: var(--button-set-row-gap-desktop, 16px);
}

.button-set.vertical {
    --flexible-direction: column;
}

.button-set.left {
    --layout-flexible-justify-content: flex-start;
}

.button-set.center {
    --layout-flexible-justify-content: center;
}

.button-set.right {
    --layout-flexible-justify-content: flex-end;
}

.hero-section {
    --columns-mobile: 1fr;
    --columns-tablet: 1fr 1fr;
    --columns-desktop: 1fr 1fr;
    --columns-wide: 1fr 1fr;
    padding: var(--hero-section-padding, 0);
}

@media screen and (max-width: 1024px) {
    .hero-section {
        --layout-column-gap-default-mobile: var(--hero-section-column-gap-mobile, var(--spacing-large));
        --layout-row-gap-default-mobile: var(--hero-section-row-gap-mobile, var(--spacing-large));
    }
}

@media screen and (min-width: 1025px) {
    .hero-section {
        --layout-column-gap-default-desktop: var(--hero-section-column-gap-desktop, var(--spacing-4x-large));
        --layout-row-gap-default-desktop: var(--hero-section-row-gap-desktop, var(--spacing-4x-large));
    }
}

.background-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.background-layer > img,
.background-layer > picture,
.background-layer > video,
.background-layer > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.icon-label {
    --text-color: var(--icon-label-text-color, inherit);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--icon-label-gap, var(--spacing-x-small));
}

.icon-label__icon {
    --text-color: var(--icon-label-icon-color, var(--color));
}

.modal {
    display: flex;
    flex-direction: column;
    padding: var(--modal-padding, var(--spacing-small));
    background: var(--modal-background, inherit);
    color: var(--modal-foreground);
    border-radius: var(--modal-border-radius, 0);
    border: var(--modal-border, solid 1px var(--text-color));
    box-shadow: var(--modal-box-shadow, none);
    width: var(--modal-width, 720px);
    height: var(--modal-height, auto);
    max-width: 100vw;
    max-height: 100vw;
}

.modal .modal__header {
    background: var(--modal-header-background, inherit);
    color: var(--modal-header-foreground, inherit);
    border-bottom: var(--modal-header-border, inherit);
    padding: var(--modal-header-padding, 16px 0);
    display: flex;
    align-items: center;
    justify-content: var(--modal-header-justify-content, space-between);
}

.modal .modal__body {
    display: block;
    background: var(--modal-body-background, inherit);
    color: var(--modal-body-foreground, inherit);
    padding: var(--modal-body-padding, 16px 0);
    overflow: var(--modal-body-overflow, auto);
    flex: 1 1 auto;
}

.modal .modal__footer {
    background: var(--modal-footer-background, inherit);
    color: var(--modal-footer-foreground, inherit);
    border-top: var(--modal-footer-border, inherit);
    padding: var(--modal-footer-padding, 16px 0);
    display: flex;
    align-items: center;
    justify-content: var(--modal-footer-justify-content, flex-end);
}

table,
.table {
    width: 100%;
    border-collapse: separate;
    margin: var(--table-spacing);
    background: var(--table-background);
    color: var(--table-foreground);
    border: var(--table-border);
    border-spacing: var(--table-spacing);
    border-radius: var(--table-border-radius);
    box-shadow: var(--table-box-shadow);
    overflow: hidden;
    font-family: var(--table-font-family, var(--font-family-sans, sans-serif));
    font-size: var(--table-font-size, 1rem);
    font-weight: var(--table-font-weight, normal);
    line-height: var(--table-line-height, 1.5);
}

table,
table *,
.table,
.table * {
    transition: background 0.2s, color 0.2s;
}

table,
table *,
.table,
.table * {
    overflow: hidden;
}

table thead th,
.table thead th {
    background: var(--table-header-background);
    color: var(--table-header-foreground);
    padding: var(--table-cell-padding);
    border-bottom: var(--table-header-horizontal-separator);
    font-family: var(--table-header-font-famly);
    font-size: var(--table-header-font-size);
    font-weight: var(--table-header-font-weight);
    line-height: var(--table-header-line-height);
}

table thead th:not(:last-child),
.table thead th:not(:last-child) {
    border-inline-end: var(--table-header-vertical-separator);
}

table tbody td,
.table tbody td {
    background: var(--table-cell-background);
    color: var(--table-cell-foreground);
    padding: var(--table-cell-padding);
    font-family: var(--table-body-font-family);
    font-size: var(--table-body-font-size);
    font-weight: var(--table-body-font-weight);
    line-height: var(--table-body-line-height);
    border-bottom: var(--table-body-horizontal-separator);
}

table tbody td:not(:last-child),
.table tbody td:not(:last-child) {
    border-inline-end: var(--table-body-vertical-separator);
}

table tbody tr:last-child td,
.table tbody tr:last-child td {
    border-bottom: none;
}

table tfoot td,
table tfoot th,
.table tfoot td,
.table tfoot th {
    background: var(--table-footer-background);
    color: var(--table-footer-foreground);
    padding: var(--table-cell-padding);
    font-family: var(--table-footer-font-family);
    font-size: var(--table-footer-font-size);
    font-weight: var(--table-footer-font-weight);
    line-height: var(--table-footer-line-height);
    border-top: var(--table-footer-horizontal-separator);
}

table tfoot td:not(:last-child),
table tfoot th:not(:last-child),
.table tfoot td:not(:last-child),
.table tfoot th:not(:last-child) {
    border-inline-end: var(--table-footer-vertical-separator);
}

table tbody tr:hover,
.table tbody tr:hover {
    --text-color: var(--table-row-hover-foreground);
    --table-foreground: var(--table-row-hover-foreground);
    background: var(--table-row-hover-background);
    color: var(--table-row-hover-foreground);
}

.signpost {
    --grid-column-gap-mobile: var(--signpost-column-gap-mobile);
    --grid-row-gap-mobile: var(--signpost-row-gap-mobile);
    --grid-column-gap-desktop: var(--signpost-column-gap-desktop);
    --grid-row-gap-desktop: var(--signpost-row-gap-desktop);
    --layout-column-gap-default-mobile: var(--signpost-column-gap-mobile);
    --layout-row-gap-default-mobile: var(--signpost-row-gap-mobile);
    --layout-column-gap-default-desktop: var(--signpost-column-gap-desktop);
    --layout-row-gap-default-desktop: var(--signpost-row-gap-desktop);
}

.bento-box {
    --bento-box-default-background: transparent;
    --bento-box-default-foreground: inherit;
    --bento-box-default-icon-color: var(--bento-box-default-foreground, inherit);
    --bento-box-inverse-background: transparent;
    --bento-box-inverse-foreground: white;
    --bento-box-inverse-icon-color: var(--bento-box-inverse-foreground, inherit);
    position: sticky;
    overflow: hidden;
    display: flex;
    flex-direction: var(--bento-box-flex-direction, row);
    width: var(--bento-box-width, 480px);
    height: var(--bento-box-height, 360px);
    min-height: max-content;
    max-width: 100%;
    max-height: 100%;
    background: var(--background, transparent);
    color: var(--foreground, inherit);
    border-radius: var(--bento-box-border-radius, 16px);
    box-shadow: var(--bento-box-box-shadow, none);
    padding: var(--padding);
    gap: var(--gap);
    /* Mobile */
    /* Tablet */
    /* Desktop */
    /* Wide */
}

@media screen and (max-width: 1024px) {
    .bento-box {
        --padding: var(--bento-box-padding-mobile, 24px);
        --gap: var(--bento-box-gap-mobile, 16px);
    }
}

@media screen and (min-width: 1025px) {
    .bento-box {
        --padding: var(--bento-box-padding-desktop, 48px);
        --gap: var(--bento-box-gap-desktop, 24px);
    }
}

@media (max-width: 767px) {
    .bento-box {
        --bento-box-width: var(--bento-box-width-mobile, 100%);
        --bento-box-height: var(--bento-box-height-mobile, 180px);
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .bento-box {
        --bento-box-width: var(--bento-box-width-tablet, 100%);
        --bento-box-height: var(--bento-box-height-tablet, 360px);
    }
}

@media (min-width: 1024px) and (max-width: 1439px) {
    .bento-box {
        --bento-box-width: var(--bento-box-width-desktop, 480px);
        --bento-box-height: var(--bento-box-height-desktop, 360px);
    }
}

@media (min-width: 1440px) {
    .bento-box {
        --bento-box-width: var(--bento-box-width-wide, 500px);
        --bento-box-height: var(--bento-box-height-wide, 360px);
    }
}

.bento-box .background-layer {
    transition: transform 0.3s ease-in-out;
}

.bento-box a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    z-index: 1;
}

.bento-box a::after {
    content: "";
    position: absolute;
}

.bento-box:hover .background-layer {
    transform: scale(1.05);
}

.bento-box > .bento-box__body {
    flex: 1;
}

.bento-box picture,
.bento-box video,
.bento-box img {
    --image-border-radius: 0;
}

.bento-box.style-default {
    --background: var(--bento-box-default-background);
    --foreground: var(--bento-box-default-foreground);
    --icon-color: var(--bento-box-default-icon-color);
}

.bento-box.style-inverse {
    --background: var(--bento-box-inverse-background);
    --foreground: var(--bento-box-inverse-foreground);
    --icon-color: var(--bento-box-inverse-icon-color);
}

.event {
    --background: var(--event-background, white);
    --foreground: var(--event-foreground, var(--box-foreground-default-style));
    --border: var(--event-border, none);
    --shadow: var(--event-shadow, none);
    --background-hover: var(--event-background-hover, inherit);
    --foreground-hover: var(--event-foreground-hover, inherit);
    --shadow-hover: var(--event-shadow-hover, none);
    --padding: var(--event-padding);
    --border-radius: var(--event-border-radius);
    position: relative;
    display: grid;
    grid-template-areas: var(--grid-areas, "");
    grid-template-columns: var(--grid-columns, auto);
    grid-template-rows: var(--grid-rows, auto);
    column-gap: var(--gap);
    background: var(--background);
    color: var(--foreground);
    border: var(--border);
    box-shadow: var(--shadow);
    transition: all 0.3s;
    border-radius: var(--border-radius);
    padding: var(--padding);
    overflow: hidden;
    /* Mobile */
    /* Tablet */
    /* Desktop */
    /* Tablet */
    /* Desktop */
}

.event > *:empty {
    display: none;
}

.event > *:empty > * {
    margin-top: -24px;
}

@media (max-width: 767px) {
    .event {
        --event-padding: var(--event-padding-mobile);
        --event-border-radius: var(--event-border-radius-mobile);
        --gap: var(--event-gap-mobile);
        --grid-areas: var(--event-grid-areas-mobile);
        --grid-columns: var(--event-grid-columns-mobile);
        --grid-rows: var(--event-grid-rows-mobile);
        --dates-top-spacing: var(--event-dates-top-spacing-mobile, 0.5rem);
        --tags-top-spacing: var(--event-tags-top-spacing-mobile, 0.5rem);
        --headline-top-spacing: var(--event-headline-top-spacing-mobile, 0.5rem);
        --body-top-spacing: var(--event-body-top-spacing-mobile, 0.5rem);
        --image-top-spacing: var(--event-image-top-spacing-mobile, 0.5rem);
        --buttons-top-spacing: var(--event-buttons-top-spacing-mobile, 0.5rem);
    }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .event {
        --event-padding: var(--event-padding-tablet);
        --event-border-radius: var(--event-border-radius-tablet);
        --gap: var(--event-gap-tablet);
        --grid-areas: var(--event-grid-areas-tablet);
        --grid-columns: var(--event-grid-columns-tablet);
        --grid-rows: var(--event-grid-rows-tablet);
        --dates-top-spacing: var(--event-dates-top-spacing-tablet, 0.5rem);
        --tags-top-spacing: var(--event-tags-top-spacing-tablet, 0.5rem);
        --headline-top-spacing: var(--event-headline-top-spacing-tablet, 0.5rem);
        --body-top-spacing: var(--event-body-top-spacing-tablet, 0.5rem);
        --image-top-spacing: var(--event-image-top-spacing-tablet, 0.5rem);
        --buttons-top-spacing: var(--event-buttons-top-spacing-tablet, 0.5rem);
    }
}

@media (min-width: 1280px) {
    .event {
        --event-padding: var(--event-padding-desktop);
        --event-border-radius: var(--event-border-radius-desktop);
        --gap: var(--event-gap-desktop);
        --grid-areas: var(--event-grid-areas-desktop);
        --grid-columns: var(--event-grid-columns-desktop);
        --grid-rows: var(--event-grid-rows-desktop);
        --dates-top-spacing: var(--event-dates-top-spacing-desktop, 0.5rem);
        --tags-top-spacing: var(--event-tags-top-spacing-desktop, 0.5rem);
        --headline-top-spacing: var(--event-headline-top-spacing-desktop, 0.5rem);
        --body-top-spacing: var(--event-body-top-spacing-desktop, 0.5rem);
        --image-top-spacing: var(--event-image-top-spacing-desktop, 0.5rem);
        --buttons-top-spacing: var(--event-buttons-top-spacing-desktop, 0.5rem);
    }
}

@container (max-width: 767px) {
    .event {
        --event-padding: var(--event-padding-mobile);
        --event-border-radius: var(--event-border-radius-mobile);
        --gap: var(--event-gap-mobile);
        --grid-areas: var(--event-grid-areas-mobile);
        --grid-columns: var(--event-grid-columns-mobile);
        --grid-rows: var(--event-grid-rows-mobile);
        --dates-top-spacing: var(--event-dates-top-spacing-mobile, 0.5rem);
        --tags-top-spacing: var(--event-tags-top-spacing-mobile, 0.5rem);
        --headline-top-spacing: var(--event-headline-top-spacing-mobile, 0.5rem);
        --body-top-spacing: var(--event-body-top-spacing-mobile, 0.5rem);
        --image-top-spacing: var(--event-image-top-spacing-mobile, 0.5rem);
        --buttons-top-spacing: var(--event-buttons-top-spacing-mobile, 0.5rem);
    }
}

@container (min-width: 768px) and (max-width: 1023px) {
    .event {
        --event-padding: var(--event-padding-tablet);
        --event-border-radius: var(--event-border-radius-tablet);
        --gap: var(--event-gap-tablet);
        --grid-areas: var(--event-grid-areas-tablet);
        --grid-columns: var(--event-grid-columns-tablet);
        --grid-rows: var(--event-grid-rows-tablet);
        --dates-top-spacing: var(--event-dates-top-spacing-tablet, 0.5rem);
        --tags-top-spacing: var(--event-tags-top-spacing-tablet, 0.5rem);
        --headline-top-spacing: var(--event-headline-top-spacing-tablet, 0.5rem);
        --body-top-spacing: var(--event-body-top-spacing-tablet, 0.5rem);
        --image-top-spacing: var(--event-image-top-spacing-tablet, 0.5rem);
        --buttons-top-spacing: var(--event-buttons-top-spacing-tablet, 0.5rem);
    }
}

@container (min-width: 1024px) {
    .event {
        --event-padding: var(--event-padding-desktop);
        --event-border-radius: var(--event-border-radius-desktop);
        --gap: var(--event-gap-desktop);
        --grid-areas: var(--event-grid-areas-desktop);
        --grid-columns: var(--event-grid-columns-desktop);
        --grid-rows: var(--event-grid-rows-desktop);
        --dates-top-spacing: var(--event-dates-top-spacing-desktop, 0.5rem);
        --tags-top-spacing: var(--event-tags-top-spacing-desktop, 0.5rem);
        --headline-top-spacing: var(--event-headline-top-spacing-desktop, 0.5rem);
        --body-top-spacing: var(--event-body-top-spacing-desktop, 0.5rem);
        --image-top-spacing: var(--event-image-top-spacing-desktop, 0.5rem);
        --buttons-top-spacing: var(--event-buttons-top-spacing-desktop, 0.5rem);
    }
}

.event .event__dates {
    grid-area: dates;
    padding: var(--event-dates-padding, 0.5rem);
    margin-top: var(--dates-top-spacing, 0.5rem);
}

.event .event__tags {
    grid-area: tags;
    padding: var(--event-tags-padding, 0.5rem);
    margin-top: var(--tags-top-spacing, 0.5rem);
}

.event .event__headline {
    grid-area: headline;
    padding: var(--event-headline-padding, 0.5rem);
    margin-top: var(--headline-top-spacing, 0.5rem);
    max-width: 720px;
    hyphens: auto;
}

.event .event__body {
    grid-area: body;
    padding: var(--event-body-padding, 0.5rem);
    margin-top: var(--body-top-spacing, 0.5rem);
    max-width: 720px;
    hyphens: auto;
}

.event .event__image {
    display: grid;
    grid-area: image;
    padding: var(--event-image-padding, 0.5rem);
    margin-top: var(--image-top-spacing, 0.5rem);
}

.event .event__image picture,
.event .event__image img {
    --image-aspect-ratio: var(--event-image-aspect-ratio);
    transform: scale(1);
}

.event .event__buttons {
    grid-area: buttons;
    padding: var(--event-buttons-padding, 0.5rem);
    gap: var(--event-buttons-gap, 0.5rem);
    margin-top: var(--buttons-top-spacing, 0.5rem);
}

.event.clickable a {
    position: static;
}

.event.clickable a::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent;
}

.event.clickable:hover picture > img {
    transform: scale(1.05);
}

.event:hover {
    --background: var(--background-hover);
    --foreground: var(--foreground-hover);
    --shadow: var(--shadow-hover);
}

nav > ul,
.navigation > ul {
    display: flex;
    flex-direction: var(--direction, row);
    flex-wrap: wrap;
    gap: var(--gap, var(--navigation-gap, 20px));
}

nav .navigation__item,
.navigation .navigation__item {
    width: auto;
    padding: 0;
    margin: 0;
}

nav .navigation__item::before,
.navigation .navigation__item::before {
    display: none;
}

nav.horizontal,
.navigation.horizontal {
    --direction: row;
}

nav.vertical,
.navigation.vertical {
    --direction: column;
}

.site-header {
    background: var(--site-header-background, transparent);
    color: var(--foreground);
    padding: var(--site-header-padding, 0);
    border: var(--site-header-border, none);
    border-radius: var(--site-header-border-radius, 0);
    box-shadow: var(--site-header-box-shadow, none);
    height: var(--site-header-height);
    display: flex;
    align-items: center;
}

.site-header__container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    position: relative;
    padding: 0;
}

.site-header__logo a {
    display: block;
}

.site-header__logo a svg {
    --foreground: var(--site-header-logo-color, inherit);
    height: 100%;
    width: max-content;
    max-height: 100%;
    max-width: 100%;
}

.site-header__logo .logo-mobile,
.site-header__logo .logo-tablet,
.site-header__logo .logo-desktop {
    display: none;
}

.site-header__logo .logo-mobile {
    display: block;
}

.site-header__logo .logo-mobile,
.site-header__logo .logo-mobile > svg,
.site-header__logo .logo-mobile > img {
    width: var(--site-header-logo-width-mobile, auto);
    height: var(--site-header-logo-height-mobile, 44px);
}

.site-header__logo .logo-tablet,
.site-header__logo .logo-tablet > svg,
.site-header__logo .logo-tablet > img {
    width: var(--site-header-logo-width-tablet, auto);
    height: var(--site-header-logo-height-tablet, 32px);
}

.site-header__logo .logo-desktop,
.site-header__logo .logo-desktop > svg,
.site-header__logo .logo-desktop > img {
    width: var(--site-header-logo-width-desktop, auto);
    height: var(--site-header-logo-height-desktop, 32px);
}

.site-header__menu nav.navigation {
    --navigation-gap: var(--site-header-menu-items-gap, 4px);
}

.site-header__search .form-control.input:not(:focus-within, :focus, :focus-visible) {
    --form-control-input-background: var(--site-header-search-background, inherit);
    --form-control-input-border: var(--site-header-search-border, inherit);
    --form-control-input-placeholder-color: var(--site-header-search-placeholder-color, inherit);
}

.site-header__search .form-control.input:not(:focus-within, :focus, :focus-visible) svg {
    --foreground: var(--site-header-search-icon-color, inherit);
}

.site-header__search .form-control.input:not(:focus-within, :focus, :focus-visible) [class*=button] {
    --background: var(--site-header-search-button-background, inherit);
    --foreground: var(--site-header-search-button-foreground, inherit);
    padding: var(--site-header-search-button-padding, 0);
}

.site-header__search .form-control.input:not(:focus-within, :focus, :focus-visible) input {
    color: var(--site-header-search-foreground, inherit);
}

.site-header__search .form-control.input:focus-within,
.site-header__search .form-control.input:focus,
.site-header__search .form-control.input:focus-visible {
    --form-control-input-background: var(--site-header-search-background-focus, inherit);
    --form-control-input-border: var(--site-header-search-border-focus, inherit);
    --form-control-input-placeholder-color: var(--site-header-search-placeholder-color-focus, inherit);
}

.site-header__search .form-control.input:focus-within svg,
.site-header__search .form-control.input:focus svg,
.site-header__search .form-control.input:focus-visible svg {
    --foreground: var(--site-header-search-icon-color-focus, inherit);
}

.site-header__search .form-control.input:focus-within [class*=button],
.site-header__search .form-control.input:focus [class*=button],
.site-header__search .form-control.input:focus-visible [class*=button] {
    --background: var(--site-header-search-button-background-focus, var(--site-header-search-button-background));
    --foreground: var(--site-header-search-button-foreground-focus, var(--site-header-search-button-foreground));
    padding: var(--site-header-search-button-padding-focus, var(--site-header-search-button-padding));
}

.site-header__search .form-control.input:focus-within input,
.site-header__search .form-control.input:focus input,
.site-header__search .form-control.input:focus-visible input {
    color: var(--site-header-search-foreground-focus, inherit);
}

.site-header__actions {
    display: flex;
    gap: var(--site-header-actions-gap, 4px);
}

.site-header__actions button {
    background: none;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
}

.site-header__menu-toggle {
    display: none;
}

.site-header__menu-toggle .navigation .navigation__item > a[class*=button]:not(:hover),
.site-header__menu-toggle > a[class*=button]:not(:hover),
.site-header__menu .navigation .navigation__item > a[class*=button]:not(:hover),
.site-header__menu > a[class*=button]:not(:hover),
.site-header__actions .navigation .navigation__item > a[class*=button]:not(:hover),
.site-header__actions > a[class*=button]:not(:hover) {
    --background: var(--site-header-button-background, inherit) !important;
    --foreground: var(--site-header-button-foreground, inherit) !important;
}

.site-header__menu-toggle .navigation .navigation__item > a[class*=button]:hover,
.site-header__menu-toggle > a[class*=button]:hover,
.site-header__menu .navigation .navigation__item > a[class*=button]:hover,
.site-header__menu > a[class*=button]:hover,
.site-header__actions .navigation .navigation__item > a[class*=button]:hover,
.site-header__actions > a[class*=button]:hover {
    --background: var(--site-header-button-background-hover, inherit) !important;
    --foreground: var(--site-header-button-foreground-hover, inherit) !important;
}

/* Responsivita */
@media (max-width: 1279px) {
    .site-header {
        --site-header-height: var(--site-header-height-mobile, 72px);
    }

    .site-header__container {
        justify-content: space-between;
    }

    .site-header__menu,
    .site-header__search {
        display: none;
    }

    .site-header__menu-toggle {
        display: block;
    }

    .site-header__logo {
        order: var(--site-header-logo-position-mobile, 2);
    }

    .site-header__menu {
        order: var(--site-header-menu-position-mobile, 1);
    }

    .site-header__menu-toggle {
        order: var(--site-header-menu-toggle-position-mobile, 1);
    }

    .site-header__search {
        order: var(--site-header-search-position-mobile, 3);
    }

    .site-header__actions {
        order: var(--site-header-actions-position-mobile, 4);
    }
}

@media (min-width: 1280px) {
    .site-header {
        --site-header-height: var(--site-header-height-tablet, 72px);
    }

    .site-header__logo .logo-tablet {
        display: block;
    }

    .site-header__logo .logo-mobile,
    .site-header__logo .logo-desktop {
        display: none;
    }

    .site-header__logo {
        order: var(--site-header-logo-position-tablet, 1);
    }

    .site-header__menu {
        order: var(--site-header-menu-position-tablet, 2);
    }

    .site-header__menu-toggle {
        order: var(--site-header-menu-toggle-position-tablet, 2);
    }

    .site-header__search {
        order: var(--site-header-search-position-tablet, 3);
    }

    .site-header__actions {
        order: var(--site-header-actions-position-tablet, 4);
    }
}

@media (min-width: 1440px) {
    .site-header {
        --site-header-height: var(--site-header-height-desktop, 72px);
    }

    .site-header__logo .logo-desktop {
        display: block;
    }

    .site-header__logo .logo-mobile,
    .site-header__logo .logo-tablet {
        display: none;
    }

    .site-header__logo {
        order: var(--site-header-logo-position-desktop, 1);
    }

    .site-header__menu {
        order: var(--site-header-menu-position-desktop, 2);
    }

    .site-header__menu-toggle {
        order: var(--site-header-menu-toggle-position-desktop, 2);
    }

    .site-header__search {
        order: var(--site-header-search-position-desktop, 3);
    }

    .site-header__actions {
        order: var(--site-header-actions-position-desktop, 4);
    }
}

.site-footer {
    position: relative;
    display: flex;
    background: var(--site-footer-background, transparent);
    padding: var(--site-footer-padding, 0);
    border: var(--site-footer-border, none);
    border-radius: var(--site-footer-border-radius, 0);
    box-shadow: var(--site-footer-box-shadow, none);
    gap: var(--site-footer-gap, 24px);
    /* Mobile */
    /* Tablet */
    /* Desktop */
}

.site-footer * {
    --foreground: var(--site-footer-foreground, inherit);
}

.site-footer .site-footer__main-layout {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: var(--site-footer-main-layout-gap, 0);
}

.site-footer .site-footer__main-layout .site-footer__column-left,
.site-footer .site-footer__main-layout .site-footer__column-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.site-footer .site-footer__main-layout .site-footer__column-left {
    text-align: left;
    gap: var(--site-footer-column-left-gap, 0);
}

.site-footer .site-footer__main-layout .site-footer__column-right {
    text-align: right;
    gap: var(--site-footer-column-right-gap, 0);
}

.site-footer .site-footer__logo {
    height: var(--site-footer-logo-height, 24px);
    width: var(--site-footer-logo-width, auto);
    --site-footer-foreground: var(--site-footer-logo-color, inherit);
}

.site-footer .site-footer__logo > * {
    height: 100%;
    width: max-content;
    max-height: 100%;
    max-width: 100%;
}

@media (max-width: 767px) {
    .site-footer {
        --site-footer-padding: var(--site-footer-padding-mobile, 0);
    }

    .site-footer .site-footer__main-layout {
        flex-direction: column;
        align-items: flex-start;
    }

    .site-footer .site-footer__main-layout .site-footer__column-left,
    .site-footer .site-footer__main-layout .site-footer__column-right {
        width: 100%;
        text-align: left;
    }

    .site-footer nav > ul {
        --direction: column;
    }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .site-footer {
        --site-footer-padding: var(--site-footer-padding-tablet, 0);
    }

    .site-footer nav > ul {
        --direction: column;
    }
}

@media (min-width: 1280px) {
    .site-footer {
        --site-footer-padding: var(--site-footer-padding-desktop, 0);
    }
}

.paging {
    --column-gap: var(--paging-column-gap, 0);
    width: max-content;
    align-self: center;
    justify-self: center;
    overflow: hidden;
    background: var(--paging-background, transparent);
    color: var(--paging-foreground, inherit);
    border-radius: var(--radius-md, 8px);
    border: var(--paging-border, none);
    padding: var(--paging-padding, 0);
    margin: var(--paging-margin, 0 auto);
}

.paging .icon-button,
.paging .box-button {
    --border-radius: 0;
    --background: var(--paging-button-background, initial);
    --foreground: var(--paging-button-foreground, initial);
    width: var(--paging-button-width, 40px);
}

.paging .icon-button:not(:last-child),
.paging .box-button:not(:last-child) {
    border-right: var(--paging-button-border-separator, 1px solid inherit);
}

.paging .icon-button:not([disabled], .paging .icon-button:disabled, .paging .icon-button.disabled,
    .paging .box-button:disabled,
    .paging .box-button.disabled):hover,
.paging .box-button:not([disabled], .paging .icon-button:disabled, .paging .icon-button.disabled,
    .paging .box-button:disabled,
    .paging .box-button.disabled):hover {
    --background: var(--paging-button-background-hover, initial);
    --foreground: var(--paging-button-foreground-hover, initial);
}

.paging .icon-button[active],
.paging .icon-button:active,
.paging .icon-button.active,
.paging .box-button[active],
.paging .box-button:active,
.paging .box-button.active {
    --background: var(--paging-button-background-active, initial) !important;
    --foreground: var(--paging-button-foreground-active, initial) !important;
}

.paging-dots {
    --dot-size: var(--paging-dot-size, 8px);
    --column-gap: var(--paging-dots-column-gap, var(--spacing-md, 16px));
    --flexible-col-size: var(--dot-size);
    width: max-content;
    align-self: center;
    justify-self: center;
    border-radius: var(--paging-dots-padding, 0);
    border: var(--paging-dots-border, inherit);
    padding: var(--paging-dots-padding, 0);
    margin: var(--paging-dots-margin, 0 auto);
    background: var(--paging-dots-background, inherit);
}

.paging-dots > .dot {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: var(--paging-dot-width, 8px);
    height: var(--paging-dot-height, 8px);
    border-radius: 9999px;
    background: var(--paging-dot-background, #D5D9EB);
    cursor: pointer;
}

.paging-dots > .dot::after {
    position: absolute;
    content: "";
    display: block;
    transform: scale(2);
    transform-origin: center;
    width: 100%;
    height: 100%;
    overflow: visible;
    border-radius: 9999px;
    z-index: 1000;
}

.paging-dots > .dot[active],
.paging-dots > .dot:active,
.paging-dots > .dot.active {
    --paging-dot-background: var(--paging-dot-background-active, #0058CC);
}

.button-group {
    --layout-column-gap-default-mobile: var(--button-group-gap);
    --layout-row-gap-default-mobile: var(--button-group-gap);
    --layout-column-gap-default-desktop: var(--button-group-gap);
    --layout-row-gap-default-desktop: var(--button-group-gap);
    box-sizing: border-box;
    width: var(--button-group-width, max-content);
    height: max-content;
    padding: var(--button-group-padding, inherit);
    background: var(--button-group-background, inherit);
    color: var(--button-group-foreground, inherit);
    border: var(--button-group-border, inherit);
    border-radius: var(--button-group-border-radius, inherit);
    box-shadow: var(--button-group-shadow, inherit);
}

.button-group:not(:focus, :focus-within, :focus-visible) {
    overflow: hidden;
}

.button-group > .separator {
    display: block;
    box-sizing: border-box;
    height: auto;
    width: auto;
    border-right: var(--button-group-horizontal-separator, inherit);
}

.button-group > a {
    --background: var(--button-background, inherit);
    --foreground: var(--button-foreground, inherit);
    --border: var(--button-border, inherit);
    --border-radius: var(--button-border-radius, inherit) !important;
}

.button-group.vertical {
    --flexible-direction: column;
}

.button-group.vertical > .separator {
    display: block;
    box-sizing: border-box;
    --flexible-col-size: auto;
    height: auto;
    border-bottom: var(--button-group-vertical-separator, inherit);
}

.button-group.vertical > a {
    width: 100%;
    height: min-content;
    justify-content: var(--button-group-vertical-link-justify-content, space-between);
}

@media screen and (max-width: 768px) {
    .button-group.horizontal {
        --flexible-direction: column;
        width: 100%;
    }

    .button-group.horizontal > .separator {
        display: block;
        box-sizing: border-box;
        --flexible-col-size: auto;
        height: auto;
        border-bottom: var(--button-group-horizontal-separator, inherit);
    }

    .button-group.horizontal > a {
        width: 100%;
        height: min-content;
    }
}

.button-group.style-default {
    --button-group-padding: var(--button-group-default-padding, inherit);
    --button-group-background: var(--button-group-default-background, inherit);
    --button-group-foreground: var(--button-group-default-foreground, inherit);
    --button-group-border: var(--button-group-default-border, inherit);
    --button-group-border-radius: var(--button-group-default-border-radius, inherit);
    --button-group-shadow: var(--button-group-default-shadow, inherit);
    --button-group-horizontal-separator: var(--button-group-horizontal-default-separator, inherit);
    --button-group-vertical-separator: var(--button-group-vertical-default-separator, inherit);
    --button-group-gap: var(--button-group-default-gap, inherit);
    --button-background: var(--button-group-default-button-background, inherit);
    --button-foreground: var(--button-group-default-button-foreground, inherit);
    --button-border: var(--button-group-default-button-border, inherit);
    --button-border-radius: var(--button-group-default-button-border-radius, inherit);
}

.button-group.style-default a:hover {
    --button-background: var(--button-group-default-button-background-hover, inherit);
    --button-foreground: var(--button-group-default-button-foreground-hover, inherit);
    --button-border: var(--button-group-default-button-border-hover, inherit);
    --button-border-radius: var(--button-group-default-button-border-radius-hover, inherit);
}

.button-group.style-default a.active {
    --button-background: var(--button-group-default-button-background-active, inherit);
    --button-foreground: var(--button-group-default-button-foreground-active, inherit);
    --button-border: var(--button-group-default-button-border-active, inherit);
    --button-border-radius: var(--button-group-default-button-border-radius-active, inherit);
}

.button-group.style-alt-a {
    --button-group-padding: var(--button-group-alt-a-padding, inherit);
    --button-group-background: var(--button-group-alt-a-background, inherit);
    --button-group-foreground: var(--button-group-alt-a-foreground, inherit);
    --button-group-border: var(--button-group-alt-a-border, inherit);
    --button-group-border-radius: var(--button-group-alt-a-border-radius, inherit);
    --button-group-shadow: var(--button-group-alt-a-shadow, inherit);
    --button-group-horizontal-separator: var(--button-group-horizontal-alt-a-separator, inherit);
    --button-group-vertical-separator: var(--button-group-vertical-alt-a-separator, inherit);
    --button-group-gap: var(--button-group-alt-a-gap, inherit);
    --button-background: var(--button-group-alt-a-button-background, inherit);
    --button-foreground: var(--button-group-alt-a-button-foreground, inherit);
    --button-border: var(--button-group-alt-a-button-border, inherit);
    --button-border-radius: var(--button-group-alt-a-button-border-radius, inherit);
}

.button-group.style-alt-a a:hover {
    --button-background: var(--button-group-alt-a-button-background-hover, inherit);
    --button-foreground: var(--button-group-alt-a-button-foreground-hover, inherit);
    --button-border: var(--button-group-alt-a-button-border-hover, inherit);
    --button-border-radius: var(--button-group-alt-a-button-border-radius-hover, inherit);
}

.button-group.style-alt-a a.active {
    --button-background: var(--button-group-alt-a-button-background-active, inherit);
    --button-foreground: var(--button-group-alt-a-button-foreground-active, inherit);
    --button-border: var(--button-group-alt-a-button-border-active, inherit);
    --button-border-radius: var(--button-group-alt-a-button-border-radius-active, inherit);
}

.button-group.style-alt-b {
    --button-group-padding: var(--button-group-alt-b-padding, inherit);
    --button-group-background: var(--button-group-alt-b-background, inherit);
    --button-group-foreground: var(--button-group-alt-b-foreground, inherit);
    --button-group-border: var(--button-group-alt-b-border, inherit);
    --button-group-border-radius: var(--button-group-alt-b-border-radius, inherit);
    --button-group-shadow: var(--button-group-alt-b-shadow, inherit);
    --button-group-horizontal-separator: var(--button-group-horizontal-alt-b-separator, inherit);
    --button-group-vertical-separator: var(--button-group-vertical-alt-b-separator, inherit);
    --button-group-gap: var(--button-group-alt-b-gap, inherit);
    --button-background: var(--button-group-alt-b-button-background, inherit);
    --button-foreground: var(--button-group-alt-b-button-foreground, inherit);
    --button-border: var(--button-group-alt-b-button-border, inherit);
    --button-border-radius: var(--button-group-alt-b-button-border-radius, inherit);
}

.button-group.style-alt-b a:hover {
    --button-background: var(--button-group-alt-b-button-background-hover, inherit);
    --button-foreground: var(--button-group-alt-b-button-foreground-hover, inherit);
    --button-border: var(--button-group-alt-b-button-border-hover, inherit);
    --button-border-radius: var(--button-group-alt-b-button-border-radius-hover, inherit);
}

.button-group.style-alt-b a.active {
    --button-background: var(--button-group-alt-b-button-background-active, inherit);
    --button-foreground: var(--button-group-alt-b-button-foreground-active, inherit);
    --button-border: var(--button-group-alt-b-button-border-active, inherit);
    --button-border-radius: var(--button-group-alt-b-button-border-radius-active, inherit);
}

.button-group.style-alt-c {
    --button-group-padding: var(--button-group-alt-c-padding, inherit);
    --button-group-background: var(--button-group-alt-c-background, inherit);
    --button-group-foreground: var(--button-group-alt-c-foreground, inherit);
    --button-group-border: var(--button-group-alt-c-border, inherit);
    --button-group-border-radius: var(--button-group-alt-c-border-radius, inherit);
    --button-group-shadow: var(--button-group-alt-c-shadow, inherit);
    --button-group-horizontal-separator: var(--button-group-horizontal-alt-c-separator, inherit);
    --button-group-vertical-separator: var(--button-group-vertical-alt-c-separator, inherit);
    --button-group-gap: var(--button-group-alt-c-gap, inherit);
    --button-background: var(--button-group-alt-c-button-background, inherit);
    --button-foreground: var(--button-group-alt-c-button-foreground, inherit);
    --button-border: var(--button-group-alt-c-button-border, inherit);
    --button-border-radius: var(--button-group-alt-c-button-border-radius, inherit);
}

.button-group.style-alt-c a:hover {
    --button-background: var(--button-group-alt-c-button-background-hover, inherit);
    --button-foreground: var(--button-group-alt-c-button-foreground-hover, inherit);
    --button-border: var(--button-group-alt-c-button-border-hover, inherit);
    --button-border-radius: var(--button-group-alt-c-button-border-radius-hover, inherit);
}

.button-group.style-alt-c a.active {
    --button-background: var(--button-group-alt-c-button-background-active, inherit);
    --button-foreground: var(--button-group-alt-c-button-foreground-active, inherit);
    --button-border: var(--button-group-alt-c-button-border-active, inherit);
    --button-border-radius: var(--button-group-alt-c-button-border-radius-active, inherit);
}

.button-group.style-alt-d {
    --button-group-padding: var(--button-group-alt-d-padding, inherit);
    --button-group-background: var(--button-group-alt-d-background, inherit);
    --button-group-foreground: var(--button-group-alt-d-foreground, inherit);
    --button-group-border: var(--button-group-alt-d-border, inherit);
    --button-group-border-radius: var(--button-group-alt-d-border-radius, inherit);
    --button-group-shadow: var(--button-group-alt-d-shadow, inherit);
    --button-group-horizontal-separator: var(--button-group-horizontal-alt-d-separator, inherit);
    --button-group-vertical-separator: var(--button-group-vertical-alt-d-separator, inherit);
    --button-group-gap: var(--button-group-alt-d-gap, inherit);
    --button-background: var(--button-group-alt-d-button-background, inherit);
    --button-foreground: var(--button-group-alt-d-button-foreground, inherit);
    --button-border: var(--button-group-alt-d-button-border, inherit);
    --button-border-radius: var(--button-group-alt-d-button-border-radius, inherit);
}

.button-group.style-alt-d a:hover {
    --button-background: var(--button-group-alt-d-button-background-hover, inherit);
    --button-foreground: var(--button-group-alt-d-button-foreground-hover, inherit);
    --button-border: var(--button-group-alt-d-button-border-hover, inherit);
    --button-border-radius: var(--button-group-alt-d-button-border-radius-hover, inherit);
}

.button-group.style-alt-d a.active {
    --button-background: var(--button-group-alt-d-button-background-active, inherit);
    --button-foreground: var(--button-group-alt-d-button-foreground-active, inherit);
    --button-border: var(--button-group-alt-d-button-border-active, inherit);
    --button-border-radius: var(--button-group-alt-d-button-border-radius-active, inherit);
}

.dropdown-list {
    --row-gap: var(--dropdown-list-row-gap, 0);
    --columns-mobile: 1fr;
    --columns-tablet: 1fr;
    --columns-desktop: 1fr;
    --columns-wide: 1fr;
    position: relative;
}

.dropdown-item {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--dropdown-item-gap, 8px);
    width: auto;
    border: var(--dropdown-item-border, none);
    border-radius: var(--dropdown-item-border-radius, 6px);
    padding: var(--dropdown-item-padding, 8px 10px);
    background: var(--background, var(--dropdown-item-background, transparent));
    color: var(--foreground, var(--dropdown-item-foreground, inherit));
    height: var(--dropdown-item-height, auto);
    min-height: var(--dropdown-item-min-height, 40px);
}

.dropdown-item.clickable {
    cursor: pointer;
}

.dropdown-item.clickable:hover {
    --background: var(--dropdown-item-background-hover, inherit);
    --foreground: var(--dropdown-item-foreground-hover, inherit);
    --dropdown-item-prefix-color: var(--dropdown-item-prefix-color-hover, inherit);
    --dropdown-item-suffix-color: var(--dropdown-item-suffix-color-hover, inherit);
}

.dropdown-item .body {
    flex: 1 1 auto;
}

.dropdown-item .prefix {
    --foreground: var(--dropdown-item-prefix-color, inherit);
}

.dropdown-item .suffix {
    --foreground: var(--dropdown-item-suffix-color, inherit);
}

.dropdown-item.selected,
.dropdown-item[aria-selected=true] {
    --background: var(--dropdown-item-background-selected, inherit);
    --foreground: var(--dropdown-item-foreground-selected, inherit);
    --dropdown-item-prefix-color: var(--dropdown-item-prefix-color-selected, inherit);
    --dropdown-item-suffix-color: var(--dropdown-item-suffix-color-selected, inherit);
}

.dropdown-item.disabled,
.dropdown-item[aria-disabled=true] {
    --background: var(--dropdown-item-background-disabled, transparent);
    --foreground: var(--dropdown-item-foreground-disabled, inherit);
    cursor: not-allowed;
}

.dropdown-item.disabled .prefix,
.dropdown-item.disabled .suffix,
.dropdown-item[aria-disabled=true] .prefix,
.dropdown-item[aria-disabled=true] .suffix {
    --dropdown-item-prefix-color: var(--dropdown-item-prefix-color-disabled, inherit);
    --dropdown-item-suffix-color: var(--dropdown-item-suffix-color-disabled, inherit);
}

.product-set {
    --column-gap: var(--product-set-column-gap, 1rem);
    --row-gap: var(--product-set-row-gap, 1rem);
}

.product-set > .card.vertical {
    --card-image-padding: var(--product-set-card-image-padding, inherit);
    --card-image-border-radius: var(--product-set-card-image-border-radius, inherit);
    --card-image-container-border-radius: var(--product-set-card-image-border-radius, inherit);
    --card-vertical-image-border-radius: var(--product-set-card-image-border-radius, inherit);
}

.navigation-mobile {
    display: flex;
    flex-direction: column;
    padding: var(--navigation-mobile-padding, var(--spacing-md, 0));
    gap: var(--navigation-mobile-gap, var(--spacing-sm, 0));
    background: var(--navigation-mobile-background, var(--background-style-light, white));
    min-height: 100vh;
}

.navigation-mobile header {
    display: flex;
    flex-direction: column;
    gap: var(--navigation-mobile-header-gap, var(--spacing-xs, 0));
    padding: var(--navigation-mobile-header-padding, 0);
}

.navigation-mobile footer {
    display: flex;
    flex-direction: column;
    gap: var(--navigation-mobile-footer-gap, var(--spacing-xs, 0));
    padding: var(--navigation-mobile-footer-padding, 0);
}

.navigation-mobile nav {
    flex: 1 1 auto;
}

.navigation-mobile > .navigation > .navigation__list {
    padding: var(--navigation-mobile-menu-padding, 0);
    gap: var(--navigation-mobile-menu-gap, var(--spacing-sm, 0));
}

.navigation-mobile > .navigation > .navigation__list .navigation__submenu {
    display: none;
    padding: var(--navigation-mobile-submenu-padding, 0);
    gap: var(--navigation-mobile-submenu-gap, var(--spacing-xs, 0));
}

.navigation-mobile > .navigation > .navigation__list [aria-expanded=true]:not(:hover) {
    --background: var(--navigation-mobile-submenu-button-background, inherit);
}

.navigation-mobile > .navigation > .navigation__list [aria-expanded=true] > svg {
    transform: rotate(180deg);
}

.navigation-mobile > .navigation > .navigation__list [aria-expanded=true] + .navigation__submenu {
    display: flex;
    flex-direction: column;
}

.navigation-mobile > .navigation > .navigation__list [aria-expanded=true] + .navigation__submenu > a {
    transform: rotate(90deg);
}

.navigation-mobile #search > *,
.navigation-mobile #search > * a,
.navigation-mobile .navigation__item,
.navigation-mobile .navigation__item a {
    flex: 1 0 auto;
    width: var(--navigation-mobile-button-width, 100%);
    justify-content: space-between;
}

.navigation-mobile #search > * ul,
.navigation-mobile .navigation__item ul {
    padding: var(--navigation-mobile-submenu-padding, 0);
    margin: var(--navigation-mobile-submenu-margin, 0);
    gap: var(--navigation-mobile-submenu-gap, var(--spacing-xs, 0));
}

.navigation-mobile #search > * ul > li,
.navigation-mobile .navigation__item ul > li {
    width: auto;
    padding: 0;
    margin: 0;
}

.navigation-mobile #search > * ul > li::before,
.navigation-mobile .navigation__item ul > li::before {
    display: none;
}

.navigation-mobile #search > * ul > li > a,
.navigation-mobile .navigation__item ul > li > a {
    --submenuitem-margin-left: var(--navigation-mobile-submenuitem-margin-left, 20px);
    margin-left: var(--submenuitem-margin-left);
    width: calc(100% - var(--submenuitem-margin-left));
}

.chat {
    display: flex;
    flex-direction: column;
    gap: var(--chat-gap, 1em);
    padding: var(--chat-padding, 0);
    background: var(--chat-background, inherit);
    border: var(--chat-border, inherit);
    border-radius: var(--chat-border-radius, inherit);
    box-shadow: var(--chat-box-shadow, none);
    overflow: hidden;
}

.chat {
    width: 100%;
    max-width: var(--chat-max-width, 720px);
}

.chat .chat-message {
    --columns-mobile: 1fr 25fr;
    --columns-tablet: 1fr 25fr;
    --columns-desktop: 1fr 50fr;
    --columns-wide: 1fr 50fr;
    --column-gap: var(--chat-column-gap, 12px);
    --row-gap: var(--chat-row-gap, 8px);
}

.chat .chat-message .chat-bubble {
    display: block;
    position: relative;
    margin: var(--chat-bubble-margin, 0);
    padding: var(--chat-bubble-padding, inherit);
    border-radius: var(--chat-bubble-border-radius, inherit);
    box-shadow: var(--chat-bubble-box-shadow, none);
    border: var(--chat-bubble-border, none);
    background: var(--chat-bubble-background, inherit);
    --foreground: var(--chat-bubble-foreground, inherit);
}

.chat .chat-message:nth-child(odd) .chat-bubble {
    --chat-bubble-margin: var(--chat-bubble-odd-margin, inherit);
    --chat-bubble-padding: var(--chat-bubble-odd-padding, inherit);
    --chat-bubble-border-radius: var(--chat-bubble-odd-border-radius, inherit);
    --chat-bubble-box-shadow: var(--chat-bubble-odd-box-shadow, inherit);
    --chat-bubble-border: var(--chat-bubble-odd-border, inherit);
    --chat-bubble-background: var(--chat-bubble-odd-background, inherit);
    --chat-bubble-foreground: var(--chat-bubble-odd-foreground, inherit);
}

.chat .chat-message:nth-child(even) .chat-bubble {
    --chat-bubble-margin: var(--chat-bubble-even-margin, inherit);
    --chat-bubble-padding: var(--chat-bubble-even-padding, inherit);
    --chat-bubble-border-radius: var(--chat-bubble-even-border-radius, inherit);
    --chat-bubble-box-shadow: var(--chat-bubble-even-box-shadow, inherit);
    --chat-bubble-border: var(--chat-bubble-even-border, inherit);
    --chat-bubble-background: var(--chat-bubble-even-background, inherit);
    --chat-bubble-foreground: var(--chat-bubble-even-foreground, inherit);
}

.slider {
    display: flex;
    flex-direction: column;
    gap: var(--slider-gap, 40px);
    padding: var(--slider-padding, 0.5rem);
    width: 100%;
    max-width: 100%;
}

.slider__slides {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: var(--slider-slide-padding, 0);
    gap: var(--slider-slide-gap, 40px);
    min-width: 100%;
    scrollbar-width: none;
    /* Hide scrollbar for Firefox */
    -ms-overflow-style: none;
    /* Hide scrollbar for IE and Edge */
}

.slider__slides::-webkit-scrollbar {
    display: none;
    /* Hide scrollbar for Chrome, Safari, and Opera */
}

.slider__slides > * {
    min-width: 100%;
    gap: var(--slider-slide-gap, 40px);
    display: flex;
    place-content: center;
}

.bento-boxes {
    --column-gap: var(--bento-boxes-column-gap, 8px);
    --row-gap: var(--bento-boxes-row-gap, 8px);
}

.bento-boxes > .bento-box {
    width: 100%;
    max-width: 100%;
}

.cookies-banner {
    --background: var(--cookies-banner-background);
    --foreground: var(--cookies-banner-foreground);
    --padding: var(--cookies-banner-padding, 0);
    --border: var(--cookies-banner-border, none);
    --border-radius: var(--cookies-banner-border-radius, inherit);
    --box-shadow: var(--cookies-banner-box-shadow, none);
    --width: var(--cookies-banner-width, 80vw);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--cookies-banner-gap, var(--spacing-large));
    margin-inline: auto;
    background: var(--background);
    color: var(--foreground);
    padding: var(--padding);
    border: var(--border);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    width: 100%;
    max-width: var(--width);
}

.cookies-banner > svg {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
}

.cookies-banner .body {
    flex: 1 1 auto;
    width: 100%;
    max-width: max-content;
}

.cookies-banner .button-set {
    flex-shrink: 0;
    flex-grow: 1;
    justify-self: flex-end;
}

@media screen and (max-width: 1024px) {
    .cookies-banner {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .cookies-banner .close-btn {
        position: absolute;
        top: 2em;
        right: 2em;
        z-index: 10;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1280px) {
    .cookies-banner .button-set {
        flex-direction: column;
    }
}

.cookie-banner-wrap {
    display: none;
}

.cookie-banner-wrap.cookie-banner-wrap--active {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 48px;
    z-index: 9999;
    display: block;
}

.cookies-settings {
    --background: var(--cookies-banner-background);
    --foreground: var(--cookies-banner-foreground);
    --padding: var(--cookies-banner-padding, 24px);
    --border: var(--cookies-banner-border, none);
    --border-radius: var(--cookies-banner-border-radius, inherit);
    --box-shadow: var(--cookies-banner-box-shadow, none);
    --width: var(--cookies-banner-width, 80vw);
    display: none;
    align-items: center;
    justify-content: flex-start;
    gap: var(--cookies-banner-gap, 24px);
    margin-inline: auto;
    background: var(--background);
    color: var(--foreground);
    padding: var(--padding);
    border: var(--border);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    width: var(--max-content-width);
    max-width: 100%;
    max-height: 95%;
}

.is-cookies-settings-open .cookies-settings {
    display: flex;
    min-height: 100vh;
    margin: 0 auto;
}

.cookies-settings .cookie-type {
    --column-gap: 12px;
    --row-gap: 12px;
    --columns-mobile: 1fr;
    --columns-tablet: 1fr 23fr;
    --columns-desktop: 1fr 23fr;
    --columns-wide: 1fr 23fr;
    padding: 24px;
    border-radius: 16px;
}

.cookies-settings .cookie-type[aria-required=true] {
    background: #f5f5f5;
}

.cookies-settings .layout.button-set {
    --flexible-direction: row;
}

.cookies-settings .accordion-group {
    --flexible-col-size: 100%;
}

.cookies-settings .accordion-group .accordion-item {
    --accordion-item-heading-padding: 0;
    --accordion-item-border: none;
    --accordion-item-border-expanded: none;
    --accordion-item-box-shadow: none;
    --accordion-item-box-shadow-expanded: none;
    --accordion-item-border-radius: 0;
    --accordion-item-heading-padding-hover: 0;
    --accordion-item-border-hover: none;
    --accordion-item-box-shadow-hover: none;
    --accordion-item-border-radius-hover: 0;
    --accordion-item-body-padding: 16px 0 0 0;
}

.layout.heading {
    --row-gap: 24px;
    --layout-flexible-justify-content: space-between;
    --layout-flexible-align-items: center;
    --p-margin-bottom-desktop: 0;
    --p-margin-bottom-mobile: 0;
}

.layout.heading .heading__headline > *:last-child {
    margin-bottom: 0;
}

.statistics {
    --columns-mobile: var(--statistics-columns-mobile, 1fr);
    --columns-tablet: var(--statistics-columns-tablet, 1fr 1fr);
    --columns-desktop: var(--statistics-columns-desktop, 1fr 1fr);
    --columns-wide: var(--statistics-columns-wide, 1fr 1fr 1fr 1fr);
}

.statistics > .layout.flexible {
    --row-gap: var(--statistics-item-row-gap, 12px);
    --layout-flexible-align-items: center;
    --layout-flexible-justify-content: center;
    --flexible-direction: column;
    text-align: center;
    width: 100%;
    flex: 1 0 auto;
}

.statistics > .layout.flexible > * {
    --flexible-col-size: 280px;
    --layout-flexible-justify-content: center;
    --layout-flexible-align-items: center;
    text-wrap: balance;
}

.statistics > .layout.flexible .statistic-number {
    --foreground: var(--statistic-number-color, inherit);
}

.statistics > .layout.flexible .statistic-number-symbol {
    --foreground: var(--statistic-number-symbol-color, inherit);
}

.card.banner {
    --card-border-radius: var(--banner-border-radius, 0);
    --card-default-border-radius: var(--banner-border-radius, 0);
    --card-default-gap: 0;
}

.card.banner .card__image {
    border-radius: 0;
    --card-image-container-border-radius: 0;
    --card-image-border-radius: 0;
}

.card.banner .card__image picture,
.card.banner .card__image picture img {
    object-fit: cover;
    border-radius: 0;
}

.rating {
    position: relative;
    display: inline-block;
    width: max-content;
}

.rating .rating__stars {
    position: relative;
    display: inline-block;
    line-height: 1;
    height: auto;
    width: auto;
    font-size: 1.5rem;
}

.rating .rating__stars .stars-bg,
.rating .rating__stars .stars-fg {
    display: flex;
    gap: 0;
    position: relative;
    flex-shrink: 0;
}

.rating .rating__stars .stars-bg {
    fill: var(--star-empty-color, #d1d1d1);
    color: var(--star-empty-color, #d1d1d1);
    z-index: 1;
}

.rating .rating__stars .stars-fg {
    color: var(--star-full-color, #f5b301);
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 2;
    min-width: 0;
    width: var(--value, 0);
}

.rating .rating__stars .stars-fg .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.rating .rating__stars .star {
    width: var(--star-size, 20px);
    height: var(--star-size, 20px);
    display: inline-block;
    flex-shrink: 0;
    place-content: center;
}

.rating .rating__stars .star > * {
    width: var(--star-size, 20px);
    height: var(--star-size, 20px);
}

section.style-default.announcement {
    --padding-block: var(--announcement-padding-block, 16px);
    --padding-inline: var(--announcement-padding-inline, 24px);
    --background: var(--announcement-background, transparent);
    --foreground: var(--announcement-foreground, var(--text-color, #000));
    --layout-flexible-align-items: center;
    --border: var(--announcement-border, none);
    --border-radius: var(--announcement-border-radius, 0);
    --box-shadow: var(--announcement-box-shadow, 0 2px 4px rgba(0, 0, 0, 0.1));
    --max-content-width: 100%;
    margin: var(--announcement-margin, 0);
}

section.style-default.announcement .layout {
    --column-gap: var(--announcement-column-gap, 16px);
    --row-gap: var(--announcement-row-gap, 16px);
}

section.style-default.announcement .announcement__content {
    flex: 1;
}

section.style-default.announcement .announcement__content .layout.apply-margins {
    margin: 0;
}

section.style-default.announcement.announcement-default {
    --announcement-background: var(--announcement-default-background, #f6f6f6);
    --announcement-foreground: var(--announcement-default-foreground, #000);
    --announcement-border: var(--announcement-default-border, none);
    --announcement-box-shadow: var(--announcement-default-box-shadow, none);
}

section.style-default.announcement.announcement-success {
    --announcement-background: var(--announcement-success-background, #ecfdf3);
    --announcement-foreground: var(--announcement-success-foreground, #000);
    --announcement-border: var(--announcement-success-border, none);
    --announcement-box-shadow: var(--announcement-success-box-shadow, none);
}

section.style-default.announcement.announcement-warning {
    --announcement-background: var(--announcement-warning-background, #fffaeb);
    --announcement-foreground: var(--announcement-warning-foreground, #000);
    --announcement-border: var(--announcement-warning-border, none);
    --announcement-box-shadow: var(--announcement-warning-box-shadow, none);
}

section.style-default.announcement.announcement-danger {
    --announcement-background: var(--announcement-danger-background, #fef3f2);
    --announcement-foreground: var(--announcement-danger-foreground, #000);
    --announcement-border: var(--announcement-danger-border, none);
    --announcement-box-shadow: var(--announcement-danger-box-shadow, none);
}

figure.video-component {
    display: flex;
    flex-direction: column;
    gap: var(--video-component-gap, 16px);
    width: 100%;
    height: auto;
    object-fit: cover;
    overflow: hidden;
    border-radius: 0;
}

.post {
    position: relative;
    overflow: hidden;
    background: var(--background, var(--post-background, transparent));
    border: var(--post-border, solid 1px var(--border, #e0e0e0));
    border-radius: var(--post-border-radius, var(--box-border-radius, 0));
    box-shadow: var(--post-shadow, none);
    padding: var(--post-padding, 0);
    transition: all 0.15s ease-in-out;
}

.post * {
    color: var(--foreground, var(--post-foreground, inherit));
}

.post a.link {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    cursor: pointer;
}

.post:hover img {
    transform: scale(1.02);
}

.post header,
.post footer,
.post .body {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
}

.post header {
    padding: var(--post-header-padding, 1em);
    gap: var(--post-header-gap, 0.5em);
}

.post .body {
    padding: var(--post-body-padding, 0);
    gap: var(--post-body-gap, 1em);
}

.post footer {
    padding: var(--post-footer-padding, 1em);
    gap: var(--post-footer-gap, 0.5em);
}

.post picture,
.post img,
.post figure.picture {
    --image-border-radius: var(--post-image-border-radius, 0);
}

.post .controls {
    --column-gap: var(--post-controls-gap, 1em);
    --row-gap: var(--post-controls-gap, 1em);
}

/* Form controls */
.form-control.input {
    display: inline-flex;
    flex-direction: column;
    width: var(--form-control-input-width, auto);
}

.form-control.input > .body {
    height: var(--form-control-input-height, auto);
    align-items: center;
    font-family: var(--form-control-input-font-family, var(--font-family-sans));
    font-size: var(--form-control-input-font-size, var(--text-md-font-size));
    line-height: var(--form-control-input-line-height, var(--text-md-line-height));
    gap: var(--form-control-input-body-gap, var(--spacing-x-small));
    padding: var(--form-control-input-body-padding, var(--spacing-x-small) var(--spacing-small));
    border-radius: var(--form-control-input-border-radius, 0);
    border: var(--form-control-input-border, solid 1px rgba(0, 0, 0, 0.12));
    background: var(--form-control-input-background);
    color: var(--form-control-input-color);
    box-shadow: var(--form-control-input-shadow, none);
}

.form-control.input > .body input {
    flex: 1;
    border: none;
    outline: none;
    background: none;
    color: inherit;
    max-width: 100%;
    min-width: 0;
    font: inherit;
}

.form-control.input > .body input::placeholder {
    color: var(--form-control-input-placeholder-color, rgba(0, 0, 0, 0.54));
}

.form-control.input > .body .prefix {
    color: var(--form-control-input-prefix-color, rgba(0, 0, 0, 0.54));
}

.form-control.input > .body .suffix {
    color: var(--form-control-input-suffix-color, rgba(0, 0, 0, 0.54));
}

.form-control.input[aria-invalid=true] .body {
    --form-control-input-border: var(--form-control-input-invalid-border, solid 1px rgba(255, 0, 0, 0.54));
    --form-control-input-shadow: var(--form-control-input-invalid-shadow, 0 0 0 1px rgba(255, 0, 0, 0.54));
    --form-control-input-background: var(--form-control-input-invalid-background);
    --form-control-input-color: var(--form-control-input-invalid-color);
}

.form-control.input[aria-disabled=true] .body {
    --form-control-input-border: var(--form-control-input-disabled-border, solid 1px rgba(255, 0, 0, 0.54));
    --form-control-input-shadow: var(--form-control-input-disabled-shadow, 0 0 0 1px rgba(255, 0, 0, 0.54));
    --form-control-input-background: var(--form-control-input-disabled-background);
    --form-control-input-color: var(--form-control-input-disabled-color);
}

.form-control.textarea {
    display: inline-flex;
    flex-direction: column;
    --form-control-body-width: 400px;
}

.form-control.textarea > label {
    display: flex;
    align-items: center;
    gap: 4px;
}

.form-control.textarea .body {
    font-family: var(--form-control-input-font-family, var(--font-family-sans));
    font-size: var(--form-control-input-font-size, var(--text-md-font-size));
    line-height: var(--form-control-input-line-height, var(--text-md-line-height));
    padding: var(--form-control-input-body-padding, var(--spacing-x-small) var(--spacing-small));
    border-radius: var(--form-control-input-border-radius, 0);
    border: var(--form-control-input-border, solid 1px rgba(0, 0, 0, 0.12));
    background: var(--form-control-input-background);
    color: var(--form-control-input-color);
    box-shadow: var(--form-control-input-shadow, none);
}

.form-control.textarea .body textarea {
    flex: 1;
    border: none;
    outline: none;
    background: none;
    color: inherit;
    font: inherit;
}

.form-control.textarea .body textarea::placeholder {
    color: var(--form-control-input-placeholder-color, rgba(0, 0, 0, 0.54));
}

.form-control.textarea .body .prefix {
    color: var(--form-control-input-prefix-color, rgba(0, 0, 0, 0.54));
}

.form-control.textarea .body .suffix {
    color: var(--form-control-input-suffix-color, rgba(0, 0, 0, 0.54));
}

.form-control.textarea .body .help-icon {
    color: var(--form-control-input-help-icon-color, rgba(0, 0, 0, 0.54));
}

.form-control.textarea[aria-invalid=true] .body {
    --form-control-input-border: var(--form-control-input-invalid-border, solid 1px rgba(255, 0, 0, 0.54));
    --form-control-input-shadow: var(--form-control-input-invalid-shadow, 0 0 0 1px rgba(255, 0, 0, 0.54));
    --form-control-input-background: var(--form-control-input-invalid-background);
    --form-control-input-color: var(--form-control-input-invalid-color);
}

.form-control.textarea[aria-disabled=true] .body {
    --form-control-input-border: var(--form-control-input-disabled-border, solid 1px rgba(255, 0, 0, 0.54));
    --form-control-input-shadow: var(--form-control-input-disabled-shadow, 0 0 0 1px rgba(255, 0, 0, 0.54));
    --form-control-input-background: var(--form-control-input-disabled-background);
    --form-control-input-color: var(--form-control-input-disabled-color);
}

.form-control.radio-button {
    --size: var(--radio-button-size, 24px);
    --indicator-size: var(--radio-button-indicator-size, calc(var(--size) * 0.5));
    --border-radius: var(--radio-button-border-radius, var(--border-radius-full));
    display: inline-flex;
    flex-direction: row;
    align-items: flex-start;
    gap: var(--gap, var(--radio-button-gap, 8px));
}

.form-control.radio-button,
.form-control.radio-button label,
.form-control.radio-button input[type=radio] {
    cursor: pointer;
}

.form-control.radio-button input[type=radio] {
    -webkit-appearance: none;
    appearance: none;
    min-width: var(--size);
    min-height: var(--size);
    max-width: var(--size);
    max-height: var(--size);
    border-radius: var(--border-radius);
    display: grid;
    place-content: center;
    border: var(--border, var(--radio-button-border, solid 1px var(--foreground-style-dark-alt, #000)));
    background: var(--background, var(--radio-button-background, #fff));
}

.form-control.radio-button input[type=radio]::before {
    content: "";
    width: var(--indicator-size);
    height: var(--indicator-size);
    border-radius: var(--border-radius);
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    background: var(--indicator-color, var(--foreground-style-accent-alt, #000));
}

.form-control.radio-button input[type=radio]:hover {
    --border: var(--radio-button-border-hover, inherit);
    --background: var(--radio-button-background-hover, inherit);
}

.form-control.radio-button input[type=radio]:checked {
    --border: var(--radio-button-border-checked, solid 1px var(--foreground-style-accent));
    --background: var(--radio-button-background-checked, inherit);
}

.form-control.radio-button input[type=radio]:checked::before {
    --indicator-color: var(--radio-button-indicator-color, var(--foreground-style-accent-alt));
    transform: scale(1);
}

.form-control.radio-button input[type=radio]:checked:hover {
    --border: var(--radio-button-border-checked-hover, inherit);
    --background: var(--radio-button-background-checked-hover, inherit);
}

.form-control.radio-button input[type=radio]:checked:hover::before {
    --indicator-color: var(--radio-button-indicator-color-hover, inherit);
}

.form-control.radio-button input[type=radio]:disabled:checked,
.form-control.radio-button input[type=radio]:disabled::before,
.form-control.radio-button input[type=radio]:disabled:hover:checked,
.form-control.radio-button input[type=radio]:disabled:hover::before {
    cursor: not-allowed;
    --border: var(--radio-button-border-disabled, solid 1px #aaa);
    --background: var(--radio-button-background-disabled, inherit);
    --indicator-color: var(--radio-button-indicator-color-disabled, #aaa);
}

.form-control.radio-button.disabled,
.form-control.radio-button.disabled label,
.form-control.radio-button.disabled label > *,
.form-control.radio-button.disabled input[type=radio] {
    cursor: not-allowed;
    --foreground: var(--radio-button-foreground-disabled, #aaa);
}

.form-control.checkbox {
    --size: var(--checkbox-size, 24px);
    --indicator-size: var(--checkbox-indicator-size, 20px);
    --gap: var(--checkbox-gap, 8px);
    --background: var(--checkbox-background, transparent);
    --border: var(--checkbox-border, solid 1px rgba(0, 0, 0, 0.25));
    --border-radius: var(--checkbox-border-radius, .25rem);
    --indicator-color: var(--checkbox-indicator-color, white);
    --checked-icon: var(--checkbox-checked-icon, url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M20.285 6.707l-11.285 11.285-5.285-5.285 1.414-1.414 3.871 3.871 9.871-9.871z"/></svg>'));
    --indeterminate-icon: var(--checkbox-indeterminate-icon, url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><rect x="5" y="11" width="14" height="2"/></svg>'));
    --border-hover: var(--checkbox-border-hover, solid 1px var(--foreground-style-dark));
    --background-hover: var(--checkbox-background-hover, inherit);
    --border-checked: var(--checkbox-border-checked, solid 1px var(--foreground-style-accent));
    --background-checked: var(--checkbox-background-checked, var(--foreground-style-accent));
    --border-checked-hover: var(--checkbox-border-checked-hover, solid 1px var(--foreground-style-accent-dark));
    --background-checked-hover: var(--checkbox-background-checked-hover, var(--background-checked));
    --indicator-color-hover: var(--indicator-color);
    --border-disabled: var(--checkbox-border-disabled, solid 1px var(--foreground-disabled));
    --background-disabled: var(--checkbox-background-disabled, transparent);
    --indicator-color-disabled: var(--checkbox-indicator-color-disabled, var(--foreground-disabled));
    --foreground-disabled: var(--checkbox-foreground-disabled, lightgray);
    display: inline-flex;
    flex-direction: row;
    align-items: flex-start;
    gap: var(--gap);
}

.form-control.checkbox,
.form-control.checkbox label,
.form-control.checkbox input[type=checkbox] {
    cursor: pointer;
}

.form-control.checkbox input[type=checkbox] {
    -webkit-appearance: none;
    appearance: none;
    min-width: var(--size);
    min-height: var(--size);
    max-width: var(--size);
    max-height: var(--size);
    display: grid;
    place-content: center;
    background: var(--background);
    border: var(--border);
    border-radius: var(--border-radius);
}

.form-control.checkbox input[type=checkbox]::before {
    content: "";
    width: var(--indicator-size);
    height: var(--indicator-size);
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    mask: var(--checked-icon);
    -webkit-mask: var(--checked-icon);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center center;
    -webkit-mask-position: center center;
    background-color: transparent;
}

.form-control.checkbox input[type=checkbox]:hover {
    --border: var(--border-hover);
    --background: var(--background-hover);
}

.form-control.checkbox input[type=checkbox]:checked {
    --border: var(--border-checked);
    --background: var(--background-checked);
}

.form-control.checkbox input[type=checkbox]:checked::before {
    transform: scale(1);
    background-color: var(--indicator-color);
}

.form-control.checkbox input[type=checkbox]:checked:hover {
    --border: var(--border-checked-hover);
    --background: var(--background-checked-hover);
}

.form-control.checkbox input[type=checkbox]:checked:hover::before {
    --indicator-color: var(--indicator-color-hover);
}

.form-control.checkbox input[type=checkbox]:indeterminate {
    --border: var(--border-checked);
    --background: var(--background-checked);
}

.form-control.checkbox input[type=checkbox]:indeterminate::before {
    transform: scale(1);
    mask: var(--indeterminate-icon);
    -webkit-mask: var(--indeterminate-icon);
    background-color: var(--indicator-color);
}

.form-control.checkbox input[type=checkbox]:indeterminate:hover {
    --border: var(--border-checked-hover);
    --background: var(--background-checked-hover);
}

.form-control.checkbox input[type=checkbox]:indeterminate:hover::before {
    --indicator-color: var(--indicator-color-hover);
}

.form-control.checkbox input[type=checkbox]:disabled,
.form-control.checkbox input[type=checkbox]:disabled:checked,
.form-control.checkbox input[type=checkbox]:disabled:indeterminate,
.form-control.checkbox input[type=checkbox]:disabled::before,
.form-control.checkbox input[type=checkbox]:disabled:hover,
.form-control.checkbox input[type=checkbox]:disabled:hover:checked,
.form-control.checkbox input[type=checkbox]:disabled:hover:indeterminate,
.form-control.checkbox input[type=checkbox]:disabled:hover::before {
    cursor: not-allowed;
    --border: var(--border-disabled);
    --background: var(--background-disabled);
    --indicator-color: var(--indicator-color-disabled);
}

.form-control.checkbox.disabled,
.form-control.checkbox.disabled label,
.form-control.checkbox.disabled label > *,
.form-control.checkbox.disabled input[type=checkbox] {
    cursor: not-allowed;
    --foreground: var(--foreground-disabled);
}

.form-control.dropdown {
    position: relative;
}

.form-control.dropdown[aria-readonly=true] .body,
.form-control.dropdown[aria-readonly=true] input {
    cursor: pointer;
}

.form-control.dropdown .suffix {
    cursor: pointer;
}

.form-control.dropdown.opened .dropdown-menu {
    display: block;
}

.form-control.dropdown.opened > .body > .suffix {
    transform: rotate(180deg);
}

.form-control.dropdown.opened > .supporting-text {
    visibility: hidden;
}

.form-control.dropdown .dropdown-list {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: var(--dropdown-list-top-position, 0);
    left: 0;
    z-index: 1000;
    width: var(--dropdown-list-width, inherit);
    max-height: var(--dropdown-list-max-height, 240px);
    overflow-y: auto;
    background: var(--dropdown-list-background, white);
    border: var(--dropdown-list-border, solid 1px rgba(0, 0, 0, 0.12));
    box-shadow: var(--dropdown-list-shadow, 0px 12px 16px -4px rgba(10, 13, 18, 0.08), 0px 4px 6px -2px rgba(10, 13, 18, 0.03), 0px 2px 2px -1px rgba(10, 13, 18, 0.04));
    border-radius: var(--dropdown-list-border-radius, var(--form-control-input-border-radius, 0));
    padding: var(--dropdown-list-padding, 0);
}

.form-control {
    display: flex;
    flex-direction: var(--form-control-flex-direction, column);
    gap: var(--form-control-gap, 8px);
    max-width: 100%;
}

.form-control > label {
    font-family: var(--form-control-label-font-family, var(--font-family-sans));
    font-size: var(--form-control-label-font-size, var(--text-sm-font-size));
    font-weight: var(--form-control-label-font-weight, var(--font-weight-medium));
    line-height: var(--form-control-label-line-height, var(--text-sm-line-height));
    letter-spacing: var(--form-control-label-letter-spacing, var(--letter-spacing-normal));
    color: var(--form-control-label-color, var(--text-color));
    text-transform: var(--form-control-label-text-transform, none);
}

.form-control > .body {
    overflow: hidden;
    position: relative;
    display: flex;
    width: var(--form-control-body-width, auto);
    min-width: 0;
    max-width: 100%;
}

.form-control > .body > .separator {
    display: block;
    width: 1px;
    height: 999px;
    outline: none;
    background: var(--form-control-input-divider-color, rgb(0, 0, 0));
}

.form-control > .body .prefix,
.form-control > .body .suffix,
.form-control > .body .help-icon {
    display: flex;
    align-items: center;
}

.form-control > .body .prefix .link-button,
.form-control > .body .prefix .box-button,
.form-control > .body .suffix .link-button,
.form-control > .body .suffix .box-button,
.form-control > .body .help-icon .link-button,
.form-control > .body .help-icon .box-button {
    display: flex;
    align-items: center;
    height: 100%;
    min-height: 100%;
}

.form-control > .body .prefix .link-button:hover span,
.form-control > .body .prefix .box-button:hover span,
.form-control > .body .suffix .link-button:hover span,
.form-control > .body .suffix .box-button:hover span,
.form-control > .body .help-icon .link-button:hover span,
.form-control > .body .help-icon .box-button:hover span {
    text-decoration: none;
}

.form-control > .supporting-text {
    font-family: var(--form-control-supporting-text-font-family, var(--font-family-sans));
    font-size: var(--form-control-supporting-text-font-size, var(--text-md-font-size));
    font-weight: var(--form-control-supporting-text-font-weight, var(--font-weight-regular));
    line-height: var(--form-control-supporting-text-line-height, var(--text-md-line-height));
    color: var(--form-control-supporting-text-color, rgba(0, 0, 0, 0.54));
}

.form-control .help-icon {
    display: flex;
    color: var(--form-control-help-icon-color, rgba(0, 0, 0, 0.54));
}

.form-control:focus-within > .body {
    border: var(--focus-ring-border, inherit);
    box-shadow: var(--focus-ring-shadow, inherit);
}

.form-control[aria-invalid=true] .supporting-text {
    color: var(--form-control-supporting-text-invalid-color, red);
}

/* Menu */
.sub-menu {
    --background: var(--sub-menu-background, inherit);
    --border: var(--sub-menu-border, solid 1px #ccc);
    --shadow: var(--sub-menu-shadow, none);
    --border-radius: var(--sub-menu-border-radius, 16px);
    --padding: var(--sub-menu-padding, 48px);
    --max-width: var(--sub-menu-max-width, 1664px);
    --margin: var(--sub-menu-margin, 0 auto);
    --items-padding: var(--sub-menu-item-padding, 12px);
    background: var(--background);
    border: var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--border-radius);
    padding: var(--padding);
    width: var(--max-width);
    max-width: 100%;
    margin: var(--margin);
}

.sub-menu.grid {
    --column-gap: var(--sub-menu-column-gap, 24px);
    --row-gap: var(--sub-menu-row-gap, 24px);
    --min-col-size: var(--sub-menu-min-column-size, 350px);
    --max-col-count: var(--sub-menu-max-column-count, 4);
}

.sub-menu.grid .grid {
    min-width: 100%;
    --padding: 0;
    --border: none;
}

.sub-menu .box {
    --background: var(--sub-menu-signpost-item-background, var(--signpost-item-background, transparent));
    --foreground: var(--sub-menu-signpost-item-foreground, var(--signpost-item-foreground, initial));
    --border: var(--sub-menu-signpost-item-border, var(--signpost-item-border, none));
    --border-radius: var(--sub-menu-signpost-item-border-radius, var(--signpost-item-border-radius, 0));
    --box-shadow: var(--sub-menu-signpost-item-box-shadow, var(--signpost-item-box-shadow, none));
    --padding: var(--items-padding);
    --p-margin-bottom-desktop: var(--sub-menu-signpost-item-p-margin-bottom, 12px);
    height: max-content;
}

.sub-menu .box:hover {
    --background: var(--sub-menu-signpost-item-background-hover, var(--signpost-item-hover-background, inherit));
    --foreground: var(--sub-menu-signpost-item-foreground-hover, var(--signpost-item-hover-foreground, inherit));
    --border: var(--sub-menu-signpost-item-hover-border, var(--signpost-item-hover-border, none));
    --box-shadow: var(--sub-menu-signpost-item-hover-box-shadow, var(--signpost-item-hover-box-shadow, none));
}

.sub-menu .box.active {
    --background: var(--sub-menu-signpost-item-background-active, var(--sub-menu-signpost-item-background-hover, inherit));
    --foreground: var(--sub-menu-signpost-item-foreground-active, var(--signpost-item-active-foreground, inherit));
    --border: var(--sub-menu-signpost-item-active-border, var(--signpost-item-active-border, none));
    --box-shadow: var(--sub-menu-signpost-item-active-box-shadow, var(--signpost-item-active-box-shadow, none));
}

.sub-menu .sub-menu-group {
    padding: var(--items-padding);
}

/* Molecules */
.accordion-item {
    --accordion-item-background: transparent;
    --accordion-item-box-shadow: none;
    --accordion-item-border: none;
    --accordion-item-heading-color: inherit;
    --accordion-item-body-color: var(--accordion-item-heading-color, inherit);
    --accordion-item-numbering-color: var(--accordion-item-heading-color);
    counter-increment: numbering;
    border-radius: var(--accordion-item-border-radius, 0);
    padding: var(--accordion-item-padding, 0);
    background: var(--accordion-item-background);
    box-shadow: var(--accordion-item-box-shadow);
    border: var(--accordion-item-border);
    transition: opacity 0.2s;
    overflow: hidden;
}

.accordion-item:not(:last-child) {
    margin-bottom: var(--accordion-spacing, var(--spacing-small, 0.5rem));
}

.accordion-item .accordion-item__heading {
    --foreground: var(--accordion-item-heading-color);
    --p-margin-bottom-desktop: 0;
    --p-margin-bottom-mobile: 0;
    display: grid;
    grid-template-columns: auto max-content;
    align-items: center;
    position: relative;
    padding: var(--accordion-item-heading-padding);
    cursor: pointer;
}

.accordion-item .accordion-item__heading svg {
    margin-left: 24px;
}

.accordion-item .accordion-item__body {
    display: none;
    opacity: 0;
    padding: var(--accordion-item-body-padding, var(--spacing-small, 0.5rem));
    --foreground: var(--accordion-item-body-color);
}

.accordion-item:hover {
    background: var(--accordion-item-background-hover, var(--accordion-item-background));
    box-shadow: var(--accordion-item-box-shadow-hover, var(--accordion-item-box-shadow));
    border: var(--accordion-item-border-hover, var(--accordion-item-border));
}

.accordion-item:hover .accordion-item__heading {
    color: var(--accordion-item-heading-color-hover, var(--accordion-item-heading-color));
}

.accordion-item:hover .accordion-item__body {
    color: var(--accordion-item-body-color-hover, var(--accordion-item-body-color));
}

.accordion-item[aria-expanded=true] {
    height: auto;
    background: var(--accordion-item-background-expanded, var(--accordion-item-background, inherit));
    box-shadow: var(--accordion-item-box-shadow-expanded, var(--accordion-item-box-shadow, inherit));
    border: var(--accordion-item-border-expanded, var(--accordion-item-border, inherit));
}

.accordion-item[aria-expanded=true] .accordion-item__heading {
    color: var(--accordion-item-heading-color-expanded, var(--accordion-item-heading-color));
}

.accordion-item[aria-expanded=true] .accordion-item__heading svg {
    transform: rotate(180deg);
}

.accordion-item[aria-expanded=true] .accordion-item__body {
    display: block;
    opacity: 1;
    color: var(--accordion-item-body-color-expanded, var(--accordion-item-body-color));
}

.accordion-item.numbered .accordion-item__heading {
    grid-template-columns: max-content auto max-content;
}

.accordion-item.numbered .accordion-item__heading::before {
    content: counter(numbering) ".";
    margin-right: var(--accordion-item-numbering-margin);
    font-size: var(--accordion-item-numbering-font-size);
    font-weight: var(--accordion-item-numbering-font-weight);
    line-height: var(--accordion-item-numbering-line-height);
    color: var(--accordion-item-numbering-color, var(--accordion-item-heading-color));
    align-self: baseline;
}

.accordion-item.style-default {
    /* Default style */
    --accordion-item-border: var(--accordion-item-default-border);
    --accordion-item-background: var(--accordion-item-default-background);
    --accordion-item-box-shadow: var(--accordion-item-default-box-shadow);
    --accordion-item-heading-color: var(--accordion-item-default-heading-color);
    --accordion-item-numbering-color: var(--accordion-item-default-numbering-color);
    --accordion-item-body-color: var(--accordion-item-default-body-color);
    /* Default style - expanded */
    --accordion-item-border-expanded: var(--accordion-item-default-expanded-border);
    --accordion-item-background-expanded: var(--accordion-item-default-expanded-background);
    --accordion-item-box-shadow-expanded: var(--accordion-item-default-expanded-box-shadow);
    --accordion-item-heading-color-expanded: var(--accordion-item-default-expanded-heading-color);
    --accordion-item-numbering-color-expanded: var(--accordion-item-default-expanded-numbering-color);
    --accordion-item-body-color-expanded: var(--accordion-item-default-expanded-body-color);
    /* Default style :hover */
    --accordion-item-border-hover: var(--accordion-item-default-border-hover);
    --accordion-item-background-hover: var(--accordion-item-default-background-hover);
    --accordion-item-box-shadow-hover: var(--accordion-item-default-box-shadow-hover);
    --accordion-item-heading-color-hover: var(--accordion-item-default-heading-color-hover);
    --accordion-item-numbering-color-hover: var(--accordion-item-default-numbering-color-hover);
    --accordion-item-body-color-hover: var(--accordion-item-default-body-color-hover);
    /* Default style - expanded :hover */
    --accordion-item-border-expanded-hover: var(--accordion-item-default-expanded-border-hover);
    --accordion-item-background-expanded-hover: var(--accordion-item-default-expanded-background-hover);
    --accordion-item-box-shadow-expanded-hover: var(--accordion-item-default-expanded-box-shadow-hover);
    --accordion-item-heading-color-expanded-hover: var(--accordion-item-default-expanded-heading-color-hover);
    --accordion-item-numbering-color-expanded-hover: var(--accordion-item-default-expanded-numbering-color-hover);
    --accordion-item-body-color-expanded-hover: var(--accordion-item-default-expanded-body-color-hover);
}

.accordion-item.style-inverse {
    /* Inverse style */
    --accordion-item-border: var(--accordion-item-inverse-border);
    --accordion-item-background: var(--accordion-item-inverse-background);
    --accordion-item-box-shadow: var(--accordion-item-inverse-box-shadow);
    --accordion-item-heading-color: var(--accordion-item-inverse-heading-color);
    --accordion-item-numbering-color: var(--accordion-item-inverse-numbering-color);
    --accordion-item-body-color: var(--accordion-item-inverse-body-color);
    /* Inverse style - expanded */
    --accordion-item-border-expanded: var(--accordion-item-inverse-expanded-border);
    --accordion-item-background-expanded: var(--accordion-item-inverse-expanded-background);
    --accordion-item-box-shadow-expanded: var(--accordion-item-inverse-expanded-box-shadow);
    --accordion-item-heading-color-expanded: var(--accordion-item-inverse-expanded-heading-color);
    --accordion-item-numbering-color-expanded: var(--accordion-item-inverse-expanded-numbering-color);
    --accordion-item-body-color-expanded: var(--accordion-item-inverse-expanded-body-color);
    /* Inverse style :hover */
    --accordion-item-border-hover: var(--accordion-item-inverse-border-hover);
    --accordion-item-background-hover: var(--accordion-item-inverse-background-hover);
    --accordion-item-box-shadow-hover: var(--accordion-item-inverse-box-shadow-hover);
    --accordion-item-heading-color-hover: var(--accordion-item-inverse-heading-color-hover);
    --accordion-item-numbering-color-hover: var(--accordion-item-inverse-numbering-color-hover);
    --accordion-item-body-color-hover: var(--accordion-item-inverse-body-color-hover);
    /* Inverse style - expanded :hover */
    --accordion-item-border-expanded-hover: var(--accordion-item-inverse-expanded-border-hover);
    --accordion-item-background-expanded-hover: var(--accordion-item-inverse-expanded-background-hover);
    --accordion-item-box-shadow-expanded-hover: var(--accordion-item-inverse-expanded-box-shadow-hover);
    --accordion-item-heading-color-expanded-hover: var(--accordion-item-inverse-expanded-heading-color-hover);
    --accordion-item-numbering-color-expanded-hover: var(--accordion-item-inverse-expanded-numbering-color-hover);
    --accordion-item-body-color-expanded-hover: var(--accordion-item-inverse-expanded-body-color-hover);
}

.card {
    --card-horizontal-image-container-border-radius: var(--image-border-radius);
    --card-vertical-image-container-border-radius: var(--image-border-radius);
    --card-horizontal-image-border-radius: var(--image-border-radius);
    --card-vertical-image-border-radius: var(--image-border-radius);
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--card-gap, 20px 40px);
    border: var(--card-border, none);
    border-radius: var(--card-border-radius, 0);
    background: var(--card-background, transparent);
    box-shadow: var(--card-shadow, none);
    overflow: hidden;
    min-height: var(--card-min-height, auto);
    height: var(--card-height, max-content);
    padding: 0;
}

.card.full-height {
    --card-height: auto;
    height: auto;
}

.card .card__image {
    box-sizing: border-box;
    flex-basis: var(--card-image-width, auto);
    width: var(--card-image-width, 100%);
    max-width: 100%;
    height: max-content;
    max-height: fit-content;
    object-fit: cover;
    padding: var(--card-image-padding, 0);
    background: var(--card-image-background, transparent);
    border-radius: var(--card-image-container-border-radius);
}

.card .card__image picture {
    --image-border-radius: var(--card-image-border-radius, 0);
}

.card .card__image picture img {
    border-radius: var(--card-image-border-radius);
}

.card .card__body {
    --foreground: var(--card-body-foreground, var(--text-color, inherit));
    box-sizing: border-box;
    display: block;
    padding: var(--card-body-padding, 0);
    background: var(--card-body-background, transparent);
    border-radius: var(--card-body-container-border-radius, 0);
    justify-content: var(--card-body-justify-content, flex-start);
}

.card .card__body a:not([class]) {
    --foreground: var(--card-headline-color, var(--card-body-foreground));
    text-decoration: none;
}

.card .card__body a:hover {
    --foreground: var(--card-headline-color-hover, var(--card-body-foreground));
}

.card.horizontal {
    --card-image-padding: var(--card-horizontal-image-padding);
    --card-body-padding: var(--card-horizontal-body-padding);
    flex-direction: row;
}

.card.horizontal .card__image,
.card.horizontal .card__body {
    flex: 1 1 50%;
}

.card.horizontal .card__image {
    --card-image-container-border-radius: var(--card-horizontal-image-container-border-radius);
}

.card.horizontal .card__image > picture,
.card.horizontal .card__image > picture > img {
    max-width: 100%;
    width: var(--card-image-width, 100%);
    min-height: 100%;
}

.card.horizontal .card__image picture {
    --card-image-border-radius: var(--card-horizontal-image-border-radius);
}

.card.horizontal.content-width-auto .card__image {
    flex: 0 1 max-content;
}

.card.horizontal.content-width-auto .card__body {
    flex: 1;
}

@media screen and (max-width: 768px) {
    .card.horizontal.content-width-auto .card__image {
        width: auto;
    }
}

.card.horizontal.full-size-image {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* obrázek | body */
}

.card.horizontal.full-size-image .card__image {
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 768px) {
    .card.horizontal.full-size-image {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
    }

    .card.horizontal.full-size-image .card__image,
    .card.horizontal.full-size-image .card__body {
        flex: none;
        width: 100%;
    }

    .card.horizontal.full-size-image .card__image {
        height: auto;
        order: 1;
    }

    .card.horizontal.full-size-image .card__body {
        order: 2;
    }
}

@media screen and (min-width: 768px) {
    .card.horizontal.full-size-image.reversed > :nth-child(1) {
        order: 2;
    }

    .card.horizontal.full-size-image.reversed > :nth-child(2) {
        order: 1;
    }
}

@media screen and (min-width: 768px) {
    .card.horizontal.reversed {
        flex-direction: row-reverse;
    }
}

.card.horizontal.top {
    align-items: flex-start;
}

.card.horizontal.bottom {
    align-items: flex-end;
}

.card.horizontal.center {
    align-items: center;
}

@media screen and (max-width: 768px) {
    .card.horizontal {
        --card-image-padding: var(--card-vertical-image-padding);
        --card-body-padding: var(--card-vertical-body-padding);
        flex-direction: column;
    }

    .card.horizontal.center,
    .card.horizontal.top,
    .card.horizontal.bottom {
        align-items: flex-start;
    }

    .card.horizontal .card__image {
        --card-image-container-border-radius: var(--card-vertical-image-container-border-radius);
    }

    .card.horizontal .card__image picture {
        --card-image-border-radius: var(--card-vertical-image-border-radius);
    }
}

.card.vertical {
    --card-image-padding: var(--card-vertical-image-padding);
    --card-body-padding: var(--card-vertical-body-padding);
    flex-direction: column;
}

.card.vertical .card__body {
    flex: 1 1 auto;
    width: 100%;
}

.card.vertical .card__image {
    --card-image-container-border-radius: var(--card-vertical-image-container-border-radius);
}

.card.vertical .card__image picture {
    --card-image-border-radius: var(--card-vertical-image-border-radius);
}

.card.clickable {
    position: relative;
}

.card.clickable:hover .card__image img {
    transform: scale(1.03);
}

.card.clickable .card__body a.box-button,
.card.clickable .card__body a.link-button,
.card.clickable .card__body a.icon-button {
    position: static;
}

.card.clickable .card__body a.box-button::after,
.card.clickable .card__body a.link-button::after,
.card.clickable .card__body a.icon-button::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.card.default {
    --card-horizontal-image-container-border-radius: var(--card-horizontal-default-image-container-border-radius);
    --card-vertical-image-container-border-radius: var(--card-vertical-default-image-container-border-radius);
    --card-horizontal-image-border-radius: var(--card-horizontal-default-image-border-radius);
    --card-vertical-image-border-radius: var(--card-vertical-default-image-border-radius);
    --card-horizontal-image-padding: var(--card-horizontal-default-image-padding);
    --card-vertical-image-padding: var(--card-vertical-default-image-padding);
    --card-horizontal-body-padding: var(--card-horizontal-default-body-padding);
    --card-vertical-body-padding: var(--card-vertical-default-body-padding);
    --card-gap: var(--card-default-gap);
    --card-min-height: var(--card-default-min-height);
    --card-border: var(--card-default-border);
    --card-border-radius: var(--card-default-border-radius);
    --card-background: var(--card-default-background);
    --card-shadow: var(--card-default-shadow);
    --card-image-width: var(--card-default-image-width);
    --card-image-background: var(--card-default-image-background);
    --card-body-background: var(--card-default-body-background);
    --card-body-container-border-radius: var(--card-default-body-container-border-radius);
    --card-body-foreground: var(--card-default-body-foreground);
    --card-headline-color: var(--card-default-headline-color);
    --card-headline-color-hover: var(--card-default-headline-color-hover);
    --card-body-justify-content: var(--card-default-body-justify-content);
}

@media screen and (max-width: 768px) {
    .card.default.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-default-body-padding-sm-mobile);
    }

    .card.default.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-default-body-padding-lg-mobile);
    }

    .card.default.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-default-body-padding-sm-mobile);
    }

    .card.default.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-default-body-padding-lg-mobile);
    }
}

@media screen and (min-width: 769px) {
    .card.default.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-default-body-padding-sm-tablet);
    }

    .card.default.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-default-body-padding-lg-tablet);
    }

    .card.default.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-default-body-padding-sm-tablet);
    }

    .card.default.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-default-body-padding-lg-tablet);
    }
}

@media screen and (min-width: 1280px) {
    .card.default.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-default-body-padding-sm-desktop);
    }

    .card.default.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-default-body-padding-lg-desktop);
    }

    .card.default.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-default-body-padding-sm-desktop);
    }

    .card.default.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-default-body-padding-lg-desktop);
    }
}

.card.alt-a {
    --card-horizontal-image-container-border-radius: var(--card-horizontal-alt-a-image-container-border-radius);
    --card-vertical-image-container-border-radius: var(--card-vertical-alt-a-image-container-border-radius);
    --card-horizontal-image-border-radius: var(--card-horizontal-alt-a-image-border-radius);
    --card-vertical-image-border-radius: var(--card-vertical-alt-a-image-border-radius);
    --card-horizontal-image-padding: var(--card-horizontal-alt-a-image-padding);
    --card-vertical-image-padding: var(--card-vertical-alt-a-image-padding);
    --card-horizontal-body-padding: var(--card-horizontal-alt-a-body-padding);
    --card-vertical-body-padding: var(--card-vertical-alt-a-body-padding);
    --card-gap: var(--card-alt-a-gap);
    --card-min-height: var(--card-alt-a-min-height);
    --card-border: var(--card-alt-a-border);
    --card-border-radius: var(--card-alt-a-border-radius);
    --card-background: var(--card-alt-a-background);
    --card-shadow: var(--card-alt-a-shadow);
    --card-image-width: var(--card-alt-a-image-width);
    --card-image-background: var(--card-alt-a-image-background);
    --card-body-background: var(--card-alt-a-body-background);
    --card-body-container-border-radius: var(--card-alt-a-body-container-border-radius);
    --card-body-foreground: var(--card-alt-a-body-foreground);
    --card-headline-color: var(--card-alt-a-headline-color);
    --card-headline-color-hover: var(--card-alt-a-headline-color-hover);
    --card-body-justify-content: var(--card-alt-a-body-justify-content);
}

@media screen and (max-width: 768px) {
    .card.alt-a.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-a-body-padding-sm-mobile);
    }

    .card.alt-a.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-a-body-padding-lg-mobile);
    }

    .card.alt-a.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-a-body-padding-sm-mobile);
    }

    .card.alt-a.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-a-body-padding-lg-mobile);
    }
}

@media screen and (min-width: 769px) {
    .card.alt-a.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-a-body-padding-sm-tablet);
    }

    .card.alt-a.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-a-body-padding-lg-tablet);
    }

    .card.alt-a.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-a-body-padding-sm-tablet);
    }

    .card.alt-a.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-a-body-padding-lg-tablet);
    }
}

@media screen and (min-width: 1280px) {
    .card.alt-a.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-a-body-padding-sm-desktop);
    }

    .card.alt-a.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-a-body-padding-lg-desktop);
    }

    .card.alt-a.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-a-body-padding-sm-desktop);
    }

    .card.alt-a.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-a-body-padding-lg-desktop);
    }
}

.card.alt-b {
    --card-horizontal-image-container-border-radius: var(--card-horizontal-alt-b-image-container-border-radius);
    --card-vertical-image-container-border-radius: var(--card-vertical-alt-b-image-container-border-radius);
    --card-horizontal-image-border-radius: var(--card-horizontal-alt-b-image-border-radius);
    --card-vertical-image-border-radius: var(--card-vertical-alt-b-image-border-radius);
    --card-horizontal-image-padding: var(--card-horizontal-alt-b-image-padding);
    --card-vertical-image-padding: var(--card-vertical-alt-b-image-padding);
    --card-horizontal-body-padding: var(--card-horizontal-alt-b-body-padding);
    --card-vertical-body-padding: var(--card-vertical-alt-b-body-padding);
    --card-gap: var(--card-alt-b-gap);
    --card-min-height: var(--card-alt-b-min-height);
    --card-border: var(--card-alt-b-border);
    --card-border-radius: var(--card-alt-b-border-radius);
    --card-background: var(--card-alt-b-background);
    --card-shadow: var(--card-alt-b-shadow);
    --card-image-width: var(--card-alt-b-image-width);
    --card-image-background: var(--card-alt-b-image-background);
    --card-body-background: var(--card-alt-b-body-background);
    --card-body-container-border-radius: var(--card-alt-b-body-container-border-radius);
    --card-body-foreground: var(--card-alt-b-body-foreground);
    --card-headline-color: var(--card-alt-b-headline-color);
    --card-headline-color-hover: var(--card-alt-b-headline-color-hover);
    --card-body-justify-content: var(--card-alt-b-body-justify-content);
}

@media screen and (max-width: 768px) {
    .card.alt-b.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-b-body-padding-sm-mobile);
    }

    .card.alt-b.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-b-body-padding-lg-mobile);
    }

    .card.alt-b.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-b-body-padding-sm-mobile);
    }

    .card.alt-b.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-b-body-padding-lg-mobile);
    }
}

@media screen and (min-width: 769px) {
    .card.alt-b.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-b-body-padding-sm-tablet);
    }

    .card.alt-b.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-b-body-padding-lg-tablet);
    }

    .card.alt-b.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-b-body-padding-sm-tablet);
    }

    .card.alt-b.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-b-body-padding-lg-tablet);
    }
}

@media screen and (min-width: 1280px) {
    .card.alt-b.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-b-body-padding-sm-desktop);
    }

    .card.alt-b.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-b-body-padding-lg-desktop);
    }

    .card.alt-b.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-b-body-padding-sm-desktop);
    }

    .card.alt-b.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-b-body-padding-lg-desktop);
    }
}

.card.alt-c {
    --card-horizontal-image-container-border-radius: var(--card-horizontal-alt-c-image-container-border-radius);
    --card-vertical-image-container-border-radius: var(--card-vertical-alt-c-image-container-border-radius);
    --card-horizontal-image-border-radius: var(--card-horizontal-alt-c-image-border-radius);
    --card-vertical-image-border-radius: var(--card-vertical-alt-c-image-border-radius);
    --card-horizontal-image-padding: var(--card-horizontal-alt-c-image-padding);
    --card-vertical-image-padding: var(--card-vertical-alt-c-image-padding);
    --card-horizontal-body-padding: var(--card-horizontal-alt-c-body-padding);
    --card-vertical-body-padding: var(--card-vertical-alt-c-body-padding);
    --card-gap: var(--card-alt-c-gap);
    --card-min-height: var(--card-alt-c-min-height);
    --card-border: var(--card-alt-c-border);
    --card-border-radius: var(--card-alt-c-border-radius);
    --card-background: var(--card-alt-c-background);
    --card-shadow: var(--card-alt-c-shadow);
    --card-image-width: var(--card-alt-c-image-width);
    --card-image-background: var(--card-alt-c-image-background);
    --card-body-background: var(--card-alt-c-body-background);
    --card-body-container-border-radius: var(--card-alt-c-body-container-border-radius);
    --card-body-foreground: var(--card-alt-c-body-foreground);
    --card-headline-color: var(--card-alt-c-headline-color);
    --card-headline-color-hover: var(--card-alt-c-headline-color-hover);
    --card-body-justify-content: var(--card-alt-c-body-justify-content);
}

@media screen and (max-width: 768px) {
    .card.alt-c.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-c-body-padding-sm-mobile);
    }

    .card.alt-c.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-c-body-padding-lg-mobile);
    }

    .card.alt-c.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-c-body-padding-sm-mobile);
    }

    .card.alt-c.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-c-body-padding-lg-mobile);
    }
}

@media screen and (min-width: 769px) {
    .card.alt-c.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-c-body-padding-sm-tablet);
    }

    .card.alt-c.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-c-body-padding-lg-tablet);
    }

    .card.alt-c.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-c-body-padding-sm-tablet);
    }

    .card.alt-c.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-c-body-padding-lg-tablet);
    }
}

@media screen and (min-width: 1280px) {
    .card.alt-c.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-c-body-padding-sm-desktop);
    }

    .card.alt-c.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-c-body-padding-lg-desktop);
    }

    .card.alt-c.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-c-body-padding-sm-desktop);
    }

    .card.alt-c.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-c-body-padding-lg-desktop);
    }
}

.card.alt-d {
    --card-horizontal-image-container-border-radius: var(--card-horizontal-alt-d-image-container-border-radius);
    --card-vertical-image-container-border-radius: var(--card-vertical-alt-d-image-container-border-radius);
    --card-horizontal-image-border-radius: var(--card-horizontal-alt-d-image-border-radius);
    --card-vertical-image-border-radius: var(--card-vertical-alt-d-image-border-radius);
    --card-horizontal-image-padding: var(--card-horizontal-alt-d-image-padding);
    --card-vertical-image-padding: var(--card-vertical-alt-d-image-padding);
    --card-horizontal-body-padding: var(--card-horizontal-alt-d-body-padding);
    --card-vertical-body-padding: var(--card-vertical-alt-d-body-padding);
    --card-gap: var(--card-alt-d-gap);
    --card-min-height: var(--card-alt-d-min-height);
    --card-border: var(--card-alt-d-border);
    --card-border-radius: var(--card-alt-d-border-radius);
    --card-background: var(--card-alt-d-background);
    --card-shadow: var(--card-alt-d-shadow);
    --card-image-width: var(--card-alt-d-image-width);
    --card-image-background: var(--card-alt-d-image-background);
    --card-body-background: var(--card-alt-d-body-background);
    --card-body-container-border-radius: var(--card-alt-d-body-container-border-radius);
    --card-body-foreground: var(--card-alt-d-body-foreground);
    --card-headline-color: var(--card-alt-d-headline-color);
    --card-headline-color-hover: var(--card-alt-d-headline-color-hover);
    --card-body-justify-content: var(--card-alt-d-body-justify-content);
}

@media screen and (max-width: 768px) {
    .card.alt-d.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-d-body-padding-sm-mobile);
    }

    .card.alt-d.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-d-body-padding-lg-mobile);
    }

    .card.alt-d.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-d-body-padding-sm-mobile);
    }

    .card.alt-d.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-d-body-padding-lg-mobile);
    }
}

@media screen and (min-width: 769px) {
    .card.alt-d.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-d-body-padding-sm-tablet);
    }

    .card.alt-d.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-d-body-padding-lg-tablet);
    }

    .card.alt-d.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-d-body-padding-sm-tablet);
    }

    .card.alt-d.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-d-body-padding-lg-tablet);
    }
}

@media screen and (min-width: 1280px) {
    .card.alt-d.horizontal.padding-sm {
        --card-body-padding: var(--card-horizontal-alt-d-body-padding-sm-desktop);
    }

    .card.alt-d.horizontal.padding-lg {
        --card-body-padding: var(--card-horizontal-alt-d-body-padding-lg-desktop);
    }

    .card.alt-d.vertical.padding-sm {
        --card-body-padding: var(--card-vertical-alt-d-body-padding-sm-desktop);
    }

    .card.alt-d.vertical.padding-lg {
        --card-body-padding: var(--card-vertical-alt-d-body-padding-lg-desktop);
    }
}

.list-item.of-news {
    display: flex;
    gap: var(--list-item-gap, 20px 40px);
}

.list-item.of-news .list-item__image {
    height: max-content;
    max-height: fit-content;
}

.list-item.of-news .list-item__image img {
    aspect-ratio: var(--list-item-thumb-aspect-ratio, 3/2);
}

.list-item.of-news .list-item__body {
    display: flex;
    flex-direction: column;
    gap: var(--list-item-body-gap, 8px);
    padding: var(--list-item-body-padding, 0 48px 0 0);
}

.list-item.of-news.horizontal {
    flex-direction: row;
}

.list-item.of-news.horizontal .list-item__image {
    flex-basis: var(--list-item-horizontal-thumb-width, 360px);
    min-width: var(--list-item-horizontal-thumb-width, 360px);
}

@media screen and (max-width: 768px) {
    .list-item.of-news.horizontal {
        flex-direction: column;
    }
}

.list-item.of-news.vertical {
    flex-direction: column;
}

prs-switch {
    --switch-background-checked: #4caf50;
    --uui-font-family: var(--switch-font-family, inherit);
    --foreground: var(--switch-foreground, var(--text-color));
    --text-secondary: var(--foreground);
    --bg-quaternary: var(--switch-background, #e0e0e0);
    --bg-brand-solid: var(--switch-background-checked);
    --bg-brand-solid-hover: var(--switch-background-checked);
}

/*# sourceMappingURL=styles.css.map */