/* #region Font faces */
@import url(https://fonts.bunny.net/css?family=gantari:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|space-grotesk:300,400,500,600,700&display=swap);

/* #endregion */

/* #region variables */
:root {
  /* Colors */
  --value-color-orange: 7.66, 90.38%, 59.22%;
  --color-orange: hsl(var(--value-color-orange));
  --color-orange-50: hsla(var(--value-color-orange), 0.5);

  --value-color-black: 225, 6.25%, 12.55%;
  --color-black: hsl(var(--value-color-black));
  --color-black-50: hsla(var(--value-color-black), 0.5);

  --value-color-grey: 0, 0%, 36.08%;
  --color-grey: hsl(var(--value-color-grey));
  --color-grey-50: hsla(var(--value-color-grey), 0.5);

  --value-color-white: 0, 0%, 100%;
  --color-white: hsl(var(--value-color-white));
  --color-white-50: hsla(var(--value-color-white), 0.5);

  --value-color-beige: 45, 28.57%, 94.51%;
  --color-beige: hsl(var(--value-color-beige));
  --color-beige-50: hsla(var(--value-color-beige), 0.5);

  /* Fonts */
  /* Families */
  --font-family-space-grotesk: "Space Grotesk", sans-serif;
  --font-family-gantari: "Gantari", sans-serif;

  /* Line heights */
  --line-height-none: 1;
  --line-height-tight: 1.2;
  --line-height-normal: 1.4;
  --line-height-loose: 1.6;

  /* Font sizes (rem) */
  /* Mobile */
  /* Headlines */
  --font-size-h1: 2.5rem;
  --font-size-h2: 2.25rem;
  --font-size-h3: 1.75rem;
  --font-size-h4: 1.25rem;
  --font-size-h5: 1.1875rem;
  --font-size-h6: 1.125rem;

  /* Body */
  --font-size-body: 1rem;
  --font-size-small: 0.875rem;

  /* Tagline */
  --font-size-tagline: 1.125rem;

  /* Image patterns */
  --image-pattern-1: url("/modules/octablocks/views/images/bg1.png");
  --image-pattern-2: url("/modules/octablocks/views/images/bg2.webp");
}

@media screen and (min-width: 768px) {
  :root {
    /* Desktop */
    /* Headlines */
    --font-size-h1: 3.5rem;
    --font-size-h2: 2.5rem;
    --font-size-h3: 1.75rem;
    --font-size-h4: 1.25rem;
    --font-size-h5: 1.1875rem;
    --font-size-h6: 1.125rem;

    /* Body */
    --font-size-body: 1.125rem;

    /* Tagline */
    --font-size-tagline: 3.125rem;

    /* Button */
    --font-size-btn: 1.3125rem;
  }
}
/* #endregion */

/* #region Utilities */

.bg-dark,
.bg-darker {
  background-color: var(--color-black) !important;
}

.bg-light,
.bg-lighter {
  background-color: var(--color-beige) !important;
}

.bg-white {
  background-color: var(--color-white) !important;
}

.bg-black {
  background-color: var(--color-black) !important;
}

.bg-primary {
  background-color: var(--color-orange) !important;
}

.bg-grey {
  background-color: var(--color-grey) !important;
}

.text-dark,
.text-darker {
  color: var(--color-black) !important;
}

.text-light,
.text-lighter {
  color: var(--color-beige) !important;
}

.text-white {
  color: var(--color-white) !important;
}

.text-black {
  color: var(--color-black) !important;
}

.text-primary {
  color: var(--color-orange) !important;
}

.text-grey {
  color: var(--color-grey) !important;
}

.w-1\/2 {
  width: 50%;
}

.w-1\/3 {
  width: 33.3333%;
}

.w-1\/4 {
  width: 25%;
}

.w-1\/5 {
  width: 20%;
}

/* #endregion */

/* #region Reset */

html {
  height: 100%;
  scroll-behavior: smooth;
  font-size: 100% !important;
}

body {
  height: 100%;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: var(--line-height-normal);
  font-family: var(--font-family-space-grotesk);
  font-size: var(--font-size-body) !important;
  color: var(--color-black);
  text-wrap: pretty;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: var(--font-family-gantari);
  line-height: var(--line-height-tight);
  text-wrap: balance;
  color: var(--color-orange);
  font-weight: 700;
}

h1,
.h1 {
  font-size: var(--font-size-h1) !important;
}

h2,
.h2 {
  font-size: var(--font-size-h2) !important;
}

h3,
.h3 {
  font-size: var(--font-size-h3) !important;
}

h4,
.h4 {
  font-size: var(--font-size-h4) !important;
}

h5,
.h5 {
  font-size: var(--font-size-h5) !important;
}

h6,
.h6 {
  font-size: var(--font-size-h6) !important;
}

::selection {
  background-color: var(--color-orange);
  color: var(--color-white);
}

::-moz-selection {
  background-color: var(--color-orange);
  color: var(--color-white);
}

.tagline {
  font-size: var(--font-size-tagline);
  font-family: var(--font-family-space-grotesk);
}

.btn-secondary,
.btn-secondary:hover,
.btn-outline-secondary,
.btn-outline-secondary:hover,
.btn-light,
.btn-light:hover {
  color: var(--value-color-grey) !important;
}

.btn,
.octa-col__item__link_1 a,
::-webkit-file-upload-button {
  line-height: 1;
  font-family: var(--font-family-space-grotesk);
  font-size: var(--font-size-btn, 1rem);
  background-color: var(--color-orange);
  color: var(--color-white);
  border: none;
  border-radius: 9999px;
  padding-block: 25px;
  padding-inline: 50px;
  text-decoration: none;
  transition: all 0.3s ease;
  user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  white-space: initial;
  width: max-content;
  max-width: 100%;
  display: inline-block;
  font-weight: 600;
}

.btn-small {
  font-size: 1.1875rem;
  padding-block: 12.5px;
  padding-inline: 40px;
  line-height: 1.4;
}

:is(.btn, .octa-col__item__link_1 a, ::-webkit-file-upload-button) * {
  user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  margin: 0;
}

button.btn,
button.btn:not(:disabled):not(.disabled),
.accordion button:hover,
.accordion button:focus {
  cursor: default;
}

:is(.btn, .octa-col__item__link_1 a, ::-webkit-file-upload-button):is(
    :hover,
    :focus,
    :active
  ) {
  color: #fff;
  background-color: var(--color-grey);
  text-decoration: none;
}

/* Increase the click area of buttons and links */
@media (pointer: coarse) {
  button,
  a {
    position: relative;
  }

  :is(button, a)::after {
    content: "";
    position: absolute;
    inset: -10px;
  }
}

.btn-outline-secondary {
  color: var(--color-white) !important;
}

:is(
    .btn,
    #octa-col-90-1 .octa-col__item__link_1 a,
    ::-webkit-file-upload-button
  ):hover,
.navbar-toggle-btn:is(:active, :focus) {
  background-color: var(--color-orange-50);
  color: var(--color-white) !important;
}

:is(
    .btn:not(.navbar-toggle-btn),
    #octa-col-90-1 .octa-col__item__link_1 a,
    ::-webkit-file-upload-button
  ):is(:active, :focus) {
  background-color: var(--color-grey) !important;
  color: var(--color-white) !important;
}

:is(
    .btn,
    #octa-col-90-1 .octa-col__item__link_1 a,
    ::-webkit-file-upload-button
  ):focus-visible {
  outline: 2px solid var(--color-orange);
  outline-offset: 2px;
}

:is(
    .btn,
    #octa-col-90-1 .octa-col__item__link_1 a,
    ::-webkit-file-upload-button
  ):disabled {
  background-color: var(--color-grey);
  color: var(--color-black) !important;
}

:is(
    .btn,
    #octa-col-90-1 .octa-col__item__link_1 a,
    ::-webkit-file-upload-button
  ):disabled:hover {
  color: var(--color-black);
}

a:has(i) {
  text-decoration: none !important;
}

main {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

main section#wrapper {
  flex-grow: 1;
  margin-bottom: 0 !important;
  overflow: hidden;
}

a {
  color: var(--color-orange);
  text-decoration: underline;
}

a:is(:hover, :focus, :active) {
  color: var(--color-grey);
  text-decoration: none;
}

img {
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}

label input[role="switch"] {
  opacity: 0;
}

.switch {
  padding: 7px;
  border-radius: 10px;
  transition: all 0.2s ease-in-out;
  outline: 2px solid transparent;
  outline-offset: 2px;
  width: 100%;
  margin: 0;
}

.switch .label {
  font-size: var(--font-size-h4);
  color: var(--color-grey);
  line-height: 1.2;
  font-family: var(--font-family-gantari);
}

.switch.focus {
  outline: 2px solid var(--color-orange);
}

label input[role="switch"] ~ .state {
  display: inline-flex;
  align-items: stretch;
  user-select: none;
  width: 40px;
  height: 18px;
  background-color: var(--color-grey);
  border-radius: 11px;
  border: 3px solid var(--color-grey);
}

label input[role="switch"]:checked ~ .state {
  background-color: var(--color-orange);
  border-color: var(--color-orange);
}

label input[role="switch"] ~ .state > .switch-container {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

label input[role="switch"] ~ .state > .switch-container > .position {
  position: relative;
  display: inline-block;
  border-radius: 999px;
  width: 12px;
  height: 12px;
  background: var(--color-white);
  left: 0;
  min-width: 12px;
  transform: translate(0, 0);
  transition: all 0.2s ease-in-out;
}

label input[role="switch"]:checked ~ .state > .switch-container > .position {
  left: 100%;
  transform: translate(-100%, 0);
  transition: all 0.2s ease-in-out;
}

.bg-success {
  background-color: var(--color-orange) !important;
}

.alert-danger {
  color: var(--color-orange);
  background-color: hsla(var(--value-color-orange), 0.1);
  border-color: var(--color-orange);
}

.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--color-orange);
  border-color: var(--color-orange);
}

