@font-face {
    font-family: 'Steppe';
    src: url('../fonts/steppe/Steppe.eot'); /* IE9 Compat Modes */
    src: url('../fonts/steppe/Steppe.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/steppe/Steppe.woff') format('woff'), /* Modern Browsers */
         url('Steppe.ttf') format('truetype'); /* Safari, Android, iOS */
             font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

.roboto {
    font-family: "Roboto", sans-serif;
}

.form-control::-moz-placeholder {
    color: #989eb1;
    opacity: 1;
}
.form-control::placeholder {
    color: #989eb1;
    opacity: 1;
}

body {
    font-family: 'Steppe';
}

img {
    max-width: 100%;
    height: auto;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}

section {
    padding: 2rem 0;
}

.section-title {
    margin: 2rem 0 3rem;
    color: #016569;
    text-align: center;
    font-size: 3rem;
}

.bg-gray {
    background: #e9e9e9;
}

.bg-gray-alt {
    background: #fdfdfd;
}

.text-green {
    color: #017e82;
}

.text-green-alt {
    color: #06dfed !important;
}

.text-green-gradient {
    background: linear-gradient(84.8deg, #06C1C9 -3.01%, #035F63 102.25%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.dark-gradient {
    color: #ffffff;
    background: radial-gradient(63.77% 63.77% at 31.03% 45.61%, #007175 0%, #000707 63%);
}

.dark-gradient-alt {
    color: #ffffff;
    background: radial-gradient(120% 120% at 80% 90%, #03c5cb 0%, #022425 100%);
}

.green-gradient {
    color: #ffffff;
    background: radial-gradient(63.77% 63.77% at 31.03% 45.61%, #00A7AD 0%, #006568 100%);
}

.white-purple-gradient {
    background: radial-gradient(40% 20% at 90% 60%, #bb6df3 0%, #ffffff 100%);
}

.white-green-gradient {
    background: radial-gradient(30% 20% at 80% 60%, #06C1C9 0%, #ffffff 100%);
}

.white-green-gradient-alt {
    background: radial-gradient(30% 40% at 10% 50%, #06C1C9 0%, #ffffff 100%);
}

.dark-gradient .section-title,
.dark-gradient-alt .section-title,
.green-gradient .section-title {
    color: #ffffff;
}

.btn-white {
    color: #016569;
    background-color: #ffffff;
}

.btn-colored {
    color: #ffffff;
    background: linear-gradient(90deg, #06C1C9 0%, #BB6DF3 100%);
}

.btn {
    border-radius: 1rem;
    border: none; /* fix gradient */
}

.btn-primary {
    --bs-btn-bg: #03c5cb;
    --bs-btn-border-color: #03c5cb;
    --bs-btn-hover-bg: #016569;
    --bs-btn-hover-border-color: #016569;
    --bs-btn-active-bg: #bb6df3;
    --bs-btn-active-border-color: #bb6df3;
}

.navbar {
    color: #ffffff;
    background: #3A32324D;
    backdrop-filter: blur(30px);
    --bs-navbar-active-color: rgba(255,255,255,1);
}

.navbar-nav {
    --bs-nav-link-color: rgba(255,255,255,1);
    --bs-nav-link-hover-color: #00a7ad;
}

.lang-switcher .btn {
    --bs-btn-color: #ffffff;
    --bs-btn-hover-color: #00a7ad;
}

.card {
    border: none;
    overflow: hidden;
}

.form-control:focus {
    border-color: #00a7ad;
    box-shadow: 0 0 0 .25rem rgba(0,167,173,.25);
}

.modal-header {
    padding: 2rem 3rem 0;
    border: none;
}

.modal-title {
    font-size: 3rem;
}

.modal-body {
    padding: 3rem;
}

.modal .form-control {
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
    resize: none;
}

.reviews-slider {
    margin: auto;
}

.clients {
    max-width: 600px;
    margin: 1rem auto;
}

.footer {
    padding: 100px 0;
    color: #ffffff;
    background: radial-gradient(69.16% 71.03% at 31.03% 45.61%, #007175 0%, #000707 100%);
}

.footer .logo {
    max-width: 200px;
    margin: 0 0 2rem;
}

.footer a {
    display: block;
    margin: .5rem 0;
    color: #ffffff;
    text-decoration: none;
}

.footer a:hover {
    color: #00a7ad;
}

/* slick slider */
.slick-track {
    display: flex !important;
}

.slick-slide {
    height: inherit !important;
    margin: 0 1rem;
}

.products-section {
    padding: 10rem 0;
    min-height: 600px;
    color: #ffffff;
    background-image: url('../img/bg-products.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.products-section h1 {
    font-size: 5rem;
}

.services-section {
    padding: 5rem 0;
    color: #ffffff;
}

.services-section h1 {
    font-size: 5rem;
}

.about-section {
    padding: 5rem 0;
    color: #000000;
}

.about-section h1 {
    font-size: 5rem;
    background: linear-gradient(84.8deg, #06C1C9 -3.01%, #035F63 102.25%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}