@charset "UTF-8";
/* @import url("addstyle.css"); */
/* Custom theme for BalkonOV by 360design.ru */
 

/*  GLOBAL VARS  */
:root {
    --form-button-offset: 194px;
}
@media (max-width: 991px) {
    :root {
        --form-button-offset: 170px;
    }
}
@media (max-width: 575px) {
    :root {
        --form-button-offset: 152px;
    }
}

html {
    scroll-behavior: smooth;
}


/* * { transition: .1s ease-in-out; } */


/* ************************************* */
/* Header */
/* ************************************* */
#logo:hover { fill: #fff; }
header .nav-link, header .nav-link:hover { color: var(--white);  font-weight: 400; transition: none /* .5s ease-in-out */; }
header .nav-link:hover { color: var(--white); padding-bottom: 6px; border-bottom: 2px solid var(--green); transition: none/*  .2s ease-in-out */;}
.top_phone_button { display: inline-block; white-space: nowrap; transition: .4s ease-in-out; }
.top_phone_button:hover { color:#fff; background: var(--darkgreen); border: none; }


.tophero {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.5)), url('../img/hero.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    background-attachment: fixed;
    background-size: cover;
}

.bighero_logo_container { width: 100%; overflow: hidden; display: block; }
.bighero_logo { /* width: 200%; */ font-size: 328px; font-weight: 700; }
.bighero_logo.white { text-align: left; }
.bighero_logo.black { text-align: right; }

.lead { font-size: 26px; font-weight: 500; }
@media (max-width: 575px) {
    .lead { font-size: 24px; }
    .tophero .lead { font-size: 18px; }
}

.nav>li>a { font-size: 16px; }




/* Marquee */
.marquee-container {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    position: relative;
}

.marquee-content_left {
    display: inline-block;
    /* padding-left: 100%; */
    animation: marquee_left 30s linear infinite;
}

.marquee-elem {
    display: flex;
    flex-direction: row;
    margin: 20px;
    align-items: center;
}

.marquee-elem .inner { 
    margin-right: 20px;
    text-align: start;
    /* word-break: break-all; */
}

@keyframes marquee_left {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}



/* kvartplanbox */
.kvartplanbox {
    background-image: url(../img/kvartplan.svg);
    background-position: right 14px top -237px;
    background-repeat: no-repeat;
    background-size: 30%;
}


.double_kvartplantration {
    background-image: url(../img/kvartplan.svg), url(../img/kvartplan.svg);
    background-position: right -150px top -738px, left -486px bottom -878px;
    background-repeat: no-repeat, no-repeat;
    background-blend-mode: screen;
}

#offer p.green { line-height: 1.5em; }



 /* Benefits */
.benefit {
height: 100%;
border: 1px solid var(--black);
}


@media (max-width: 768px) {
    .ok_galka { height: 40px; width: auto; margin-right: 10px; }
}





/* Steps */
section.steps .icon_round {
    min-width: 128px;
    min-height: 128px;
    background-position: center;
    background-repeat: no-repeat;
}

.steps h5 {
    font-size: 26px;
    letter-spacing: 0;
}

@media (max-width: 991px) {
    section.steps .icon_round {
        min-width: 80px;
        min-height: 80px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 50%;
    }
    
    .steps h5 {
        font-size: 18px;
        letter-spacing: 0;
    }
}


@media (max-width: 576px) {
    section.steps .icon_round {
        min-width: 56px;
        min-height: 56px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 50%;
    }

    #portfolio h5 { font-size: 20px; }
}



@media (max-width: 444px) {
    section.steps .icon_round {
        min-width: 48px;
        min-height: 48px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 50%;
    }
    .steps h5 { font-size: 16px; }
}


/* *{outline: 1px solid #f60;} */




/* Form */
.form {
    min-height: 600px;
    background: var(--green);
}
.form form { position: relative; }
.form input {
    padding: 2rem 28px 0.7rem 18px !important;
    border-radius: 16px;
    border: 6px solid var(--neutral_grey);
    font-size: 20px;
}
.form label {
    font-size: 18px;
}
.form-floating>label {
    font-size: 18px;
}


.buttonradio {
    height: 40px;
}

