/* =========================================================
   ULRICH RATHGEBER – BOOK PAGE
   Visual language based on the Ulrich Rathgeber flyer
   ========================================================= */


/* ---------------------------------------------------------
   FLYER-STYLE HEADLINE FONT
   --------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;600&display=swap');


/* =========================================================
   COMPLETE BOOK AREA
   One continuous full-width colour atmosphere
   ========================================================= */

.author-books {
    position: relative;
    z-index: 0;

    width: 100%;

    background: #f5f2e8;
}


/* ---------------------------------------------------------
   FULL-WIDTH CONTINUOUS COLOUR CLOUD
   --------------------------------------------------------- */

.author-books::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;
    left: 50%;

    width: 100vw;

    transform: translateX(-50%);

    z-index: -1;

    pointer-events: none;

    background:

        /*
         ----------------------------------------------------
         SKY BLUE
         Upper left
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 68% 25% at 8% 7%,
            rgba(201,222,243,0.98) 0%,
            rgba(201,222,243,0.82) 30%,
            rgba(201,222,243,0.48) 55%,
            rgba(201,222,243,0.16) 72%,
            transparent 88%
        ),

        /*
         ----------------------------------------------------
         LAVENDER
         Upper right
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 68% 28% at 92% 18%,
            rgba(201,181,237,0.92) 0%,
            rgba(201,181,237,0.68) 30%,
            rgba(201,181,237,0.34) 55%,
            rgba(201,181,237,0.12) 72%,
            transparent 90%
        ),

        /*
         ----------------------------------------------------
         SOFT PINK
         Upper / middle
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 70% 25% at 50% 27%,
            rgba(243,183,207,0.60) 0%,
            rgba(243,183,207,0.40) 32%,
            rgba(243,183,207,0.20) 58%,
            rgba(243,183,207,0.06) 76%,
            transparent 90%
        ),

        /*
         ----------------------------------------------------
         LAVENDER / PINK BRIDGE
         Middle
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 75% 27% at 68% 47%,
            rgba(201,181,237,0.48) 0%,
            rgba(201,181,237,0.30) 35%,
            rgba(243,183,207,0.18) 60%,
            transparent 88%
        ),

        /*
         ----------------------------------------------------
         PEACH
         Lower left
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 72% 30% at 12% 68%,
            rgba(244,200,159,0.94) 0%,
            rgba(244,200,159,0.68) 30%,
            rgba(244,200,159,0.36) 55%,
            rgba(244,200,159,0.12) 75%,
            transparent 92%
        ),

        /*
         ----------------------------------------------------
         PINK
         Lower right
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 70% 30% at 88% 82%,
            rgba(243,183,207,0.90) 0%,
            rgba(243,183,207,0.62) 32%,
            rgba(243,183,207,0.30) 56%,
            rgba(243,183,207,0.10) 76%,
            transparent 92%
        ),

        /*
         ----------------------------------------------------
         BLUE / LAVENDER LOWER BRIDGE
         ----------------------------------------------------
        */
        radial-gradient(
            ellipse 65% 25% at 48% 92%,
            rgba(201,222,243,0.38) 0%,
            rgba(201,222,243,0.22) 35%,
            rgba(201,181,237,0.14) 58%,
            transparent 88%
        ),

        /*
         ----------------------------------------------------
         GENERAL WARM BASE
         ----------------------------------------------------
        */
        #f5f2e8;
}


/* =========================================================
   INDIVIDUAL BOOK SECTION
   Transparent – background comes from .author-books
   ========================================================= */

.book-author {
    position: relative;
    z-index: 1;

    width: 100%;
    max-width: none;

    margin: 0;

    padding: 115px 20px 125px;

    box-sizing: border-box;

    color: #000000;

    background: transparent !important;

    overflow: visible;
}


/* ---------------------------------------------------------
   No individual book background
   --------------------------------------------------------- */

.book-author::before {
    display: none;
}


/* =========================================================
   HEADINGS – FLYER STYLE
   ========================================================= */

.book-author h1,
.book-author h2,
.book-author h3,
.book-author h4,
.book-author h5,
.book-author h6 {

    font-family: 'Josefin Sans', sans-serif !important;

    font-weight: 300 !important;

    color: #000000 !important;
}


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

