/* =========================================================
   HOME PAGE ANIMATIONS
   Elegant • Smooth • Left & Right Reveal
========================================================= */


/* =========================================================
   HERO PAGE LOAD
========================================================= */

.home-content {
    animation: heroReveal 1s ease-out 0.15s both;
}

@keyframes heroReveal {

    0% {
        opacity: 0;
        transform: translateY(35px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =========================================================
   BOOK SECTION
   Text → LEFT
   Image → RIGHT
========================================================= */

.home-book .book-text {

    opacity: 0;

    transform: translateX(-80px);

    transition:
        opacity 0.9s ease,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);

    will-change: opacity, transform;
}


.home-book .book-image {

    opacity: 0;

    transform: translateX(80px);

    transition:
        opacity 0.9s ease 0.12s,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.12s;

    will-change: opacity, transform;
}


/* BOOK ACTIVE */

.home-book.show .book-text {

    opacity: 1;

    transform: translateX(0);
}


.home-book.show .book-image {

    opacity: 1;

    transform: translateX(0);
}


/* =========================================================
   INTRODUCTION SECTION
   Image → LEFT
   Text → RIGHT
========================================================= */

.home-introduction .intro-image {

    opacity: 0;

    transform: translateX(-80px);

    transition:
        opacity 0.9s ease,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);

    will-change: opacity, transform;
}


.home-introduction .intro-text {

    opacity: 0;

    transform: translateX(80px);

    transition:
        opacity 0.9s ease 0.12s,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.12s;

    will-change: opacity, transform;
}


/* INTRODUCTION ACTIVE */

.home-introduction.show .intro-image {

    opacity: 1;

    transform: translateX(0);
}


.home-introduction.show .intro-text {

    opacity: 1;

    transform: translateX(0);
}


/* =========================================================
   VIDEO TRAILER SECTION
========================================================= */

.home-trailer .trailer-content {

    opacity: 0;

    transform: translateY(60px);

    transition:
        opacity 0.9s ease,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);

    will-change: opacity, transform;
}


/* VIDEO ACTIVE */

.home-trailer.show .trailer-content {

    opacity: 1;

    transform: translateY(0);
}


/* =========================================================
   CONTACT CTA
========================================================= */

.contact-cta .cta-content {

    opacity: 0;

    transform: translateY(60px);

    transition:
        opacity 0.9s ease,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);

    will-change: opacity, transform;
}


/* CTA ACTIVE */

.contact-cta.show .cta-content {

    opacity: 1;

    transform: translateY(0);
}


/* =========================================================
   INTRO IMAGE HOVER
========================================================= */

