﻿/*
Theme Name: Reboot Child
Theme URI: https://wpshop.ru/themes/reboot
Author: WPShop.biz
Author URI: http://wpshop.biz/
Template: reboot
Version: 1.0.0
*/

/* Below you can add your CSS styles */
/* Ниже Вы можете добавить свои CSS стили */

/*
BREAK POINT THEM:
@media (min-width: 576px);
@media (min-width: 768px);
@media (min-width: 992px);
@media (min-width: 1024px);
@media (min-width: 1200px);
*/

/*
Recommended image sizes
reboot_small — 335×220
reboot_square — 100х100
reboot_standard — 870×400
Широкая: 1190x400
reboot_full - 1920x400
Шрифт <link href="https://fonts.googleapis.com/css2?family=Golos+Text:wght@400..900&display=swap" rel="stylesheet">
*/

:root {
    --font-family-primary: "Caveat", "Helvetica Neue", Helvetica, Arial;
    --font-primary: "Golos Text", sans-serif;
    --heading-color: #212121;
    --font-secondary: "Caveat", "Helvetica Neue", Helvetica, Arial;
    --accent-color: #ffa127;
    --primary-color: #4E4E4E;
    --secondary-color: #174A90;
    --light-color: #ffffff;
    --grey-color: #e2e1e6;
    --light-grey-bg: #f7f9fa;
    --blue-color: #f2f4ff;
    --green-color: #08a962;
    --red-color: #ff4019;
    --link-color: #0070f0;
    --gradient-orange-to-red: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
    --box-shadow-blue: 0 0 1.5625rem 0 rgb(54 186 254 / 15%);
    --box-shadow-red: 0 0 1.5625rem 0 rgb(237 105 125 / 15%);
    --box-shadow-green: 0 0 1.5625rem 0 rgb(0 150 136 / 15%);
}

/* Style reset */
a {
    color: inherit;
    text-decoration: none;
    transition: all .2s ease-in-out;
}

a:focus {
    outline: none;
}

.page-content a,
.contact-form-notes-after a,
.quizle-contacts__agreement a {
    color: #3960ff;
    border-bottom: 1px dashed #3960ff;
}

.page-content a:hover,
.contact-form-notes-after a:hover,
.quizle-contacts__agreement a:hover {
    color: var(--red-color);
    border-bottom: 1px dashed var(--red-color);
}

.list-reset {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul.wp-block-list li {
    list-style-type: none !important;
}

ol.wp-block-list li {
    margin: 5px 0;
}

.btn-reset {
    border: none;
    padding: 0;
    background: 0 0;
    cursor: pointer;
}

.btn-reset:focus {
    outline: var(--light-color);
}

.telegram-btn:active, .telegram-btn:focus,
.whatsapp-btn:active, .whatsapp-btn:focus {
    color: var(--light-color);
}

.whatsapp-btn:focus-visible, .telegram-btn:focus-visible {
    outline: none;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    border: 0;
    clip: rect(0 0 0 0);
}

/* Mobile menu fix */
.mobile-menu-placeholder + .site-content {
    margin-top: -60px;
}

@media (min-width: 768px) {
    .mobile-menu-placeholder + .site-content {
        margin-top: -30px;
    }
}

/*.home #site-navigation-mobile ul {*/
/*    flex-direction: row;*/
/*    justify-content: center;*/
/*}*/

/* Menu for desktop */
.site-header + .main-navigation, .main-navigation {
    z-index: 9999;
}

@media (min-width: 992px) {
    .main-navigation.full .menu {
        justify-content: center;
    }
}

#header_menu li {
    position: relative;
}

#header_menu > li > a:before, #header_menu > li > span:before {
    content: "";
    position: absolute;
    left: 15px;
    top: 100%;
    width: 40%;
    height: 2px;
    background: var(--red-color);
    transform: scaleX(0);
    transform-origin: center center;
    transition: all .2s;
}

#header_menu > li > a:hover:before, #header_menu > li > span:hover:before {
    transform: scaleX(1);
}

/* Social button fixed */
.social-links {
    margin-top: 0;
}

@media (min-width: 768px) {
    .social-links {
        display: none;
    }
}

@media (min-width: 1200px) {
    .social-links {
        display: block;
    }
}

