.book-container {
    perspective: 2500px;
}

.books-ui {
    font-family: "Plus Jakarta Sans", Inter, sans-serif;
    background-image:
        radial-gradient(circle, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0) 70%),
        radial-gradient(circle, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0) 70%),
        linear-gradient(180deg, #60A5FA 0%, #93C5FD 40%, #FFFFFF 100%);
    background-size: 24rem 24rem, 32rem 32rem, 100% 100%;
    background-position: 2.5rem 5rem, calc(100% - 2.5rem) 8rem, center;
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-attachment: fixed, fixed, fixed;
}

.books-ui .font-serif {
    font-family: "Playfair Display", Georgia, serif;
}

.a4-page {
    aspect-ratio: 210 / 297;
}

@media (min-width: 768px) {
    .a4-page {
        height: min(calc(100vh - 40px), 2200px);
        width: auto;
        max-width: 100%;
    }
}

.book-spread {
    position: relative;
    transform-style: preserve-3d;
    perspective: 2500px;
    box-shadow: 0 30px 70px -15px rgba(10, 29, 55, 0.18), 0 20px 40px -20px rgba(10, 29, 55, 0.25), inset 0 0 50px rgba(139, 94, 60, 0.04);
    transition: transform 0.15s ease-out;
    aspect-ratio: 210 / 297;
}

.book-spread .a4-page {
    width: 100%;
    height: 100%;
    max-width: none;
}

.page-flip-layer {
    position: absolute;
    inset: 0;
    z-index: 20;
    pointer-events: none;
    display: none;
    transform-style: preserve-3d;
}

.page-flip-layer.is-active {
    display: block;
}

.page-flip-rotator {
    position: absolute;
    inset: 0;
    transform-style: preserve-3d;
    transform-origin: left center;
}

.page-flip-face {
    position: absolute;
    inset: 0;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border-radius: inherit;
}

.page-flip-front {
    transform: rotateY(0deg);
}

.page-flip-back {
    transform: rotateY(180deg);
}

.page-flip-shadow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    z-index: 10;
}

/* Next Turn (Right to Left) */
.page-flip-layer.flip-next .page-flip-rotator {
    animation: pageFlipNextRotator 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}
.page-flip-layer.flip-next .page-flip-front .page-flip-shadow {
    background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,0.15) 100%);
    animation: fadeInShadow 700ms forwards;
}
.page-flip-layer.flip-next .page-flip-back .page-flip-shadow {
    background: linear-gradient(to left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%);
    animation: fadeOutShadow 700ms forwards;
}

/* Prev Turn (Left to Right) */
.page-flip-layer.flip-prev .page-flip-rotator {
    animation: pageFlipPrevRotator 700ms cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}
.page-flip-layer.flip-prev .page-flip-front .page-flip-shadow {
    background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,0.15) 100%);
    animation: fadeOutShadow 700ms forwards;
}
.page-flip-layer.flip-prev .page-flip-back .page-flip-shadow {
    background: linear-gradient(to left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%);
    animation: fadeInShadow 700ms forwards;
}

@keyframes pageFlipNextRotator {
    0% { transform: translateZ(1px) rotateY(0deg); }
    50% { transform: translateZ(60px) rotateY(-90deg); }
    100% { transform: translateZ(1px) rotateY(-180deg); }
}

@keyframes pageFlipPrevRotator {
    0% { transform: translateZ(1px) rotateY(-180deg); }
    50% { transform: translateZ(60px) rotateY(-90deg); }
    100% { transform: translateZ(1px) rotateY(0deg); }
}

@keyframes fadeInShadow {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes fadeOutShadow {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

/* Base shadow on the underlying page during flip */
.page-spine-shadow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 15;
    background: linear-gradient(to right, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 15%);
    opacity: 0;
}
.page-flip-layer.is-active ~ .page-spine-shadow {
    animation: pulseSpineShadow 700ms ease-in-out forwards;
}
@keyframes pulseSpineShadow {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; }
}

.blank-page {
    background-color: #f8fafc;
    background-image: linear-gradient(to right, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 10%);
}