.accordion button {
  background: var(--color-orange);
  display: flex;
  justify-content: center;
  align-items: center;
  width: max-content;
  justify-self: flex-end;
  padding-inline: 25px;
}

.active > .nav-link-style,
.nav-link-style.active,
.nav-link-style:is(:hover, :focus, :active) {
  color: var(--color-orange);
}

.page-customer-account .nav-link-style {
  text-decoration: none;
}

.alert ul {
  margin-bottom: 0;
}

.text-primary,
.text-danger,
.widget-cart-item .close:is(:hover, :focus, :active),
.text-accent {
  color: var(--color-orange) !important;
}

.widget-product-title > a {
  color: var(--color-grey) !important;
}

.modal-quick-view .modal-dialog {
  max-width: 400px !important;
}

.modal-quick-view .modal-content {
  border-radius: 40px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.btn-primary.btn-shadow,
.cz-slider-content a.btn-shadow {
  box-shadow: 0 0.5rem 1.125rem -0.5rem var(--color-orange-50);
}

/* Radio field */

.radio-container:has(.custom-radio) {
  gap: 24px;
}

.custom-radio {
  padding-left: 0; /* Adjust the padding value as needed */
}

.custom-radio .custom-control-label::before,
.custom-radio .custom-control-label::after {
  display: none;
}

.custom-radio label {
  background-color: var(--color-orange-50);
  color: var(--color-grey);
  font-family: var(--font-family-gantari);
  padding: 8px 27px;
  border-radius: 20px;
  line-height: 1;
  font-size: var(--font-size-btn);
  outline: 2px solid transparent;
  outline-offset: 2px;
  transition: all 0.2s ease-in-out;
}

.custom-radio label:hover {
  background-color: var(--color-grey);
  color: var(--color-white);
}

.custom-radio input:focus-visible + label,
.address-selector .custom-radio label {
  outline: 2px solid var(--color-orange);
  outline-offset: 2px;
}

.address-selector .custom-radio label {
  background: none;
}

.custom-radio input:checked + label {
  background-color: var(--color-orange-50) !important;
}

.page-order .active_map > .row {
  justify-content: center;
}

.delivery-option label > span {
  font-size: 1.125rem;
  color: var(--color-grey) !important;
  text-transform: uppercase;
}

/* number input */

.form-control[type="number"]::-webkit-inner-spin-button {
  display: none;
}

.form-control[type="number"] {
  color: var(--color-grey);
  font-family: var(--font-family-gantari);
  font-size: var(--font-size-btn);
  line-height: 1;
  border-color: var(--color-orange);
  outline: 2px solid transparent;
  outline-offset: 2px;
  border-radius: 50px;
  text-align: center;
  padding-inline: 40px;
  width: 148px !important;
}

.form-control[type="number"]:focus-visible {
  outline: 2px solid var(--color-orange);
}

.btn-ghost {
  background: none;
  color: var(--color-grey);
}

.btn-circle {
  padding: 10px;
  border-radius: 50%;
  line-height: 0;
  aspect-ratio: 1;
}

.input-group:has(.form-control[type="number"]) {
  align-items: center;
  max-width: 148px;
}

.input-group:has(.form-control[type="number"]) > .form-control:not(:last-child),
.input-group:has(.form-control[type="number"])
  > .custom-select:not(:last-child) {
  border-radius: 50px !important;
}

.input-button {
  font-size: 1.875rem;
  font-family: var(--font-family-gantari);
  position: absolute;
  z-index: 3;
}

.input-button-plus {
  right: 7px;
}

.input-button-minus {
  left: 7px;
}

.page-index .row {
  margin-inline: 0;
}

.page-index .col-1,
.page-index .col-2,
.page-index .col-3,
.page-index .col-4,
.page-index .col-5,
.page-index .col-6,
.page-index .col-7,
.page-index .col-8,
.page-index .col-9,
.page-index .col-10,
.page-index .col-11,
.page-index .col-12,
.page-index .col,
.page-index .col-auto,
.page-index .col-sm-1,
.page-index .col-sm-2,
.page-index .col-sm-3,
.page-index .col-sm-4,
.page-index .col-sm-5,
.page-index .col-sm-6,
.page-index .col-sm-7,
.page-index .col-sm-8,
.page-index .col-sm-9,
.page-index .col-sm-10,
.page-index .col-sm-11,
.page-index .col-sm-12,
.page-index .col-sm,
.page-index .col-sm-auto,
.page-index .col-md-1,
.page-index .col-md-2,
.page-index .col-md-3,
.page-index .col-md-4,
.page-index .col-md-5,
.page-index .col-md-6,
.page-index .col-md-7,
.page-index .col-md-8,
.page-index .col-md-9,
.page-index .col-md-10,
.page-index .col-md-11,
.page-index .col-md-12,
.page-index .col-md,
.page-index .col-md-auto,
.page-index .col-lg-1,
.page-index .col-lg-2,
.page-index .col-lg-3,
.page-index .col-lg-4,
.page-index .col-lg-5,
.page-index .col-lg-6,
.page-index .col-lg-7,
.page-index .col-lg-8,
.page-index .col-lg-9,
.page-index .col-lg-10,
.page-index .col-lg-11,
.page-index .col-lg-12,
.page-index .col-lg,
.page-index .col-lg-auto,
.page-index .col-xl-1,
.page-index .col-xl-2,
.page-index .col-xl-3,
.page-index .col-xl-4,
.page-index .col-xl-5,
.page-index .col-xl-6,
.page-index .col-xl-7,
.page-index .col-xl-8,
.page-index .col-xl-9,
.page-index .col-xl-10,
.page-index .col-xl-11,
.page-index .col-xl-12,
.page-index .col-xl,
.page-index .col-xl-auto {
  padding-inline: 0;
}

:is([class*="dark"], [class*="grey"]) * {
  color: #fff !important;
}

.header-nav i {
  color: currentColor !important;
}

/* #endregion */

/* #region Text editor */

.ql-align-center {
  text-align: center;
}

/* #endregion */

/* #region Header */
/*#header .topbar{
background-color: red !important;
}

#header.is-pinned .topbar{
background-color: orange !important;
}*/

#header.is-pinned .topbar {
  opacity: 0;
  overflow: hidden;
  visibility: hidden !important;
  transform: translateY(-40px);
  max-height: 0;
  height: 0;
  padding: 0;
  transition: opacity 0.4s ease, transform 0.5s ease, max-height 0.5s ease;
}

.topbar {
  padding-inline: 3.125vw;
  padding-block: 16px;
  opacity: 1;
  position: relative;
  z-index: 1; /* Plus bas que le contenu principal */
  transition: opacity 0.4s ease, transform 0.5s ease, max-height 0.5s ease;

  [data-id-prettyblocks="39"],
  [data-prettyblocks-zone="displayNavMiddle"] {
    width: 100%;
  }

  & * {
    margin: 0;
    color: #fff;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1;
  }

  & a {
    all: unset;
    cursor: pointer;

    &:hover,
    &:focus,
    &:active {
      text-decoration: underline;
    }
  }

  & p {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 10px;

    &::before {
      margin-top: 3px;
      position: relative;
    }
  }

  & #octa-row-39 .octa-col {
    position: relative;

    &:not(:last-child)::after {
      content: "";
      position: absolute;
      right: 0;
      width: 1px;
      background-color: #fff;
      height: 30px;
      top: 50%;
      transform: translateY(-50%);
    }
  }
}

#octa-col-39-1 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDE2IDIyIiBmaWxsPSJub25lIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMTU2XzEzOSkiPgogICAgPHBhdGggZD0iTTEyLjM3MDMgMC4wNDUxNjZIMy44NzAzMUMxLjkxMDMxIDAuMDQ1MTY2IDAuMzIwMzEyIDEuNjM1MTcgMC4zMjAzMTIgMy41OTUxN1YxOC40MTUyQzAuMzIwMzEyIDIwLjM3NTIgMS45MTAzMSAyMS45NjUyIDMuODcwMzEgMjEuOTY1MkgxMi4zNzAzQzE0LjMzMDMgMjEuOTY1MiAxNS45MjAzIDIwLjM3NTIgMTUuOTIwMyAxOC40MTUyVjMuNTk1MTdDMTUuOTIwMyAxLjYzNTE3IDE0LjMzMDMgMC4wNDUxNjYgMTIuMzcwMyAwLjA0NTE2NlpNMi42MjAzMSAzLjU5NTE3QzIuNjIwMzEgMi45MDUxNyAzLjE4MDMxIDIuMzQ1MTcgMy44NzAzMSAyLjM0NTE3SDEyLjM3MDNDMTMuMDYwMyAyLjM0NTE3IDEzLjYyMDMgMi45MDUxNyAxMy42MjAzIDMuNTk1MTdWMTguNDE1MkMxMy42MjAzIDE5LjEwNTIgMTMuMDYwMyAxOS42NjUyIDEyLjM3MDMgMTkuNjY1MkgzLjg3MDMxQzMuMTgwMzEgMTkuNjY1MiAyLjYyMDMxIDE5LjEwNTIgMi42MjAzMSAxOC40MTUyVjMuNTk1MTdaIiBmaWxsPSJ3aGl0ZSIvPgogICAgPHBhdGggZD0iTTkuMTU5OTIgMTguNDI1Mkg3LjA2OTkyQzYuNDI5OTIgMTguNDI1MiA1LjkxOTkyIDE3LjkwNTIgNS45MTk5MiAxNy4yNzUyQzUuOTE5OTIgMTYuNjM1MiA2LjQyOTkyIDE2LjEyNTIgNy4wNjk5MiAxNi4xMjUySDkuMTU5OTJDOS43OTk5MiAxNi4xMjUyIDEwLjMwOTkgMTYuNjM1MiAxMC4zMDk5IDE3LjI3NTJDMTAuMzA5OSAxNy45MTUyIDkuNzk5OTIgMTguNDI1MiA5LjE1OTkyIDE4LjQyNTJaIiBmaWxsPSJ3aGl0ZSIvPgogIDwvZz4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcDBfMTU2XzEzOSI+CiAgICAgIDxyZWN0IHdpZHRoPSIxNS41OSIgaGVpZ2h0PSIyMS45MSIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMzIwMzEyIDAuMDQ1MTY2KSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+Cjwvc3ZnPg==");
}

