section {
    padding: 100px 0;
}

.half-padding {
    padding: 50px 0;
}

.center {
    text-align: center;
}





.main {
    background: var(--color-1);
    min-height: 100vh;
    position: relative;
    z-index: 1;
    padding: 300px 0 0;
}

.main:before {
    content: "";
    position: absolute;
    top: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: url(/wp-content/uploads/2024/10/main-bg-2.jpg);
    background-repeat: no-repeat;
    background-position: right top;
}

.main:after {
    content: "";
    position: absolute;
    bottom: 0;
    z-index: -1;
    width: 100%;
    background: linear-gradient(0deg, var(--color-1), transparent);
    height: 200px;
}

.mobile-bg {
    display: none;
}

.main .logo {
    display: inline-block;
}

.main .logo img {
    filter: drop-shadow(3px 5px 2px rgb(0 0 0 / 0.4));
}

.main .logo p {
    margin-top: 30px;
    font-size: 1.6rem;
    color: #fff;
    font-weight: 500;
    text-shadow: 2px 2px 4px rgb(0 0 0 / 0.4);
    letter-spacing: 2px;
    line-height: 130%;
}



.book-mobile {
    position: relative;
    /* z-index: -1; */
    text-align: center;
    display: none;
    background: url(/wp-content/uploads/2024/10/book.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 0;
    padding: 15px 0 500px;
}

.book-mobile .buttons {
    margin-top: 50px;
}




.main .book {
    margin-top: 200px;
    height: 440px;
}

.main .book > * {
    position: relative;
}

.main .book img {
    position: absolute;
    right: 0;
    max-width: unset;
    pointer-events: none;
}

.main .book .text {
    display: flex;
    align-items: center;
    height: 100%;
    color: #fff;
}

.main .book .text h2 {
    text-shadow: 2px 2px 4px rgb(0 0 0 / 0.4);
    font-size: 2.6rem;
}

.main .book .text p {
    text-shadow: 2px 2px 4px rgb(0 0 0 / 0.4);
    font-size: 1.6rem;
    line-height: 150%;
}








.excerpt {
    background: var(--color-1);
    padding-top: 200px;
    padding-bottom: 500px;
}

/* .excerpt .buttons {
    margin-top: 50px;
} */

.excerpt .btn {
    width: 100%;
    background: var(--color-2);
    border-color: var(--color-2);
    color: var(--color-3);
    line-height: 70px;
}


.excerpt-tabs .tab {
    margin: 0;
    border-radius: 50px;
    overflow: hidden;
    row-gap: 0;
    display: none;
}

.excerpt-tabs .tab.active {
    display: flex;
}

.excerpt-tabs .tab > * {
    padding: 0;
}

.excerpt-tabs .image {
    position: relative;
    height: 100%;
}

.excerpt-tabs .image:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    height: 100%;
    width: 262px;
    background: linear-gradient(90deg, transparent, var(--color-2));
}

.excerpt-tabs img {
    display: block;
    object-fit: cover;
    height: 100%;
}


.excerpt-tabs .text {
    background: var(--color-2);
    height: 100%;
    display: flex;
    flex-direction: column;
    padding: 60px 100px;
}

.excerpt-tabs .text .area {
    height: 100%;
    display: flex;
    align-items: center;
    font-size: 1.4rem;
}

.excerpt-tabs .buttons {
    flex-wrap: nowrap;
    justify-content: space-between;
}

.excerpt-tabs .buttons .btn {
    padding: 0;
    width: auto;
}

.excerpt-tabs .buttons .btn:hover {
    text-decoration: underline;
}










#quote {
    background: var(--color-2);
    padding: 0;
}

.quote {
    background: url(/wp-content/uploads/2024/10/quote-bg.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 400px;
    transform: translateY(-50%);
    position: relative;
    z-index: 1;
    text-align: center;
    color: #fff;
    display: flex;
    align-items: center;
    height: 600px;
    max-width: 1800px;
    margin: 0 auto;
    font-size: 3.4rem;
    line-height: 150%;
}

.quote .quote-sing {
    font-size: 14rem;
    font-family: "Lora", serif;
    line-height: 0;
}

.quote img {
    position: absolute;
    bottom: 0;
    transform: translateY(50%) translateX(-50%);
    left: 50%;
}






#teaser {
    background: var(--color-2);
    /* padding-top: 0; */
    margin-top: -150px;
}

