:root {
  --ink: #0b0b0b;
  --paper: #f5f3ee;
  --sand: #d6d0c7;
  --rust: #f49a6a;
  --line: rgba(11, 11, 11, .18);
}

.header {
  background: #050505;
  color: #fff;
  border-bottom-color: rgba(255,255,255,.16);
}

.header .cart-button span {
  background: var(--rust);
  color: #0b0b0b;
}

.brand-image {
  display: block;
  width: 190px;
  line-height: 0;
}

.brand-image img {
  display: block;
  width: 100%;
  height: auto;
}

.footer-logo {
  background: #050505;
  padding: 10px 14px;
  width: 220px;
}

.hero-art {
  background: #77736d;
}

.hero-art > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.art-image::before,
.detail-image::before {
  display: none;
}

.art-image {
  background: #dedbd4;
}

.art-image img,
.detail-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.detail-image img {
  object-fit: contain;
  padding: 28px;
}

.cart-thumb {
  width: 72px;
  height: 85px;
  object-fit: cover;
}

.artist-statement {
  max-width: 760px;
  margin: 0 0 70px 10%;
  color: #c9c9c5;
  line-height: 1.75;
}

.artist-statement small {
  color: #8d8f8b;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.catalog-code {
  display: block;
  margin-top: 14px;
  color: #777;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.image-pending {
  width: 100%;
  height: 100%;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 10px;
  padding: 32px;
  background: linear-gradient(145deg, #f49a6a, #ecda37 48%, #191919 49%);
  color: #fff;
}

.image-pending span,
.image-pending small { text-transform: uppercase; letter-spacing: .14em; }
.image-pending strong { font-family: Italiana, serif; font-size: 34px; font-weight: 400; }
.pending-thumb { background: var(--rust); display: grid; place-items: center; font-weight: 500; }

@media (max-width: 800px) {
  .brand-image { width: 150px; }
  .hero-art > img { object-position: center 30%; }
  .artist-statement { margin-left: 15%; margin-right: 5%; }
}

@media (max-width: 520px) {
  .brand-image { width: 128px; }
}