#octa-col-39-2 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMyIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDIzIDE4IiBmaWxsPSJub25lIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMTU2XzEyOCkiPgogICAgPHBhdGggZD0iTTE5LjEzMDIgMC4zODUwMUg0LjM5MDE2QzIuNDcwMTYgMC4zODUwMSAwLjkxMDE1NiAxLjk0NTAxIDAuOTEwMTU2IDMuODY1MDFWMTIuNDg1QzAuOTEwMTU2IDE1LjMxNSAzLjIxMDE2IDE3LjYyNSA2LjA1MDE2IDE3LjYyNUgxNy40NzAyQzIwLjMwMDIgMTcuNjI1IDIyLjYxMDIgMTUuMzI1IDIyLjYxMDIgMTIuNDg1VjMuODY1MDFDMjIuNjEwMiAxLjk0NTAxIDIxLjA1MDIgMC4zODUwMSAxOS4xMzAyIDAuMzg1MDFaTTE4LjU1MDIgMi42ODUwMUwxMi44OTAyIDkuMTc1MDFDMTIuNjAwMiA5LjUwNTAxIDEyLjIwMDIgOS42ODUwMSAxMS43NjAyIDkuNjg1MDFDMTEuMzIwMiA5LjY4NTAxIDEwLjkyMDIgOS41MDUwMSAxMC42MzAyIDkuMTc1MDFMNC45NjAxNiAyLjY4NTAxSDE4LjU1MDJaTTE3LjQ3MDIgMTUuMzE1SDYuMDUwMTZDNC40OTAxNiAxNS4zMTUgMy4yMTAxNiAxNC4wNDUgMy4yMTAxNiAxMi40NzVWNC4xNzUwMUw4Ljg5MDE2IDEwLjY4NUM5LjYxMDE2IDExLjUxNSAxMC42NjAyIDExLjk4NSAxMS43NTAyIDExLjk4NUMxMi44NDAyIDExLjk4NSAxMy44OTAyIDExLjUxNSAxNC42MTAyIDEwLjY4NUwyMC4yOTAyIDQuMTc1MDFWMTIuNDc1QzIwLjI5MDIgMTQuMDM1IDE5LjAyMDIgMTUuMzE1IDE3LjQ1MDIgMTUuMzE1SDE3LjQ3MDJaIiBmaWxsPSJ3aGl0ZSIvPgogIDwvZz4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcDBfMTU2XzEyOCI+CiAgICAgIDxyZWN0IHdpZHRoPSIyMS42OSIgaGVpZ2h0PSIxNy4yMyIgZmlsbD0id2hpdGUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuOTEwMTU2IDAuMzg1MDEpIi8+CiAgICA8L2NsaXBQYXRoPgogIDwvZGVmcz4KPC9zdmc+");
}

#octa-col-39-3 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDE4IDIyIiBmaWxsPSJub25lIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMTU2XzE0NCkiPgogICAgPHBhdGggZD0iTTkuMDcwNTkgMC42NzUwNDlDNC40MDA1OSAwLjY3NTA0OSAwLjYwMDU4NiA0LjQ3NTA1IDAuNjAwNTg2IDkuMTQ1MDVDMC42MDA1ODYgMTIuMjY1IDQuMDEwNTkgMTYuOTM1IDYuODgwNTkgMjAuMzE1QzcuNDMwNTkgMjAuOTU1IDguMjIwNTkgMjEuMzI1IDkuMDcwNTkgMjEuMzI1QzkuOTIwNTkgMjEuMzI1IDEwLjcxMDYgMjAuOTU1IDExLjI2MDYgMjAuMzE1QzE0LjEyMDYgMTYuOTM1IDE3LjU0MDYgMTIuMjY1IDE3LjU0MDYgOS4xNDUwNUMxNy41NDA2IDQuNDc1MDUgMTMuNzQwNiAwLjY3NTA0OSA5LjA3MDU5IDAuNjc1MDQ5Wk05LjUwMDU5IDE4LjgyNUM5LjM1MDU5IDE5LjAwNSA5LjE2MDU5IDE5LjAyNSA5LjA2MDU5IDE5LjAyNUM4Ljk2MDU5IDE5LjAyNSA4Ljc3MDU5IDE4Ljk5NSA4LjYyMDU5IDE4LjgyNUM1LjAzMDU5IDE0LjU5NSAyLjg5MDU5IDEwLjk3NSAyLjg5MDU5IDkuMTQ1MDVDMi44OTA1OSA1Ljc0NTA1IDUuNjYwNTkgMi45NzUwNSA5LjA2MDU5IDIuOTc1MDVDMTIuNDYwNiAyLjk3NTA1IDE1LjIzMDYgNS43NDUwNSAxNS4yMzA2IDkuMTQ1MDVDMTUuMjMwNiAxMC45NzUgMTMuMDkwNiAxNC41OTUgOS41MDA1OSAxOC44MjVaIiBmaWxsPSJ3aGl0ZSIvPgogICAgPHBhdGggZD0iTTkuMDcwMzEgMTAuNTQ1MkMxMC4wMzY4IDEwLjU0NTIgMTAuODIwMyA5Ljc2MTY2IDEwLjgyMDMgOC43OTUxN0MxMC44MjAzIDcuODI4NjcgMTAuMDM2OCA3LjA0NTE3IDkuMDcwMzEgNy4wNDUxN0M4LjEwMzgxIDcuMDQ1MTcgNy4zMjAzMSA3LjgyODY3IDcuMzIwMzEgOC43OTUxN0M3LjMyMDMxIDkuNzYxNjYgOC4xMDM4MSAxMC41NDUyIDkuMDcwMzEgMTAuNTQ1MloiIGZpbGw9IndoaXRlIi8+CiAgPC9nPgogIDxkZWZzPgogICAgPGNsaXBQYXRoIGlkPSJjbGlwMF8xNTZfMTQ0Ij4KICAgICAgPHJlY3Qgd2lkdGg9IjE2Ljk0IiBoZWlnaHQ9IjIwLjY1IiBmaWxsPSJ3aGl0ZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC42MDA1ODYgMC42NzUwNDkpIi8+CiAgICA8L2NsaXBQYXRoPgogIDwvZGVmcz4KPC9zdmc+");
}

#octa-col-39-4 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDI0IDIwIiBmaWxsPSJub25lIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMTU2XzE0OSkiPgogICAgPHBhdGggZD0iTTEyLjExIDE5LjU0MDJDMTEuMjMgMTkuNTQwMiAxMC40MSAxOS4yMDAyIDkuNzkwMDQgMTguNTgwMkwyLjM3MDA0IDExLjE3MDJDLTAuMDY5OTYxIDguNzIwMjEgLTAuMDY5OTYxIDQuNzQwMjEgMi4zNzAwNCAyLjMwMDIxQzMuNTUwMDQgMS4xMTAyMSA1LjEzMDA0IDAuNDYwMjA1IDYuODEwMDQgMC40NjAyMDVDOC40OTAwNCAwLjQ2MDIwNSAxMC4wNiAxLjExMDIxIDExLjI1IDIuMzAwMjFMMTIuMTEgMy4xNjAyMUwxMi44OCAyLjM5MDIxQzE1LjM2IC0wLjA4OTc5NSAxOS4zNyAtMC4xMzk3OTUgMjEuODIgMi4yNzAyMUMyMy4wMiAzLjQ2MDIxIDIzLjY4IDUuMDQwMjEgMjMuNjggNi43MzAyMUMyMy42OCA4LjQyMDIxIDIzLjAzIDkuOTgwMjEgMjEuODQgMTEuMTcwMkwxNC40MyAxOC41ODAyQzEzLjgxIDE5LjIwMDIgMTIuOTkgMTkuNTQwMiAxMi4xMSAxOS41NDAyWk02LjgxMDA0IDIuNzYwMjFDNS43NTAwNCAyLjc2MDIxIDQuNzUwMDQgMy4xNzAyMSA0LjAwMDA0IDMuOTIwMjFDMi40NTAwNCA1LjQ3MDIxIDIuNDUwMDQgNy45OTAyIDQuMDAwMDQgOS41NDAyMUwxMS40MiAxNi45NTAyQzExLjc5IDE3LjMyMDIgMTIuNDQgMTcuMzIwMiAxMi44MSAxNi45NTAyTDIwLjIyIDkuNTQwMjFDMjAuOTcgOC43OTAyMSAyMS4zOCA3Ljc5MDIxIDIxLjM4IDYuNzMwMjFDMjEuMzggNS42NzAyMSAyMC45NiA0LjY2MDIgMjAuMiAzLjkwMDIxQzE4LjY1IDIuMzcwMjEgMTYuMSAyLjQyMDIgMTQuNTEgNC4wMTAyMUwxMi4xMSA2LjQxMDJMOS42MjAwNCAzLjkyMDIxQzguODcwMDQgMy4xNzAyMSA3Ljg3MDA0IDIuNzYwMjEgNi44MTAwNCAyLjc2MDIxWiIgZmlsbD0id2hpdGUiLz4KICA8L2c+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAwXzE1Nl8xNDkiPgogICAgICA8cmVjdCB3aWR0aD0iMjMuMTQiIGhlaWdodD0iMTkuMDgiIGZpbGw9IndoaXRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjU0MDAzOSAwLjQ2MDIwNSkiLz4KICAgIDwvY2xpcFBhdGg+CiAgPC9kZWZzPgo8L3N2Zz4=");
}