#teaser p {
    font-size: 1.6rem;
    padding: 0 100px;
}





.features .col > * {
    border: 5px solid var(--color-1);
    height: 100%;
    border-radius: 50px;
    padding: 30px 30px 50px;
    font-size: 1.6rem;
    position: relative;
    line-height: 135%;
}

.features .col > * img {
    position: absolute;
    right: 25px;
    bottom: 25px;
}






.buy {
    background: url(/wp-content/uploads/2024/10/buy-bg-1.jpg);
    background-size: cover;
    background-position: center;
    margin: 150px auto;
    border-radius: 300px;
    padding: 0;
    max-width: 1800px;
}

.buy .container {
    position: relative;
}

.buy .price {
    font-size: 2rem;
    color: #fff;
    line-height: 150%;
    font-weight: 600;
    white-space: nowrap;
}

.buy img {
    margin-top: -150px;
    margin-bottom: -300px;
}

.buy .buttons {
    justify-content: flex-end;
}




.advantages .col > * {
    text-align: center;
}

.advantages .text {
    font-size: 1.6rem;
    padding: 30px 30px 0;
    font-family: "Lora", serif;
}

.advantages .text span {
    text-transform: uppercase;
    display: block;
}






.reviews .owl-dots {
    position: relative;
    width: 100% !important;
    bottom: unset;
    margin-top: 50px;
    gap: 25px;
}

.reviews .owl-dots span {
    border-radius: 50px;
    width: 23px;
    height: 23px;
    border-color: var(--color-1);
}

.reviews .owl-dots .active span {
    background: var(--color-1);
}

.review {
    background: var(--color-2);
    padding: 60px;
    border-radius: 50px;
    font-size: 1.5rem;
}

.review .name {
    font-family: "Lora", serif;
    margin-bottom: 30px;
    font-weight: 600;
    font-size: 1.5rem;
}



.gradient-yellow-white {
    height: 100px;
    background: linear-gradient(0deg, #fff, var(--color-2));
}

.gradient-white-yellow {
    height: 100px;
    background: linear-gradient(0deg, var(--color-2), #fff);
}





#request {
    background: var(--color-2);
}

#request h2 {
    font-size: 3.5rem;
    line-height: 115%;
}

#request p {
    font-size: 1.6rem;
    margin-bottom: 50px;
    line-height: 135%;
}

#payment-form {
    max-width: 800px;
    margin: 0 auto;
}

#payment-form .form-quantity-field label {
    flex-wrap: nowrap;
}

#payment-form small {
    opacity: 0.75;
    font-size: 1rem;
}

#payment-form small a {
    color: var(--color-3);
    text-decoration: underline;
}

#payment-form input:disabled {
    cursor: default !important;
    opacity: 0.5;
    background: var(--color-4) !important;
}







body > footer .logo {
    margin-bottom: 150px;
}

body > footer .logo img {
    filter: drop-shadow(2px 4px 2px rgb(0 0 0 / 0.15));
}

body > footer .logo p {
    margin-top: 30px;
    font-size: 1.5rem;
    color: #fff;
    font-weight: 500;
    text-shadow: 2px 2px 4px rgb(0 0 0 / 0.2);
    letter-spacing: 2px;
    line-height: 130%;
}





/* Page */

.page-default {
    padding-top: 150px;
    background: linear-gradient(0deg, transparent, var(--color-2));
}




@media (max-width: 1800px) {  
    .main:before {background-position: 0 top;}
}

@media (max-width: 1540px) {  
    .main:before {background-position: -100px top;}
}

@media (max-width: 1400px) {  
    section {padding: 75px 0;}

    .main:before {background-position: -150px top;}
    .main .logo img {max-width: 450px;}
    .main .logo p {margin-top: 25px; font-size: 1.5rem;}
    .main .book img {max-width: 1000px;}
	.main .book .text h2 {font-size: 2.2rem;}
    .main .book .text p {font-size: 1.4rem; line-height: 140%;}

    .excerpt {padding-top: 150px; padding-bottom: 400px;}
    .excerpt-tabs .text {padding: 60px;}
    .excerpt-tabs .text .area {font-size: 1.2rem;}

    .quote {height: 500px; margin: 0 30px; font-size: 2.7rem;}
    .quote .quote-sing {font-size: 12rem;}
    .quote img {max-width: 320px;}

    #teaser p {font-size: 1.4rem; padding: 0 60px;}

    .features .col > * {font-size: 1.4rem; padding: 30px 30px 70px;}
    .features .col > * img {right: 20px; bottom: 20px;}

    .buy img {margin-top: -125px; margin-bottom: -275px;}

    .advantages img {max-width: 180px;}
    .advantages .text {font-size: 1.4rem; padding: 30px 20px 0;}

    .review {font-size: 1.4rem;}

    #request h2 {font-size: 3rem;}
    #request p {font-size: 1.4rem;}

    body > footer .logo {margin-bottom: 120px;}
    body > footer .logo img {max-width: 350px;}
    body > footer .logo p {margin-top: 20px; font-size: 1.2rem;}
}


