:root {
    --primary-color: #DFFF45;
    --secondary-color: #6EDB3F;
    --color-blue: #0d6efd;
    --white-color: #fff;
    --Highlight-Color: #DFFF45;

    /*--- Footer Color ---*/
    /*--- Footer Bottom Color ----*/

}

/*--- Google Font ---*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

/*--- Global ---*/

body {
    background: #f8f9ff;
    overflow-x: hidden;
}

html {
    scroll-behavior: smooth;
}

body p {
    font-family: 'poppins', sans-serif;
    font-weight: 400 !important;
}

body h1,
h2,
h3,
h4,
h5 {
    font-family: 'Playfair Display', serif;
    font-weight: 600 !important;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}


/*--- NAVBAR ----*/

.custom-navbar {

    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 18px 0;
    background: transparent;
    transition: all .45s ease;
    z-index: 9999;

}

/*--- Scroll Effect ---*/

.custom-navbar.nav-scrolled {

    background: rgba(8, 17, 31, .55);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .18);
    padding: 14px 0;

}

.brand-logo {
    width: 160px;
    transition: .35s;
}

.custom-navbar.nav-scrolled .brand-logo {
    width: 145px;
}

.nav-link {

    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 14px;
    padding: 10px 0;
    color: #fff !important;
    font-weight: 500;
    transition: .35s;
}

.nav-link:hover {
    color: var(--Highlight-Color) !important;
}

.nav-link::after {

    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--Highlight-Color);
    transition: .35s;
    transform: translateX(-50%);

}

.nav-link:hover::after,
.nav-link.active::after {
    width: 100%;
}

.login-btn {
    background: var(--primary-color);
    color: #000;
    border: none;
    padding: 12px 28px;
    border-radius: 50px;
    font-weight: 500;
    transition: .35s;

}

.login-btn:hover {
    transform: translateY(-4px);
    box-shadow:
        0 12px 25px rgba(37, 99, 235, .35);

}

@media (max-width:991.98px) {

    .navbar-collapse {
        margin-top: 15px;
        padding: 20px;
        background: rgba(8, 17, 31, .95);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border: 1px solid rgba(255, 255, 255, .08);
        border-radius: 20px;

    }

    .navbar-nav {
        align-items: flex-start;
    }

    .nav-link {

        padding: 12px 0;
        margin: 0;
        width: 100%;
    }

    .login-btn {
        width: 100%;
        margin-top: 20px;
    }

}

.navbar-toggler {
    border: none;
    box-shadow: none;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.navbar-toggler-icon {
    filter: invert(1);
}

.custom-navbar::after {

    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg,
            #2563EB,
            #60A5FA,
            #DFFF45);
    transition: .45s;
}

.custom-navbar.nav-scrolled::after {
    width: 100%;
}

/*--- END OF NAVBAR ----*/


/*--- Hero section Start ---*/

.index-hero-section {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 50px 0 20px;
    background: #08111f;
}

/*--- Hero Content ---*/

.index-hero-content {
    position: relative;
    z-index: 2;
}

.index-hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #2563eb;
    margin-bottom: 20px;
}

.index-hero-tag i {
    font-size: 18px;
}

.index-hero-title {
    font-size: clamp(3rem, 7vw, 6rem);
    font-weight: 800;
    line-height: 0.95;
    color: #FFF;
    margin-bottom: 30px;
}

.index-hero-title span {
    display: block;
    color: #2563eb;
}

.index-hero-description {
    font-size: 18px;
    line-height: 1.8;
    color: #eee;
    max-width: 520px;
    margin-bottom: 40px;
}

/*--- Buttons ---*/

.index-hero-buttons {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}

.index-btn-primary {
    background: var(--primary-color);
    color: #fff;
    padding: 15px 34px;
    border-radius: 50px;
    font-weight: 600;
    transition: .4s;
    box-shadow: 0 15px 35px rgba(0, 0, 0, .12);
}

.index-btn-primary:hover {
    background: #111;
    color: #fff;
    transform: translateY(-5px);
}

.index-btn-outline {
    border: 2px solid #ffffff;
    color: #ffffff;
    padding: 15px 34px;
    border-radius: 50px;
    font-weight: 600;
    transition: .4s;
}

.index-btn-outline:hover {
    background: #111;
    color: #fff;
    transform: translateY(-5px);
}

/*--- Hero Image ---*/

.index-hero-image {
    position: relative;
    width: 100%;
    height: 650px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*--- Circle Background ---*/

.index-circle-bg {
    position: absolute;
    width: 480px;
    height: 480px;
    border-radius: 50%;
    background: linear-gradient(135deg, #bcaeff, #7b61ff);
    opacity: .25;
    filter: blur(0px);
}

/*--- Laptop ---*/

.index-laptop {
    position: relative;
    max-width: 560px;
    width: 100%;
    z-index: 2;
    animation: indexFloat 5s ease-in-out infinite;
    filter: drop-shadow(0 40px 40px rgba(0, 0, 0, .18));
}

/*--- Floating Objects ---*/

.index-floating {
    position: absolute;
    z-index: 3;
    animation: indexFloat 6s ease-in-out infinite;
    transition: .4s;
}

.index-security {
    width: 210px;
    bottom: 0%;
    left: 0%;
    animation-delay: 1s;
}

.index-server {
    width: 280px;
    bottom: 5%;
    right: -10%;
    animation-delay: 1.5s;
}

/*--- Hover Effect ---*/

.index-floating:hover {
    transform: scale(1.1) rotate(8deg);
}

/*--- Floating Animation ---*/

@keyframes indexFloat {

    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-18px);
    }

    100% {
        transform: translateY(0px);
    }

}

/*--- Responsive ---*/

@media(max-width:1399px) {

    .index-laptop {
        max-width: 500px;
    }

    .index-circle-bg {
        width: 420px;
        height: 420px;
    }

}

@media (max-width:1040.1px) {
    .index-security {
        width: 150px;
    }

    .index-server {
        width: 200px;
        bottom: 0%;
        right: -05%;
    }
}

@media(max-width:1199px) {

    .index-hero-title {
        font-size: 70px;
    }

    .index-hero-image {
        height: 550px;
    }

    .index-laptop {
        max-width: 460px;
    }

    .index-circle-bg {
        width: 380px;
        height: 380px;
    }

}

@media(max-width:991px) {

    .index-hero-section {
        padding: 130px 0 80px;
        text-align: center;
    }

    .index-hero-description {
        margin: auto;
        margin-bottom: 35px;
    }

    .index-hero-buttons {
        justify-content: center;
    }

    .index-hero-image {
        margin-top: 70px;
        height: 500px;
    }

    .index-circle-bg {
        width: 340px;
        height: 340px;
    }

    .index-laptop {
        max-width: 420px;
    }

    .index-security {
        width: 150px;
        left: 10%;
    }

    .index-server {
        width: 200px;
        right: 5%;
    }

}

@media(max-width:767px) {

    .index-hero-section {
        padding: 120px 0 70px;
    }

    .index-hero-title {
        font-size: 52px;
    }

    .index-hero-description {
        font-size: 16px;
    }

    .index-btn-primary,
    .index-btn-outline {
        width: 100%;
    }

    .index-hero-buttons {
        gap: 15px;
    }

    .index-hero-image {
        height: 380px;
    }

    .index-circle-bg {
        width: 260px;
        height: 260px;
    }

    .index-laptop {
        max-width: 310px;
    }

    .index-security {
        width: 55px;
        left: 12%;
    }

    .index-server {
        width: 70px;
    }

}

@media(max-width:575px) {

    .index-hero-title {
        font-size: 42px;
    }

    .index-hero-description {
        font-size: 15px;
    }

    .index-hero-image {
        height: 320px;
    }

    .index-circle-bg {
        width: 220px;
        height: 220px;
    }

    .index-laptop {
        max-width: 270px;
    }

    .index-security {
        width: 100px;
        left: 6%;
        bottom: -5%;
    }

    .index-server {
        width: 130px;
        right: 5%;
        bottom: -8%;
    }

}

@media (max-width:320.1px) {

    .index-security {
        width: 100px;
        left: 0;
        bottom: -5%;
    }

    .index-server {
        width: 130px;
        right: -5%;
        bottom: -8%;
    }
}

/*--- Hero Section End ---*/


/*--- Stats Section Start ---*/

.index-stats-section {
    margin-top: -70px;
    position: relative;
    background: #08111f;
    z-index: 10;
}

.index-stats-wrapper {
    background: #111827;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, .15);
}

.index-stats-card {
    padding: 45px 35px;
    height: 100%;
    border-right: 1px solid rgba(255, 255, 255, .08);
    transition: .35s;
}

.index-stats-last {
    border-right: none;
}

.index-stats-card:hover {
    background: #181f2f;
}

.index-stats-icon {
    width: 65px;
    height: 65px;
    border-radius: 18px;
    background: rgba(223, 255, 69, .08);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 25px;
}