.breadcrumb-item {
  font-size: 1.3125rem;
  font-family: var(--font-family-space-grotesk);
  text-underline-offset: 0.2em;
  font-weight: 700;

  &:not(:first-child) {
    padding-left: 1rem !important;
  }

  & a {
    text-decoration: none;

    &:hover {
      text-decoration: underline;
    }
  }

  & a,
  &.active span {
    color: var(--color-orange);
  }

  & + .breadcrumb-item::before {
    color: var(--color-orange);
    font-size: 1.375rem;
    font-weight: 700;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding-right: 1rem;
    font-family: var(--font-family-space-grotesk);
    content: ">";
  }
}

#header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  transition: transform 0.5s ease;
  opacity: 1;
  transform: translateY(0);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  z-index: 50;

  &.hidden {
    transform: translateY(-100%);
    opacity: 0;
  }

  &.is-pinned {
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    transition: all 0.5s ease;
    transform: translateY(0);
    opacity: 1;
  }

  & .ets_mm_megamenu {
    background: none !important;
  }

  & .ets_mm_megamenu .ets_mm_megamenu_content,
  &
    .layout_layout1:not(.ybc_vertical_menu):not(.click_open_submenu)
    .mm_menus_li:hover
    > a,
  &
    .layout_layout1:not(.ybc_vertical_menu).click_open_submenu
    .mm_menus_li.open_li
    > a,
  & .layout_layout1:not(.ybc_vertical_menu) .mm_menus_li.menu_hover > a,
  & .ets_mm_megamenu.layout_layout1.ybc_vertical_menu:hover,
  &
    .layout_layout1:not(.ybc_vertical_menu):not(.click_open_submenu)
    .mm_menus_li:hover
    > a,
  &
    .layout_layout1:not(.ybc_vertical_menu).click_open_submenu
    .mm_menus_li.open_li
    > a,
  & .layout_layout1:not(.ybc_vertical_menu) .mm_menus_li.menu_hover > a,
  & .ets_mm_megamenu.layout_layout1.ybc_vertical_menu:hover {
    background: none !important;
    border: none;
  }

  & .ets_mm_megamenu {
    margin: 0;
    &.bg_submenu[data-bggray="bg_gray"]:before {
      display: none;
    }

    & .mm_menu_content_title {
      min-height: unset;
      line-height: 1;
      padding-top: 2px;
    }

    & .mm_menus_ul {
      list-style-type: none;
    }
    & .mm_menus_li {
      border: none;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;

      &::before {
        content: "";
        position: absolute;
        inset: 0;
        background-color: #37383a;
        display: block;
        clip-path: polygon(22px 0, 100% 0, calc(100% - 22px) 100%, 0% 100%);
        opacity: 0;
        transition: opacity 0.3s ease-in-out;
      }

      &.active::after {
        content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMSIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDIxIDIyIiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNOS4yNjA4MSAyLjkxMjc3TDEzLjAzNzMgMi45MTI3N0w0LjAxMTYyIDE5LjYxNTlMMC4wMDAxNzc0MjIgMTkuNjE1OUw5LjI2MDgxIDIuOTEyNzdaIiBmaWxsPSIjRjU1MTM5Ii8+CiAgPHBhdGggZD0iTTE2LjI4MDMgMi43Mjg5M0wyMC4wNTY4IDIuNzI4OTNMMTEuMDMxMiAxOS40MzIxTDcuMDE5NzEgMTkuNDMyMUwxNi4yODAzIDIuNzI4OTNaIiBmaWxsPSIjRjU1MTM5Ii8+Cjwvc3ZnPg==");
        position: absolute;
        left: -4px;
        top: 50%;
        transform: translateY(-50%);
        width: 20px;
        height: 22px;
      }

      &:hover&::before {
        opacity: 1;
      }

      &.active::before {
        opacity: 1;
      }
    }

    & .ets_mm_megamenu_content_content {
      width: 100%;
    }

    & .ets_mm_megamenu_content_content > ul {
      display: flex;
      gap: 5px;
      justify-content: space-between;
      padding: 0;

      @media screen and (max-width: 1300px) {
        flex-wrap: wrap;
      }
    }

    & .mm_menus_li a {
      font-size: 1.125rem !important;
      padding-block: 10px;
      padding-inline: 25px;
      line-height: 1;
    }

    & .mm_menus_li ul a {
      color: #1e1f22 !important;
      font-size: 1.125rem !important;
      font-weight: 500;
      line-height: 1.4;
      padding-block: 8px;
      padding-inline: 35px;
      display: inline-block;
      width: 100%;
    }

    & .mm_menus_li ul a:is(:focus, :hover, :active) {
      color: var(--color-orange) !important;
    }

    & .mm_block_type_image .ets_mm_block_content > a span {
      overflow: hidden;
    }

    & .mm_columns_ul {
      width: max-content !important;
      max-width: 100vw !important;
      border: none;
      border-radius: 0;
      list-style-type: none;
      padding-block: 12px;
      padding-inline: 0;
      --gap: 32px;
      gap: var(--gap);
      justify-content: space-between;
      background-repeat: repeat;
      box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.15);

      & .column_size_6 {
        width: calc(50% - (var(--gap) / 2));
      }

      & .column_size_4 {
        width: calc(33.3333% - (var(--gap) / 3));
      }

      & .column_size_3 {
        width: calc(25% - (var(--gap) / 4));
      }

      & .column_size_2 {
        width: calc(16.6667% - (var(--gap) / 6));
      }

      & .column_size_1 {
        width: calc(8.3333% - (var(--gap) / 12));
      }

      & .column_size_11 {
        width: calc(91.6667% - (var(--gap) / 11));
      }

      & .column_size_10 {
        width: calc(83.3333% - (var(--gap) / 10));
      }
      & .column_size_9 {
        width: calc(75% - (var(--gap) / 9));
      }
      & .column_size_8 {
        width: calc(66.6667% - (var(--gap) / 8));
      }
      & .column_size_7 {
        width: calc(58.3333% - (var(--gap) / 7));
      }

      & .column_size_5 {
        width: calc(41.6667% - (var(--gap) / 5));
      }
    }

    & span.h4 {
      border: none;
      font-size: 1.25rem !important;
      padding: 0;
    }

    &span.h4 a {
      color: var(--color-orange) !important;
    }

    & .ets_mm_block_content ul li a::before {
      display: none !important;
    }

    & .mm_blocks_li {
      padding: 0;
      margin: 0;
    }

    & .mm_blocks_ul {
      display: flex;
      flex-direction: column;
      gap: 25px;
    }

    & .mm_columns_ul:before {
      display: none;
    }

    & .ets_mm_categories {
      list-style-type: none;
      display: flex;
      flex-direction: column;
    }

    & .container {
      padding: 0;
    }

    & * {
      text-transform: none;
      font-weight: 400;
    }
    & .mm_arrow::after {
      all: unset;
      content: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDE1IDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMi45Mzk1IDBMNy41IDUuMTIwNTlMMi4wNjA1MSAwTDAgMS45Mzk3MUw3LjUgOUwxNSAxLjkzOTcxTDEyLjkzOTUgMFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=");
    }
  }
  &
    .layout_layout1:not(.ybc_vertical_menu):not(.click_open_submenu)
    .mm_menus_li
    > a:before,
  &
    .layout_layout1:not(.ybc_vertical_menu).click_open_submenu
    .mm_menus_li.open_li
    > a:before,
  & .layout_layout1.ybc_vertical_menu:hover .ybc-menu-vertical-button:before,
  &
    .layout_layout1:hover
    .ybc-menu-vertical-button
    .ybc-menu-button-toggle_icon_default
    .icon-bar,
  & .ybc-menu-vertical-button.layout_layout1:hover {
    display: none;
  }
  & .layout_layout1:not(.click_open_submenu) .mm_menus_li:hover > a,
  & .layout_layout1.click_open_submenu .mm_menus_li.open_li > a,
  & .layout_layout1 .mm_menus_li.active > a,
  & .layout_layout1:not(.click_open_submenu) .mm_menus_li:hover > a,
  & .layout_layout1.click_open_submenu .mm_menus_li.open_li > a,
  & .layout_layout1 .mm_menus_li.menu_hover > a,
  & .layout_layout1:hover .ybc-menu-vertical-button,
  & .layout_layout1 .mm_extra_item button[type="submit"]:hover i,
  & .layout_layout1 .mm_menus_li.active > a {
    background: none;
  }

  & .layout_layout1:not(.click_open_submenu) .mm_menus_li:hover > a:after,
  & .layout_layout1.click_open_submenu .mm_menus_li.open_li > a:after,
  & .layout_layout1 .mm_menus_li.menu_hover > a:after {
    display: none;
  }

  & .layout_layout1:not(.click_open_submenu) .coffee:hover > a:after,
  & .layout_layout1.click_open_submenu .coffee.open_li > a:after,
  & .layout_layout1 .coffee.menu_hover > a:after {
    bottom: 0 !important;
  }

  & .mm_menu_content_title {
    padding: 0;
    color: #fff !important;
  }
}

