/*
  Add/override brand colors here.
*/
/**
 * Replace `$search` with `$replace` in `$string`
 *
 * @author Hugo Giraudel
 * @param {String} $string - Initial string
 * @param {String} $search - Substring to replace
 * @param {String} $replace ('') - New value
 * @return {String} - Updated string
 */
/**
 * http://codepen.io/philippkuehn/pen/zGEjxB
 */
/**
 * Change the fill color of an svg.
 * @param  {[type]} $svg
 * @param  {[type]} $color: $black
 */
/**
 * Create properly pathed image url
 * Usage: background-image: image-url('image.png');
 */
/**
 * Maintains aspect ratio
 * Grabbed from: https://css-tricks.com/snippets/sass/maintain-aspect-ratio-mixin
 * @param  {[type]} $width  [description]
 * @param  {[type]} $height [description]
 * @return {[type]}         [description]
 */
/**
 * Change the color of the svg.
 */
.faq-accordion {
  background-color: #fff; }
  .faq-accordion .faq-accordion-component-wrapper {
    display: flex;
    flex-direction: column;
    margin: 4rem auto;
    padding: 0 2.4rem; }
    @media screen and (min-width: 1024px) {
      .faq-accordion .faq-accordion-component-wrapper {
        flex-direction: row;
        max-width: 135.8rem; } }
  .faq-accordion__title {
    padding-block: 1rem 2rem;
    font-size: 2.6rem;
    line-height: calc(32/26);
    color: #2F3738;
    font-weight: bold;
    font-family: "Poppins", "Helvetica Neue", "Helvetica", "Arial", sans-serif; }
    @media screen and (min-width: 834px) {
      .faq-accordion__title {
        font-size: 2.8rem;
        line-height: calc(37/28); } }
  .faq-accordion .mobile-star-wrapper {
    display: flex;
    align-items: center;
    width: 100%; }
    @media screen and (min-width: 1024px) {
      .faq-accordion .mobile-star-wrapper {
        display: block; } }
    .faq-accordion .mobile-star-wrapper .titles {
      width: calc(100% - 10.6rem);
      padding-right: 2.4rem; }
      @media screen and (min-width: 1024px) {
        .faq-accordion .mobile-star-wrapper .titles {
          display: block;
          width: 100%;
          padding-right: 0; } }
  .faq-accordion .faq-info-wrapper {
    margin: 0;
    width: 100%; }
    @media screen and (min-width: 1024px) {
      .faq-accordion .faq-info-wrapper {
        display: flex;
        width: 40%;
        padding-right: 2.4rem; } }
  .faq-accordion .logo-star {
    width: 10.6rem;
    transform: scaleX(-1); }
    .faq-accordion .logo-star--desktop {
      display: none; }
      @media screen and (min-width: 1024px) {
        .faq-accordion .logo-star--desktop {
          display: block; } }
    @media screen and (min-width: 1024px) {
      .faq-accordion .logo-star--mobile {
        display: none; } }
  @media screen and (min-width: 1024px) {
    .faq-accordion .faq-info {
      width: calc(100% - 10.6rem);
      padding-left: 2.4rem; } }
  .faq-accordion .faq-items {
    margin: 0;
    width: 100%; }
    @media screen and (min-width: 1024px) {
      .faq-accordion .faq-items {
        width: 60%; } }
  .faq-accordion .secondary--display-title {
    position: relative;
    font-family: "Poppins", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    font-size: 1.8rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #D44326;
    line-height: calc(32 / 18); }
    .faq-accordion .secondary--display-title::before {
      content: '';
      position: absolute;
      display: block;
      left: -10px;
      width: 5px;
      height: 100%;
      background: #D44326; }

.faq-item {
  padding: 0; }
  .faq-item.is-open {
    border-radius: 1.25rem;
    border-color: #222; }
    .faq-item.is-open .faq-question {
      font-weight: 700; }
    .faq-item.is-open .faq-question::after {
      content: '';
      transform: rotate(45deg);
      background-image: url("/themes/custom/mmg9/images/plus.svg"); }
    .faq-item.is-open .faq-answer {
      max-height: 1000px;
      opacity: 1;
      padding-top: 1rem;
      padding-bottom: 1rem; }

.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  border: none;
  border-bottom: thin solid #464646;
  background: none;
  padding: 1.6rem 2.4rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer; }
  .faq-question::after {
    content: '';
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("/themes/custom/mmg9/images/plus.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 2.4rem;
    transition: transform 0.25s ease, border-color 0.15s ease, background-color 0.15s ease; }
  .faq-question:focus-visible {
    outline: auto; }

.faq-question__text {
  flex: 1 1 auto; }

.faq-answer {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  padding: 0 1.5rem 0;
  transition: max-height 0.25s ease, opacity 0.25s ease, padding-top 0.25s ease, padding-bottom 0.25s ease;
  color: #333; }
  .faq-answer p:last-child {
    margin-bottom: .3rem; }