/*==========================================================
 AKTSMART TECHNOLOGIES
 STYLE.CSS V2.0
==========================================================*/


/*==========================================================
 RESET
==========================================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{

    scroll-behavior:smooth;

}

body{

    font-family:'Poppins',sans-serif;

    background:#08111f;

    color:#ffffff;

    overflow-x:hidden;

    line-height:1.7;

}

img{

    max-width:100%;

    display:block;

}

a{

    text-decoration:none;

}

ul{

    list-style:none;

}



/*==========================================================
 CONTAINER
==========================================================*/

.container{

    max-width:1320px;

}



/*==========================================================
 SECTION
==========================================================*/

section{

    position:relative;

    padding:110px 0;

}



/*==========================================================
 SECTION TITLE
==========================================================*/

.section-heading{

    margin-bottom:70px;

}

.section-subtitle{

    display:inline-block;

    color:#49b8ff;

    font-size:15px;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

    margin-bottom:18px;

}

.section-heading h2{

    font-size:52px;

    font-weight:700;

    color:#ffffff;

    margin-bottom:20px;

}

.section-heading p{

    color:#b8c7d9;

    max-width:900px;

    margin:auto;

    font-size:20px;

}



/*==========================================================
 NAVBAR
==========================================================*/

.navbar{

    background:#111827;

    transition:.35s;

    padding:18px 0;

    z-index:9999;

}

.navbar-brand{

    color:#ffffff !important;

    font-size:32px;

    font-weight:700;

}

.navbar-nav .nav-link{

    color:#ffffff !important;

    font-size:17px;

    font-weight:500;

    margin-left:18px;

    transition:.35s;

}

.navbar-nav .nav-link:hover{

    color:#4db7ff !important;

}

.dropdown-menu{

    border:none;

    border-radius:16px;

    background:#172133;

    padding:14px;

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

}

.dropdown-item{

    color:#ffffff;

    padding:12px 18px;

    border-radius:10px;

    transition:.30s;

}

.dropdown-item:hover{

    background:#249dff;

    color:#ffffff;

}



/*==========================================================
 HERO
==========================================================*/

.hero{

    min-height:100vh;

    background:url("../images/herov3.png");

    background-size:cover;

    background-position:center center;

    display:flex;

    align-items:center;

}

.hero::before{

    content:"";

    position:absolute;

    inset:0;

    background:rgba(6,15,28,.48);

}

.hero .container{

    position:relative;

    z-index:2;

}

.hero-content{

    max-width:720px;

}

.hero-tag{

    display:inline-block;

    padding:10px 24px;

    border-radius:40px;

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

    backdrop-filter:blur(10px);

    color:#49b8ff;

    font-weight:600;

    letter-spacing:1px;

    margin-bottom:28px;

}

.hero h1{

    font-size:74px;

    font-weight:800;

    line-height:1.08;

    margin-bottom:28px;

}

.hero p{

    color:#d8e4f1;

    font-size:23px;

    margin-bottom:42px;

}



/*==========================================================
 HERO BUTTONS
==========================================================*/

.hero-buttons{

    display:flex;

    gap:18px;

    flex-wrap:wrap;

}

.btn-primary-custom{

    background:#249dff;

    color:#ffffff;

    padding:17px 38px;

    border-radius:50px;

    font-weight:600;

    transition:.35s;

}

.btn-primary-custom:hover{

    background:#0b89f3;

    transform:translateY(-5px);

    color:#ffffff;

}

.btn-outline-custom{

    border:2px solid #ffffff;

    color:#ffffff;

    padding:15px 36px;

    border-radius:50px;

    font-weight:600;

    transition:.35s;

}

.btn-outline-custom:hover{

    background:#ffffff;

    color:#08111f;

}



/*==========================================================
 SCROLL INDICATOR
==========================================================*/

.scroll-down{

    margin-top:70px;

    font-size:34px;

    color:#ffffff;

    animation:bounce 2s infinite;

}