.header-top,
.breadcrumb-container {
  width: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  padding-inline: max(4.166666667vw, 25px);
  gap: max(2.125vw, 20px);
  padding-block: 8px;
}

.breadcrumb-container {
  padding-block: 10px;
  box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.15);
}

@media screen and (max-width: 1900px) {
  #social-links {
    top: 65dvh !important;
  }
}

@media screen and (max-width: 1550px) {
  #octa-row-39 {
    --flex: grid !important;
    --justify: center !important;
    --gap: 20px !important;
    grid-template-columns: 1fr 1fr;

    & .octa-col:not(:last-child)::after {
      display: none;
    }
  }
}

@media screen and (max-width: 1200px) {
  .changestatus .ybc-menu-toggle {
    display: flex;
    justify-content: flex-end;
  }
}

@media screen and (max-width: 1024px) {
  #octa-row-39 {
    --flex: flex !important;
    --direction: column !important;
  }
}

@media screen and (max-width: 992px) {
  .ybc-menu-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px;
    aspect-ratio: 1;
  }

  .ybc-menu-button-toggle_icon,
  .ets_mm_megamenu.hook-custom {
    margin: 0 !important;
  }

  .navbar-menu .nav-link {
    font-size: var(--font-size-h4);
  }

  .mm_menus_ul {
    opacity: 0;
    padding: 15px;
    visibility: hidden;
    transform: translateY(-100%);
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column;
    gap: 0 !important;
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(10px);
    position: fixed;
    inset: 0;
    height: 100dvh;
    z-index: 1000;
    overflow-y: auto;
    transition: all 0.3s ease-in-out;
  }

  #header .ets_mm_megamenu .mm_columns_ul {
    height: 100dvh;
    overflow-y: auto;
  }

  .ets_mm_megamenu .mm_columns_ul {
    flex-wrap: nowrap;
  }

  .mm_menus_ul.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: all 0.3s ease-in-out;
  }

  #header li.close_menu {
    background: none !important;
    color: var(--color-orange);
    margin-top: 50px;
  }

  #header li .arrow {
    display: none;
  }

  #header .mm_menu_content_title {
    color: var(--color-orange) !important;
  }

  #header .ets_mm_megamenu_content_content .mm_menus_li a,
  #header .ets_mm_megamenu_content_content .mm_menus_li ul a,
  .close_menu {
    font-size: min(5vw, 2rem) !important;
    color: var(--color-orange) !important;
  }

  .transition_floating .close_menu *,
  .transition_full .close_menu *,
  .ybc-menu-vertical-button .icon-bar {
    color: var(--color-orange) !important;
  }

  #header li .mm_menus_back_icon {
    border-color: var(--color-orange) !important;
    margin-bottom: 4px;
  }

  #header .ets_mm_megamenu_content li.mm_menus_li {
    width: fit-content !important;
    max-width: 100% !important;
  }

  #header .ets_mm_megamenu .mm_arrow::after {
    content: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDE1IDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMi45Mzk1IDBMNy41IDUuMTIwNTlMMi4wNjA1MSAwTDAgMS45Mzk3MUw3LjUgOUwxNSAxLjkzOTcxTDEyLjkzOTUgMFoiIGZpbGw9IiNGNTUxMzkiLz4KPC9zdmc+Cg==");
  }

  :is(html, body):has(
      .navbar-menu[aria-expanded="true"],
      #search_widget[aria-expanded="true"],
      .mm_menus_ul.active
    ) {
    overflow: hidden;
  }

  .navbar-menu[aria-expanded="true"] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    height: 100vh;
    transition: all 0.3s ease-in-out;
  }

  .navbar-nav {
    width: 100%;
    align-items: flex-end;
  }

  .navbar-nav :is(.nav-item, div) {
    width: 100%;
    text-align: center;
  }

  .navbar-light .navbar-nav a {
    font-size: 5vw !important;
  }

  .responsive-menu__navbar-brand {
    margin-right: 0 !important;
    max-width: 150px;
  }
  #octa-row-28 {
    margin-right: 0 !important;
  }
  #header .ets_mm_megamenu .mm_columns_ul {
    background-color: #fff !important;
    padding: 20px;
    position: fixed;
    display: flex !important;
    inset: 0;
    margin-top: 0;
    border-radius: 0;
    padding-bottom: 100px;
    flex-direction: column;
    width: 100% !important;
    align-items: center !important;
    justify-content: flex-start;
  }

  #header .ets_mm_megamenu a {
    font-size: 3vw !important;
    color: var(--color-orange) !important;
  }

  #header .ets_mm_megamenu .mm_columns_ul:not(.active) {
    display: none !important;
  }

  #header .ets_mm_megamenu {
    text-align: center;
  }

  #header .ets_mm_megamenu .mm_columns_ul > * {
    margin-bottom: auto;
  }

  .ets_mm_categories {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  #header .ets_mm_megamenu .mm_columns_li {
    width: 100% !important;
  }

  #header .ets_mm_megamenu .mm_columns_ul .btn {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 20px;
    width: 80%;
  }
  #header .ets_mm_megamenu .mm_columns_li:last-child {
    margin-bottom: auto;
  }
  #header .mm_block_type_image {
    display: none;
  }

  #social-links {
    top: 75dvh !important;
  }
}

@media screen and (max-width: 767px) {
  .ets_mm_megamenu .container {
    background: none;
  }
}

@media screen and (max-width: 703px) {
  .brands {
    order: -1;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    height: auto;
    transition: opacity 0.3s ease;

    & img {
      width: fit-content;
    }
  }

  #header.is-pinned .brands {
    opacity: 0;
    height: 0;
    transition: none;
  }

  #header.is-pinned .header-top {
    row-gap: 0;
  }
}

@media screen and (max-width: 500px) {
  .navbar-brand {
    flex-shrink: 1 !important;
    max-width: 50vw;
  }
}

/* #endregion Header */

/* #region Global */

body:not(.page-index, .page-product, .page-cms) #content-wrapper {
  padding-inline: max(25px, 4.166666667vw);
}

.page-content.page-not-found {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 20px;
}

[data-component="disclosure"] > div {
  height: 0;
  visibility: hidden;
  opacity: 0;

  &.opened {
    height: auto;
    visibility: visible;
    opacity: 1;
    animation: fadeIn 0.4s ease forwards;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

label:not(.form-check-label):not(.custom-control-label):not(
    .custom-file-label
  ):not(.custom-option-label) {
  color: #1e1f22;
  font-size: 1.3125rem;
  font-weight: 500;
  line-height: 1.74;
}

#js-product-list-top label {
  margin-right: 40px !important;
}

.custom-select {
  display: flex;
  min-width: 279px;
  height: 66px;
  padding: 18px 20px;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  border-radius: 0;
  border: 2px solid var(--color-orange);
  color: #1e1f22;
  font-size: 1.3125rem;
  font-weight: 500;
  line-height: 1;
  position: relative;
  outline: 2px solid transparent;
  outline-offset: 2px;

  &:focus-visible,
  &:focus-within {
    color: #1e1f22;
    border-color: var(--color-orange);
    outline-color: var(--color-orange);
  }
}

.form-control,
.custom-file-input,
textarea.form-control {
  display: flex;
  min-width: 279px;
  height: 66px;
  padding: 18px 20px;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;

  border-radius: 0;
  border: 2px solid var(--color-orange);
  color: #1e1f22;
  font-size: 1.3125rem;
  font-weight: 500;
  line-height: 1;

  position: relative;
  outline: 2px solid transparent;
  outline-offset: 2px;
  background-color: #fff;
  box-shadow: none;
}

/* Textarea → hauteur différente */
textarea.form-control {
  height: auto;
  min-height: 120px;
  resize: vertical;
  padding: 18px 20px;
}

/* Champ fichier harmonisé */
.custom-file {
  position: relative;
  display: flex;
  width: 100%;
}

.custom-file-input {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.custom-file-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;

  height: 66px;
  padding: 18px 20px;

  border: 2px solid var(--color-orange);
  border-radius: 0;

  font-size: 1.3125rem;
  font-weight: 500;
  color: #1e1f22;
  background-color: #fff;
  cursor: pointer;
}

.custom-file-label::after {
  height: 100%;
  line-height: 2;
  background-color: var(--color-orange);
  color: #fff;
  border-radius: 0;
}

/* États focus */
.form-control:focus,
.custom-file-input:focus,
textarea.form-control:focus,
.custom-select:focus {
  border-color: var(--color-orange);
  outline: 2px solid var(--color-orange);
  outline-offset: 2px;
  box-shadow: none;
}

/* Placeholder */
::placeholder {
  color: #999;
  font-weight: 400;
  opacity: 1;
}

input[type="checkbox"] {
  accent-color: var(--color-orange);
  width: 1rem;
  height: 1rem;
}

.octa_category-carousel__glide-arrows {
  display: flex;
  justify-content: flex-end;
  gap: 28px;
  padding-inline: 8.33333vw;
  padding-block: 2.166666667vw;

  & button {
    all: unset;
    position: relative;
    background-color: var(--color-orange);
    color: #fff;
    border-radius: 9999px;
    width: 70px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    outline-offset: 2px;
    outline: 2px solid transparent;
    transition: background-color 0.3s ease;

    &:focus-visible {
      outline: 2px solid var(--color-orange);
    }

    &:active,
    &:hover {
      background-color: var(--color-grey);
    }
  }
}

.pagination {
  & .page-link {
    display: flex;
    padding: 8px 9px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: #1e1f22;
    text-align: center;
    font-family: var(--font-family-space-grotesk);
    font-size: 1.875rem;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    border-radius: 0 !important;
    border: none;

    &:hover {
      background-color: var(--color-grey);
      color: #fff;
    }
  }

  li.active .page-link {
    box-shadow: none;
    background-color: var(--color-orange);
  }

  li:not(.prev-page, .next-page) .page-link {
    width: 44px;
    height: 44px;
  }

  li:is(.prev-page, .next-page) .page-link {
    padding: 15px;
  }
}

.badge {
  border-radius: 80px;
  background: var(--color-grey);
  padding-block: 5px;
  padding-inline: 25px;
  color: #fff;
  font-family: var(--font-family-gantari);
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.05em;

  &.badge-danger {
    background: var(--color-orange);
  }
}

.page-title-container {
  justify-content: center;
}

body:not(.page-category, .page-product) .page-title {
  padding-block: 2.604166667vw;
  text-align: center;
}

.g-recaptcha {
  margin-bottom: 25px;
}
.cz-product-gallery {
  flex-direction: column;
}
/* #endregion Global */

/* #region Product miniature */

.product-miniature {
  background: #fff;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
  border-radius: 0;
  transform: none;
  transition: all 0.3s ease;
  padding: 0;
  margin-inline: 17px;

  &:hover {
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.25);
    transform: translateY(-5px) scale(1.02);
  }

  & .product-title {
    color: #37383a;
    font-size: 1.25rem !important;
    font-family: var(--font-family-space-grotesk);
    font-weight: 700;
    line-height: 1.74;
    text-transform: uppercase;
    margin-top: 10px;
    padding-inline: 45px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    & a:hover {
      color: var(--color-orange) !important;
    }
  }

  & .product-date {
    color: #37383a;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.74;
    text-transform: uppercase;
    padding-inline: 45px;
    margin-top: 4px;
    min-height: 20px;
  }

  & .product-price {
    display: flex;
    padding: 5px 45px;
    justify-content: center;
    align-items: center;
    background-color: var(--color-beige);
    color: #1e1f22;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.74;
    gap: 7px;
    min-height: 60px;
  }

  & .product-price__text {
    position: relative;

    & > .regular-price {
      position: absolute;
      top: -20px;
      right: -20px;
      text-decoration: line-through;
      background-color: var(--color-orange);
      color: #fff;
      font-size: 0.9rem;
      line-height: 1.74;
      border-radius: 80px;
      padding: 3px 12px;
    }

    & > .price {
      color: var(--color-orange);
      font-family: var(--font-family-gantari);
      font-size: 1.2rem;
      font-weight: 700;
      line-height: 1.74;
      border-radius: 80px;
      background: #fff;
      padding: 6px 24px;
    }
  }

  & .card-body {
    padding: 0;
  }

  & .description-short {
    padding-inline: 45px;
    color: #1e1f22;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.74;
    margin-top:10px;
  }

  & .btn {
    min-width: 270px;
    margin-block: 30px;
  }
}

