.book-nav {
  display: flex !important;
}
.book-image {
  background: #eeeee4 !important;
  min-height: 300px;
}
.book-image img {
  object-fit: contain !important;
  padding: 25px;
  max-height: 360px;
}
.beauty-hero h1 {
  white-space: pre-line;
}
.book-categories {
  margin: 25px 0;
}
.book-categories > a {
  padding: 10px 20px;
  border: 1px solid #d6dfd0;
  border-radius: 30px;
  font-size: 13px;
}
.book-specs {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 12px;
  border-top: 1px solid #ddd;
  padding-top: 20px;
}
.book-specs dt {
  font-weight: 600;
}
.book-specs dd {
  margin: 0;
}
.book-quantity {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 20px 0;
}
.book-quantity input {
  width: 80px;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 5px;
}
.book-order-note {
  font-size: 12px;
  color: #687364;
  margin-top: 15px;
}
.book-socials {
  display: flex;
  gap: 15px;
  margin-top: 25px;
}
.book-policy {
  max-width: 850px;
}
.book-policy h2 {
  font-size: 27px;
  margin: 30px 0 15px;
}
.book-policy p {
  line-height: 1.9;
}
.book-nav a {
  white-space: nowrap;
}
.detail-image img {
  object-fit: contain !important;
}
.react-admin .admin-brand b {
  font-size: 17px;
}
.brand-logo {
  object-fit: contain;
}
.beauty-hero-content {
  max-width: 1280px;
}
.beauty-hero-content h1 {
  max-width: 680px;
}
.footer-grid {
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
}
.product-link {
  display: block;
  margin-top: 15px;
}
.product-card-body > p {
  min-height: 0;
}
.contact-form small {
  display: block;
  margin-top: 15px;
}
.beauty-section-head > p {
  max-width: 450px;
}
.reviews-hero-score:empty {
  display: none;
}
@media (max-width: 1100px) {
  .nav-wrap {
    flex-wrap: wrap;
  }
  .book-nav {
    order: 3;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    gap: 18px;
  }
  .nav-wrap .nav-cta {
    display: inline-flex;
    margin-left: auto;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 650px) {
  .book-nav {
    position: static !important;
    background: none !important;
    padding: 10px 0 !important;
    box-shadow: none !important;
    gap: 13px;
    font-size: 12px;
  }
  .book-nav a {
    font-size: 12px;
  }
  .beauty-hero h1 {
    font-size: 42px !important;
  }
  .beauty-hero-image {
    object-position: 65% center;
  }
  .beauty-overlay {
    background: linear-gradient(90deg, #172e25e8, #172e25aa) !important;
  }
  .brand b {
    font-size: 18px;
  }
  .brand small {
    font-size: 9px;
  }
  .book-categories > a {
    font-size: 11px;
    padding: 8px 12px;
  }
  .footer-grid {
    grid-template-columns: 1fr;
  }
  .product-image.book-image {
    min-height: 230px;
  }
  .book-image img {
    padding: 15px;
  }
  .beauty-section-head {
    align-items: flex-start;
    gap: 20px;
  }
  .detail-copy h1 {
    font-size: 35px;
  }
}
.site-header .nav-wrap {
  height: auto;
  min-height: 90px;
  padding-top: 12px;
  padding-bottom: 12px;
}
.site-header .book-nav {
  position: static !important;
  flex-direction: row !important;
  align-items: center !important;
  box-shadow: none !important;
}
.beauty-hero-content .beauty-kicker {
  color: #3b6255;
}
.beauty-hero {
  min-height: 620px;
}
.beauty-hero-content h1 {
  line-height: 1.06;
}
.book-policy h2:first-child {
  margin-top: 0;
}
@media (max-width: 1100px) {
  .site-header .nav-wrap {
    height: auto !important;
    min-height: 100px;
  }
  .site-header .book-nav {
    padding: 6px 0 !important;
    background: transparent !important;
  }
}
@media (max-width: 650px) {
  .beauty-overlay {
    background: linear-gradient(
      90deg,
      rgba(245, 243, 235, 0.98),
      rgba(245, 243, 235, 0.88) 70%,
      rgba(245, 243, 235, 0.55)
    ) !important;
  }
  .beauty-hero-content {
    padding-top: 55px !important;
    padding-bottom: 45px;
  }
  .beauty-hero {
    min-height: 630px;
    height: auto;
  }
  .beauty-hero .hero-actions {
    gap: 16px;
  }
  .site-header .brand {
    max-width: 68%;
  }
  .site-header .brand b {
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .site-header .nav-cta {
    padding: 10px 15px;
    font-size: 12px;
  }
}
.react-admin .admin-side-bottom {
  display: flex !important;
}
.react-admin > aside {
  overflow-y: auto;
}
.react-admin .admin-side-bottom button {
  min-height: 42px;
}