@keyframes bounce{

0%,20%,50%,80%,100%{

transform:translateY(0);

}

40%{

transform:translateY(-10px);

}

60%{

transform:translateY(-5px);

}

}
/*==========================================================
 OUR SOLUTIONS
==========================================================*/

.solutions-section{

    background:#08111f;

}

.solution-card{

    display:block;

    background:#121d31;

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

    border-radius:20px;

    padding:45px 35px;

    height:100%;

    transition:.35s;

    overflow:hidden;

    position:relative;

}

.solution-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:#2fa8ff;

    transform:scaleX(0);

    transition:.35s;

}

.solution-card:hover::before{

    transform:scaleX(1);

}

.solution-card:hover{

    transform:translateY(-12px);

    border-color:#2fa8ff;

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

}

.solution-icon{

    width:90px;

    height:90px;

    border-radius:50%;

    background:rgba(47,168,255,.12);

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:30px;

    transition:.35s;

}

.solution-card:hover .solution-icon{

    background:#2fa8ff;

}

.solution-icon i{

    font-size:42px;

    color:#2fa8ff;

    transition:.35s;

}

.solution-card:hover .solution-icon i{

    color:#fff;

    transform:scale(1.15);

}

.solution-card h3{

    color:#fff;

    font-size:30px;

    margin-bottom:18px;

    font-weight:700;

}

.solution-card p{

    color:#c7d3e2;

    line-height:1.8;

    min-height:130px;

}

.solution-card span{

    color:#2fa8ff;

    font-weight:600;

    display:inline-flex;

    align-items:center;

    gap:8px;

    transition:.35s;

}

.solution-card:hover span{

    transform:translateX(8px);

}



/*==========================================================
 INDUSTRIES
==========================================================*/

.industry-section{

    background:#0c1626;

}

.industry-card{

    background:#162338;

    border-radius:18px;

    text-align:center;

    padding:45px 25px;

    transition:.35s;

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

}

.industry-card:hover{

    transform:translateY(-10px);

    background:#1d2e49;

    border-color:#2fa8ff;

}

.industry-card i{

    font-size:55px;

    color:#2fa8ff;

    margin-bottom:25px;

}

.industry-card h4{

    color:#fff;

    font-size:24px;

}



/*==========================================================
 ACHIEVEMENTS
==========================================================*/

.stats-section{

    background:#08111f;

}

.stat-box{

    padding:35px;

}

.stat-box h2{

    color:#2fa8ff;

    font-size:56px;

    font-weight:700;

    margin-bottom:12px;

}

.stat-box p{

    color:#d7e3ef;

    font-size:20px;

}



/*==========================================================
 SECTION DIVIDER
==========================================================*/

.section-divider{

    width:80px;

    height:4px;

    background:#2fa8ff;

    margin:30px auto;

    border-radius:5px;

}



/*==========================================================
 HOVER GLOW
==========================================================*/

.glow{

    transition:.35s;

}

.glow:hover{

    box-shadow:0 0 40px rgba(47,168,255,.35);

}



/*==========================================================
 ICON ANIMATION
==========================================================*/

.solution-card:hover i,

.industry-card:hover i{

    animation:iconFloat .7s ease;

}

@keyframes iconFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}



/*==========================================================
 SECTION SPACING
==========================================================*/

.solutions-section{

    padding-top:120px;

    padding-bottom:120px;

}

.industry-section{

    padding-top:120px;

    padding-bottom:120px;

}

.stats-section{

    padding-top:90px;

    padding-bottom:90px;

}



/*==========================================================
 BUTTON INSIDE CARD
==========================================================*/

.solution-card span i{

    transition:.35s;

}

.solution-card:hover span i{

    transform:translateX(5px);

}



/*==========================================================
 CARD BORDER EFFECT
==========================================================*/

.solution-card{

    overflow:hidden;

}

.solution-card::after{

    content:"";

    position:absolute;

    bottom:-60px;

    right:-60px;

    width:140px;

    height:140px;

    background:rgba(47,168,255,.05);

    border-radius:50%;

    transition:.4s;

}

