/**
 * Home specific custom card sections (partners, about, FAQ, help, reassurance)
 */

.partners-section {
  padding    : 3.5rem 0;
  background : var(--color-grey-default);
  overflow   : hidden;
}

.partners-section__wrapper {
  max-width : 100%;
  position  : relative;
}

.partners-section__title {
  text-align  : center;
  font-size   : var(--font-size-800);
  line-height : 1;
  font-weight : 600;
  color       : var(--color-black-default, #091C34);
  margin      : 0;
  padding     : 0 1rem 4rem;
}

.partners-section__track-container {
  display  : flex;
  gap      : 4rem;
  overflow : hidden;
}

.partners-section__track {
  display   : flex;
  gap       : 3rem;
  animation : partnersScroll 30s linear infinite;
}

.partners-section__track--clone {
  animation-delay : -15s;
}

.partners-section__track-container.is-paused .partners-section__track {
  animation-play-state : paused;
}

.partners-section__item {
  flex-shrink : 0;
}

.partners-section__link,
.partners-section__logo-wrapper {
  display         : flex;
  align-items     : center;
  justify-content : center;
  min-width       : 120px;
  min-height      : 60px;
}

.partners-section__logo-wrapper picture,
.partners-section__logo-wrapper img,
.partners-section__logo-wrapper video {
  max-height     : 60px;
  width          : auto;
  height         : 100%;
  object-fit     : contain;
  transition     : filter 0.3s ease;
  background     : var(--color-grey-default);
  mix-blend-mode : darken;
}

.partners-section__name {
  font-weight : 600;
  color       : var(--color-grey-font-default, #516765);
}

@keyframes partnersScroll {
  0% {
    transform : translateX(0);
  }
  100% {
    transform : translateX(-50%);
  }
}

.about-section {
  position : relative;
  padding  : 5rem 0;
  color    : var(--color-white-default, #fff);
  overflow : hidden;
}

.about-section--dark {
  background : radial-gradient(circle at top right, rgba(255, 255, 255, 0.05), transparent 60%),
  linear-gradient(135deg, var(--color-secondary, hsl(213, 70%, 15%)) 0%, hsl(210, 90%, 25%) 100%);
}

.about-section__watermark {
  position       : absolute;
  bottom         : -17%;
  right          : 0;
  width          : 600px;
  height         : 420px;
  background     : radial-gradient(circle, rgba(255, 255, 255, 0.15) 0%, transparent 65%);
  pointer-events : none;
  filter         : blur(0.5px);
  opacity        : .1;
}

.about-section__wrapper {
  display               : grid;
  grid-template-columns : 1fr;
  gap                   : 2rem;
  align-items           : center;
  position              : relative;
  z-index               : 1;
}

@media screen and (min-width : 992px) {
  .about-section__wrapper {
    grid-template-columns : repeat(2, minmax(0, 1fr));
    gap                   : 3rem;
  }
}

.about-section__eyebrow {
  font-size      : 0.8rem;
  letter-spacing : 0.15em;
  text-transform : uppercase;
  color          : rgba(255, 255, 255, 0.7);
}

.about-section__title {
  font-size   : var(--font-size-900, 3rem);
  font-weight : 700;
  line-height : 1;
  margin      : 0.5rem 0 1rem;
}

.about-section__divider {
  width            : 72px;
  height           : 3px;
  background-color : var(--color-primary, hsl(210, 90%, 45%));
  border-radius    : 99px;
  margin-bottom    : 1.5rem;
}

.about-section__description,
.about-section__text {
  font-size     : 1rem;
  line-height   : 1.7;
  color         : rgba(255, 255, 255, 0.85);
  margin-bottom : 1rem;
}

.about-section__btn {
  margin-top  : 0.5rem;
  display     : inline-flex;
  align-items : center;
  gap         : 0.5rem;
}

.about-section__image-wrapper {
  position : relative;
}

.about-section__image-inner {
  border-radius : 5px;
  overflow      : hidden;
  position      : relative;
  box-shadow    : 0 25px 45px rgba(0, 0, 0, 0.35);
}

.about-section__image-inner .media-container,
.about-section__image-inner picture,
.about-section__image-inner img,
.about-section__image-inner video {
  display    : block;
  width      : 100%;
  height     : 100%;
  object-fit : cover;
}

.about-section__image-overlay {
  position      : absolute;
  inset         : 0;
  background    : linear-gradient(0deg, rgba(9, 28, 52, 0.35) 0%, transparent 60%);
  border-radius : inherit;
}

.home-faq {
  background : var(--color-grey-default);
}

.faq-section-wrapper {
  padding    : 3rem 0 4rem;
  background : var(--color-grey-default);
}

@media (max-width : 768px) {
  .home-faq .container-primary .container-primary {
    max-width : 100%;
  }
}

@media screen and (min-width : 768px) {
  .faq-section-wrapper {
    padding : 4rem 0 5rem;
  }
}

@media screen and (min-width : 1024px) {
  .faq-section-wrapper {
    padding : 5rem 0 6rem;
  }
}

.faq-section {
  max-width : 900px;
  margin    : 0 auto;
}

.faq-section__header {
  text-align    : center;
  margin-bottom : 2rem;
}

.faq-section__eyebrow {
  font-size      : 0.8rem;
  letter-spacing : 0.2em;
  text-transform : uppercase;
  color          : var(--color-primary, hsl(210, 90%, 45%));
}

.faq-section__title {
  font-size   : var(--font-size-900, 3rem);
  line-height : 1;
  font-weight : 700;
  margin      : 0.35rem 0 0.5rem;
}

.faq-section__intro {
  margin : 0;
  color  : var(--color-grey-font-default, #516765);
}

.faq-section__accordion {
  margin-top : 1rem;
}

.faq-section__item {
  background-color : var(--color-white-default, #fff);
  border-radius    : 5px;
  border           : 1px solid hsl(210 20% 90%);
  margin-bottom    : 0.85rem;
  box-shadow       : 0 20px 40px rgba(9, 28, 52, 0.05);
  overflow         : hidden;
}

.faq-section__question {
  width           : 100%;
  padding         : 1.25rem 1.5rem;
  display         : flex;
  justify-content : space-between;
  align-items     : center;
  background      : transparent;
  border          : none;
  font-size       : 1rem;
  font-weight     : 600;
  text-align      : left;
  cursor          : pointer;
  color           : var(--color-black-default, #091C34);
}

.faq-section__question:focus {
  outline : none;
}

.faq-section__icon {
  font-size  : 24px;
  transition : transform 0.3s ease;
  color      : var(--color-black-default, #091C34);
}

.faq-section__item.is-open .faq-section__icon {
  transform : rotate(180deg);
}

.faq-section__answer {
  display            : grid;
  grid-template-rows : 0fr;
  transition         : grid-template-rows 0.35s ease-out;
}

.faq-section__item.is-open .faq-section__answer {
  grid-template-rows : 1fr;
}

.faq-section__answer-content {
  overflow    : hidden;
  padding     : 0 1.5rem;
  color       : var(--color-grey-font-default, #516765);
  line-height : 1.6;
}

.faq-section__item.is-open .faq-section__answer-content {
  padding-bottom : 1.25rem;
}