.book-author .book-info h2 {

    font-size: 3rem;

    line-height: 1.15;

    letter-spacing: 0.035em;

    margin-top: 0;

    margin-bottom: 30px;
}


/* =========================================================
   EDITION HEADINGS
   ========================================================= */

.book-author .book-editions h3 {

    font-size: 1.8rem;

    line-height: 1.2;

    letter-spacing: 0.035em;

    margin-bottom: 35px;
}


/* =========================================================
   ALL BOOK TEXT BLACK
   ========================================================= */

.book-author,
.book-author p,
.book-author div,
.book-author span,
.book-author li,
.book-author a,
.book-author .book-info,
.book-author .book-details,
.book-author .edition-name,
.book-author .edition-isbn {

    color: #000000;
}


/* =========================================================
   CONTENT WIDTH
   ========================================================= */

.book-author .book-intro,
.book-author .book-editions {

    max-width: 1200px;

    margin-left: auto;
    margin-right: auto;
}


/* =========================================================
   BOOK INTRO
   ========================================================= */

.book-author .book-intro {

    display: grid !important;

    grid-template-columns:
        320px
        minmax(0, 1fr) !important;

    gap: 80px !important;

    align-items: start !important;
}


/* =========================================================
   MAIN COVER
   ========================================================= */

.book-author .book-cover {

    width: 100% !important;
}


.book-author .book-cover img {

    display: block;

    width: 100%;

    height: auto;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, 0.18);
}


/* =========================================================
   BOOK TEXT
   ========================================================= */

.book-author .book-info {

    width: auto !important;
}


.book-author .book-info p {

    margin-bottom: 22px;

    line-height: 1.8;

    color: #000000 !important;
}


/* =========================================================
   BOOK DETAILS
   ========================================================= */

.book-details {

    margin-top: 30px;

    line-height: 1.8;
}


.book-details div {

    margin-bottom: 6px;
}


/* =========================================================
   ALTERNATING COVER / TEXT
   ========================================================= */

.book-author.book-reverse .book-intro {

    grid-template-columns:
        minmax(0, 1fr)
        320px !important;
}


.book-author.book-reverse .book-cover {

    grid-column: 2;

    grid-row: 1;
}


.book-author.book-reverse .book-info {

    grid-column: 1;

    grid-row: 1;
}


/* =========================================================
   EDITIONS
   ========================================================= */

.book-author .book-editions {

    margin-top: 90px;
}


.book-author .edition-row {

    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 40px !important;
}


.book-author .edition {

    display: block !important;

    width: auto !important;

    text-align: center;
}


/* =========================================================
   EDITION COVER
   ========================================================= */

.book-author .edition img {

    display: block;

    width: 160px;

    max-width: 100%;

    height: auto;

    margin: 0 auto 18px;

    box-shadow:
        0 7px 19px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   EDITION NAME
   ========================================================= */

.book-author .edition-name {

    font-weight: 600;

    margin-bottom: 6px;
}


/* =========================================================
   ISBN
   ========================================================= */

.book-author .edition-isbn {

    font-size: 0.9em;

    opacity: 1;
}


/* =========================================================
   ENGLISH EDITIONS
   ========================================================= */

.book-author .book-editions-english {

    margin-top: 70px;
}


/* =========================================================
   REMOVE HARD BOOK SEPARATOR
   ========================================================= */

.book-author + .book-author {

    border-top: none !important;
}


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

@media (max-width: 767px) {

    .book-author {

        padding: 75px 20px 85px;
    }


    .book-author .book-intro,
    .book-author.book-reverse .book-intro {

        grid-template-columns: 1fr !important;

        gap: 40px !important;
    }


    .book-author .book-cover,
    .book-author.book-reverse .book-cover {

        grid-column: 1;

        grid-row: auto;

        max-width: 280px;

        margin: 0 auto;
    }


    .book-author .book-info,
    .book-author.book-reverse .book-info {

        grid-column: 1;

        grid-row: auto;
    }


    .book-author .book-info h2 {

        font-size: 2.4rem;
    }


    .book-author .edition-row {

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 40px 25px !important;
    }
}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media (max-width: 480px) {

    .book-author .book-info h2 {

        font-size: 2.1rem;
    }


    .book-author .edition-row {

        grid-template-columns: 1fr !important;
    }
}