/* =========================================================
   MAX-WIDTH: 1600PX
========================================================= */

@media (max-width: 1600px) {

    /* BLOG */
        .cards {

            grid-template-columns:

                repeat(4, 30rem);

            justify-content: center;

        }

    /* SELFWORK */
        .selfwork-cards { grid-template-columns: repeat(4, 30rem); justify-content: center; }

}


/* =========================================================
   MAX-WIDTH: 1400PX
========================================================= */

@media (max-width: 1400px) {

    /* NAVIGATION */
        .main-nav-inner {

            max-width: 100%;

            gap: 2rem;

        }

        .nav-links {

            gap: 2.2rem;

        }

        .nav-actions {

            gap: 1.8rem;

        }

}


/* =========================================================
   MAX-WIDTH: 1300PX
========================================================= */

@media (max-width: 1300px) {

    /* MAP / WHERE TO BUY */
        .where-to-buy {

            width: 92%;

            gap: 4rem;

        }

        .buy-buttons {

            grid-template-columns:

                repeat(2, minmax(0, 1fr));

        }

}


/* =========================================================
   MAX-WIDTH: 1280PX
========================================================= */

@media (max-width: 1280px) {

    /* BLOG / TESTIMONIALS */
        .cards {

            grid-template-columns:

                repeat(3, 30rem);

        }

        .testimonials-grid {

            grid-template-columns:

                repeat(2, minmax(0, 1fr));

        }

        .testimonial-card {

            max-width: 100%;

        }

    /* SELFWORK */
        .selfwork-cards { grid-template-columns: repeat(3, 30rem); }

}


/* =========================================================
   MAX-WIDTH: 1250PX
========================================================= */

@media (max-width: 1250px) {

    /* BOOKS */
        .books-showcase { grid-template-columns: minmax(0, 90rem); justify-content: center; gap: 3rem; }

}


/* =========================================================
   MAX-WIDTH: 1200PX
========================================================= */

@media (max-width: 1200px) {

    /* GENERAL */
        :root {

            --section-spacing: 13rem;

            --secondary-heding-font-size: 4.1rem;

            --tertiary-heding-font-size: 2.3rem;

        }

    /* HERO */
        .hero-inner {

            max-width: 104rem;

            grid-template-columns:

                minmax(0, 1fr)

                minmax(27rem, 0.68fr);

            gap: 2rem;

            margin-top: 9rem;

        }

        .hero-title {

            font-size: 6rem;

        }

        .hero-description {

            font-size: 2rem;

        }

        .hero-book {

            justify-content: center;

            transform: none;

        }

        .hero-book-image {

            max-width: 42rem;

            transform: translateX(0);

        }

        .hero-actions .action-button {

            width: 19rem;

        }

        .hero-new-label {

            left: -1rem;

        }

}


/* =========================================================
   MAX-WIDTH: 1180PX
========================================================= */

