/* Страница --- index или главная  */
@import "./index/header.css";
@import "./index/promo.css";
@import "./index/service.css";
@import "./index/product.css";
@import "./index/about.css";
@import "./index/value.css";
@import "./index/gallery.css";
@import "./index/questions.css";
@import "./index/dealer.css";
@import "./index/footer.css";

/* Страница --- commercial */
@import "./shutter/commercial.css";
@import "./shutter/gallery-com.css";
@import "./shutter/versatle.css";
@import "./shutter/example.css";
@import "./shutter/install.css";
@import "./shutter/advice.css";

/* Страница --- gallery */
@import "./gallerry/gallery-page.css";

/* Страница --- options */
@import "./options_page/options_page.css";

/* Страница --- login_dealer and forgot the password */
@import "./login_dealer/login_dealer.css";

/* Страница --- new_dealer */
@import "./new_dealer/new_dealer.css";

/* Страницы --- pages*/
@import "./about_us/about_us.css";

/* Страницы --- sun_protection*/
@import "./sun_protection/sun_protection.css";

/* first_responder */
@import "./first_responder/first_responder.css";


html {
    box-sizing: border-box;
    scroll-behavior: smooth;

}

*,
*::before,
*::after {
    box-sizing: inherit;
}

@font-face {
    font-family: 'Aleo';
    src: url('../fonts/Aleo-Regular.woff2') format('woff2');
    font-display: swap;
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Aleo';
    src: url('../fonts/Aleo-Bold.woff2') format('woff2');
    font-display: swap;
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-Light.woff2') format('woff2');
    font-display: swap;
    font-weight: 700;
    font-style: normal;
}


@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Bold.woff2') format('woff2');
    font-display: swap;
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Medium.woff2') format('woff2');
    font-display: swap;
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Light.woff2') format('woff2');
    font-display: swap;
    font-weight: 400;
    font-style: normal;
}

a {
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    outline: none;
    padding: 0;
    margin: 0;
}

:root {
    --color-accent: #F7CE2A;
    --color-primary: #826E66;
    --color-text: #474747;
    --color-white: #fff;
    --color-span-zag: #BDBDBD;
    --color-dop: #67645a;
    --font-family: "Montserrat", sans-serif;
    --second-family: "Aleo", sans-serif;
    --third-family: "Poppins", sans-serif;
}


input {
    outline: none;
}

select {
    outline: none;
}

p {
    margin: 0;
    padding: 0;
}
img {
	max-width: 100%;
}

body {
    font-family: 'Montserrat', 'Aleo', 'Poppins', sans-serif;
}

h1,
h2,
h3 {
    margin: 0;
}


.list_reset {
    padding: 0;
    list-style: none;
}

.container {
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
}

.container__padding {
    padding-left: clamp(10px, calc(0.625rem + ((1vw - 4.5px) * 21.0884)), 320px);
    padding-right: clamp(10px, calc(0.625rem + ((1vw - 4.5px) * 21.0884)), 320px);
}

.container__padding_right {
    padding-right: clamp(10px, calc(0.625rem + ((1vw - 4.5px) * 21.0884)), 320px);
}

.position_relaitive {
    position: relative;
}

.btn_reset {
    cursor: pointer;
}

.zag__section {
    font-family: var(--second-family);
    font-weight: 700;
    font-size: clamp(18px, calc(1.125rem + ((1vw - 9.98px) * 2.82)), 44px);
    line-height: 114%;
    color: var(--color-primary);
    /*text-wrap: balance;*/
}

.zag__section_size {
    font-size: clamp(35px, calc(2.1875rem + ((1vw - 9.98px) * 2.7115)), 60px);
}

.zag__section_color {
    color: var(--color-accent);
}

.text__section {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: clamp(12px, calc(0.75rem + ((1vw - 9.98px) * 0.8677)), 20px);
    line-height: 160%;
    color: var(--color-text);
    /*text-wrap: balance;*/
}

.btn__section {
    position: relative;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: clamp(10px, calc(0.625rem + ((1vw - 4px) * 0.9211)), 24px);
    line-height: 117%;
    color: var(--color-primary);
    box-shadow: 0 0 40px 11px rgba(0, 0, 0, 0.1);
    background: var(--color-accent);
    padding: 24px 83.5px;
    border: none;
    cursor: pointer;
    z-index: 500;
    text-wrap: nowrap;
}

.btn__section_bacground {
    background-color: var(--color-white);
    border: 1px solid var(--color-dop);
}

.footer__text {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: clamp(6px, calc(0.375rem + ((1vw - 4px) * 0.6579)), 16px);
    line-height: 125%;
    color: var(--color-primary);
}
@media(max-width: 1440px) {
	.active::after {
		border-width: 48px 0 56px 54px;
	}
}