.index-stats-icon i {
    font-size: 30px;
    color: var(--primary-color);
}

.index-stats-title {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 18px;
    line-height: 1.4;
}

.index-stats-text {
    color: #b9c0d0;
    font-size: 15px;
    line-height: 1.9;
    margin: 0;
}

/*--- Hover ---*/

.index-stats-card:hover .index-stats-icon {
    transform: translateY(-8px) rotate(-5deg);
    transition: .35s;
}

.index-stats-card:hover .index-stats-icon i {
    transform: scale(1.15);
    transition: .35s;
}

/*--- Responsive ---*/

@media(max-width:991px) {

    .index-stats-card {
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

    .index-stats-last {
        border-bottom: none;
    }

}

@media(max-width:767px) {

    .index-stats-section {
        margin-top: 40px;
    }

    .index-stats-card {
        padding: 35px 28px;
        text-align: center;
    }

    .index-stats-icon {
        margin: auto auto 20px;
    }

    .index-stats-title {
        font-size: 22px;
    }

}

@media(max-width:575px) {

    .index-stats-wrapper {
        border-radius: 20px;
    }

    .index-stats-card {
        padding: 30px 22px;
    }

    .index-stats-title {
        font-size: 20px;
    }

    .index-stats-text {
        font-size: 14px;
    }

}

/*--- Stats Section End ---*/

/*--- About Us Section Strat ---*/

.index-atb-section {
    position: relative;
    padding: 120px 0;
    background: #08111f;
    overflow: hidden;
}

.index-atb-section::before {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    background: #2563eb;
    border-radius: 50%;
    filter: blur(180px);
    opacity: .18;
    left: -150px;
    top: -120px;
}

.index-atb-section::after {
    content: "";
    position: absolute;
    width: 350px;
    height: 350px;
    background: #8b5cf6;
    border-radius: 50%;
    filter: blur(170px);
    opacity: .18;
    right: -120px;
    bottom: -120px;
}

/*--- LEFT IMAGE ---*/

.index-atb-image-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.index-atb-bg-circle {
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2563eb, #7c3aed);
    opacity: .25;
    filter: blur(60px);
}

.index-atb-main-image {
    width: 100%;
    border-radius: 24px;
    position: relative;
    z-index: 2;
    box-shadow: 0 35px 80px rgba(0, 0, 0, .45);
    transition: .5s;
}

.index-atb-image-wrapper:hover .index-atb-main-image {
    transform: scale(1.03);
}

/*--- FLOATING CARD ---*/

.index-atb-floating-card {

    position: absolute;
    right: -35px;
    top: 35px;
    background: rgba(16, 24, 40, .95);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 20px;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    gap: 15px;
    z-index: 5;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .35);
}

.index-atb-floating-card i {
    font-size: 34px;
    color: #DFFF45;
}

.index-atb-floating-card h5 {
    color: #fff;
    font-weight: 700;
    margin-bottom: 2px;
}

.index-atb-floating-card span {
    color: #bfc6d8;
    font-size: 14px;
}

/*--- EXPERIENCE CARD ---*/

.index-atb-experience-card {
    position: absolute;
    left: -35px;
    bottom: 35px;
    background: #fff;
    border-radius: 20px;
    padding: 22px 28px;
    z-index: 5;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .25);

}

.index-atb-experience-card h2 {

    margin: 0;
    font-size: 46px;
    color: #2563eb;
    font-weight: 800;

}

.index-atb-experience-card p {

    margin-top: 6px;
    margin-bottom: 0;
    color: #555;
    font-weight: 600;

}

/*--- CONTENT ---*/

.index-atb-content {
    padding-left: 60px;
}

.index-atb-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #DFFF45;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
    margin-bottom: 18px;

}

.index-atb-subtitle i {

    color: #DFFF45;

}

.index-atb-title {

    color: #fff;

    font-size: 54px;

    font-weight: 800;

    line-height: 1.15;

    margin-bottom: 25px;

}

.index-atb-title span {

    display: block;

    color: #60A5FA;

}

.index-atb-description {

    color: #bfc6d8;

    font-size: 17px;

    line-height: 1.9;

    margin-bottom: 35px;

}

/*--- FEATURES ---*/

.index-atb-feature {

    display: flex;

    align-items: center;

    gap: 15px;

    padding: 18px;

    border-radius: 16px;

    background: rgba(255, 255, 255, .04);

    border: 1px solid rgba(255, 255, 255, .06);

    transition: .35s;

    height: 100%;

}

.index-atb-feature i {

    font-size: 22px;

    color: #DFFF45;

    min-width: 25px;

}

.index-atb-feature span {

    color: #fff;

    font-weight: 500;

    line-height: 1.5;

}

.index-atb-feature:hover {

    transform: translateY(-8px);

    background: #132238;

    border-color: #2563eb;

    box-shadow: 0 20px 35px rgba(0, 0, 0, .25);

}

/*--- BUTTON ---*/

.index-atb-button-wrapper {

    margin-top: 45px;

}

.index-atb-btn {

    background: #DFFF45;

    color: #111;

    padding: 16px 38px;

    border-radius: 50px;

    font-weight: 700;

    transition: .35s;

}

.index-atb-btn i {

    margin-left: 10px;

}

.index-atb-btn:hover {

    background: #2563eb;

    color: #fff;

    transform: translateY(-5px);

    box-shadow: 0 15px 35px rgba(37, 99, 235, .35);

}

/*--- ANIMATIONS ---*/

.index-atb-floating-card {

    animation: indexFloatOne 4s ease-in-out infinite;

}

.index-atb-experience-card {

    animation: indexFloatTwo 5s ease-in-out infinite;

}

@keyframes indexFloatOne {

    0%,
    100% {
        transform: translateY(0);

    }

    50% {
        transform: translateY(-12px);

    }

}

@keyframes indexFloatTwo {

    0%,
    100% {
        transform: translateY(0);

    }

    50% {
        transform: translateY(12px);

    }

}

/*--- RESPONSIVE ---*/

@media(max-width:991px) {

    .index-atb-content {
        padding-left: 0;
        margin-top: 70px;

    }

    .index-atb-title {
        font-size: 42px;

    }

    .index-atb-floating-card {
        right: 15px;
        top: 15px;

    }

    .index-atb-experience-card {
        left: 15px;
        bottom: 15px;

    }

}

@media(max-width:767px) {

    .index-atb-section {
        padding: 80px 0;

    }

    .index-atb-title {
        font-size: 34px;

    }

    .index-atb-description {
        font-size: 15px;

    }

    .index-atb-feature {
        padding: 16px;

    }

    .index-atb-main-image {
        width: 100%;
        height: 320px;
    }

    .index-atb-floating-card {
        right: 0;
        top: -30px;
        margin-top: 20px;
    }

    .index-atb-experience-card {
        left: 0;
        bottom: -30px;
        margin-top: 20px;
    }

    .index-atb-content {
        margin-top: 40px;

    }

    .index-atb-btn {
        width: 100%;

    }

}

/*---- About Us Section End ---*/

/*--- Our Services Section ---*/

.index-ser-section {
    position: relative;
    padding: 120px 0;
    background: #07111f;
    overflow: hidden;
}

/*--- Background Glow ---*/

.index-ser-section::before {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    background: #2563eb;
    filter: blur(180px);
    border-radius: 50%;
    opacity: .15;
    top: -150px;
    left: -150px;
}

.index-ser-section::after {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    background: #7c3aed;
    filter: blur(180px);
    border-radius: 50%;
    opacity: .15;
    right: -120px;
    bottom: -120px;
}

/*--- Heading ---*/

.index-ser-heading {
    position: relative;
    z-index: 2;
    margin-bottom: 50px;
}

.index-ser-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    border-radius: 50px;
    background: rgba(223, 255, 69, .08);
    color: #DFFF45;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.index-ser-subtitle i {
    font-size: 18px;
}

.index-ser-title {
    margin-top: 25px;
    font-size: 55px;
    font-weight: 800;
    line-height: 1.15;
    color: #fff;
}

.index-ser-title span {
    display: block;
    color: #5EA8FF;
}