@media (max-width: 1200px) {  
    .main {padding: 200px 0 0;}
    .main:before {background-position: -50px top; background-size: 130% auto;}
    .main .logo img {max-width: 380px;}
    .main .logo p {margin-top: 20px; font-size: 1.2rem;}
    .main .book {height: 350px;}
    .main .book .text h2 {font-size: 1.9rem;}
    .main .book .text p {font-size: 1.2rem;}
    .main .book img {max-width: 800px;}

    .excerpt {padding-bottom: 300px;}
    .excerpt .image-wrap {width: 40%;}
    .excerpt .text-wrap {width: 60%;}
    .excerpt-tabs .image:after {width: 162px;}

    .quote {height: 400px; font-size: 2.2rem;}
    .quote img {max-width: 270px;}

    #teaser {margin-top: -100px;}
    #teaser p {padding: 0 30px;}

    .features .col > * {padding: 30px;}

    .buy {margin: 100px auto;}
    .buy img {margin-top: -100px; margin-bottom: -200px;}

    .advantages img {max-width: 160px;}
    .advantages .text {font-size: 1.2rem;}

    .gradient-white-yellow {height: 50px;}
    .gradient-yellow-white {height: 50px;}

    #request h2 {font-size: 2.6rem;}
    #request p {font-size: 1.3rem;}

    body > footer .logo img {max-width: 320px;}
    body > footer .logo p {font-size: 1.1rem;}
}


@media (max-width: 992px) {  
    section {padding: 50px 0;}

    .main {padding: 175px 0 0;}
    .main .book {margin-top: 120px; height: 300px;}
    .main .logo img {max-width: 300px;}
    .main .logo p {margin-top: 15px; font-size: 1rem;}
    .main .book img {max-width: 525px;}
    .main .book .text h2 {font-size: 1.5rem;}
    .main .book .text p {font-size: 1.1rem;}

    .excerpt {padding-top: 50px; padding-bottom: 250px;}
    .excerpt .image-wrap {width: 100%; height: 380px;}
    .excerpt .text-wrap {width: 100%;}
    .excerpt-tabs .image:after {width: 100%; height: 200px; background: linear-gradient(0deg, var(--color-2), transparent);}
    .excerpt-tabs .text {padding: 40px 60px;}

    #teaser .col-6 {width: 100%;}
    #teaser p {padding: 0; font-size: 1.3rem;}

    .quote {height: 350px; font-size: 1.7rem;}
    .quote .quote-sing {font-size: 10rem;}
    .quote img {max-width: 220px;}

    .features > * {width: 100%;}
    .features .col > * {padding: 40px;}
    .features .col:nth-child(1) > *, .features .col:nth-child(3) > * {padding-right: 150px;}

    .buy .empty {display: none;}
    .buy img {margin-top: -75px; margin-bottom: -150px;}
    .buy .row {justify-content: space-between;}

    .advantages .col {width: 50%;}

    .review {font-size: 1.2rem;}
    .review .name {font-size: 1.4rem;}
    .reviews .owl-dots {gap: 20px;}
    .reviews .owl-dots span {width: 20px; height: 20px;}

    #request h2 {font-size: 2.3rem;}
    #request p {font-size: 1.2rem;}
    
    body > footer .logo {margin-bottom: 100px;}
    body > footer .logo img {max-width: 270px;}
    body > footer .logo p {font-size: 1rem; margin-top: 15px;}
    body > footer .col {width: 100%;}
}