@media(max-width: 1224px) {
    .mySwiper3 {
        display: none;
    }

    .mySwiper2 {
        display: none;
    }

    .btn__gallery {
        left: -227px;
    }

    .active {
        margin-right: 0;
    }
	
	.active::after {
		border-width: 48px 0 53px 54px;
	}

    .gallery__block_litl {
        margin-left: 300px;
    }

    .gallery {
        background-image: none;
        margin-bottom: 30px;
        padding-top: 30px;
    }

    .gallery_flex {
        flex-direction: column;
    }

    .gallery__block_litl {
        margin-left: 0;
    }

    .btn__gallery {
        top: 411px;
        left: 72px;
    }

    .swiper-button-nexts {
        transform: rotate(270deg);
    }

    .swiper-button-prevs {
        transform: rotate(270deg);
    }

    .gallery__view {
        margin-right: 0;
    }
}

@media(max-width: 1024px) {

    .menu {
        top: 47px;
    }

    .btn__section {
        padding: 24px 31.5px;
    }

    .btn__dealer_bacground {
        padding: 24px 31.5px;
    }

    .service__info {
        margin-right: 32px;
    }

    .product__btn::before {
        width: 100%;
        display: none;
        position: relative
    }

    .product {
        flex-direction: column;
    }

    .active {
        margin-right: 0;
    }

    .active::after {
        display: none;
    }

    .product__btn {
        padding: 21px;
    }

    .active::after {
        right: -33px;
        border-width: 31px 0 27px 34px;
    }


    .about__history {
        margin-right: 72px;
    }

    .value__item img {
        width: 42px;
    }

    .questions__block {
        padding: 43px 75px;
    }

    .form__input {
        margin-left: 10px;
    }


    /* shutter */
    .commercial__item img {
        width: 30px;
    }

    /* .commercial__wrap {
        justify-content: start;
        margin-left: 72px;
    } */

    .swiper-button-nexts-com {
        right: 24px;
    }

    .swiper-button-prevs-com {
        left: 24px;
    }

    .example img {
        max-width: 332px;
        width: 100%;
    }

    .install__block_left {
        max-width: 358px;
    }

    .install__span img {
        width: 30px;
    }


    /* login_leader */

    .login__form_wrapper {
        padding: 34px 55px 40px 40px;
    }

    .form__checkbox {
        flex-direction: column;
        margin-bottom: 20px;
    }


    .checkbox__load {
        margin-bottom: 15px;
    }

    .login__block img {
        width: 420px;
    }

    .options__element img {
        max-width: 360px;
    }


    /* options */

    .options__list {
        padding-bottom: 10px;
    }

    .options__item:not(:first-child) {
        margin-top: 5px;
    }

    .options__item {
        align-items: center;
    }


    /* request */

    .form__newdealer {
        padding: 33px 30px 95px 33px;
    }

    .form__label_width {
        max-width: 297px;
    }

    .file__types {
        margin-left: 30px;
    }
    
      .sun__block_grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }

    .sun__swiper {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }

    .stops__block {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .stops__block {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }


    .about_block_flex {
        flex-direction: column;
    }

    .block__info_flex {
        margin-left: 0;
    }
}

/* @media(max-width: 848px) {
    .gallery {
        padding-top: 15px;
    }
    
    .btn__gallery {
        top: 17px;
        left: -270px;
    }

    .gallery__block_litl {
        margin-left: 300px;
    }
} */