.index-ser-description {
    margin-top: 25px;
    color: #B9C2D1;
    font-size: 17px;
    line-height: 1.9;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/*--- Cards ---*/

.index-ser-card {

    position: relative;

    height: 100%;

    padding: 40px 35px;

    background: rgba(255, 255, 255, .04);

    border: 1px solid rgba(255, 255, 255, .06);

    border-radius: 25px;

    backdrop-filter: blur(15px);

    transition: .4s;

    overflow: hidden;

}

.index-ser-card::before {

    content: "";

    position: absolute;

    top: -120px;

    right: -120px;

    width: 220px;

    height: 220px;

    background: linear-gradient(135deg, #2563eb, #7c3aed);

    border-radius: 50%;

    opacity: 0;

    transition: .5s;

}

.index-ser-card:hover::before {

    opacity: .15;

}

.index-ser-card:hover {

    transform: translateY(-15px);

    border-color: rgba(94, 168, 255, .35);

    box-shadow: 0 30px 60px rgba(0, 0, 0, .30);

}

/*--- Icon ---*/

.index-ser-icon {

    width: 85px;

    height: 85px;

    border-radius: 22px;

    background: rgba(223, 255, 69, .08);

    display: flex;

    justify-content: center;

    align-items: center;

    margin-bottom: 30px;

    transition: .4s;

}

.index-ser-icon i {

    font-size: 40px;

    color: #DFFF45;

    transition: .4s;

}

.index-ser-card:hover .index-ser-icon {

    background: #DFFF45;

    transform: rotate(-8deg);

}

.index-ser-card:hover .index-ser-icon i {

    color: #111;

    transform: scale(1.1);

}

/*--- Title ---*/

.index-ser-card-title {

    font-size: 28px;

    color: #fff;

    font-weight: 700;

    margin-bottom: 18px;

}

/*--- Text ---*/

.index-ser-card-text {

    color: #B9C2D1;

    line-height: 1.9;

    margin-bottom: 35px;

    font-size: 16px;

}

/*--- Link ---*/

.index-ser-link {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: #5EA8FF;

    font-weight: 600;

    text-decoration: none;

    transition: .35s;

}

.index-ser-link i {

    transition: .35s;

}

.index-ser-link:hover {

    color: #DFFF45;

}

.index-ser-link:hover i {

    transform: translateX(8px);

}

/*--- Responsive ---*/

@media(max-width:1199px) {

    .index-ser-title {
        font-size: 48px;

    }

}

@media(max-width:991px) {

    .index-ser-section {
        padding: 90px 0;

    }

    .index-ser-title {
        font-size: 42px;

    }

    .index-ser-card {
        padding: 35px 30px;

    }

}

@media(max-width:767px) {

    .index-ser-title {
        font-size: 34px;

    }

    .index-ser-description {
        font-size: 15px;

    }

    .index-ser-card {
        text-align: center;

    }

    .index-ser-icon {
        margin: 0 auto 25px;

    }

    .index-ser-link {
        justify-content: center;

    }

}

@media(max-width:575px) {

    .index-ser-section {
        padding: 70px 0;

    }

    .index-ser-title {
        font-size: 30px;

    }

    .index-ser-card {
        padding: 30px 25px;

    }

    .index-ser-card-title {
        font-size: 24px;

    }

    .index-ser-card-text {
        font-size: 15px;

    }

    .index-ser-icon {
        width: 75px;
        height: 75px;

    }

    .index-ser-icon i {
        font-size: 34px;

    }

}

/*--- Reveal Animation ---*/

.index-ser-hidden {

    opacity: 0;

    transform: translateY(70px);

    transition: all .8s ease;

}

.index-ser-show {

    opacity: 1;

    transform: translateY(0);

}

/*--- Different Delay ---*/

.index-ser-card:nth-child(1) {

    transition-delay: .1s;

}

.index-ser-card:nth-child(2) {

    transition-delay: .2s;

}

.index-ser-card:nth-child(3) {

    transition-delay: .3s;

}

.index-ser-card:nth-child(4) {

    transition-delay: .4s;

}

.index-ser-card:nth-child(5) {

    transition-delay: .5s;

}

.index-ser-card:nth-child(6) {

    transition-delay: .6s;

}

/*--- Glow Animation ---*/

.index-ser-card::after {

    content: "";

    position: absolute;

    inset: -2px;

    border-radius: 25px;

    background: linear-gradient(135deg, #2563eb, #7c3aed, #DFFF45);

    z-index: -1;

    opacity: 0;

    transition: .4s;

    filter: blur(25px);

}

.index-ser-card:hover::after {

    opacity: .4;

}

/*--- Service Us Section End ---*/

/*--- Why Choose Us Strat ---*/

/*--- WHY CHOOSE US ---*/

.index-wcu-section {
    position: relative;
    padding: 120px 0;
    background: #08111f;
    overflow: hidden;
}

.index-wcu-section::before {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    background: #2563eb;
    border-radius: 50%;
    filter: blur(180px);
    opacity: .12;
    top: -180px;
    left: -180px;
}

.index-wcu-section::after {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    background: #7c3aed;
    border-radius: 50%;
    filter: blur(180px);
    opacity: .12;
    bottom: -180px;
    right: -180px;
}

/*--- Heading ---*/

.index-wcu-heading {
    margin-bottom: 70px;
}

.index-wcu-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    border-radius: 50px;
    background: rgba(223, 255, 69, .08);
    color: #DFFF45;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.index-wcu-subtitle i {
    font-size: 18px;
}

.index-wcu-title {
    margin-top: 25px;
    font-size: clamp(2.3rem, 5vw, 3.8rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
}

.index-wcu-title span {
    display: block;
    color: #60A5FA;
}

.index-wcu-description {
    max-width: 720px;
    margin: 25px auto 0;
    color: #BFC6D8;
    line-height: 1.9;
    font-size: 17px;
}

/*--- CENTER IMAGE ---*/

.index-wcu-center {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 520px;
}

.index-wcu-glow {
    position: absolute;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2563eb, #7c3aed);
    opacity: .22;
    filter: blur(60px);
}

.index-wcu-main-image {
    position: relative;
    z-index: 2;
    max-width: 100%;
    animation: indexWcuFloat 5s ease-in-out infinite;
    filter: drop-shadow(0 40px 60px rgba(0, 0, 0, .35));
}

/*--- CARDS ---*/

.index-wcu-card {

    position: relative;

    display: flex;

    align-items: center;

    gap: 22px;

    padding: 28px;

    margin-bottom: 25px;

    border-radius: 24px;

    background: rgba(255, 255, 255, .04);

    border: 1px solid rgba(255, 255, 255, .06);

    backdrop-filter: blur(16px);

    transition: .4s;

    overflow: hidden;

}

.index-wcu-card::before {

    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(135deg, #2563eb, #7c3aed);

    opacity: 0;

    transition: .4s;

    z-index: 0;

}

.index-wcu-card>* {

    position: relative;

    z-index: 2;

}

.index-wcu-card:hover {

    transform: translateY(-12px);

    border-color: rgba(96, 165, 250, .25);

    box-shadow: 0 25px 45px rgba(0, 0, 0, .25);

}

.index-wcu-card:hover::before {

    opacity: .08;

}

/*--- ICON ---*/

.index-wcu-icon {

    width: 80px;

    height: 80px;

    min-width: 80px;

    border-radius: 22px;

    display: flex;

    justify-content: center;

    align-items: center;

    background: rgba(223, 255, 69, .08);

    transition: .4s;

}

.index-wcu-icon i {

    font-size: 34px;

    color: #DFFF45;

    transition: .4s;

}

.index-wcu-card:hover .index-wcu-icon {

    background: #DFFF45;

    transform: rotate(-8deg);

}

.index-wcu-card:hover .index-wcu-icon i {

    color: #111;

}

/*--- TEXT ---*/

.index-wcu-card h4 {

    color: #fff;

    font-size: 24px;

    font-weight: 700;

    margin-bottom: 10px;

}

.index-wcu-card p {

    margin: 0;

    color: #BFC6D8;

    line-height: 1.8;

    font-size: 15px;

}

/*--- FLOATING ---*/

@keyframes indexWcuFloat {

    0%,
    100% {
        transform: translateY(0px);

    }

    50% {
        transform: translateY(-20px);

    }

}

/*--- TABLET ---*/

@media(max-width:991px) {

    .index-wcu-center {
        min-height: 420px;
        margin: 60px 0;

    }

    .index-wcu-main-image {
        width: 350px;

    }

    .index-wcu-card {
        margin-bottom: 20px;

    }

}

/*--- MOBILE ---*/

@media(max-width:767px) {

    .index-wcu-section {
        padding: 80px 0;

    }

    .index-wcu-heading {
        margin-bottom: 50px;

    }

    .index-wcu-title {
        font-size: 34px;

    }

    .index-wcu-description {
        font-size: 15px;

    }

    .index-wcu-center {
        min-height: 300px;
        margin: 40px 0;

    }

    .index-wcu-main-image {
        width: 260px;

    }

    .index-wcu-card {
        flex-direction: column;
        text-align: center;
        gap: 18px;
        padding: 25px;

    }

    .index-wcu-icon {
        width: 70px;
        height: 70px;
        min-width: 70px;

    }

    .index-wcu-icon i {
        font-size: 30px;

    }

    .index-wcu-card h4 {
        font-size: 22px;

    }

}

/*--- Reveal ---*/

.index-wcu-hidden {

    opacity: 0;

    transform: translateY(70px);

    transition: .8s;

}

.index-wcu-show {

    opacity: 1;

    transform: translateY(0);

}

/*--- Transition Delay ---*/

.index-wcu-card:nth-child(1) {

    transition-delay: .1s;

}

.index-wcu-card:nth-child(2) {

    transition-delay: .25s;

}

.index-wcu-card:nth-child(3) {

    transition-delay: .4s;

}

/*--- Image Transition ---*/

.index-wcu-main-image {

    transition: .25s linear;

    will-change: transform;

}

.index-wcu-glow {

    transition: .3s linear;

}

/*--- Card Animation ---*/

.index-wcu-card {

    will-change: transform;

    transform-style: preserve-3d;

}

/*--- Icon Glow ---*/

.index-wcu-icon {

    position: relative;

    overflow: hidden;

}

.index-wcu-icon::before {

    content: "";

    position: absolute;

    width: 120%;

    height: 120%;

    background: radial-gradient(circle,
            rgba(223, 255, 69, .35),
            transparent 70%);

    opacity: 0;

    transition: .35s;

}

.index-wcu-card:hover .index-wcu-icon::before {

    opacity: 1;

}

/*--- Smooth Hover ---*/

.index-wcu-card {

    transition:
        transform .35s,
        box-shadow .35s,
        background .35s;

}

/*--- Why Choose Us End ---*/

/*--- Our Process Section ---*/

.index-pro-section {
    position: relative;
    padding: 120px 0;
    background: #08111F;
    overflow: hidden;
}

.index-pro-section::before {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    background: #2563EB;
    border-radius: 50%;
    filter: blur(180px);
    opacity: .12;
    top: -150px;
    left: -150px;
}

.index-pro-section::after {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    background: #7C3AED;
    border-radius: 50%;
    filter: blur(180px);
    opacity: .12;
    bottom: -150px;
    right: -150px;
}

/*--- Heading ---*/

.index-pro-heading {

    margin-bottom: 80px;

}

.index-pro-subtitle {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding: 10px 22px;

    border-radius: 50px;

    background: rgba(223, 255, 69, .08);

    color: #DFFF45;

    font-size: 14px;

    text-transform: uppercase;

    font-weight: 600;

    letter-spacing: 2px;

}

.index-pro-subtitle i {

    font-size: 18px;

}

.index-pro-title {

    margin-top: 25px;

    font-size: clamp(2.8rem, 5vw, 4rem);

    font-weight: 800;

    line-height: 1.1;

    color: #fff;

}

.index-pro-title span {

    display: block;

    color: #60A5FA;

}

.index-pro-description {

    max-width: 720px;

    margin: 25px auto 0;

    color: #BFC6D8;

    line-height: 1.9;

    font-size: 17px;

}

/*--- Main Wrapper ---*/

.index-pro-wrapper {

    display: grid;

    grid-template-columns: 1fr 420px 1fr;

    align-items: center;

    gap: 40px;

    position: relative;

}

/*--- Left & Right Columns ---*/

.index-pro-left,
.index-pro-right {

    display: flex;

    flex-direction: column;

    gap: 35px;

}

/*--- Cards ---*/

.index-pro-card {

    position: relative;

    display: flex;

    align-items: center;

    gap: 20px;

    padding: 25px;

    border-radius: 24px;

    background: rgba(255, 255, 255, .04);

    backdrop-filter: blur(16px);

    border: 1px solid rgba(255, 255, 255, .08);

    transition: .4s;

    overflow: hidden;

}

.index-pro-card::before {

    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(135deg, #2563EB, #7C3AED);

    opacity: 0;

    transition: .4s;

}

.index-pro-card>* {

    position: relative;

    z-index: 2;

}

.index-pro-card:hover {

    transform: translateY(-12px);

    border-color: rgba(96, 165, 250, .3);

    box-shadow: 0 25px 45px rgba(0, 0, 0, .25);

}

.index-pro-card:hover::before {

    opacity: .08;

}

/*--- Number ---*/

.index-pro-number {

    position: absolute;

    top: 18px;

    right: 20px;

    font-size: 50px;

    font-weight: 800;

    color: rgba(255, 255, 255, .05);

    user-select: none;

}

/*--- Icon ---*/

.index-pro-icon {

    width: 78px;

    height: 78px;

    min-width: 78px;

    border-radius: 20px;

    display: flex;

    justify-content: center;

    align-items: center;

    background: rgba(223, 255, 69, .08);

    transition: .35s;

}

.index-pro-icon i {

    font-size: 32px;

    color: #DFFF45;

    transition: .35s;

}

.index-pro-card:hover .index-pro-icon {

    background: #DFFF45;

    transform: rotate(-8deg);

}

.index-pro-card:hover .index-pro-icon i {

    color: #111;

}

/*--- Content ---*/

.index-pro-content h4 {

    color: #fff;

    font-size: 24px;

    font-weight: 700;

    margin-bottom: 12px;

}

.index-pro-content p {

    color: #BFC6D8;

    line-height: 1.8;

    margin: 0;

    font-size: 15px;

}

/*--- Center Hub ---*/

.index-pro-center {

    position: relative;

    display: flex;

    justify-content: center;

    align-items: center;

    width: 420px;

    height: 420px;

    margin: auto;

}

/*--- Glow ---*/

.index-pro-glow {

    position: absolute;

    width: 320px;

    height: 320px;

    border-radius: 50%;

    background: linear-gradient(135deg, #2563EB, #7C3AED);

    opacity: .22;

    filter: blur(70px);

}

/*--- Circle ---*/

.index-pro-circle {

    position: relative;

    width: 330px;

    height: 330px;

    border-radius: 50%;

    display: flex;

    justify-content: center;

    align-items: center;

    background: rgba(255, 255, 255, .04);

    border: 1px solid rgba(255, 255, 255, .08);

    backdrop-filter: blur(18px);

    z-index: 5;

}

/*--- Main Image ---*/

.index-pro-main-image {
    width: 350px;
    position: relative;
    z-index: 10;
    filter: drop-shadow(0 25px 40px rgba(0, 0, 0, .35));
}


/*--- Floating Animation ---*/


/*--- Center Pulse ---*/

.index-pro-circle::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid rgba(96, 165, 250, .25);
    animation: indexProPulse 4s linear infinite;
}

.index-pro-circle::after {
    content: "";
    position: absolute;
    width: 118%;
    height: 118%;
    border-radius: 50%;
    border: 2px solid rgba(124, 58, 237, .18);
    animation: indexProPulse 4s linear infinite;
    animation-delay: 2s;
}

@keyframes indexProPulse {
    0% {
        transform: scale(.9);
        opacity: 0;
    }

    30% {
        opacity: .5;
    }

    100% {
        transform: scale(1.35);
        opacity: 0;
    }
}

/*--- Center Glow Rotation ---*/

.index-pro-glow {
    animation: indexGlowRotate 18s linear infinite;
}

@keyframes indexGlowRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/*--- Main Image Floating ---*/

.index-pro-main-image {
    animation: indexLaptopFloat 5s ease-in-out infinite;
}

@keyframes indexLaptopFloat {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-15px);
    }

}

/*--- Card Border Glow ---*/

.index-pro-card {
    position: relative;
}

.index-pro-card::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 24px;
    background: linear-gradient(135deg,
            rgba(37, 99, 235, .4),
            rgba(124, 58, 237, .35),
            rgba(223, 255, 69, .3));
    z-index: -1;
    opacity: 0;
    transition: .35s;
    filter: blur(18px);
}

.index-pro-card:hover::after {
    opacity: 1;
}

/*--- Animated Connection Dots ---*/

.index-pro-center span {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #DFFF45;
    box-shadow: 0 0 20px #DFFF45;
    animation: indexDotBlink 2s infinite;

}

@keyframes indexDotBlink {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: .4;
        transform: scale(.5);
    }

}

/*--- Card Shine ---*/

.index-pro-card {
    overflow: hidden;
}

.index-pro-card .index-pro-content {
    position: relative;
    z-index: 2;
}

.index-pro-card::before {
    background:
        linear-gradient(110deg,
            transparent,
            rgba(255, 255, 255, .08),
            transparent);
    background-size: 250% 250%;
}

.index-pro-card:hover::before {
    animation: indexShine 1.2s linear;
}

@keyframes indexShine {
    from {
        background-position: -250% 0;
    }

    to {
        background-position: 250% 0;
    }
}

/*--- Large Desktop (1400px) ---*/

@media (max-width:1400px) {

    .index-pro-wrapper {
        grid-template-columns: 1fr 380px 1fr;
        gap: 35px;

    }

    .index-pro-center {
        width: 380px;
        height: 380px;

    }

    .index-pro-circle {
        width: 300px;
        height: 300px;

    }

    .index-pro-main-image {
        width: 200px;

    }

    .index-pro-cloud {
        width: 85px;

    }

    .index-pro-server {
        width: 95px;

    }

    .index-pro-security {
        width: 80px;

    }

}


/*--- Laptop ---*/

@media (max-width:1200px) {
    .index-pro-wrapper {
        grid-template-columns: 1fr 340px 1fr;
        gap: 25px;
    }

    .index-pro-card {
        padding: 22px;
    }

    .index-pro-icon {
        width: 70px;
        height: 70px;
        min-width: 70px;
    }

    .index-pro-icon i {
        font-size: 28px;
    }

    .index-pro-content h4 {
        font-size: 22px;
    }

    .index-pro-title {
        font-size: 48px;
    }

    .index-pro-center {
        width: 340px;
        height: 340px;
    }

    .index-pro-circle {
        width: 270px;
        height: 270px;

    }

    .index-pro-main-image {
        width: 180px;

    }

}


/*---
Tablet
---*/

@media (max-width:991px) {

    .index-pro-section {
        padding: 90px 0;

    }

    .index-pro-wrapper {
        display: flex;
        flex-direction: column;
        gap: 50px;

    }

    .index-pro-left,

    .index-pro-right {
        width: 100%;

    }

    .index-pro-center {
        order: -1;
        width: 320px;
        height: 320px;

    }

    .index-pro-circle {
        width: 250px;
        height: 250px;

    }

    .index-pro-main-image {
        width: 170px;

    }

    .index-pro-card {
        margin-bottom: 20px;

    }

    .index-pro-heading {
        margin-bottom: 50px;

    }

}


/*--- Mobile ---*/

@media (max-width:767px) {

    .index-pro-section {
        padding: 70px 0;

    }

    .index-pro-title {
        font-size: 34px;

    }

    .index-pro-description {
        font-size: 15px;

    }

    .index-pro-center {
        width: 270px;
        height: 270px;

    }

    .index-pro-circle {
        width: 220px;
        height: 220px;

    }

    .index-pro-main-image {
        width: 150px;

    }

    .index-pro-card {
        flex-direction: column;
        text-align: center;
        padding: 25px 20px;
        gap: 18px;

    }

    .index-pro-number {
        top: 10px;
        right: 15px;
        font-size: 38px;

    }

    .index-pro-icon {
        margin: auto;

    }

    .index-pro-content {
        text-align: center;

    }

    .index-pro-cloud {
        width: 60px;
        top: 5%;
        right: -5%;

    }

    .index-pro-server {
        width: 70px;
        right: -5%;
        bottom: 5%;

    }

    .index-pro-security {
        width: 60px;
        left: -5%;
        bottom: 10%;

    }

}


/*--- Small Mobile ---*/

@media (max-width:576px) {

    .index-pro-title {
        font-size: 30px;

    }

    .index-pro-description {
        font-size: 14px;

    }

    .index-pro-center {
        width: 230px;
        height: 230px;

    }

    .index-pro-circle {
        width: 180px;
        height: 180px;

    }

    .index-pro-main-image {
        width: 120px;

    }

    .index-pro-card {
        border-radius: 18px;

    }

    .index-pro-content h4 {
        font-size: 20px;

    }

    .index-pro-content p {
        font-size: 14px;

    }

    .index-pro-cloud {
        width: 45px;

    }

    .index-pro-server {
        width: 55px;

    }

    .index-pro-security {
        width: 45px;

    }

}


/*--- Smooth Transition ---*/

.index-pro-card,

.index-pro-icon,

.index-pro-circle,

.index-pro-main-image,

.index-pro-cloud,

.index-pro-server,

.index-pro-security {

    transition: all .35s ease;

}


/*--- Performance ---*/

.index-pro-card,

.index-pro-main-image,

.index-pro-cloud,

.index-pro-server,

.index-pro-security {

    will-change: transform;

}

/*--- Reveal ---*/

.index-pro-hidden {

    opacity: 0;

    transform: translateY(80px);

    transition: .9s ease;

}

.index-pro-show {

    opacity: 1;

    transform: translateY(0);

}

/*--- Sequential Delay ---*/

.index-pro-left .index-pro-card:nth-child(1) {

    transition-delay: .1s;

}

.index-pro-left .index-pro-card:nth-child(2) {

    transition-delay: .25s;

}

.index-pro-left .index-pro-card:nth-child(3) {

    transition-delay: .4s;

}

.index-pro-right .index-pro-card:nth-child(1) {

    transition-delay: .55s;

}

.index-pro-right .index-pro-card:nth-child(2) {

    transition-delay: .7s;

}

.index-pro-right .index-pro-card:nth-child(3) {

    transition-delay: .85s;

}

/*--- Center Transition ---*/

.index-pro-circle,

.index-pro-main-image,

.index-pro-cloud,

.index-pro-server,

.index-pro-security {

    transition: .25s linear;

    will-change: transform;

}

/*--- Icon Glow ---*/

.index-pro-icon {

    position: relative;

    overflow: hidden;

}

.index-pro-icon::after {

    content: "";

    position: absolute;

    inset: 0;

    background: radial-gradient(circle,
            rgba(223, 255, 69, .35),
            transparent 70%);

    opacity: 0;

    transition: .35s;

}

.index-pro-card:hover .index-pro-icon::after {

    opacity: 1;

}

/*--- Card Shine ---*/

.index-pro-card {

    overflow: hidden;

}

.index-pro-card::after {

    content: "";

    position: absolute;

    top: -100%;

    left: -120%;

    width: 60%;

    height: 300%;

    background: rgba(255, 255, 255, .08);

    transform: rotate(25deg);

    transition: .7s;

}

.index-pro-card:hover::after {

    left: 150%;

}

/*--- Our Process Section End ---*/

/*--- Tech We USe ---*/

.index-tech-section {
    position: relative;
    padding: 120px 0;
    background: #08111F;
    overflow: hidden;
}

.index-tech-section::before {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    border-radius: 50%;
    background: #2563EB;
    filter: blur(180px);
    opacity: .12;
    top: -150px;
    left: -150px;
}

.index-tech-section::after {
    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    border-radius: 50%;
    background: #7C3AED;
    filter: blur(180px);
    opacity: .12;
    bottom: -150px;
    right: -150px;
}

/*--- Heading ---*/

.index-tech-heading {
    margin-bottom: 70px;
}

.index-tech-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    border-radius: 50px;
    background: rgba(223, 255, 69, .08);
    color: #DFFF45;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.index-tech-subtitle i {
    font-size: 18px;
}