/* #endregion Product miniature */

/* #region Footer */

/* Contacts infos */

/* Style pour le conteneur principal */
#octa-row-31 {
  background: #fff;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.12);
  padding-block: 4.166666667vw;
  padding-inline: 8.333333333vw;
  text-align: center;
  margin-top: 5.208333333vw;

  * {
    margin: 0;
  }

  .octa-col {
    position: relative;

    &:not(:last-child)::after {
      content: "";
      position: absolute;
      right: 0;
      width: 1px;
      background-color: #000;
      height: 30px;
      top: 50%;
      transform: translateY(-50%);
    }
  }
}

#octa-row-31 a {
  all: unset;
  cursor: pointer;
  line-height: 1;

  &:hover {
    text-decoration: underline;
  }
}

#octa-row-31 p {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  line-height: 1;
  font-weight: 500;
}

#octa-col-31-1 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIyMyIgdmlld0JveD0iMCAwIDE2IDIzIiBmaWxsPSJub25lIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMTU2Xzk0KSI+CiAgICA8cGF0aCBkPSJNMTIuNDEwNCAwLjU0NDk4M0gzLjkxMDM1QzEuOTUwMzUgMC41NDQ5ODMgMC4zNjAzNTIgMi4xMzQ5OCAwLjM2MDM1MiA0LjA5NDk4VjE4LjkxNUMwLjM2MDM1MiAyMC44NzUgMS45NTAzNSAyMi40NjUgMy45MTAzNSAyMi40NjVIMTIuNDEwNEMxNC4zNzA0IDIyLjQ2NSAxNS45NjA0IDIwLjg3NSAxNS45NjA0IDE4LjkxNVY0LjA5NDk4QzE1Ljk2MDQgMi4xMzQ5OCAxNC4zNzA0IDAuNTQ0OTgzIDEyLjQxMDQgMC41NDQ5ODNaTTIuNjYwMzUgNC4wOTQ5OEMyLjY2MDM1IDMuNDA0OTggMy4yMjAzNSAyLjg0NDk4IDMuOTEwMzUgMi44NDQ5OEgxMi40MTA0QzEzLjEwMDQgMi44NDQ5OCAxMy42NjA0IDMuNDA0OTggMTMuNjYwNCA0LjA5NDk4VjE4LjkxNUMxMy42NjA0IDE5LjYwNSAxMy4xMDA0IDIwLjE2NSAxMi40MTA0IDIwLjE2NUgzLjkxMDM1QzMuMjIwMzUgMjAuMTY1IDIuNjYwMzUgMTkuNjA1IDIuNjYwMzUgMTguOTE1VjQuMDk0OThaIiBmaWxsPSIjMUUxRjIyIi8+CiAgICA8cGF0aCBkPSJNOS4xOTk5NiAxOC45MjVINy4xMDk5NkM2LjQ2OTk2IDE4LjkyNSA1Ljk1OTk2IDE4LjQwNSA1Ljk1OTk2IDE3Ljc3NUM1Ljk1OTk2IDE3LjEzNSA2LjQ2OTk2IDE2LjYyNSA3LjEwOTk2IDE2LjYyNUg5LjE5OTk2QzkuODM5OTYgMTYuNjI1IDEwLjM1IDE3LjEzNSAxMC4zNSAxNy43NzVDMTAuMzUgMTguNDE1IDkuODM5OTYgMTguOTI1IDkuMTk5OTYgMTguOTI1WiIgZmlsbD0iIzFFMUYyMiIvPgogIDwvZz4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcDBfMTU2Xzk0Ij4KICAgICAgPHJlY3Qgd2lkdGg9IjE1LjU5IiBoZWlnaHQ9IjIxLjkxIiBmaWxsPSJ3aGl0ZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4zNjAzNTIgMC41NDQ5ODMpIi8+CiAgICA8L2NsaXBQYXRoPgogIDwvZGVmcz4KPC9zdmc+");
  position: relative;
}

#octa-col-31-2 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMyIgaGVpZ2h0PSIxOSIgdmlld0JveD0iMCAwIDIzIDE5IiBmaWxsPSJub25lIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfMTU2XzEwMCkiPgogICAgPHBhdGggZD0iTTE5LjE3MDIgMC44ODQ5NDlINC40MzAyQzIuNTEwMiAwLjg4NDk0OSAwLjk1MDE5NSAyLjQ0NDk1IDAuOTUwMTk1IDQuMzY0OTVWMTIuOTg0OUMwLjk1MDE5NSAxNS44MTQ5IDMuMjUwMiAxOC4xMjQ5IDYuMDkwMiAxOC4xMjQ5SDE3LjUxMDJDMjAuMzQwMiAxOC4xMjQ5IDIyLjY1MDIgMTUuODI0OSAyMi42NTAyIDEyLjk4NDlWNC4zNjQ5NUMyMi42NTAyIDIuNDQ0OTUgMjEuMDkwMiAwLjg4NDk0OSAxOS4xNzAyIDAuODg0OTQ5Wk0xOC41OTAyIDMuMTg0OTVMMTIuOTMwMiA5LjY3NDk1QzEyLjY0MDIgMTAuMDA0OSAxMi4yNDAyIDEwLjE4NDkgMTEuODAwMiAxMC4xODQ5QzExLjM2MDIgMTAuMTg0OSAxMC45NjAyIDEwLjAwNDkgMTAuNjcwMiA5LjY3NDk1TDUuMDAwMiAzLjE4NDk1SDE4LjU5MDJaTTE3LjUxMDIgMTUuODE0OUg2LjA5MDJDNC41MzAyIDE1LjgxNDkgMy4yNTAyIDE0LjU0NDkgMy4yNTAyIDEyLjk3NDlWNC42NzQ5NUw4LjkzMDIgMTEuMTg0OUM5LjY1MDIgMTIuMDE0OSAxMC43MDAyIDEyLjQ4NDkgMTEuNzkwMiAxMi40ODQ5QzEyLjg4MDIgMTIuNDg0OSAxMy45MzAyIDEyLjAxNDkgMTQuNjUwMiAxMS4xODQ5TDIwLjMzMDIgNC42NzQ5NVYxMi45NzQ5QzIwLjMzMDIgMTQuNTM0OSAxOS4wNjAyIDE1LjgxNDkgMTcuNDkwMiAxNS44MTQ5SDE3LjUxMDJaIiBmaWxsPSIjMUUxRjIyIi8+CiAgPC9nPgogIDxkZWZzPgogICAgPGNsaXBQYXRoIGlkPSJjbGlwMF8xNTZfMTAwIj4KICAgICAgPHJlY3Qgd2lkdGg9IjIxLjY5IiBoZWlnaHQ9IjE3LjIzIiBmaWxsPSJ3aGl0ZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC45NTAxOTUgMC44ODQ5NDkpIi8+CiAgICA8L2NsaXBQYXRoPgogIDwvZGVmcz4KPC9zdmc+");
  position: relative;
}

