@property --tilt-x {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@property --tilt-y {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@property --lift {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --glint-x {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 32%;
}

@property --glint-y {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 18%;
}

.book-wrap[data-astro-cid-q6rhixpg] {
  --book-width: 11.5rem;
  --book-depth: 1.5rem;
  --book-height: 17.25rem;
  display: flex;
  width: var(--book-width);
  flex-direction: column;
  align-items: center;
  padding-inline-end: 1.35rem;
}

@media (width >= 48rem) {
  .book-wrap[data-astro-cid-q6rhixpg] {
    --book-width: 15rem;
    --book-depth: 1.75rem;
    --book-height: 22.5rem;
  }
}

.book-wrap--detail[data-astro-cid-q6rhixpg] {
  --book-width: min(18rem, calc(100vw - 4.6rem));
  --book-depth: 1.75rem;
  --book-height: calc(var(--book-width) * 1.5);
  padding-inline-end: 0;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] {
  --book-width: min(12.5rem, 42vw);
  --book-height: calc(var(--book-width) * 708 / 472);
  --book-depth: calc(var(--book-height) * 80 / 708);
  --tilt-x: 0deg;
  --tilt-y: 0deg;
  --lift: 0px;
  --glint-x: 32%;
  --glint-y: 18%;
  padding-inline-end: 0;
  transform: translateY(var(--lift)) rotateX(var(--tilt-x))
      rotateY(var(--tilt-y));
  transform-origin: center;
  transform-style: preserve-3d;
}

@media (width >= 48rem) {
  .book-wrap--hero[data-astro-cid-q6rhixpg] {
    --book-width: min(16rem, 20vw);
  }
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book-scene[data-astro-cid-q6rhixpg] {
  perspective: none;
  transform-style: preserve-3d;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg] {
  transform: none;
  transform-origin: center;
  transform-style: preserve-3d;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg] {
  transition: none;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg] {
  overflow: hidden;
  border-radius: 1px;
  transform-origin: center;
  transform: translateZ(calc(var(--book-depth) / 2));
  box-shadow: none;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg]:after {
  position: absolute;
  inset: 0;
  background: radial-gradient(55% 42% at var(--glint-x, 32%) var(--glint-y, 18%),
        #fff6ea17,
        transparent 58%),
      linear-gradient(125deg,
        #fff6ea1a 0%,
        transparent 42%,
        #241b260f 100%);
  pointer-events: none;
  content: "";
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__spine[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__pages[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__back[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__top[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__bottom[data-astro-cid-q6rhixpg] {
  backface-visibility: hidden;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__spine[data-astro-cid-q6rhixpg] {
  left: 50%;
  width: var(--book-depth);
  margin-left: calc(var(--book-depth) / -2);
  overflow: hidden;
  background: var(--spine-color);
  transform-origin: center;
  transform: rotateY(-90deg) translateZ(calc(var(--book-width) / 2));
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__spine[data-astro-cid-q6rhixpg]:after {
  position: absolute;
  inset: 0;
  background: linear-gradient(#fff6ea29, #0000 40%, #12141a1f);
  pointer-events: none;
  content: "";
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__pages[data-astro-cid-q6rhixpg] {
  inset: auto;
  top: 0;
  left: 50%;
  width: var(--book-depth);
  height: 100%;
  margin-left: calc(var(--book-depth) / -2);
  border-radius: 0;
  transform-origin: center;
  transform: rotateY(90deg) translateZ(calc(var(--book-width) / 2));
  background: #f3ead8;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__pages[data-astro-cid-q6rhixpg]:after {
  position: absolute;
  inset: 0;
  background: linear-gradient(#ffffff14, #12141a29);
  pointer-events: none;
  content: "";
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__back[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__top[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__bottom[data-astro-cid-q6rhixpg] {
  position: absolute;
  overflow: hidden;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__back[data-astro-cid-q6rhixpg] {
  inset: 0;
  background: var(--spine-color);
  transform: rotateY(180deg) translateZ(calc(var(--book-depth) / 2));
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__back[data-astro-cid-q6rhixpg] .book__face-image[data-astro-cid-q6rhixpg] {
  transform: scaleX(-1);
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__top[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] .book__bottom[data-astro-cid-q6rhixpg] {
  left: 0;
  width: 100%;
  height: var(--book-depth);
  background: #f3ead8;
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__top[data-astro-cid-q6rhixpg] {
  top: 50%;
  margin-top: calc(var(--book-depth) / -2);
  transform: rotateX(90deg) translateZ(calc(var(--book-height) / 2));
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__top[data-astro-cid-q6rhixpg]:after {
  position: absolute;
  inset: 0;
  background: #fff6ea2e;
  pointer-events: none;
  content: "";
}

.book-wrap--hero[data-astro-cid-q6rhixpg] .book__bottom[data-astro-cid-q6rhixpg] {
  top: 50%;
  margin-top: calc(var(--book-depth) / -2);
  transform: rotateX(-90deg) translateZ(calc(var(--book-height) / 2));
  filter: brightness(.72);
}

.book__face-image[data-astro-cid-q6rhixpg] {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.book-scene[data-astro-cid-q6rhixpg] {
  perspective: 900px;
  perspective-origin: 50% 40%;
  width: var(--book-width);
  height: var(--book-height);
  overflow: visible;
}

.book[data-astro-cid-q6rhixpg] {
  position: relative;
  width: 100%;
  height: 100%;
  transform: rotateY(-10deg);
  transform-origin: 0;
  transform-style: preserve-3d;
  transition: transform .4s;
}

.book-wrap--detail[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg] {
  transform: rotateY(-6deg);
}

.book__cover[data-astro-cid-q6rhixpg] {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 2px 5px 5px 2px;
  transform-origin: 0;
  transform-style: preserve-3d;
  transform: translateZ(calc(var(--book-depth) / 2));
  backface-visibility: hidden;
  transition: transform .4s;
  box-shadow: 0 1px #241b261f;
}

.book__image[data-astro-cid-q6rhixpg] {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.book__spine[data-astro-cid-q6rhixpg] {
  position: absolute;
  top: 0;
  left: 0;
  width: var(--book-depth);
  height: 100%;
  transform-origin: 0;
  transform: rotateY(-90deg);
  background: linear-gradient(90deg,
      color-mix(in oklab, var(--spine-color) 72%, black),
      var(--spine-color),
      color-mix(in oklab, var(--spine-color) 82%, white));
}

.book__pages[data-astro-cid-q6rhixpg] {
  position: absolute;
  top: 4px;
  right: 0;
  bottom: 4px;
  width: var(--book-depth);
  border-radius: 0 1px 1px 0;
  transform: translateX(1px) translateZ(calc(var(--book-depth) / -5));
  background: repeating-linear-gradient(to right, #f7f1e6 0 1px, #e4d9c6 1px 2px);
}

.book-shadow[data-astro-cid-q6rhixpg] {
  width: 72%;
  height: .7rem;
  margin-top: .45rem;
  background: radial-gradient(#241b2647, #0000 72%);
}

@media (hover: hover) {
  .group\/link:hover .book[data-astro-cid-q6rhixpg] {
    transform: rotateY(-6deg) translateY(-.5rem);
  }

  .group\/link:hover .book__cover[data-astro-cid-q6rhixpg] {
    transform: translateZ(calc(var(--book-depth) / 2)) rotateY(-20deg);
  }

  .group\/link:hover .book-wrap--hero[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg] {
    transform: none;
  }

  .group\/link:hover .book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg] {
    transform: translateZ(calc(var(--book-depth) / 2));
  }
}

.group\/link:focus-visible .book[data-astro-cid-q6rhixpg] {
  transform: rotateY(-6deg) translateY(-.5rem);
}

.group\/link:focus-visible .book__cover[data-astro-cid-q6rhixpg] {
  transform: translateZ(calc(var(--book-depth) / 2)) rotateY(-20deg);
}

.group\/link:focus-visible .book-wrap--hero[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg] {
  transform: none;
}

.group\/link:focus-visible .book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg] {
  transform: translateZ(calc(var(--book-depth) / 2));
}

@media (prefers-reduced-motion: reduce) {
  .book[data-astro-cid-q6rhixpg], .book__cover[data-astro-cid-q6rhixpg], .book-wrap--hero[data-astro-cid-q6rhixpg] {
    transition: none;
  }

  .book-wrap--hero[data-astro-cid-q6rhixpg] {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    --lift: 0px;
    transform: none;
  }

  .group\/link:hover .book[data-astro-cid-q6rhixpg], .group\/link:focus-visible .book[data-astro-cid-q6rhixpg] {
    transform: rotateY(-10deg);
  }

  .group\/link:hover .book__cover[data-astro-cid-q6rhixpg], .group\/link:focus-visible .book__cover[data-astro-cid-q6rhixpg] {
    transform: translateZ(calc(var(--book-depth) / 2));
  }

  .group\/link:hover .book-wrap--hero[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg], .group\/link:focus-visible .book-wrap--hero[data-astro-cid-q6rhixpg] .book[data-astro-cid-q6rhixpg] {
    transform: none;
  }

  .group\/link:hover .book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg], .group\/link:focus-visible .book-wrap--hero[data-astro-cid-q6rhixpg] .book__cover[data-astro-cid-q6rhixpg] {
    transform: translateZ(calc(var(--book-depth) / 2));
  }
}

@supports not (transform-style: preserve-3d) {
  .book[data-astro-cid-q6rhixpg] {
    transform: none;
  }

  .book__spine[data-astro-cid-q6rhixpg], .book__pages[data-astro-cid-q6rhixpg] {
    display: none;
  }

  .book__cover[data-astro-cid-q6rhixpg] {
    transform: none;
    box-shadow: var(--shadow-md-2);
  }
}