@media (max-width: 1180px) {

    /* NAVIGATION */
        /*

         \* CLOSED MOBILE STATE

         \* Keep the bar transparent over the hero. The normal .is-scrolled class

         \* adds the glass background only once JS reaches #new-book.

         */

        .main-nav {

            background-color: transparent;

            backdrop-filter: none;

            -webkit-backdrop-filter: none;

            box-shadow: none;

            overflow: visible;

        }

        .main-nav.is-scrolled:not(.is-open) {

            background-color: rgba(253, 241, 239, 0.94);

            backdrop-filter: blur(12px);

            -webkit-backdrop-filter: blur(12px);

            box-shadow: 0 0.4rem 2rem rgba(73, 45, 112, 0.08);

        }

        /*

         \* DROP-DOWN PANEL

         \* The panel starts above the viewport and slides down behind the

         \* logo/hamburger row. This makes the open menu feel like one complete nav.

         */

        .main-nav::before {

            content: "";

            position: fixed;

            top: 0;

            left: 0;

            width: 100%;

            height: min(100vh, 62rem);

            background: rgba(253, 241, 239, 0.985);

            box-shadow: 0 1.8rem 4rem rgba(73, 45, 112, 0.16);

            backdrop-filter: blur(16px);

            -webkit-backdrop-filter: blur(16px);

            transform: translateY(-105%);

            transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);

            z-index: -1;

            pointer-events: none;

        }

        .main-nav.is-open::before {

            transform: translateY(0);

        }

        .main-nav-inner {

            position: relative;

            display: grid;

            grid-template-columns: minmax(0, 1fr) auto;

            align-items: center;

            gap: 0;

            min-height: 7rem;

            padding-inline: 2rem;

        }

        .nav-brand {

            grid-column: 1;

            grid-row: 1;

            position: relative;

            z-index: 3;

            width: max-content;

            max-width: 100%;

        }

        .nav-actions {

            display: none;

        }

        .nav-toggle {

            grid-column: 2;

            grid-row: 1;

            display: inline-flex;

            position: relative;

            z-index: 3;

        }

        .nav-links {

            position: fixed;

            top: 7rem;

            left: 0;

            right: 0;

            z-index: 2;

            display: flex;

            flex-direction: column;

            align-items: center;

            gap: 0.25rem;

            max-height: calc(min(100vh, 62rem) - 7rem);

            overflow-y: auto;

            overscroll-behavior: contain;

            width: min(calc(100% - 4rem), 52rem);

            margin: 0 auto;

            padding: 1.5rem 0 3rem;

            list-style: none;

            background: transparent;

            box-shadow: none;

            opacity: 0;

            visibility: hidden;

            pointer-events: none;

            transform: translateY(-4rem);

            transition:

                opacity 0.2s ease,

                transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),

                visibility 0.4s ease;

        }

        .main-nav.is-open .nav-links {

            align-items: center;

            opacity: 1;

            visibility: visible;

            pointer-events: auto;

            transform: translateY(0);

            transition-delay: 0.08s;

        }

        .main-nav.is-open .nav-toggle-line:nth-child(1) {

            transform: translateY(0.7rem) rotate(45deg);

        }

        .main-nav.is-open .nav-toggle-line:nth-child(2) {

            opacity: 0;

        }

        .main-nav.is-open .nav-toggle-line:nth-child(3) {

            transform: translateY(-0.7rem) rotate(-45deg);

        }

        .nav-links li,

        .nav-link {

            width: 100%;

        }

        .nav-link {

            display: flex;

            align-items: center;

            min-height: 4.8rem;

            padding: 1rem 0.6rem;

            color: #292226;

            font-size: 1.8rem;

            white-space: normal;

        }

        .nav-link::after {

            bottom: 0.5rem;

            transform-origin: left;

        }

        .nav-mobile-buy-item {

            display: block;

            margin-top: 1.25rem;

        }

        /* Real CTA button, not another text row. */

        .nav-mobile-buy-item .nav-link {

            display: inline-flex;

            justify-content: center;

            max-width: 10rem;

            min-height: 5rem;

            padding: 1rem 2rem;

            border: 2px solid var(--main-color);

            border-radius: 999px;

            background: var(--main-color);

            color: #fff;

            font-weight: 600;

            text-align: center;

            transition: background-color 0.25s ease, border-color 0.25s ease;

        }

        .nav-mobile-buy-item .nav-link::after {

            display: none;

        }

        .nav-mobile-buy-item .nav-link:hover,

        .nav-mobile-buy-item .nav-link:focus-visible {

            background: var(--accent-color);

            border-color: var(--accent-color);

            color: #fff;

        }

        body.nav-open {

            overflow: hidden;

        }

}


/* =========================================================
   MAX-WIDTH: 1100PX
========================================================= */