.buttonradio .form-check-label,
.buttonradio .form-check-label input[type="radio"] {
  display: block;
  /* position: absolute; */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
}

.buttonradio input[type="radio"] {
  opacity: 0.01;
  z-index: 100;
}

.buttonradio input[type="radio"]:checked+label {
  background: var(--lightgreen);
  color: var(--white);
}

.buttonradio .form-check-label {
  padding: 10px;
  border: 1px solid rgba(var(--lightgreen_rgb), 0.5);
  cursor: pointer;
  z-index: 90;
}

.buttonradio .form-check-label:hover {
  background: #DDD;
}

.form-check-input:checked {
    background-color: var(--green);
    border-color: var(--darkgreen);
}


.form button {
    position: absolute;
    bottom: -86px;
    left: calc(50% - var(--form-button-offset));
}
@media (max-width: 991px) {
    .form button {
        padding: 8px 32px 10px 32px !important;
        bottom: -78px;
    }
}
@media (max-width: 767px) { 
    .form {
        background-position: center;
        background-size: cover;
    }
}
@media (max-width: 576px) {
    .form {
        min-height: 600px;
        padding-top: 260px;
        background: var(--white) url("../assets/img/form_woman_crop.jpg") no-repeat top center;
        background-size: contain;
    }
    .form button {
        bottom: -60px;
    }
}

.datepicker:not(.is-inline) .datepicker__wrapper { z-index: 100001 !important; top: -178px !important; }

.detailinput input[type="text"]:focus::placeholder,
.detailinput textarea:focus::placeholder {
    color: transparent; /* Скрыть плейсхолдер при фокусе */
}

.detailinput input[type="text"]::placeholder,
.detailinput textarea::placeholder {
    color: rgba(var(--lightgreen_rgb), 0.8); /* Цвет плейсхолдера */
}

.quizfurther { 
    display: block;
    width: 100%;
    padding: 20px;
    margin: 30px 0;
    text-align: center;
    background: #ddd;
}
.quizfurther:hover { background: #aaa; }


.badge-present {
    position: absolute;
    top: 20px;
    left: -8px;
    width: 60px;
    height: 60px;
    box-shadow: 0 4px 5px #aaa;
    background: #fff;
}


/* ************************************* */
/* Footer */
/* ************************************* */








/* ************************************* */
/* Modals */
/* ************************************* */

.modal-lg { max-width: 600px; }

.modal-header { position: relative; padding-top: 10px; border-bottom: none; padding-bottom: 20px; margin-bottom: -20px; }
/* .modal-header-after { position: relative; outline: 1px dotted #f60; display: block; width: 100%; height: 40px; } */
.modal-header-after-shade { position: absolute; bottom: 0; z-index: 100000; display: block; width: calc(100% - 50px); height: 20px; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%); }
.modal-header.lightbottomborder { padding-bottom: 4px; margin-bottom: 0; background: var(--white); border-bottom: 1px solid var(--lightgreen); }
.modal-header.lightbottomborder .btn-close { margin-top: -20px; }


.modal-content { padding: 10px; }





/* ************************************* */
/* Form */
/* ************************************* */
.form-control:focus {
    color: var(--black);
    background-color: var(--white);
    border-color: var(--lightgreen);
    outline: 0;
    box-shadow: 0 0 3px .25rem rgba(var(--lightgreen_rgb), 0.2);
}