.index-tech-title {
    margin-top: 25px;
    font-size: clamp(2.6rem, 5vw, 4rem);
    font-weight: 800;
    line-height: 1.15;
    color: #fff;
}

.index-tech-title span {
    display: block;
    color: #60A5FA;
}

.index-tech-description {
    max-width: 760px;
    margin: 25px auto 0;
    color: #BFC6D8;
    line-height: 1.9;
    font-size: 17px;
}

/*--- Cards ---*/

.index-tech-card {

    position: relative;

    padding: 40px 30px;

    text-align: center;

    border-radius: 24px;

    background: rgba(255, 255, 255, .04);

    backdrop-filter: blur(18px);

    border: 1px solid rgba(255, 255, 255, .08);

    overflow: hidden;

    transition: .4s;

    height: 100%;

}

.index-tech-card::before {

    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(135deg, #2563EB, #7C3AED);

    opacity: 0;

    transition: .4s;

}

.index-tech-card>* {

    position: relative;

    z-index: 2;

}

.index-tech-card:hover {

    transform: translateY(-15px);

    border-color: rgba(96, 165, 250, .35);

    box-shadow: 0 30px 60px rgba(0, 0, 0, .25);

}

.index-tech-card:hover::before {

    opacity: .08;

}

/*--- Logo ---*/

.index-tech-logo {

    width: 95px;

    height: 95px;

    margin: auto;

    border-radius: 22px;

    display: flex;

    justify-content: center;

    align-items: center;

    background: rgba(223, 255, 69, .08);

    transition: .35s;

}

.index-tech-logo img {

    width: 55px;

    transition: .35s;

}

.index-tech-card:hover .index-tech-logo {

    background: #DFFF45;

    transform: rotate(-8deg);

}

.index-tech-card:hover .index-tech-logo img {

    transform: scale(1.15);

}

/*--- Text ---*/

.index-tech-card h4 {

    margin-top: 28px;

    color: #fff;

    font-size: 24px;

    font-weight: 700;

}

.index-tech-card span {

    display: inline-block;

    margin-top: 14px;

    padding: 8px 18px;

    border-radius: 50px;

    background: rgba(96, 165, 250, .12);

    color: #60A5FA;

    font-size: 13px;

    font-weight: 600;

    letter-spacing: 1px;

}

/*--- Hover Border Glow ---*/

.index-tech-card::after {

    content: "";

    position: absolute;

    inset: -2px;

    border-radius: 24px;

    background: linear-gradient(135deg,
            rgba(37, 99, 235, .45),
            rgba(124, 58, 237, .45),
            rgba(223, 255, 69, .30));

    filter: blur(18px);

    opacity: 0;

    transition: .4s;

    z-index: -1;

}

.index-tech-card:hover::after {

    opacity: .45;

}

/*--- Responsive ---*/

@media(max-width:1200px) {

    .index-tech-card {
        padding: 35px 25px;
    }

    .index-tech-title {
        font-size: 48px;
    }

}

@media(max-width:991px) {

    .index-tech-section {
        padding: 90px 0;
    }

    .index-tech-heading {
        margin-bottom: 50px;
    }

    .index-tech-title {
        font-size: 42px;
    }

    .index-tech-logo {
        width: 85px;
        height: 85px;
    }

    .index-tech-logo img {
        width: 50px;
    }

}

@media(max-width:767px) {

    .index-tech-section {
        padding: 70px 0;
    }

    .index-tech-title {
        font-size: 34px;
    }

    .index-tech-description {
        font-size: 15px;
    }

    .index-tech-card {
        padding: 30px 20px;
    }

    .index-tech-card h4 {
        font-size: 22px;
    }

    .index-tech-logo {
        width: 75px;
        height: 75px;
    }

    .index-tech-logo img {
        width: 45px;
    }

}

@media(max-width:575px) {

    .index-tech-title {
        font-size: 30px;
    }

    .index-tech-description {
        font-size: 14px;
    }

    .index-tech-card {
        border-radius: 20px;
    }

    .index-tech-card h4 {
        font-size: 20px;
    }

    .index-tech-card span {
        font-size: 12px;
    }

}

/*--- Reveal Animation ---*/

.index-tech-hidden {

    opacity: 0;

    transform: translateY(80px);

    transition: all .9s ease;

}

.index-tech-show {

    opacity: 1;

    transform: translateY(0);

}

/*--- Sequential Delay ---*/

.index-tech-card:nth-child(1) {
    transition-delay: .05s;
}

.index-tech-card:nth-child(2) {
    transition-delay: .10s;
}

.index-tech-card:nth-child(3) {
    transition-delay: .15s;
}

.index-tech-card:nth-child(4) {
    transition-delay: .20s;
}

.index-tech-card:nth-child(5) {
    transition-delay: .25s;
}

.index-tech-card:nth-child(6) {
    transition-delay: .30s;
}

.index-tech-card:nth-child(7) {
    transition-delay: .35s;
}

.index-tech-card:nth-child(8) {
    transition-delay: .40s;
}

.index-tech-card:nth-child(9) {
    transition-delay: .45s;
}

.index-tech-card:nth-child(10) {
    transition-delay: .50s;
}

.index-tech-card:nth-child(11) {
    transition-delay: .55s;
}

.index-tech-card:nth-child(12) {
    transition-delay: .60s;
}

/*--- Mouse Spotlight ---*/

.index-tech-card {

    position: relative;

}

.index-tech-card::after {

    content: "";

    position: absolute;

    inset: 0;

    border-radius: 24px;

    background: radial-gradient(circle at var(--x) var(--y), rgba(255, 255, 255, .15), transparent 45%);

    opacity: 0;

    transition: .25s;

    pointer-events: none;

}

.index-tech-card:hover::after {

    opacity: 1;

}

/*--- Logo Glow ---*/

.index-tech-logo {

    position: relative;

    overflow: hidden;

}

.index-tech-logo::before {

    content: "";

    position: absolute;

    width: 130%;

    height: 130%;

    background: radial-gradient(circle, rgba(223, 255, 69, .35), transparent 70%);

    opacity: 0;

    transition: .35s;

}

.index-tech-card:hover .index-tech-logo::before {

    opacity: 1;

}

/*--- Smooth Performance ---*/

.index-tech-card,

.index-tech-logo,

.index-tech-logo img {

    will-change: transform;

}

/*--- Hover Image Rotate ---*/

.index-tech-card:hover img {

    transform: rotate(-8deg) scale(1.12);

}

/*--- Alternate Floating Layout ---*/

@media(min-width:992px) {

    .index-tech-card:nth-child(even) {
        margin-top: 35px;

    }

}

/*--- Tech We Use End ---*/

/*--- Testimonial Section Strat ---*/

.index-test-section {

    position: relative;

    padding: 120px 0;

    overflow: hidden;

    background:
        radial-gradient(circle at top, #2563EB25, transparent 35%),
        radial-gradient(circle at right, #7C3AED20, transparent 40%),
        #08111F;

}

/*--- Background Grid ---*/

.index-test-section::before {

    content: "";

    position: absolute;

    inset: 0;

    background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);

    background-size: 60px 60px;

    mask-image: linear-gradient(to bottom,
            rgba(255, 255, 255, .9),
            transparent);

    pointer-events: none;

}

/*--- Glow ---*/

.index-test-section::after {

    content: "";

    position: absolute;

    width: 600px;

    height: 600px;

    background: #2563EB;

    border-radius: 50%;

    filter: blur(220px);

    opacity: .12;

    top: -250px;

    left: 50%;

    transform: translateX(-50%);

}

/*--- Heading ---*/

.index-test-heading {

    position: relative;

    z-index: 2;

    margin-bottom: 70px;

}

.index-test-subtitle {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: #DFFF45;

    font-size: 14px;

    font-weight: 600;

    letter-spacing: 3px;

    text-transform: uppercase;

}

.index-test-subtitle i {

    font-size: 18px;

}

.index-test-title {

    margin-top: 20px;

    color: #fff;

    font-size: clamp(3rem, 6vw, 5rem);

    font-weight: 800;

    line-height: 1.1;

}

.index-test-title span {

    background: linear-gradient(90deg, #2563EB, #60A5FA, #DFFF45);

    background-clip: none;

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}

.index-test-description {

    max-width: 700px;

    margin: 25px auto 0;

    color: #CBD5E1;

    line-height: 1.9;

    font-size: 17px;

}

/*--- Cards ---*/

.index-test-card {

    position: relative;

    height: 100%;

    padding: 38px;

    border-radius: 28px;

    background: rgba(255, 255, 255, .04);

    border: 1px solid rgba(255, 255, 255, .08);

    backdrop-filter: blur(18px);

    overflow: hidden;

    transition: .45s;

}

.index-test-card::before {

    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(135deg, rgba(37, 99, 235, .20), rgba(124, 58, 237, .15), rgba(223, 255, 69, .08));

    opacity: 0;

    transition: .45s;

}

.index-test-card>* {

    position: relative;

    z-index: 2;

}

.index-test-card:hover {

    transform: translateY(-15px);

    border-color: #2563EB;

    box-shadow: 0 30px 60px rgba(0, 0, 0, .35);

}

.index-test-card:hover::before {

    opacity: 1;

}

/*--- Center Card ---*/

.index-test-active {

    border: 1px solid rgba(96, 165, 250, .4);

    background: linear-gradient(180deg, rgba(37, 99, 235, .12), rgba(255, 255, 255, .04));

}

.index-test-active::after {

    content: "";

    position: absolute;

    inset: -2px;

    border-radius: 28px;

    background: linear-gradient(135deg, #2563EB, #60A5FA, #DFFF45);

    filter: blur(25px);

    opacity: .35;

    z-index: -1;

}

/*--- Profile ---*/

.index-test-profile {

    display: flex;

    align-items: center;

    gap: 18px;

    margin-bottom: 28px;

}

.index-test-profile img {

    width: 82px;

    height: 82px;

    object-fit: cover;

    border-radius: 50%;

    border: 3px solid rgba(96, 165, 250, .35);

}

.index-test-profile h4 {

    color: #fff;

    font-size: 24px;

    margin-bottom: 5px;

    font-weight: 700;

}

.index-test-profile span {

    color: #60A5FA;

    font-size: 15px;

}

/*--- Stars ---*/

.index-test-stars {

    display: flex;

    gap: 8px;

    margin-bottom: 22px;

}

.index-test-stars i {

    color: #FFD54A;

    font-size: 18px;

}

/*--- Divider ---*/

.index-test-divider {

    width: 100%;

    height: 1px;

    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .15), transparent);

    margin-bottom: 25px;

}

/*--- Text ---*/

.index-test-card p {

    color: #CBD5E1;

    line-height: 1.9;

    font-size: 16px;

    margin-bottom: 35px;

}

/*--- Quote ---*/

.index-test-quote {

    position: absolute;

    bottom: 20px;

    right: 25px;

}

.index-test-quote i {

    font-size: 70px;

    color: rgba(96, 165, 250, .18);

}

/*--- Responsive ---*/

@media(max-width:991px) {

    .index-test-section {
        padding: 90px 0;

    }

    .index-test-heading {
        margin-bottom: 50px;

    }

    .index-test-card {
        padding: 30px;

    }

    .index-test-title {
        font-size: 52px;

    }

}

@media(max-width:767px) {

    .index-test-section {
        padding: 70px 0;

    }

    .index-test-title {
        font-size: 38px;

    }

    .index-test-description {
        font-size: 15px;

    }

    .index-test-profile {
        flex-direction: column;
        text-align: center;

    }

    .index-test-card {
        text-align: center;

    }

    .index-test-stars {
        justify-content: center;

    }

    .index-test-quote {
        right: 20px;

    }

}

/*--- Reveal Animation ---*/

.index-test-hidden {

    opacity: 0;

    transform: translateY(80px);

    transition: .9s;

}

.index-test-show {

    opacity: 1;

    transform: translateY(0);

}

/*--- Sequential Delay ---*/

.index-test-card:nth-child(1) {

    transition-delay: .15s;

}

.index-test-card:nth-child(2) {

    transition-delay: .3s;

}

.index-test-card:nth-child(3) {

    transition-delay: .45s;

}

/*--- Mouse Spotlight ---*/

.index-test-card {

    position: relative;

}

.index-test-card::after {

    content: "";

    position: absolute;

    inset: 0;

    border-radius: 28px;

    background: radial-gradient(circle at var(--x) var(--y), rgba(255, 255, 255, .12), transparent 45%);

    opacity: 0;

    transition: .3s;

}

.index-test-card:hover::after {

    opacity: 1;

}

/*--- Quote Glow ---*/

.index-test-quote {

    transition: .35s;

}

.index-test-card:hover .index-test-quote {

    transform: scale(1.15);

}

.index-test-card:hover .index-test-quote i {

    color: #2563EB;

}

/*--- Profile Hover ---*/

.index-test-profile img {

    transition: .35s;

}

.index-test-card:hover img {

    transform: scale(1.08);

    border-color: #DFFF45;

    box-shadow: 0 0 35px rgba(223, 255, 69, .35);

}

/*--- Stars ---*/

.index-test-stars i {

    transition: .3s;

}

.index-test-card:hover .index-test-stars i {

    transform: translateY(-3px);

    color: #FFD54A;

}

/*--- Performance ---*/

.index-test-card,
.index-test-profile img,
.index-test-quote,
.index-test-stars i {

    will-change: transform;

}

/*--- Testimonial Section End ---*/

/*--- Cta Section Strat ---*/

.index-cta-section {

    position: relative;

    padding: 120px 0;

    background: #08111F;

    overflow: hidden;

}

/*--- Background Glow ---*/

.index-cta-section::before {

    content: "";

    position: absolute;

    width: 650px;

    height: 650px;

    background: #2563EB;

    filter: blur(220px);

    border-radius: 50%;

    opacity: .15;

    top: -250px;

    left: -250px;

}

.index-cta-section::after {

    content: "";

    position: absolute;

    width: 500px;

    height: 500px;

    background: #7C3AED;

    filter: blur(220px);

    border-radius: 50%;

    opacity: .15;

    bottom: -200px;

    right: -200px;

}

/*--- Wrapper ---*/

.index-cta-wrapper {

    position: relative;

    padding: 80px;

    border-radius: 40px;

    overflow: hidden;

    background: linear-gradient(135deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .03));

    backdrop-filter: blur(20px);

    border: 1px solid rgba(255, 255, 255, .08);

    z-index: 2;

}

/*--- Glass Overlay ---*/

.index-cta-wrapper::before {

    content: "";

    position: absolute;

    inset: 0;

    background: radial-gradient(circle at top right, rgba(37, 99, 235, .25), transparent 45%), radial-gradient(circle at bottom left, rgba(124, 58, 237, .18), transparent 45%);

}

/*--- Content ---*/

.index-cta-content {

    position: relative;

    z-index: 5;

}

.index-cta-subtitle {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding: 10px 22px;

    border-radius: 50px;

    background: rgba(223, 255, 69, .08);

    color: #DFFF45;

    font-size: 14px;

    font-weight: 600;

    letter-spacing: 2px;

    text-transform: uppercase;

}

.index-cta-subtitle i {

    font-size: 18px;

}

.index-cta-title {

    margin-top: 25px;

    color: #fff;

    font-size: clamp(3rem, 6vw, 4.8rem);

    line-height: 1.1;

    font-weight: 800;

}

.index-cta-title span {

    display: block;

    background: linear-gradient(90deg, #2563EB, #60A5FA, #DFFF45);

    -webkit-background-clip: text;
    background-clip: none;

    -webkit-text-fill-color: transparent;

}

.index-cta-description {

    margin-top: 30px;

    color: #CBD5E1;

    line-height: 1.9;

    font-size: 17px;

    max-width: 620px;

}

/*--- Buttons ---*/

.index-cta-buttons {

    display: flex;

    gap: 18px;

    flex-wrap: wrap;

    margin-top: 40px;

}

.index-cta-btn-primary {

    background: #DFFF45;

    color: #111;

    padding: 17px 34px;

    border-radius: 60px;

    font-weight: 700;

    transition: .35s;

}

.index-cta-btn-primary:hover {

    background: #2563EB;

    color: #fff;

    transform: translateY(-6px);

}

.index-cta-btn-outline {

    border: 1px solid rgba(255, 255, 255, .12);

    background: rgba(255, 255, 255, .04);

    color: #fff;

    padding: 17px 34px;

    border-radius: 60px;

    font-weight: 700;

    transition: .35s;

}

.index-cta-btn-outline:hover {

    background: #fff;

    color: #111;

    transform: translateY(-6px);

}

.index-cta-buttons i {

    margin-right: 10px;

}

/*--- Stats ---*/

.index-cta-stats {

    margin-top: 55px;

}

.index-cta-stat {

    text-align: center;

}

.index-cta-stat h3 {

    color: #DFFF45;

    font-size: 42px;

    font-weight: 800;

    margin-bottom: 5px;

}

.index-cta-stat span {

    color: #CBD5E1;

    font-size: 15px;

}

/*--- Image ---*/

.index-cta-image {

    position: relative;

    display: flex;

    justify-content: center;

    align-items: center;

    min-height: 500px;

}

.index-cta-circle {

    position: absolute;

    width: 350px;

    height: 350px;

    border-radius: 50%;

    background: linear-gradient(135deg, #2563EB, #7C3AED);

    filter: blur(50px);

    opacity: .25;

}

.index-cta-main-image {

    position: relative;

    width: 360px;

    z-index: 5;

    filter: drop-shadow(0 40px 60px rgba(0, 0, 0, .35));

}

/*--- Floating Images ---*/

.index-cta-cloud {

    position: absolute;

    width: 95px;

    top: 40px;

    right: 280px;

    z-index: 8;

}

.index-cta-server {

    position: absolute;

    width: 120px;

    right: 40px;

    bottom: 70px;

    z-index: 8;

}

.index-cta-security {

    position: absolute;

    width: 95px;

    left: 55%;

    bottom: 70px;

    z-index: 8;

}

/*--- Responsive ---*/

@media(max-width:991px) {

    .index-cta-wrapper {
        padding: 60px 40px;

    }

    .index-cta-image {
        margin-top: 60px;
        min-height: 350px;

    }

    .index-cta-main-image {
        width: 300px;

    }

    .index-cta-cloud {
        right: 150px;

    }

    .index-cta-security {
        left: 20%;

    }

}

@media(max-width:767px) {

    .index-cta-section {
        padding: 80px 0;

    }

    .index-cta-wrapper {
        padding: 45px 25px;

    }

    .index-cta-title {
        font-size: 38px;

    }

    .index-cta-description {
        font-size: 15px;

    }

    .index-cta-buttons {
        flex-direction: column;

    }

    .index-cta-btn-primary,

    .index-cta-btn-outline {
        width: 100%;
        text-align: center;

    }

    .index-cta-image {
        min-height: 260px;

    }

    .index-cta-main-image {
        width: 220px;

    }

    .index-cta-circle {
        width: 220px;
        height: 220px;

    }

    .index-cta-cloud {
        width: 55px;
        right: 40px;
        top: 10px;

    }

    .index-cta-server {
        width: 70px;
        right: 0;
        bottom: 20px;

    }

    .index-cta-security {
        width: 55px;
        left: 5%;
        bottom: 20px;

    }

    .index-cta-stat h3 {
        font-size: 28px;

    }

}

/*--- Reveal Animation ---*/

.index-cta-hidden {

    opacity: 0;

    transform: translateY(80px);

    transition: .9s;

}

.index-cta-show {

    opacity: 1;

    transform: translateY(0);

}

/*--- Image ---*/

.index-cta-main-image {

    transition: .25s linear;

    will-change: transform;

}

.index-cta-circle,

.index-cta-cloud,

.index-cta-server,

.index-cta-security {

    transition: .25s linear;

    will-change: transform;

}

/*--- Button Hover ---*/

.index-cta-btn-primary,

.index-cta-btn-outline {

    position: relative;

    overflow: hidden;

}

.index-cta-btn-primary::before,

.index-cta-btn-outline::before {

    content: "";

    position: absolute;

    top: -100%;

    left: -120%;

    width: 60%;

    height: 300%;

    background: rgba(255, 255, 255, .25);

    transform: rotate(25deg);

    transition: .7s;

}

.index-cta-btn-primary:hover::before,

.index-cta-btn-outline:hover::before {

    left: 150%;

}

/*--- Stats Hover ---*/

.index-cta-stat {

    transition: .35s;

}

.index-cta-stat:hover {

    transform: translateY(-8px);

}

.index-cta-stat:hover h3 {

    color: #60A5FA;

}

/*--- Image Floating ---*/

.index-cta-main-image {

    animation: indexCTAFloat 5s ease-in-out infinite;

}

@keyframes indexCTAFloat {

    0%,
    100% {
        transform: translateY(0px);

    }

    50% {
        transform: translateY(-15px);

    }

}

/*--- Circle Pulse ---*/

.index-cta-circle {

    animation: indexPulse 5s linear infinite;

}

@keyframes indexPulse {

    0% {
        transform: scale(.95);

    }

    50% {
        transform: scale(1.05);

    }

    100% {
        transform: scale(.95);

    }

}

/*--- CTA Section End ---*/

/*---- Footer Strat ---*/

.index-footer-section {

    position: relative;
    padding: 120px 0 40px;
    background: #08111F;
    overflow: hidden;

}

/*--- Background Glow ----*/

.index-footer-section::before {

    content: "";
    position: absolute;
    width: 550px;
    height: 550px;
    background: #2563EB;
    border-radius: 50%;
    filter: blur(220px);
    opacity: .12;
    top: -220px;
    left: -220px;

}

.index-footer-section::after {

    content: "";
    position: absolute;
    width: 450px;
    height: 450px;
    background: #7C3AED;
    border-radius: 50%;
    filter: blur(200px);
    opacity: .10;
    right: -180px;
    bottom: -180px;

}

/*--- Wrapper ---*/

.index-footer-wrapper {

    position: relative;
    z-index: 2;
    background: rgba(255, 255, 255, .04);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 35px;
    padding: 70px;
    overflow: hidden;

}

.index-footer-wrapper::before {

    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at top right,
            rgba(37, 99, 235, .18),
            transparent 45%),
        radial-gradient(circle at bottom left,
            rgba(124, 58, 237, .18),
            transparent 45%);

}

/*--- Logo ---*/

.index-footer-logo {

    display: inline-block;
    margin-bottom: 25px;

}

.index-footer-logo img {
    width: 190px;
}

/*--- Description ---*/

.index-footer-description {

    color: #CBD5E1;
    line-height: 1.9;
    font-size: 15px;
    margin-bottom: 35px;

}

/*--- Titles ---*/

.index-footer-links h4,
.index-footer-contact h4 {

    color: #fff;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 30px;
    position: relative;

}

.index-footer-links h4::after,
.index-footer-contact h4::after {

    content: "";
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 55px;
    height: 3px;
    border-radius: 20px;
    background: #DFFF45;

}

/*--- Links ---*/

.index-footer-links ul {

    padding: 0;
    margin: 0;
    list-style: none;

}

.index-footer-links li {
    margin-bottom: 18px;
}

.index-footer-links a {

    display: flex;
    align-items: center;
    gap: 12px;
    color: #CBD5E1;
    text-decoration: none;
    transition: .35s;

}

.index-footer-links a i {

    color: #2563EB;
    transition: .35s;

}

.index-footer-links a:hover {

    color: #fff;
    transform: translateX(8px);

}

.index-footer-links a:hover i {
    color: #DFFF45;
}

/*--- Social ---*/

.index-footer-social {

    display: flex;
    gap: 15px;

}

.index-footer-social a {

    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .08);
    color: #fff;
    transition: .35s;
    text-decoration: none;

}

.index-footer-social a:hover {

    background: #2563EB;
    transform: translateY(-6px);
    color: #fff;
    box-shadow: 0 15px 25px rgba(37, 99, 235, .35);

}

/*--- Contact ---*/

.index-footer-contact-item {

    display: flex;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 28px;

}

.index-footer-contact-item i {

    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(37, 99, 235, .12);
    color: #60A5FA;
    font-size: 18px;

}

.index-footer-contact-item h6 {

    color: #fff;
    margin-bottom: 6px;
    font-size: 18px;

}

.index-footer-contact-item span {

    color: #CBD5E1;
    line-height: 1.7;
    font-size: 15px;

}

/*--- Bottom ---*/

.index-footer-bottom {

    margin-top: 60px;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, .08);

}