@media (max-width: 1100px) {

    /* ABOUT BOOK */
        .new-book-section { padding: 6rem 3rem; }

        .decoration#about-book-one { display: none; }

        .decoration#about-book-two { display: none;}

        .decoration#about-book-three { display: none;}

        .new-book-layout { grid-template-columns: minmax(28rem, 38rem) minmax(0, 48rem); gap: 4rem; }

        .new-book-image img { max-width: 36rem; }

        .new-book-title { font-size: 5.2rem; }

        .new-book-description { margin-top: 3rem; font-size: 1.8rem; }

        .new-book-actions { margin-top: 3.5rem; gap: 1.5rem; }

    /* NAVIGATION */
        /* While inside hero */

        .main-nav {

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

        }

        /* After hero */

        .main-nav.is-fixed-after-hero {

            position: fixed;

            top: 0;

            left: 0;

            background-color: rgba(253, 241, 239, 0.94);

            backdrop-filter: blur(12px);

            -webkit-backdrop-filter: blur(12px);

            box-shadow:

                0 0.4rem 2rem

                rgba(73, 45, 112, 0.08);

        }

        .nav-links {

            display: flex;

            flex-direction: column;

            align-items: center;

            justify-content: center;

            width: 100%;

            text-align: center;

        }

        .nav-links li {

            width: 100%;

            display: flex;

            justify-content: center;

            align-items: center;

        }

        .nav-link {

            display: inline-flex;

            justify-content: center;

            align-items: center;

            width: auto;

            text-align: center;

        }



        /* Gdje kupiti */

        .nav-mobile-buy-item {

            display: flex;

            justify-content: center;

            align-items: center;

            width: 100%;

            margin-top: 2rem;

        }

        .nav-mobile-buy-item .nav-link {

            min-width: 16rem;

            min-height: 5rem;

            padding: 0 2.5rem;

            background-color: var(--main-color);

            color: white;

            border-radius: 999px;

        }

        .nav-mobile-buy-item .nav-link::after {

            display: none;

        }

}


/* =========================================================
   MAX-WIDTH: 1050PX
========================================================= */

@media (max-width: 1050px) {

    /* AUTHOR */
        .author-section { padding: 5rem 3rem 0; }

        .author-content { grid-template-columns: minmax(0, 1.2fr) minmax(24rem, 0.8fr); gap: 3rem; }

        .author-text p { font-size: 2rem; }

        .author-image img { max-width: 31rem; }

    /* MAP / WHERE TO BUY */
        .where-to-buy {

            grid-template-columns: 1fr;

            width: min(90%, 75rem);

            gap: 4rem;

        }

        .buy-buttons {

            grid-template-columns:

                repeat(3, minmax(0, 1fr));

        }

        #map {

            height: 46rem;

        }

        .statistics {

            max-width: 90%;

        }

}


/* =========================================================
   MAX-WIDTH: 980PX
========================================================= */

@media (max-width: 980px) {

    /* BLOG / TESTIMONIALS / FOOTER */
        .card-toggle {

            width: 80%;

            height: 4rem;

            margin-top: 2rem;

        }

        .card-arrow {

            font-size: 3rem;

            font-weight: 700;

        }

        .cards-section {

            width: 100%;

            max-width: 100%;

            padding-inline: 2rem;

        }

        .cards {

            grid-template-columns:

                repeat(2, minmax(0, 30rem));

            justify-content: center;

        }

        .card {

            width: 100%;

        }



        /* TESTIMONIALS */

        .testimonials-window {

            width: 92%;

        }

        .testimonials-scroll {

            height: 62rem;

            padding-right: 3rem;

        }

        .testimonial-text,

        .testimonial-author {

            font-size: 1.8rem;

        }





        /* FOOTER */

        .section-footer {

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

            gap: 3rem 2rem;

            padding: 3rem 2rem 2rem;

            align-items: start;

        }

        .girl {

            grid-column: 1 / -1;

            justify-self: center;

            align-self: end;

            order: 5;

            margin-bottom: -1rem;

            transform:

                translateY(1rem);

            z-index: 2;

        }

        .social-links {

            grid-column: 2;

            grid-row: 1;

        }

        .line { order: 6; margin-top: 0; }

        .copyright { order: 7; }

    /* SELFWORK */
        .selfwork-card-toggle {

            width: 80%;

            height: 4rem;

            margin-top: 2rem;

        }

        .selfwork-card-arrow {

            font-size: 3rem;

            font-weight: 700;

        }

        .selfwork-icon--emotion {

            width: 6.5rem;

            height: 6.5rem;

        }

        .selfwork-icon--small {

            width: 5.5rem;

            height: 5.5rem;

        }

        .selfwork-section { width: 100%; max-width: 100%; padding-inline: 2rem; }

        .selfwork-cards { grid-template-columns: repeat(2, minmax(0, 30rem)); width: 100%; }

        .selfwork-card { width: 100%; }

}


/* =========================================================
   MAX-WIDTH: 900PX
========================================================= */

