/* ======================================
   WRAPPER
====================================== */
.reassurence__wrapper {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* ======================================
   DESKTOP (999px+)
====================================== */
@media screen and (min-width: 999px) {
  .reassurence__wrapper {
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
  }

  .reassurence__wrapper > * {
    min-width: 50%;
    gap: 30px;
  }

  .reassurence_items__wrapper > .rea__col2 {
    margin-top: 35px;
  }
}

/* ======================================
   COLUMN 1
====================================== */
.rea__col1 {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* ======================================
   TITLE
====================================== */
.rea__title > div {
  max-width: 570px;
  color: #FFF;
  font-family: var(--font-poppins);
  font-size: 54px;
  font-weight: 700;
  line-height: normal;
}

/* ======================================
   TEXT
====================================== */
.rea__text > .clearfix > .field__item > * {
  color: white;
}

/* ======================================
   CTA
====================================== */
.rea__cta {
  max-width: fit-content;
  color: #FFF;
  font-family: var(--font-poppins);
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 600;
  line-height: 150%;
}

.rea__cta > div > a {
  color: #FFF;
  font-family: var(--font-poppins);
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 600;
  line-height: 150%;
}

/* ======================================
   IMAGE
====================================== */
.rea__image {
  display: none;
  position: relative;
  min-height: 552px;
}

.rea__image > * > img {
  position: absolute;
  transform: translateX(-50px);
}

@media screen and (min-width: 1050px) {
  .rea__image {
    display: block;
  }
}

/* ======================================
   ITEMS HORIZONTAL
====================================== */
.reassurence_items__wrapper--horizontal {
  position: relative;
}

.reassurence_items__wrapper--horizontal::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 30px 0;
  border-radius: 10px;
  background-color: var(--color-tertiary--dark);
  transform: translateX(-10%) translateY(-5%);
  z-index: -5;
}

.reassurence_items__wrapper--horizontal > .field--name-field-h-reassurence-items {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 16px;
}

.reassurence_items__wrapper--horizontal > .field--name-field-h-reassurence-items > .field__item {
  flex: none;
  display: flex;
}

.reassurence_items__wrapper--horizontal > .field--name-field-h-reassurence-items > .field__item > .reassurence__item {
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* ======================================
   TABLET (768px+)
====================================== */
@media (min-width: 768px) {
  .reassurence_items__wrapper--horizontal::before {
    width: 80%;
    padding: 50px 0;
    transform: translateX(-30%) translateY(-10%);
  }

  .reassurence_items__wrapper--horizontal > .field--name-field-h-reassurence-items {
    flex-direction: row;
    justify-content: center;
    gap: 32px;
  }

  .reassurence_items__wrapper--horizontal > .field--name-field-h-reassurence-items > .field__item {
    flex: 1;
  }

  .reassurence_items__wrapper--horizontal > .field--name-field-h-reassurence-items > .field__item > .reassurence__item {
    height: 100%;
  }
}