.index-footer-bottom p {

    margin: 0;
    color: #CBD5E1;

}

.index-footer-bottom strong {
    color: #fff;
}

.index-footer-bottom-links {

    display: flex;
    justify-content: flex-end;
    gap: 30px;
    flex-wrap: wrap;

}

.index-footer-bottom-links a {

    color: #CBD5E1;
    text-decoration: none;
    transition: .35s;

}

.index-footer-bottom-links a:hover {
    color: #DFFF45;
}

/*--- Top Button ---*/

.index-footer-top {

    position: fixed;
    right: 35px;
    bottom: 35px;
    width: 60px;
    height: 60px;
    border: none;
    border-radius: 50%;
    background: linear-gradient(135deg, #2563EB, #3B82F6);
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    z-index: 999;
    transition: .35s;
    display: flex;
    justify-content: center;
    align-items: center;
}

.index-footer-top:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 35px rgba(37, 99, 235, .35);

}

/*--- Responsive ---*/

@media(max-width:991px) {

    .index-footer-wrapper {
        padding: 50px 35px;
    }

    .index-footer-bottom-links {
        justify-content: flex-start;
        margin-top: 20px;
    }

}

@media(max-width:767px) {

    .index-footer-section {
        padding: 80px 0 30px;
    }

    .index-footer-wrapper {
        padding: 35px 25px;
        border-radius: 25px;
    }

    .index-footer-logo img {
        width: 170px;
    }

  



    .index-footer-bottom {
        text-align: center;
    }

    .index-footer-bottom-links {
        justify-content: center;
    }

}