article#post-26 {
    display: none;
}

.social-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    color: var(--heading-color);
}

.comment-reply-title, .comments-title, .h1, .h2, .h3, .h4, .h5, .h6, .related-posts__header, .section-block__title, h1, h2, h3, h4, h5, h6 {
    margin: 1em 0;
}

.section-block h2 {
    font-family: var(--font-family-primary), sans-serif;
    font-size: 2.125em;
    text-transform: uppercase;
    color: var(--secondary-color);
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    line-height: 1.5;
}

.section-block h2 span {
    display: block;
    font-weight: 700;
    color: var(--accent-color);
    line-height: 1;
}

p:last-child {
    margin-bottom: 0;
}

.title-hidden .section-block__title {
    display: none;
}

/* Tabs */
.js-tabs-block.js-active {
    display: block;
}

.js-tabs-block {
    display: none;
}

/* UI-UX Custom preset */
.section-preset-custom--bgc-1:before,
.section-preset-custom--bgc-2:before,
.section-preset-custom--bgc-3:before,
.section-preset--gradient-1:after,
.section-preset-custom--bgi-1:after,
.section-preset-custom--bgi-2:after,
.section-preset-custom--bgi-3:after,
.site-footer:before {
    content: "";
    position: absolute;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw) !important;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
}

.section-preset-custom--bgc-1:before {
    background: var(--blue-color);
}

.section-preset-custom--bgc-2:before {
    background: var(--light-grey-bg);
}

.section-preset-custom--bgi-1:after {
    background-image: url("assets/images/bg-1.png");
    background-position: center left;
    background-size: cover;
    opacity: 0.5;
}

.section-preset-custom--bgi-2:after {
    background-color: #FFF5D9;
    background-image: url("assets/images/bg-2.png");
    background-position: center center;
    background-size: cover;
    opacity: 0.35;
}

.section-preset-custom--bgi-3:after {
    background-color: var(--blue-color);
    background-image: url("assets/images/bg-3.png");
    background-position: center left;
    background-size: cover;
    opacity: 0.5;
}

.full-container {
    margin-left: calc(-50vw + 50%);
    transform: translateX(0);
    width: 100vw !important;
    max-width: 100vw;
    flex: 1 0 auto;
}

.site-footer {
    position: relative;
    overflow: hidden;
}

.site-footer:before {
    background-image: url("assets/images/bg-footer.png");
    background-position: center center;
    background-size: cover;
    opacity: 0.1;
}

/* UI-UX Button */
.primary-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 400;
    text-decoration: none;
    color: var(--light-color);
    padding: 0.9rem 1.5rem;
    position: relative;
    z-index: 1;
    border: none;
    border-radius: 100px;
    transition: all .15s ease-out;
    gap: 5px;
    overflow: hidden;
}

.primary-btn:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(to left, #ffa127 0, #f20c46 100%);
    transition: opacity .15s;
    z-index: -1;
}

.primary-btn:hover {
    color: var(--light-color);
    /*transform: translate3d(0, -3px, 0);*/
    transform: translateY(-3px) translateZ(0);
    box-shadow: 0 15px 35px -16px rgba(0, 0, 0, .8);
}

a.primary-btn,
a.primary-btn:hover,
a.primary-btn:active,
a.primary-btn:focus {
    color: var(--light-color);
}

a.primary-btn:hover {
    box-shadow: 0 15px 35px -16px rgba(0, 0, 0, .9);
}

a.primary-btn:focus-visible {
    outline: none;
}

.telegram-btn, .whatsapp-btn {
    padding: 10px 24px;
}

.telegram-btn:before {
    background-image: none;
    background-color: #2aabee;
}

.whatsapp-btn:before {
    background-image: none;
    background-color: #009688;
}