.books-ui {
    --book-page-pad-x: 24px;
    --book-page-pad-top: 20px;
    --book-page-pad-bottom: 18px;
    --book-page-footer-top: 14px;
}

/* Font Sizes */
.text-\[18px\] { font-size: 18px !important; line-height: 1.8 !important; }
.text-\[20px\] { font-size: 20px !important; line-height: 1.8 !important; }
.text-\[22px\] { font-size: 22px !important; line-height: 1.85 !important; }

@media (min-width: 640px) {
    .books-ui {
        --book-page-pad-x: 40px;
        --book-page-pad-top: 22px;
        --book-page-pad-bottom: 20px;
        --book-page-footer-top: 16px;
    }
}

@media (min-width: 1024px) {
    .books-ui {
        --book-page-pad-x: 56px;
        --book-page-pad-top: 24px;
        --book-page-pad-bottom: 22px;
        --book-page-footer-top: 18px;
    }
}

.book-page-header,
#page-content,
.page-flip-content,
.book-page-footer {
    padding-left: var(--book-page-pad-x);
    padding-right: var(--book-page-pad-x);
}

.book-page-header {
    padding-top: var(--book-page-pad-top);
}

#page-content,
.page-flip-content {
    padding-top: var(--book-page-pad-top);
}

.book-page-footer {
    padding-top: var(--book-page-footer-top);
    padding-bottom: var(--book-page-pad-bottom);
}

.book-spine-divider {
    background: linear-gradient(to right, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.2) 25%, rgba(255,255,255,0.15) 50%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0.08) 100%);
    box-shadow: inset 0 0 10px rgba(0,0,0,0.2);
}

.backface-hidden {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.flipping-shadow {
    background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,0.12) 50%, rgba(0,0,0,0) 100%);
    mix-blend-mode: multiply;
}

.grab-cursor {
    cursor: grab;
}

.grabbing-cursor {
    cursor: grabbing !important;
}

.paper-texture {
    background-color: #fdfbf7;
    background-image: radial-gradient(rgba(139, 94, 60, 0.015) 1px, transparent 0), radial-gradient(rgba(0, 0, 0, 0.01) 1px, transparent 0);
    background-size: 12px 12px;
    background-position: 0 0, 6px 6px;
}

.book-cover-3d {
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s ease;
    transform: perspective(1000px) rotateY(-18deg) rotateX(4deg);
    box-shadow: -4px 4px 0px #00458e, -8px 8px 0px #0a1d37, -12px 12px 25px rgba(10, 29, 55, 0.2);
}

.book-cover-3d:hover {
    transform: perspective(1000px) rotateY(-5deg) rotateX(2deg) scale(1.04);
    box-shadow: -2px 2px 0px #00458e, -4px 4px 0px #0a1d37, -8px 8px 18px rgba(10, 29, 55, 0.3);
}

.custom-scrollbar::-webkit-scrollbar {
    width: 5px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.01);
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(0, 73, 142, 0.15);
    border-radius: 99px;
}