@media (max-width: 768px) {  
    .main {padding: 0;}
    .mobile-bg {display: block;}
    .main:before {display: none;}
    .logo-block {display: none;}
    .main .book {margin-top: -150px; height: auto;}
    .book .image-wrap {display: none;}
    .book .text-wrap {width: 100%;}
    .book-mobile {display: block;}

    .excerpt-tabs .buttons .btn {font-size: 0.9rem;}

    .quote {padding: 0 50px;}
    .quote img {max-width: 200px;}

    #teaser {margin-top: -75px;}

    .features .col > * {font-size: 1.3rem;}

    #buy {overflow: hidden;}
    .buy {margin: 50px; padding: 50px 0 100px;}
    .buy .col {width: 100%;}
    .buy .image-wrap {order: 9;}
    .buy .price {text-align: center;}
    .buy .buttons {justify-content: center;}
    .buy img {margin-top: 0; margin-bottom: 0; transform: scale(1.4);}

    .advantages .text {padding: 20px;}
}


@media (max-width: 576px) {  
    .main {overflow: hidden;}
    .mobile-bg {width: 130%; max-width: unset; transform: translateX(-10%);}
    .book-mobile {padding: 0 0 500px;}
    .main .book {margin-top: -175px;}

    .excerpt {padding-bottom: 220px;}
    .excerpt-tabs .text {padding: 40px;}
    .excerpt .btn {line-height: 60px;}

    .quote {font-size: 1.4rem;}
    .quote .quote-sing {font-size: 8rem;}

    #teaser p {font-size: 1.2rem;}

    .features .col > * {padding: 40px !important;}
    .features .col > * img {
        right: 0;
        bottom: 0;
        position: relative;
        margin-left: auto;
        display: block;
        margin-top: 20px;
    }

    .review {padding: 50px 40px;}

    #request h2 {font-size: 2rem;}

    .gradient-white-yellow {height: 30px;}
    .gradient-yellow-white {height: 30px;}  
    
    .buy {margin: 0 50px; padding: 100px 0 100px;}
    .buy img {transform: scale(1.7);}
    .buy .price {font-size: 1.8rem;}

    #payment-form small {font-size: 0.9rem;}
}


@media (max-width: 480px) {  
    .main .logo img {max-width: 250px;}
    .main .book {margin-top: -220px;}

    .excerpt .image-wrap {height: auto;}
    .excerpt-tabs .text .area {font-size: 1.1rem;}
    .excerpt .btn {line-height: 50px;}

    .quote {font-size: 1.2rem; padding: 0 15px;}
    .quote img {max-width: 170px;}

    #teaser p {font-size: 1.1rem;}

    .features .col > * {font-size: 1.2rem;}

    .buy img {transform: scale(2); margin-bottom: 50px;}
    .buy .price {font-size: 1.6rem;}

    .advantages .col {width: 100%;}

    .review {font-size: 1.1rem;}
    .review .name {font-size: 1.25rem;}
    .reviews .owl-dots {gap: 15px;}
    .reviews .owl-dots span {width: 15px; height: 15px;}    

    #request h2 {font-size: 1.6rem;}
    #request p {font-size: 1rem; margin-bottom: 30px;}
    #payment-form small {font-size: 0.7rem;}

    body > footer .logo {margin-bottom: 75px;}
    body > footer .logo img {max-width: 240px;}
    body > footer .logo p {font-size: 0.8rem;}
}


@media (max-width: 380px) {  
    .main .logo img {max-width: 100%;}
    .main .logo p {font-size: 0.8rem;}
    .book-mobile {padding: 0 0 400px;}
    .main .book .text h2 {font-size: 1.4rem;}
    .main .book .text p {font-size: 1rem;}

    .excerpt-tabs .text {padding: 20px;}
    .excerpt-tabs .text .area {font-size: 1rem;}

    .quote {
        font-size: 0.9rem;
        margin: 0 15px;
        height: 300px;
        line-height: 200%;
    }    

    #teaser p {font-size: 1rem;}

    .features .col > * {font-size: 1.1rem; padding: 30px !important;}

    .buy {margin: 0 30px;}
    .buy img {margin-bottom: 30px;}
    .buy .price {font-size: 1.4rem;}

    .advantages .text {font-size: 1.1rem;}

    .review {padding: 40px 30px; border-radius: 30px;}

    #request h2 {font-size: 1.4rem; font-weight: 500;}
    #request p {font-size: 0.9rem;}
    #payment-form .row {row-gap: calc(var(--bs-gutter-y) / 2);}

}