main,
div.polaroids,
div.polaroids > div {
  display: flex;
}

main,
div.polaroids > div {
  align-items: center;
}

main {
  justify-content: center;
}

div.polaroids {
  position: relative;
  margin: 80px 0;
  padding: 0 5px;
}

div.polaroids > div {
  position: relative;
}

div.polaroids > div > div.polaroid-wrapper > figure {
  width: auto;
}

.polaroids > div:first-of-type {
  transform: rotate(-20deg);
  left: 30px;
  top: -20px;
  z-index: 3;
}

.polaroids > div:last-of-type {
  top: 20px;
  right: 30px;
  transform: rotate(15deg);
  z-index: 2;
}

body main .dog-bone-heading h1 {
  font-size: 35px;
}

h1 {
  text-shadow: 2px 2px rgb(var(--ellie-pink-RGB) / 50%);
}

.dog-bone-container {
  z-index: 2;
}

.dog-bone-container,
.dog-bone-container > div.tr,
.dog-bone-container > div.br,
div.polaroids figure,
div.polaroids-wrapper div.box {
  box-shadow: 4px 4px rgb(var(--ellie-pink-RGB) / 50%);
}

.polaroid:last-of-type {
  margin-bottom: 50px;
}

@media (min-width: 500px) {
  div.polaroids {
    padding: 0 10px;
  }
}

@media (min-width: 850px) {
  div.polaroids {
    padding: 0;
    grid-area: a;
  }

  body main .dog-bone-heading {
    grid-area: b;
  }

  div.polaroids-wrapper > div:last-of-type > p {
    grid-area: c;
  }

  div.polaroids-wrapper {
    display: grid;
    gap: 0 30px;
    margin: 20px 0;
    grid-template-areas:
      "b a "
      "c a ";
  }
}