/*---------------------------------------------------------------------------------
Pure CSS dynamic linebreak - Credits : jerome@vadon.fr
---------------------------------------------------------------------------------*/
/* Base: behave like a normal space */
.linebreak--desktop,
.linebreak--tablet,
.linebreak--mobile {
  display: inline;
  white-space: normal;
  line-height: 0; /* safety when block */
}

/* Mobile-only break (<768px) */
@media (max-width: 767.98px){
  .linebreak--mobile { display: block; height: 0; }
}

/* Tablet-only break (768–1023px) */
@media (min-width: 768px) and (max-width: 1023.98px){
  .linebreak--tablet { display: block; height: 0; }
}

/* Desktop-only break (≥1024px) */
@media (min-width: 1024px){
  .linebreak--desktop { display: block; height: 0; }
}


/*---------------------------------------------------------------------------------
Custom label to behave like links
---------------------------------------------------------------------------------*/
.copyright {
  label {
    font-weight: 300;
    transition: font-weight 300ms ease;
    color: var(--gcid-53054839-b83d-4ef0-8659-8a010e6148fd);
    cursor: pointer;
    &:hover {
      font-weight: 700;
    }
  }
  h4 {
    margin: 0;
    padding: 0 0 0.3em 0;
  }
  label,
  a[href^="#"] {
    padding: 0.15em 0 !important;
    display: inline-flex;
    position: relative; /* required for pseudo-element hitbox */
  }
  /* Expand hit area around inline links without shifting layout */
  label::before,
  a[href^="#"]::before {
    content: "";
    position: absolute;
    inset: -8px -6px;
  }
}






/*---------------------------------------------------------------------------------
Custom label for conditionnal rebate
---------------------------------------------------------------------------------*/
.rebate-badge {
  line-height: 0.5em;
  font-weight: 600;
  font-size: 30px;
  line-height: 0.5em;
  border-radius: 100% 100% 100% 100%;
  height: 6em;
  width: 6em;
  z-index: 1000;
  position: absolute;
  top:0.5em;
  left:6.5em;
  color:#000;
  transform: rotateX(0deg) rotateY(0deg) rotateZ(10deg);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  .intro {
    padding: 1em 0 0 0;
    font-size: 18px;
    font-weight: 300;
    display: block !important;
  }
  .percent {
    padding: 0 0.5em 0 0.5em;
    font-size: 40px;
    font-weight: 700;
    line-height: 10px;
    display: block !important;
  }
  .price {
    padding: 0 0 1em 0.15em;
    font-weight: 700;
    font-size: 58px;
    display: block;
    line-height: 40px;
    sup {
      vertical-align: super;
      font-size: 25%;
      line-height: 62px;
      font-weight: 700;
      padding-left: 2px;
    }
  }
}