:root {
  --opacity50: 50%;
  --opacity70: 70%;
}

:root {
  --off-white: #ECF2F8;
  --purple: #733FC8;
  --light-blue: #48556A;
  --dark-blue: #19202D;
  --bright-purple: #A775F1;
  --white: #FFFFFF;
}

body {
  display: grid;
  height: 100vh;
  align-items: center;
  margin: 0;
  padding: 0;
  background-color: var(--off-white);
  font-family: "Barlow Semi Condensed", sans-serif;
  font-size: 0.8125rem;
}

.grid {
  display: grid;
  grid-template: repeat(5, auto)/repeat(1, 1fr);
  gap: 2rem;
  margin: 5rem 1.5rem;
}
@media (min-width: 1275px) {
  .grid {
    grid-template: repeat(2, auto)/repeat(4, minmax(auto, 18.75rem));
    justify-content: center;
    margin: 5rem 10rem;
  }
}
@media (min-width: 700px) and (max-width: 1274px) {
  .grid {
    grid-template: repeat(3, auto)/repeat(2, 1fr);
    margin: 5rem 2rem;
    max-width: unset;
  }
}

.card {
  border-radius: 0.5rem;
  padding: 1.5rem 2rem;
  box-shadow: 40px 60px 50px -47px rgba(72, 85, 106, 0.247378);
}
.card--purple {
  background-color: var(--purple);
  background-image: url(images/bg-pattern-quotation.svg);
  background-repeat: no-repeat;
  background-position: top right 2rem;
}
.card--light-blue {
  background-color: var(--light-blue);
}
.card--white {
  background-color: var(--white);
}
.card--dark-blue {
  background-color: var(--dark-blue);
}
@media (min-width: 1275px) {
  .card:nth-child(1) {
    grid-area: 1/1/2/3;
    background-position: top right 5rem;
  }
  .card:nth-child(4) {
    grid-area: 2/2/3/4;
  }
  .card:nth-child(5) {
    grid-area: 1/4/3/5;
  }
}
@media (min-width: 700px) and (max-width: 1274px) {
  .card:nth-child(1) {
    grid-area: 1/1/2/3;
  }
}

.reviewer {
  display: grid;
  grid-template: repeat(2, 1fr)/repeat(2, -webkit-max-content);
  grid-template: repeat(2, 1fr)/repeat(2, max-content);
}
.reviewer__image {
  grid-area: 1/1/3/1;
  border-radius: 100%;
  border-style: solid;
  border-width: 0.15rem;
  border-color: transparent;
  margin: 0 1rem 0 0;
  width: 1.8125rem;
}
.reviewer__image--border-bright {
  border-color: var(--bright-purple);
}
.reviewer__image--border {
  border-color: var(--purple);
}
.reviewer__name {
  align-self: end;
  margin: 0;
  line-height: 0.8125rem;
}
.reviewer__name--white {
  color: var(--white);
}
.reviewer__name--light-blue {
  color: var(--light-blue);
}
.reviewer__status {
  align-self: center;
  margin: 0;
  font-size: 0.6875rem;
  line-height: 0.6875rem;
  opacity: var(--opacity50);
}
.reviewer__status--white {
  color: var(--white);
}
.reviewer__status--off-white {
  color: var(--off-white);
}
.reviewer__status--light-blue {
  color: var(--light-blue);
}

.review__header {
  font-size: 1.25rem;
  line-height: 1.5rem;
  margin: 1rem 0 1rem 0;
}
.review__header--white {
  color: var(--white);
}
.review__header--light-blue {
  color: var(--light-blue);
}
.review__header--off-white {
  color: var(--off-white);
}
.review__paragraph {
  opacity: var(--opacity70);
  line-height: 1.125rem;
}
.review__paragraph--white {
  color: var(--white);
}
.review__paragraph--light-blue {
  color: var(--light-blue);
}
.review__paragraph--off-white {
  color: var(--off-white);
}

/* Forwards */ /* Forwards *//*# sourceMappingURL=style.css.map */