@media (max-width: 900px) {

    /* EXCERPT */
        .excerpt-page {

            padding-top: 10rem;

        }

        .excerpt-layout {

            grid-template-columns: 1fr;

            gap: 4rem;

        }

        .excerpt-book {

            position: static;

        }

        .excerpt-book img {

            width: min(58vw, 26rem);

        }

        .excerpt-paper {

            width: min(100%, 68rem);

            margin: 0 auto;

        }

        .excerpt-decoration {

            width: 40rem;

            opacity: 0.08;

        }

        .illustrations {

            max-width: 80%;



        }

    /* GENERAL */
        :root {

            --section-spacing: 10rem;

            --secondary-heding-font-size: 3.6rem;

            --tertiary-heding-font-size: 2.1rem;

        }

        .section-hero {

            margin-bottom: 6rem;

            padding-inline: 2rem;

        }

        .decoration {

            opacity: 0.28 !important;

            transform: rotate(var(--decoration-rotate, 0deg)) scale(0.72);

        }

    /* HERO */
        .hero-section {

            min-height: auto;

            padding-top: 7rem;

        }

        .hero-inner {

            min-height: auto;

            grid-template-columns:

                minmax(0, 1.05fr)

                minmax(22rem, 0.7fr);

            gap: 2.5rem;

            margin-top: 0;

            padding: 7rem 2.5rem 6rem;

        }

        .hero-title {

            font-size: 5.2rem;

        }

        .hero-description {

            margin-top: 3rem;

            font-size: 1.8rem;

        }

        .hero-actions {

            gap: 1.4rem;

            margin-top: 3.5rem;

        }

        .hero-actions .action-button {

            width: 17rem;

        }

        .hero-book-image {

            max-width: 31rem;

        }

        .hero-new-label {

            top: -1rem;

            width: 10rem;

            height: 5rem;

            font-size: 1.8rem;

        }

}


/* =========================================================
   MAX-WIDTH: 760PX
========================================================= */

@media (max-width: 760px) {

    /* ABOUT BOOK */
        .new-book-section { padding: 5rem 2rem; }

        .new-book-layout { grid-template-columns: 1fr; gap: 3rem; }

        .new-book-content { max-width: 60rem; margin-inline: auto; text-align: center; }

        .new-book-image img { max-width: 28rem; }

        .new-book-title { font-size: 4.5rem; }

        .new-book-description { max-width: 54rem; margin-inline: auto; margin-top: 2.5rem; }

        .new-book-actions { justify-content: center; flex-wrap: wrap; }

    /* AUTHOR */
        .author-section { padding: 5rem 2rem 0; }

        .author-content { grid-template-columns: 1fr; min-height: 0; text-align: center; gap: 3rem; }

        .author-copy { max-width: 62rem; }

        .author-title { font-size: 4rem; }

        .author-text { gap: 1.8rem; }

        .author-text p { font-size: 1.8rem; }

        .author-image { width: 100%; }

        .author-image img { max-width: 26rem; }

    /* BOOKS */
        .books-showcase { padding-inline: 2rem; }

        .book-card { grid-template-columns: 16rem minmax(0, 1fr); min-height: 0; gap: 2rem; padding: 2rem; }

        .book-card__image img { max-width: 16rem; }

        .book-card__title { font-size: 3.4rem; }

        .book-card-description { font-size: 1.7rem; }

        .book-card-actions { grid-template-columns: 1fr; gap: 1rem; }

}


/* =========================================================
   MAX-WIDTH: 700PX
========================================================= */