.custom_icon { display: inline-block; height: 1em; width: 1em; padding: 0; vertical-align: bottom; background-position: center; background-repeat: no-repeat; background-size: contain; }
.icon_phone { background-image: url("data:image/svg+xml,%3Csvg width='64' height='65' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m62.3217 47.0684-8.9501-8.9502c-3.1965-3.1965-8.6306-1.9178-9.9092 2.2375-.9589 2.877-4.1554 4.4753-7.0323 3.8358-6.3929-1.5982-15.0235-9.9091-16.6217-16.6217-.959-2.877.9589-6.0735 3.8358-7.0323 4.1554-1.2786 5.434-6.7127 2.2375-9.9092l-8.9502-8.95014c-2.5572-2.23755-6.393-2.23755-8.6305 0L2.22766 7.7515c-6.07334 6.393.6393 23.3344 15.66284 38.3579 15.0235 15.0235 31.9649 22.056 38.3579 15.6628l6.0733-6.0733c2.2377-2.5572 2.2377-6.393 0-8.6305Z' fill='%23000'/%3E%3C/svg%3E"); }
.icon_mail { background-image: url("data:image/svg+xml,%3Csvg width='64' height='45' viewBox='0 0 64 45' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M63.4362 3.21513L44.0264 22.5L63.4362 41.7849C63.7871 41.0515 64 40.2408 64 39.375V5.625C64 4.75912 63.7871 3.9485 63.4362 3.21513ZM58.375 0H5.625C4.75912 0 3.9485 0.212875 3.21513 0.56375L28.023 25.2466C30.2165 27.4401 33.7835 27.4401 35.977 25.2466L60.7849 0.56375C60.0515 0.212875 59.2409 0 58.375 0ZM0.56375 3.21513C0.212875 3.9485 0 4.75912 0 5.625V39.375C0 40.2409 0.212875 41.0516 0.56375 41.7849L19.9736 22.5L0.56375 3.21513Z' fill='black'/%3E%3Cpath d='M41.375 25.1514L38.6283 27.898C34.9735 31.5529 29.0263 31.5529 25.3715 27.898L22.625 25.1514L3.21509 44.4362C3.94846 44.7871 4.75909 45 5.62496 45H58.375C59.2408 45 60.0515 44.7871 60.7848 44.4362L41.375 25.1514Z' fill='black'/%3E%3C/svg%3E"); }
.icon_tg { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 100 100' style='enable-background:new 0 0 512 512' xml:space='preserve'%3E%3Cpath d='M89.442 11.418c-12.533 5.19-66.27 27.449-81.118 33.516-9.958 3.886-4.129 7.529-4.129 7.529s8.5 2.914 15.786 5.1 11.172-.243 11.172-.243l34.244-23.073c12.143-8.257 9.229-1.457 6.315 1.457-6.315 6.315-16.758 16.272-25.501 24.287-3.886 3.4-1.943 6.315-.243 7.772 6.315 5.343 23.558 16.272 24.53 17.001 5.131 3.632 15.223 8.861 16.758-2.186l6.072-38.13c1.943-12.872 3.886-24.773 4.129-28.173.728-8.257-8.015-4.857-8.015-4.857z' data-original='%236c6c6c' /%3E%3C/svg%3E"); }

.briefform input,
.briefform textarea { border-radius: 30px; border: none; padding: 14px 30px; }
.briefform input[type=checkbox] { border-radius: 6px; padding: 12px; margin-top: 2px; }
.briefform label[for=consentCheck] { padding-left: 10px; }

.consentlabel { line-height: .9em; }
@media (min-width: 1186px) {
    .consentlabel { line-height: 1.5em; }
}

@media (max-width: 992px) { 
    .briefform input,
    .briefform textarea { border-radius: 30px; border: none; padding: 8px 16px; }
    .briefform textarea { border-radius: 20px; }
}

@media (max-width: 1200px) { 
    .briefform .btn-primary { font-size: 1em; padding: 5px 20px; }
}





/* ************************************* */
/* Off-DOM elements */
/* ************************************* */

/* Cookies banner */
#cb-cookie-banner {
    position: fixed;
    left: 0;
    width: 100%;
    z-index: 1053;
    border: none;
    border-radius: 20px 20px 0 0;
    color: #fdfdfd;
    background-blend-mode: multiply;
    background-color: rgba(0, 0, 0, .8);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    font-size: .8em;
    transition: .5s ease-in-out;
    display: block;
}
/* #cb-cookie-banner.visiblecookies { bottom: 0; } */
/* #cb-cookie-banner.hiddencookies { bottom: calc(vh - 60px); } */


/* To Top Button */
#btn-back-to-top { position: fixed; bottom: 10px; right: 10px; width: 40px; height: 40px; z-index: 1054; padding: 5px 8px 8px 8px !important; transition: .4s ease-in-out; box-shadow: 0 0 6px var(--darkgreen); }
#btn-back-to-top.hiddenbutton { bottom: -60px; }
#btn-back-to-top.visiblebutton { bottom: 10px; }

@media (max-width: 768px) {
    /* #btn-back-to-top { display: none !important; } */
}