/*--- Reveal Animation ---*/

.index-footer-hidden{

    opacity:0;
    transform:translateY(60px);
    transition:.8s ease;

}

.index-footer-show{

    opacity:1;
    transform:translateY(0);
}

/*--- Sequential Delay ---*/

.index-footer-company{
    transition-delay:.15s;
}

.index-footer-links:nth-of-type(1){
    transition-delay:.3s;
}

.index-footer-links:nth-of-type(2){
    transition-delay:.45s;
}

.index-footer-contact{
    transition-delay:.6s;
}

/*--- Logo Hover ---*/

.index-footer-logo img{
    transition:.4s;
}

.index-footer-logo:hover img{
    transform:scale(1.05);
}

/*--- Description ---*/

.index-footer-description{
    transition:.35s;
}

.index-footer-company:hover .index-footer-description{
    color:#fff;
}

/*--- Social Icons ---*/

.index-footer-social a{

    overflow:hidden;
    position:relative;
}

.index-footer-social a::before{

    content:"";
    position:absolute;
    width:140%;
    height:140%;
    background:radial-gradient(circle,
    rgba(255,255,255,.25),
    transparent 70%);
    opacity:0;
    transition:.35s;

}

.index-footer-social a:hover::before{
    opacity:1;
}

/*--- Contact Hover ---*/