#octa-col-31-3 p::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAxOCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE1Nl8xMDUpIj4KPHBhdGggZD0iTTkuMTEwNjMgMC4xNzQ5ODhDNC40NDA2MyAwLjE3NDk4OCAwLjY0MDYyNSAzLjk3NDk5IDAuNjQwNjI1IDguNjQ0OTlDMC42NDA2MjUgMTEuNzY1IDQuMDUwNjMgMTYuNDM1IDYuOTIwNjMgMTkuODE1QzcuNDcwNjMgMjAuNDU1IDguMjYwNjMgMjAuODI1IDkuMTEwNjMgMjAuODI1QzkuOTYwNjMgMjAuODI1IDEwLjc1MDYgMjAuNDU1IDExLjMwMDYgMTkuODE1QzE0LjE2MDYgMTYuNDM1IDE3LjU4MDYgMTEuNzY1IDE3LjU4MDYgOC42NDQ5OUMxNy41ODA2IDMuOTc0OTkgMTMuNzgwNiAwLjE3NDk4OCA5LjExMDYzIDAuMTc0OTg4Wk05LjU0MDYyIDE4LjMyNUM5LjM5MDYyIDE4LjUwNSA5LjIwMDYzIDE4LjUyNSA5LjEwMDYzIDE4LjUyNUM5LjAwMDYyIDE4LjUyNSA4LjgxMDYzIDE4LjQ5NSA4LjY2MDYzIDE4LjMyNUM1LjA3MDYzIDE0LjA5NSAyLjkzMDYyIDEwLjQ3NSAyLjkzMDYyIDguNjQ0OTlDMi45MzA2MiA1LjI0NDk5IDUuNzAwNjIgMi40NzQ5OSA5LjEwMDYzIDIuNDc0OTlDMTIuNTAwNiAyLjQ3NDk5IDE1LjI3MDYgNS4yNDQ5OSAxNS4yNzA2IDguNjQ0OTlDMTUuMjcwNiAxMC40NzUgMTMuMTMwNiAxNC4wOTUgOS41NDA2MiAxOC4zMjVaIiBmaWxsPSIjMUUxRjIyIi8+CjxwYXRoIGQ9Ik05LjExMDM1IDEwLjA0NUMxMC4wNzY5IDEwLjA0NSAxMC44NjA0IDkuMjYxNDggMTAuODYwNCA4LjI5NDk4QzEwLjg2MDQgNy4zMjg0OCAxMC4wNzY5IDYuNTQ0OTggOS4xMTAzNSA2LjU0NDk4QzguMTQzODUgNi41NDQ5OCA3LjM2MDM1IDcuMzI4NDggNy4zNjAzNSA4LjI5NDk4QzcuMzYwMzUgOS4yNjE0OCA4LjE0Mzg1IDEwLjA0NSA5LjExMDM1IDEwLjA0NVoiIGZpbGw9IiMxRTFGMjIiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8xNTZfMTA1Ij4KPHJlY3Qgd2lkdGg9IjE2Ljk0IiBoZWlnaHQ9IjIwLjY1IiBmaWxsPSJ3aGl0ZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC42NDA2MjUgMC4xNzQ5ODgpIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==");
  position: relative;
}

[data-prettyblocks-zone="displayFooterReassurance"] {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  align-items: center;

  p {
    margin: 0;
  }
}

.copyright {
  gap: 5px;
  flex-wrap: wrap;
}

[data-id-prettyblocks="26"] {
  width: 243px;
  flex-shrink: 0;
}

[data-instance-id="68a4456d61ced"] p:nth-child(3) {
  margin-top: 25px !important;
}

#footer {
  & .container {
    width: 1390px;
    max-width: 100%;
    padding-inline: 20px;
    padding-block: 4.42188vw;
  }

  & .payment-col {
    position: relative;
    width: 405px;
    max-width: 100%;
    flex-shrink: 0;

    &::after {
      width: 3px;
      height: 151px;
      content: "";
      background: #3d3d3d;
      position: absolute;
      right: calc(-7.3125vw / 2);
      top: 50%;
      transform: translateY(-50%);

      @media screen and (max-width: 1300px) {
        display: none;
      }
    }
  }

  & .row {
    gap: 6vw;
    justify-content: space-between;

    @media screen and (max-width: 768px) {
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 40px;
    }
  }

  & .display-footer-right {
    & h2,
    & p {
      font-size: 1.25rem !important;
      font-family: var(--font-family-space-grotesk);
      margin: 0;
    }

    & p {
      margin: 0;
      font-weight: 500;
    }

    & h2 {
      font-weight: 700;
      padding-bottom: 25px;
      margin-bottom: 25px;
      position: relative;

      &::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 56px;
        height: 1px;
        background: rgba(255, 255, 255, 0.7);
      }
    }
  }

  & .copyright {
    padding: 20px;
  }
}

#copyright-logo {
  display: inline-block;
  background: url("https://www.octacom.fr/images/logo-blanc.png") no-repeat
    center;
  background-size: contain;
  height: 17px;
  width: 80px;
}

@media screen and (max-width: 768px) {
  .display-footer {
    order: 1;
  }
  [data-prettyblocks-zone="displayFooterReassurance"] {
    justify-content: center;
  }
}

/* #endregion Footer */

/* #region Tabs */
[role="tablist"] {
  min-width: 100%;
}

[role="tab"],
[role="tab"]:focus,
[role="tab"]:hover {
  all: unset;
  position: relative;
  z-index: 2;
  top: 2px;
  margin: 0;
  padding: 3px 3px 4px;
  overflow: hidden;
  text-align: left;
}

[role="tab"][aria-selected="true"] {
  margin-top: 0;
  color: var(--color-black);
}

[role="tab"] span.focus {
  display: inline-block;
}

[role="tab"]:hover span.focus,
[role="tab"]:focus span.focus,
[role="tab"]:active span.focus {
  border-radius: 3px;
  outline: 2px solid var(--color-black);
  outline-offset: 2px;
}

[role="tabpanel"] {
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}

[role="tabpanel"]:not(.hidden) {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s ease, visibility 0s 0.5s; /* visibility change after opacity transition */
}

[role="tabpanel"] p {
  margin: 0;
}

/* #endregion tabs */

/* #region Social links */

#social-links {
  position: fixed;
  right: 0;
  top: 50dvh;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

#social-links .octa-col {
  width: 55px;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom-left-radius: 8px;
  border-top-left-radius: 8px;
  overflow: hidden;
}

#social-links .octa-col__wrap {
  width: 100%;
  height: 100%;
  background-color: var(--color-orange);
  transition: background-color 0.3s ease;

  &:is(:hover, :focus-within) {
    background-color: var(--color-grey);
  }
}

#social-links .octa-col__image {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#social-links img {
  max-width: 100%;
  max-height: 100%;
}

/* #endregion Social links */

/* #region CMS */

.page-cms #content-wrapper {
  max-width: 1400px;
  margin-inline: auto;
}

/* ==== MC SECTION ==== */
/* ==== MC SECTION ==== */
.mc-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  font-family: var(--font-family-space-grotesk);
}

.mc-title {
  font-family: var(--font-family-gantari);
  font-size: 2.2rem;
  margin-bottom: 10px;
  color: var(--color-orange);
  text-align: center;
  font-weight: 700;
}

.mc-sub {
  font-size: 1.1rem;
  color: #444;
  margin-bottom: 40px;
  text-align: center;
}

.mc-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;
}

.mc-card {
  border: 3px solid var(--color-orange);
  padding: 30px;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
}

.mc-brand {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

.mc-logo {
  max-height: 70px;
  max-width: 180px;
}

.mc-desc {
  font-size: 1rem;
  line-height: 1.6;
  color: #1e1f22;
}

.mc-list {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #1e1f22;
  list-style: none;
  padding: 0;
}

.mc-list li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 8px;
}

.mc-list li::before {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSIjZjU1MTM5IgogIHN0cm9rZT0iI2Y1NTEzOSIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxwYXRoIGQ9Ik0xMy43MyA0YTIgMiAwIDAgMC0zLjQ2IDBsLTggMTRBMiAyIDAgMCAwIDQgMjFoMTZhMiAyIDAgMCAwIDEuNzMtM1oiIC8+Cjwvc3ZnPg==");
  color: var(--color-orange);
  position: absolute;
  transform: rotate(90deg);
  left: -5px;
}

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

.mc-btns a {
  flex: 1 1 auto;
  text-align: center;
  font-size: 0.9rem;
  font-weight: 600;
  background: var(--color-orange);
  color: #fff;
  padding: 12px;
  border: 2px solid var(--color-orange);
  text-decoration: none;
  transition: 0.3s;
}

.mc-btns a:hover {
  background: #fff;
  color: var(--color-orange);
}

.mc-cta {
  border: 3px solid var(--color-orange);
  text-align: center;
  padding: 40px 20px;
  margin-top: 50px;
}

.mc-cta h3 {
  font-size: 1.6rem;
  margin-bottom: 20px;
  color: #1e1f22;
}

.mc-cta-btn {
  display: inline-block;
  background: var(--color-orange);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 700;
  text-decoration: none;
  padding: 14px 30px;
  border: 2px solid var(--color-orange);
  transition: 0.3s;
}

.mc-cta-btn:hover {
  background: #fff;
  color: var(--color-orange);
}

@media (max-width: 860px) {
  .mc-grid {
    grid-template-columns: 1fr;
  }
}

/* ==== PRO SECTION ==== */
.pro-wrapper {
  max-width: 980px;
  margin: 0 auto;
  padding: 18px;
  font-family: var(--font-family-space-grotesk);
}

.pro-title {
  font-family: var(--font-family-gantari);
  font-size: var(--font-size-h2);
  margin: 0 0 8px 0;
  color: var(--color-orange);
}

