@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');

body {
    user-select: none;
    min-width: 320px !important;
}

* {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "slnt" 0;
}

.form-control:focus,
.form-select:focus {
    border-color: #8661c5;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(134, 97, 197, .25);
}

.section a:not(.btn) {
    color: #8661c5;
    font-weight: 500;
    text-decoration: none;
}

.section a:not(.btn):hover {
    text-decoration: underline;
}


/* MAIN NAVIGATION */
.main-nav-wrapper .navbar {
    background-color: rgba(17, 17, 17, .98);
}

.main-nav-wrapper .navbar .nav-link {
    position: relative;
    font-weight: 500;
    text-transform: uppercase;
    color: white !important;
    border-bottom: 2px solid transparent;
    width: fit-content;
    margin: 0 2rem;
}

@media screen and (max-width: 1200px) {
    .main-nav-wrapper .navbar .navbar-collapse {
        margin: 1.5rem 0;
    }
    .main-nav-wrapper .navbar .nav-item {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .main-nav-wrapper .navbar .nav-link {
        text-align: center;
        margin: 1.225rem 0;
    }
    .main-nav-wrapper form {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 !important;
    }
    .btn-main-nav-contact {
        margin: 1rem 0 0 0 !important;
    }
}

@media screen and (max-width: 992px) {
    .brevity {
        margin-top: 3rem;
    }

    .turner {
        margin: 6rem 0;
    }

    .acu {
        margin-bottom: 3rem;
    }
}

@media screen and (max-width: 576px) {
    .section.team-images {
        padding-top: 0;
        padding-bottom: 0;
    }
}

@media screen and (max-width: 425px) {
    .carousel-control-prev,
    .carousel-control-next {
        top: 0% !important;
    }
}

@media screen and (max-width: 320px) {
    .carousel-control-next,
    .carousel-control-prev {
        margin: 0 .5rem !important;
    }

    .carousel-control-prev-icon,
    .carousel-control-next-icon {
        padding: .15rem .15rem .25rem .15rem !important;
        width: 24px;
        height: 24px;
    }
}

/* MAIN NAVIGATION BUTTON TOGGLER */
.main-nav-wrapper .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.main-nav-wrapper .navbar-toggler-icon:hover {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28113, 81, 169, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}


/* MAIN NAVIGATION LINKS */
.main-nav-wrapper .navbar .nav-link:hover {
    color: #8661c5 !important
}

.main-nav-wrapper .navbar .nav-link.active {
    border-bottom: 2px solid #8661c5 !important
}

/* SPINNER */
.spinner-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #171717;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.spinner-border {
    border: 3px solid #171717;
    border-top: 3px solid #8661c5;
    border-radius: 50%;
    width: 64px;
    height: 64px;
}


/* BUTTONS */
.btn-main-nav-contact {
    background-color:#fff!important;
    color:#000!important;
    border:0!important;
    padding:8px 40px;
    font-weight:500;
    font-size:16px
}

.btn-main-nav-contact:active,
.btn-main-nav-contact:focus,
.btn-main-nav-contact:hover {
    color: white !important;
    background-color: #7151a9 !important
}

.btn-white {
    background-color: white!important;
    color: hsl(0deg 0% 10%)!important;
    border:0!important;
    padding:14px 40px;
    font-weight:500;
    font-size:18px
}

.btn-white:active,
.btn-white:focus,
.btn-white:hover {
    color: white !important;
    background-color: #8661c5 !important
}

.btn-blue {
    color: white !important;
    border: 0;
    padding: 14px 40px;
    font-weight: 500;
    font-size: 18px;
    background-color: hsl(204deg 100% 40%);
}

.btn-blue:active,
.btn-blue:focus,
.btn-blue:hover {
    background-color: hsl(204deg 100% 40%);;
}

.btn-violet {
    color: white !important;
    border: 0;
    padding: 14px 40px;
    font-weight: 500;
    font-size: 18px;
    background-color: #8661c5;
}

.btn-violet:active,
.btn-violet:focus,
.btn-violet:hover {
    background-color: #3b2e57;
}

.btn-violet-secondary {
    color: white !important;
    border: 0;
    padding: 14px 40px;
    font-weight: 500;
    font-size: 18px;
    background-color: hsl(259deg 31% 26%);
}

.btn-violet-secondary:active,
.btn-violet-secondary:focus,
.btn-violet-secondary:hover {
    background-color: #8661c5;
}

.btn-underline {
    font-size: 18px;
    font-weight: 500;
    color: #8661c5 !important
}
.btn-underline {
    position: relative;
    border-radius: 0;
    background-color: transparent!important;
    padding: 0;
    overflow: hidden;
}
.btn-underline::after{
    background-color: #8661c5;
}
.btn-underline::after{
    content: '';
    position: absolute;
    left: 50%;
    width: 0;
    height: 2px;
    transition: width .3s ease-out,left .3s ease-out;
    transform: translateX(-50%);
    bottom: 0;
}
.btn-underline:hover::after{
    width: 100%;
}
.btn-underline .bi {
    vertical-align: -5px
}