/*
UI-UX Animate effects
Ripple-effects
*/
.ripple {
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.ripple-effects {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.ripple-effects::after {
    content: '';
    position: absolute;
    height: 350%;
    width: 200%;
    top: 0;
    left: -100%;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 100%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    z-index: 20;
    -webkit-animation-name: ripple-effects;
    animation-name: ripple-effects;
    -webkit-animation-duration: 2.5s;
    animation-duration: 2.5s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

@keyframes ripple-effects {
    20% {
        opacity: 0;
        -webkit-transform: scale(2.5);
        transform: scale(2.5);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(2.5);
        transform: scale(2.5);
    }
}

/* Animate ripple-circle */
.ripple-circle:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 1000px;
    z-index: 10;
    animation: ripple-circle 0.7s linear infinite;
    box-shadow: 5px 5px 10px rgba(163, 177, 198, 0.6),
    -5px -5px 10px rgba(255, 255, 255, 0.5);
}

@keyframes ripple-circle {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 161, 39, 0.3), 0 0 0 1em rgba(255, 161, 39, 0.3), 0 0 0 3em rgba(255, 161, 39, 0.03), 0 0 0 5em rgba(163, 177, 198, 0.01);
    }

    100% {
        box-shadow: 0 0 0 1em rgba(255, 161, 39, 0.3), 0 0 0 3em rgba(255, 161, 39, 0.03), 0 0 0 5em rgba(255, 161, 39, 0.03), 0 0 0 8em rgba(255, 161, 39, 0.01);
    }
}

/* Animate link rgb(0 112 240)*/
.link-wave {
    color: var(--link-color) !important;
    background: linear-gradient(to bottom, rgba(0, 112, 240, 0) 0%, rgba(0, 112, 240, 0) 100%) repeat-x 0 100%;
    padding-bottom: 2px;
    transition: all .3s;
}

.link-wave:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='squiggle-link' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:ev='http://www.w3.org/2001/xml-events' viewBox='0 0 20 4'%3E%3Cstyle type='text/css'%3E.squiggle{animation:shift .3s linear infinite;}@keyframes shift {from {transform:translateX(0);}to {transform:translateX(-20px);}}%3C/style%3E%3Cpath fill='none' stroke='%230070f0' stroke-width='1' class='squiggle' d='M0,3.5 c 5,0,5,-2,10,-2 s 5,2,10,2 c 5,0,5,-2,10,-2 s 5,2,10,2'/%3E%3C/svg%3E");
    background-position: 0 100%;
    background-size: auto 4px;
    background-repeat: repeat-x;
    text-decoration: none;
    color: var(--red-color) !important;
}

/* Hover loup effect */
.hoover-loup-effect, .hoover-eye-effect {
    position: relative;
}

.hoover-loup-effect::before {
    content: '';
    position: absolute;
    width: 50px;
    height: 50px;
    right: 10px;
    bottom: 10px;
    z-index: 2;
    background: url('data:image/svg+xml,%3Csvg%20xmlns="http://www.w3.org/2000/svg"%20width="64"%20height="64"%20viewBox="0%200%20485.213%20485.213"%20fill="%23ffffff"%3E%3Cpath%20d="M471.882%20407.567%20360.567%20296.243a214.267%20214.267%200%200%201-64.331%2064.321L407.56%20471.888c17.772%2017.768%2046.587%2017.768%2064.321%200%2017.773-17.739%2017.773-46.554.001-64.321zM363.909%20181.955C363.909%2081.473%20282.44%200%20181.956%200%2081.474%200%20.001%2081.473.001%20181.955s81.473%20181.951%20181.955%20181.951c100.484%200%20181.953-81.469%20181.953-181.951zM181.956%20318.416c-75.252%200-136.465-61.208-136.465-136.46%200-75.252%2061.213-136.465%20136.465-136.465%2075.25%200%20136.468%2061.213%20136.468%20136.465%200%2075.252-61.218%20136.46-136.468%20136.46z%20M75.817%20181.955h30.322c0-41.803%2034.014-75.814%2075.816-75.814V75.816c-58.517%200-106.138%2047.621-106.138%20106.139z"/%3E%3C/svg%3E') no-repeat;
    background-size: cover;
}

.hoover-loup-effect::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: var(--accent-color);
    right: -35px;
    bottom: -35px;
    width: 140px;
    height: 140px;
    transform: scale(0);
    transition: all 0.3s linear;
}

.hoover-loup-effect:hover::after {
    transform: scale(1);
    animation: ripple-loup 0.3s linear;
}