.solution-card:hover::after{

    transform:scale(1.5);

}
/*==========================================================
 OUR SOLUTIONS
==========================================================*/

.solutions-section{

    background:#08111f;

}

.solution-card{

    display:block;

    background:#121d31;

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

    border-radius:20px;

    padding:45px 35px;

    height:100%;

    transition:.35s;

    overflow:hidden;

    position:relative;

}

.solution-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:4px;

    background:#2fa8ff;

    transform:scaleX(0);

    transition:.35s;

}

.solution-card:hover::before{

    transform:scaleX(1);

}

.solution-card:hover{

    transform:translateY(-12px);

    border-color:#2fa8ff;

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

}

.solution-icon{

    width:90px;

    height:90px;

    border-radius:50%;

    background:rgba(47,168,255,.12);

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:30px;

    transition:.35s;

}

.solution-card:hover .solution-icon{

    background:#2fa8ff;

}

.solution-icon i{

    font-size:42px;

    color:#2fa8ff;

    transition:.35s;

}

.solution-card:hover .solution-icon i{

    color:#fff;

    transform:scale(1.15);

}

.solution-card h3{

    color:#fff;

    font-size:30px;

    margin-bottom:18px;

    font-weight:700;

}

.solution-card p{

    color:#c7d3e2;

    line-height:1.8;

    min-height:130px;

}

.solution-card span{

    color:#2fa8ff;

    font-weight:600;

    display:inline-flex;

    align-items:center;

    gap:8px;

    transition:.35s;

}

.solution-card:hover span{

    transform:translateX(8px);

}



/*==========================================================
 INDUSTRIES
==========================================================*/

.industry-section{

    background:#0c1626;

}

.industry-card{

    background:#162338;

    border-radius:18px;

    text-align:center;

    padding:45px 25px;

    transition:.35s;

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

}

.industry-card:hover{

    transform:translateY(-10px);

    background:#1d2e49;

    border-color:#2fa8ff;

}

.industry-card i{

    font-size:55px;

    color:#2fa8ff;

    margin-bottom:25px;

}

.industry-card h4{

    color:#fff;

    font-size:24px;

}



/*==========================================================
 ACHIEVEMENTS
==========================================================*/

.stats-section{

    background:#08111f;

}

.stat-box{

    padding:35px;

}

.stat-box h2{

    color:#2fa8ff;

    font-size:56px;

    font-weight:700;

    margin-bottom:12px;

}

.stat-box p{

    color:#d7e3ef;

    font-size:20px;

}



/*==========================================================
 SECTION DIVIDER
==========================================================*/

.section-divider{

    width:80px;

    height:4px;

    background:#2fa8ff;

    margin:30px auto;

    border-radius:5px;

}



/*==========================================================
 HOVER GLOW
==========================================================*/

.glow{

    transition:.35s;

}

.glow:hover{

    box-shadow:0 0 40px rgba(47,168,255,.35);

}



/*==========================================================
 ICON ANIMATION
==========================================================*/

.solution-card:hover i,

.industry-card:hover i{

    animation:iconFloat .7s ease;

}

@keyframes iconFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0);

}

}



/*==========================================================
 SECTION SPACING
==========================================================*/

.solutions-section{

    padding-top:120px;

    padding-bottom:120px;

}

.industry-section{

    padding-top:120px;

    padding-bottom:120px;

}

.stats-section{

    padding-top:90px;

    padding-bottom:90px;

}



/*==========================================================
 BUTTON INSIDE CARD
==========================================================*/

.solution-card span i{

    transition:.35s;

}

.solution-card:hover span i{

    transform:translateX(5px);

}



/*==========================================================
 CARD BORDER EFFECT
==========================================================*/

.solution-card{

    overflow:hidden;

}

.solution-card::after{

    content:"";

    position:absolute;

    bottom:-60px;

    right:-60px;

    width:140px;

    height:140px;

    background:rgba(47,168,255,.05);

    border-radius:50%;

    transition:.4s;

}