.pro-sub {
  font-size: 1rem;
  color: #666;
  margin: 0 0 18px 0;
}

.pro-block {
  margin-bottom: 40px;
}

.pro-block h3 {
  font-size: var(--font-size-h3);
  margin: 0 0 8px 0;
  color: #1e1f22;
}

.pro-text,
.pro-list {
  font-size: 0.95rem;
  line-height: 1.45;
  color: #1e1f22;
  margin: 0 0 12px 0;
}

.pro-list {
  list-style: disc;
  padding-left: 20px;
}

.pro-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.pro-card {
  background: #fff;
  padding: 16px;
  border: 2px solid var(--color-orange);
  border-radius: 0;
}

.pro-card h4 {
  margin: 0 0 6px 0;
  font-size: 1rem;
  color: #1e1f22;
}

.pro-meta {
  font-size: 0.85rem;
  color: #666;
  margin: 0 0 6px 0;
}

.pro-image {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;

  & img {
    aspect-ratio: 594/431;
    object-fit: contain;
  }
}

.pro-footer {
  margin-top: 20px;
  font-size: 0.95rem;
  color: #666;
}

.pro-keywords {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-block: 25px;
  justify-content: center;
}

.pro-tag {
  padding: 6px 12px;
  border-radius: 0;
  border: 2px solid var(--color-orange);
  background: #fff;
  font-size: 0.85rem;
  font-weight: 600;
  color: #1e1f22;
  transition: 0.3s;
}

@media (max-width: 760px) {
  .pro-grid {
    grid-template-columns: 1fr;
  }
}

/* #endregion CMS */

/* #region Contact */

.page-contact #content > .row > div:first-child {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

/* Bloc contact */
.contact-rich {
  padding: 20px;
  border: 2px solid var(--color-orange);
  border-radius: 0;
  background-color: #fff;
  color: #1e1f22;
  font-size: 1.125rem !important;
  font-weight: 400;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  position: relative;
  height: 100%;

  &::before {
    content: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYyIiBoZWlnaHQ9IjE2NSIgdmlld0JveD0iMCAwIDE2MiAxNjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik03NS45OTk0IDE0LjI1MkwxMDUuOTk5IDE0LjI1MkwzMS45OTk2IDE0OS45NjdMLTAuMDAwNDMwNjUzIDE0OS45NjdMNzUuOTk5NCAxNC4yNTJaIiBmaWxsPSIjRjU1MTM5Ii8+CjxwYXRoIGQ9Ik0xMzEuMzA5IDE0LjQ3NzJMMTYyIDE0LjQ3NzJMODguNjUgMTUwLjIyTDU2LjQ5OTYgMTUwLjIyTDEzMS4zMDkgMTQuNDc3MloiIGZpbGw9IiNGNTUxMzkiLz4KPC9zdmc+Cg==");
    position: relative;
  }
}

/* Chaque item */
.contact-rich .media {
  display: flex;
  align-items: flex-start;
  padding: 15px 0;
}

.contact-rich .media + .media {
  border-top: 2px solid var(--color-orange);
}

/* Icônes */
.contact-rich i {
  font-size: 1.5rem !important;
  color: var(--color-orange);
  flex-shrink: 0;
}

/* Textes */
.contact-rich .media-body {
  padding-left: 15px;
}

.contact-rich .font-size-ms {
  font-size: 0.875rem !important;
  color: #666;
  margin-bottom: 4px;
}

.contact-rich .font-size-sm {
  font-size: 1.125rem !important;
  font-weight: 500;
}

/* Liens */
.contact-rich a.nav-link-style {
  color: #1e1f22;
  text-decoration: none;
  font-weight: 500;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.contact-rich a.nav-link-style:hover {
  color: var(--color-orange);
  border-color: var(--color-orange);
}

/* #endregion Contact */
#octa-row-31 p {
  padding: 0 20px !important;
}

@media (max-width: 1150px) {
  .payment-methods {
    max-width: 243px;
  }
  .octa_category-carousel__glide-track {
    pointer-events: none;
  }
}

#selector-17-5 .card-img-top img {
  object-fit: cover;
  height: 350px;
  width: 100%;
}
#social-links .octa-col {
  width: 40px;
  height: 40px;
}
#social-links img {
  width: 50%;
}
#social-links #octa-col-63-1 img {
  width: 34%;
  height: 50%;
}

@media (max-width: 600px) {
  .btn,
  ::-webkit-file-upload-button {
    padding-block: 14px;
    padding-inline: 30px;
  }
}
@media (max-width: 480px) {
  #octa-row-31 p {
    flex-direction: column !important;
    gap: 5px !important;
  }
}

@media (max-width: 505px) {
  #octa-row-39 {
    gap: 0px !important;
  }
}
@media (max-width: 1127px) {
  #octa-row-31 {
    flex-direction: column !important;
    gap: 20px !important;
    padding-inline: 2.333333vw;
    & .octa-col {
      &:not(:last-child)::after {
        display: none;
      }
    }
  }
}

@media (max-width: 1025px) {
  div#octa-row-39 p {
    font-size: 0;
  }
  div#octa-row-39 {
    display: flex;
    flex-direction: row !important;
    flex-wrap: wrap;
  }
}

#search_widget .btn {
  width: 60px;
  height: 60px;
}
#search_widget input {
  height: 60px;
}

.card-body .product-title > a {
  font-size: 1.4rem;
  min-height: 80px;
}
#index .card-body .product-title > a {
  font-size: 1.1rem;
}
.card-body .btn {
  padding-block: 13px;
}
.product-id-category-5 .product-prices-container span:not(.product-prices span){
  display: none !important;
}
.category-id-5 .product-price {
  position: relative;
  font-size: 0; /* cache le texte original "À partir de" */
}

.category-id-5 .product-price::before {
  content: "Prix :";
  font-size: 16px; /* rétablit une taille normale */
  margin-right: 8px;
  color: inherit;
}

.category-id-5 .product-price__text {
  font-size: 16px; /* le prix reste visible */
}
.card-pro {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;

  & .card-text {
    justify-content: flex-start;
    border: solid hsl(var(--value-color-orange)) 1px;
    padding: 20px;
    width: 30%;
    display: flex;
    gap: 20px;
    align-items: center;
    background: white;
    font-weight: 600;

    & p {
      margin-bottom: 0;
      text-align: left;
    }
    & a {
      color: black !important;
      
    }
    &.phone:before {
      content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXBob25lLWljb24gbHVjaWRlLXBob25lIj48cGF0aCBkPSJNMTMuODMyIDE2LjU2OGExIDEgMCAwIDAgMS4yMTMtLjMwM2wuMzU1LS40NjVBMiAyIDAgMCAxIDE3IDE1aDNhMiAyIDAgMCAxIDIgMnYzYTIgMiAwIDAgMS0yIDJBMTggMTggMCAwIDEgMiA0YTIgMiAwIDAgMSAyLTJoM2EyIDIgMCAwIDEgMiAydjNhMiAyIDAgMCAxLS44IDEuNmwtLjQ2OC4zNTFhMSAxIDAgMCAwLS4yOTIgMS4yMzMgMTQgMTQgMCAwIDAgNi4zOTIgNi4zODQiLz48L3N2Zz4=");
    }
    &.mail:before {
      content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLW1haWwtaWNvbiBsdWNpZGUtbWFpbCI+PHBhdGggZD0ibTIyIDctOC45OTEgNS43MjdhMiAyIDAgMCAxLTIuMDA5IDBMMiA3Ii8+PHJlY3QgeD0iMiIgeT0iNCIgd2lkdGg9IjIwIiBoZWlnaHQ9IjE2IiByeD0iMiIvPjwvc3ZnPg==");
    }
    &.home:before {
      content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWhvdXNlLWljb24gbHVjaWRlLWhvdXNlIj48cGF0aCBkPSJNMTUgMjF2LThhMSAxIDAgMCAwLTEtMWgtNGExIDEgMCAwIDAtMSAxdjgiLz48cGF0aCBkPSJNMyAxMGEyIDIgMCAwIDEgLjcwOS0xLjUyOGw3LTZhMiAyIDAgMCAxIDIuNTgyIDBsNyA2QTIgMiAwIDAgMSAyMSAxMHY5YTIgMiAwIDAgMS0yIDJINWEyIDIgMCAwIDEtMi0yeiIvPjwvc3ZnPg==");
    }
  }
}


@media(max-width:1400px){
  .card-pro{
    flex-direction: column;
    gap:20px;
    align-items: center;
    & .card-text{
      width: 100%;
      max-width: 500px;
    }
  }
}
@media(max-width:435px){
  .card-pro{
    & .card-text{
      flex-direction: column;
    }
    & .mail{
     word-break: break-all;
    }
  }
}

.btn-scroll-top{
    bottom: 3.25rem;
}
.card-img-top{
  text-align: center;
}
body.category-id-5 .card-img-top img{
width: 100%;
}

.page-block-title{
  max-width: 1478px;
  width: 100%;
  display: flex;
  gap: 5vw;
  padding: 0 20px;
      align-items: center;
      & img{
            height: 100%;
      }
}

@media(max-width:1200px){
  .category-header{
    background-size: inherit !important;
  }
}
@media(max-width:703px){
  .page-block-title{
        flex-direction: column;
        align-items: center;
        gap:20px;
        & img{
          max-width: 230px;
        }
        & .page-title{
          text-align: center;

          &:after{
            content: none;
          }
        }     
  }
  .category-header{
        min-height: 31vh !important;
  }
}
.brands{
  margin-top: 7px;
}

@media(max-width:400px){
  .page-block-title{
    gap: 0;
  }
}

@media  (max-width: 1750px) {
    .brands {
      width: 400px !important;
      & img{
        width: 100% !important;
      }
    }
  }