/* ==============================================================
   E-Book Storefront — Tier 1 MVP
   Each ebook brings its own --leather / --parchment / --spine
   palette via inline style on the card / detail wrapper.
   ============================================================== */

/* ---- Hero -------------------------------------------------- */
.ebs-hero {
    position: relative;
    padding: 4.5rem 1.5rem 3.5rem;
    text-align: center;
    background:
        radial-gradient(circle at 50% 0%, rgba(245, 232, 194, 0.06) 0%, transparent 60%),
        #0b0807;
    border-bottom: 1px solid rgba(245, 232, 194, 0.18);
    overflow: hidden;
}
.ebs-hero-content { max-width: 720px; margin: 0 auto; }
.ebs-hero-icon { font-size: 2.5rem; color: #d8c188; margin-bottom: .75rem; }
.ebs-hero-title {
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 900;
    color: #f1dfb1;
    margin: 0 0 .5rem;
    font-family: Georgia, 'Times New Roman', serif;
    letter-spacing: .02em;
}
.ebs-hero-sub { font-size: 1rem; color: rgba(245, 232, 194, 0.55); line-height: 1.7; }

/* ---- Section / grid --------------------------------------- */
.ebs-section { padding: 3rem 1.5rem 5rem; background: #0b0807; }
.ebs-inner { max-width: 1200px; margin: 0 auto; }

.ebs-empty { text-align: center; opacity: .5; font-style: italic; padding: 3rem 0; color: #c9b277; }

.ebs-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}
@media (min-width: 768px) { .ebs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .ebs-grid { grid-template-columns: repeat(3, 1fr); } }

/* ---- Book card (storefront tile) -------------------------- */
.ebs-book {
    --leather: #1f1612;
    --parchment: #f5e8c2;
    --spine: var(--leather);
    text-decoration: none;
    color: inherit;
    display: block;
    text-align: center;
    transition: transform .25s ease;
}
.ebs-book:hover { transform: translateY(-4px); }

.ebs-book-tome {
    position: relative;
    width: 100%;
    aspect-ratio: 2 / 3;
    border-radius: 4px 14px 14px 4px;
    background: var(--leather);
    box-shadow:
        inset 4px 0 0 0 var(--spine),
        inset 6px 0 0 0 rgba(0, 0, 0, .35),
        0 12px 28px rgba(0, 0, 0, .55),
        0 2px 0 rgba(255, 255, 255, .03) inset;
    overflow: hidden;
}
.ebs-book-cover {
    width: 100%; height: 100%; object-fit: cover; display: block;
    border-radius: 0 12px 12px 0;
}
.ebs-book-cover-placeholder {
    display: flex; align-items: center; justify-content: center;
    text-align: center;
    background: var(--parchment);
    color: var(--leather);
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 900;
    font-size: 1.15rem;
    padding: 1.5rem;
    line-height: 1.3;
    border-radius: 0 12px 12px 0;
}
.ebs-book-cover-title { display: block; }
.ebs-book-spine {
    position: absolute; left: 0; top: 0; bottom: 0; width: 6px;
    background: linear-gradient(90deg, rgba(0, 0, 0, .55), transparent);
    pointer-events: none;
}

.ebs-book-meta { padding: 1rem .5rem 0; }
.ebs-book-title {
    font-family: Georgia, serif;
    font-weight: 900;
    font-size: 1.05rem;
    color: #f1dfb1;
    margin-bottom: .15rem;
}
.ebs-book-author { font-size: .82rem; opacity: .55; color: #d8c188; font-style: italic; }
.ebs-book-badge {
    display: inline-block;
    margin-top: .5rem;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 3px 10px;
    border-radius: 999px;
}
.ebs-book-badge-soon { background: rgba(167, 139, 250, .2); color: #c9b8ff; }

/* ---- Detail page ------------------------------------------ */
.ebs-detail {
    --leather: #1f1612;
    --parchment: #f5e8c2;
    --spine: var(--leather);
    background:
        radial-gradient(circle at 80% 0%, rgba(245, 232, 194, 0.05), transparent 60%),
        #0b0807;
    padding: 3rem 1.5rem;
}
.ebs-detail-inner {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: start;
}
@media (min-width: 900px) { .ebs-detail-inner { grid-template-columns: minmax(240px, 320px) 1fr; } }

.ebs-detail-cover-wrap {
    position: relative;
    aspect-ratio: 2 / 3;
    background: var(--leather);
    border-radius: 4px 14px 14px 4px;
    box-shadow:
        inset 4px 0 0 0 var(--spine),
        inset 6px 0 0 0 rgba(0, 0, 0, .35),
        0 16px 36px rgba(0, 0, 0, .6);
    overflow: hidden;
}
.ebs-detail-cover { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0 12px 12px 0; }

.ebs-detail-meta { color: #f1dfb1; }
.ebs-detail-back {
    display: inline-block;
    font-size: .82rem;
    color: #c9b277;
    text-decoration: none;
    opacity: .65;
    margin-bottom: 1rem;
}
.ebs-detail-back:hover { opacity: 1; }

.ebs-detail-title {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    font-weight: 900;
    margin: 0 0 .35rem;
    line-height: 1.15;
}
.ebs-detail-subtitle { font-size: 1.1rem; opacity: .7; margin: 0 0 .5rem; font-style: italic; }
.ebs-detail-author { font-size: .95rem; color: #d8c188; opacity: .8; margin: 0 0 1.25rem; }
.ebs-detail-badge {
    display: inline-block;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 1.25rem;
}
.ebs-detail-badge-soon { background: rgba(167, 139, 250, .2); color: #c9b8ff; }

.ebs-detail-description {
    font-size: 1rem;
    line-height: 1.85;
    color: rgba(245, 232, 194, .82);
    margin: 0 0 1.75rem;
    white-space: pre-line;
}

.ebs-detail-cta { display: flex; flex-wrap: wrap; gap: .75rem; }

/* ---- Buttons ---------------------------------------------- */
.ebs-btn {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .85rem 1.5rem;
    border: 1px solid var(--parchment, #f5e8c2);
    border-radius: 6px;
    font-weight: 800;
    font-size: .92rem;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s, background .15s, color .15s;
    background: transparent;
    color: #f1dfb1;
}
.ebs-btn:hover { transform: translateY(-1px); }
.ebs-btn-buy {
    background: linear-gradient(180deg, #c9a14a, #8b6a2a);
    color: #1f1612;
    border-color: #c9a14a;
}
.ebs-btn-read {
    background: var(--parchment, #f5e8c2);
    color: var(--leather, #1f1612);
    border-color: var(--parchment, #f5e8c2);
}
.ebs-btn-secondary { opacity: .85; }
.ebs-btn[disabled] { opacity: .45; cursor: not-allowed; }

/* ---- Preview pages ---------------------------------------- */
.ebs-preview-section {
    --leather: #1f1612;
    --parchment: #f5e8c2;
    background: #0b0807;
    padding: 3.5rem 1.5rem 5rem;
    border-top: 1px solid rgba(245, 232, 194, .12);
}
.ebs-preview-heading {
    font-family: Georgia, serif;
    font-size: 1.5rem;
    font-weight: 900;
    color: #d8c188;
    text-align: center;
    margin: 0 0 2rem;
    letter-spacing: .04em;
}
.ebs-preview-stack { display: flex; flex-direction: column; gap: 1.5rem; max-width: 760px; margin: 0 auto; }
.ebs-preview-page {
    background: var(--parchment, #f5e8c2);
    color: var(--leather, #1f1612);
    border-radius: 6px;
    padding: 2.25rem 2rem;
    font-family: Georgia, 'Times New Roman', serif;
    line-height: 1.85;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .5);
}
.ebs-preview-page :where(h1, h2, h3) { font-family: inherit; color: var(--leather); }
.ebs-preview-page p { margin: 0 0 1rem; }
.ebs-preview-chapter {
    font-size: 1.3rem;
    font-weight: 900;
    text-align: center;
    margin: 0 0 1.5rem;
    color: var(--leather, #1f1612);
    letter-spacing: .04em;
    text-transform: uppercase;
}
.ebs-preview-pagenum {
    text-align: center;
    margin-top: 1.5rem;
    font-size: .82rem;
    opacity: .55;
    font-style: italic;
}
.ebs-preview-footer { text-align: center; margin-top: 2.5rem; }

@media (max-width: 600px) {
    .ebs-preview-page { padding: 1.5rem 1.25rem; }
}