.solution-card:hover::after{

    transform:scale(1.5);

}
/*==========================================================
 FEATURED PROJECTS
==========================================================*/

.projects-section{

    background:#0b1524;

}

.project-card{

    background:#162338;

    border-radius:22px;

    overflow:hidden;

    transition:.4s;

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

    height:100%;

}

.project-card:hover{

    transform:translateY(-12px);

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

    border-color:#39a8ff;

}

.project-card img{

    width:100%;

    height:260px;

    object-fit:cover;

    transition:.4s;

}

.project-card:hover img{

    transform:scale(1.08);

}

.project-content{

    padding:30px;

}

.project-content span{

    color:#39a8ff;

    font-size:14px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:1px;

}

.project-content h3{

    color:#ffffff;

    margin:15px 0;

    font-size:28px;

    font-weight:700;

}

.project-content p{

    color:#c5d2df;

    line-height:1.8;

}



/*==========================================================
 WHY CHOOSE US
==========================================================*/

.why-section{

    background:#08111f;

}

.why-section img{

    border-radius:22px;

}

.feature-box{

    display:flex;

    align-items:flex-start;

    gap:20px;

    margin-top:35px;

}

.feature-box i{

    font-size:34px;

    color:#39a8ff;

    margin-top:4px;

}

.feature-box h4{

    color:#ffffff;

    margin-bottom:8px;

    font-size:24px;

}

.feature-box p{

    color:#c7d4e1;

}



/*==========================================================
 TECHNOLOGY PARTNERS
==========================================================*/

.brands-section{

    background:#101b2c;

}

.brand-logo{

    filter:grayscale(100%);

    opacity:.75;

    transition:.35s;

    padding:20px;

    max-height:90px;

    margin:auto;

}

.brand-logo:hover{

    filter:none;

    opacity:1;

    transform:scale(1.12);

}



/*==========================================================
 PROCESS
==========================================================*/

.process-section{

    background:#08111f;

}

.process-box{

    position:relative;

    background:#162338;

    border-radius:18px;

    padding:45px 30px;

    text-align:center;

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

    transition:.35s;

}

.process-box:hover{

    transform:translateY(-10px);

    border-color:#39a8ff;

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

}

.process-number{

    width:70px;

    height:70px;

    border-radius:50%;

    background:#39a8ff;

    color:#ffffff;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:auto;

    margin-bottom:25px;

    font-size:28px;

    font-weight:700;

}

.process-box h4{

    color:#ffffff;

    margin-bottom:15px;

    font-size:26px;

}

.process-box p{

    color:#c8d4e0;

}



/*==========================================================
 IMAGE OVERLAY
==========================================================*/

.project-card{

    position:relative;

}

.project-card::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:120px;

    background:linear-gradient(to top,
    rgba(8,17,31,.95),
    rgba(8,17,31,0));

    pointer-events:none;

}



/*==========================================================
 CARD ANIMATIONS
==========================================================*/

.project-card,
.process-box,
.brand-logo{

    transition:.4s ease;

}



/*==========================================================
 PROCESS LINE
==========================================================*/

@media(min-width:992px){

.process-box::after{

    content:"";

    position:absolute;

    top:35px;

    right:-60px;

    width:120px;

    height:2px;

    background:#39a8ff55;

}

.col-lg-3:last-child .process-box::after{

    display:none;

}

}



/*==========================================================
 SHADOW UTILITIES
==========================================================*/

.shadow-blue{

    box-shadow:0 0 40px rgba(57,168,255,.25);

}



/*==========================================================
 BORDER UTILITIES
==========================================================*/

.border-blue{

    border:1px solid #39a8ff;

}



/*==========================================================
 SECTION SPACING
==========================================================*/

.projects-section,
.why-section,
.brands-section,
.process-section{

    padding-top:120px;

    padding-bottom:120px;

}
footer a{
    color:#ffffff;
    text-decoration:none;
}

footer a:hover{
    color:#2ea8ff;
}