.BookPage {
  --dark-yellow: #544005;
  padding-block-end: 3rem;
  --text-color: black;
  color: var(--text-color);
}

.BookPage a {
  color: #375575;
}

.BookPage h1 {
  text-shadow: none;
}
.BookPage h2 {
  text-align: center;
  text-wrap: balance;
  border-block-end: 1px solid;
}
.BookPage h3 {
  text-align: center;
  margin-block-end: 0;
  text-wrap: balance;
}

.BookPage .BookPage-preview h2 {
  border: none;
}

.BookPage .Card {
  background: rgb(255 255 255 / 0.5);
  border: 0.5rem solid rgb(255 255 255 /0.25);
  box-shadow: none;
}

.BookPage .buy {
  background-color: var(--dark-yellow);
  color: white;
  border-radius: 0.5rem;
  --button-padding: 0.35rem 1.2rem 0.5rem;
  --button-gap: 0.5em;
  --button-bg: var(--background-color);
  --button-color: var(--dark-yellow);
  --button-hover-bg: var(--link);
  --button-hover-bg-gradient: var(--brown-gradient-small);
  --button-hover-color: #ffffff;
  --button-border-width: 1px;
  --button-border-style: solid;
  --button-border-color: var(--button-bg);
  --button-radius: 0.25em;
  --button-font-weight: 900;
  --button-font-size: var(--font-size-small);
  display: inline;
  align-items: center;
  gap: var(--button-gap);
  padding: var(--button-padding);
  background-color: var(--button-bg);
  color: var(--button-color);
  box-shadow: var(--shadow-elevation-low);
  border-width: var(--button-border-width);
  border-style: var(--button-border-style);
  border-color: var(--button-border-color);
  border-radius: var(--button-radius);
  text-decoration: none;
  font-weight: var(--button-font-weight, 700);
  font-size: var(--button-font-size, 1em);
  letter-spacing: 0.05ch;
  line-height: 1.25;
  cursor: pointer;
  user-select: none;
  max-inline-size: none;
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  border: 1px solid var(--dark-yellow);
}

.BookPage .BookPage-salesbox {
  display: flex;
  flex-direction: column;
  padding: var(--size-default);
}

.BookPage .Card p {
  text-align: left;
}

.BookPage .Book-book-title {
  text-align: center;
  margin-block: 1rem 1rem;
}
.Books-book-footer + .Book-book-title {
  margin-block: 3rem 1rem;
}

@media (max-width: 500px) {
  .BookPage .Books-book {
    display: flex;
    flex-direction: column;
  }
}

.BookPage .Book-book-title {
  grid-area: title;
  text-align: center;
  border-bottom: 1px solid;
  color: var(--dark-yellow);
}

.BookPage .BookPage-salesbox .buy {
}

.BookPage .buy.BookPage-bigly {
  --button-font-size: 1rem;
  --button-font-weight: 300;
  display: block;
}

.BookPage .buy.BookPage-bigly strong {
  font-size: 1.85rem;
  --button-font-weight: 900;
}

.BookPage .BookPage-preview {
  display: grid;
  padding: var(--size-default);
  background: rgb(255 255 255 / 0.75);
}

.BookPage p.BookPage-preview-label {
  text-transform: uppercase;
  color: var(--dark-yellow);
  text-align: center;
  font-size: var(--font-size-large);
  border-block-end: 1px solid;
}

.BookPage .buy:hover {
  background: var(--button-hover-bg);
  color: var(--button-hover-color);
}

.BookPage .buy:focus {
  outline-width: var(--button-outline-width, var(--button-border-width));
  outline-style: var(--button-outline-style, var(--button-border-style));
  outline-color: var(--button-outline-color, var(--button-border-color));
  outline-offset: var(
    --button-outline-offset,
    calc(var(--button-border-width) * 2)
  );
}

.BookPage .buy:active {
  transform: scale(99%);
}

.BookPage .wrapper {
  grid-column: 1 / -1;
}

.BookPage .subhead {
  font-weight: 400;
  font-size: var(--font-size-large);
  line-height: 1.25;
  font-style: italic;
  text-align: center;
  margin: 3rem 0.5rem 0;
  color: var(--dark-yellow);
  padding: 0.4rem 0.5rem 0.5rem;
  text-wrap: balance;
}

.BookPage .author {
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1;
  text-align: center;
  margin-block: 2rem;
  color: var(--dark-yellow);
  padding: 1rem;
}

.BookPage .title {
  font-size: var(--font-size-xlarge);
  color: var(--dark-yellow);
  font-weight: 800;
  text-transform: uppercase;
  line-height: 4.5rem;
  margin: 5rem 1rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.BookPage-block {
  display: block;
}

.BookPage .uncluttered {
  margin: 1rem 1rem 0.75rem;
  padding: 0.5rem 0.5rem 0.75rem;
  font-weight: 800;
  background-color: white;
  display: block;
}

.BookPage .yellow {
  color: #8f6d08;
  font-weight: 800;
}

.BookPage strong {
  font-weight: 800;
}