@keyframes ripple-loup {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

/* Hover eye effect */
.hoover-eye-effect::before {
    content: '';
    position: absolute;
    width: 50px;
    height: 50px;
    right: 50%;
    bottom: 50%;
    z-index: 2;
    background: url('data:image/svg+xml,%3Csvg%20xmlns="http://www.w3.org/2000/svg"%20width="64px"%20height="64px"%20viewBox="0%200%20512%20512"%20fill="%23FFFFFF"%3E%3Cpath%20d="M256,96C144.341,96,47.559,161.021,0,256c47.559,94.979,144.341,160,256,160c111.656,0,208.439-65.021,256-160%20C464.441,161.021,367.656,96,256,96z%20M382.225,180.852c30.082,19.187,55.572,44.887,74.719,75.148%20c-19.146,30.261-44.639,55.961-74.719,75.148C344.428,355.257,300.779,368,256,368c-44.78,0-88.428-12.743-126.225-36.852%20c-30.08-19.188-55.57-44.888-74.717-75.148c19.146-30.262,44.637-55.962,74.717-75.148c1.959-1.25,3.938-2.461,5.929-3.65%20C130.725,190.866,128,205.613,128,221c0,70.691,57.308,128,128,128c70.691,0,128-57.309,128-128%20c0-15.387-2.725-30.134-7.703-43.799C378.285,178.39,380.266,179.602,382.225,180.852z%20M256,205c0,26.51-21.49,48-48,48%20s-48-21.49-48-48s21.49-48,48-48S256,178.49,256,205z"/%3E%3C/svg%3E') no-repeat;
    background-size: cover;
    transform: translate(50%, 50%);
    opacity: 0;
    transition: all 0.3s linear;
}

.hoover-eye-effect:hover::before {
    opacity: 1;
}

.hoover-eye-effect::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 161, 39, .80);
    right: calc(50% - 70px);
    bottom: calc(50% - 70px);
    width: 140px;
    height: 140px;
    transform: scale(0);
    transition: all 0.3s linear;
}

.hoover-eye-effect:hover::after {
    transform: scale(1);
    animation: ripple-eye 0.3s linear;
}

@keyframes ripple-eye {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

/* UI-UX Quizle */
.quizle {
    margin-top: 0;
    margin-bottom: 0;
}

.quizle-button, a.quizle-button {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    white-space: nowrap;
    position: relative;
    background-color: transparent;
}

.quizle-button:hover, a.quizle-button:hover {
    color: var(--light-color);
}

.quizle-button:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(to left, #ffa127 0, #f20c46 100%);
    transition: opacity .15s;
    z-index: -1;
}

.quizle-progress-container {
    flex-grow: 1;
}

.quizle-footer {
    border-bottom-left-radius: 21px;
    border-bottom-right-radius: 21px;
    gap: 10px;
}

.quizle-footer__steps {
    flex-grow: 0;
    gap: 10px;
}

@media screen and (min-width: 425px) and (max-width: 768px) {
    .quizle-image-screen__image {
        max-width: 70%;
        align-self: center;
    }
}

.quizle-answer--check .quizle-answer__body {
    flex-grow: 1;
}

.quizle-button, a.quizle-button, a:visited.quizle-button {
    font-size: .875rem;
    padding: 0.75rem 1.5rem;
}

.quizle-contacts__title,
.quizle-question__title,
.quizle-image-screen__title {
    color: var(--heading-color);
}

.mypopup-body .quizle-contacts {
    flex-direction: column;
    gap: 0;
}

.mypopup-body .quizle-contacts__title,
.mypopup-body .quizle-question__title,
.mypopup-body .quizle-image-screen__title {
    font-size: 18px;
}

.quizle-progress {
    display: flex;
    justify-content: center;
}

@media (min-width: 576px) {
    .quizle-progress {
        justify-content: start;
    }
}

.quizle-contacts__title,
.quizle-question__title,
.quizle-image-screen__title {
    font-size: clamp(18px, 2vw, 20px);
}

.quizle-image-screen__description {
    font-size: 1rem;
}

.quizle-question__description:empty {
    display: none;
}

.quizle-answer--custom input[type=text]:disabled,
.quizle-answer--custom input[type=text]:focus {
    border: transparent;
}

.quizle--view-slides .quizle-questions {
    padding-bottom: calc(var(--quizle-footer-height) - 15px);
}

@media (min-width: 768px) {
    .quizle--view-slides .quizle-questions {
        padding-bottom: calc(var(--quizle-footer-height) + 20px);
    }
}

@media (max-width: 425px) {
    .mypopup-modal-close {
        top: -30px !important;
        right: 0 !important;
    }
}

/* Header contacts */
.header-contacts svg {
    width: 14px;
    height: 14px;
    fill: var(--red-color);
}

/* Contact Form style */
.contact-form__field {
    margin-bottom: .875rem;
}

.contact-form__field input[type=text],
.contact-form__field input[type=email] {
    width: 100%;
    border-radius: 50px;
}

.contact-form__field textarea {
    border-radius: 10px;
}

.contact-form .contact-form-notes-after {
    font-size: 80%;
    margin-top: -10px;
}

.contact-form button, .order-form button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 100%;
    border-radius: 50px;
    font-size: .875rem;
}

