@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
:root {
    --bs-success-rgb: 116, 222, 134;
    --bs-link-color-rgb: 255, 255, 255;
    --bs-link-hover-color-rgb: 116, 222, 134;
    --bs-danger-rgb: 255, 88, 88;
    --bs-warning-rgb: 255, 217, 52;
    --danger: #FF5858;
}

.accordion {
    --bs-accordion-bg:transparent;
    --bs-accordion-color: #fff;
    --bs-accordion-btn-color: #fff;
    --bs-accordion-active-bg:transparent;
    --bs-accordion-active-color: #74DE86;
    --bs-accordion-border-radius: 0;
    --bs-accordion-border-width: 0;
    --bs-accordion-body-padding-y: 0 1rem;
    --bs-accordion-body-padding-x: 0.85rem 0.5rem;
    --bs-accordion-btn-padding-x: 0.5rem 0.85rem;
    --bs-accordion-btn-padding-y: 1rem;
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff80%0A' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff%0A' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e")
}

.form-control:focus, .form-select:focus {border-color: #74DE86;box-shadow: 0 0 0 .25rem rgba(116, 222, 134, .25);}


body {
    font-family: 'Roboto', sans-serif !important;
    background: rgb(69,77,102);
}

body.main {
    background: rgb(69,77,102);
    background: -moz-linear-gradient(180deg, rgba(69,77,102,1) 40%, rgba(255,88,88,1) 160%);
    background: -webkit-linear-gradient(180deg, rgba(69,77,102,1) 40%, rgba(255,88,88,1) 160%);
    background: linear-gradient(180deg, rgba(69,77,102,1) 40%, rgba(255,88,88,1) 160%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#454d66",endColorstr="#ff5858",GradientType=1);
}
.top {
    background: rgb(255,88,88);
    background: -moz-linear-gradient(0deg, rgba(255,88,88,0) 0%, rgba(255,88,88,0.75) 150%);
    background: -webkit-linear-gradient(0deg, rgba(255,88,88,0) 0%, rgba(255,88,88,0.75) 150%);
    background: linear-gradient(0deg, rgba(255,88,88,0) 0%, rgba(255,88,88,0.75) 150%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff5858",endColorstr="#ff5858",GradientType=1);
}

.bottom {
    background: rgb(70,78,103);
    background: -moz-linear-gradient(0deg, rgba(70,78,103,1) 0%, rgba(70,78,103,0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(70,78,103,1) 0%, rgba(70,78,103,0) 100%);
    background: linear-gradient(0deg, rgba(70,78,103,1) 0%, rgba(70,78,103,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#464e67",endColorstr="#464e67",GradientType=1);
}

body, html { scroll-behavior: smooth; }

.accordion-body {font-weight: 300;}

.smart {
    border-radius: 37px;
}

.bi-shield-shaded, .bi-hand-index, .bi-radar { font-size: 4rem ;}

.text-balance { white-space: balance !important;}


.sticky-lg-top {top: 32px}

.fs-18 {font-size: 1.125rem;}
input[name='email'] {display: none;}
select {font-size: 1rem !important;}

.phone { width: 300px; height: 628px;border-radius: 37px; border-width: 10px !important;}
.carousel-item img {height: 608px;}

.nav-bar a {
    border-bottom: 2px solid transparent;
    text-decoration: none;
    color: #fff;
    transition: all 0.25s ease!important;
}

.nav-bar a:hover {
    border-bottom: 2px solid var(--danger);
}

@media (min-width: 1200px) {
    .phone { width: 340px; height: 714px;}
    .carousel-item img {height: 694px;}
}


@media (min-width: 1440px) {
    .sticky-lg-top {top: 48px}
}