.intro-frame {

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


.intro-frame:hover {

    transform: translateY(-8px);

    box-shadow:
        0 25px 55px rgba(0, 0, 0, 0.16),
        0 8px 20px rgba(0, 0, 0, 0.08);
}


/* =========================================================
   BOOK IMAGE HOVER
========================================================= */

.book-image img {

    transition:
        transform 0.4s ease,
        filter 0.4s ease;
}


.book-image img:hover {

    transform: translateY(-10px) scale(1.02);
}


/* =========================================================
   VIDEO HOVER
========================================================= */

.trailer-video {

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


.trailer-video:hover {

    transform: translateY(-5px);

    box-shadow:
        0 25px 60px rgba(0, 0, 0, 0.20);
}


/* =========================================================
   BUTTON ANIMATIONS
========================================================= */

.home-btn,
.read-more-btn,
.book-btn,
.trailer-btn,
.highlights-btn,
.cta-btn {

    transition:
        transform 0.3s ease,
        background-color 0.3s ease,
        color 0.3s ease,
        box-shadow 0.3s ease;
}


.home-btn:hover,
.read-more-btn:hover,
.book-btn:hover,
.trailer-btn:hover,
.highlights-btn:hover,
.cta-btn:hover {

    transform: translateY(-4px);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.12);
}


/* =========================================================
   NAVIGATION HOVER
========================================================= */

.nav-menu li a {

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.nav-menu li a:hover {

    transform: translateY(-2px);
}


/* =========================================================
   FOOTER
========================================================= */

.site-footer {

    animation: footerReveal 1s ease-out both;
}


@keyframes footerReveal {

    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .home-book .book-text {

        transform: translateX(-60px);
    }


    .home-book .book-image {

        transform: translateX(60px);
    }


    .home-introduction .intro-image {

        transform: translateX(-60px);
    }


    .home-introduction .intro-text {

        transform: translateX(60px);
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    /* -----------------------------------------
       BOOK
    ----------------------------------------- */

    .home-book .book-text {

        transform: translateX(-40px);

        transition-duration: 0.75s;
    }


    .home-book .book-image {

        transform: translateX(40px);

        transition-duration: 0.75s;
    }


    /* -----------------------------------------
       INTRODUCTION
    ----------------------------------------- */

    .home-introduction .intro-image {

        transform: translateX(-40px);

        transition-duration: 0.75s;
    }


    .home-introduction .intro-text {

        transform: translateX(40px);

        transition-duration: 0.75s;
    }


    /* -----------------------------------------
       VIDEO
    ----------------------------------------- */

    .home-trailer .trailer-content {

        transform: translateY(40px);

        transition-duration: 0.75s;
    }


    /* -----------------------------------------
       CTA
    ----------------------------------------- */

    .contact-cta .cta-content {

        transform: translateY(40px);

        transition-duration: 0.75s;
    }


    /* -----------------------------------------
       HOVER REDUCTION
    ----------------------------------------- */

    .intro-frame:hover {

        transform: translateY(-4px);
    }


    .book-image img:hover {

        transform: translateY(-5px) scale(1.01);
    }


    .trailer-video:hover {

        transform: translateY(-3px);
    }

}


/* =========================================================
   EXTRA SMALL DEVICES
========================================================= */

@media (max-width: 400px) {

    .home-book .book-text {

        transform: translateX(-30px);
    }


    .home-book .book-image {

        transform: translateX(30px);
    }


    .home-introduction .intro-image {

        transform: translateX(-30px);
    }


    .home-introduction .intro-text {

        transform: translateX(30px);
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        animation: none !important;

        transition: none !important;

        scroll-behavior: auto !important;
    }


    .home-book .book-text,
    .home-book .book-image,
    .home-introduction .intro-image,
    .home-introduction .intro-text,
    .home-trailer .trailer-content,
    .contact-cta .cta-content {

        opacity: 1 !important;

        transform: none !important;
    }

}






































/* =========================================================
   ABOUT PAGE ANIMATIONS
   Elegant • Smooth • Scroll Reveal
========================================================= */


/* =========================================================
   AUTHOR IMAGE
   Appears from the LEFT
========================================================= */

.author-image {
    opacity: 0;
    transform: translateX(-70px);

    transition:
        opacity 0.9s ease,
        transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.author-image.reveal {
    opacity: 1;
    transform: translateX(0);
}


/* =========================================================
   MAIN AUTHOR HEADING
   Appears from BELOW
========================================================= */

.author-content > h2 {
    opacity: 0;
    transform: translateY(40px);

    transition:
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.author-content > h2.reveal {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   SUBHEADINGS
   Appears individually from BELOW
========================================================= */

.author-content > h3 {
    opacity: 0;
    transform: translateY(40px);

    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

.author-content > h3.reveal {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   PARAGRAPHS
   Each paragraph appears individually from BELOW
========================================================= */

.author-content > p {
    opacity: 0;
    transform: translateY(40px);

    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

.author-content > p.reveal {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   CLOSING PARAGRAPH
========================================================= */

.author-content > .closing {
    opacity: 0;
    transform: translateY(40px);

    transition:
        opacity 0.85s ease,
        transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}

.author-content > .closing.reveal {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    /*
     * On mobile the image comes from below
     * instead of the side.
     */

    .author-image {
        transform: translateY(45px);
    }

    .author-image.reveal {
        transform: translateY(0);
    }


    .author-content > h2,
    .author-content > h3,
    .author-content > p {
        transform: translateY(30px);
    }

    .author-content > h2.reveal,
    .author-content > h3.reveal,
    .author-content > p.reveal {
        transform: translateY(0);
    }

}


/* =========================================================
   ACCESSIBILITY
   Disable animations when requested by the user
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .author-image,
    .author-content > h2,
    .author-content > h3,
    .author-content > p,
    .author-content > .closing {

        opacity: 1 !important;

        transform: none !important;

        transition: none !important;
    }

}









































































/* =========================================================
   BOOK PAGE SCROLL ANIMATIONS
   Elegant • Smooth • Simple
========================================================= */


/* =========================================================
   INITIAL STATE
========================================================= */

/* Book cover */
.book-cover {
    opacity: 0;
    transform: translateY(45px) scale(0.96);

    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}


/* Book title */
.book-details h2 {
    opacity: 0;
    transform: translateY(35px);

    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}


/* Book paragraphs */
.book-details .col-lg-7 > p {
    opacity: 0;
    transform: translateY(35px);

    transition:
        opacity 0.75s ease,
        transform 0.75s ease;
}


/* =========================================================
   ACTIVE / VISIBLE STATE
========================================================= */

.book-cover.reveal,
.book-details h2.reveal,
.book-details .col-lg-7 > p.reveal {
    opacity: 1;
    transform: translateY(0) scale(1);
}


/* =========================================================
   BOOK COVER
========================================================= */

.book-cover.reveal {
    transition-delay: 0.1s;
}


/* =========================================================
   BOOK TITLE
========================================================= */

.book-details h2.reveal {
    transition-delay: 0.15s;
}


/* =========================================================
   PARAGRAPH STAGGER
========================================================= */

.book-details .col-lg-7 > p:nth-of-type(1).reveal {
    transition-delay: 0.10s;
}

.book-details .col-lg-7 > p:nth-of-type(2).reveal {
    transition-delay: 0.18s;
}

.book-details .col-lg-7 > p:nth-of-type(3).reveal {
    transition-delay: 0.26s;
}

.book-details .col-lg-7 > p:nth-of-type(4).reveal {
    transition-delay: 0.34s;
}

.book-details .col-lg-7 > p:nth-of-type(5).reveal {
    transition-delay: 0.42s;
}

.book-details .col-lg-7 > p:nth-of-type(6).reveal {
    transition-delay: 0.50s;
}

.book-details .col-lg-7 > p:nth-of-type(7).reveal {
    transition-delay: 0.58s;
}

.book-details .col-lg-7 > p:nth-of-type(8).reveal {
    transition-delay: 0.66s;
}

.book-details .col-lg-7 > p:nth-of-type(9).reveal {
    transition-delay: 0.74s;
}

.book-details .col-lg-7 > p:nth-of-type(10).reveal {
    transition-delay: 0.82s;
}


/* =========================================================
   AMAZON BUTTON
========================================================= */

.book-cover .amazon-btn {
    opacity: 0;
    transform: translateY(20px);

    transition:
        opacity 0.7s ease,
        transform 0.7s ease,
        background-color 0.3s ease,
        color 0.3s ease;
}


.book-cover.reveal .amazon-btn {
    opacity: 1;
    transform: translateY(0);

    transition-delay: 0.35s;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991px) {

    .book-cover {
        margin-bottom: 50px;
    }

    .book-details h2 {
        margin-top: 20px;
    }

}


/* =========================================================
   REDUCE MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .book-cover,
    .book-details h2,
    .book-details .col-lg-7 > p,
    .book-cover .amazon-btn {
        opacity: 1;
        transform: none;

        transition: none;
    }

}