/* ==========================================================
   Basta Books — Single Book Detail Styles
   Scoped under .bb-detail so it never leaks into the theme
   ========================================================== */

.bb-detail{
  background:#000;
  color:#fff;
  font-family:Georgia,serif;
}
.bb-detail *, .bb-detail *::before, .bb-detail *::after{ box-sizing:border-box; }

/*==================================
BOOK HERO
==================================*/
.bb-detail .book-hero{ padding:90px 20px; background:#050505; }
.bb-detail .book-container{ max-width:1280px; margin:auto; display:flex; align-items:center; gap:90px; }

.bb-detail .book-image{ width:320px; flex-shrink:0; }
.bb-detail .book-image img{ width:100%; display:block; box-shadow:0 30px 70px rgba(0,0,0,.45); border-radius:4px; }

.bb-detail .book-content{ flex:1; }
.bb-detail .book-category{ display:inline-block; color:#c79c49; text-transform:uppercase; letter-spacing:3px; font-size:12px; font-weight:700; margin-bottom:20px; }
.bb-detail .book-content h1{ font-size:52px; line-height:1.1; margin-bottom:26px; font-weight:600; }
.bb-detail .book-content p.book-desc{ max-width:700px; color:#b8b8b8; line-height:1.9; font-size:17px; margin-bottom:40px; }

.bb-detail .book-buttons{ display:flex; gap:20px; margin-bottom:50px; flex-wrap:wrap; }
.bb-detail .book-buttons a{ text-decoration:none; padding:16px 38px; border-radius:50px; font-size:15px; transition:.35s; font-weight:600; }
.bb-detail .btn-outline{ border:1px solid #c79c49; color:#d5b067; }
.bb-detail .btn-outline:hover{ background:#c79c49; color:#000; }
.bb-detail .btn-gold{ background:#d5b067; color:#111; }
.bb-detail .btn-gold:hover{ transform:translateY(-3px); }

.bb-detail .book-info{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:640px; }
.bb-detail .info-box{ border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:20px; background:#111; }
.bb-detail .info-box small{ display:block; color:#8b8b8b; text-transform:uppercase; letter-spacing:2px; margin-bottom:10px; font-size:11px; }
.bb-detail .info-box strong{ font-size:16px; color:#fff; }

@media(max-width:991px){
  .bb-detail .book-container{ flex-direction:column; text-align:center; }
  .bb-detail .book-content h1{ font-size:42px; }
  .bb-detail .book-content p.book-desc{ margin:auto auto 36px; }
  .bb-detail .book-buttons{ justify-content:center; }
  .bb-detail .book-info{ margin:auto; }
}
@media(max-width:768px){
  .bb-detail .book-image{ width:230px; }
  .bb-detail .book-content h1{ font-size:32px; }
  .bb-detail .book-buttons{ flex-direction:column; }
  .bb-detail .book-info{ grid-template-columns:1fr; }
}

/*==================================
ABOUT BOOK
==================================*/
.bb-detail .book-about{ background:#F7F4EE; padding:110px 20px; border-top:1px solid rgba(0,0,0,.08); border-bottom:1px solid rgba(0,0,0,.08); }
.bb-detail .about-grid{ display:grid; grid-template-columns:340px 1fr; gap:80px; align-items:start; }

.bb-detail .section-tag{ display:inline-block; font-size:11px; letter-spacing:3px; color:#B89343; font-weight:700; margin-bottom:18px; position:relative; }
.bb-detail .section-tag:after{ content:""; display:block; width:55px; height:2px; background:#B89343; margin-top:12px; }

.bb-detail .about-left h2{ color:#111; font-size:46px; line-height:1.15; font-weight:500; }
.bb-detail .about-left h2 span{ display:block; color:#C59D4C; font-style:italic; }

.bb-detail .about-right{ max-width:760px; color:#666; }
.bb-detail .about-right p{ color:#666; line-height:2; font-size:17px; margin-bottom:32px; }

@media(max-width:991px){
  .bb-detail .about-grid{ grid-template-columns:1fr; gap:44px; }
  .bb-detail .about-left{ text-align:center; }
  .bb-detail .section-tag:after{ margin:12px auto 0; }
  .bb-detail .about-left h2{ font-size:38px; }
  .bb-detail .about-right{ max-width:100%; }
}
@media(max-width:768px){
  .bb-detail .book-about{ padding:70px 20px; }
  .bb-detail .about-left h2{ font-size:30px; }
  .bb-detail .about-right p{ font-size:16px; line-height:1.9; }
}

/*==================================
MORE BOOKS
==================================*/
.bb-detail .more-books{ background:#F7F4EE; padding:100px 20px 120px; }
.bb-detail .more-heading{ text-align:center; margin-bottom:60px; }
.bb-detail .more-heading h2{ color:#111; font-size:44px; line-height:1.2; font-weight:500; }
.bb-detail .more-heading h2 span{ color:#C59D4C; font-style:italic; }

.bb-detail .books-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.bb-detail .book-card{ transition:.35s; display:block; }
.bb-detail .book-thumb{ overflow:hidden; border-radius:6px; background:#ddd; aspect-ratio:3/4; }
.bb-detail .book-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:.5s; }
.bb-detail .book-card:hover{ transform:translateY(-8px); }
.bb-detail .book-card:hover img{ transform:scale(1.06); }
.bb-detail .book-details{ margin-top:18px; }
.bb-detail .book-details span{ display:block; font-size:11px; color:#B89343; letter-spacing:2px; margin-bottom:10px; text-transform:uppercase; }
.bb-detail .book-details h3{ color:#111; font-size:19px; line-height:1.5; font-weight:500; }

@media(max-width:991px){
  .bb-detail .books-grid{ grid-template-columns:repeat(2,1fr); gap:30px; }
  .bb-detail .more-heading h2{ font-size:36px; }
}
@media(max-width:768px){
  .bb-detail .more-books{ padding:70px 20px; }
  .bb-detail .books-grid{ grid-template-columns:1fr; }
  .bb-detail .more-heading h2{ font-size:28px; }
  .bb-detail .book-details h3{ font-size:17px; }
}