/* Books page */
body { background: #f8f4ec; }
.b-hero { position: relative; height: 720px; overflow: hidden; }
.b-hero .bg { position: absolute; left: 50%; top: 0; width: 1441px; height: 720px; margin-left: -721px; max-width: none; object-fit: cover; }
.b-hero .fade { position: absolute; left: 0; top: 0; width: 554px; height: 720px; background: linear-gradient(to left, rgba(255, 233, 194, 0), #ffe9c2); }
.b-hero .wrap { height: 720px; }
.b-copy { position: absolute; left: 79px; top: 152px; width: 620px; }
.b-copy h1 { font: 800 64px/73.6px 'Spectral', serif; color: #0b1530; }
.b-copy h1 span { display: block; }
.b-copy h1 span + span { margin-top: 4px; }
.b-copy h1 em { display: block; margin-top: 4px; font: 400 54px/59.4px 'Caveat', cursive; font-style: normal; color: #d98638; }
.b-copy .l { margin-top: 20px; font: 400 24px/38.4px 'Geist', sans-serif; color: #444e66; }
.b-copy .rr { margin-top: 20px; font: 700 32px/41.6px 'Geist', sans-serif; color: #0b1530; }
.b-copy .acc { display: flex; align-items: center; gap: 8px; margin-top: 20px; padding-top: 20px; font: 700 20px/26px 'Geist', sans-serif; color: #0b1530; }
.b-copy .acc i { display: block; width: 40px; height: 4px; background: #ff9d41; }
.books { background: #f8f4ec; }
.books .wrap { padding: 64px 80px 100px; }
.books .hd { text-align: center; }
.books .hd small { display: block; font: 700 20px/26px 'Geist', sans-serif; color: #aa7119; }
.books .hd h2 { margin-top: 12px; font: 700 32px/48.7px 'Spectral', serif; color: #0b1530; }
.brow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 56px; }
.bcard { display: flex; flex-direction: column; gap: 24px; padding: 32px; background: #fff; border: 1px solid #e8ddcf; border-radius: 24px; box-shadow: 0 8px 24px rgba(0, 0, 0, .03); transition: transform .35s var(--ease), box-shadow .35s ease; }
.bcard:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(0, 0, 0, .08); }
.bidx { display: flex; align-items: center; gap: 8px; font: 700 14px/18.2px 'Geist', sans-serif; color: #d98638; }
.bidx::after { content: ""; flex: 1; height: 1px; background: #e8ddcf; }
.bcover { margin-top: 16px; width: 100%; height: 435px; object-fit: cover; border-radius: 4px; }
.bcard h3 { font: 700 24px/31.2px 'Spectral', serif; color: #0b1530; }
.bcard .sub { margin-top: 12px; font: 600 14px/18.2px 'Geist', sans-serif; color: #d98638; }
.bcard .d { margin-top: 12px; font: 400 13px/19.5px 'Geist', sans-serif; color: #444e66; }
.bcard hr { border: 0; height: 1px; background: #e8ddcf; margin: 0; }
.feat { display: flex; gap: 8px; }
.feat div { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; font: 500 11px/14.3px 'Geist', sans-serif; color: #444e66; }
.feat svg { width: 20px; height: 20px; color: #0b1530; }
.soon { display: flex; align-items: center; justify-content: center; height: 42px; border-radius: 12px; background: #f2eadb; font: 600 14px/18.2px 'Geist', sans-serif; color: #d98638; }
.bcard .info { flex: 1; display: flex; flex-direction: column; gap: 24px; }
.b-quote { position: relative; height: 490px; overflow: hidden; }
.b-quote .bg { position: absolute; left: 50%; top: 0; width: 1440px; height: 490px; margin-left: -720px; max-width: none; object-fit: cover; }
.b-quote .wrap { height: 490px; }
.bq { position: absolute; left: 200px; top: 97px; width: 540px; text-align: center; }
.bq h2 { font: 400 68px/68px 'Tinos', serif; color: #24231f; }
.bq h2 em { font-style: normal; font-weight: 700; color: #bd6400; }
.bq .au { margin-top: 24px; font: 400 25px/27.5px 'Tinos', serif; color: #24231f; }
.bq .orn { display: flex; align-items: center; justify-content: center; gap: 17px; margin: 15px auto 0; width: 372px; }
.bq .orn i { display: block; height: 1.2px; background: #d5800b; flex: 1; }
.bq .orn img { width: 38px; height: 30px; }
.bq small { display: block; margin-top: 15px; font: 500 16px/19.2px 'Montserrat', sans-serif; color: #24231f; }
@media (max-width: 899.98px) {
  .b-hero { height: auto; display: flex; flex-direction: column; }
  .b-hero .wrap { order: 1; height: auto; padding: 112px 24px 0; }
  .b-hero .bg { position: static; order: 2; width: 100%; height: 280px; margin: 28px 0 0; object-position: 75% 50%; }
  .b-hero .fade { display: none; }
  .b-copy { position: static; width: auto; }
  .b-copy h1 { font-size: 44px; line-height: 52px; }
  .b-copy h1 em { font-size: 38px; line-height: 44px; }
  .b-copy .l { font-size: 17px; line-height: 27px; }
  .b-copy .rr { font-size: 24px; line-height: 32px; }
  .b-copy .acc { font-size: 15px; padding-top: 8px; }
  .books .wrap { padding: 48px 24px 56px; }
  .books .hd h2 { font-size: 26px; line-height: 36px; }
  .brow { grid-template-columns: 1fr; margin-top: 32px; }
  .bcard { padding: 24px; }
  .bcover { height: auto; aspect-ratio: 4 / 5; }
  .b-quote { height: 360px; }
  .b-quote .wrap { height: 360px; }
  .b-quote .bg { width: auto; min-width: 100%; height: 360px; left: 0; margin-left: 0; object-position: 65% 50%; }
  .bq { left: 24px; top: 60px; width: calc(100% - 48px); }
  .bq h2 { font-size: 32px; line-height: 36px; }
  .bq .au { font-size: 17px; }
  .bq .orn { width: 240px; }
  .bq small { font-size: 11px; }
}