/* Solution styles */

.--accordion__content-container {
  height: 0;
  transition: height 0.7s;
  overflow: hidden;
}

.header-accordion {
  border-radius: 0.549vw
    /*8px*/
  ;
  background: var(--Light-grey, #E8EDF1);
  transition: background 0.4s;
}

.header-accordion .--accordion__open {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 1.373vw
    /*10px*/
    1.647vw
    /*24px*/
    1.373vw
    /*20px*/
    1.784vw
    /*26px*/
  ;
  line-height: 100% !important;
  cursor: pointer;
}

.header-accordion .--accordion__open .circle {
  width: 1.373vw
    /*20px*/
  ;
  aspect-ratio: 1/1;
  border-radius: 2.196vw
    /*32px*/
  ;
  background: #B4C3D3;
  margin-right: 1.235vw
    /*18px*/
  ;
  /* margin-top: 0.343vw
    /*5px*/
  ;
}

.header-accordion .--accordion__open .plus {
  position: relative;
  width: 2.196vw
    /*32px*/
  ;
  aspect-ratio: 1/1;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 0 0 auto;
  transition: opacity 0.4s;
}

.header-accordion .--accordion__open .plus:before,
.header-accordion .--accordion__open .plus:after {
  content: '';
  display: block;
  position: absolute;
  width: 1.098vw
    /*16px*/
  ;
  height: 0.137vw
    /*2px*/
  ;
  background: var(--Black);
  transition: background 0.4s, transform 0.4s;
}

.header-accordion .--accordion__open .plus:before {
  transform: rotate(90deg);
}

body.-apple .header-accordion .--accordion__open .circle {
  margin-top: -0.275vw
  ;
}

body.-apple .header-accordion .--accordion__open .plus {
  margin-top: -0.275vw
  ;
}

body.-apple .header-accordion .--accordion__open {
  padding-top: 1.373vw
  ;
  padding-bottom: 1.098vw
  ;
}

.header-accordion .--accordion__content {
  padding: 0.137vw
    /*2px*/
    1.373vw
    /*20px*/
    1.510vw
    /*22px*/
    1.647vw
    /*24px*/
  ;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.098vw
    /*16px*/
  ;
}

.header-accordion .--accordion__content a {
  opacity: 0.7;
}

.header-accordion.-open {
  background: var(--Light-grey-2);
}

.header-accordion.-open .--accordion__open .plus:before {
  transform: rotate(0);
}

.header-accordion.-open .--accordion__open .plus {
  opacity: 0.5;
}


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

  .header-accordion {
    border-radius: clamp(7px, 2.051vw, 9px);
  }

  .header-accordion .--accordion__open {
    padding: clamp(12px, 3.333vw, 14px)
      /*13px*/
      clamp(15px, 4.103vw, 17px)
      /*16px*/
      clamp(15px, 4.103vw, 17px)
      /*16px*/
      clamp(17px, 4.615vw, 19px)
      /*18px*/
    ;
  }

  .header-accordion .--accordion__open .circle {
    width: clamp(15px, 4.103vw, 17px)
      /*16px*/
    ;
    border-radius: 50%;
    margin-right: clamp(13px, 3.590vw, 15px);
    margin-top: min(0.282vw, 6px);
  }

  .header-accordion .--accordion__open .plus {
    width: clamp(23px, 6.154vw, 25px);
    margin: clamp(2px, 0.769vw, 4px) 0 0 auto;
  }

  .header-accordion .--accordion__open .plus:before,
  .header-accordion .--accordion__open .plus:after {
    width: 11px;
    height: 2px;
  }


  .header-accordion .--accordion__content {
    padding: clamp(1.5px, 0.513vw, 2.5px) clamp(15px, 4.103vw, 17px)
      /*16px*/
      clamp(17px, 4.615vw, 19px)
      /*18px*/
      clamp(15px, 4.103vw, 17px)
      /*16px*/
    ;
    gap: clamp(15px, 4.103vw, 17px)
      /*16px*/
    ;
  }

  body.-apple .header-accordion .--accordion__open .circle {
    margin-top: -2px;
  }

  body.-apple .header-accordion .--accordion__open .plus {
    margin-top: -2px;
  }

  body.-apple .header-accordion .--accordion__open {
    padding-top: clamp(15px, 4.103vw, 17px)
    ;
    padding-bottom: clamp(15px, 4.103vw, 17px)
    ;
  }
}

• [F] accordions.css
  Delete
• [F] buttons.css
  Delete
• [F] form-elements.css
  Delete
• [F] typography.css
  Delete
• [F] variables.css
  Delete