.contact-form__success {
    border: 2px solid rgb(0 150 136 / 34%);
    background-color: #b2dfdb;
    padding: 20px;
    margin: 0 0 1rem 0;
    font-size: 1rem;
    text-align: left;
    border-radius: 20px;
}

.btn-primary svg {
    width: 16px;
    height: 16px;
    fill: var(--light-color);
}

/* Footer */
.blog .site-footer-container {
    position: absolute;
    bottom: 0;
}

.footer-bottom {
    position: relative;
    z-index: 1;
}

.footer-info {
    display: flex;
    flex-wrap: wrap;
    gap: 1vw;
    justify-content: center;
    padding: 2vh 0;
    border-top: 1px solid #FFFFFF29;
}

.footer-info .pseudo-link {
    color: var(--light-color);
    transition: all .2s ease-in-out;
}

.footer-info .pseudo-link:active,
.footer-info .pseudo-link:hover,
.footer-info .pseudo-link:focus {
    color: var(--red-color);
    text-decoration: underline;
}

/* UI-UX divider */
.service-card__content h3,
.result-card__content h3 {
    position: relative;
}

.service-card__content h3:before,
.result-card__content h3:before {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 20%;
    height: 1px;
    border-bottom: 3px double var(--accent-color);
    opacity: .75;
}

.page-id-758 .table-of-contents ol li:before,
.page-id-3 .table-of-contents ol li:before {
    display: none;
}

/* UI-UX list */
.list-check-icon li {
    padding-left: 22px;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8' fill='%2385cc3d'%3e%3cpath d='M.27 3.663l.616-.615a.87.87 0 0 1 1.23 0l1.596 1.596L7.918.438c.34-.34.89-.34 1.23 0l.615.615c.34.34.34.89 0 1.23L5.046 7a.875.875 0 0 1-.095.113l-.615.615a.868.868 0 0 1-.624.254.869.869 0 0 1-.624-.254l-.615-.615A.876.876 0 0 1 2.378 7L.27 4.893a.87.87 0 0 1 0-1.23z'/%3e%3c/svg%3e");
    background-position: left center;
    background-repeat: no-repeat;
}

/* Swiper */
.swiper-container-reviews .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    border-color: var(--accent-color);
    color: var(--light-color);
}

.swiper-container-reviews .swiper-pagination {

}

.swiper-container-reviews .swiper-button-next, .swiper-container-reviews .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 6.1%;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    color: var(--accent-color);
}

.swiper-container-reviews .swiper-slide {
    width: auto;
}

/* WP Stories */
.wpstories-feed {
    margin-bottom: -30px;
}

@media (min-width: 768px) {
    .wpstories-feed {
        margin-bottom: 30px;
    }
}

/*  header   */
/*.header-top {*/
/*    display: flex;*/
/*    font-size: 0.75rem;*/
/*    justify-content: space-between;*/
/*}*/

/*.header-top p {*/
/*    margin-bottom: 0;*/
/*}*/

/*.header-top__text {*/
/*    max-width: 130px;*/
/*}*/
/*.header-top__contacts {*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*}*/

/*.header-top__address {*/
/*    max-width: 140px;*/
/*}*/

/*.header-top__address svg {*/
/*    display: inline-block;*/
/*}*/