@media (max-width: 700px) {

    /* PROMOTION / BLOG / TESTIMONIALS / FOOTER */
        /* PROMOTION */

        .heading-secondary {

            width: 90%;

        }

        .scroller {

            margin-bottom: 8rem;

        }

        .section-book-promotion

        .scroller:nth-child(3) {

            margin-bottom: 8rem;

        }





        /* CARDS */

        .cards-section {

            padding-inline: 1.2rem;

        }

        .cards {

            grid-template-columns:

                minmax(0, 42rem);

        }

        .blog-image {

            width: fit-content;

            height: auto;

        }



        /* TESTIMONIALS */

        .testimonials-window {

            width:

                calc(100% - 2.4rem);

        }

        .testimonials-scroll {

            height: 45rem;

            padding:

                1.5rem

                2.4rem

                1.5rem

                0;

        }

        .testimonials-grid {

            grid-template-columns: 1fr;

        }

        .custom-scrollbar {

            width: 10px;

        }

        .custom-scrollbar-thumb {

            left: 3px;

            width: 4px;

        }







        /* FOOTER */

        .section-footer {

            grid-template-columns: 1fr;

            text-align: center;

            gap: 2.5rem;

            padding-inline: 1.4rem;

        }

        .author-message p {

            max-width: 32rem;

            margin-inline: auto;

        }

        .signiture {

            -webkit-user-drag: none;

            user-select: none;

            width: 20rem;

        }

        .page-links {

            justify-self: center;

        }

        .links {

            align-items: center;

        }

        .social-links {

            grid-column: 1;

            grid-row: auto;

            justify-self: center;

            align-self: auto;

            width:

                min(100%, 32rem);

        }

        .instagram-link {

            justify-content: center;

        }



        /* CONTACT */

        .contact-form {

            justify-self: center;

            align-self: auto;

            width:

                min(100%, 32rem);

            max-width: 32rem;

        }

        .personal-name {
            gap: 0.5rem;

        }

        .name,

        .surname {

            width: 100%;

        }

        .email,

        .name,

        .surname {

            min-height: 3.8rem;

        }

        .form-input {

            width: 100%;

            font-size: 1.6rem;

        }

        .message {

            width: 100%;

            min-width: 0;

            max-width: 100%;

            min-height: 9rem;

        }

        .submit-form {

            width: 100%;

            min-height: 4rem;

        }



        /* GIRL */

        .girl {

            width: 12rem;

            margin-bottom: -1rem;

            transform:

                translateY(1rem);

        }



        /* FOOTER LINE */

        .line {

            width: 100%;

        }

    /* EXCERPT */
        .excerpt-arrow {

            top: auto;

            bottom: -6rem;

            transform: none;

        }

        .excerpt-arrow-left {

            left: 1rem;

        }

        .excerpt-arrow-right {

            right: 1rem;

        }

        .excerpt-reader {

            margin-bottom: 7rem;

        }

    /* GENERAL */
        :root {

            --section-spacing: 8rem;

            --secondary-heading-font-size: 3.2rem;

        }

        .section-hero {

            margin-bottom: 4.5rem;

            padding-inline: 1.6rem;

        }

        .section-hero--small-spacing {

            margin-bottom: 2rem;

        }

        .decoration {

            display: none;

        }

        .copy-divider {

            gap: 1.2rem;

        }

        .short-line {

            width: min(30%, 10rem);

        }

    /* HERO */
        .hero-background::after {

            background: rgba(253, 241, 239, 0.7);

        }

        .hero-background-image {

            object-position: 62% center;

        }

        .hero-inner {

            grid-template-columns: 1fr;

            padding: 5rem 1.8rem;

            text-align: center;

        }

        .hero-copy {

            max-width: 60rem;

            margin-inline: auto;

        }

        .hero-title {

            font-size: clamp(4rem, 12vw, 5rem);

        }

        .hero-description {

            max-width: 54rem;

            margin-inline: auto;

            margin-top: 2.5rem;

        }

        .hero-actions {

            justify-content: center;

            flex-wrap: wrap;

            margin-top: 3rem;

        }

        .hero-book {

            order: -1;

        }

        .hero-book-image {

            max-width: 24rem;

        }

        .hero-new-label {

            left: calc(50% - 13rem);

        }

    /* MAP / WHERE TO BUY */
        .where-to-buy {

            width: calc(100% - 3rem);

            margin-top: 4rem;

        }

        .buy-card {

            padding: 2rem;

        }

        .buy-buttons {

            grid-template-columns:

                repeat(2, minmax(0, 1fr));

        }

        .statistics {

            flex-direction: column;

            gap: 2.5rem;

            max-width: calc(100% - 3rem);

            min-height: 0;

            padding: 3rem 2rem;

        }

        .stat-item {

            width: min(100%, 28rem);

        }

        .icon-bg {

            width: 8rem;

            height: 8rem;

        }

        .map-icon {

            width: 5.5rem;

            height: 5.5rem;

        }

        .stat-number {

            font-size: 3.8rem;

        }

        .stat-copy {

            font-size: 1.8rem;

        }

        #map {

            height: 40rem;

        }

}