/* HERO */
.hero {
    min-height: 75vh;
    padding: calc(6rem + 6vw) 0;
    background-size: cover;
}

.hero h1 {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.hero h1 span {
    background: linear-gradient(119.88deg, #93F5EC 9.11%, #A77BF3 71.81%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    font-weight: 900;
}

.hero p {
    margin-left: auto;
    margin-right: auto;
    max-width: 65rem;
}

/* SECTION */
.section {
    padding: 6rem 0;
}

.section.bg-full-no-repeat {
    background-size: cover;
    background-repeat: no-repeat;
}

/* TEAM IMAGES SLIDER */
.carousel-item img {
    display: block;
    margin: 0 auto;
}
.carousel-control-next, .carousel-control-prev {
    transition: top .3s ease-in;
    background-color: #8661c5;
    top: 50%;
    transform: translateY(-50%);
    padding: .95rem 1.05rem .95rem .95rem;
    border-radius: 50%;
    height: fit-content;
    width: fit-content;
    margin: 0 1.5rem;
    opacity: 1;
}
.carousel-control-next-icon {
    position: relative;
    right: -.2rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    opacity: 1 !important;
}
.carousel-control-prev-icon {
    position: relative;
    left: -.1rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
    opacity: 1 !important;
}

/* PRIVACY POLICY */
.privacy-policy {
    padding: 4rem 0;
}

.privacy-policy .container {
    padding: 2rem 0;
}

.privacy-policy .h2 {
    margin-bottom: 1.225rem;
    border-bottom: 5px solid #8661c5;
    width: fit-content;
}

.privacy-policy p,
.privacy-policy ol li,
.privacy-policy ul  li {
    color: #131313;
    font-size: 18px;
    font-weight: 500;
    max-width: 75rem;
    color: #313131 !important;
}

.privacy-policy ol li,
.privacy-policy ul  li {
    margin: .725rem 0;
}

.privacy-policy ::marker {
    color: #171717;
    font-weight: 700;
}

/* FOOTER */
.footer-display {
    background-image:url("../images/footer/footer.svg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 175px;
}
.footer {
    padding:3rem 0;
    background-color:#f2f2f2;
    color:#616161!important
}
.footer .social-media {
    font-size: .875rem;
    line-height: 1.25rem;
    color: #191919;
}
.footer .row.border {
    margin-top: 36px;
    border: 0 !important;
    border-top: 1px solid #bfbfbf!important
}
.footer h4 {
    font-size: 15px;
    line-height: 16px;
    padding: 36px 0 4px;
    font-weight: 600;
}
.footer li a {
    color: #616161 !important;
    text-decoration: none !important;
    font-size: 12px !important;
    line-height: 16px !important;
}
.footer li a:hover {
    text-decoration: underline !important;
}
.footer .last-links a:active,.footer .last-links a:focus,.footer .last-links a:hover{
    color: rgba(0,0,0,.9) !important;
    text-decoration: underline !important;
}


/* COOKIES */
.cookies {
    background: #16171a;
    color: white;
    font-size: 14px;
    font-weight: 500;
    border: 2px solid #8661c5;
    border-radius: 0;
    max-width: 358px !important;
    padding: 15px 52px 15px 15px !important;
    position: fixed;
    bottom: 0;
    right: 1rem;
    z-index: 1050;
}

@media screen and (max-width: 400px) {
    .cookies {
        left:1rem
    }
}


/* BACK TO TOP */
#back-to-top {
  display: none; /* Hide the button by default */
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  z-index: 99;
  font-size: 1.5rem;
  border: none;
  outline: none;
  line-height: 0;
  background-color: #8661c5;
  color: white;
  cursor: pointer;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid #8661c5;
  box-shadow: 0 0 30px rgba(193, 142, 241, 0.5);
}

#back-to-top:hover {
    opacity: .95;
}

#back-to-top .bi {
    color: white;
}


/* ANIMATIONS */
.animated{
    position:relative;
    opacity:0
}
.fade-in{
    animation:1s anim_fadeIn
}
.fade-bottom{
    animation:1s anim_fadeBottom
}
.fade-top{
    animation:1s anim_fadeTop
}
.fade-left{
    animation:1s anim_fadeLeft
}
@keyframes anim_fadeIn{
    0%{
        opacity:0
    }
    100%{
        opacity:1
    }
}
@keyframes anim_fadeBottom{
    0%{
        top:3.5rem;
        opacity:0
    }
    100%{
        top:0;
        opacity:1
    }
}
@keyframes anim_fadeTop{
    0%{
        top:-3.5rem;
        opacity:0
    }
    100%{
        top:0;
        opacity:1
    }
}
@keyframes anim_fadeLeft{
    0%{
        left:-3.5rem;
        opacity:0
    }
    100%{
        left:0;
        opacity:1
    }
}