html{scroll-behavior: smooth;}
body.body-hidden{overflow: hidden;}
.container{margin: 0 auto; padding-left: 20px; padding-right: 20px;}

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


@font-face {
    font-family: 'Booton-TRIAL';
    src: url('../fonts/Booton-Medium.woff2') format('woff2'),
        url('../fonts/Booton-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}


body{font-family: "Inter", sans-serif;}
.boo{font-family: 'Booton-TRIAL';}
.common_btn{display: flex; align-items: center; gap:15px; background-color: #89CCCB; border:1px solid #89CCCB; border-radius: 4px; padding: 15px; color: #0D1616; font-size: 16px; line-height: 17px; font-weight: 500; transition: all ease 0.3s;}
.common_btn:hover{background-color: #74eae8; border-color: #74eae8;}

.common_btn svg{transition: all ease 0.3s;}
.common_btn:hover svg{transform: translate(3px, -3px);}

.common_btn.border{background-color: transparent; color: #C0E2C7;}
.common_btn.border:hover{background-color: #89CCCB; border-color: #89CCCB; color: #0D1616;}
.common_btn.border:hover svg path{fill: #0D1616;}


.box_single:hover .big_arrow{transform: translate(5px, -5px);}

.popup_overlay{background-color: #0d1616d4; backdrop-filter: blur(10px); position: fixed; left:0; top:0; right:0; bottom: 0; z-index: 31; display: none;}

.popup{background-color: #ffffff; position: fixed; left:20px; right:20px; top:20px; padding: 20px; z-index: 32;     border-radius: 4px; display: none;}

.popup .close{position: absolute; right:20px; top:20px; transition: all ease 0.3s; opacity: 0.5; cursor: pointer;}
.popup .close:hover{opacity: 1; transform: rotate(180deg);}

.form_control{position: relative;}
.form_control .animate{position: absolute; font-size: 16px; left:0; top:11px; transition: all ease 0.3s; color: #ffffff;}
.form_control .animate[for="message"]{top:0}

.form_control.active .animate{transform: translateY(-15px); font-size: 12px; color: #31b5b3;}

.form_control input[type="text"],
.form_control input[type="email"],
.form_control input[type="tel"],
.form_control textarea

{border:none; border-bottom:1px solid rgba(255,255,255,0.3); border-radius: 0; width:100%; height: 46px; outline: none; box-shadow: none; color: #ffffff;}


.form_control input[type="text"]:focus,
.form_control input[type="email"]:focus,
.form_control input[type="tel"]:focus,
.form_control textarea:focus,
.form_control.active input[type="text"],
.form_control.active input[type="email"],
.form_control.active input[type="tel"],
.form_control.active textarea
{border-color: #31b5b3;}

.form_control textarea{resize: none; height: 100px;}