/*
 ________  __       __       __    __  _____      __
|   __   ||  |     /  \     |  |  |  ||  __ \    |  |
|  |__|  ||  |    /    \    |  |\ |  || |__) |   |  |
|   _____||  |   /  /\  \   |  | \|  ||      /   |  |____ ___      ___
|  |      |  |  /  /__\  \  |  |\ |  ||  __  \   |  ___  |\  \    /  /
|  |      |  | /  /    \  \ |  | \|  || |__)  |_ | |___| | \  \__/  /
|__|      |__|/__/      \__\|__|  |__||_______(_)|_______|  \      /
                                                            _|    /
                                                           |     /
                                                           |____/
*/
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,dialog,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,meter,nav,object,ol,output,p,pre,progress,q,rp,rt,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video,xmp{border:0;margin:0;padding:0;font-size:100%}body,html{height:100%}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}b,strong{font-weight:700}img{color:transparent;font-size:0;vertical-align:middle;max-width:100%;max-height:100%;width:auto;height:auto;-ms-interpolation-mode:bicubic}ol,ul{list-style:none}li{display:list-item}table{border-collapse:collapse;border-spacing:0}caption,td,th{font-weight:400;vertical-align:top;text-align:left}q{quotes:none}q:after,q:before{content:'';content:none}small,sub,sup{font-size:75%}sub,sup{line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}svg{overflow:hidden}.clear,.clr{display:block;clear:both;overflow:hidden;line-height:0!important;height:0!important;font-size:0;margin:0;padding:0}.clearfix:after,.clearfix:before{content:"";display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both}.clearfix{zoom:1}html{overflow-x:hidden}hr{border:0 #ccc solid;border-top-width:1px;clear:both;height:0}ol{list-style:decimal}ul{list-style:disc}li{margin-left:30px}address,dl,fieldset,figure,hr,ol,p,pre,table,ul{margin-top:0}video,iframe{max-width: 100%;}

/* Show Once ---------------------- */
    *[data-show-once-id]:not(.hystmodal) {display: none;}

/* HYST MODAL ---------------------- */
    .hystmodal img { width: auto;height: auto; }
    .hystmodal-right .hystmodal__window,
    .hystmodal-left .hystmodal__window{margin: 0;}
    .hystmodal-right .hystmodal__wrap {align-items: end;}
    .hystmodal-right .hystmodal__close {left: -40px;}
    .hystmodal-left .hystmodal__wrap {align-items: start;}
    #myModal-right .hystmodal__window, #myModal-right2 .hystmodal__window, #myModal-right4 .hystmodal__window, #myModal-right3 .hystmodal__window {width: 1000px;}
    #modal-order-confirmation .hystmodal__window {width: 650px;}
    .hystmodal__wrap {perspective: 1000px;}
    .hystmodal:not(.hystmodal-right):not(.hystmodal-left) .hystmodal__window {transform: rotateX(10deg) translate(0, 50px) scale(.9);transition: .5s;}
    .hystmodal--active:not(.hystmodal-right):not(.hystmodal-left) .hystmodal__window {transform: translate(0, 0);}
    .hystmodal-right .hystmodal__window {transform: translate(100px, 0); opacity: 1;}
    .hystmodal-left .hystmodal__window {transform: translate(-100px, 0); opacity: 1;}
    .hystmodal-right.hystmodal--active .hystmodal__window,
    .hystmodal-left.hystmodal--active .hystmodal__window{transform: translate(0, 0)}

/* PlanB Modal ---------------------- */
    .fon_modal {z-index: 10001;top: 0;left: 0;bottom: 0;right: 0;position: fixed;display: none;}
    .modalwrapper {-webkit-overflow-scrolling: touch;perspective: 1000px;overflow-y: scroll;z-index: 1000;top: 0;right: 0;width: 100%;height: 100%;display: none;position: fixed;}
    .modal {left: 50%;transform: translate(-50%, 0%) rotateX(50deg) scale(.6);bottom: auto;opacity: 0;z-index: 10002;box-sizing: border-box;transition: 1s;display: none;position: absolute;}
    .modal.poehali {transform: translate(-50%, -50%);opacity: 1;margin-top: 0;}
    .modal .close_modal {position: absolute;z-index: 999999;text-align: center;cursor: pointer;transition: .5s;}
    .modal {width: 600px;top: 50%;}
    .modal.poehali {transform: translate(-50%, -50%);opacity: 1;margin-top: 0;}
    .modalwrapper {-webkit-backdrop-filter: blur(18px);backdrop-filter: blur(18px);background: rgb(0 0 0 / 15%);}
    .modal {background: #fff;border-radius: 5px;padding: 40px;}
    .modal .close_modal {right: 10px;top: 10px;color: var(--textcolor);background: transparent;width: 35px;height: 35px;line-height: 35px;font-size: 30px;border-radius: 5px;}
    .modal .close_modal:hover {transform: rotate(90deg);}

/* Список - галочки  ---------------------- */
    ul.check-list {margin: 15px 0}
    ul.check-list li {list-style-type: none;padding-left: 40px;position: relative;margin-bottom: 5px;margin-left: 0;}
    ul.check-list li:before {background: url(/assets/images/icons/check_black.png) 50% 50%/15px no-repeat;left: 12px;top: 7px;width: 15px;height: 15px;position: absolute;content: "";display: inline-block;}

/* Список кружочки  ---------------------- */
    ul.circle-list {margin: 15px 0}
    .circle-list li {list-style-type: none;margin-bottom: 8px;position: relative;}
    .circle-list li:before {right: calc(100% + 10px);top: 10px;border: 2px solid var(--maincolor);width: 8px;height: 8px;border-radius: 100px;position: absolute;display: block;content: '';}

/* ol li customization ---------------------- */
    ol.numbered {counter-reset: myCounter;margin: 15px 0}
    ol.numbered li {margin-bottom: 5px;list-style-type: none;padding-left: 10px;position: relative;}
    ol.numbered li:before {background:var(--maincolor);color: #fff;counter-increment:myCounter;content:counter(myCounter);position:absolute;left: -30px;top:-2px;display:inline-block;text-align:center;margin:5px 10px;width:17px;height:17px;line-height:17px;border-radius:20px;font-size:.7em}

/* Fancybox  ---------------------- */
    a[data-fancybox] {position: relative;display: block;}
    a[data-fancybox]:after {background: url(/assets/images/icons/zoom_white.png) 50% 50%/20px no-repeat, #00000024;display: block;content:"";position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;transition:.5s;}
    a[data-fancybox]:hover:after {opacity: 1;}

/* Breadcrumbs  ---------------------- */
    ul.breadcrumb {font-size: .8em;width: 100%;margin: 0;padding: 10px 0;box-sizing: border-box;margin-top: 5px;}
    .breadcrumb li {display: inline-block;line-height: 1.2;list-style-type: none;padding-left: 0 !important;margin-bottom: 0 !important;margin-left: 0 !important;margin-right: 3px;color: #464646;}
    .breadcrumb li a {color: #464646;}

/* Before Line  ---------------------- */
    .before-line {position: relative;color: var(--hcolor);padding: 0 0 0 130px;}
    .before-line:before {display: inline-block;height: 2px;width: 100px;background: var(--hcolor);content: "";position:  absolute;top: 50%;transform: translateY(-50%);left: 0;}

/* Full width block  ---------------------- */
    .fw {position: relative;}
    .fw:before,.fw:after {content: '';display: block;background: inherit;position: absolute;height: 100%;width: 10000px;top: 0;}
    .fw:before{right: 100%;} .fw:after{left: 100%;}

/* HR Shadow  ---------------------- */
    .hr-shadow{position:relative;overflow:hidden;height:25px}.hr-shadow:after{position:absolute;content:'';z-index:1;height:20px;top:-20px;left:50%;width:100%;margin-left:-50%;-webkit-border-radius:200px/10px;-moz-border-radius:200px/10px;border-radius:200px/10px;box-shadow:0 0 30px rgba(0,0,0,.28)}

/* Scrollup  ---------------------- */
    #scrollup {width: 45px;height: 45px;right: 20px;bottom: 20px;position: fixed;border-radius: 5px;opacity: 0;visibility: hidden;background: var(--maincolor2);cursor: pointer;text-align: center;display: flex;justify-content: center;align-items: center;transition: 0.5s;transform: rotate(180deg);z-index: 10;}


/* ====================================================== */
/*                    ROOT & BASE                         */
/* ====================================================== */

:root {
    --fontfamily: 'Inter', sans-serif;
    --fontsize: 1.6rem;
    --lineheight: 1.6;

    --maincolor: #10B981;
    --maincolor2: #111827;
    --textcolor: #4B5563;
    --hcolor: #111827;

    --primaryLight: #D1FAE5;
    --darker: #111827;
    --dark: #1F2937;

    --red: #EF4444;
    --blue: #3B82F6;
    --green: #10B981;
    --yellow: #F59E0B;
    --grey: #F3F4F6;
    --grey2: #E5E7EB;
    --grey3: #D1D5DB;
    --grey4: #9CA3AF;
    --sky: #DCEAFD;
    --white: #fff;
    --black: #000;
    --footerbg: #111827;

    --boxshadow: 0 10px 40px -10px rgba(0,0,0,0.08);
    --boxshadow-soft: 0 10px 40px -10px rgba(0,0,0,0.08);
    --boxshadow-float: 0 20px 40px -10px rgba(0,0,0,0.1);

    --header-height: 80px;
    --buttonheight: 48px;
    --bigbuttonheight: 56px;
    --smallbuttonheight: 36px;
}

body::-webkit-scrollbar {width: 6px;background: transparent;}
body::-webkit-scrollbar-track {background: transparent;}
body::-webkit-scrollbar-thumb {background-color: var(--maincolor);border-radius: 10px;}
::selection {background: var(--maincolor);color: #fff;}

html {font-size: 10px;}
body {font-size: var(--fontsize);line-height: var(--lineheight);font-family: var(--fontfamily);font-weight: 400;color: var(--textcolor);background: #F9FAFB;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}

a {color: var(--maincolor);outline: none;text-decoration: none;transition: color 0.3s;}
p {margin-bottom: 20px;}
p:last-child {margin-bottom: 0;}

h1, .h1 {font-size: clamp(3.6rem, 5vw, 6rem); line-height: 1.1; font-weight: 800; margin-bottom: 24px; color: var(--hcolor);}
h2, .h2 {font-size: clamp(2.5rem, 4vw, 3.6rem); line-height: 1.2; font-weight: 800; margin-bottom: 24px; color: var(--hcolor);}
h3, .h3 {font-size: clamp(3rem, 4vw, 3.6rem); line-height: 1.2; font-weight: 800; margin-bottom: 24px; color: var(--hcolor);}
h4, .h4 {font-size: 2rem; line-height: 1.3; font-weight: 700; margin-bottom: 12px; color: var(--hcolor);}
h5, .h5 {font-size: 1.8rem; line-height: 1.4; font-weight: 700; margin-bottom: 10px; color: var(--hcolor);}
h6, .h6 {font-size: 1.6rem; line-height: 1.5; font-weight: 700; margin-bottom: 8px; color: var(--hcolor);}


/* ====================================================== */
/*                 COLOR & BG UTILITIES                   */
/* ====================================================== */

.mc {color: var(--maincolor);}
.maincolor {color: var(--maincolor);}
.text-darker {color: var(--darker);}
.text-gray {color: var(--textcolor);}
.text-gray-light {color: var(--grey4);}
.text-white {color: #fff;}
.text-primary {color: var(--maincolor);}

.bg-white {background: #fff;}
.bg-grey50 {background: #F9FAFB;}
.bg-grey {background: var(--grey);}
.bg-primary {background: var(--maincolor);}
.bg-primaryLight {background: var(--primaryLight);}
.bg-darker {background: var(--darker);}
.bg-dark {background: var(--dark);}

.shadow-soft {box-shadow: var(--boxshadow-soft);}
.shadow-float {box-shadow: var(--boxshadow-float);}
.shadow-xl {box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);}
.shadow-2xl {box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);}

.rounded-full {border-radius: 9999px;}
.text-gradient {background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-image: linear-gradient(to right, #10B981, #059669);}


/* ====================================================== */
/*                   MARGIN UTILITIES                     */
/* ====================================================== */

.mb0 {margin-bottom: 0 !important;}
.mb5 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}
.mb60 {margin-bottom: 60px !important;}

.mt0 {margin-top: 0 !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}

.mlr-auto {margin-left: auto;margin-right: auto;}

.order-1 {order: 1;}
.order-2 {order: 2;}


/* ====================================================== */
/*                      LAYOUT                            */
/* ====================================================== */

.main {max-width: 1280px;clear: both;box-sizing: border-box;margin: 0 auto;padding: 0 20px;position: relative;}
.maxwidth768 {max-width: 768px;margin: 0 auto;}


/* ====================================================== */
/*                      FORMS                             */
/* ====================================================== */

input[type="text"],
input[type="email"],
input[type="date"],
input[type="tel"],
input[type="number"],
input[type="time"],
input[type="password"],
textarea,
select {
    line-height: 50px;
    padding: 0 16px;
    color: var(--hcolor);
    border-radius: 12px;
    width: 100%;
    margin: 0;
    background: #F9FAFB;
    border: 1px solid var(--grey2);
    font-family: var(--fontfamily);
    font-size: 1.6rem;
    outline: none;
    box-sizing: border-box;
    display: block;
    transition: border-color 0.3s, background 0.3s, box-shadow 0.3s;
}
input:focus, textarea:focus, select:focus {
    border-color: var(--maincolor);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(16,185,129,0.15);
}
textarea {
    line-height: 1.6;
    padding: 16px;
    resize: vertical;
    min-height: 100px;
}
select {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239CA3AF' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
}

.form-label {
    display: block;
    font-size: 1.4rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
}
.form-group {margin-bottom: 20px;}
.form-row {display: flex;gap: 20px;}
.form-row > * {flex: 1;}

.form-privacy {display: flex;align-items: flex-start;gap: 12px;font-size: 1.4rem;color: var(--grey4);}
/* checkboxes  ---------------------- */  
        input[type=checkbox] {position: relative;background: #fff;border-radius: 2px;cursor: pointer;line-height: 0;margin: 0 0.6em 0 0;outline: 0;padding: 0 !important;vertical-align: text-top;height: 20px;width: 20px;-webkit-appearance: none;border: 1px solid var(--maincolor)}
        input[type=checkbox] + label {cursor: pointer;margin-right: 20px}
        input[type=checkbox]:checked:before {border: solid var(--maincolor);border-width: 0 2px 2px 0;margin: -1px -1px 0 -1px;width: 4px;height: 10px;content: '';position: absolute;right: 50%;top: 50%;transform: rotate(45deg) translate(-50%, -50%);z-index: 2;}
        
        input.checkbox + label {cursor: pointer}
        input.checkbox {vertical-align: top;width: 17px;height: 17px;margin: 0 3px 0 0}
        input.checkbox:not(checked) {position: absolute;opacity: 0}
        input.checkbox:not(checked) + label {position: relative;padding: 0 0 0 60px}
        input.checkbox:not(checked) + label:before {content: '';position: absolute;top: -4px;left: 0;width: 50px;height: 26px;border-radius: 13px;background: #CDD1DA;box-shadow: inset 0 2px 3px rgba(0,0,0,.2)}
        input.checkbox:not(checked) + label:after {content: '';position: absolute;top: -2px;left: 2px;width: 22px;height: 22px;border-radius: 10px;background: #FFF;box-shadow: 0 2px 5px rgba(0,0,0,.3);transition: all .2s}
        input.checkbox:checked + label:before {background: #9FD468}
        input.checkbox:checked + label:after {left: 26px}

.form-privacy a {color: var(--maincolor);}
.form-privacy a:hover {text-decoration: underline;}


    
input[name="workemail"] {display: none !important;}


/* ====================================================== */
/*                     BUTTONS                            */
/* ====================================================== */

.btn {
    display: inline-flex;align-items: center;justify-content: center;gap: 8px;
    font-family: var(--fontfamily);font-weight: 700;font-size: 1.6rem;
    border: none;outline: none;cursor: pointer;transition: all 0.3s;
    box-sizing: border-box;text-decoration: none;white-space: nowrap;
    cursor: pointer;
}
.btn-submit[disabled] {background: var(--grey);color: #000;cursor: not-allowed;}
.btn-primary {
    background: var(--maincolor);color: #fff;
    padding: 16px 32px;border-radius: 9999px;
    box-shadow: 0 10px 20px -5px rgba(16,185,129,0.3);
    cursor: pointer;
}
.btn-primary:hover {background: #059669;transform: translateY(-2px);color: #fff;}

.btn-primary-lg {
    background: var(--maincolor);color: #fff;
    padding: 16px 32px;border-radius: 9999px;font-size: 1.8rem;
    box-shadow: 0 10px 25px -5px rgba(16,185,129,0.3);
    cursor: pointer;
}
.btn-primary-lg:hover {background: #059669;transform: translateY(-2px);color: #fff;}

.btn-outline {
    background: #fff;color: var(--hcolor);
    padding: 16px 32px;border-radius: 9999px;
    border: 2px solid var(--grey2);font-size: 1.8rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    cursor: pointer;
}
.btn-outline:hover {background: var(--grey);transform: translateY(-2px);color: var(--hcolor);}

.btn-submit {
    width: 100%;background: var(--maincolor);color: #fff;
    padding: 16px 32px;border-radius: 12px;font-size: 1.6rem;font-weight: 700;
    border: none;cursor: pointer;font-family: var(--fontfamily);
    box-shadow: 0 10px 20px -5px rgba(16,185,129,0.3);
    cursor: pointer;
    transition: all 0.3s;
}
.btn-submit:hover {background: #059669;transform: translateY(-2px);}

.btn-white {
    background: #fff;color: var(--maincolor);
    padding: 10px 24px;border-radius: 9999px;
    font-weight: 600;font-size: 1.6rem;
    cursor: pointer;
}
.btn-white:hover {background: var(--grey);color: var(--maincolor);}


/* ====================================================== */
/*                      HEADER                            */
/* ====================================================== */
/* logo  ---------------------- */
        .mobile-mainmenu-button {flex: 0 0 auto;}
        
        
    /* Main menu ---------------------- */
        #mainmenu {}
        .mobile-mainmenu-button, .mobile-mainmenu-outer {display: none;}


        /* DESKTOP  ---------------------- */
        /* STYLE */
            /* common  ---------------------- */
                ul.desktop-mainmenu {margin-bottom: 0;display: inline-block;}
                ul.desktop-mainmenu li {margin: 0;padding: 0;list-style-type: none;box-sizing: border-box}
                    /* submenu */

            /* 1 level */
                li.menu-level-1 {list-style-type: none;transition: 1s;margin-right: 15px !important;display: inline-block;}
        /* BEHAVIOR  ---------------------- */
            /* common  ---------------------- */
                ul.desktop-mainmenu li {position: relative}ul.desktop-mainmenu a {position: relative}
 


.site-header {
    position: fixed;width: 100%;top: 0;z-index: 10;
    background: rgba(255,255,255,0.8);
    backdrop-filter: blur(12px);-webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--grey);
    transition: box-shadow 0.3s;
}
.site-header.scrolled {box-shadow: 0 1px 3px rgba(0,0,0,0.08);}
.header-inner {height: var(--header-height);}
.header-inner > div {margin-bottom: 0;}

.logo-icon {
    width: 40px;height: 40px;background: var(--maincolor);border-radius: 12px;
    display: flex;align-items: center;justify-content: center;color: #fff;
    box-shadow: 0 4px 12px rgba(16,185,129,0.3);font-size: 18px;margin-right: 8px;
}
.logo-text {font-weight: 700;font-size: 2rem;color: var(--hcolor);letter-spacing: -0.02em;}
.logo-text > img {width: 135px}

.header-phone {font-weight: 700;font-size: 1.8rem;color: var(--hcolor);}
.header-phone:hover {color: var(--maincolor);}
.header-phone-sub {font-size: 1.4rem;color: var(--grey4);}

.header-messengers {display: flex;gap: 8px;}
.messenger-icon {
    width: 40px;height: 40px;border-radius: 9999px;
    display: flex;align-items: center;justify-content: center;
    font-size: 18px;transition: all 0.3s;
}
.messenger-icon.whatsapp {background: rgba(37,211,102,0.1);color: #25D366;}
.messenger-icon.whatsapp:hover {background: #25D366;color: #fff;}
.messenger-icon.viber {background: rgba(115,96,242,0.1);color: #7360F2;}
.messenger-icon.viber:hover {background: #7360F2;color: #fff;}
.messenger-icon.telegram {background: rgba(0,136,204,0.1);color: #0088cc;}
.messenger-icon.telegram:hover {background: #0088cc;color: #fff;}

.messenger-icon-solid {
    width: 48px;height: 48px;border-radius: 9999px;
    display: flex;align-items: center;justify-content: center;
    font-size: 22px;transition: all 0.3s;color: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.messenger-icon-solid.whatsapp {background: #25D366;}
.messenger-icon-solid.whatsapp:hover {background: #1da851;transform: translateY(-2px);}
.messenger-icon-solid.viber {background: #7360F2;}
.messenger-icon-solid.viber:hover {background: #5b4acc;transform: translateY(-2px);}
.messenger-icon-solid.telegram {background: #0088cc;}
.messenger-icon-solid.telegram:hover {background: #006699;transform: translateY(-2px);}

.messenger-icon-hero {
    width: 56px;height: 56px;border-radius: 9999px;
    display: flex;align-items: center;justify-content: center;
    font-size: 24px;transition: all 0.3s;
    background: #fff;border: 1px solid var(--grey2);
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.messenger-icon-hero.whatsapp {color: #25D366;}
.messenger-icon-hero.whatsapp:hover {border-color: #25D366;background: rgba(37,211,102,0.05);}
.messenger-icon-hero.viber {color: #7360F2;}
.messenger-icon-hero.viber:hover {border-color: #7360F2;background: rgba(115,96,242,0.05);}
.messenger-icon-hero.telegram {color: #0088cc;}
.messenger-icon-hero.telegram:hover {border-color: #0088cc;background: rgba(0,136,204,0.05);}

.btn-cta {
    background: var(--maincolor);color: #fff;
    padding: 10px 24px;border-radius: 9999px;
    font-weight: 600;font-size: 1.5rem;
    box-shadow: 0 4px 12px rgba(16,185,129,0.3);
    transition: all 0.3s;
    cursor: pointer;
}
.btn-cta:hover {background: #059669;transform: translateY(-2px);color: #fff;}

.mobile-menu-btn {
    display: none;background: none;border: none;
    color: var(--textcolor);font-size: 24px;padding: 8px;
    cursor: pointer;z-index: 50;
}
.mobile-menu-btn:hover {color: var(--maincolor);}

.mobile-menu {
    display: none;position: fixed;inset: 0;
    background: #fff;z-index: 40;
    padding: 100px 20px 40px;
    flex-direction: column;align-items: center;gap: 16px;
    overflow-y: auto;
}
.mobile-menu.open {display: flex;}
.mobile-menu a {
    font-size: 2rem;font-weight: 600;color: var(--hcolor);
    padding: 8px 0;text-decoration: none;
}
.mobile-menu a:hover {color: var(--maincolor);}
.mobile-menu .mobile-phone {color: var(--maincolor);font-weight: 700;margin-top: 16px;}
.mobile-menu .mobile-cta {
    background: var(--maincolor);color: #fff;
    padding: 16px 32px;border-radius: 9999px;
    font-weight: 700;font-size: 1.8rem;
    box-shadow: 0 4px 12px rgba(16,185,129,0.3);
}


/* ====================================================== */
/*                       HERO                             */
/* ====================================================== */

.hero {padding: 128px 0 80px;position: relative;overflow: hidden;background: #fff;}
.montazh-hero {padding: 128px 0 0;}
.hero-bg-blob {
    position: absolute;border-radius: 9999px;filter: blur(48px);opacity: 0.5;z-index: 0;
}
.hero-bg-blob-1 {width: 800px;height: 800px;background: rgba(209,250,229,0.4);top: 0;right: 0;transform: translate(33%, -48px);}
.hero-bg-blob-2 {width: 600px;height: 600px;background: rgba(219,234,254,1);bottom: 0;left: 0;transform: translate(-33%, 33%);}
.hero-content {position: relative;z-index: 1;padding: 50px 20px 30px;}

.hero-badge {
    display: inline-flex;align-items: center;gap: 8px;
    padding: 8px 16px;border-radius: 9999px;
    background: var(--primaryLight);color: var(--maincolor);
    font-weight: 600;font-size: 1.4rem;margin-bottom: 24px;
}
.hero-badge-dot {position: relative;width: 12px;height: 12px;display: flex;}
.hero-badge-dot .ping {
    position: absolute;display: inline-flex;width: 100%;height: 100%;
    border-radius: 9999px;background: var(--maincolor);opacity: 0.75;
    animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}
.hero-badge-dot .dot {position: relative;display: inline-flex;width: 12px;height: 12px;border-radius: 9999px;background: var(--maincolor);}

.hero-title {
    font-size: clamp(3.6rem, 5vw, 6rem);font-weight: 800;
    color: var(--hcolor);line-height: 1.1;margin-bottom: 24px;
}
.hero-accent {
    display: inline-block;position: relative;
    color: #fff;padding: 4px 16px;
    background: var(--maincolor);border-radius: 8px;
    box-shadow: 0 4px 12px rgba(16,185,129,0.3);
}
.hero-accent.tilt {transform: rotate(2deg);}
.hero-accent.tilt-neg {transform: rotate(-2deg);}

.hero-text {font-size: 2rem;color: var(--textcolor);margin-bottom: 32px;line-height: 1.6;max-width: 640px;}

.hero-actions {display: flex;flex-wrap: wrap;gap: 16px;align-items: center;margin-bottom: 40px;}

.hero-check {display: flex;align-items: center;gap: 8px;font-size: 1.4rem;font-weight: 500;color: var(--grey4);}
.hero-check i {font-size: 2rem;color: var(--maincolor);}

.hero-image-wrapper {position: relative;display: flex;align-items: center;justify-content: center;min-height: 400px;}
.blob-shape {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    animation: morph 8s ease-in-out infinite;
}
.hero-blob-bg {
    position: absolute;inset: 0;
    background: var(--primaryLight);
    opacity: 0.6;transform: scale(0.9);
}
.hero-image-card {
    position: relative;z-index: 10;
    background: #fff;border-radius: 24px;
    box-shadow: var(--boxshadow-float);
    padding: 8px;border: 1px solid var(--grey);
    max-width: 420px;width: 100%;
}
.hero-image-card img {border-radius: 16px;width: 100%;height: 300px;object-fit: cover;display: block;}
.hero-floating-card {
    position: absolute;z-index: 20;
    background: #fff;border-radius: 16px;
    padding: 12px 16px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
    border: 1px solid var(--grey);
    display: flex;align-items: center;gap: 12px;
}
.hero-floating-card-icon {
    width: 48px;height: 48px;border-radius: 9999px;
    display: flex;align-items: center;justify-content: center;
    font-size: 20px;flex-shrink: 0;
}
.hero-floating-card-text .small {font-size: 1.2rem;color: var(--grey4);font-weight: 500;}
.hero-floating-card-text .bold {font-size: 1.4rem;font-weight: 700;color: var(--hcolor);}

.hero-floating-top {top: -24px;right: -24px;}
.hero-floating-bottom {bottom: -32px;left: -32px;}

.hero-stars {display: flex;color: #FBBF24;font-size: 1.4rem;gap: 2px;}
.hero-avatars {display: flex;}
.hero-avatars img {width: 40px;height: 40px;border-radius: 9999px;border: 2px solid #fff;margin-left: -12px;}
.hero-avatars img:first-child {margin-left: 0;}

.hero-stats {display: flex;gap: 24px;margin-top: 40px;}
.hero-stat {text-align: center;}
.hero-stat-value {font-size: 3rem;font-weight: 800;color: var(--maincolor);margin-bottom: 4px;}
.hero-stat-label {font-size: 1.4rem;color: var(--grey4);}

.animate-bounce {animation: bounce 2s infinite;}


/* ====================================================== */
/*                     SECTIONS                           */
/* ====================================================== */
#breadcrumbs {margin-top: 80px;}
.section {padding: 96px 0;}
.section-header {text-align: center;max-width: 768px;margin: 0 auto 64px;}
.section-subtitle {
    color: var(--maincolor);font-weight: 700;
    text-transform: uppercase;letter-spacing: 0.05em;
    font-size: 1.4rem;margin-bottom: 12px;
}
.section-title {
    font-size: clamp(3rem, 4vw, 3.6rem);font-weight: 800;
    color: var(--hcolor);line-height: 1.2;margin-bottom: 24px;
}
.section-desc {font-size: 1.8rem;color: var(--textcolor);line-height: 1.6;}


/* ====================================================== */
/*                   SERVICE CARDS                        */
/* ====================================================== */

.service-card {
    background: #fff;border-radius: 16px;overflow: hidden;
    box-shadow: var(--boxshadow-soft);border: 1px solid var(--grey);
    transition: box-shadow 0.3s;
}
.service-card:hover {box-shadow: var(--boxshadow-float);}
.service-card-img {height: 192px;overflow: hidden;}
.service-card-img img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.3s;}
.service-card:hover .service-card-img img {transform: scale(1.05);}
.service-card-body {padding: 32px;}
.service-card-body h4 {font-size: 2rem;font-weight: 700;color: var(--hcolor);margin-bottom: 12px;}
.service-card-body p {color: var(--textcolor);margin-bottom: 16px;font-size: 1.6rem;}
.service-card-footer {display: flex;align-items: center;justify-content: space-between;}
.card-price {font-size: 2.4rem;font-weight: 700;color: var(--maincolor);}
.card-price-sub {font-size: 1.4rem;color: var(--grey4);}


/* ====================================================== */
/*                  FEATURE CARDS (4-col)                 */
/* ====================================================== */

.feature-card {
    background: #fff;border-radius: 16px;padding: 32px;
    box-shadow: var(--boxshadow-soft);border: 1px solid var(--grey);
    text-align: center;transition: box-shadow 0.3s;
}
.feature-card:hover {box-shadow: var(--boxshadow-float);}
.feature-icon {
    width: 64px;height: 64px;border-radius: 16px;
    display: flex;align-items: center;justify-content: center;
    font-size: 30px;margin: 0 auto 24px;
    transition: transform 0.3s;
}
.feature-card:hover .feature-icon {transform: scale(1.1);}
.feature-icon.blue {background: #DBEAFE;color: #3B82F6;}
.feature-icon.green {background: #D1FAE5;color: #10B981;}
.feature-icon.purple {background: #EDE9FE;color: #8B5CF6;}
.feature-icon.orange {background: #FFEDD5;color: #F97316;}
.feature-card h4 {font-size: 2rem;font-weight: 700;color: var(--hcolor);margin-bottom: 12px;}
.feature-card p {color: var(--textcolor);font-size: 1.6rem;margin-bottom: 0;}


/* ====================================================== */
/*                   PRICING CARDS                        */
/* ====================================================== */

.pricing-card {
    background: #fff;border-radius: 24px;padding: 32px;
    box-shadow: var(--boxshadow-soft);border: 1px solid var(--grey);
    transition: box-shadow 0.3s;
}
.pricing-card:hover {box-shadow: var(--boxshadow-float);}
.pricing-card-featured {
    background: linear-gradient(135deg, rgba(16,185,129,0.05), rgba(16,185,129,0.1));
    border: 2px solid var(--maincolor);
    box-shadow: var(--boxshadow-float);
    position: relative;overflow: hidden;
}
.pricing-card-featured .pricing-card-blob {
    position: absolute;top: 0;right: 0;width: 128px;height: 128px;
    background: rgba(16,185,129,0.1);border-radius: 9999px;
    transform: translate(50%, -50%);
}
.pricing-card-badge {
    display: inline-block;background: var(--maincolor);color: #fff;
    padding: 6px 16px;border-radius: 9999px;font-size: 1.4rem;
    font-weight: 700;margin-bottom: 24px;
}
.pricing-card h4 {font-size: 2.4rem;font-weight: 800;color: var(--hcolor);margin-bottom: 16px;}
.pricing-card .desc {color: var(--textcolor);margin-bottom: 24px;font-size: 1.6rem;}
.pricing-check-list {margin-bottom: 32px;}
.pricing-check-list .item {display: flex;align-items: center;gap: 12px;margin-bottom: 12px;margin-left: 0;list-style: none;}
.pricing-check-list .item i.check {font-size: 2rem;color: var(--maincolor);}
.pricing-check-list .item i.check-grey {font-size: 2rem;color: var(--grey4);}
.pricing-check-list .item i.cross {font-size: 2rem;color: var(--grey3);}
.pricing-check-list .item span {font-size: 1.4rem;color: #374151;}
.pricing-check-list .item span.muted {color: var(--grey4);}
.pricing-value {font-size: 2.8rem;font-weight: 800;color: var(--maincolor);}
.pricing-value.dark {color: var(--hcolor);}
.pricing-unit {font-size: 1.6rem;color: var(--grey4);margin-left: 8px;}


/* ====================================================== */
/*                   PROCESS STEPS                        */
/* ====================================================== */

.process-step {
    background: #fff;border-radius: 16px;padding: 24px;
    box-shadow: var(--boxshadow-soft);border: 1px solid var(--grey);
    height: 100%;box-sizing: border-box;
    transition: box-shadow 0.3s;
}
.process-step:hover {box-shadow: var(--boxshadow-float);}
.process-step-final {
    background: linear-gradient(135deg, var(--maincolor), rgba(16,185,129,0.8));
    color: #fff;box-shadow: var(--boxshadow-float);border: none;
}
.step-number {
    width: 48px;height: 48px;border-radius: 12px;
    background: var(--maincolor);color: #fff;
    display: flex;align-items: center;justify-content: center;
    font-size: 2rem;font-weight: 700;margin-bottom: 16px;
}
.process-step-final .step-number {background: rgba(255,255,255,0.2);}
.process-step h4 {font-size: 1.8rem;font-weight: 700;color: var(--hcolor);margin-bottom: 12px;}
.process-step-final h4 {color: #fff;}
.process-step p {font-size: 1.4rem;color: var(--textcolor);margin-bottom: 0;}
.process-step-final p {color: rgba(255,255,255,0.9);}
.step-arrow {
    display: none;position: absolute;top: 50%;right: -12px;
    transform: translateY(-50%);color: var(--maincolor);font-size: 2rem;
}
.process-step-wrapper {position: relative;}


/* ====================================================== */
/*                   PRICING TABLE                        */
/* ====================================================== */

.price-table-wrapper {
    background: #fff;border-radius: 24px;
    box-shadow: var(--boxshadow-float);overflow: hidden;
}
.price-table-scroll {overflow-x: auto;}
.price-table {width: 100%;border-collapse: collapse;}
.price-table thead {background: var(--darker);}
.price-table thead th {
    padding: 16px 24px;font-weight: 700;color: #fff;font-size: 1.6rem;
    text-align: left;
}
.price-table thead th:last-child {text-align: right;}
.price-table tbody tr {border-bottom: 1px solid var(--grey);transition: background 0.2s;}
.price-table tbody tr:last-child {border-bottom: none;}
.price-table tbody tr:hover {background: #F9FAFB;}
.price-table tbody td {padding: 16px 24px;font-size: 1.6rem;vertical-align: middle;}
.price-table tbody td:last-child {text-align: right;}
.price-table .row-name {font-weight: 600;color: var(--hcolor);}
.price-table .row-desc {font-size: 1.4rem;color: var(--grey4);}
.price-table .row-price {font-size: 2.4rem;font-weight: 700;color: var(--maincolor);}
.price-table .row-highlight {background: var(--primaryLight);}
.price-table .row-highlight .row-name {font-size: 1.8rem;}


/* ====================================================== */
/*                     PORTFOLIO                          */
/* ====================================================== */

.portfolio-item {
    position: relative;overflow: hidden;border-radius: 16px;
    box-shadow: var(--boxshadow-soft);transition: box-shadow 0.3s;
}
#portfolio img {border-radius: 20px;}
#portfolio a[data-fancybox]:after {border-radius: 20px;}

.portfolio-item:hover {box-shadow: var(--boxshadow-float);}
.portfolio-img {height: 320px;overflow: hidden;}
.portfolio-img img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s;}
.portfolio-item:hover .portfolio-img img {transform: scale(1.1);}
.portfolio-overlay {
    position: absolute;inset: 0;
    background: linear-gradient(to top, rgba(17,24,39,0.9), rgba(17,24,39,0.5), transparent);
    opacity: 0;transition: opacity 0.3s;
}
.portfolio-item:hover .portfolio-overlay {opacity: 1;}
.portfolio-overlay-text {
    position: absolute;bottom: 0;left: 0;right: 0;
    padding: 24px;color: #fff;
    transform: translateY(16px);transition: transform 0.3s;
}
.portfolio-item:hover .portfolio-overlay-text {transform: translateY(0);}
.portfolio-overlay-text h4 {font-size: 2rem;font-weight: 700;color: #fff;margin-bottom: 8px;}
.portfolio-overlay-text p {font-size: 1.4rem;color: #E5E7EB;margin-bottom: 0;}


/* ====================================================== */
/*                    BENEFITS                            */
/* ====================================================== */

.benefits-images {position: relative;}
.benefits-images img {border-radius: 16px;width: 100%;height: 192px;object-fit: cover;box-shadow: 0 4px 12px rgba(0,0,0,0.1);}
.benefits-badge {
    position: absolute;top: 50%;left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;padding: 24px;border-radius: 16px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
    border: 1px solid var(--grey);text-align: center;width: 192px;
}
.benefits-badge-value {font-size: 4rem;font-weight: 800;color: var(--maincolor);margin-bottom: 4px;}
.benefits-badge-label {font-size: 1.4rem;font-weight: 700;color: var(--textcolor);}

.benefit-item {display: flex;gap: 20px;margin-bottom: 32px;}
.benefit-item:last-child {margin-bottom: 0;}
.benefit-icon {
    width: 48px;height: 48px;min-width: 48px;border-radius: 9999px;
    display: flex;align-items: center;justify-content: center;
    font-size: 20px;
}
.benefit-icon.orange {background: #FFEDD5;color: #F97316;}
.benefit-icon.blue {background: #DBEAFE;color: #3B82F6;}
.benefit-icon.green {background: #D1FAE5;color: #10B981;}
.benefit-icon.purple {background: #EDE9FE;color: #8B5CF6;}
.benefit-item h4 {font-size: 2rem;font-weight: 700;color: var(--hcolor);margin-bottom: 8px;}
.benefit-item p {color: var(--textcolor);font-size: 1.6rem;margin-bottom: 0;}


/* ====================================================== */
/*                 CONTACT SECTION                        */
/* ====================================================== */

.contact-section {background: var(--maincolor);padding: 96px 0;position: relative;overflow: hidden;}
.contact-bg-1 {
    position: absolute;top: 0;right: 0;
    width: 50%;height: 100%;
    background: rgba(255,255,255,0.1);
    transform: skewX(12deg) translateX(128px);z-index: 0;
}
.contact-bg-2 {
    position: absolute;bottom: -96px;left: -96px;
    width: 384px;height: 384px;
    background: rgba(255,255,255,0.1);border-radius: 9999px;
    filter: blur(48px);z-index: 0;
}
.contact-card {
    background: #fff;border-radius: 18px;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
    overflow: hidden;position: relative;z-index: 1;
}
.contact-card .block40 {background: var(--darker);padding: 40px;
    color: #fff;position: relative;overflow: hidden;}
.contact-info-panel {
    
}
.contact-info-blob {
    position: absolute;top: 0;right: 0;
    width: 256px;height: 256px;
    background: rgba(16,185,129,0.3);border-radius: 9999px;
    filter: blur(48px);transform: translate(50%, -50%);
}
.contact-info-panel h3 {font-size: 2.4rem;font-weight: 700;color: #fff;margin-bottom: 8px;}
.contact-info-panel .subdesc {color: var(--grey4);margin-bottom: 40px;font-size: 1.6rem;}

.contact-detail {display: flex;align-items: center;gap: 16px;margin-bottom: 24px;}
.contact-detail-icon {
    width: 40px;height: 40px;min-width: 40px;border-radius: 9999px;
    background: rgba(255,255,255,0.1);
    display: flex;align-items: center;justify-content: center;
    color: var(--maincolor);font-size: 16px;
}
.contact-detail .label {font-size: 1.4rem;color: var(--grey4);}
.contact-detail .value {font-size: 1.8rem;font-weight: 700;}
.contact-detail a.value {color: #fff;transition: color 0.3s;}
.contact-detail a.value:hover {color: var(--maincolor);}
.contact-detail .value-static {font-size: 1.8rem;font-weight: 700;color: #fff;}

.contact-messengers-label {font-size: 1.4rem;color: var(--grey4);margin-bottom: 16px;margin-top: 48px;}

.contact-form-panel {padding: 40px 48px;}
.contact-form-panel h3 {font-size: 2.4rem;font-weight: 700;color: var(--hcolor);margin-bottom: 32px;}


/* ====================================================== */
/*                  SPECIAL OFFER                         */
/* ====================================================== */

.special-offer {
    background: var(--darker);border-radius: 24px;
    padding: 24px 48px;position: relative;overflow: hidden;
    margin-top: 64px;
}
.special-offer-blob {
    position: absolute;top: 0;right: 0;
    width: 256px;height: 256px;
    background: rgba(16,185,129,0.2);border-radius: 9999px;
    filter: blur(48px);transform: translate(50%, -50%);
}
.special-offer .offer-badge {
    display: inline-block;background: rgba(16,185,129,0.2);
    color: var(--maincolor);font-weight: 700;
    padding: 6px 16px;border-radius: 9999px;font-size: 1.4rem;
    margin-bottom: 16px;
}
.special-offer h4 {font-size: clamp(2.4rem, 3vw, 3rem);font-weight: 700;color: #fff;margin-bottom: 16px;}
.special-offer p {color: var(--grey3);font-size: 1.8rem;margin-bottom: 0;}
.special-offer .offer-price {font-size: 2.4rem;font-weight: 700;color: var(--maincolor);margin-top: 16px;}


/* ====================================================== */
/*                   CTA BANNER                           */
/* ====================================================== */

.cta-banner {
    background: var(--darker);border-radius: 24px;
    padding: 32px 48px;position: relative;overflow: hidden;
    margin-top: 48px;
}
.cta-banner-blob {
    position: absolute;top: 0;right: 0;
    width: 256px;height: 256px;
    background: rgba(16,185,129,0.2);border-radius: 9999px;
    filter: blur(48px);transform: translate(50%, -50%);
}
.cta-banner h4 {font-size: clamp(2.4rem, 3vw, 3rem);font-weight: 700;color: #fff;margin-bottom: 16px;}
.cta-banner p {color: var(--grey3);font-size: 1.8rem;margin-bottom: 0;}


/* ====================================================== */
/*                      FOOTER                            */
/* ====================================================== */

.site-footer {
    background: var(--darker);color: var(--grey3);
    padding: 64px 0 32px;border-top: 1px solid #1F2937;
}
.footer-brand .logo-row {display: flex;align-items: center;gap: 8px;margin-bottom: 24px;}
.footer-brand .logo-icon-sm {
    width: 40px;height: 40px;background: var(--maincolor);border-radius: 12px;
    display: flex;align-items: center;justify-content: center;color: #fff;font-size: 18px;
}
.footer-brand .logo-text-sm {font-weight: 700;font-size: 2rem;color: #fff;}
.footer-brand .logo-text-sm .mc {color: var(--maincolor);}
.footer-brand p {font-size: 1.4rem;color: var(--grey4);line-height: 1.7;}

.footer-heading {color: #fff;font-weight: 700;font-size: 1.6rem;margin-bottom: 24px;}
.footer-links {list-style: none;}
.footer-links li {margin-bottom: 12px;margin-left: 0;}
.footer-links li a {color: var(--grey3);font-size: 1.4rem;transition: color 0.3s;text-decoration: none;}
.footer-links li a:hover {color: var(--maincolor);}

.footer-messengers {display: flex;gap: 12px;}
.footer-messenger {
    width: 40px;height: 40px;border-radius: 9999px;
    background: rgba(255,255,255,0.1);
    display: flex;align-items: center;justify-content: center;
    color: var(--grey3);font-size: 16px;transition: all 0.3s;
}
.footer-messenger:hover {color: #fff;}
.footer-messenger.whatsapp:hover {background: #25D366;}
.footer-messenger.viber:hover {background: #7360F2;}
.footer-messenger.telegram:hover {background: #0088cc;}

.footer-bottom {
    border-top: 1px solid #1F2937;
    padding-top: 32px;margin-top: 48px;
    display: flex;flex-wrap: wrap;
    justify-content: space-between;align-items: center;gap: 16px;
}
.footer-bottom p {font-size: 1.4rem;color: var(--grey4);margin-bottom: 0;}
.footer-bottom a {font-size: 1.4rem;color: var(--grey4);text-decoration: none;transition: color 0.3s;}
.footer-bottom a:hover {color: #fff;}
.footer-bottom-links {display: flex;gap: 24px;}


/* ====================================================== */
/*                    ANIMATIONS                          */
/* ====================================================== */

@keyframes morph {
    0%, 100% {border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;}
    34% {border-radius: 70% 30% 50% 50% / 30% 30% 70% 70%;}
    67% {border-radius: 100% 60% 60% 100% / 100% 100% 60% 60%;}
}
@keyframes ping {
    75%, 100% {transform: scale(2);opacity: 0;}
}
@keyframes bounce {
    0%, 100% {transform: translateY(-25%);animation-timing-function: cubic-bezier(0.8, 0, 1, 1);}
    50% {transform: translateY(0);animation-timing-function: cubic-bezier(0, 0, 0.2, 1);}
}


/* ====================================================== */
/*                    RESPONSIVE                          */
/* ====================================================== */

.dn-mobile {display: flex;}
.dn-desktop {display: none !important;}

@media all and (max-width: 1440px) {
    .main {padding: 0 30px;}
}

@media all and (max-width: 1200px) {
    .hero-floating-top {top: -16px;right: -8px;}
    .hero-floating-bottom {bottom: -24px;left: -16px;}
}

@media all and (max-width: 992px) {
    .dn-mobile {display: none !important;}
    .dn-desktop {display: flex !important;}
    .mobile-menu-btn {display: block;}

    .hero {padding: 120px 0 60px;}
    .hero-title {text-align: center;}
    .hero-text {text-align: center;margin-left: auto;margin-right: auto;}
    .hero-badge {margin-left: auto;margin-right: auto;}
    .hero-actions {justify-content: center;}
    .hero-check {justify-content: center;}
    .hero-stats {justify-content: center;}
    .hero-image-wrapper {margin-top: 48px;min-height: 300px;}
    .hero-image-card img {height: 250px;}

    .section {padding: 64px 0;}
    .section-header {margin-bottom: 48px;}

    .benefits-images img {height: 160px;}
    .benefits-badge {width: 160px;padding: 16px;}
    .benefits-badge-value {font-size: 3rem;}

    .contact-form-panel {padding: 32px 24px;}
    .contact-info-panel {padding: 0;}

    .special-offer {padding: 24px 32px;}
    .cta-banner {padding: 24px 32px;}

    .step-arrow {display: none;}

    .order-1 {order: unset;}
    .order-2 {order: unset;}
    .l-order-1 {order: 1;}
    .l-order-2 {order: 2;}

    .form-row {flex-direction: column;gap: 0;}
}

@media all and (max-width: 768px) {
    .main {padding: 0 16px;}

    .hero {padding: 110px 0 48px;}
    .hero-title {font-size: 3.2rem;}
    .hero-text {font-size: 1.8rem;}

    .section {padding: 48px 0;}
    .section-title {font-size: 2.6rem;}

    .portfolio-img {height: 240px;}

    .hero-stats {flex-direction: column;gap: 16px;}
    .hero-stat {display: flex;align-items: center;gap: 8px;}
    .hero-stat-value {margin-bottom: 0;}

    .footer-bottom {flex-direction: column;text-align: center;}
}

@media all and (max-width: 576px) {
    .hero-floating-top, .hero-floating-bottom {display: none;}
    .hero-image-card img {height: 200px;}
    .hero-stars {font-size: 1.2rem;}

    .special-offer {padding: 20px;}
    .cta-banner {padding: 20px;}
    
    /* Checkbox  ---------------------- */    
    input.checkbox {width: 17px;height: 17px;margin: 0 3px 0 0}
    input.checkbox:not(checked) + label {padding: 0 0 0 45px;display: block;margin: 0;/* align-items: center; */}
    input.checkbox:not(checked) + label:before {top: 5px;left: 0;width: 40px;height: 18px;}
    input.checkbox:not(checked) + label:after {top: 8px;left: 2px;width: 11px;height: 11px;}
    input.checkbox:checked + label:after {left: 26px;}
}