:root {
  --black: #000000;
  --white: #F8F7F4;
  --light-green: #EDEFED;
  --green: #A1B6A2;
  --color-light-peach-pink: #FAEFED;
  --color-raspberry: #C0205E;
}

.page-bazaar__body {
  background-image: url('https://cdn.shoplightspeed.com/shops/625943/files/75295346/repeat-stripe-pattern.jpg');
  background-repeat: repeat;
  background-position: center;
  padding-top: 75px;
  font-size: 14px;
  line-height: 22px;
}

.page-bazaar__bg {
  background-color: var(--color-light-peach-pink);
}

.page-bazaar__bg--top-transition {
  background: linear-gradient(to top, var(--color-light-peach-pink) 50%, transparent 100%);
}

.page-bazaar__bg--bottom-transition {
  background: linear-gradient(to bottom, var(--color-light-peach-pink) 40%, transparent 100%);
}

.page-bazaar__container {
  max-width: 1010px;
  width: 100%;
  margin: auto;
  padding-left: 15px;
  padding-right: 15px;
}

/* HEADERS */
.page-bazaar__title {
  font-size: 36px;
  line-height: 34px;
  color: var(--black);
  font-weight: bold;
}

.page-bazaar__h2 {
  font-size: 26px;
  font-weight: bold;
  color: var(--black);
}

.page-bazaar__h2--alt {
  font-size: 20px;
  font-weight: bold;
  color: var(--black);
}
.page-bazaar__h3 {
  font-size: 20px;
  font-weight: bold;
  color: var(--black);
}

.page-bazaar__h4 {
  font-size: 14px;
  font-weight: bold;
  color: var(--black);
}

/* COMPONENTS */
.page-bazaar__card {
  background: var(--white);
  box-shadow: 0px 5px 10px #00000040;
  border-radius: 10px;
}

.page-bazaar__hr {
  border: 1px solid var(--green);
}

.page-bazaar__3-col-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 50px 25px;
}

@media (max-width: 767px) {
  .page-bazaar__3-col-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .page-bazaar__3-col-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* SECTIONS */
/* Hero */
.page-bazaar__hero-container--logo {
  background-color: var(--white);
  box-shadow: 0px 5px 10px #00000040;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding: 80px 50px 55px 50px;
}

.page-bazaar__hero-bg {
  display: block;
  width: 100%;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  box-shadow: 0px 5px 10px #00000040;
}

.page-bazaar__hero-logo {
  display: block;
  max-width: 700px;
  min-width: 260px;
  margin: auto;
}

.page-bazaar__hero-container--bg {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

@media (max-width: 767px) {
  .page-bazaar__hero-container--logo {
    padding-top: 30px;
    padding-bottom: 20px;
  }
}

@media (max-width: 400px) {
  .page-bazaar__hero-container--logo {
    padding-left: 30px;
    padding-right: 30px;
  }
}

/* About */
.page-bazaar__about {
  padding-bottom: 15px;
}

.page-bazaar__about ul {
  list-style-type: disc;
  padding-left: 15px;
}

/* Visit */
.page-bazaar__visit {
  display: flex;
}

.page-bazaar__visit--content {
  max-width: 400px;
}

.page-bazaar__visit > div:first-child {
  flex-grow: 1;
}

.page-bazaar__visit > img {
  display: block;
  max-width: 430px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.page-bazaar__visit-instagram {
  display: flex;
}

.page-bazaar__visit-instagram > img {
  margin-right: 15px;
}

.page-bazaar__visit-instagram a {
  color: var(--color-raspberry);
  font-weight: bold;
  text-decoration: none;
}

.page-bazaar__visit-instagram a:hover {
  color: var(--color-raspberry);
  text-decoration: underline;
}

.page-bazaar__visit-instagram a:active,
.page-bazaar__visit-instagram a:visited {
  color: var(--color-raspberry);
  text-decoration: none;
}

@media (max-width: 767px) {
  .page-bazaar__visit {
    flex-direction: column;
  }

  .page-bazaar__visit > img {
    max-width: 100%;
  }
}

/* Photos */
.page-bazaar__photos-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 16px;

  grid-template-areas:
    "main side-top side-tall"
    "main side-bottom side-tall"
    "bottom bottom bottom";
}

.page-bazaar__photos-grid--main {
  grid-area: main;
}

.page-bazaar__photos-grid--side-top {
  grid-area: side-top;
}

.page-bazaar__photos-grid--side-bottom {
  grid-area: side-bottom;
}

.page-bazaar__photos-grid--side-tall {
  grid-area: side-tall;
}

.page-bazaar__photos-grid--bottom {
  grid-area: bottom;
}

.page-bazaar__photos-grid img {
  object-fit: cover;
  height: 100%;
  box-shadow: 0px 5px 10px #00000040;
  border-radius: 10px;
}

@media (max-width: 767px) {
  .page-bazaar__photos-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    
    grid-template-areas:
      "main main"
      "side-top side-tall"
      "side-bottom side-tall"
      "bottom bottom";
  }
}

@media (max-width: 575px) {
  .page-bazaar__photos-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    
    grid-template-areas:
      "main"
      "side-top"
      "side-bottom"
      "side-tall"
      "side-tall"
      "bottom";
  }
}

/* Community */
.page-bazaar__community {
  background-color: var(--light-green);
}

/* Explore */
.page-bazaar__explore > div {
  max-width: 598px;
  margin: auto;
  background-color: var(--white);
  box-shadow: 0px 5px 10px #00000040;
  border-radius: 10px;
  padding-top: 70px;
}

.page-bazaar__explore img {
  display: block;
  max-width: 350px;
  min-width: 240px;
  margin: auto;
}

/* PROMO */
.page-bazaar__promo {
  width: 100%;
  height: auto;
}