/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: "Poppins", "Roboto", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;
    --spacing: 0.25rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --radius-lg: 0.5rem;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --aspect-video: 16 / 9;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --breakpoint-lg: 64rem;
    --breakpoint-xl: 85.375rem;
    --breakpoint-3xl: 120rem;
    --color-dark: #ff4822;
    --color-base: #ff7036;
    --color-medium: #ffb698;
    --color-light: #ffe5db;
    --color-lighter: #ffede5;
    --color-lightest: #fff5f1;
    --color-black: #282828;
    --color-white: #ffffff;
    --color-focus: var(--color-dark);
    --color-grey-darker: #424242;
    --color-grey-dark: #545454;
    --color-grey: #767676;
    --color-grey-lighter: #d6d6d6;
    --color-grey-lightest: #f5f5f5;
    --color-error-dark: #b70101;
    --color-error: #d00000;
    --color-error-light: #eb0000;
    --color-error-lightest: #ffe1e1;
    --color-success-dark: #08a65a;
    --color-success: #37e17b;
    --color-success-lightest: #f8fffb;
    --color-warning-dark: #a35a00;
    --color-warning: #ffa800;
    --color-warning-lightest: #fff9ee;
    --color-validated: #40cab1;
    --color-validated-lightest: #eefffc;
    --color-informative: #40b1ca;
    --color-informative-lightest: #e9fbff;
    --color-processing: #a504b3;
    --color-processing-lightest: #fceefd;
    --background-image-icon-chevron-small-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 44 44'%3E%3Cpath fill='%23282828' d='m25.88 20.64-3.44 3.2a.66.66 0 0 1-.88 0l-3.44-3.2c-.26-.24-.07-.64.31-.64h7.14c.38 0 .57.4.31.64'/%3E%3C/svg%3E");
    --background-image-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44' fill='none'%3E%3Cpath fill='%2337E17B' d='m26.648 19.113-6.33 6.524a1.176 1.176 0 0 1-1.698 0l-3.268-3.368a1.265 1.265 0 0 1 0-1.75 1.176 1.176 0 0 1 1.698 0l2.419 2.493 5.481-5.65a1.176 1.176 0 0 1 1.698 0 1.265 1.265 0 0 1 0 1.751Z'/%3E%3C/svg%3E");
    --background-image-icon-checkmark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='16' fill='%23282828'/%3E%3Cpath fill='%23fff' d='m29.3 18.92-7.5 7.5-3.1-3.1a1.25 1.25 0 0 0-1.77 1.76l3.99 4a1.25 1.25 0 0 0 1.77 0l8.38-8.39a1.25 1.25 0 0 0-1.76-1.77'/%3E%3C/svg%3E");
    --font-roboto: "Roboto", sans-serif;
    --font-condensed: "Roboto Condensed", sans-serif;
    --font-size-paragraph-1: var(--text-lg);
    --font-size-paragraph-2: var(--text-base);
    --font-size-paragraph-3: var(--text-base);
    --font-size-paragraph-4: var(--text-sm);
    --font-size-paragraph-5: var(--text-sm);
    --font-size-paragraph-6: var(--text-sm);
    --font-size-paragraph-7: var(--text-xs);
    --line-height-paragraph-1: 1.6875rem;
    --line-height-paragraph-2: 1.5rem;
    --line-height-paragraph-3: 1.5rem;
    --line-height-paragraph-4: 1.25rem;
    --line-height-paragraph-5: 1.25rem;
    --line-height-paragraph-6: 1.025rem;
    --line-height-paragraph-7: 0.9rem;
    --font-family-paragraph-1: var(--font-sans);
    --font-family-paragraph-2: var(--font-sans);
    --font-family-paragraph-3: var(--font-roboto);
    --font-family-paragraph-4: var(--font-sans);
    --font-family-paragraph-5: var(--font-roboto);
    --font-family-paragraph-6: var(--font-condensed);
    --font-family-paragraph-7: var(--font-condensed);
    --font-size-button-l: 1rem;
    --font-size-button-m: 0.875rem;
    --font-size-button-s: 0.75rem;
    --line-height-button-l: 1.5rem;
    --line-height-button-m: 1.3125rem;
    --line-height-button-s: 1.125rem;
    --font-family-button-l: var(--font-sans);
    --font-family-button-m: var(--font-sans);
    --font-family-button-s: var(--font-sans);
    --font-family-indication: var(--font-condensed);
    --font-size-indication: var(--text-sm);
    --font-size-indication-small: var(--text-xs);
    --font-weight-indication: 400;
    --letter-spacing-indication: 0.04375rem;
    --letter-spacing-indication-small: 0.0375rem;
    --font-weight-h1: 800;
    --font-size-h1-d: 2.375rem;
    --line-height-h1-d: 3.5625rem;
    --font-size-h1-m: 1.75rem;
    --line-height-h1-m: 2.625rem;
    --font-weight-h2: 700;
    --font-size-h2-d: 2.25rem;
    --line-height-h2-d: 3.375rem;
    --font-size-h2-m: 1.625rem;
    --line-height-h2-m: 2.4375rem;
    --font-weight-h3: 700;
    --font-size-h3-d: 2rem;
    --line-height-h3-d: 3rem;
    --font-size-h3-m: 1.375rem;
    --line-height-h3-m: 2.0625rem;
    --font-weight-h4: 700;
    --font-size-h4-d: 1.5rem;
    --line-height-h4-d: 1.875rem;
    --font-size-h4-m: 1.25rem;
    --line-height-h4-m: 2rem;
    --font-weight-h5: 600;
    --font-size-h5-d: 1.25rem;
    --line-height-h5-d: 1.75rem;
    --font-size-h5-m: 1.125rem;
    --line-height-h5-m: 1.625rem;
    --font-weight-h6: 400;
    --font-size-h6-d: 1.25rem;
    --line-height-h6-d: 1.75rem;
    --font-size-h6-m: 1.125rem;
    --line-height-h6-m: 1.625rem;
    --shadow-raised: 0 3px 5px #5454541f;
    --container-double-3-col-a-md: 25.375rem;
    --container-double-3-col-b-md: 12.875rem;
    --container-double-3-col-a-lg: 31rem;
    --container-double-3-col-b-lg: 17.5rem;
    --container-double-3-col-a-xl: 42.25rem;
    --container-double-3-col-b-xl: 21.875rem;
    --button-border-radius: 3.125rem;
    --button-focus-outline: var(--color-medium);
    --button-font-size: var(--text-sm);
    --button-font-weight: var(--font-weight-medium);
    --button-spacing: 0.75rem 1.5rem;
    --button-color: var(--color-white);
    --button-background: var(--color-black);
    --button-border: none;
    --button-hover-color: var(--color-white);
    --button-hover-background: var(--color-grey-dark);
    --button-disabled-color: var(--color-white);
    --button-disabled-background: var(--color-grey-lighter);
    --button-disabled-border: var(--color-grey-lighter) solid 1px;
    --button-font-family: var(--font-sans);
    --button-width: auto;
    --font-size-link: var(--text-sm);
    --font-family-link: var(--font-sans);
    --font-weight-link: var(--font-weight-medium);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji');
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden='until-found'])) {
    display: none !important;
  }
}
@layer utilities {
  .pointer-events-none {
    pointer-events: none;
  }
  .collapse {
    visibility: collapse;
  }
  .invisible {
    visibility: hidden;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .isolate {
    isolation: isolate;
  }
  .col-span-full {
    grid-column: 1 / -1;
  }
  .container {
    width: 100%;
    @media (width >= 20rem) {
      max-width: 20rem;
    }
    @media (width >= 24.375rem) {
      max-width: 24.375rem;
    }
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 85.375rem) {
      max-width: 85.375rem;
    }
    @media (width >= 105rem) {
      max-width: 105rem;
    }
    @media (width >= 120rem) {
      max-width: 120rem;
    }
  }
  .m-0 {
    margin: calc(var(--spacing) * 0);
  }
  .container-double-3 {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      max-width: 85.375rem;
      margin-inline: auto;
      padding-inline: calc(var(--spacing) * 13);
      display: flex;
      justify-content: space-between;
      & > *:first-child {
        width: var(--container-double-3-col-a-md);
        flex-shrink: 0;
      }
      & > *:last-child:not(:first-child) {
        width: var(--container-double-3-col-b-md);
        flex-shrink: 0;
      }
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 20);
      & > *:first-child {
        width: var(--container-double-3-col-a-lg);
      }
      & > *:last-child:not(:first-child) {
        width: var(--container-double-3-col-b-lg);
      }
    }
    @media (width >= 85.375rem) {
      & > *:first-child {
        width: var(--container-double-3-col-a-xl);
      }
      & > *:last-child:not(:first-child) {
        width: var(--container-double-3-col-b-xl);
      }
    }
    & > :only-child {
      margin-inline: auto;
    }
  }
  .container-double-2 {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 24.375rem) {
      padding-inline: 0;
    }
    @media (width >= 48rem) {
      width: 41.875rem;
      margin-inline: auto;
    }
    @media (width >= 64rem) {
      display: flex;
      width: fit-content;
      margin-inline: auto;
      gap: 3rem;
      & > *:first-child:not(:last-child) {
        width: 15rem;
        flex-shrink: 0;
      }
      & > *:last-child {
        width: 36rem;
        flex-shrink: 0;
      }
    }
    @media (width >= 85.375rem) {
      gap: 4rem;
      & > *:last-child {
        width: 56.25rem;
      }
    }
    @media (width >= 105rem) {
      & > *:first-child:not(:last-child) {
        width: 19.375rem;
      }
      & > *:last-child {
        width: 73.5rem;
      }
    }
    @media (width >= 120rem) {
      gap: 6rem;
      & > *:last-child {
        width: 78.5rem;
      }
    }
  }
  .container-double-1 {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      padding-inline: 0;
      & > *:first-child > * {
        width: 27.75rem;
        margin-inline: auto;
      }
      & > *:last-child > * {
        width: 20.5rem;
        margin-inline: auto;
      }
    }
    @media (width >= 64rem) {
      display: grid;
      grid-template-columns: 58% 42%;
    }
    @media (width >= 85.375rem) {
      & > *:first-child > * {
        width: 33.75rem;
      }
      & > *:last-child > * {
        width: 25rem;
      }
    }
  }
  .container-single-3 {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      max-width: var(--container-double-3-col-a-md);
      padding-inline: 0;
      margin-inline: auto;
    }
    @media (width >= 64rem) {
      max-width: var(--container-double-3-col-a-lg);
    }
    @media (width >= 85.375rem) {
      max-width: var(--container-double-3-col-a-xl);
    }
  }
  .container-l {
    width: 100%;
    max-width: 85.375rem;
    margin-inline: auto;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      padding-inline: calc(var(--spacing) * 13);
    }
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 20);
    }
  }
  .container-m {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      max-width: 33.75rem;
      padding-inline: 0;
      margin-inline: auto;
    }
  }
  .container-s {
    width: 100%;
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      max-width: 25rem;
      padding-inline: 0;
      margin-inline: auto;
    }
  }
  .mx-auto {
    margin-inline: auto;
  }
  .my-4 {
    margin-block: calc(var(--spacing) * 4);
  }
  .my-5 {
    margin-block: calc(var(--spacing) * 5);
  }
  .my-8 {
    margin-block: calc(var(--spacing) * 8);
  }
  .my-10 {
    margin-block: calc(var(--spacing) * 10);
  }
  .my-12 {
    margin-block: calc(var(--spacing) * 12);
  }
  .my-auto {
    margin-block: auto;
  }
  .ms-1 {
    margin-inline-start: calc(var(--spacing) * 1);
  }
  .ms-3 {
    margin-inline-start: calc(var(--spacing) * 3);
  }
  .ms-auto {
    margin-inline-start: auto;
  }
  .me-0\.5 {
    margin-inline-end: calc(var(--spacing) * 0.5);
  }
  .me-1 {
    margin-inline-end: calc(var(--spacing) * 1);
  }
  .me-3 {
    margin-inline-end: calc(var(--spacing) * 3);
  }
  .wysiwyg {
    color: var(--tw-prose-body);
    max-width: 65ch;
    :where(p):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 1.25em;
      margin-bottom: 1.25em;
    }
    :where([class~="lead"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-lead);
      font-size: 1.25em;
      line-height: 1.6;
      margin-top: 1.2em;
      margin-bottom: 1.2em;
    }
    :where(a):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-links);
      text-decoration: underline;
      font-weight: 500;
    }
    :where(strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-bold);
      font-weight: 600;
    }
    :where(a strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(blockquote strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(thead th strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(ol):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: decimal;
      margin-top: 1.25em;
      margin-bottom: 1.25em;
      padding-inline-start: 1.625em;
    }
    :where(ol[type="A"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: upper-alpha;
    }
    :where(ol[type="a"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: lower-alpha;
    }
    :where(ol[type="A" s]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: upper-alpha;
    }
    :where(ol[type="a" s]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: lower-alpha;
    }
    :where(ol[type="I"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: upper-roman;
    }
    :where(ol[type="i"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: lower-roman;
    }
    :where(ol[type="I" s]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: upper-roman;
    }
    :where(ol[type="i" s]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: lower-roman;
    }
    :where(ol[type="1"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: decimal;
    }
    :where(ul):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      list-style-type: disc;
      margin-top: 1.25em;
      margin-bottom: 1.25em;
      padding-inline-start: 1.625em;
    }
    :where(ol > li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::marker {
      font-weight: 400;
      color: var(--tw-prose-counters);
    }
    :where(ul > li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::marker {
      color: var(--tw-prose-bullets);
    }
    :where(dt):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-headings);
      font-weight: 600;
      margin-top: 1.25em;
    }
    :where(hr):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      border-color: var(--tw-prose-hr);
      border-top-width: 1px;
      margin-top: 3em;
      margin-bottom: 3em;
    }
    :where(blockquote):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      font-weight: 500;
      font-style: italic;
      color: var(--tw-prose-quotes);
      border-inline-start-width: 0.25rem;
      border-inline-start-color: var(--tw-prose-quote-borders);
      quotes: "\201C""\201D""\2018""\2019";
      margin-top: 1.6em;
      margin-bottom: 1.6em;
      padding-inline-start: 1em;
    }
    :where(blockquote p:first-of-type):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::before {
      content: open-quote;
    }
    :where(blockquote p:last-of-type):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::after {
      content: close-quote;
    }
    :where(h1):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-headings);
      font-weight: 800;
      font-size: 2.25em;
      margin-top: 0;
      margin-bottom: 0.8888889em;
      line-height: 1.1111111;
    }
    :where(h1 strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      font-weight: 900;
      color: inherit;
    }
    :where(h2):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-headings);
      font-weight: 700;
      font-size: 1.5em;
      margin-top: 2em;
      margin-bottom: 1em;
      line-height: 1.3333333;
    }
    :where(h2 strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      font-weight: 800;
      color: inherit;
    }
    :where(h3):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-headings);
      font-weight: 600;
      font-size: 1.25em;
      margin-top: 1.6em;
      margin-bottom: 0.6em;
      line-height: 1.6;
    }
    :where(h3 strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      font-weight: 700;
      color: inherit;
    }
    :where(h4):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-headings);
      font-weight: 600;
      margin-top: 1.5em;
      margin-bottom: 0.5em;
      line-height: 1.5;
    }
    :where(h4 strong):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      font-weight: 700;
      color: inherit;
    }
    :where(img):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 2em;
      margin-bottom: 2em;
    }
    :where(picture):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      display: block;
      margin-top: 2em;
      margin-bottom: 2em;
    }
    :where(video):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 2em;
      margin-bottom: 2em;
    }
    :where(kbd):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      font-weight: 500;
      font-family: inherit;
      color: var(--tw-prose-kbd);
      box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows);
      font-size: 0.875em;
      border-radius: 0.3125rem;
      padding-top: 0.1875em;
      padding-inline-end: 0.375em;
      padding-bottom: 0.1875em;
      padding-inline-start: 0.375em;
    }
    :where(code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-code);
      font-weight: 600;
      font-size: 0.875em;
    }
    :where(code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::before {
      content: "`";
    }
    :where(code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::after {
      content: "`";
    }
    :where(a code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(h1 code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(h2 code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
      font-size: 0.875em;
    }
    :where(h3 code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
      font-size: 0.9em;
    }
    :where(h4 code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(blockquote code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(thead th code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: inherit;
    }
    :where(pre):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-pre-code);
      background-color: var(--tw-prose-pre-bg);
      overflow-x: auto;
      font-weight: 400;
      font-size: 0.875em;
      line-height: 1.7142857;
      margin-top: 1.7142857em;
      margin-bottom: 1.7142857em;
      border-radius: 0.375rem;
      padding-top: 0.8571429em;
      padding-inline-end: 1.1428571em;
      padding-bottom: 0.8571429em;
      padding-inline-start: 1.1428571em;
    }
    :where(pre code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      background-color: transparent;
      border-width: 0;
      border-radius: 0;
      padding: 0;
      font-weight: inherit;
      color: inherit;
      font-size: inherit;
      font-family: inherit;
      line-height: inherit;
    }
    :where(pre code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::before {
      content: none;
    }
    :where(pre code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *))::after {
      content: none;
    }
    :where(table):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      width: 100%;
      table-layout: auto;
      margin-top: 2em;
      margin-bottom: 2em;
      font-size: 0.875em;
      line-height: 1.7142857;
    }
    :where(thead):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      border-bottom-width: 1px;
      border-bottom-color: var(--tw-prose-th-borders);
    }
    :where(thead th):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-headings);
      font-weight: 600;
      vertical-align: bottom;
      padding-inline-end: 0.5714286em;
      padding-bottom: 0.5714286em;
      padding-inline-start: 0.5714286em;
    }
    :where(tbody tr):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      border-bottom-width: 1px;
      border-bottom-color: var(--tw-prose-td-borders);
    }
    :where(tbody tr:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      border-bottom-width: 0;
    }
    :where(tbody td):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      vertical-align: baseline;
    }
    :where(tfoot):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      border-top-width: 1px;
      border-top-color: var(--tw-prose-th-borders);
    }
    :where(tfoot td):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      vertical-align: top;
    }
    :where(th, td):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      text-align: start;
    }
    :where(figure > *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
      margin-bottom: 0;
    }
    :where(figcaption):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      color: var(--tw-prose-captions);
      font-size: 0.875em;
      line-height: 1.4285714;
      margin-top: 0.8571429em;
    }
    --tw-prose-body: oklch(37.3% 0.034 259.733);
    --tw-prose-headings: oklch(21% 0.034 264.665);
    --tw-prose-lead: oklch(44.6% 0.03 256.802);
    --tw-prose-links: oklch(21% 0.034 264.665);
    --tw-prose-bold: oklch(21% 0.034 264.665);
    --tw-prose-counters: oklch(55.1% 0.027 264.364);
    --tw-prose-bullets: oklch(87.2% 0.01 258.338);
    --tw-prose-hr: oklch(92.8% 0.006 264.531);
    --tw-prose-quotes: oklch(21% 0.034 264.665);
    --tw-prose-quote-borders: oklch(92.8% 0.006 264.531);
    --tw-prose-captions: oklch(55.1% 0.027 264.364);
    --tw-prose-kbd: oklch(21% 0.034 264.665);
    --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent);
    --tw-prose-code: oklch(21% 0.034 264.665);
    --tw-prose-pre-code: oklch(92.8% 0.006 264.531);
    --tw-prose-pre-bg: oklch(27.8% 0.033 256.848);
    --tw-prose-th-borders: oklch(87.2% 0.01 258.338);
    --tw-prose-td-borders: oklch(92.8% 0.006 264.531);
    --tw-prose-invert-body: oklch(87.2% 0.01 258.338);
    --tw-prose-invert-headings: #fff;
    --tw-prose-invert-lead: oklch(70.7% 0.022 261.325);
    --tw-prose-invert-links: #fff;
    --tw-prose-invert-bold: #fff;
    --tw-prose-invert-counters: oklch(70.7% 0.022 261.325);
    --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802);
    --tw-prose-invert-hr: oklch(37.3% 0.034 259.733);
    --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542);
    --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733);
    --tw-prose-invert-captions: oklch(70.7% 0.022 261.325);
    --tw-prose-invert-kbd: #fff;
    --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);
    --tw-prose-invert-code: #fff;
    --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338);
    --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
    --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802);
    --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733);
    font-size: 1rem;
    line-height: 1.75;
    :where(picture > img):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
      margin-bottom: 0;
    }
    :where(li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0.5em;
      margin-bottom: 0.5em;
    }
    :where(ol > li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-inline-start: 0.375em;
    }
    :where(ul > li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-inline-start: 0.375em;
    }
    :where(.wysiwyg > ul > li p):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0.75em;
      margin-bottom: 0.75em;
    }
    :where(.wysiwyg > ul > li > p:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 1.25em;
    }
    :where(.wysiwyg > ul > li > p:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-bottom: 1.25em;
    }
    :where(.wysiwyg > ol > li > p:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 1.25em;
    }
    :where(.wysiwyg > ol > li > p:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-bottom: 1.25em;
    }
    :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0.75em;
      margin-bottom: 0.75em;
    }
    :where(dl):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 1.25em;
      margin-bottom: 1.25em;
    }
    :where(dd):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0.5em;
      padding-inline-start: 1.625em;
    }
    :where(hr + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
    }
    :where(h2 + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
    }
    :where(h3 + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
    }
    :where(h4 + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
    }
    :where(thead th:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-inline-start: 0;
    }
    :where(thead th:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-inline-end: 0;
    }
    :where(tbody td, tfoot td):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-top: 0.5714286em;
      padding-inline-end: 0.5714286em;
      padding-bottom: 0.5714286em;
      padding-inline-start: 0.5714286em;
    }
    :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-inline-start: 0;
    }
    :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      padding-inline-end: 0;
    }
    :where(figure):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 2em;
      margin-bottom: 2em;
    }
    :where(.wysiwyg > :first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-top: 0;
    }
    :where(.wysiwyg > :last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
      margin-bottom: 0;
    }
  }
  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }
  .mt-7\.5 {
    margin-top: calc(var(--spacing) * 7.5);
  }
  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }
  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-2\.5 {
    margin-bottom: calc(var(--spacing) * 2.5);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-5 {
    margin-bottom: calc(var(--spacing) * 5);
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
  .mb-7 {
    margin-bottom: calc(var(--spacing) * 7);
  }
  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }
  .mb-10 {
    margin-bottom: calc(var(--spacing) * 10);
  }
  .mb-12 {
    margin-bottom: calc(var(--spacing) * 12);
  }
  .mb-14 {
    margin-bottom: calc(var(--spacing) * 14);
  }
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .line-clamp-4 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-flex {
    display: inline-flex;
  }
  .table {
    display: table;
  }
  .button {
    font-size: var(--button-font-size);
    font-weight: var(--button-font-weight);
    padding: var(--button-spacing);
    width: var(--button-width);
    border-radius: var(--button-border-radius);
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
    &:focus-visible {
      outline: var(--button-focus-outline) solid 2px;
    }
  }
  .button--fill {
    width: 100%;
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
  }
  .button--large {
    font-size: var(--text-base);
    font-weight: var(--font-weight-medium);
    padding: 1rem 1.5rem;
    border-radius: 3.125rem;
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
  }
  .button--rectangle {
    border-radius: 0.5rem;
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
  }
  .button--round {
    border-radius: 100%;
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
  }
  .button--sharp {
    border-radius: 0;
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
  }
  .button--small {
    font-size: var(--text-xs);
    font-weight: var(--font-weight-normal);
    padding: 0.5rem 0.75rem;
    &.button--round {
      aspect-ratio: 1;
    }
    &:disabled {
      cursor: not-allowed;
    }
  }
  .aspect-video {
    aspect-ratio: var(--aspect-video);
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }
  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }
  .size-10 {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-6 {
    height: calc(var(--spacing) * 6);
  }
  .h-45 {
    height: calc(var(--spacing) * 45);
  }
  .h-auto {
    height: auto;
  }
  .h-full {
    height: 100%;
  }
  .h-px {
    height: 1px;
  }
  .min-h-0 {
    min-height: calc(var(--spacing) * 0);
  }
  .w-3\/5 {
    width: calc(3 / 5 * 100%);
  }
  .w-5 {
    width: calc(var(--spacing) * 5);
  }
  .w-6 {
    width: calc(var(--spacing) * 6);
  }
  .w-36 {
    width: calc(var(--spacing) * 36);
  }
  .w-40 {
    width: calc(var(--spacing) * 40);
  }
  .w-50 {
    width: calc(var(--spacing) * 50);
  }
  .w-60 {
    width: calc(var(--spacing) * 60);
  }
  .w-72 {
    width: calc(var(--spacing) * 72);
  }
  .w-full {
    width: 100%;
  }
  .w-max {
    width: max-content;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-3xl {
    max-width: var(--container-3xl);
  }
  .max-w-4xl {
    max-width: var(--container-4xl);
  }
  .max-w-64 {
    max-width: calc(var(--spacing) * 64);
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-md {
    max-width: var(--container-md);
  }
  .max-w-screen-lg {
    max-width: var(--breakpoint-lg);
  }
  .max-w-sm {
    max-width: var(--container-sm);
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }
  .flex-1 {
    flex: 1;
  }
  .flex-none {
    flex: none;
  }
  .shrink {
    flex-shrink: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .grow {
    flex-grow: 1;
  }
  .basis-full {
    flex-basis: 100%;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .list-none {
    list-style-type: none;
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .grid-cols-\[repeat\(auto-fill\,minmax\(240px\,1fr\)\)\] {
    grid-template-columns: repeat(auto-fill,minmax(240px,1fr));
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .justify-start {
    justify-content: flex-start;
  }
  .justify-items-start {
    justify-items: start;
  }
  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-3\.5 {
    gap: calc(var(--spacing) * 3.5);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }
  .gap-9 {
    gap: calc(var(--spacing) * 9);
  }
  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }
  .self-center {
    align-self: center;
  }
  .self-start {
    align-self: flex-start;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-none {
    --tw-border-style: none;
    border-style: none;
  }
  .border-error {
    border-color: var(--color-error);
  }
  .border-grey-lighter {
    border-color: var(--color-grey-lighter);
  }
  .border-informative {
    border-color: var(--color-informative);
  }
  .border-medium {
    border-color: var(--color-medium);
  }
  .border-success {
    border-color: var(--color-success);
  }
  .border-warning {
    border-color: var(--color-warning);
  }
  .bg-error-lightest {
    background-color: var(--color-error-lightest);
  }
  .bg-informative-lightest {
    background-color: var(--color-informative-lightest);
  }
  .bg-light {
    background-color: var(--color-light);
  }
  .bg-lighter {
    background-color: var(--color-lighter);
  }
  .bg-lightest {
    background-color: var(--color-lightest);
  }
  .bg-success-lightest {
    background-color: var(--color-success-lightest);
  }
  .bg-warning-lightest {
    background-color: var(--color-warning-lightest);
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .object-contain {
    object-fit: contain;
  }
  .object-center {
    object-position: center;
  }
  .p-0 {
    padding: calc(var(--spacing) * 0);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
  .px-0 {
    padding-inline: calc(var(--spacing) * 0);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-10 {
    padding-inline: calc(var(--spacing) * 10);
  }
  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-3\.5 {
    padding-block: calc(var(--spacing) * 3.5);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-9 {
    padding-block: calc(var(--spacing) * 9);
  }
  .py-12 {
    padding-block: calc(var(--spacing) * 12);
  }
  .py-14 {
    padding-block: calc(var(--spacing) * 14);
  }
  .pt-0 {
    padding-top: calc(var(--spacing) * 0);
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }
  .pt-10 {
    padding-top: calc(var(--spacing) * 10);
  }
  .pt-14 {
    padding-top: calc(var(--spacing) * 14);
  }
  .pb-2\.5 {
    padding-bottom: calc(var(--spacing) * 2.5);
  }
  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }
  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }
  .pb-5 {
    padding-bottom: calc(var(--spacing) * 5);
  }
  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .pb-14 {
    padding-bottom: calc(var(--spacing) * 14);
  }
  .pb-15 {
    padding-bottom: calc(var(--spacing) * 15);
  }
  .pb-17 {
    padding-bottom: calc(var(--spacing) * 17);
  }
  .pb-20 {
    padding-bottom: calc(var(--spacing) * 20);
  }
  .text-center {
    text-align: center;
  }
  .text-end {
    text-align: end;
  }
  .text-right {
    text-align: right;
  }
  .text-start {
    text-align: start;
  }
  .button-l {
    font-family: var(--font-family-button-l);
    font-size: var(--font-size-button-l);
    line-height: var(--line-height-button-l);
    font-weight: var(--font-weight-medium);
  }
  .button-m {
    font-family: var(--font-family-button-m);
    font-size: var(--font-size-button-m);
    line-height: var(--line-height-button-m);
    font-weight: var(--font-weight-medium);
  }
  .button-s {
    font-family: var(--font-family-button-s);
    font-size: var(--font-size-button-s);
    line-height: var(--line-height-button-s);
    font-weight: var(--font-weight-normal);
  }
  .paragraph-1 {
    font-family: var(--font-family-paragraph-1);
    font-size: var(--font-size-paragraph-1);
    line-height: var(--line-height-paragraph-1);
  }
  .paragraph-2 {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
  }
  .paragraph-3 {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
  }
  .paragraph-4 {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
  }
  .paragraph-5 {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
  }
  .paragraph-6 {
    font-family: var(--font-family-paragraph-6);
    font-size: var(--font-size-paragraph-6);
    line-height: var(--line-height-paragraph-6);
  }
  .paragraph-7 {
    font-family: var(--font-family-paragraph-7);
    font-size: var(--font-size-paragraph-7);
    line-height: var(--line-height-paragraph-7);
  }
  .indication {
    text-transform: uppercase;
    font-family: var(--font-family-indication);
    font-weight: var(--font-weight-indication);
    font-size: var(--font-size-indication);
    letter-spacing: var(--letter-spacing-indication);
  }
  .h1 {
    font-size: var(--font-size-h1-m);
    font-weight: var(--font-weight-h1);
    line-height: var(--line-height-h1-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h1-d);
      line-height: var(--line-height-h1-d);
    }
  }
  .h2 {
    font-size: var(--font-size-h2-m);
    font-weight: var(--font-weight-h2);
    line-height: var(--line-height-h2-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h2-d);
      line-height: var(--line-height-h2-d);
    }
  }
  .h3 {
    font-size: var(--font-size-h3-m);
    font-weight: var(--font-weight-h3);
    line-height: var(--line-height-h3-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h3-d);
      line-height: var(--line-height-h3-d);
    }
  }
  .h4 {
    font-size: var(--font-size-h4-m);
    font-weight: var(--font-weight-h4);
    line-height: var(--line-height-h4-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h4-d);
      line-height: var(--line-height-h4-d);
    }
  }
  .h5 {
    font-size: var(--font-size-h5-m);
    font-weight: var(--font-weight-h5);
    line-height: var(--line-height-h5-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h5-d);
      line-height: var(--line-height-h5-d);
    }
  }
  .h6 {
    font-size: var(--font-size-h6-m);
    font-weight: var(--font-weight-h6);
    line-height: var(--line-height-h6-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h6-d);
      line-height: var(--line-height-h6-d);
    }
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .indication-small {
    font-size: var(--font-size-indication-small);
    letter-spacing: var(--letter-spacing-indication-small);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .whitespace-pre-line {
    white-space: pre-line;
  }
  .button-style {
    background: var(--button-background);
    color: var(--button-color);
    border: var(--button-border);
    &:disabled {
      color: var(--button-disabled-color);
      background: var(--button-disabled-background);
      border: var(--button-disabled-border);
    }
    &:hover {
      @media (hover: hover) {
        &:not(:disabled):not(input) {
          background: var(--button-hover-background);
          color: var(--button-hover-color);
        }
      }
    }
  }
  .button-style--error {
    background: var(--color-error);
    color: var(--color-white);
    border: var(--color-error) solid 1px;
    &:disabled {
      color: var(--color-white);
      background: var(--color-error-lightest);
      border: var(--color-error-lightest) solid 1px;
    }
    &:hover {
      @media (hover: hover) {
        &:not(:disabled):not(input) {
          background: var(--color-error-light);
          color: var(--color-white);
        }
      }
    }
  }
  .button-style--minimal {
    background: transparent;
    color: var(--color-black);
    border: transparent solid 1px;
    &:disabled {
      color: var(--color-grey-lighter);
      background: transparent;
      border: transparent solid 1px;
    }
    &:hover {
      @media (hover: hover) {
        &:not(:disabled):not(input) {
          background: transparent;
          color: var(--color-grey);
        }
      }
    }
  }
  .button-style--raised {
    background: var(--color-white);
    color: var(--color-black);
    border: none;
    &:disabled {
      color: var(--color-grey-lighter);
      background: var(--color-white);
      border: none;
    }
    &:hover {
      @media (hover: hover) {
        &:not(:disabled):not(input) {
          background: var(--color-grey-lightest);
          color: var(--color-grey-dark);
        }
      }
    }
  }
  .button-style--secondary {
    background: var(--color-white);
    color: var(--color-black);
    border: var(--color-black) solid 1px;
    &:disabled {
      color: var(--color-grey-lighter);
      background: var(--color-white);
      border: var(--color-grey-lighter) solid 1px;
    }
    &:hover {
      @media (hover: hover) {
        &:not(:disabled):not(input) {
          background: var(--color-black);
          color: var(--color-white);
        }
      }
    }
  }
  .text-base {
    color: var(--color-base);
  }
  .text-black {
    color: var(--color-black);
  }
  .text-error {
    color: var(--color-error);
  }
  .text-grey {
    color: var(--color-grey);
  }
  .text-grey-dark {
    color: var(--color-grey-dark);
  }
  .text-grey-darker {
    color: var(--color-grey-darker);
  }
  .text-grey-lighter {
    color: var(--color-grey-lighter);
  }
  .text-success {
    color: var(--color-success);
  }
  .lowercase {
    text-transform: lowercase;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .no-underline {
    text-decoration-line: none;
  }
  .underline {
    text-decoration-line: underline;
  }
  .underline-offset-3 {
    text-underline-offset: 3px;
  }
  .opacity-50 {
    opacity: 50%;
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-\[grid-template-rows\] {
    transition-property: grid-template-rows;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-200 {
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .wysiwyg-theme {
    --tw-prose-body: var(--color-black);
    --tw-prose-headings: var(--color-black);
    --tw-prose-hr: var(--color-grey-lighter);
    --tw-prose-lead: var(--color-grey-dark);
    --tw-prose-links: var(--color-grey-dark);
    --tw-prose-bold: var(--color-black);
    --tw-prose-counters: var(--color-black);
    --tw-prose-bullets: var(--color-black);
  }
  .not-last\:border-b {
    &:not(*:last-child) {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 1px;
    }
  }
  .group-aria-expanded\/accordion-trigger\:hidden {
    &:is(:where(.group\/accordion-trigger)[aria-expanded="true"] *) {
      display: none;
    }
  }
  .group-aria-expanded\/accordion-trigger\:inline {
    &:is(:where(.group\/accordion-trigger)[aria-expanded="true"] *) {
      display: inline;
    }
  }
  .group-aria-expanded\/accordion-trigger\:rotate-180 {
    &:is(:where(.group\/accordion-trigger)[aria-expanded="true"] *) {
      rotate: 180deg;
    }
  }
  .hover\:text-grey-dark {
    &:hover {
      @media (hover: hover) {
        color: var(--color-grey-dark);
      }
    }
  }
  .disabled\:pointer-events-none {
    &:disabled {
      pointer-events: none;
    }
  }
  .disabled\:cursor-not-allowed {
    &:disabled {
      cursor: not-allowed;
    }
  }
  .disabled\:opacity-50 {
    &:disabled {
      opacity: 50%;
    }
  }
  .max-lg\:px-6 {
    @media (width < 64rem) {
      padding-inline: calc(var(--spacing) * 6);
    }
  }
  .max-lg\:py-3 {
    @media (width < 64rem) {
      padding-block: calc(var(--spacing) * 3);
    }
  }
  .max-lg\:text-sm {
    @media (width < 64rem) {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }
  .sm\:col-span-2 {
    @media (width >= 40rem) {
      grid-column: span 2 / span 2;
    }
  }
  .sm\:block {
    @media (width >= 40rem) {
      display: block;
    }
  }
  .sm\:grid-cols-2 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .sm\:flex-row {
    @media (width >= 40rem) {
      flex-direction: row;
    }
  }
  .md\:my-8 {
    @media (width >= 48rem) {
      margin-block: calc(var(--spacing) * 8);
    }
  }
  .md\:block {
    @media (width >= 48rem) {
      display: block;
    }
  }
  .md\:hidden {
    @media (width >= 48rem) {
      display: none;
    }
  }
  .md\:grid-cols-2 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .md\:flex-row {
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
  .md\:justify-start {
    @media (width >= 48rem) {
      justify-content: flex-start;
    }
  }
  .md\:gap-5 {
    @media (width >= 48rem) {
      gap: calc(var(--spacing) * 5);
    }
  }
  .md\:py-4\.5 {
    @media (width >= 48rem) {
      padding-block: calc(var(--spacing) * 4.5);
    }
  }
  .md\:ps-5 {
    @media (width >= 48rem) {
      padding-inline-start: calc(var(--spacing) * 5);
    }
  }
  .md\:pt-5 {
    @media (width >= 48rem) {
      padding-top: calc(var(--spacing) * 5);
    }
  }
  .md\:pt-11 {
    @media (width >= 48rem) {
      padding-top: calc(var(--spacing) * 11);
    }
  }
  .md\:pb-24 {
    @media (width >= 48rem) {
      padding-bottom: calc(var(--spacing) * 24);
    }
  }
  .md\:pb-30 {
    @media (width >= 48rem) {
      padding-bottom: calc(var(--spacing) * 30);
    }
  }
  .lg\:wysiwyg-lg {
    @media (width >= 64rem) {
      font-size: 1.125rem;
      line-height: 1.7777778;
      :where(p):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
        margin-bottom: 1.3333333em;
      }
      :where([class~="lead"]):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 1.2222222em;
        line-height: 1.4545455;
        margin-top: 1.0909091em;
        margin-bottom: 1.0909091em;
      }
      :where(blockquote):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.6666667em;
        margin-bottom: 1.6666667em;
        padding-inline-start: 1em;
      }
      :where(h1):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 2.6666667em;
        margin-top: 0;
        margin-bottom: 0.8333333em;
        line-height: 1;
      }
      :where(h2):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 1.6666667em;
        margin-top: 1.8666667em;
        margin-bottom: 1.0666667em;
        line-height: 1.3333333;
      }
      :where(h3):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 1.3333333em;
        margin-top: 1.6666667em;
        margin-bottom: 0.6666667em;
        line-height: 1.5;
      }
      :where(h4):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.7777778em;
        margin-bottom: 0.4444444em;
        line-height: 1.5555556;
      }
      :where(img):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.7777778em;
        margin-bottom: 1.7777778em;
      }
      :where(picture):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.7777778em;
        margin-bottom: 1.7777778em;
      }
      :where(picture > img):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
        margin-bottom: 0;
      }
      :where(video):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.7777778em;
        margin-bottom: 1.7777778em;
      }
      :where(kbd):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.8888889em;
        border-radius: 0.3125rem;
        padding-top: 0.2222222em;
        padding-inline-end: 0.4444444em;
        padding-bottom: 0.2222222em;
        padding-inline-start: 0.4444444em;
      }
      :where(code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.8888889em;
      }
      :where(h2 code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.8666667em;
      }
      :where(h3 code):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.875em;
      }
      :where(pre):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.8888889em;
        line-height: 1.75;
        margin-top: 2em;
        margin-bottom: 2em;
        border-radius: 0.375rem;
        padding-top: 1em;
        padding-inline-end: 1.5em;
        padding-bottom: 1em;
        padding-inline-start: 1.5em;
      }
      :where(ol):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
        margin-bottom: 1.3333333em;
        padding-inline-start: 1.5555556em;
      }
      :where(ul):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
        margin-bottom: 1.3333333em;
        padding-inline-start: 1.5555556em;
      }
      :where(li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0.6666667em;
        margin-bottom: 0.6666667em;
      }
      :where(ol > li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-start: 0.4444444em;
      }
      :where(ul > li):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-start: 0.4444444em;
      }
      :where(.lg\:wysiwyg-lg > ul > li p):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0.8888889em;
        margin-bottom: 0.8888889em;
      }
      :where(.lg\:wysiwyg-lg > ul > li > p:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
      }
      :where(.lg\:wysiwyg-lg > ul > li > p:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-bottom: 1.3333333em;
      }
      :where(.lg\:wysiwyg-lg > ol > li > p:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
      }
      :where(.lg\:wysiwyg-lg > ol > li > p:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-bottom: 1.3333333em;
      }
      :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0.8888889em;
        margin-bottom: 0.8888889em;
      }
      :where(dl):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
        margin-bottom: 1.3333333em;
      }
      :where(dt):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.3333333em;
      }
      :where(dd):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0.6666667em;
        padding-inline-start: 1.5555556em;
      }
      :where(hr):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 3.1111111em;
        margin-bottom: 3.1111111em;
      }
      :where(hr + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
      }
      :where(h2 + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
      }
      :where(h3 + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
      }
      :where(h4 + *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
      }
      :where(table):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.8888889em;
        line-height: 1.5;
      }
      :where(thead th):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-end: 0.75em;
        padding-bottom: 0.75em;
        padding-inline-start: 0.75em;
      }
      :where(thead th:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-start: 0;
      }
      :where(thead th:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-end: 0;
      }
      :where(tbody td, tfoot td):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-top: 0.75em;
        padding-inline-end: 0.75em;
        padding-bottom: 0.75em;
        padding-inline-start: 0.75em;
      }
      :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-start: 0;
      }
      :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        padding-inline-end: 0;
      }
      :where(figure):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 1.7777778em;
        margin-bottom: 1.7777778em;
      }
      :where(figure > *):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
        margin-bottom: 0;
      }
      :where(figcaption):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        font-size: 0.8888889em;
        line-height: 1.5;
        margin-top: 1em;
      }
      :where(.lg\:wysiwyg-lg > :first-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-top: 0;
      }
      :where(.lg\:wysiwyg-lg > :last-child):not(:where([class~="not-wysiwyg"],[class~="not-wysiwyg"] *)) {
        margin-bottom: 0;
      }
    }
  }
  .lg\:mt-8 {
    @media (width >= 64rem) {
      margin-top: calc(var(--spacing) * 8);
    }
  }
  .lg\:mt-auto {
    @media (width >= 64rem) {
      margin-top: auto;
    }
  }
  .lg\:mb-11 {
    @media (width >= 64rem) {
      margin-bottom: calc(var(--spacing) * 11);
    }
  }
  .lg\:grid {
    @media (width >= 64rem) {
      display: grid;
    }
  }
  .lg\:hidden {
    @media (width >= 64rem) {
      display: none;
    }
  }
  .lg\:w-60 {
    @media (width >= 64rem) {
      width: calc(var(--spacing) * 60);
    }
  }
  .lg\:w-auto {
    @media (width >= 64rem) {
      width: auto;
    }
  }
  .lg\:grid-cols-2 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .lg\:grid-cols-3 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .lg\:flex-row {
    @media (width >= 64rem) {
      flex-direction: row;
    }
  }
  .lg\:items-center {
    @media (width >= 64rem) {
      align-items: center;
    }
  }
  .lg\:gap-14 {
    @media (width >= 64rem) {
      gap: calc(var(--spacing) * 14);
    }
  }
  .lg\:py-12 {
    @media (width >= 64rem) {
      padding-block: calc(var(--spacing) * 12);
    }
  }
  .lg\:py-20 {
    @media (width >= 64rem) {
      padding-block: calc(var(--spacing) * 20);
    }
  }
  .lg\:pt-12 {
    @media (width >= 64rem) {
      padding-top: calc(var(--spacing) * 12);
    }
  }
  .lg\:pt-14 {
    @media (width >= 64rem) {
      padding-top: calc(var(--spacing) * 14);
    }
  }
  .lg\:pb-30 {
    @media (width >= 64rem) {
      padding-bottom: calc(var(--spacing) * 30);
    }
  }
  .xl\:py-20 {
    @media (width >= 85.375rem) {
      padding-block: calc(var(--spacing) * 20);
    }
  }
  .xl\:pt-17 {
    @media (width >= 85.375rem) {
      padding-top: calc(var(--spacing) * 17);
    }
  }
  .xl\:pb-26 {
    @media (width >= 85.375rem) {
      padding-bottom: calc(var(--spacing) * 26);
    }
  }
  .\32 xl\:mt-0 {
    @media (width >= 105rem) {
      margin-top: calc(var(--spacing) * 0);
    }
  }
  .\32 xl\:block {
    @media (width >= 105rem) {
      display: block;
    }
  }
  .\32 xl\:flex {
    @media (width >= 105rem) {
      display: flex;
    }
  }
  .rtl\:-scale-x-100 {
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      --tw-scale-x: calc(100% * -1);
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }
  .\[\&_a\]\:underline {
    & a {
      text-decoration-line: underline;
    }
  }
  .\[\&_a\]\:underline-offset-3 {
    & a {
      text-underline-offset: 3px;
    }
  }
  .\[\&_a\]\:hover\:text-black {
    & a {
      &:hover {
        @media (hover: hover) {
          color: var(--color-black);
        }
      }
    }
  }
  .\[\&_p\:not\(\:last-child\)\]\:mb-4 {
    & p:not(:last-child) {
      margin-bottom: calc(var(--spacing) * 4);
    }
  }
}
:root {
  --cms-color-accent: var(--color-base);
  --cms-color-accent-strong: var(--color-dark);
  --cms-color-on-accent: var(--color-black);
  --cms-color-accent-surface: var(--color-lightest);
}
@layer components {
  .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    text-decoration: none;
    min-height: 1.5rem;
    font-size: var(--button-font-size);
    font-family: var(--button-font-family);
    font-weight: var(--button-font-weight);
    cursor: pointer;
  }
  .button-style--raised {
    box-shadow: var(--shadow-raised);
  }
  .button > span.icon {
    width: 1.5em;
    height: 1.5em;
    &.icon-left {
      margin-inline-end: 0.375rem;
    }
    &.icon-right {
      margin-inline-start: 0.375rem;
    }
  }
}
.ButtonQuantity {
  display: flex;
  border: none;
  & button:first-of-type {
    border-end-end-radius: 0;
    border-start-end-radius: 0;
    border-inline-end: 0;
  }
  & button:last-of-type {
    border-end-start-radius: 0;
    border-start-start-radius: 0;
    border-inline-start: 0;
  }
}
.ButtonQuantity input {
  -moz-appearance: textfield;
  &::-webkit-outer-spin-button, &::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  padding: 0 0.5rem;
  min-height: 100%;
  flex: 1;
  text-align: center;
  border-inline: 0;
}
.ButtonQuantity input:focus {
  --tw-ring-color: transparent;
  outline: 0;
}
.button.social-button:hover:not(:disabled):not(input) {
  background: var(--color-grey-lightest);
  color: var(--color-black);
}
.social-button .icon svg {
  display: block;
  width: 100%;
  height: 100%;
}
@layer components {
  .Link {
    color: var(--color-black);
    display: inline-flex;
    align-items: center;
    min-height: 1.5rem;
    padding: 0.125rem;
    transition: 0.2s ease all;
    outline: 0;
    text-decoration: underline;
    font-size: var(--font-size-link);
    font-family: var(--font-family-link);
    font-weight: var(--font-weight-link);
    &:hover {
      @media (hover: hover) {
        color: var(--color-grey);
      }
    }
    &:focus-visible {
      background-color: var(--color-grey-lightest);
      outline: 2px solid var(--color-grey-lightest);
    }
    &:active {
      color: var(--color-base);
    }
    &:disabled {
      color: var(--color-grey-lighter);
      cursor: not-allowed;
    }
    .Link-icon {
      width: 1.125rem;
      height: 1.125rem;
      display: flex;
    }
  }
  .Link--small {
    --font-size-link: var(--text-xs);
    --font-family-link: var(--font-sans);
    --font-weight-link: var(--font-weight-medium);
  }
  .Link--medium {
    --font-size-link: var(--text-xs);
    --font-family-link: var(--font-sans);
    --font-weight-link: var(--font-weight-normal);
  }
}
@layer components {
  .Tag {
    --tag-color: var(--color-dark);
    --tag-background: var(--color-light);
    --tag-border-color: var(--color-dark);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    padding: 0.25rem 0.75rem;
    border-radius: 0.25rem;
    display: inline-flex;
    align-items: center;
    width: fit-content;
    color: var(--tag-color);
    background-color: var(--tag-background);
    border: 1px solid var(--tag-border-color);
  }
  .Tag__icon {
    --icon-color: var(--tag-color);
    margin-inline-end: 0.25rem;
    color: var(--icon-color);
    width: 0.75rem;
    height: 0.75rem;
  }
  .Tag__iconClose {
    width: 0.75rem;
    height: 0.75rem;
    display: inline-block;
    margin-inline-start: 0.375rem;
    cursor: pointer;
    color: var(--tag-color);
    &:hover {
      @media (hover: hover) {
        color: var(--color-grey-darker);
        color: contrast-color(var(--tag-color));
      }
    }
  }
  .Tag--success {
    --tag-background: var(--color-success-lightest);
    --tag-color: var(--color-success-dark);
    --tag-border-color: var(--color-success);
  }
  .Tag--validated {
    --tag-background: var(--color-validated-lightest);
    --tag-color: var(--color-validated);
    --tag-border-color: var(--color-validated);
  }
  .Tag--error {
    --tag-background: var(--color-error-lightest);
    --tag-color: var(--color-error);
    --tag-border-color: var(--color-error);
  }
  .Tag--warning {
    --tag-background: var(--color-warning-lightest);
    --tag-color: var(--color-warning-dark);
    --tag-border-color: var(--color-warning);
  }
  .Tag--sale {
    --tag-background: var(--color-lightest);
    --tag-color: var(--color-dark);
    --tag-border-color: var(--color-dark);
  }
}
@layer utilities {
  .Tag--noBackground {
    --tag-background: transparent;
  }
  .Tag--noBorder {
    --tag-border-color: transparent;
  }
}
@layer components {
  .OrderTag {
    --order-tag-background-color: var(--color-grey-lightest);
    --order-tag-color: var(--color-black);
    --order-tag-border-color: var(--color-grey);
    --order-tag-dot-color: var(--color-grey-dark);
    display: inline-flex;
    align-items: center;
    width: fit-content;
    color: var(--order-tag-color);
    background-color: var(--order-tag-background-color);
    border: 1px solid var(--order-tag-border-color);
    border-radius: 3rem;
    padding: 0.375rem 1rem;
    font-size: var(--text-sm);
    font-weight: var(--font-weight-normal);
    line-height: var(--text-sm--line-height);
    &:before {
      content: "";
      display: inline-block;
      width: 0.4375rem;
      height: 0.4375rem;
      border-radius: 100%;
      margin-inline-end: 0.3125rem;
      background-color: var(--order-tag-dot-color);
    }
  }
  .OrderTag--canceled {
    --order-tag-background-color: var(--color-grey-lightest);
    --order-tag-border-color: var(--color-grey);
    --order-tag-dot-color: var(--color-grey);
  }
  .OrderTag--not-paid {
    --order-tag-background-color: var(--color-error-lightest);
    --order-tag-border-color: var(--color-error);
    --order-tag-dot-color: var(--color-error-light);
  }
  .OrderTag--paid {
    --order-tag-background-color: var(--color-informative-lightest);
    --order-tag-border-color: var(--color-informative);
    --order-tag-dot-color: var(--color-informative);
  }
  .OrderTag--processing {
    --order-tag-background-color: var(--color-processing-lightest);
    --order-tag-border-color: var(--color-processing);
    --order-tag-dot-color: var(--color-processing);
  }
  .OrderTag--sent {
    --order-tag-background-color: var(--color-success-lightest);
    --order-tag-border-color: var(--color-success);
    --order-tag-dot-color: var(--color-success-dark);
  }
  .OrderTag--refunded {
    --order-tag-background-color: var(--color-warning-lightest);
    --order-tag-border-color: var(--color-warning);
    --order-tag-dot-color: var(--color-warning);
  }
}
@layer components {
  .OrderReturnTag--requested {
    --order-tag-background-color: var(--color-informative-lightest);
    --order-tag-border-color: var(--color-informative);
    --order-tag-dot-color: var(--color-informative);
  }
  .OrderReturnTag--info-awaited {
    --order-tag-background-color: var(--color-warning-lightest);
    --order-tag-border-color: var(--color-warning);
    --order-tag-dot-color: var(--color-warning);
  }
  .OrderReturnTag--accepted {
    --order-tag-background-color: var(--color-processing-lightest);
    --order-tag-border-color: var(--color-processing);
    --order-tag-dot-color: var(--color-processing);
  }
  .OrderReturnTag--refused {
    --order-tag-background-color: var(--color-error-lightest);
    --order-tag-border-color: var(--color-error);
    --order-tag-dot-color: var(--color-error-light);
  }
  .OrderReturnTag--received {
    --order-tag-background-color: var(--color-processing-lightest);
    --order-tag-border-color: var(--color-processing);
    --order-tag-dot-color: var(--color-processing);
  }
  .OrderReturnTag--settled {
    --order-tag-background-color: var(--color-success-lightest);
    --order-tag-border-color: var(--color-success);
    --order-tag-dot-color: var(--color-success-dark);
  }
  .OrderReturnTag--expired {
    --order-tag-background-color: var(--color-grey-lightest);
    --order-tag-border-color: var(--color-grey);
    --order-tag-dot-color: var(--color-grey);
  }
}
@layer components {
  .StockTag {
    font-size: var(--text-sm);
    color: var(--color-grey-dark);
    font-weight: var(--font-weight-normal);
    &:before {
      content: "";
      display: inline-block;
      width: 0.5625rem;
      height: 0.5625rem;
      border-radius: 100%;
      margin-inline-end: 0.25rem;
      background-color: var(--color-grey-dark);
    }
  }
  .StockTag--in::before {
    background-color: var(--color-success);
  }
  .StockTag--low::before {
    background-color: var(--color-warning);
  }
  .StockTag--out::before {
    background-color: var(--color-error);
  }
}
@layer components {
  .MobileDrawer {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 20;
    padding: 3.125rem 2.5rem 2.625rem;
    background-color: var(--color-white);
    border-radius: 1.25rem 1.25rem 0 0;
    transform: translateY(100%);
    transition: transform 0.3s ease;
  }
  .MobileDrawer::before {
    content: "";
    position: absolute;
    top: 1rem;
    left: calc(50% - 1.3125rem);
    width: 2.625rem;
    height: 0.3125rem;
    border-radius: 3.125rem;
    background-color: var(--color-grey);
  }
  .MobileDrawer.is-open {
    transform: translateY(0);
  }
  .MobileDrawer:has(label:focus) {
    transform: translateY(0);
  }
  .MobileDrawer-close {
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    width: 2.375rem;
    height: 2.375rem;
    padding: 0.625rem;
    box-sizing: content-box;
    cursor: pointer;
  }
  .MobileDrawer-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10;
    opacity: 0.8;
    background-color: var(--color-black);
  }
  .MobileDrawer.is-open + .MobileDrawer-overlay {
    display: block;
  }
  @media (width >= 48rem) {
    .MobileDrawer:not(.MobileDrawer--staticLg) {
      all: revert;
    }
    .MobileDrawer:not(.MobileDrawer--staticLg)::before {
      content: none;
    }
    .MobileDrawer:not(.MobileDrawer--staticLg) .MobileDrawer-header {
      display: none;
    }
    .MobileDrawer:not(.MobileDrawer--staticLg).is-open + .MobileDrawer-overlay {
      display: none;
    }
  }
  @media (width >= 64rem) {
    .MobileDrawer--staticLg {
      all: revert;
    }
    .MobileDrawer--staticLg::before {
      content: none;
    }
    .MobileDrawer--staticLg .MobileDrawer-header {
      display: none;
    }
    .MobileDrawer--staticLg.is-open + .MobileDrawer-overlay {
      display: none;
    }
  }
}
@layer components {
  :root {
    --header-height: 3rem;
    --header-nav-bar-height: 3.875rem;
    --header-nav-height: calc(var(--header-nav-bar-height) + env(safe-area-inset-bottom, 0px));
    --padding-button-sub: 1.375rem;
    --padding-top-menu: 5.125rem;
    --padding-x-menu: 3.4375rem;
    --padding-button-close: 1.5rem;
    @media (width >= 48rem) {
      --header-height: 5rem;
    }
  }
  .Header {
    border-bottom: 1px solid var(--color-grey-lighter);
    position: sticky;
    top: 0;
    z-index: 10;
  }
  .Header-top {
    display: flex;
    justify-content: center;
    height: var(--header-height);
    background-color: var(--color-white);
    transition: height 250ms ease;
    @media (width >= 40rem) {
      padding-inline-start: 1.875rem;
    }
    @media (width >= 48rem) {
      justify-content: space-between;
    }
  }
  .Header-top > .HeaderNav {
    @media (width >= 48rem) {
      flex-shrink: 0;
    }
  }
  .Header-logo {
    height: 1.125rem;
    width: auto;
    display: block;
    transition: height 250ms ease;
    @media (width < 48rem) {
      box-sizing: content-box;
      padding-block: 0.8125rem;
    }
  }
  .Header-logo svg {
    height: 100%;
    width: auto;
    display: block;
  }
  @media (width >= 48rem) {
    .Header-logo {
      height: 1.875rem;
    }
  }
  .Header-navigation {
    display: flex;
    align-items: stretch;
    justify-content: center;
    list-style-type: none;
    height: 100%;
    gap: 1.875rem;
    @media (width >= 85.375rem) {
      gap: 3.125rem;
    }
  }
  @media (width >= 48rem) {
    .Header.is-stuck .Header-top {
      height: 3.75rem;
    }
    .Header.is-stuck .Header-logo {
      height: 1.5rem;
    }
  }
  .MobilePanel {
    display: none;
  }
  @media (width < 48rem) {
    .MobilePanel {
      position: fixed;
      top: 0;
      inset-inline: 0;
      bottom: var(--header-nav-height);
      display: none;
      background-color: var(--color-white);
      color: var(--color-black);
      overflow-y: auto;
      padding-top: var(--padding-top-menu);
      padding-inline: var(--padding-x-menu);
    }
    .MobilePanel.is-open {
      display: block;
    }
    .Header-menu {
      position: fixed;
      inset: 0;
      display: none;
      color: var(--color-black);
      background-color: var(--color-white);
    }
    .Header-menu .Header-navigation {
      position: relative;
      height: 100%;
    }
    .Header-menu ul {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      justify-content: flex-start;
      gap: 0;
      padding-top: var(--padding-top-menu);
      padding-bottom: var(--header-nav-height);
      padding-inline-end: calc(var(--padding-x-menu) - var(--padding-button-sub));
      padding-inline-start: var(--padding-x-menu);
    }
    .Header-menu ul li {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: calc(1.875rem - var(--padding-button-sub));
    }
    .Header-menu ul .Submenu-link, .Header-menu ul .HeaderMenuItem-link {
      padding-block: var(--padding-button-sub);
    }
    .Header-menu ul svg {
      width: 1.75rem;
    }
    .Header-menu ul ul {
      display: none;
      position: fixed;
      top: var(--padding-top-menu);
      inset-inline: 0;
      bottom: var(--header-nav-height);
      padding-top: 0;
      background-color: var(--color-white);
    }
    .Header-menu ul ul.is-active {
      display: flex;
    }
    .Header-menu.is-open {
      display: block;
      height: 100%;
    }
  }
  @media (width >= 48rem) {
    @media (width < 64rem) {
      .Header-menu {
        position: absolute;
        top: calc( 100% + 1px );
        inset-inline: 0;
        display: none;
        height: var(--header-height);
        background-color: var(--color-white);
        border-bottom: 1px solid var(--color-grey-lighter);
      }
      .Header-menu.is-open {
        display: block;
      }
    }
  }
  [data-menu-close] {
    display: block;
    position: absolute;
    top: 0;
    inset-inline-end: 0;
    z-index: 10;
    padding: var(--padding-button-close);
    @media (width >= 48rem) {
      display: none;
    }
  }
  [data-menu-close] svg {
    width: 2rem;
    color: var(--color-grey-dark);
  }
  [data-menu-back] {
    position: absolute;
    z-index: 10;
    transform: translateY(-50%);
    inset-inline-start: calc(var(--padding-x-menu) - var(--padding-button-close));
    top: calc(var(--padding-top-menu) / 2);
    @media (width >= 48rem) {
      display: none;
    }
  }
  [data-menu-back="-1"] {
    display: none;
  }
  @media (width < 48rem) {
    .Header-searchPanel {
      padding-top: 3.375rem;
      padding-inline: 2rem;
    }
    .Header-searchLogo {
      display: none;
    }
    .Header-searchClose {
      position: absolute;
      top: 0.625rem;
      inset-inline-end: 0.625rem;
    }
  }
  @media (width >= 48rem) {
    .Header-searchPanel {
      position: absolute;
      top: 0;
      inset-inline: 0;
      z-index: 60;
      display: none;
      grid-template-columns: auto minmax(0, 1fr) auto;
      column-gap: 3rem;
      align-items: start;
      padding: 0;
      background-color: var(--color-white);
      border-bottom: 1px solid var(--color-grey-lighter);
    }
    .Header-searchPanel.is-open {
      display: grid;
    }
    .Header-searchPanel .Header-searchBar {
      display: contents;
    }
    .Header-searchLogo {
      margin-inline-start: 1.875rem;
    }
    .Header-searchClose {
      margin-inline-end: 3.125rem;
    }
    .Header-searchBar .SearchBar-form {
      grid-row: 1;
      grid-column: 2;
      width: 100%;
      max-width: 47.6875rem;
      margin-inline: auto;
    }
    .Header-searchBar .SearchBar-panel {
      grid-row: 2;
      grid-column: 1 / -1;
      width: 100%;
      max-width: 85.375rem;
      margin-inline: auto;
      padding-inline: calc(var(--spacing) * 6);
      @media (width >= 48rem) {
        padding-inline: calc(var(--spacing) * 13);
      }
      @media (width >= 64rem) {
        padding-inline: calc(var(--spacing) * 20);
      }
    }
    .Header-searchLogo, .Header-searchClose, .Header-searchBar .SearchBar-form {
      display: flex;
      align-items: center;
      height: var(--header-height);
    }
    .Header-searchBar .SearchBar-form .SearchField {
      flex: 1;
    }
    .Header.is-stuck .Header-searchLogo .Header-logo {
      height: 1.875rem;
    }
  }
  .Header-searchClose {
    display: flex;
    cursor: pointer;
  }
  .Header-searchClose svg {
    width: 2rem;
    height: 2rem;
  }
}
@layer components {
  [data-slot="accordion-trigger"] {
    outline: none;
    &:focus-visible {
      outline: 1px solid var(--color-base);
      outline-offset: 0;
    }
  }
}
.wysiwyg h3:has(> [data-slot="accordion-trigger"]) {
  margin: 0;
}
@layer components {
  .ProductGallery {
    --product-gallery-height: 28.75rem;
    position: relative;
    @media (width >= 48rem) {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      grid-template-rows: var(--product-gallery-height);
      gap: 1.25rem;
      width: auto;
      margin: 0;
    }
  }
  .ProductGallery-tags {
    position: absolute;
    top: 1rem;
    inset-inline-start: 1rem;
    inset-inline-end: calc(1rem + 2.5rem + 0.625rem);
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    pointer-events: none;
    @media (width >= 48rem) {
      grid-column: 2 / 7;
      grid-row: 1;
    }
  }
  .ProductGallery-main {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    background-color: var(--color-white);
    grid-column: 1 / -1;
    @media (width >= 48rem) {
      grid-column: 2 / 7;
    }
  }
  .ProductGallery-zoom {
    position: absolute;
    top: 1rem;
    inset-inline-end: 1rem;
    z-index: 1;
  }
  .ProductGallery-zoom > span.icon {
    width: 1rem;
    height: 1rem;
  }
  .ProductGallery .splide__arrow > span.icon {
    display: flex;
    align-items: center;
    width: 1rem;
    height: 1rem;
    svg {
      width: 100%;
      height: auto;
    }
  }
  .ProductGallery-list {
    display: none;
    margin-top: -1.25rem;
    overflow: auto;
    scrollbar-width: none;
    @media (width >= 48rem) {
      display: block;
    }
  }
  .ProductGallery-list > ul {
    display: flex;
    flex-direction: column;
  }
  .ProductGallery-list::before, .ProductGallery-list::after {
    content: "";
    display: block;
    position: sticky;
    width: 100%;
    height: 1.25rem;
    background: linear-gradient(var(--color-white), 45%, transparent);
    top: 0;
  }
  .ProductGallery-list::after {
    background: linear-gradient(180deg, transparent, 45%, var(--color-white));
    top: auto;
    bottom: 0;
  }
  .ProductGallery-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 2px solid transparent;
    &:focus-within, &.is-active {
      border-color: var(--color-base);
    }
  }
  .ProductGallery-thumbnail {
    width: 100%;
    cursor: pointer;
  }
  .ProductGallery-videoThumbnail {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }
  .ProductGallery-videoBadge {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    color: var(--color-black);
    background-color: var(--color-white);
    border-radius: 50%;
    svg {
      width: 0.75rem;
      height: 0.75rem;
      margin-left: 0.09375rem;
    }
  }
  .ProductGallery-thumbnail:focus {
    outline: none;
  }
}
.ProductGallery .splide {
  position: static;
  max-height: 100%;
  width: 100%;
}
.ProductGallery .splide img {
  max-height: var(--product-gallery-height);
}
.ProductGallery .splide__slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ProductGallery .splide__pagination {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, -0.875rem);
}
.ProductGallery .splide:not(.is-overflow) .splide__pagination {
  display: flex;
}
.ProductGallery .splide__pagination li {
  display: flex;
}
.ProductGallery .splide__pagination__page {
  position: relative;
  width: 0.375rem;
  height: 0.375rem;
  margin: 0.25rem 0.5rem;
  border-radius: 50%;
  background-color: var(--color-black);
  opacity: 0.3;
  &.is-active {
    transform: scale(1.33);
    opacity: 1;
  }
}
.ProductGallery .splide__pagination__page::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.375rem;
  height: 1.5rem;
  transform: translate(-50%, -50%);
}
.ProductGallery .splide__arrows {
  display: none;
  align-items: center;
  justify-content: end;
  gap: 0.5rem;
  @media (width >= 40rem) {
    display: flex;
  }
}
@layer components {
  .PseSelector-form {
    display: flex;
    flex-direction: column;
    gap: 1.875rem;
    margin-top: 1.875rem;
  }
  .PseSelector-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .PseSelector-attributes > ul {
    display: grid;
    @media (width >= 48rem) {
      gap: 1rem;
    }
  }
  .PseSelector-attributes > ul > li:not(:first-child) {
    margin-top: -1px;
    @media (width >= 48rem) {
      margin-top: 0;
    }
  }
  .PseSelector-choiceLabel {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    display: flex;
    position: relative;
    align-items: center;
    justify-content: space-between;
    padding: 0.8125rem 0.875rem;
    border: 1px solid var(--color-grey-lighter);
    font-size: 0;
    cursor: pointer;
    outline: none;
    &::before {
      content: attr(data-selected-label);
      font-size: var(--font-size-paragraph-4);
    }
    &::after {
      content: "";
      display: block;
      width: 1.5rem;
      height: 1.5rem;
      background: var(--background-image-icon-chevron-small-down) no-repeat center;
      background-size: 2.5rem auto;
    }
    @media (width >= 48rem) {
      display: block;
      padding: 0;
      margin-bottom: 0.5rem;
      border: none;
      font-size: var(--font-size-paragraph-4);
      font-weight: 600;
      color: var(--color-black);
      pointer-events: none;
      &::before, &::after {
        content: none;
      }
    }
  }
  .PseSelector-choiceTitle {
    margin-bottom: 1.25rem;
    @media (width >= 48rem) {
      display: none;
    }
  }
  .PseSelector-choiceList {
    @media (width >= 48rem) {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
    }
  }
  .PseSelector-choiceList > li:not(:last-child) {
    border-bottom: 1px solid var(--color-grey-lighter);
    @media (width >= 48rem) {
      border-bottom: none;
    }
  }
  .PseSelector .FilterPill {
    display: block;
    width: 100%;
    padding: 1rem 0.875rem;
    border: none;
    border-radius: 0;
    text-align: start;
    background-color: transparent;
    &:hover {
      @media (hover: hover) {
        background-color: transparent;
      }
    }
    @media (width >= 48rem) {
      display: inline-flex;
      width: auto;
      padding: 0.5rem 0.625rem;
      border: 1.5px solid var(--filterpill-border-color);
      border-radius: 0.25rem;
      background-color: var(--filterpill-background);
      &:hover {
        @media (hover: hover) {
          background-color: var(--color-lightest);
        }
      }
    }
  }
  .PseSelector .FilterPill--selected {
    background-image: var(--background-image-icon-checkmark);
    background-repeat: no-repeat;
    background-position: right 0 top 50%;
    background-size: 1.5rem auto;
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      background-position: left 0 top 50%;
    }
    @media (width >= 48rem) {
      background-image: none;
    }
  }
  .PseSelector .FilterPill:disabled {
    text-decoration: line-through;
    @media (width >= 48rem) {
      text-decoration: none;
    }
  }
  .PseSelector-price {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: var(--color-black);
  }
  .PseSelector-originalPrice {
    text-decoration: line-through;
  }
  .PseSelector-addToCart {
    display: flex;
    flex-direction: column;
    gap: 1.375rem;
    @media (width >= 48rem) {
      flex-direction: row;
      gap: 0;
    }
  }
}
.PseSelector-addToCart > .ButtonQuantity button:last-of-type {
  @media (width >= 48rem) {
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-inline-end: 0;
  }
}
.PseSelector-addToCart > .button {
  @media (width >= 48rem) {
    flex: 1;
    border-start-start-radius: 0;
    border-end-start-radius: 0;
    border-inline-start: 1px solid var(--color-white);
  }
}
.PseSelector-addToCart > .ButtonQuantity {
  @media (width < 48rem) {
    width: 12rem;
    min-height: 3.5rem;
    border: 1px solid var(--color-black);
    border-radius: 3.125rem;
  }
}
.PseSelector-addToCart > .ButtonQuantity button, .PseSelector-addToCart > .ButtonQuantity input {
  @media (width < 48rem) {
    background: transparent;
    color: var(--color-black);
    border: 0;
  }
}
.Subheader--account {
  flex-direction: column;
  justify-content: center;
  padding: 3.125rem 0;
}
.Subheader-links {
  display: flex;
  width: 100%;
  max-width: 60rem;
  flex-direction: column;
  align-items: stretch;
  border: 1px solid var(--color-black);
  & .button {
    border: none;
    border-bottom: 1px solid var(--color-black);
  }
  & > :last-child .button {
    border-bottom: none;
  }
  @media (width >= 40rem) {
    flex-direction: row;
    & .button {
      border-bottom: none;
      border-inline-end: 1px solid var(--color-black);
    }
    & > :last-child .button {
      border-inline-end: none;
    }
  }
}
@layer components {
  .Input {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }
  .Input-header {
    display: flex;
    justify-content: space-between;
  }
  .Input-label {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-black);
  }
  .Input-blockInput {
    position: relative;
  }
  .Input-input {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    background-color: var(--color-white);
    border: 1px solid var(--color-medium);
    border-radius: 0.5rem;
    color: var(--color-black);
    width: 100%;
    padding: 1rem 0.625rem;
    transition: 0.2s ease all;
    text-overflow: ellipsis;
    &:hover {
      background-color: var(--color-lightest);
    }
    &:focus-visible {
      outline-offset: 2px;
      outline: 1px solid var(--color-base);
      border-color: var(--color-base);
    }
    &[disabled] {
      opacity: 0.5;
      cursor: not-allowed;
    }
  }
  .Input-input--unit {
    padding-inline-end: 3rem;
  }
  .Input-input--verificationCode {
    font-size: 1.125rem;
    text-align: center;
    text-transform: uppercase;
    height: 3.6875rem;
  }
  .Input-input.is-error {
    border: 1px solid var(--color-error-light);
    color: var(--color-error);
    &:hover {
      background-color: var(--color-error-lightest);
    }
    &:focus-visible {
      outline: 1px solid var(--color-error-dark);
    }
  }
  .Input-unit {
    position: absolute;
    inset-inline-end: 0.625rem;
    bottom: 0;
    top: 0;
    display: flex;
    align-items: center;
    pointer-events: none;
    font-size: var(--font-size-paragraph-4);
    font-family: var(--font-family-paragraph-5);
    line-height: var(--line-height-paragraph-4);
  }
  .Input--small .Input-input {
    padding: 0.625rem;
  }
  .Input--small .Input-input--unit {
    padding-inline-end: 3.125rem;
  }
  .Input-error {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-error-dark);
    font-style: italic;
  }
  .Input--success .Input-input {
    border: 1px solid var(--color-success);
    background-image: var(--background-image-icon-check);
    background-repeat: no-repeat;
    background-position: right 0 top 50%;
    background-size: 2.5rem;
    &:dir(rtl) {
      background-position: left 0 top 50%;
    }
  }
  .Input--withButton .Input-input {
    padding-inline-end: 25%;
  }
  .Input-button {
    position: absolute;
    top: 1px;
    inset-inline-end: 1px;
    bottom: 1px;
    display: flex;
    align-items: stretch;
  }
  .Input-buttonIcon {
    position: absolute;
    top: 50%;
    inset-inline-end: 0.625rem;
    transform: translateY(-50%);
    width: 1.25rem;
    height: 1.25rem;
  }
  .Input ::placeholder {
    color: var(--color-grey-dark);
    font-style: italic;
  }
  .Input-blockInputIconLeft .Input-buttonIcon {
    inset-inline-end: auto;
    inset-inline-start: 0.625rem;
  }
  .Input-blockInputIconLeft .Input-input {
    padding-inline-start: 2.5rem;
  }
  .Input + .Input {
    margin-top: 1.5rem;
  }
  [class*='gap-'] > .Input + .Input {
    margin-top: inherit;
  }
  .Input + .SnackBar--error {
    margin-top: 0.75rem;
    margin-bottom: 1.5rem;
  }
  .Input-togglePassword {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  .Input-togglePassword svg {
    width: 100%;
    height: 100%;
  }
  .Input-togglePassword::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.75rem;
    height: 2.75rem;
    transform: translate(-50%, -50%);
  }
  .Input-togglePassword.is-visible:before {
    content: '';
    width: 120%;
    position: absolute;
    top: 50%;
    left: 50%;
    height: 3px;
    background-color: var(--color-grey-dark);
    border: 0.5px solid white;
    transform-origin: center;
    transform: translate(-50%, -50%) rotate(45deg);
    border-radius: 0.5rem;
  }
  .PasswordCriteria {
    display: none;
    margin-top: 1.5rem;
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-grey-dark);
  }
  .PasswordCriteria > ul {
    margin-top: 0.1875rem;
  }
  .PasswordCriteria li:before {
    content: '';
    display: inline-block;
    width: 0.4375rem;
    height: 0.4375rem;
    border-radius: 100%;
    margin-inline-end: 0.375rem;
    border: 1px solid var(--color-grey-dark);
  }
  .PasswordCriteria li.valid:before {
    border-color: var(--color-success-dark);
    background-color: var(--color-success-dark);
  }
  .Checkbox-field {
    display: inline-flex;
    flex-direction: column;
    align-self: flex-start;
    gap: 0.25rem;
  }
  .Checkbox {
    --checkbox-color: var(--color-black);
    --checkbox-hover: var(--color-grey-dark);
    --checkbox-disabled: var(--color-grey-lighter);
    --color-checkbox-focus: var(--color-focus);
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    position: relative;
    cursor: pointer;
    gap: 0.5rem;
    color: var(--checkbox-color);
    &:hover {
      @media (hover: hover) {
        --checkbox-color: var(--checkbox-hover);
      }
    }
  }
  .Checkbox.error {
    --checkbox-color: var(--color-error);
    &:hover {
      @media (hover: hover) {
        --checkbox-color: var(--color-error-light);
      }
    }
  }
  .Checkbox-error {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-error-dark);
    font-style: italic;
  }
  .Checkbox input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
    &:checked {
      & ~ .Checkbox__checkmark {
        background-color: var(--checkbox-color);
        border-color: var(--checkbox-color);
      }
    }
    &:indeterminate {
      &:not([type="radio"]) ~ .Checkbox__checkmark {
        background-color: var(--color-grey-lightest);
      }
    }
    &:disabled {
      & ~ .Checkbox__checkmark {
        background-color: var(--checkbox-disabled);
        border-color: var(--checkbox-disabled);
        cursor: not-allowed;
      }
      & ~ .Checkbox__label {
        color: var(--checkbox-disabled);
        cursor: not-allowed;
      }
    }
    &:focus-visible {
      & ~ .Checkbox__checkmark {
        outline: var(--color-checkbox-focus) solid 1px;
        outline-offset: 1px;
      }
    }
  }
  .Checkbox__checkmark {
    width: 1rem;
    height: 1rem;
    background-color: var(--color-white);
    border: 1px solid var(--checkbox-color);
    border-radius: 0.125rem;
    position: relative;
    flex-shrink: 0;
  }
  .Checkbox__checkmark span {
    display: none;
  }
  .Checkbox--radio .Checkbox__checkmark {
    border-radius: calc(infinity * 1px);
    &::after {
      content: var(--tw-content);
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) scale(1);
      width: 0.5rem;
      height: 0.5rem;
      background-color: var(--color-white);
      border-radius: inherit;
    }
  }
  .Checkbox--radio .Checkbox__checkmark svg {
    display: none;
  }
  .Select {
    --select-color: var(--color-black);
    --select-border-color: var(--color-medium);
    --select-hover-bg-color: var(--color-lightest);
    --select-focus-outline-color: var(--color-base);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: var(--text-sm);
    color: var(--select-color);
    &.Select--small .Select-input {
      padding: 0.625rem;
      padding-inline-end: 2rem;
    }
    &.Select--error {
      --select-color: var(--color-error);
      --select-border-color: var(--color-error-light);
      --select-hover-bg-color: var(--color-error-lightest);
      --select-focus-outline-color: var(--color-error-dark);
    }
    &.Select--success .Select-input {
      border-color: var(--color-success);
      &:not([multiple]) {
        padding-inline-end: 3.75rem;
        background-image: var(--background-image-icon-check), var(--background-image-icon-chevron-small-down);
        background-repeat: no-repeat, no-repeat;
        background-position: right 2rem top 50%, right 0 top 50%;
        background-size: 2.5rem, 2.5rem auto;
        &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
          background-position: left 2rem top 50%, left 0 top 50%;
        }
      }
    }
  }
  .Select-header {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    justify-content: space-between;
  }
  .Select-label {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-black);
  }
  .Select-input {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    background-color: var(--color-white);
    border: 1px solid var(--select-border-color);
    border-radius: 0.5rem;
    color: var(--select-color);
    font-style: normal;
    width: 100%;
    padding: 1rem 0.625rem;
    padding-inline-end: 2.25rem;
    appearance: none;
    background-image: var(--background-image-icon-chevron-small-down);
    background-repeat: no-repeat;
    background-position: right 0 top 50%;
    background-size: 2.5rem auto;
    cursor: pointer;
    transition: 0.2s ease all;
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      background-position: left 0 top 50%;
    }
    &:hover {
      @media (hover: hover) {
        background-color: var(--select-hover-bg-color);
      }
    }
    &:focus-visible {
      outline-offset: 2px;
      outline: 1px solid var(--select-focus-outline-color);
      border-color: var(--select-focus-outline-color);
    }
    &[disabled] {
      opacity: 0.5;
      cursor: not-allowed;
    }
    &:has(option[value=""]:checked) {
      font-style: italic;
      color: var(--color-grey-dark);
    }
  }
  .Select .Select-input[multiple] {
    background-image: none;
    padding-inline-end: 1.5rem;
    border-radius: 0.5rem;
    border-start-end-radius: 0;
    border-end-end-radius: 0;
  }
  .Select-input option {
    color: var(--color-black);
  }
  .Select-error {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    font-style: italic;
    color: var(--color-error-dark);
  }
  .TextArea {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }
  .TextArea-header {
    display: flex;
    justify-content: space-between;
  }
  .TextArea-label {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-black);
  }
  .TextArea-blockInput {
    position: relative;
  }
  .TextArea-input {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    background-color: var(--color-white);
    border: 1px solid var(--color-medium);
    border-radius: 0.5rem;
    color: var(--color-black);
    width: 100%;
    min-height: 4.5rem;
    padding: 1rem 0.625rem;
    resize: vertical;
    transition: 0.2s ease all;
    &:hover {
      background-color: var(--color-lightest);
    }
    &:focus-visible {
      outline-offset: 2px;
      outline: 1px solid var(--color-base);
      border-color: var(--color-base);
    }
    &[disabled] {
      opacity: 0.5;
      cursor: not-allowed;
      resize: none;
    }
  }
  .TextArea-input.is-error {
    border: 1px solid var(--color-error-light);
    color: var(--color-error);
    &:hover {
      background-color: var(--color-error-lightest);
    }
    &:focus-visible {
      outline: 1px solid var(--color-error-dark);
    }
  }
  .TextArea--small .TextArea-input {
    min-height: 3.75rem;
    padding: 0.625rem;
  }
  .TextArea-error {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    color: var(--color-error-dark);
    font-style: italic;
  }
  .TextArea--success .TextArea-input {
    border: 1px solid var(--color-success);
    background-image: var(--background-image-icon-check);
    background-repeat: no-repeat;
    background-position: right 0.625rem top 0.375rem;
    background-size: 2.5rem;
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      background-position: left 0.625rem top 0.375rem;
    }
  }
  .TextArea ::placeholder {
    color: var(--color-grey-dark);
    font-style: italic;
  }
  .TextArea + .TextArea {
    margin-top: 1.5rem;
  }
  [class*='gap-'] > .TextArea + .TextArea {
    margin-top: inherit;
  }
  .Toggle {
    --on-color: var(--color-black);
    --off-color: var(--color-grey);
    --on-color-hover: var(--color-grey-dark);
    --off-color-hover: var(--color-black);
    --color-disabled: var(--color-grey-lighter);
    --color-toggle-focus: var(--color-focus);
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 0.5rem;
    &:hover {
      @media (hover: hover) {
        .Toggle-wrapper {
          background: var(--off-color-hover);
        }
      }
    }
  }
  .Toggle-wrapper {
    background: var(--off-color);
    width: 25px;
    height: 14px;
    position: relative;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    border-color: transparent;
    border-radius: calc(infinity * 1px);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }
  .Toggle-wrapper span {
    width: 10px;
    height: 10px;
    display: inline-block;
    background: var(--color-white);
    --tw-translate-x: 0.1rem;
    translate: var(--tw-translate-x) var(--tw-translate-y);
    border-radius: calc(infinity * 1px);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-duration: 200ms;
    transition-duration: 200ms;
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }
  .Toggle input {
    position: absolute;
    opacity: 0;
    height: 0;
    width: 0;
    &:checked {
      & ~ .Toggle-wrapper {
        background: var(--on-color);
      }
      & ~ .Toggle-wrapper span {
        --tw-translate-x: 0.8rem;
        translate: var(--tw-translate-x) var(--tw-translate-y);
      }
    }
    &:focus-visible {
      & ~ .Toggle-wrapper {
        outline: var(--color-toggle-focus) solid 1px;
        outline-offset: 1px;
      }
    }
    &:disabled {
      & ~ .Toggle-wrapper {
        cursor: not-allowed;
        background: var(--color-disabled);
      }
    }
  }
  .RangeSlider {
    position: relative;
    z-index: 0;
    display: grid;
    align-items: center;
    min-height: 1.5rem;
  }
  .RangeSlider [type="range"] {
    grid-area: 1 / 1;
    width: 100%;
    margin: 0;
    background: transparent;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
  }
  .RangeSlider [type="range"]::-webkit-slider-thumb {
    pointer-events: auto;
    -webkit-appearance: none;
    appearance: none;
    width: 1.125rem;
    height: 1.125rem;
    border-radius: 50%;
    background: var(--color-base);
    border: 2px solid var(--color-white);
    box-shadow: 0 0 0 1px var(--color-medium);
    cursor: pointer;
  }
  .RangeSlider [type="range"]::-moz-range-thumb {
    pointer-events: auto;
    width: 1.125rem;
    height: 1.125rem;
    border: 2px solid var(--color-white);
    border-radius: 50%;
    background: var(--color-base);
    box-shadow: 0 0 0 1px var(--color-medium);
    cursor: pointer;
  }
  .RangeSlider-track {
    position: relative;
    grid-area: 1 / 1;
    align-self: center;
    width: 100%;
    height: 0.375rem;
    background: var(--color-light);
    border-radius: 0.3125rem;
    overflow: hidden;
    z-index: -1;
  }
  .RangeSlider-progress {
    position: absolute;
    height: 100%;
    background: var(--color-base);
    border-radius: 0.3125rem;
  }
  .RangeSlider-values {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    grid-area: 2 / 1;
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.5rem;
  }
  .SearchField {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    height: 3rem;
    padding-inline: 1rem;
    border-radius: 3.125rem;
    background-color: var(--color-grey-lightest);
    color: var(--color-grey);
    cursor: text;
  }
  .SearchField-icon {
    display: flex;
    flex-shrink: 0;
    color: var(--color-black);
  }
  .SearchField-icon svg {
    width: 1.5rem;
    height: 1.5rem;
  }
  .SearchField-input {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    flex-grow: 1;
    min-width: 0;
    background-color: transparent;
    color: var(--color-black);
  }
  .SearchField-input:focus-visible {
    outline: none;
  }
  .SearchField-input::placeholder {
    --tw-font-weight: var(--font-weight-light);
    font-weight: var(--font-weight-light);
    font-style: italic;
    color: var(--color-grey);
  }
  .SearchField:hover {
    background-color: var(--color-white);
  }
  .SearchField:focus-within {
    outline: 2px solid var(--color-base);
  }
  .SearchField--white {
    border: 1px solid var(--color-medium);
    background-color: var(--color-white);
  }
  .SearchField--white:hover {
    background-color: var(--color-grey-lightest);
  }
  .Tab {
    text-align: center;
    outline: var(--color-black) solid 1px;
    color: var(--color-black);
    padding: 0.75rem 1.375rem;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    transition: 0.2s ease all;
    &:hover:not(:focus):not([disabled]) {
      background: var(--color-black);
      color: var(--color-white);
    }
    &:hover:focus-visible {
      color: var(--color-grey-dark);
    }
    &:active:not([disabled]) {
      background: var(--color-black);
      color: var(--color-white);
    }
    &:active:hover {
      background: var(--color-grey-dark);
    }
    &:active:hover:not(:focus) {
      background: var(--color-grey-dark);
      outline-color: var(--color-grey-dark);
    }
    &:focus-visible {
      outline: var(--color-medium) solid 2px;
    }
    &[disabled] {
      outline-color: var(--color-grey-lighter);
      color: var(--color-grey-lighter);
      cursor: not-allowed;
    }
    &[disabled]:active {
      background-color: var(--color-grey-lighter);
      color: var(--color-white);
    }
  }
  .Tab .Tab-icon {
    width: 1.375rem;
    height: 1.375rem;
    display: flex;
  }
  .Tab--small {
    padding: 0.625rem 0.75rem;
    .Tab-icon {
      width: 1.125rem;
      height: 1.125rem;
    }
  }
  .Pagination-list {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }
  .Pagination-item {
    color: var(--color-black);
    text-decoration: none;
    min-width: 2.8125rem;
    height: 2.8125rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 0.5rem;
    &:not(.Pagination-item--active):hover {
      background-color: var(--color-grey-lightest);
      color: var(--color-grey);
    }
    &:focus-visible {
      outline: var(--color-medium) solid 2px;
    }
  }
  .Pagination-item--active {
    color: var(--color-dark);
  }
  .Pagination-gap {
    min-width: 1.5rem;
    height: 2.8125rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: var(--color-grey);
    cursor: default;
  }
  .Score {
    display: flex;
    gap: 0.3125rem;
  }
  .Score-star {
    width: 0.875rem;
    height: 0.875rem;
    color: var(--color-black);
    svg {
      width: 100%;
      height: 100%;
    }
  }
  .Score-star--empty {
    color: var(--color-grey-lighter);
  }
  .Rating {
    display: flex;
    gap: 0.625rem;
    align-items: center;
    flex-wrap: wrap;
  }
  .Rating-value {
    color: var(--color-black);
  }
  .Rating-reviewCount {
    text-transform: uppercase;
    color: var(--color-grey);
    @media (width >= 48rem) {
      font-size: var(--text-xs);
      letter-spacing: 0.04375rem;
    }
  }
  @layer components {
    .Countdown {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
    }
    .Countdown-icon {
      flex-shrink: 0;
      width: 1rem;
      height: 1rem;
      color: var(--color-grey-dark);
    }
    .Countdown-icon svg {
      width: 100%;
      height: 100%;
      display: block;
    }
    .Countdown-digits {
      display: flex;
      align-items: stretch;
      gap: 0.5rem;
    }
    .Countdown-unit {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.125rem;
      min-width: 2.75rem;
      padding: 0.375rem 0.5rem;
      border-radius: 0.375rem;
      background-color: var(--color-grey-lightest);
      border: 1px solid var(--color-grey-lighter);
    }
    .Countdown-value {
      font-variant-numeric: tabular-nums;
      font-weight: 600;
      color: var(--color-black);
      font-size: var(--text-lg);
      line-height: var(--text-lg--line-height);
      display: inline-block;
      min-width: 2ch;
      text-align: center;
    }
    .Countdown-label {
      font-size: var(--text-xs);
      line-height: var(--text-xs--line-height);
      color: var(--color-grey);
      text-transform: uppercase;
    }
    .Countdown--lg .Countdown-unit {
      min-width: 3.5rem;
      padding: 0.5rem 0.75rem;
      border-radius: 0.5rem;
    }
    .Countdown--lg .Countdown-value {
      font-size: var(--text-2xl);
      line-height: var(--text-2xl--line-height);
    }
    .Countdown--lg .Countdown-label {
      font-size: var(--text-sm);
      line-height: var(--text-sm--line-height);
    }
    .Countdown--sm {
      gap: 0.25rem;
    }
    .Countdown--sm .Countdown-digits {
      gap: 0.25rem;
    }
    .Countdown--sm .Countdown-unit {
      flex-direction: row;
      align-items: baseline;
      gap: 0.125rem;
      min-width: 0;
      padding: 0;
      border: none;
      background: none;
    }
    .Countdown--sm .Countdown-value {
      font-size: var(--text-xs);
      line-height: var(--text-xs--line-height);
      min-width: 2ch;
      text-align: start;
    }
    .Countdown--sm .Countdown-label {
      font-size: var(--text-xs);
      line-height: var(--text-xs--line-height);
      color: var(--color-grey);
      text-transform: none;
    }
  }
  .Tooltip {
    display: inline-flex;
    position: relative;
    width: fit-content;
  }
  .Tooltip-icon {
    display: inline-block;
    cursor: pointer;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    color: var(--color-black);
  }
  .Tooltip-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.75rem;
    height: 2.75rem;
    transform: translate(-50%, -50%);
  }
  .Tooltip-text {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    visibility: hidden;
    max-width: 18.25rem;
    width: max-content;
    background-color: var(--color-black);
    color: var(--color-white);
    padding-block: 1.375rem;
    padding-inline: 1.25rem 2.125rem;
    border-radius: 0.5rem;
    position: absolute;
    z-index: 50;
    opacity: 0;
    transition: opacity 0.3s;
  }
  .Tooltip-text--show {
    visibility: visible;
    opacity: 1;
  }
  .Tooltip-text::after {
    content: '';
    position: absolute;
    border-width: 5px;
    border-style: solid;
  }
  .Tooltip-text--top {
    bottom: calc(100% + 0.5rem);
    inset-inline-end: calc(50% - 1.3125rem);
  }
  .Tooltip-text--top::after {
    top: 100%;
    inset-inline-end: 1rem;
    border-color: var(--color-black) transparent transparent transparent;
  }
  .Tooltip-text--bottom {
    top: calc(100% + 0.5rem);
    inset-inline-end: calc(50% - 1.3125rem);
  }
  .Tooltip-text--bottom::after {
    bottom: 100%;
    inset-inline-end: 1rem;
    border-color: transparent transparent var(--color-black) transparent;
  }
  .Tooltip-close {
    display: block;
    cursor: pointer;
    width: 1.75rem;
    height: 1.75rem;
    position: absolute;
    top: 0.375rem;
    inset-inline-end: 0.375rem;
  }
  .Favorite {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    background: var(--color-white);
    padding: 0.25rem 0.5rem;
    border-radius: 0.5rem;
    cursor: pointer;
  }
  .Favorite-star {
    width: 1rem;
    height: 1rem;
    color: var(--color-grey-lighter);
  }
  .Favorite-text {
    text-transform: uppercase;
    font-family: var(--font-family-indication);
    font-weight: var(--font-weight-indication);
    font-size: var(--font-size-indication);
    letter-spacing: var(--letter-spacing-indication);
    font-size: var(--font-size-indication-small);
    letter-spacing: var(--letter-spacing-indication-small);
  }
  .Favorite--selected {
    pointer-events: none;
  }
  .Favorite--selected .Favorite-star {
    color: var(--color-base);
  }
  .MenuItem {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    color: var(--color-black);
    text-decoration: none;
    outline: none;
    padding: 1.25rem 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 4rem;
    cursor: pointer;
    @media (width >= 48rem) {
      padding: 1.25rem 1.5rem;
    }
    &:hover:not(:focus-visible) {
      opacity: 0.5;
    }
    &:focus-visible {
      outline: 1px solid var(--color-focus);
      outline-offset: 0;
    }
  }
  .MenuItem--withIcon {
    justify-content: flex-start;
    text-decoration: underline;
    font-weight: 600;
  }
  .MenuItem-icon {
    width: 1.75rem;
    height: 1.75rem;
    display: inline-block;
  }
  .HeaderButton {
    --header-button-bg: var(--color-white);
    --header-button-color: var(--color-black);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    height: 100%;
    gap: 0.25rem;
    background: var(--header-button-bg);
    color: var(--header-button-color);
    cursor: pointer;
    @media (width >= 64rem) {
      flex-direction: row;
    }
    @media (width >= 48rem) {
      padding-inline: 1.25rem;
      flex: initial;
    }
    &:hover {
      --header-button-bg: var(--color-grey-lightest);
    }
    &:focus-visible {
      outline: none;
      box-shadow: 0 0 0 1px var(--color-base) inset;
    }
  }
  .HeaderButton-icon {
    width: 1.5rem;
    height: 1.5rem;
  }
  .HeaderButton-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    text-align: center;
    @media (width >= 48rem) {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap;
      border-width: 0;
    }
    @media (width >= 85.375rem) {
      position: static;
      width: auto;
      height: auto;
      padding: 0;
      margin: 0;
      overflow: visible;
      clip-path: none;
      white-space: normal;
      align-items: flex-start;
    }
  }
  .HeaderButton-text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-family: var(--font-family-button-s);
    font-size: var(--font-size-button-s);
    line-height: var(--line-height-button-s);
    font-weight: var(--font-weight-normal);
    @media (width >= 85.375rem) {
      font-family: var(--font-family-button-l);
      font-size: var(--font-size-button-l);
      line-height: var(--line-height-button-l);
      font-weight: var(--font-weight-medium);
    }
  }
  .HeaderButton-subText {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-family: var(--font-family-paragraph-7);
    font-size: var(--font-size-paragraph-7);
    line-height: var(--line-height-paragraph-7);
    --tw-font-weight: var(--font-weight-light);
    font-weight: var(--font-weight-light);
  }
  .HeaderButton--small .HeaderButton-content {
    @media (width >= 85.375rem) {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap;
      border-width: 0;
    }
  }
  .HeaderButton--theme {
    --header-button-bg: var(--color-white);
    --header-button-color: var(--color-black);
    &:hover {
      --header-button-bg: var(--color-grey-lightest);
    }
    @media (width >= 48rem) {
      --header-button-bg: var(--color-light);
      --header-button-color: var(--color-black);
      &:hover {
        --header-button-bg: var(--color-medium);
      }
    }
  }
  .HeaderButton--dark {
    --header-button-bg: var(--color-black);
    --header-button-color: var(--color-white);
    &:hover {
      --header-button-bg: var(--color-grey-darker);
    }
  }
  .HeaderButton--light {
    --header-button-bg: var(--color-white);
    --header-button-color: var(--color-black);
    &:hover {
      --header-button-bg: var(--color-grey-lightest);
    }
  }
  .HeaderButton.is-selected {
    background-color: var(--color-base);
  }
  .Modal {
    margin: auto;
    background-color: var(--color-white);
    padding: 2.5rem;
    width: calc(100% - 3rem);
    border-radius: 1.25rem;
    opacity: 0;
    transition: opacity 70ms ease-out, display 60ms, overlay 60ms;
    transition-behavior: allow-discrete;
    @media (width >= 48rem) {
      width: 40.625rem;
    }
  }
  .Modal[open] {
    opacity: 1;
    @starting-style {
      opacity: 0;
    }
  }
  .Modal::backdrop {
    opacity: 0;
    background-color: rgb(0 0 0 / 0.53);
    transition: opacity 60ms ease-out, display 60ms allow-discrete;
  }
  .Modal[open]::backdrop {
    opacity: 1;
    @starting-style {
      opacity: 0;
    }
  }
  .Modal-close {
    width: 2.375rem;
    height: 2.375rem;
    position: absolute;
    top: 0.625rem;
    inset-inline-end: 0.625rem;
    cursor: pointer;
    &:hover {
      color: var(--color-grey-darker);
    }
    &:focus-visible {
      border-radius: 0.5rem;
      outline: 2px solid var(--color-medium);
    }
  }
  .ImageZoom-dialog {
    width: 100vw;
    max-width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    padding: 0;
    border: none;
    background-color: transparent;
    &::backdrop {
      background-color: rgb(0 0 0 / 0.53);
    }
  }
  .ImageZoom-canvas {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .ImageZoom-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    touch-action: none;
  }
  .ImageZoom-close {
    position: absolute;
    top: 1.25rem;
    inset-inline-end: 1.25rem;
  }
  .ImageZoom-controls {
    position: absolute;
    inset-inline-end: 1.25rem;
    bottom: 1.25rem;
    display: flex;
    gap: 0.5rem;
  }
  .ImageZoom-dialog .button > span.icon {
    width: 1rem;
    height: 1rem;
    svg {
      width: 1.75rem;
      height: 1.75rem;
      margin: -0.375rem;
    }
  }
  .FilterPill {
    --filterpill-color: var(--color-grey-dark);
    --filterpill-background: var(--color-white);
    --filterpill-border-color: var(--color-light);
    padding: 0.5rem 0.625rem;
    border-radius: 0.25rem;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    color: var(--filterpill-color);
    background-color: var(--filterpill-background);
    border: 1.5px solid var(--filterpill-border-color);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-lightest);
      }
    }
  }
  .FilterPill--withIcon {
    padding-block: 0.5rem;
    padding-inline: 0.25rem 0.625rem;
  }
  .FilterPill-icon {
    width: 1.3125rem;
    height: 1.3125rem;
    display: inline-block;
    flex-shrink: 0;
    margin-inline-end: 0.25rem;
    color: var(--filterpill-icon-color, currentColor);
  }
  .FilterPill-iconClose {
    width: 1.25rem;
    height: 1.25rem;
    display: none;
    flex-shrink: 0;
    margin-inline-start: 0.25rem;
  }
  .FilterPill-icon svg, .FilterPill-iconClose svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .FilterPill-label {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
  }
  .FilterPill-count {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    margin-inline-start: 0.375rem;
    color: currentColor;
    opacity: 0.7;
    white-space: nowrap;
  }
  .FilterPill input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .FilterPill:has(input:checked), .FilterPill--selected {
    --filterpill-background: var(--color-light);
    --filterpill-border-color: var(--color-medium);
  }
  .FilterPill:has(input:checked) .FilterPill-iconClose, .FilterPill--selected .FilterPill-iconClose {
    display: inline-block;
  }
  .FilterPill:disabled, .FilterPill:has(input:disabled) {
    --filterpill-color: var(--color-grey-lighter);
    --filterpill-border-color: var(--color-grey-lighter);
    --filterpill-background: var(--color-grey-lightest);
    cursor: not-allowed;
  }
  .FilterPill:disabled .FilterPill-icon, .FilterPill:has(input:disabled) .FilterPill-icon {
    opacity: 0.2;
  }
  .FilterPill:has(input:focus-visible) {
    outline: var(--color-medium) solid 2px;
  }
  .FilterList {
    display: inline-flex;
    width: 100%;
    border-radius: 0.25rem;
  }
  .FilterList:has(input:focus-visible) {
    outline: var(--color-medium) solid 2px;
  }
  .FilterList input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
  }
  .FilterList-label {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    color: var(--color-black);
    border-radius: 0.25rem;
    width: 100%;
    padding-block: 0.75rem;
    padding-inline: 1rem 3.5rem;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: right 0.5rem top 50%;
    background-size: 2rem auto;
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      background-position: left 0.5rem top 50%;
    }
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-light);
      }
    }
    @media (width >= 48rem) {
      font-family: var(--font-family-paragraph-3);
      font-size: var(--font-size-paragraph-3);
      line-height: var(--line-height-paragraph-3);
      background-size: 2.25rem auto;
    }
  }
  .FilterList:has(input:checked) .FilterList-label {
    background-color: var(--color-light);
    background-image: var(--background-image-icon-checkmark);
  }
  .FilterList:has(input:checked):hover .FilterList-label {
    background-color: var(--color-medium);
  }
  .FilterSelect {
    position: relative;
    background-color: var(--color-white);
  }
  .FilterSelect-current {
    position: relative;
    cursor: pointer;
    outline: none;
    border: 1px solid var(--color-grey-lighter);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .FilterSelect-current:focus-visible {
    outline: var(--color-medium) solid 2px;
  }
  @media (width >= 48rem) {
    .FilterSelect-current:focus + .FilterSelect-list {
      z-index: 10;
      opacity: 1;
      animation-name: none;
    }
    .FilterSelect-current:focus .FilterSelect-icon {
      transform: rotate(180deg);
    }
  }
  .FilterSelect-icon {
    display: block;
    flex-shrink: 0;
    margin-inline-end: 0.5rem;
    height: 1.75rem;
    width: 1.75rem;
    color: var(--color-black);
    transition: transform 0.2s ease;
  }
  .FilterSelect-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .FilterSelect-value {
    display: none;
  }
  .FilterSelect-value:has(:checked) {
    display: inline-flex;
  }
  .FilterSelect-input {
    display: none;
  }
  .FilterSelect-input:checked + .FilterSelect-text {
    display: flex;
  }
  .FilterSelect-text {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    display: none;
    width: 100%;
    padding: 1rem;
    align-items: center;
    color: var(--color-black);
  }
  .FilterSelect-list {
    position: absolute;
    width: 100%;
    list-style: none;
    visibility: hidden;
    opacity: 0;
    transition: 0.2s ease all;
    box-shadow: 0px 4px 8px 0px rgba(40, 40, 40, 0.15);
    animation-name: HideList;
    animation-duration: 0.2s;
    animation-delay: 0.2s;
    animation-fill-mode: forwards;
    animation-timing-function: step-start;
  }
  @media (width >= 48rem) {
    .FilterSelect-list {
      visibility: visible;
    }
    .FilterSelect-list:has(.FilterSelect-option:focus) {
      z-index: 10;
      opacity: 1;
      animation-name: none;
    }
  }
  .FilterSelect-option {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    background-color: var(--color-white);
    padding-block: 1rem;
    padding-inline: 1rem 2.75rem;
    display: flex;
    align-items: center;
    color: var(--color-black);
    outline: none;
    cursor: pointer;
  }
  .FilterSelect-option:hover, .FilterSelect-option:focus {
    background-color: var(--color-grey-lightest);
  }
  .FilterSelect-mobileTitle {
    margin-bottom: 2rem;
  }
  .FilterSelect-mobileList .FilterSelect-listItem {
    border-bottom: 1px solid var(--color-grey-lighter);
  }
  .FilterSelect-mobileList .FilterSelect-listItem:last-child {
    border-bottom: 0;
  }
  .FilterSelect--rounded .FilterSelect-text {
    justify-content: center;
  }
  .FilterSelect--rounded .FilterSelect-current {
    border-color: var(--color-black);
    border-radius: 3.125rem;
    justify-content: center;
  }
  @keyframes HideList {
    from {
      transform: scaleY(1);
    }
    to {
      transform: scaleY(0);
    }
  }
  .SnackBar {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.625rem;
    border-radius: 0.5rem;
    border: 1px solid var(--color-black);
    padding: 1.25rem 1.5rem;
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
  .SnackBar-content {
    display: flex;
    gap: 0.5rem;
  }
  .SnackBar-message {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    word-break: break-word;
  }
  .SnackBar-icon {
    display: block;
    width: 1.3125rem;
    height: 1.3125rem;
    flex-shrink: 0;
  }
  .SnackBar-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .CountrySuggestion {
    align-items: center;
    border-radius: 0;
    border-width: 0 0 1px;
  }
  .CountrySuggestion-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
  }
  :root {
    --form-errors-anchor-offset: max(8rem, 33dvh);
  }
  [aria-invalid="true"], .FormErrors-summary {
    scroll-margin-top: var(--form-errors-anchor-offset);
  }
  .FormErrors-summary {
    margin-bottom: 1.5rem;
    border-radius: 0.5rem;
  }
  .FormErrors-summary:focus-visible {
    outline: 1px solid var(--color-error-dark);
    outline-offset: 2px;
  }
  .FormErrors-heading {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    font-weight: 600;
  }
  .FormErrors-list {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    list-style: none;
    padding-inline-start: 0;
  }
  .FormErrors-list li:not(:only-child) {
    list-style: disc;
    margin-inline-start: 1.25rem;
  }
  .FormErrors-list a {
    text-decoration: underline;
  }
  .CheckoutSteps {
    background: var(--color-lightest);
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--color-medium);
    padding: 0 1.25rem;
    height: 3.75rem;
    justify-content: space-between;
  }
  .CheckoutSteps-steps {
    display: flex;
    align-items: center;
  }
  .CheckoutSteps-mobile {
    display: block;
  }
  @media (width >= 24.375rem) {
    .CheckoutSteps {
      justify-content: center;
      padding: 0;
      height: 6.125rem;
    }
    .CheckoutSteps-mobile {
      display: none;
    }
    .CheckoutSteps-steps {
      gap: 3.75rem;
    }
  }
  .Step {
    align-items: center;
    gap: 0.375rem;
    position: relative;
    color: var(--color-grey-dark);
    display: none;
  }
  .Step a {
    display: inline-flex;
    align-items: center;
    min-height: 1.5rem;
  }
  .Step-label {
    display: none;
  }
  .Step-number {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    height: 1.5rem;
    width: 1.5rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--color-medium);
  }
  .Step-number:after {
    content: "";
    position: absolute;
    height: 1.6875rem;
    width: 1.6875rem;
    border-radius: 50%;
    background: conic-gradient( var(--color-medium) 0% var(--p), transparent var(--p) 100% );
    -webkit-mask: radial-gradient( circle, transparent calc(50% - 1px), black calc(50% - 1px) );
    mask: radial-gradient( circle, transparent calc(50% - 1px), black calc(50% - 1px) );
    z-index: 5;
  }
  @media (width >= 24.375rem) {
    .Step-number:after {
      content: none;
    }
  }
  .Step.current {
    display: flex;
    color: var(--color-grey-dark);
  }
  .Step.current .Step-label {
    display: inline-block;
    font-weight: 600;
    padding-inline-start: 0.375rem;
  }
  .Step.previous .Step-number {
    background-color: var(--color-light);
  }
  @media (width >= 48rem) {
    .Step-label {
      display: inline-block;
    }
  }
  @media (width >= 24.375rem) {
    .Step {
      display: flex;
    }
    .Step.current {
      color: var(--color-black);
    }
    .Step.current .Step-number {
      background-color: var(--color-medium);
    }
    .Step.current .Step-label {
      font-weight: 400;
      padding-inline-start: 0.125rem;
    }
    .Step:not(:first-child):before {
      content: "";
      width: 3.125rem;
      height: 1px;
      position: absolute;
      inset-inline-start: -3.125rem;
      background-color: var(--color-medium);
    }
  }
  .RadioButton {
    display: inline-flex;
    align-self: flex-start;
    position: relative;
    cursor: pointer;
  }
  .RadioButton-checkmark {
    position: relative;
    display: block;
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 50%;
    border: 1px solid var(--color-black);
    background: var(--color-white);
  }
  .RadioButton.checked .RadioButton-checkmark::after {
    content: '';
    position: absolute;
    inset: 2px;
    border-radius: 50%;
    background-color: var(--color-black);
  }
  .Reinsurance {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    padding-block: 1.25rem;
    padding-inline: 2rem 1.875rem;
    border-radius: 0.25rem;
    background: var(--color-lighter);
  }
  .Reinsurance strong {
    font-weight: 600;
  }
  .Reinsurance > div {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding-block: 0.875rem;
    border-bottom: 1px solid var(--color-medium);
  }
  .Reinsurance > div:first-child {
    padding-top: 0;
  }
  .Reinsurance > div:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }
  .Reinsurance-icon {
    display: block;
    width: 1.3125rem;
    height: 1.3125rem;
    flex-shrink: 0;
    color: var(--color-base);
  }
  .Reinsurance-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .ProductCard {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--color-white);
    border-radius: var(--radius-lg);
    z-index: 0;
    .ButtonWishList {
      transition: 0.2s;
      display: none;
      @media (width >= 40rem) {
        display: block;
      }
      svg {
        max-width: 2.1875rem;
      }
      &:focus-visible {
        outline: none;
      }
      .in-wishlist-icon {
        display: none;
        &:hover svg {
          color: var(--color-medium);
        }
      }
      .not-in-wishlist-icon {
        display: inline-block;
        &:hover svg {
          color: var(--color-dark);
        }
      }
      &.in-wishlist {
        .in-wishlist-icon {
          display: inline-block;
        }
        .not-in-wishlist-icon {
          display: none;
        }
      }
    }
    .ProductCard-mainContent {
      width: 100%;
    }
    .Colors {
      display: flex;
      gap: 0.375rem;
      align-items: center;
    }
    &:hover, &:focus-visible {
      .ProductCard-img img {
        transform: scale(1.075);
      }
    }
    &:focus, &:focus-visible {
      outline: none;
      .ProductCard-img {
        outline: 2px solid var(--color-grey-lighter);
      }
    }
  }
  .Colors-item {
    border-radius: 100%;
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
  }
  .Colors-others {
    margin-inline-start: 0.125rem;
  }
  .ProductCard-header {
    margin-bottom: 0.5rem;
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 0.625rem;
    z-index: 1;
  }
  .ProductCard-tagList {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    align-items: center;
  }
  .ProductCard-img {
    overflow: hidden;
    height: 11.6875rem;
    @media (width < 40rem) {
      height: auto;
      aspect-ratio: 1;
    }
    @media (width >= 40rem) {
      height: 17.5rem;
    }
    &:focus-visible {
      outline: none;
    }
    img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      transition: all cubic-bezier(0, 0, 0, 0.7) 0.3s;
    }
  }
  .ProductCard-footer {
    margin-top: 0.8125rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.25rem;
    flex-direction: column;
    @media (width >= 48rem) {
      flex-direction: row;
      align-items: center;
    }
  }
  .ProductCard-footerLeft {
    display: flex;
    flex-direction: column;
    gap: 0.3125rem;
    margin-bottom: 0.8125rem;
    @media (width >= 40rem) {
      margin-bottom: 0;
      gap: 0.625rem;
    }
  }
  .ProductCard-footerRight {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .ProductCard-desc {
    padding: 1rem;
    @media (width >= 40rem) {
      padding: 1.5rem;
    }
  }
  .ProductCard-ref {
    margin-top: 0.5rem;
  }
  .ProductCard-title {
    font-size: var(--font-size-h5-m);
    font-weight: var(--font-weight-h5);
    line-height: var(--line-height-h5-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h5-d);
      line-height: var(--line-height-h5-d);
    }
    font-weight: 600;
    color: var(--color-black);
    text-decoration: none;
    transition: inherit;
    display: block;
  }
  .ProductCard-subtitle {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-grey);
  }
  .ProductCard-price {
    font-family: var(--font-family-paragraph-1);
    font-size: var(--font-size-paragraph-1);
    line-height: var(--line-height-paragraph-1);
    font-weight: 600;
    color: var(--color-black);
  }
  .ProductCard-originalPrice {
    font-family: var(--font-family-paragraph-7);
    font-size: var(--font-size-paragraph-7);
    line-height: var(--line-height-paragraph-7);
    color: var(--color-black);
    text-decoration-line: line-through;
  }
  .ProductCard-countdown {
    display: flex;
    width: fit-content;
    margin-inline: auto;
    margin-top: 0.625rem;
    margin-bottom: 0.625rem;
  }
  .ProductCard--order {
    flex-direction: row;
    background-color: var(--color-lightest);
    border: 1px solid var(--color-medium);
    padding: 0.5rem;
    @media (width >= 40rem) {
      max-width: 33.75rem;
    }
    .ProductCard-mainContent {
      display: flex;
      align-items: center;
      width: 100%;
    }
    .ProductCard-img {
      overflow: visible;
      height: 8.125rem;
      width: 7rem;
      background-color: var(--color-white);
      display: flex;
      justify-content: center;
      @media (width >= 40rem) {
        height: 7rem;
      }
    }
    .ProductCard-desc {
      margin-inline-end: auto;
      padding: 0;
      margin-inline-start: 1.1875rem;
    }
    .ProductCard-title {
      font-family: var(--font-family-paragraph-2);
      font-size: var(--font-size-paragraph-2);
      line-height: var(--line-height-paragraph-2);
      margin-bottom: 0.3125rem;
      display: inline-block;
    }
    .ProductCard-price {
      font-family: var(--font-family-paragraph-4);
      font-size: var(--font-size-paragraph-4);
      line-height: var(--line-height-paragraph-4);
    }
    .ProductCard-footer {
      flex-direction: row;
      gap: 0.5rem;
      margin-top: 0.625rem;
    }
    .ProductCard-orderInfos {
      font-family: var(--font-family-paragraph-6);
      font-size: var(--font-size-paragraph-6);
      line-height: var(--line-height-paragraph-6);
      color: var(--color-grey);
      display: flex;
      flex-direction: column;
      padding-bottom: 0.375rem;
      @media (width >= 40rem) {
        flex-direction: row;
        flex-wrap: wrap;
      }
      & span:not(:last-child) {
        &::after {
          content: '';
        }
        @media (width >= 40rem) {
          &::after {
            content: ',\00a0';
          }
        }
      }
    }
    .ProductCard-secondaryTitle {
      display: block;
    }
    &:hover, &:focus-visible {
      .ProductCard-img img {
        transform: none;
      }
    }
  }
  .ProductCard--search {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 1.125rem;
    border-radius: 0;
    text-decoration: none;
    transition: box-shadow 0.2s ease;
  }
  .ProductCard--search:hover {
    box-shadow: 0 0 8px 0 rgb(84 84 84 / 0.15);
  }
  .ProductCard--search .ProductCard-img {
    flex-shrink: 0;
    width: 6.0625rem;
    height: 6.0625rem;
    background-color: var(--color-white);
  }
  .ProductCard--search .ProductCard-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .ProductCard--search .ProductCard-desc {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
  }
  .ProductCard--search .ProductCard-title {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: var(--font-weight-semibold);
  }
  .ProductCard--search .ProductCard-price {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    font-weight: 400;
  }
  .OrderCard {
    background: var(--color-lightest);
    padding-block: 2.5rem 2.8125rem;
    padding-inline: 1.4375rem 1.5625rem;
  }
  .OrderCard-title {
    font-size: var(--font-size-h5-m);
    font-weight: var(--font-weight-h5);
    line-height: var(--line-height-h5-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h5-d);
      line-height: var(--line-height-h5-d);
    }
    color: var(--color-black);
    margin-bottom: 0.25rem;
  }
  .OrderCard-date {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-grey);
  }
  .OrderCard-delivery {
    color: var(--color-grey-dark);
    font-family: var(--font-roboto);
    font-size: var(--font-size-xs);
    font-weight: 400;
    line-height: 1.25rem;
  }
  .OrderCard-images {
    display: flex;
    flex-wrap: wrap;
    background-color: var(--color-white);
    border-radius: 0.25rem;
    padding: 0.25rem;
    gap: 0.25rem;
    box-shadow: 0 0 8px 0 rgb(84 84 84 / 0.15);
    counter-reset: nbOrderImages;
  }
  .OrderCard-image {
    width: 4.5rem;
    height: 4.5rem;
    &:nth-child(4) ~ .OrderCard-image {
      counter-increment: nbOrderImages;
      position: absolute;
      max-height: 0;
      max-width: 0;
      overflow: hidden;
      opacity: 0;
      visibility: hidden;
    }
    &:not(:nth-child(n + 5)):nth-last-child(2) ~ .OrderCard-nbImages {
      display: none;
    }
    @media (width >= 40rem) {
      &:nth-child(4) ~ .OrderCard-image:not(:nth-child(n + 7)) {
        counter-increment: none;
        position: static;
        max-height: none;
        max-width: none;
        overflow: visible;
        opacity: 1;
        visibility: visible;
      }
      &:not(:nth-child(n + 7)):nth-last-child(2) ~ .OrderCard-nbImages {
        display: none;
      }
    }
  }
  .OrderCard-nbImages {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    &:before {
      content: '+' counter(nbOrderImages);
    }
  }
  .SimilarContentCard {
    display: flex;
    background: var(--color-white);
    border-radius: 0.5rem;
  }
  .SimilarContentCard-img {
    width: 6.125rem;
    height: 100%;
  }
  .SimilarContentCard-img img {
    border-start-start-radius: 0.5rem;
    border-end-start-radius: 0.5rem;
    object-fit: cover;
    height: 100%;
  }
  .SimilarContentCard-title {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: 700;
    color: var(--color-black);
    margin-bottom: 0.5rem;
  }
  .SimilarContentCard-footer {
    font-family: var(--font-family-paragraph-6);
    font-size: var(--font-size-paragraph-6);
    line-height: var(--line-height-paragraph-6);
    color: var(--color-grey);
  }
  .SimilarContentCard-desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.8125rem 1rem;
  }
  .HeaderMenuItem {
    display: flex;
  }
  .HeaderMenuItem a {
    text-decoration: none;
  }
  .HeaderMenuItem-link {
    padding: 0;
    cursor: pointer;
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: 600;
    &:focus-visible, &:focus {
      color: var(--color-base);
    }
    @media (width >= 48rem) {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--color-black);
      text-decoration: none;
      outline: none;
      font-weight: normal;
      font-family: var(--font-family-paragraph-2);
      font-size: var(--font-size-paragraph-2);
      line-height: var(--line-height-paragraph-2);
    }
  }
  .HeaderMenuItem-link::after {
    position: absolute;
    inset-inline-start: calc(var(--spacing) * 0);
    bottom: calc(var(--spacing) * 0);
    height: calc(var(--spacing) * 0.5);
    width: 100%;
    background-color: var(--color-dark);
  }
  .HeaderMenuItem-link:hover::after, .HeaderMenuItem-link.is-active::after, .HeaderMenuItem-link.is-open::after, .HeaderMenuItem-link:focus::after, .HeaderMenuItem-link:focus-visible::after {
    content: "";
  }
  .HeaderMenuItem-link.is-open ~ .Submenu {
    display: flex;
    opacity: 1;
  }
  .HeaderMenuItem-back {
    padding: 1.375rem;
    @media (width >= 48rem) {
      display: none;
    }
  }
  .HeaderMenuItem-all {
    display: flex;
    justify-content: center;
    flex: 1 1 100%;
    order: 9999;
  }
  .Submenu {
    @media (width >= 48rem) {
      position: absolute;
      top: 100%;
      left: 50%;
      width: 100vw;
      max-width: 83.4375rem;
      transform: translate(-50%, 0);
      padding: 1.5rem 3rem 3rem;
      flex-wrap: wrap;
      gap: 1.5rem 2rem;
      color: var(--color-black);
      opacity: 0;
      display: none;
      transition-behavior: allow-discrete;
      transition-property: display, opacity;
      transition-duration: 0.25s;
      z-index: 50;
    }
    @media (width >= 85.375rem) {
      gap: 2.5rem 2rem;
    }
  }
  .Submenu::after {
    @media (width >= 48rem) {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      z-index: -1;
      width: 100vw;
      height: 100%;
      background-color: var(--color-grey-lightest);
      transform: translate(-50%, 0);
    }
  }
  .Submenu-column {
    @media (width >= 48rem) {
      display: flex;
      flex-direction: column;
      flex: 1 1 12rem;
      max-width: 16rem;
      gap: 1rem;
    }
  }
  .Submenu-column--links {
    @media (width >= 48rem) {
      gap: 0.75rem;
    }
  }
  .HeaderMenuItem .Submenu-column--links {
    @media (width < 48rem) {
      flex-direction: column;
      align-items: stretch;
      justify-content: flex-start;
      gap: 0;
    }
  }
  .Submenu--flat .Submenu-column--links {
    @media (width >= 48rem) {
      flex-direction: row;
      flex-wrap: wrap;
      max-width: none;
      gap: 1.5rem 2rem;
    }
  }
  .Submenu-heading {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    @media (width >= 48rem) {
      font-family: var(--font-family-paragraph-4);
      font-size: var(--font-size-paragraph-4);
      line-height: var(--line-height-paragraph-4);
      display: block;
    }
  }
  .Submenu-link {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    @media (width >= 48rem) {
      display: block;
    }
  }
  .Submenu-sub {
    @media (width >= 48rem) {
      display: flex;
      flex-direction: column;
      gap: 0.75rem;
    }
  }
  .LangSelect {
    height: 100%;
    display: none;
    align-items: stretch;
    position: relative;
    @media (width >= 48rem) {
      display: flex;
    }
  }
  .LangSelect-current {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-weight: 500;
    padding-block: 1rem;
    padding-inline: 1rem 0;
    cursor: pointer;
    @media (width >= 48rem) {
      font-size: 0;
    }
    @media (width >= 64rem) {
      font-size: inherit;
    }
    &:hover, &:focus, &:focus-visible {
      background-color: var(--color-grey-lightest);
    }
    &:focus-visible {
      outline: 1px solid var(--color-black);
      outline-offset: -1px;
    }
  }
  .LangSelect-flag {
    width: 1.125rem;
    height: 1.125rem;
    display: inline-block;
    flex-shrink: 0;
  }
  .LangSelect-list {
    display: none;
    transition-property: opacity, display;
    transition-behavior: allow-discrete;
    transition-duration: 0.15s;
    position: absolute;
    top: 100%;
    inset-inline-start: 0;
    transform: translate(-0.625rem, 0.125rem);
    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
      transform: translate(0.625rem, 0.125rem);
    }
    background-color: var(--color-white);
    padding: 0.5rem;
    flex-direction: column;
    align-items: stretch;
    box-shadow: 0 0 0.5rem 0 rgb(84 84 84 / 15%);
    width: 12.5rem;
  }
  .LangSelect-lang {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.5rem;
    width: 100%;
    text-decoration: none;
    &:hover, &:focus, &.active, &:focus-visible {
      background-color: var(--color-grey-lightest);
    }
  }
  .LangSelect-check {
    color: var(--color-black);
    width: 1rem;
    height: 1rem;
    margin-inline-start: auto;
  }
  .LangSelect.is-open .LangSelect-current {
    background-color: var(--color-grey-lightest);
  }
  .LangSelect.is-open .LangSelect-list {
    display: flex;
    opacity: 1;
  }
  .LangSelect-mobileToggle .HeaderButton-icon {
    border-radius: calc(infinity * 1px);
    padding: 0.25rem;
  }
  .LangSelect-mobileList {
    list-style: none;
    padding: 0;
  }
  .LangSelect-mobileItem {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    margin-bottom: 0.125rem;
    height: 4.5rem;
    border-radius: 0.5rem;
    color: var(--color-black);
    text-decoration: none;
    transition: background-color 0.15s ease;
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    &:hover, &:focus {
      background-color: var(--color-grey-lightest);
    }
  }
  .LangSelect-mobileItem.active {
    background-color: var(--color-grey-lightest);
  }
  .LangSelect-mobileItem.active .LangSelect-check {
    color: var(--color-base);
  }
  .LangSelect-mobileItem .LangSelect-flag {
    border-radius: calc(infinity * 1px);
    width: 1.5rem;
    height: 1.5rem;
  }
  .LangSelect-mobileItem .LangSelect-check {
    margin-inline-start: auto;
    width: 1.5rem;
    height: 1.5rem;
    color: var(--color-base);
  }
  .HeaderProfile-dropdown {
    display: none;
    @media (width >= 48rem) {
      display: block;
      opacity: 0;
      visibility: hidden;
      position: absolute;
      top: 100%;
      inset-inline-end: 0;
      width: max-content;
      background-color: var(--color-white);
      border-radius: 0 0 0.5rem 0.5rem;
      box-shadow: 0 0.1875rem 0.3125rem 0 rgb(84 84 84 / 12%);
      transition: opacity 0.2s linear;
    }
  }
  .HeaderProfile.is-open .HeaderProfile-dropdown {
    @media (width >= 48rem) {
      opacity: 1;
      visibility: visible;
    }
  }
  .HeaderProfile-item + .HeaderProfile-item {
    position: relative;
  }
  .HeaderProfile-item + .HeaderProfile-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 100%;
    height: 1px;
    background-color: var(--color-grey-lighter);
    transform: translate(-50%, -50%);
    @media (width >= 48rem) {
      width: calc(100% - 3rem);
    }
  }
  .HeaderProfile-greeting {
    display: block;
    text-align: center;
    color: var(--color-black);
    margin-bottom: 1.75rem;
    font-family: var(--font-family-paragraph-1);
    font-size: var(--font-size-paragraph-1);
    line-height: var(--line-height-paragraph-1);
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .HeaderNav {
    position: fixed;
    bottom: 0;
    inset-inline-start: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    vertical-align: middle;
    width: 100%;
    height: var(--header-nav-height);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background-color: var(--color-white);
    border-top: 1px solid var(--color-grey);
    @media (width >= 48rem) {
      position: static;
      width: auto;
      height: auto;
      padding-bottom: 0;
      background-color: transparent;
      border-top: 0;
    }
  }
  .HeaderNav .HeaderButton-icon {
    @media (width < 48rem) {
      width: 1.75rem;
      height: 1.75rem;
    }
  }
  .HeaderNav > * {
    @media (width < 48rem) {
      flex: 1;
      min-width: 0;
      align-self: stretch;
    }
  }
  .HeaderNav-btn:last-child {
    order: -9999;
    @media (width >= 48rem) {
      order: 1;
    }
  }
  .HeaderNav-search {
    @media (width >= 48rem) {
      order: -1;
    }
  }
  .HeaderNav-search .HeaderButton-text {
    @media (width >= 48rem) {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip-path: inset(50%);
      white-space: nowrap;
      border-width: 0;
    }
  }
  .SearchBar {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }
  .SearchBar-panel {
    padding-block: 2.1875rem 3.6875rem;
    transition: opacity 0.2s ease;
  }
  .SearchBar-count {
    font-size: var(--font-size-indication-small);
    letter-spacing: var(--letter-spacing-indication-small);
    text-transform: uppercase;
    color: var(--color-grey);
    margin-bottom: 0.875rem;
  }
  .SearchBar-results {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem 1.5rem;
    @media (width >= 48rem) {
      grid-template-columns: 2fr 1fr;
    }
  }
  .SearchBar-productList {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .SearchBar-seeAll {
    margin-top: 1.5rem;
    @media (width >= 48rem) {
      margin-inline: auto;
    }
  }
  .SearchBar-empty {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: var(--font-weight-semibold);
  }
  .SearchBar-categories {
    display: flex;
    flex-direction: column;
    padding-top: 1.5rem;
    border-top: 1px solid var(--color-grey-lighter);
    @media (width >= 48rem) {
      padding-top: 0;
      padding-inline-start: 1.5rem;
      border-top: 0;
      border-inline-start: 1px solid var(--color-grey-lighter);
    }
  }
  .SearchBar-sectionTitle {
    font-size: var(--font-size-indication-small);
    letter-spacing: var(--letter-spacing-indication-small);
    text-transform: uppercase;
    color: var(--color-grey);
    margin-bottom: 0.875rem;
  }
  .SearchBar-categoryList {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .CategoryCard {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--color-white);
    border-radius: 0.5rem;
    @media (width >= 48rem) {
      &:nth-child(2n) .CategoryCard-mainContent {
        flex-direction: row-reverse;
      }
    }
    @media (width >= 64rem) {
      &:nth-child(2n) .CategoryCard-mainContent {
        flex-direction: row;
      }
    }
    &:focus, &:focus-visible {
      outline: none;
      .CategoryCard-img {
        outline: 2px solid var(--color-grey);
      }
    }
    &:hover, &:focus-visible {
      .CategoryCard-img img {
        transform: scale(1.075);
      }
    }
  }
  .CategoryCard-mainContent {
    width: 100%;
    @media (width >= 48rem) {
      display: flex;
    }
    @media (width >= 64rem) {
      display: block;
    }
  }
  .CategoryCard-img {
    display: block;
    overflow: hidden;
    height: 11.6875rem;
    @media (width >= 40rem) {
      height: 17.5rem;
    }
    &:focus-visible {
      outline: none;
    }
  }
  .CategoryCard-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: all cubic-bezier(0, 0, 0, 0.7) 0.3s;
  }
  .CategoryCard-desc {
    padding: 1rem 0;
    @media (width >= 40rem) {
      padding: 1.5rem 0;
    }
    @media (width >= 48rem) {
      display: flex;
      flex-direction: column;
      flex-grow: 1;
      justify-content: center;
      padding: 1.5rem;
    }
    @media (width >= 64rem) {
      padding: 1.5rem 0;
    }
  }
  .CategoryCard-title {
    font-size: var(--font-size-h5-m);
    font-weight: var(--font-weight-h5);
    line-height: var(--line-height-h5-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h5-d);
      line-height: var(--line-height-h5-d);
    }
    color: var(--color-black);
    text-decoration: none;
    transition: inherit;
    display: block;
  }
  .CategoryCard-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 1rem;
  }
  .ReviewCard {
    background-color: var(--color-white);
    padding: 1rem;
    border-radius: 0.5rem;
  }
  .ReviewCard-author {
    font-family: var(--font-family-paragraph-5);
    font-size: var(--font-size-paragraph-5);
    line-height: var(--line-height-paragraph-5);
    margin-bottom: 0.5rem;
    color: var(--color-grey);
  }
  .ReviewCard-title {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-base);
    color: var(--color-black);
    margin-bottom: 0.25rem;
  }
  .ReviewCard-review {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    margin-bottom: 1rem;
  }
  .ReviewCard-footer {
    display: flex;
    justify-content: space-between;
  }
  .ReviewCard-date {
    text-transform: uppercase;
    font-family: var(--font-family-indication);
    font-weight: var(--font-weight-indication);
    font-size: var(--font-size-indication);
    letter-spacing: var(--letter-spacing-indication);
    color: var(--color-grey);
  }
  .ArticleCard {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--color-white);
    border-radius: 0.5rem;
    overflow: hidden;
    text-decoration: none;
    transition: background 0.2s ease;
    &:hover {
      background: var(--color-lighter);
    }
  }
  .ArticleCard-img-wrapper {
    height: 12.5rem;
    flex-shrink: 0;
    overflow: hidden;
  }
  .ArticleCard-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .ArticleCard-content {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.25rem;
  }
  .ArticleCard-title {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: 700;
    color: var(--color-black);
  }
  .ArticleCard-date {
    font-family: var(--font-family-paragraph-6);
    font-size: var(--font-size-paragraph-6);
    line-height: var(--line-height-paragraph-6);
    color: var(--color-grey);
  }
  .ArticleCard:hover .ArticleCard-title {
    text-decoration: underline;
  }
  .AddressCard {
    background: var(--color-lightest);
    border: 1px solid var(--color-medium);
    border-radius: 0.5rem;
    position: relative;
    display: flex;
    flex-direction: column;
    &.selected {
      background: var(--color-white);
    }
  }
  .AddressCard-top {
    position: absolute;
    padding: 0.625rem;
    inset-inline-end: 0;
    top: 0;
  }
  .AddressCard-content {
    display: flex;
    padding: 1.5rem 1.5rem 1rem;
    align-items: flex-start;
    &:has(.RadioButton) {
      cursor: pointer;
    }
    span {
      display: block;
    }
    .RadioButton {
      margin-top: 0.25rem;
      margin-inline-end: 0.5rem;
    }
  }
  .AddressCard-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
    padding-bottom: 0.5rem;
  }
  .AddressCard-name {
    font-weight: var(--font-weight-semibold);
    display: block;
    margin-bottom: 0.625rem;
  }
  .AddressCard-address {
    font-weight: var(--font-weight-normal);
  }
  .AddressCard-actions {
    margin-top: auto;
    display: flex;
    width: 100%;
    & > * {
      color: var(--color-black);
      padding: 1rem;
      text-decoration: none;
      display: flex;
      flex-grow: 1;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      gap: 0.375rem;
      cursor: pointer;
      border-top: 1px solid var(--color-grey-lighter);
      border-inline-end: 1px solid var(--color-grey-lighter);
      font-size: var(--text-xs);
      &:last-child {
        border-inline-end: none;
      }
      span {
        width: 0.875rem;
        height: 0.875rem;
        svg {
          width: 100%;
          height: 100%;
          display: block;
        }
      }
    }
  }
  .CartItem-wrapper--outOfStock {
    background-color: var(--color-lightest);
    padding: 1rem;
    border: 1px solid var(--color-error);
  }
  .CartItem {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color: var(--color-lightest);
    @media (width >= 40rem) {
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
    }
  }
  .CartItem--offered {
    border: 1px solid var(--color-success);
  }
  .CartItem-mainContent {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 1rem 1rem 1.4375rem;
    @media (width >= 24.375rem) {
      flex-direction: row;
      padding: 0.5rem;
      column-gap: 1rem;
    }
    @media (width >= 64rem) {
      align-items: center;
    }
  }
  .CartItem-imgLink {
    display: flex;
  }
  .CartItem-img {
    max-width: 100%;
    width: 100%;
    background-color: var(--color-white);
    @media (width >= 40rem) {
      height: 7rem;
    }
    img {
      max-height: 100%;
      object-fit: contain;
      @media (width >= 24.375rem) {
        height: 7rem;
        max-width: 6.5625rem;
      }
    }
  }
  .CartItem-title {
    display: block;
    margin-bottom: 0.3125rem;
    color: var(--color-black);
    text-decoration: none;
  }
  .CartItem-desc {
    flex-grow: 1;
    padding: 0.625rem 0 0;
    @media (width >= 40rem) {
      padding-block: 0;
      padding-inline: 0 0.5rem;
    }
  }
  .CartItem-orderInfos {
    display: flex;
    flex-direction: column;
    @media (width >= 64rem) {
      flex-direction: row;
      max-width: 80%;
    }
    & span:not(:last-child) {
      @media (width >= 64rem) {
        &::after {
          content: '|';
          padding: 0 0.3125rem;
        }
      }
    }
  }
  .CartItem-footer {
    margin-top: 0.625rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    gap: 1.25rem;
    column-gap: 0.3125rem;
  }
  .CartItem-footerRight {
    display: flex;
    align-items: flex-start;
    flex-direction: column-reverse;
    @media (width >= 40rem) {
      flex-direction: row;
      align-items: center;
      gap: 0.5rem;
    }
  }
  .CartItem-price {
    color: var(--color-black);
    font-weight: var(--font-weight-semibold);
  }
  .CartItem-originalPrice {
    color: var(--color-grey);
    text-decoration: line-through;
  }
  .CartItem-unavailable {
    color: var(--color-error);
  }
  .CartItem-quantity {
    display: inline-flex;
    align-items: center;
    background: var(--color-white);
    color: var(--color-black);
    border: 1px solid var(--color-black);
    border-radius: 3.125rem;
    font-size: var(--text-xs);
    button {
      padding: 0.5rem 0.75rem;
      cursor: pointer;
    }
    input {
      -moz-appearance: textfield;
      appearance: textfield;
      background: transparent;
      padding: 0;
      border: none;
      text-align: center;
      width: 3.125rem;
      align-self: stretch;
      &::-webkit-outer-spin-button, &::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
      }
      &:focus, &:focus-visible {
        outline: 0;
      }
    }
  }
  .CartItem-actions {
    display: flex;
    width: 100%;
    & > * {
      color: var(--color-black);
      padding: 1rem;
      text-decoration: none;
      display: flex;
      flex-grow: 1;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      gap: 0.375rem;
      cursor: pointer;
      border-top: 1px solid var(--color-grey-lighter);
      border-inline-end: 1px solid var(--color-grey-lighter);
      font-size: var(--text-xs);
      &:last-child {
        border-inline-end: none;
      }
      span {
        width: 0.875rem;
        height: 0.875rem;
        svg {
          width: 100%;
          height: 100%;
          display: block;
        }
      }
    }
  }
  .CartItemDelete {
    border-radius: 0.25rem;
    background-color: var(--color-grey-lightest);
    overflow: hidden;
    padding: 0.5rem;
    position: relative;
    margin-bottom: 1rem;
  }
  .CartItemDelete-mainContent {
    display: flex;
    column-gap: 1.125rem;
    align-items: center;
    flex-direction: row;
  }
  .CartItemDelete-img {
    display: flex;
    height: 5.5rem;
    img {
      object-fit: cover;
    }
  }
  .CartItemDelete-desc {
    flex-grow: 1;
    padding-top: 0.625rem;
    @media (width >= 40rem) {
      padding-block: 0;
      padding-inline: 0 0.5rem;
    }
  }
  .QuickOrderTable {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .QuickOrderTable-messages {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    &:empty {
      display: none;
    }
  }
  .QuickOrderTable-import {
    background: var(--color-lightest);
    padding: 1.25rem;
  }
  .QuickOrderTable-importTitle {
    color: var(--color-black);
    margin-bottom: 1rem;
  }
  .QuickOrderTable-importBody {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .QuickOrderTable-help, .QuickOrderTable-detail {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-grey-dark);
  }
  .QuickOrderTable-importActions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
  }
  .QuickOrderTable-file {
    display: inline-flex;
    flex-direction: column;
    gap: 0.25rem;
  }
  .QuickOrderTable-fileLabel {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-grey-darker);
  }
  .QuickOrderTable-fileInput:focus-visible {
    outline: 2px solid var(--color-base);
    outline-offset: 2px;
  }
  .QuickOrderTable-fileError, .QuickOrderTable-rejected {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-error-dark);
  }
  .QuickOrderTable-rejectedTitle {
    font-weight: 500;
    margin-bottom: 0.25rem;
  }
  .QuickOrderTable-rejected ul {
    list-style: disc;
    padding-left: 1.25rem;
  }
  .QuickOrderTable-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .QuickOrderTable-table {
    width: 100%;
    border-collapse: collapse;
    & th {
      font-family: var(--font-family-paragraph-3);
      font-size: var(--font-size-paragraph-3);
      line-height: var(--line-height-paragraph-3);
      color: var(--color-grey-dark);
      font-weight: 500;
      text-align: left;
      padding: 0.5rem;
      border-bottom: 1px solid var(--color-grey-lighter);
    }
    & td {
      padding: 0.5rem;
      vertical-align: middle;
      border-bottom: 1px solid var(--color-grey-lightest);
    }
    @media (width < 48rem) {
      & thead {
        display: none;
      }
      & tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 0.5rem;
        padding: 0.75rem 0;
        border-bottom: 1px solid var(--color-grey-lighter);
      }
      & td {
        min-width: 0;
        border-bottom: 0;
        padding: 0;
      }
      & td[data-label]::before {
        font-family: var(--font-family-paragraph-3);
        font-size: var(--font-size-paragraph-3);
        line-height: var(--line-height-paragraph-3);
        content: attr(data-label);
        display: block;
        color: var(--color-grey-dark);
      }
    }
  }
  .QuickOrderTable-row--unknown, .QuickOrderTable-row--unavailable {
    background: var(--color-error-lightest);
  }
  .QuickOrderTable-row--ambiguous, .QuickOrderTable-row--quantity_refused {
    background: var(--color-warning-lightest);
  }
  .QuickOrderTable-price {
    text-align: right;
    white-space: nowrap;
    @media (width < 48rem) {
      text-align: left;
    }
  }
  .QuickOrderTable-title {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-black);
  }
  .QuickOrderTable-actions {
    text-align: right;
  }
  .QuickOrderTable-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
  }
  .QuickOrderTable-submit {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
  }
  .QuickOrderTable-saveList {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1.5rem;
  }
  .SaveToPurchaseList {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
  .SaveToPurchaseList-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1.5rem;
  }
  .SaveToPurchaseList-help {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-grey-dark);
  }
  .Summary {
    --summary-border-radius: 0.25rem;
  }
  .Summary-list, .Summary-footer {
    padding-inline: 1.25rem;
  }
  .Summary-list {
    background: var(--color-white);
    border-start-start-radius: var(--summary-border-radius);
    border-start-end-radius: var(--summary-border-radius);
    padding-top: 0.5rem;
  }
  .Summary-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-block: 0.9375rem;
    gap: 1rem;
    border-bottom: 1px solid var(--color-grey-lighter);
    &:last-child {
      border-bottom: none;
    }
    & > div:first-child {
      color: var(--color-black);
      font-weight: var(--font-weight-semibold);
    }
    & > div:last-child {
      max-width: 7.5rem;
      text-align: end;
      color: var(--color-grey-dark);
    }
    & > ul:last-child {
      max-width: none;
    }
  }
  .Summary-discountLine > div:first-child {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .Summary-footer {
    background: var(--color-medium);
    border-end-start-radius: var(--summary-border-radius);
    border-end-end-radius: var(--summary-border-radius);
    padding-bottom: 1.25rem;
    color: var(--color-black);
  }
  .Summary-total {
    display: flex;
    justify-content: space-between;
    padding-top: 1.25rem;
    padding-bottom: 0.5rem;
    color: var(--color-black);
    font-weight: var(--font-weight-semibold);
    & > div:last-child {
      text-align: end;
    }
  }
  .DeliveryTracking {
    border-radius: 0.5rem;
    border: 1px solid var(--color-medium);
    background: var(--color-lightest);
    padding: 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .DeliveryTracking-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
  }
  .DeliveryTracking-title {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: var(--font-weight-bold);
    color: var(--color-black);
    padding-bottom: 0.25rem;
  }
  .DeliveryTracking-desc {
    font-family: var(--font-roboto);
    font-weight: var(--font-weight-normal);
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  .DeliveryTracking-steps {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .DeliveryTracking-step {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    &:not(:last-child):after {
      content: '';
      position: absolute;
      top: 1.25rem;
      inset-inline-start: 0.5rem;
      height: 1.5rem;
      width: 1px;
      background-color: var(--color-base);
    }
  }
  .DeliveryTracking-step--active {
    font-weight: var(--font-weight-semibold);
  }
  .DeliveryTracking-icon {
    display: block;
    width: 1rem;
    height: 1rem;
    color: var(--color-base);
    border: 1px solid currentColor;
    border-radius: 50%;
    flex-shrink: 0;
    & svg {
      width: 100%;
      height: 100%;
      display: block;
      color: currentColor;
    }
  }
  .Shipment {
    border-radius: 0.5rem;
    border: 1px solid var(--color-medium);
    background: var(--color-lightest);
    padding: 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .Shipment-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
  }
  .Shipment-title {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    font-weight: var(--font-weight-bold);
    color: var(--color-black);
    padding-bottom: 0.25rem;
  }
  .Shipment-ref {
    font-family: var(--font-roboto);
    font-weight: var(--font-weight-normal);
    font-size: 0.875rem;
    color: var(--color-grey-dark);
    margin-inline-start: 0.5rem;
  }
  .Shipment-desc {
    font-family: var(--font-roboto);
    font-weight: var(--font-weight-normal);
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  .Shipment-lines {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-family: var(--font-roboto);
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
  .Shipment-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.5rem;
  }
  .Shipment-quantity {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
  }
  .Shipment-lineRef {
    color: var(--color-grey-dark);
    font-size: 0.75rem;
  }
  .Shipment--remaining {
    border-style: dashed;
    background: var(--color-white);
  }
  .PaymentCard {
    position: relative;
    border-radius: 0.5rem;
    border: 1px solid var(--color-medium);
    background: var(--color-lightest);
    padding: 1.125rem;
    &.selected {
      background: var(--color-lighter);
    }
  }
  .PaymentCard-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
    display: block;
  }
  .PaymentCard-desc {
    color: var(--color-grey);
  }
  .PaymentCard-content {
    display: flex;
    cursor: pointer;
    align-items: baseline;
    gap: 0.5rem;
    .RadioButton {
      align-self: baseline;
    }
  }
  .PaymentCard-options {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.875rem;
    padding-left: 1.5rem;
  }
  .PaymentCard-options-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
    margin-bottom: 0.25rem;
  }
  .InvoiceCard {
    padding: 1.875rem;
    background-color: var(--color-lightest);
    border-radius: 0.5rem;
  }
  .InvoiceCard-address span {
    display: block;
  }
  .InvoiceCard-bottom {
    display: flex;
    justify-content: flex-end;
  }
  .DeliveryMode {
    background: var(--color-lightest);
    border: 1px solid var(--color-lightest);
    border-radius: 0.5rem;
    &.checked, &.selected {
      background: var(--color-lighter);
      border: 1px solid var(--color-medium);
    }
    label {
      cursor: pointer;
    }
  }
  .DeliveryMode-content {
    display: flex;
    align-items: flex-start;
    padding: 1rem;
    span:not(.Tag) {
      display: block;
    }
    & > span:last-child {
      flex-grow: 1;
    }
    .RadioButton {
      margin-top: 0.25rem;
      margin-inline-end: 0.5rem;
      visibility: hidden;
      max-width: 0;
      @media (width >= 48rem) {
        visibility: visible;
        max-width: initial;
      }
    }
  }
  .DeliveryMode-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
    margin-bottom: 0.125rem;
  }
  .DeliveryMode-description {
    font-weight: var(--font-weight-normal);
    color: var(--color-grey);
  }
  .DeliveryMode-estimate {
    margin-top: 0.5rem;
    color: var(--color-black);
  }
  .DeliveryMode-price {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
  }
  .DeliveryMode-icon {
    width: 3rem;
    height: 3rem;
    color: var(--color-medium);
    flex-shrink: 0;
    svg {
      width: 100%;
      height: 100%;
      display: block;
    }
  }
  .StoreDelivery-address {
    margin-top: 0.5rem;
    color: var(--color-grey-dark);
  }
  .DeliveryDatePicker {
    margin-top: -0.25rem;
    padding: 1rem;
    border: 1px solid var(--color-medium);
    border-top: 0;
    border-radius: 0 0 0.5rem 0.5rem;
    background: var(--color-white);
  }
  .DeliveryDatePicker-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
    margin-bottom: 0.75rem;
  }
  .DeliveryDatePicker-month {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 22rem;
    margin-bottom: 0.5rem;
  }
  .DeliveryDatePicker-monthName {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
  }
  .DeliveryDatePicker-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 9999px;
    color: var(--color-black);
    svg {
      width: 1.25rem;
      height: 1.25rem;
    }
    &:hover:not(:disabled) {
      background: var(--color-lighter);
    }
    &:disabled {
      color: var(--color-grey-lighter);
      cursor: not-allowed;
    }
  }
  .DeliveryDatePicker-grid {
    width: 100%;
    max-width: 22rem;
    border-collapse: separate;
    border-spacing: 0.25rem;
    table-layout: fixed;
    th {
      font-weight: var(--font-weight-normal);
      color: var(--color-grey-dark);
      text-align: center;
      padding-bottom: 0.25rem;
      abbr {
        text-decoration: none;
      }
    }
    td {
      text-align: center;
      padding: 0;
    }
  }
  .DeliveryDatePicker-day {
    width: 100%;
    aspect-ratio: 1;
    min-height: 2.5rem;
    border: 1px solid var(--color-grey-lighter);
    border-radius: 0.375rem;
    background: var(--color-white);
    color: var(--color-black);
    font-weight: var(--font-weight-semibold);
    &:hover:not(:disabled) {
      border-color: var(--color-dark);
    }
    &:disabled {
      background: var(--color-grey-lightest);
      border-color: var(--color-grey-lightest);
      color: var(--color-grey);
      font-weight: var(--font-weight-normal);
      text-decoration: line-through;
      cursor: not-allowed;
    }
    &.is-selected {
      background: var(--color-black);
      border-color: var(--color-black);
      color: var(--color-white);
    }
  }
  .DeliveryDatePicker-slots {
    margin-top: 1rem;
    ul {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
    }
  }
  .DeliveryDatePicker-slot {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.125rem;
    min-width: 9rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-grey-lighter);
    border-radius: 0.375rem;
    background: var(--color-white);
    color: var(--color-black);
    text-align: start;
    &:hover:not(:disabled) {
      border-color: var(--color-dark);
    }
    &:disabled {
      background: var(--color-grey-lightest);
      color: var(--color-grey);
      cursor: not-allowed;
    }
    &.is-selected {
      background: var(--color-black);
      border-color: var(--color-black);
      color: var(--color-white);
    }
  }
  .DeliveryDatePicker-slotTitle {
    font-weight: var(--font-weight-semibold);
  }
  .DeliveryDatePicker-slotFull {
    font-size: 0.875rem;
  }
  .DeliveryDatePicker-chosen {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    color: var(--color-black);
    font-weight: var(--font-weight-semibold);
    svg {
      width: 1.25rem;
      height: 1.25rem;
      color: var(--color-success-dark);
    }
  }
  .PickupPoint {
    background: var(--color-lighter);
    border: 1px solid var(--color-lighter);
    border-radius: 0.5rem;
    padding: 1rem;
    &.selected {
      background: var(--color-white);
      border: 1px solid var(--color-medium);
    }
  }
  .PickupPoint-content {
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    span {
      display: block;
    }
    & > span:last-child {
      flex-grow: 1;
    }
    .RadioButton {
      margin-top: 0.25rem;
      margin-inline-end: 0.5rem;
    }
  }
  .PickupPoint-title {
    font-weight: var(--font-weight-semibold);
    color: var(--color-black);
  }
  .PickupPoint-address {
    color: var(--color-grey-dark);
    font-weight: var(--font-weight-normal);
  }
  .PickupPoint-hours {
    margin-top: 0.5rem;
    @media (width >= 48rem) {
      margin-inline-start: 1.375rem;
    }
  }
  .PickupPoint-hoursTable {
    td {
      padding-inline-end: 1rem;
      padding-block: 0.125rem;
    }
  }
  @layer components {
    .AddToCartToast {
      position: fixed;
      bottom: 0;
      inset-inline-start: 0;
      z-index: 99;
      width: 100%;
      max-width: 100%;
      padding: 3rem 2.5rem;
      border-radius: 0.5rem;
      background-color: var(--color-lightest);
      @media (width >= 40rem) {
        top: 1.875rem;
        inset-inline-end: 1.875rem;
        inset-inline-start: auto;
        height: fit-content;
        width: calc(100vw - 3.75rem);
        max-width: 32.375rem;
        padding: 1.5rem 1.25rem;
        box-shadow: 0 0 8px 0 #5454544d;
      }
    }
    .AddToCartToast-iconClose {
      position: absolute;
      top: 0.625rem;
      inset-inline-end: 0.625rem;
      width: 2.1875rem;
      cursor: pointer;
    }
    .AddToCartToast-message {
      font-size: var(--font-size-h4-m);
      font-weight: var(--font-weight-h4);
      line-height: var(--line-height-h4-m);
      @media (width >= 48rem) {
        font-size: var(--font-size-h4-d);
        line-height: var(--line-height-h4-d);
      }
      --tw-font-weight: var(--font-weight-bold);
      font-weight: var(--font-weight-bold);
      margin-bottom: 1rem;
      color: var(--color-black);
      text-align: center;
      @media (width >= 40rem) {
        font-family: var(--font-family-paragraph-1);
        font-size: var(--font-size-paragraph-1);
        line-height: var(--line-height-paragraph-1);
        max-width: 90%;
        text-align: start;
      }
    }
    .AddToCartToast-message::before {
      content: "";
      position: absolute;
      top: 1.125rem;
      left: 50%;
      width: 2.625rem;
      height: 0.3125rem;
      border-radius: 1.25rem;
      background: var(--color-grey);
      transform: translate(-50%, -50%);
      @media (width >= 40rem) {
        display: none;
      }
    }
    .AddToCartToast-mainContent {
      display: flex;
      flex-direction: column;
      margin-bottom: 0.75rem;
      @media (width >= 40rem) {
        flex-direction: row;
        column-gap: 1.5rem;
      }
    }
    .AddToCartToast-imgLink {
      display: flex;
      flex-basis: 4.625rem;
    }
    .AddToCartToast-img {
      width: 100%;
    }
    .AddToCartToast-title {
      font-family: var(--font-family-paragraph-2);
      font-size: var(--font-size-paragraph-2);
      line-height: var(--line-height-paragraph-2);
      font-size: var(--font-size-h5-m);
      font-weight: var(--font-weight-h5);
      line-height: var(--line-height-h5-m);
      @media (width >= 48rem) {
        font-size: var(--font-size-h5-d);
        line-height: var(--line-height-h5-d);
      }
      display: block;
      color: var(--color-black);
      text-decoration: none;
    }
    .AddToCartToast-desc {
      flex-grow: 1;
      padding-top: 0.625rem;
      align-items: center;
      @media (width >= 40rem) {
        padding-top: 0;
        padding-inline-end: 0.5rem;
      }
    }
    .AddToCartToast-infos {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      row-gap: 0.5rem;
      color: var(--color-grey);
    }
    .AddToCartToast-infos > span:not(:last-child)::after {
      content: "|";
      padding: 0 0.625rem;
    }
    .AddToCartToast-secondaryTitle {
      font-family: var(--font-family-paragraph-3);
      font-size: var(--font-size-paragraph-3);
      line-height: var(--line-height-paragraph-3);
      width: 100%;
      &::after {
        content: "" !important;
      }
      @media (width >= 40rem) {
        margin-bottom: 0.3125rem;
      }
    }
    .AddToCartToast-bottom {
      display: flex;
      flex-wrap: wrap;
      gap: 0.625rem;
      margin-top: 0.625rem;
      width: 100%;
      @media (width >= 40rem) {
        margin-top: 0;
      }
    }
    .AddToCartToast-bottom .button {
      flex-grow: 1;
      @media (width >= 64rem) {
        flex-grow: 0;
      }
    }
  }
  .VideoPlayer {
    width: 100%;
    height: 100%;
  }
  .VideoPlayer-stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
  .VideoPlayer-poster {
    max-height: var(--product-gallery-height, 28.75rem);
    object-fit: contain;
  }
  .VideoPlayer-frame, .VideoPlayer-file {
    width: 100%;
    aspect-ratio: 16 / 9;
    max-height: var(--product-gallery-height, 28.75rem);
    background-color: var(--color-black);
    border: 0;
  }
  .VideoPlayer-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    cursor: pointer;
  }
  .VideoPlayer-playIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    color: var(--color-black);
    background-color: var(--color-white);
    border-radius: 50%;
    transition: transform 0.2s ease;
    svg {
      width: 1.5rem;
      height: 1.5rem;
      margin-left: 0.1875rem;
    }
  }
  .VideoPlayer-play:hover .VideoPlayer-playIcon, .VideoPlayer-play:focus-visible .VideoPlayer-playIcon {
    transform: scale(1.1);
  }
  .PickupSearch-inputGroup {
    display: flex;
    align-items: flex-end;
    position: relative;
    & > .Input {
      flex: 1;
      min-width: 0;
    }
    .Input-error {
      position: absolute;
      top: 100%;
      inset-inline: 0;
      margin-top: 0.25rem;
    }
    .Input-input {
      border-start-end-radius: 0;
      border-end-end-radius: 0;
      border-inline-end: none;
    }
  }
  .PickupSearch-inputGroup:has(.Input-error) {
    margin-bottom: 1.5rem;
  }
  .PickupSearch-searchButton {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.125rem;
    flex-shrink: 0;
    background: var(--color-white);
    border: 1px solid var(--color-medium);
    border-start-start-radius: 0;
    border-end-start-radius: 0;
    border-start-end-radius: 0.5rem;
    border-end-end-radius: 0.5rem;
    color: var(--color-black);
    cursor: pointer;
    transition: 0.2s ease all;
    &:hover {
      background: var(--color-lightest);
    }
    svg {
      width: 1.25rem;
      height: var(--line-height-paragraph-4);
    }
  }
  .PickupSearch-map {
    height: 17.8125rem;
    width: 100%;
  }
  .PickupSearch-marker {
    border-radius: 50%;
    background: var(--color-black);
    border: 3px solid var(--color-white);
    box-shadow: 0 1px 4px rgb(0 0 0 / 40%);
  }
  .PickupSearch-marker--selected {
    background: var(--color-medium);
  }
  .Footer {
    display: flex;
    flex-direction: column;
    padding: 3.125rem 0 2.125rem;
    background: var(--color-lightest);
    @media (width < 48rem) {
      margin-bottom: var(--header-nav-height);
    }
    @media (width >= 48rem) {
      padding: 0 0 2.8125rem;
    }
  }
  .Footer-grid {
    @media (width >= 48rem) {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
    }
  }
  .Footer--withNewsletter .Footer-grid {
    @media (width >= 64rem) {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  .Footer-newsletter {
    margin-bottom: 3.125rem;
    @media (width >= 48rem) {
      margin-bottom: 0;
      padding-top: 3.125rem;
      padding-inline-start: 3.125rem;
    }
    @media (width >= 64rem) {
      padding-top: 6.25rem;
    }
  }
  .Footer-storeName, .Footer-newsletterTitle {
    font-weight: 600;
  }
  .Footer-newsletterText {
    margin-bottom: 1rem;
  }
  .Footer-newsletterButton {
    width: 100%;
    @media (width >= 48rem) {
      width: auto;
    }
  }
  .Footer-storeInfos {
    margin-bottom: 1.875rem;
    @media (width >= 48rem) {
      margin-bottom: 0;
      padding-top: 3.125rem;
      padding-inline-start: 2.5rem;
      border-inline-end: 1px solid var(--color-grey-lighter);
    }
    @media (width >= 64rem) {
      padding-top: 6.25rem;
      padding-bottom: 5.625rem;
    }
  }
  .Footer--withNewsletter .Footer-storeInfos {
    @media (width >= 48rem) {
      border-inline-end: 0;
      border-inline-start: 1px solid var(--color-grey-lighter);
    }
    @media (width >= 64rem) {
      border-inline-end: 1px solid var(--color-grey-lighter);
    }
  }
  .Footer-storeName {
    margin-bottom: 0.25rem;
  }
  .Footer-storePhone {
    margin: 1rem 0;
  }
  .Footer-storePhone a, .Footer-copyright a, .FooterCheckout-copyright a {
    display: inline-block;
    padding-block: 0.375rem;
  }
  .Footer-links {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 1.875rem;
    color: var(--color-black);
    @media (width >= 48rem) {
      gap: 0.5rem;
      margin-bottom: 0;
      padding-block: 3.125rem 4.375rem;
      padding-inline: 2.5rem 0;
    }
    @media (width >= 64rem) {
      padding-top: 6.25rem;
    }
  }
  .Footer--withNewsletter .Footer-links {
    @media (width >= 48rem) {
      grid-column: span 2 / span 2;
    }
    @media (width >= 64rem) {
      grid-column: span 1 / span 1;
    }
  }
  .Footer-link {
    text-decoration: underline;
    outline: none;
    display: inline-block;
    padding-block: 0.5rem;
    &:hover {
      @media (hover: hover) {
        text-decoration: none;
        opacity: 0.75;
      }
    }
    &:focus {
      text-decoration: none;
      opacity: 0.75;
    }
  }
  .Footer-socialsWrapper {
    @media (width >= 48rem) {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 1.875rem 3.125rem 0;
    }
  }
  .Footer-socials {
    display: flex;
    margin-bottom: 1.25rem;
    justify-content: space-between;
    color: var(--color-black);
    @media (width >= 48rem) {
      margin-bottom: 0;
      gap: 1.875rem;
    }
  }
  .Footer-icon {
    width: 1.75rem;
    height: 1.75rem;
  }
  .Footer-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .FooterCheckout {
    display: flex;
    flex-direction: column;
    gap: 2.25rem;
    padding: 1.5rem;
    color: var(--color-black);
    background: var(--color-lightest);
    @media (width >= 48rem) {
      gap: 0.75rem;
    }
    @media (width >= 85.375rem) {
      flex-direction: row;
      justify-content: space-between;
      padding-inline: 7.5rem;
    }
  }
  .FooterCheckout-links {
    display: flex;
    flex-direction: column;
    gap: 0;
    @media (width >= 48rem) {
      flex-direction: row;
      gap: 1.5rem;
    }
  }
  .HeaderCheckout {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    height: 3rem;
    padding-inline: 1.5rem;
  }
  @media (width >= 85.375rem) {
    .HeaderCheckout {
      height: 5rem;
    }
  }
  .HeaderCheckout-logo {
    display: flex;
    align-items: center;
    svg {
      height: 1.5rem;
      width: auto;
    }
  }
  @media (width >= 85.375rem) {
    .HeaderCheckout-logo {
      margin-inline: auto;
    }
  }
  .HeaderCheckout-reassurance {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    svg {
      width: 1.25rem;
      flex-shrink: 0;
    }
  }
  @media (width >= 40rem) {
    .HeaderCheckout-reassurance {
      position: absolute;
      inset-inline-end: 1.5rem;
      top: 50%;
      translate: 0 -50%;
    }
  }
  .AccountOrders-list {
    display: grid;
    gap: 1.5rem;
    max-width: 38.5rem;
    margin-inline: auto;
    @media (width >= 85.375rem) {
      max-width: none;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .AccountPurchaseLists {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .AccountPurchaseLists-create {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 1rem;
    background: var(--color-lightest);
    padding: 1.25rem;
  }
  .AccountPurchaseLists-createField {
    flex: 1 1 18rem;
    min-width: 0;
  }
  .AccountPurchaseLists-count, .AccountPurchaseLists-meta {
    font-family: var(--font-family-paragraph-3);
    font-size: var(--font-size-paragraph-3);
    line-height: var(--line-height-paragraph-3);
    color: var(--color-grey-dark);
  }
  .AccountPurchaseLists-list {
    display: flex;
    flex-direction: column;
  }
  .AccountPurchaseLists-item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem 1.5rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--color-grey-lighter);
  }
  .AccountPurchaseLists-summary {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
  }
  .AccountPurchaseLists-title {
    font-size: var(--font-size-h5-m);
    font-weight: var(--font-weight-h5);
    line-height: var(--line-height-h5-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h5-d);
      line-height: var(--line-height-h5-d);
    }
    color: var(--color-black);
    overflow-wrap: anywhere;
    &:hover, &:focus-visible {
      text-decoration: underline;
    }
  }
  .AccountPurchaseLists-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
  }
  .CrossSelling {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline-start: calc(var(--spacing) * 6);
    margin-inline: calc(calc(var(--spacing) * 6) * -1);
    padding-inline: calc(var(--spacing) * 6);
    @media (width >= 48rem) {
      margin-inline: 0;
      padding-inline: 0;
    }
    @media (width >= 64rem) {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1.5rem;
      cursor: initial;
      overflow-x: visible;
      scroll-snap-type: none;
      scroll-padding-inline-start: 0;
    }
  }
  .CrossSelling .ProductCard {
    flex: 0 0 auto;
    width: 11.6875rem;
    scroll-snap-align: start;
    @media (width >= 48rem) {
      flex-grow: 1;
      width: 18rem;
    }
    @media (width >= 64rem) {
      width: initial;
      &:active {
        cursor: initial;
      }
    }
  }
  .Reviews {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    @media (width >= 48rem) {
      flex-direction: row;
      overflow: hidden;
      gap: 1.5rem;
    }
    @media (width >= 64rem) {
      cursor: initial;
    }
  }
  .Reviews .Review {
    @media (width >= 48rem) {
      width: 16.9375rem;
      flex-shrink: 0;
      &:last-child {
        margin-inline-end: 3rem;
      }
    }
    @media (width >= 64rem) {
      width: auto;
      flex-shrink: 1;
      &:active {
        cursor: initial;
      }
      &:last-child {
        margin-inline-end: 0;
      }
    }
  }
  .SimilarContents {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    @media (width >= 48rem) {
      flex-direction: row;
      overflow: hidden;
    }
    @media (width >= 64rem) {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      cursor: initial;
    }
    @media (width >= 85.375rem) {
      grid-template-columns: repeat(3, 1fr);
      gap: 2rem;
    }
  }
  .SimilarContents .SimilarContentCard {
    @media (width >= 48rem) {
      width: 21.25rem;
      flex-shrink: 0;
      &:last-child {
        margin-inline-end: 3rem;
      }
    }
    @media (width >= 64rem) {
      width: initial;
      &:active {
        cursor: initial;
      }
      &:last-child {
        margin-inline-end: 0;
      }
    }
    @media (width >= 85.375rem) {
      flex-shrink: 0;
      &:active {
        cursor: initial;
      }
    }
  }
  .Subheader {
    position: relative;
    background: var(--color-lighter);
    display: flex;
    align-items: center;
  }
  .Subheader .Breadcrumb {
    position: absolute;
    top: 0.5rem;
    inset-inline-start: 0;
    @media (width >= 48rem) {
      top: 1.25rem;
      inset-inline-start: 1.25rem;
    }
  }
  .Subheader--titleOnly {
    min-height: 21.25rem;
    padding: 1.5rem 0;
    @media (width >= 48rem) {
      min-height: 15.625rem;
      padding: 2rem 0;
    }
  }
  .Subheader--centered {
    text-align: center;
  }
  .Subheader-title {
    font-size: var(--font-size-h1-m);
    font-weight: var(--font-weight-h1);
    line-height: var(--line-height-h1-m);
    @media (width >= 48rem) {
      font-size: var(--font-size-h1-d);
      line-height: var(--line-height-h1-d);
    }
    color: var(--color-black);
  }
  .Subheader--contentPage {
    flex-direction: column;
    min-height: 41.5rem;
    @media (width >= 48rem) {
      flex-direction: row-reverse;
      min-height: 21.875rem;
      align-items: stretch;
    }
  }
  .Subheader-image {
    display: block;
    width: 100%;
    height: 24.375rem;
    overflow: hidden;
    & img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    @media (width >= 48rem) {
      position: absolute;
      top: 0;
      inset-inline-end: 0;
      bottom: 0;
      inset-inline-start: calc(100% - calc(var(--spacing) * 13) - var(--container-double-3-col-b-md));
      width: auto;
      height: auto;
    }
    @media (width >= 64rem) {
      inset-inline-start: calc(100% - calc(var(--spacing) * 20) - var(--container-double-3-col-b-lg));
    }
    @media (width >= 85.375rem) {
      inset-inline-start: calc(50% + (var(--breakpoint-xl) / 2) - calc(var(--spacing) * 20) - var(--container-double-3-col-b-xl));
    }
    @media (width >= 120rem) {
      inset-inline-start: auto;
      width: calc((var(--breakpoint-3xl) / 2) - (var(--breakpoint-xl) / 2) + calc(var(--spacing) * 20) + var(--container-double-3-col-b-xl));
    }
  }
  .Subheader-text--withImage {
    max-width: var(--container-double-3-col-a-md);
    @media (width >= 64rem) {
      max-width: var(--container-double-3-col-a-lg);
    }
    @media (width >= 85.375rem) {
      max-width: var(--container-double-3-col-a-xl);
    }
  }
  .Subheader-description {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    padding-top: 1rem;
    padding-bottom: 1rem;
    color: var(--color-black);
  }
  .Subheader--category {
    min-height: 21rem;
    padding: 5rem 0 2.5rem;
    @media (width >= 48rem) {
      min-height: 21.5rem;
    }
    @media (width >= 64rem) {
      min-height: 17.75rem;
      padding: 5.625rem 0 2.5rem;
    }
  }
  .Subheader--category .container-double-2 .Subheader-content {
    @media (width >= 24.375rem) {
      padding-inline: 1.5rem;
    }
    @media (width >= 48rem) {
      padding-inline: 0;
    }
  }
  .Subheader--category .Subheader-description {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    padding-top: 1rem;
    color: var(--color-black);
  }
  .Subheader-readMore {
    margin-top: 1rem;
  }
  .Subheader-listingBar {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 2.5rem;
    @media (width >= 64rem) {
      display: none;
    }
  }
  .Subheader-count {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    color: var(--color-grey-dark);
  }
  .Subheader-logo {
    margin-bottom: 1.5rem;
  }
  .Subheader-logo img {
    width: auto;
    max-width: 100%;
    max-height: 5rem;
    object-fit: contain;
  }
  .Subheader--search {
    padding: 5.5rem 0 2.8125rem;
    @media (width >= 48rem) {
      padding-block: 6.25rem 2.875rem;
    }
  }
  .Subheader--search .Subheader-content {
    @media (width >= 48rem) {
      max-width: 41.75rem;
    }
  }
  .Subheader--search .Subheader-searchForm {
    margin-top: 1rem;
  }
  .ProductListing {
    padding-block: 1.5rem;
    @media (width >= 64rem) {
      padding-block: 2.75rem;
    }
  }
  .ProductListing-panel {
    @media (width >= 64rem) {
      display: flex;
      flex-direction: column;
      gap: 1.875rem;
      position: relative;
      margin-top: 3rem;
    }
  }
  .ProductListing-drawerTitle {
    margin-bottom: 2rem;
  }
  .ProductListing-section + .ProductListing-section {
    margin-top: 1.875rem;
    @media (width >= 64rem) {
      margin-top: 0;
    }
  }
  .ProductListing-sectionTitle, .ProductListing-legend {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    font-weight: var(--font-weight-semibold);
    display: block;
    margin-bottom: 0.5rem;
    color: var(--color-black);
  }
  .ProductListing-legend {
    padding-inline: 0;
    @media (width >= 64rem) {
      font-size: var(--font-size-h4-d);
      font-weight: var(--font-weight-h4);
      line-height: var(--line-height-h4-d);
      margin-bottom: 1.75rem;
    }
  }
  .ProductListing-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.875rem;
    @media (width >= 64rem) {
      margin-top: 0;
    }
  }
  .ProductListing-clear {
    @media (width >= 64rem) {
      position: absolute;
      top: 0;
      inset-inline-end: 0;
    }
  }
  .FilterAccordion {
    background-color: var(--color-lightest);
    border-radius: 0.5rem;
    border-bottom: 0;
    @media (width >= 64rem) {
      background-color: transparent;
      border-radius: 0;
      border-bottom: 1px solid var(--color-grey-lighter);
    }
  }
  .FilterAccordion + .FilterAccordion {
    margin-top: 0.5rem;
    @media (width >= 64rem) {
      margin-top: 0;
    }
  }
  .FilterAccordion [data-slot="accordion-trigger"], .FilterAccordion [data-slot="accordion-content"] {
    @media (width >= 64rem) {
      padding-inline: 0;
    }
  }
  .Fieldset-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    @media (width >= 64rem) {
      gap: 0;
    }
  }
  .ProductListing-toolbar {
    display: none;
    @media (width >= 64rem) {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 1.8125rem;
    }
  }
  .ProductListing-sort {
    width: 15.625rem;
    margin-inline-start: auto;
  }
  .ProductListing-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 0.75rem;
    margin-bottom: 2.5rem;
    transition: opacity 0.2s ease;
    @media (width >= 40rem) {
      grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
      gap: 2rem;
    }
  }
  .ProductListing-empty {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    min-height: 25rem;
  }
  .ReinsuranceModule {
    --reinsurance-module-spacer: 1.5rem;
    background: var(--color-white);
    @media (width >= 48rem) {
      --reinsurance-module-spacer: 0.625rem;
    }
    @media (width >= 64rem) {
      --reinsurance-module-spacer: 3.375rem;
    }
  }
  .ReinsuranceModule-wrapper {
    max-width: 67.625rem;
    margin-inline: auto;
    padding: 2.5rem 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: var(--color-grey);
    @media (width >= 48rem) {
      flex-direction: row;
    }
  }
  .ReinsuranceModule-wrapper strong {
    font-family: var(--font-family-paragraph-4);
    font-size: var(--font-size-paragraph-4);
    line-height: var(--line-height-paragraph-4);
    display: block;
    font-weight: 700;
    color: var(--color-black);
  }
  .ReinsuranceModule-wrapper > div {
    display: flex;
    gap: 0.75rem;
    padding-block: var(--reinsurance-module-spacer);
    @media (width >= 48rem) {
      max-width: calc(100% / 3);
      padding-block: 0;
      padding-inline: var(--reinsurance-module-spacer);
    }
  }
  .ReinsuranceModule-wrapper > div:not(:last-child) {
    border-bottom: 1px solid var(--color-grey-lighter);
    @media (width >= 48rem) {
      border-bottom: none;
      border-inline-end: 1px solid var(--color-grey-lighter);
    }
  }
  .ReinsuranceModule-wrapper > div:first-child {
    padding-top: 0;
    @media (width >= 48rem) {
      padding-inline-start: 0;
    }
  }
  .ReinsuranceModule-wrapper > div:last-child {
    padding-bottom: 0;
    @media (width >= 48rem) {
      padding-inline-end: 0;
    }
  }
  .ReinsuranceModule-text {
    font-family: var(--font-family-paragraph-6);
    font-size: var(--font-size-paragraph-6);
    line-height: var(--line-height-paragraph-6);
  }
  .ReinsuranceModule-icon {
    display: block;
    width: 2.25rem;
    height: 2.25rem;
    flex-shrink: 0;
    color: var(--color-grey);
  }
  .ReinsuranceModule-icon svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .BlocksToc {
    top: calc(var(--header-height) + 1rem);
  }
  .tb-blockTitle {
    scroll-margin-top: calc(var(--header-height) + 1rem);
  }
  .BlocksToc-inner {
    background-color: var(--color-white);
    border-radius: 0.625rem;
    padding: 1rem 1.5rem;
  }
  .BlocksToc-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .BlocksToc-list li {
    display: flex;
    align-items: center;
    min-height: 3.5rem;
    border-bottom: 1px solid var(--color-grey-lighter);
  }
  .BlocksToc-link {
    font-family: var(--font-family-paragraph-2);
    font-size: var(--font-size-paragraph-2);
    line-height: var(--line-height-paragraph-2);
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    flex: 1;
    padding: 0.75rem 0.5rem;
    color: var(--color-black);
    text-decoration: none;
  }
  .BlocksToc-link:hover {
    text-decoration: underline;
  }
  .BlocksToc-link:focus-visible {
    outline: 2px solid var(--color-base);
    outline-offset: 2px;
  }
  .BlockTable {
    overflow: auto;
    width: 100%;
    border-radius: 0.5rem;
    border: 1px solid var(--color-lighter);
    margin: 2rem 0;
    table {
      width: 100%;
      border-collapse: collapse;
    }
    thead th {
      background-color: var(--color-medium);
      color: var(--color-black);
      font-weight: 700;
      text-align: start;
      padding: 0.75rem 1rem;
      white-space: nowrap;
    }
    tbody tr:nth-child(even) {
      background-color: var(--color-lightest);
    }
    tbody td {
      padding: 0.625rem 1rem;
      border-bottom: 1px solid var(--color-lighter);
      color: var(--color-black);
      vertical-align: top;
    }
    tbody tr:last-child td {
      border-bottom: none;
    }
    a {
      text-decoration: underline;
      &:hover {
        color: var(--color-base);
      }
    }
  }
  .tb-blockVideo {
    border-radius: 0.5rem;
    margin: 1rem 0;
    overflow: hidden;
  }
}
.ProductPage {
  color: var(--color-black);
}
.ProductPage-grid {
  display: grid;
  @media (width >= 64rem) {
    grid-template-rows: auto auto;
    grid-template-columns: repeat(12, 1fr);
    gap: 2.875rem 3.375rem;
  }
  @media (width >= 85.375rem) {
    gap: 1rem 1.25rem;
  }
}
.ProductPage-gallery {
  order: 1;
  margin-inline: calc(calc(var(--spacing) * 6) * -1);
  @media (width >= 40rem) {
    margin-inline: 0;
  }
  @media (width >= 64rem) {
    grid-column: 1 / 7;
  }
  @media (width >= 85.375rem) {
    grid-column: 1 / 8;
  }
}
.ProductPage-infos {
  order: 2;
  margin-top: 1.875rem;
  @media (width >= 64rem) {
    grid-row: 1 / 3;
    grid-column: 7 / 13;
    margin-top: 0;
  }
  @media (width >= 85.375rem) {
    grid-column: 9 / 13;
  }
}
.ProductPage-brand {
  margin-bottom: 0.75rem;
}
.ProductPage-features {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.25rem 0.5rem;
}
.ProductPage-description {
  order: 3;
  margin-top: 1.875rem;
  @media (width >= 64rem) {
    margin-top: 0;
    grid-column: 1 / 7;
  }
  @media (width >= 85.375rem) {
    grid-column: 2 / 8;
  }
}
html {
  overflow-y: scroll;
}
body {
  color: var(--color-black);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: clip;
  overflow-anchor: none;
  &.locked {
    overflow: hidden;
    height: 100vh;
    height: 100dvh;
    position: relative;
    > * {
      flex-shrink: 0;
    }
  }
}
main {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
}
.wysiwyg {
  max-width: none;
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --tw-content {
  syntax: "*";
  initial-value: "";
  inherits: false;
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-font-weight: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-content: "";
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
    }
  }
}