/* =========================================================
   MAX-WIDTH: 650PX
========================================================= */

@media (max-width: 650px) {

    /* SELFWORK */
        .selfwork-section { padding-inline: 1.2rem; }

        .selfwork-cards { grid-template-columns: minmax(0, 42rem); }

        .selfwork-card-title { font-size: 3rem; }

        .selfwork-card-title {

            font-size: 3rem;

        }

        .selfwork-card-title--smaller {

            font-size: 2.3rem;

        }

}


/* =========================================================
   MAX-WIDTH: 600PX
========================================================= */

@media (max-width: 600px) {

    /* EXCERPT */
        .excerpt-page {

            padding: 8.5rem 1.2rem 7rem;

        }

        .excerpt-back {

            margin-bottom: 3rem;

            font-size: 1.45rem;

        }

        .excerpt-header {

            margin-bottom: 3.5rem;

        }

        .excerpt-title {

            font-size: clamp(4.2rem, 15vw, 5.5rem);

        }

        .excerpt-author {

            font-size: 1.7rem;

        }

        .excerpt-paper {

            padding: 3.5rem 2rem;

            border-radius: 1.5rem;

        }

        .excerpt-paper::before {

            inset: 0.8rem;

            border-radius: 1rem;

        }

        .excerpt-paper-heading h2 {

            font-size: 3.6rem;

        }

        .excerpt-divider {

            margin-bottom: 3rem;

        }

        .excerpt-copy {

            font-size: 1.7rem;

            line-height: 1.75;

        }

        .excerpt-copy p:first-child:not(.excerpt-placeholder)::first-letter {

            font-size: 5rem;

        }

        .excerpt-bottom-actions {

            flex-direction: column;

            align-items: stretch;

            width: min(100%, 32rem);

            margin-inline: auto;

        }

        .excerpt-action {

            width: min(100%, 24rem);

        }

        .excerpt-decoration {

            display: none;

        }

    /* NAVIGATION */
        .main-nav-inner {

            min-height: 6.4rem;

            padding-inline: 1.4rem;

        }

        .main-nav::before {

            height: min(100vh, 58rem);

        }

        .nav-brand {

            gap: 0.7rem;

            min-width: 0;

        }

        .logo {

            width: 3.2rem;

            height: 3.2rem;

        }

        .nav-brand-name {

            font-size: 2.25rem;

        }

        .nav-links {

            top: 6.4rem;

            width: calc(100% - 2.8rem);

            max-height: calc(min(100vh, 58rem) - 6.4rem);

            padding-top: 1.2rem;

        }

}


/* =========================================================
   MAX-WIDTH: 560PX
========================================================= */

@media (max-width: 560px) {

    /* BOOKS */
        .books-showcase { padding-inline: 1.2rem; }

        .book-card { grid-template-columns: 1fr; text-align: center; padding: 1.8rem; }

        .book-card__image img { max-width: 18rem; }

        .book-card-description { margin-inline: auto; }

}


/* =========================================================
   MAX-WIDTH: 500PX
========================================================= */

@media (max-width: 500px) {

    /* MAP / WHERE TO BUY */
        .where-to-buy {

            width: calc(100% - 2rem);

            gap: 3rem;

        }

        .buy-books {

            gap: 2rem;

        }

        .buy-card {

            padding: 1.7rem 1.3rem;

            border-radius: 1.5rem;

        }

        .buy-card-title {

            font-size: 2.2rem;

        }

        .buy-buttons {

            grid-template-columns: 1fr;

        }

        .buy-btn {

            width: 100%;

            min-height: 4.8rem;

            padding: 0.9rem 1.2rem;

        }

        .buy-btn__text {

            font-size: 1.6rem;

        }

        #map {

            height: 34rem;

            border-radius: 1.5rem;

        }

}


/* =========================================================
   MAX-WIDTH: 420PX
========================================================= */