@keyframes mobileSlideLeft {
    0% { transform: translateX(0); opacity: 1; }
    45% { transform: translateX(-100%); opacity: 0; }
    55% { transform: translateX(100%); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}
@keyframes mobileSlideRight {
    0% { transform: translateX(0); opacity: 1; }
    45% { transform: translateX(100%); opacity: 0; }
    55% { transform: translateX(-100%); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}
.mobile-anim-left {
    animation: mobileSlideLeft 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
.mobile-anim-right {
    animation: mobileSlideRight 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

@keyframes chapterTurnNext {
    0% { transform: rotateY(0deg) translateX(0); opacity: 1; }
    60% { transform: rotateY(-12deg) translateX(-40px); opacity: 0.25; }
    100% { transform: rotateY(-18deg) translateX(-60px); opacity: 0; }
}
@keyframes chapterTurnPrev {
    0% { transform: rotateY(0deg) translateX(0); opacity: 1; }
    60% { transform: rotateY(12deg) translateX(40px); opacity: 0.25; }
    100% { transform: rotateY(18deg) translateX(60px); opacity: 0; }
}
.chapter-anim-next {
    animation: chapterTurnNext 0.38s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    transform-origin: left center;
}
.chapter-anim-prev {
    animation: chapterTurnPrev 0.38s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    transform-origin: right center;
}

.book-chapter-content {
    font-family: Georgia, "Times New Roman", serif;
    color: #1f2937;
    line-height: 1.85;
    font-size: inherit;
}

.book-chapter-content p {
    margin: 0 0 1.1em 0;
}

.book-chapter-content p:last-child {
    margin-bottom: 0;
}

.book-chapter-content h1,
.book-chapter-content h2,
.book-chapter-content h3,
.book-chapter-content h4,
.book-chapter-content h5,
.book-chapter-content h6 {
    font-family: Georgia, "Times New Roman", serif;
    color: #0a1d37;
    line-height: 1.3;
    margin: 1.6em 0 0.5em 0;
    font-weight: 700;
}

.book-chapter-content h1 { font-size: 1.7em; font-weight: 800; }
.book-chapter-content h2 { font-size: 1.4em; font-weight: 800; border-bottom: 1px solid rgba(0,0,0,0.08); padding-bottom: 0.3em; }
.book-chapter-content h3 { font-size: 1.2em; font-weight: 700; }
.book-chapter-content h4 { font-size: 1.05em; font-weight: 700; }
.book-chapter-content h5 { font-size: 0.95em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.book-chapter-content h6 { font-size: 0.9em; font-weight: 700; color: #475569; }

.book-chapter-content h1:first-child,
.book-chapter-content h2:first-child,
.book-chapter-content h3:first-child,
.book-chapter-content h4:first-child,
.book-chapter-content h5:first-child,
.book-chapter-content h6:first-child {
    margin-top: 0;
}

.book-chapter-content strong, .book-chapter-content b {
    font-weight: 700;
    color: #0a1d37;
}

.book-chapter-content em, .book-chapter-content i {
    font-style: italic;
}

.book-chapter-content a {
    color: #00458e;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}

.book-chapter-content a:hover {
    color: #00336a;
}

.book-chapter-content ul,
.book-chapter-content ol {
    margin: 0.8em 0 1em 0;
    padding-left: 1.6em;
    list-style: disc !important;
}

.book-chapter-content ul {
    list-style-type: disc !important;
}

.book-chapter-content ol {
    list-style-type: decimal !important;
}

.book-chapter-content li {
    margin: 0.25em 0 0.25em 0;
    padding-left: 0.3em;
    list-style: inherit !important;
}

.book-chapter-content li::marker {
    color: #00458e !important;
    font-weight: 700 !important;
}

.book-chapter-content ul ul,
.book-chapter-content ol ol,
.book-chapter-content ul ol,
.book-chapter-content ol ul {
    margin: 0.3em 0;
    list-style: disc !important;
}

.book-chapter-content ol ol,
.book-chapter-content ul ol {
    list-style: decimal !important;
}

.book-chapter-content blockquote {
    margin: 1.2em 0;
    padding: 0.8em 1.2em;
    border-left: 4px solid #00458e;
    background: rgba(0, 69, 142, 0.04);
    font-style: italic;
    color: #334155;
    border-radius: 0 6px 6px 0;
}

.book-chapter-content blockquote p {
    margin: 0;
}

.book-chapter-content blockquote cite {
    display: block;
    margin-top: 0.5em;
    font-size: 0.85em;
    font-style: normal;
    color: #64748b;
}

.book-chapter-content pre,
.book-chapter-content code {
    font-family: "Courier New", Courier, monospace;
    font-size: 0.88em;
    background: #f1f5f9;
    border-radius: 4px;
}

.book-chapter-content code {
    padding: 0.15em 0.4em;
    color: #1e3a5f;
}

.book-chapter-content pre {
    padding: 1em 1.2em;
    overflow-x: auto;
    margin: 1em 0;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.book-chapter-content pre code {
    padding: 0;
    background: none;
    color: inherit;
    font-size: 0.85em;
}

.book-chapter-content hr {
    border: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    margin: 2em 0;
}

.book-chapter-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
    font-size: 0.9em;
}

.book-chapter-content table th {
    background: #f1f5f9;
    font-weight: 700;
    text-align: left;
    padding: 0.5em 0.8em;
    border: 1px solid #e2e8f0;
    color: #0a1d37;
}

.book-chapter-content table td {
    padding: 0.5em 0.8em;
    border: 1px solid #e2e8f0;
    vertical-align: top;
}

.book-chapter-content table tr:nth-child(even) td {
    background: #f8fafc;
}

.book-chapter-content figure {
    margin: 1em 0;
}

.book-chapter-content figcaption {
    font-size: 0.85em;
    color: #64748b;
    text-align: center;
    margin-top: 0.4em;
    font-style: italic;
}

.book-chapter-content img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    display: block;
    margin: 0.5em auto;
}

.book-chapter-content .wp-block-pullquote {
    margin: 1.5em 0;
    padding: 1.2em 1.5em;
    border-top: 4px solid #00458e;
    border-bottom: 4px solid #00458e;
    background: rgba(0, 69, 142, 0.03);
    font-style: italic;
    font-size: 1.1em;
    text-align: center;
    color: #1e3a5f;
}

.book-chapter-content .wp-block-pullquote p {
    margin: 0;
    font-size: inherit;
}

.book-chapter-content .wp-block-quote {
    margin: 1.2em 0;
    padding: 0.8em 1.2em;
    border-left: 4px solid #00458e;
    background: rgba(0, 69, 142, 0.04);
    border-radius: 0 6px 6px 0;
}

.book-chapter-content .wp-block-quote p {
    margin: 0 0 0.5em 0;
}

.book-chapter-content .wp-block-quote p:last-child {
    margin-bottom: 0;
}

.book-chapter-content .wp-block-group {
    margin: 1em 0;
}

.book-chapter-content .has-background {
    padding: 1em;
    border-radius: 4px;
}

.book-chapter-content .has-text-align-center { text-align: center; }
.book-chapter-content .has-text-align-left { text-align: left; }
.book-chapter-content .has-text-align-right { text-align: right; }

.book-chapter-content .has-large-font-size { font-size: 1.4em; line-height: 1.4; }
.book-chapter-content .has-larger-font-size { font-size: 1.7em; line-height: 1.3; }
.book-chapter-content .has-small-font-size { font-size: 0.85em; }

.book-chapter-content .has-text-color { color: inherit; }
.book-chapter-content .has-primary-color { color: #00458e; }
.book-chapter-content .has-secondary-color { color: #0a1d37; }
.book-chapter-content .has-background-color { background-color: inherit; }

.dropcap > p:first-child::first-letter,
.book-chapter-content > p:first-child::first-letter {
    float: left;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 4.2em;
    line-height: 0.78;
    padding-right: 0.1em;
    padding-top: 0.05em;
    color: #00458e;
    font-weight: 800;
}

@media (min-width: 768px) {
    .book-chapter-content {
        font-size: inherit;
    }
}

@media (min-width: 1024px) {
    .book-chapter-content {
        font-size: inherit;
    }
}

.book-chapter-content p {
    margin: 0 0 1.1em 0;
    text-indent: 0;
}

.book-chapter-content h2,
.book-chapter-content h3,
.book-chapter-content h4 {
    color: #0a1d37;
    font-weight: 800;
    margin: 1.4em 0 0.6em 0;
}

.dropcap > p:first-of-type::first-letter {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 3.8rem;
    float: left;
    line-height: 0.8;
    padding-right: 12px;
    padding-top: 6px;
    font-weight: 900;
    color: #00458e;
    text-shadow: 1px 1px 0px rgba(0,0,0,0.05);
}

.js-book-nav a[aria-disabled="true"] {
    pointer-events: none;
    background: #f1f5f9 !important;
    color: #94a3b8 !important;
    border-color: #e2e8f0 !important;
    box-shadow: none !important;
}