.index-footer-contact-item{
    transition:.35s;
}

.index-footer-contact-item:hover{
    transform:translateX(8px);
}

.index-footer-contact-item:hover i{

    background:#2563EB;
    color:#fff;

}

/*--- Scroll To Top ---*/

.index-footer-top{

    opacity:0;
    visibility:hidden;
    transform:translateY(30px);

}

.index-footer-top-show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);

}

/*--- Bottom Links ---*/

.index-footer-bottom-links a{
    position:relative;
}

.index-footer-bottom-links a::after{

    content:"";
    position:absolute;
    left:0;
    bottom:-4px;
    width:0;
    height:2px;
    background:#DFFF45;
    transition:.35s;

}

.index-footer-bottom-links a:hover::after{
    width:100%;
}

/*--- Animated Border ----*/

.index-footer-wrapper{
    position:relative;
}


.index-footer-wrapper::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:35px;
    border:1px solid rgba(255,255,255,.08);
    background:linear-gradient(
        135deg,
        rgba(37,99,235,.15),
        rgba(124,58,237,.10),
        rgba(223,255,69,.08)
    );
    opacity:.6;
    pointer-events:none;

}


.index-footer-section::before{
    animation:indexFooterGlow 10s ease-in-out infinite alternate;
}

@keyframes indexFooterGlow{
    from{
        transform:translateY(0) scale(1);
    }
    to{
        transform:translateY(30px) scale(1.15);
    }

}
/*--- Footer End ---*/