@media(max-width: 450px) {

    .header {
        padding-bottom: 0;
    }

    .header__up {
        margin-bottom: 10px;
    }

    .header__contacts {
        flex-direction: column;
        align-items: center;
        margin-right: 15px;
    }

    .header__btn {
        padding: 7px 10px;
    }

    .header__link_before::before {
        width: 20px;
        height: 20px;
    }


    .menu_active {
        display: block !important;
    }

    .menu {
        position: relative;
        padding: 10px;
        top: 0px;
        display: none;
    }

    .menu__grid {
        display: grid;
        grid-template-columns: repeat(2, 166px);
    }

    .nav {
        position: relative;
        padding-top: 30px;
        display: none;
        padding-bottom: 30px;
        background-color: var(--color-accent);
    }


    .nav__list {
        display: grid;
        grid-template-columns: repeat(3, 2fr);
        gap: 20px;
    }


    .promo__text {
        padding-top: 80px;
    }

    .promo_down {
        display: none;
    }

    .promo__block {
        padding-bottom: 0px;
    }

    .service {
        flex-direction: column;
        padding-top: 30px;
    }

    .service__zag {
        margin-bottom: 20px;
    }

    .service__zag_margin {
        margin-top: 40px;
    }

    .product {
        padding-bottom: 30px;
    }

    .product__item {
        padding-left: 10px;
    }

    .active {
        margin-right: 0px;
    }

    .product__btn {
        text-wrap: balance;
    }

    .images img {
        height: auto;
    }

    .active_btn {
        margin-right: 0;
    }

    .active::after {
        display: none;
    }


    .about {
        padding-bottom: 60px;
    }

    .about__block {
        flex-direction: column;
        margin-top: 20px;
    }

    .about__history {
        margin-right: 0;
        margin-bottom: 20px;
    }

    .value__info {
        margin-bottom: 60px;
    }

    .value__list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        margin-bottom: 30px;
    }

    .value__info {
        flex-direction: column;
    }

    .value__info p {
        margin-right: 0;
        margin-bottom: 20px;
    }

    .questions {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .questions__zag {
        margin-bottom: 20px;
    }

    .questions__block {
        padding: 13px 15px;
    }

    .form__block {
        flex-direction: column;
    }

    .form__input {
        margin-left: 0;
        margin-bottom: 5px;
    }



    .dealer__logo {
        display: none;
    }

    .btn__section {
        padding: 10px 20.5px;
    }

    .btn__dealer_bacground {
        padding: 10px 20.5px;
    }


    .footer__item:not(:first-child) {
        margin-top: 8px;
    }


    /* gallery */

    .gallery-page {
        padding-top: 30px;
        padding-bottom: 60px;
    }

    .gallery-page__block {
        flex-direction: column;
    }



    .close {
        top: 172px;
    }


    .modal-content {
        max-width: 70%;
        max-height: 90%;
        transform: scale(1.1);
    }


    /* login_dealer */

    .login__form_wrapper img {
        margin-bottom: 20px;
    }

    .login__img_fon {
        display: none;
    }

    .login__form {
        padding: 20px 10px;
    }

    .login__form_wrapper {
        margin-bottom: 147px;
    }


    /* options */

    .options__zag {
        padding: 30px 0;
    }

    .options__element img {
        max-width: 140px;
    }

    .options__item {
        font-size: 6px;
    }

    .options__zag_h3__mobile {
        font-size: 10px;
    }

    .icon__options {
        height: 20px;
    }


    /* shutter */
    .commercial {
        padding-top: 33px;
        padding-bottom: 60px;
    }

    .commercial__block {
        flex-direction: column;
        padding-top: 20px;
    }

    .commercial__wrap {
        margin-left: 0;
        margin-bottom: 20px;
    }

    .btn__gallery-com {
        display: none;
    }

    .versatile {
        padding-top: 30px;
        padding-bottom: 60px;
    }

    .example img {
        max-width: 126px;
    }

    .install {
        flex-direction: column;
        padding-top: 30px;
    }

    .install__block_left {
        margin-right: 0;
        margin-bottom: 20px;
    }

    .dealer_margin {
        margin-top: 30px;
    }


    /* new_dealer */

    .newdealer__zag_block {
        flex-direction: column;
    }

    .newdealer__zag_block h1 {
        margin-bottom: 10px;
    }

    .form__blocks_flex {
        flex-direction: column;
    }

    .line__2_margin {
        margin-top: 0;
    }

    .form__newdealer {
        margin-bottom: 0;
    }

    .newdealer__text {
        margin-top: 30px;
        margin-bottom: 35px;
    }


    .form__input_dealer {
        margin-bottom: 10px;
    }


    /* request */

    .form__chekbox_block {
        flex-direction: column;
    }

    .form__check_one {
        margin-bottom: 10px;
    }

    .form__chekbox_block label {
        font-size: 12px;
    }

    .upload__block {
        flex-direction: column;
        padding: 10px;
    }

    .upload__block button {
        margin-bottom: 10px;
    }

    .file__types {
        margin-left: 0;
    }

    .footer__form {
        margin-bottom: 30px;
    }
}

.all-caps {
    text-transform: uppercase;
}

.wpcf7-not-valid {
    border: 2px solid red;
}

.wpcf7-not-valid-tip {
    color: red;
}

.wpcf7-response-output, .wpcf7 .screen-reader-response p {
    font-weight: bold;
}

.form__block p {
    flex-basis: 100%;
}

.wpcf7-form-control.wpcf7-radio {
    display: flex;
    justify-content: space-between;
}

.wpcf7-form-control.wpcf7-radio .wpcf7-list-item {
    flex-basis: 100%;
}

.wpcf7-form-control.wpcf7-checkbox {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    max-width: 633px;
}

.wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item {
    align-items: center;
    font-family: var(--font-family);
    font-weight: 500;
    font-size: 16px;
    line-height: 125%;
    color: var(--color-primary);
    margin: 8px 0;
}

.wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item input {
    margin-right: 8px;
}

.wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item span {
    vertical-align: super;
}

.file__types {
    margin-left: 64px;
}

.end-align {
    text-align: end;
}

.hidden {
    display: none;
}