/* ==========================================================================
   Footer
   ========================================================================== */

.footer {
  position: relative;
  width: 100%;
  min-width: 0;
  padding: 3.0556vw 2.7778vw 1.8056vw;
  display: flex;
  flex-direction: column;
  min-height: 32.4306vw;
  overflow: hidden;
  background-color: var(--color-pink);
}

.footer__newsletter {
  position: relative;
  width: 25vw;
  display: block;
  max-width: 100%;
}

.footer__eyebrow {
  min-height: 2.3611vw;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 1.25vw;
  color: var(--color-black);
  line-height: 1.1;
  display: block;
}

.footer__title {
  margin: 1.7361vw 0 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2.9167vw;
  color: var(--color-black);
  line-height: 1.108;
  display: block;
}

.footer__text {
  margin: 1.3889vw 0 0;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 1.1111vw;
  color: var(--color-black);
  line-height: 1.1;
  text-align: justify;
  display: block;
}

.footer__button {
  white-space: nowrap;
  text-align: center;
  padding: 1.3889vw 1.0417vw;
  border-radius: var(--radius-fluid);
  background-color: var(--color-black);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: 1.1111vw;
  color: var(--color-cream);
  line-height: 1.1;
  cursor: pointer;
  margin: 1.1111vw 0 0;
  width: fit-content;
}

.footer__brand {
  position: absolute;
  width: 71.7361vw;
  display: block;
  top: 1.1111vw;
  left: 39.3056vw;
}

.footer__logo-frame {
  position: relative;
  width: 100%;
  display: block;
  height: 19.0972vw;
  overflow: hidden;
}

.footer__logo {
  display: block;
  width: 100%;
  height: 375%;
  max-width: 100%;
  position: absolute;
  top: -135.42%;
  left: 0;
}

.footer__tagline {
  margin: 0.7639vw 0 0 14.0972vw;
  width: 43.8194vw;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 1.25vw;
  color: var(--color-black);
  line-height: 1.1;
  text-align: center;
  display: block;
}

.footer__bottom {
  position: relative;
  width: 100%;
  min-width: 0;
  display: flex;
  margin: 5.0694vw 0 0;
  justify-content: space-between;
  align-items: center;
}

.footer__copyright {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 1.25vw;
  color: var(--color-black);
  line-height: 1.1;
  display: block;
}

.footer__copyright :is(a, .footer__cookie-prefs) {
  text-decoration: underline;
}

/* Reopens the cookie banner (js/modules/cookie-consent.js) */
.footer__cookie-prefs {
  padding: 0;
  white-space: normal;
  user-select: auto;
}

.footer__social {
  position: relative;
  width: fit-content;
  min-width: 0;
  display: flex;
  gap: 3.6111vw;
}

.footer__social-link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 1.25vw;
  color: var(--color-black);
  line-height: 1.1;
  display: block;
}


/* Tablet */
@media (max-width: 1024px) {
  .footer {
    min-height: 721px;
    padding: 53px 15px 6px;
  }

  .footer__newsletter {
    width: 360px;
  }

  .footer__eyebrow {
    min-height: 34px;
    font-size: 14px;
  }

  .footer__title {
    font-size: 42px;
    margin: 25px 0 0;
  }

  .footer__text {
    font-size: 16px;
    margin: 20px 0 0;
  }

  .footer__button {
    font-size: 16px;
    padding: 20px 15px;
    margin: 16px 0 0;
    border-radius: var(--radius);
  }

  .footer__brand {
    width: 151.3636vw;
    position: relative;
    top: auto;
    left: auto;
    margin: 18px 0 0 -29.0909vw;
  }

  .footer__logo-frame {
    height: 40.4545vw;
  }

  .footer__tagline {
    width: 100vw;
    font-size: 12px;
    margin: 7px 0 0 25.6818vw;
  }

  .footer__bottom {
    margin: 49px 0 0;
    flex-direction: column-reverse;
    gap: 41px;
  }

  .footer__copyright {
    font-size: 12px;
    text-align: center;
  }

  .footer__social {
    gap: 52px;
  }

  .footer__social-link {
    font-size: 18px;
  }
}


/* Mobile */
@media (max-width: 767px) {
  .footer {
    min-height: 163.8636vw;
    padding: 12.0455vw 3.4091vw 1.3636vw;
  }

  .footer__newsletter {
    width: 81.8182vw;
  }

  .footer__eyebrow {
    min-height: 7.7273vw;
    font-size: 3.1818vw;
  }

  .footer__title {
    font-size: 9.5455vw;
    margin: 5.6818vw 0 0;
  }

  .footer__text {
    font-size: 3.6364vw;
    margin: 4.5455vw 0 0;
  }

  .footer__button {
    font-size: 3.6364vw;
    padding: 4.5455vw 3.4091vw;
    margin: 3.6364vw 0 0;
    border-radius: var(--radius);
  }

  .footer__brand {
    width: 151.3636vw;
    position: relative;
    top: auto;
    left: auto;
    margin: 4.0909vw 0 0 -29.0909vw;
  }

  .footer__logo-frame {
    height: 40.4545vw;
  }

  /* Full screen width: cancels the brand offset (29.0909vw) and the footer padding (3.4091vw) */
  .footer__tagline {
    width: 100vw;
    font-size: 2.7273vw;
    margin: 1.5909vw 0 0 25.6818vw;
  }

  .footer__bottom {
    margin: 11.1364vw 0 0;
    flex-direction: column-reverse;
    gap: 9.3182vw;
  }

  .footer__copyright {
    font-size: 2.7273vw;
    text-align: center;
  }

  .footer__social {
    gap: 11.8182vw;
  }

  .footer__social-link {
    font-size: 4.0909vw;
  }
}