@media (max-width: 420px) {

    /* PROMOTION / BLOG / TESTIMONIALS / FOOTER */
        .book-promotion-location {

            display: block;

            padding-inline: 1.2rem;

            font-size: 1.4rem;

        }

        .card-content {

            padding: 1.6rem;

        }

        .card-title {

            font-size: 2.1rem;

        }

        .card-text p {

            font-size: 1.65rem;

        }

        .testimonial-card {

            padding: 1.6rem;

        }

        .testimonial-text,

        .testimonial-author {

            font-size: 1.6rem;

        }
        /* FOOTER */

        .section-footer {

            font-size: 1.6rem;

            padding-inline: 1rem;

        }

        .signiture {

            width: 18rem;

        }

        .contact-form {

            width: 100%;

        }

        .form-input {

            font-size: 1.6rem;

        }

        .cf-turnstile {

            /*

             \* Keeps CAPTCHA from forcing

             \* page-level horizontal scrolling.

             */

            overflow: hidden;

        }

    /* ABOUT BOOK */
        .new-book-section { padding: 4rem 1.2rem; }

        .new-book-image img { max-width: 22rem; }

        .new-book-title { font-size: 3.8rem; }

        .new-book-description { font-size: 1.65rem; }

        .new-book-actions { flex-direction: column; align-items: stretch; }

        .new-book-actions .book-button { width: 100%; }

    /* AUTHOR */
        .author-section { padding-inline: 1.2rem; }

        .author-title { font-size: 3.4rem; }

        .author-text p { font-size: 1.65rem; }

        .author-quote { font-size: 1.7rem; }

        .author-image img { max-width: 22rem; }

    /* GENERAL */
        :root {

            --section-spacing: 6.5rem;

            --secondary-heading-font-size: 2.8rem;

            --tertiary-heading-font-size: 2rem;

        }

        .section-hero {

            padding-inline: 1.2rem;

        }

    /* HERO */
        .hero-inner {

            padding: 4rem 1.2rem;

        }

        .hero-title {

            font-size: 3.8rem;

        }

        .hero-description {

            font-size: 1.65rem;

        }

        .hero-actions {

            flex-direction: column;

            align-items: stretch;

        }

        .hero-actions .action-button {

            width: 100%;

            max-width: 28rem;

            margin-inline: auto;

        }

        .hero-book-image {

            max-width: 20rem;

        }

        .hero-new-label {

            left: calc(50% - 11rem);

            width: 8rem;

            height: 4.2rem;

            font-size: 1.5rem;

        }

}
/* =========================================================
   MAX-WIDTH: 360PX
========================================================= */

@media (max-width: 360px) {

    /* BOOKS */
        .book-card__title { font-size: 3rem; }

        .book-card-description { font-size: 1.6rem; }

        .book-card-actions .action-button {

            padding-inline: 1rem;

        }

    /* MAP / WHERE TO BUY */
        .where-to-buy {

            width: calc(100% - 1.6rem);

        }

        .buy-card {

            padding: 1.5rem 1rem;

        }

        .buy-card-title {

            font-size: 2rem;

        }

        .buy-btn__text {

            font-size: 1.5rem;

        }

        #map {

            height: 30rem;

        }

    /* NAVIGATION */
        .nav-brand-name {

            font-size: 2rem;

        }

        .nav-toggle {

            width: 4rem;

            height: 4rem;

        }

        .nav-link {

            min-height: 4.6rem;

            font-size: 1.65rem;

        }

    /* SELFWORK */
        .selfwork-card-content { padding: 1.6rem; }

        .selfwork-card-text p { font-size: 1.65rem; }

}


/* =========================================================
   PREFERS REDUCED MOTION
========================================================= */

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

    /* GENERAL / REDUCED MOTION */
        .scroller[data-animated="true"] .scroller--inner {

            animation: none;

        }

        html {

            scroll-behavior: auto;

        }

        .card-text,

        .card-arrow,

        .card-toggle {

            transition: none;

        }

        .action-button__icon {

            transition: none;

        }

        .action-button:hover .action-button__icon--bag {

            animation: none;

        }

        .link,

        .instagram-link,

        .submit-form,

        .form-input {

            transition: none;

        }

    /* NAVIGATION / REDUCED MOTION */
        .main-nav::before,

        .nav-links,

        .nav-toggle-line {

            transition-duration: 0.01ms !important;

        }

}