/*=====================================
  SMART TECH ZONE
  STYLE.CSS - PART 1
======================================*/

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

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

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Poppins',sans-serif;
    background:#071014;
    color:#fff;
    overflow-x:hidden;
}

/* Scrollbar */

::-webkit-scrollbar{
    width:8px;
}

::-webkit-scrollbar-track{
    background:#0a1128;
}

::-webkit-scrollbar-thumb{
    background:#fe6f24;
    border-radius:20px;
}

/* Links */

a{
    text-decoration:none;
    transition:.3s;
}

img{
    max-width:100%;
}

/* Container */

.container{
    max-width:1320px;
}

/*==========================
Navbar
==========================*/

.navbar{

    background:rgb(18 37 47 / 85%);

    backdrop-filter:blur(15px);

    padding:0 0 !important;

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

}

.navbar-brand{

    color:#fff;

}

.navbar-brand h5{

    font-size:20px;

    font-weight:700;

    margin:0;

}

.navbar-brand small{

    color:#b9c0d8;

    letter-spacing:3px;

    font-size:10px;

}

.nav-link{

    color:#d7dbef !important;

    margin:0 12px;

    font-weight:500;

}

.nav-link:hover{

    color:#fff !important;

}

.nav-link.active{

    color:#fff !important;

}

/* WhatsApp Button */

.whatsapp-btn{

    background:linear-gradient(90deg,#fe6f24,#fdb213);

    color:#fff;

    padding:12px 24px;

    border-radius:12px;

    font-weight:600;

    border:none;

}

.whatsapp-btn:hover{

    color:#fff;

    transform:translateY(-2px);

}

/*==========================
Hero
==========================*/

.hero{

    min-height:100vh;

    display:flex;

    align-items:center;

    padding:10% 0 70px;

    background:
    radial-gradient(circle at top right, #2f5fff33, transparent 35%), 
    radial-gradient(circle at bottom left, #913cff22, transparent 30%), 
    linear-gradient(135deg, #0b181d, #08202a, #0b181d)

}

.hero img{
position: absolute;
    top: 25%;
    right: 4%;
}

/* Badge */

.hero-badge{

    display:inline-block;

    padding:12px 22px;

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

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

    border-radius:50px;

    font-size:14px;

    font-weight:600;

    margin-bottom:25px;

}

/* Heading */

.hero-title{

    font-size:60px;

    font-weight:800;

    line-height:1.15;

    margin-bottom:25px;

}

.hero-title span{

    background:linear-gradient(90deg, #fe6f24, #fcca1e, #1eecfc);

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}

/* Paragraph */

.hero-text{

    color:#bfc5dd;

    font-size:18px;

    line-height:1.8;

    margin-bottom:35px;

}

/* Hero Buttons */

.hero-buttons{

    display:flex;

    gap:15px;

    flex-wrap:wrap;

}

.btn-primary-custom{

    background:linear-gradient(90deg,#fe6f24,#fdb213);

    color:#fff;

    padding:16px 30px;

    border-radius:14px;

    font-weight:600;

    border:none;

}

.btn-primary-custom:hover{

    color:#fff;

    transform:translateY(-3px);

}

.btn-outline-custom{

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

    color:#fff;

    padding:16px 30px;

    border-radius:14px;

    font-weight: 500;

}

.btn-outline-custom:hover{

    background:#fff;

    color:#111;

}

/* Hero Image */

.hero-image{

    width:100%;

    max-width:650px;

    display:block;

    margin:auto;

}

/*=====================================
  STYLE.CSS - PART 2
  Feature Boxes + Services + Stats
======================================*/

/*==========================
Feature Boxes
==========================*/

.feature-box{
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08);
    border-radius:18px;
    padding:25px 15px;
    text-align:center;
    transition:.35s;
    height:100%;
}

.feature-box:hover{
    transform:translateY(-8px);
    background:rgba(255,255,255,.08);
    box-shadow:0 15px 35px rgba(79,70,229,.25);
}

.feature-box i{
    font-size:34px;
    color:#6d7cff;
    margin-bottom:15px;
}

.feature-box h6{
    font-size:18px;
    font-weight:700;
    margin-bottom:5px;
    color:#fff;
}

.feature-box span{
    color:#bfc5dd;
    font-size:14px;
}

/*==========================
Services Section
==========================*/

.service-wrapper{

    margin-top:80px;

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

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

    border-radius:25px;

    padding:40px 30px;

    backdrop-filter:blur(10px);

}

.service-item{

    padding:25px 15px;

    border-radius:18px;

    transition:.35s;

    cursor:pointer;

}

.service-item:hover{

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

    transform:translateY(-8px);

}

.service-item i{

    width:75px;

    height:75px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 20px;

    border-radius:20px;

    font-size:34px;

    color:#fff;

    background:linear-gradient(135deg,#fe6f24,#8b5cf6);

}

.service-item h5{

    font-size:20px;

    font-weight:700;

    margin-bottom:8px;

}

.service-item p{

    margin:0;

    color:#bfc5dd;

    font-size:15px;

}

/* Different Icon Colors */

.service-item:nth-child(1) i{
    background:linear-gradient(135deg,#ff416c,#ff4b2b);
}

.service-item:nth-child(2) i{
    background:linear-gradient(135deg,#3b82f6,#06b6d4);
}

.service-item:nth-child(3) i{
    background:linear-gradient(135deg,#f59e0b,#facc15);
}

.service-item:nth-child(4) i{
    background:linear-gradient(135deg,#22c55e,#16a34a);
}

.service-item:nth-child(5) i{
    background:linear-gradient(135deg,#ec4899,#8b5cf6);
}

.service-item:nth-child(6) i{
    background:linear-gradient(135deg,#fe6f24,#06b6d4);
}

/*==========================
Statistics
==========================*/

.stats-section{

    margin-top:70px;

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

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

    border-radius:25px;

    padding:40px 20px;

}

.stats-section .col-lg-3{

    position:relative;

}

.stats-section .col-lg-3:not(:last-child)::after{

    content:"";

    position:absolute;

    right:0;

    top:20%;

    width:1px;

    height:60%;

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

}

.stats-section h2{

    font-size:46px;

    font-weight:800;

    color:#fff;

    margin-bottom:8px;

}

.stats-section p{

    color:#bfc5dd;

    margin:0;

    font-size:15px;

}

/*==========================
Hover Effects
==========================*/

.hero-image{

    transition:.4s ease;

}

.hero-image:hover{

    transform:scale(1.03);

}

.btn-primary-custom,
.btn-outline-custom,
.whatsapp-btn{

    transition:.3s;

}

.btn-primary-custom:hover,
.whatsapp-btn:hover{

    box-shadow:0 15px 35px rgba(79,70,229,.35);

}

.service-item,
.feature-box{

    transition:.35s ease;

}


/*==========================
Utility Classes
==========================*/

.text-gradient{

    background:linear-gradient(90deg,#fe6f24,#8b5cf6);

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}

.glass{

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

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

    backdrop-filter:blur(10px);

}

.rounded-20{

    border-radius:20px;

}

.rounded-30{

    border-radius:30px;

}
/*=====================================
    STYLE.CSS - PART 3
    Responsive Design
======================================*/

/*==========================
Large Devices
==========================*/

@media (max-width:1200px){

.hero-title{
    font-size:50px;
}

.hero-text{
    font-size:17px;
}

.hero-image{
    max-width:550px;
}

.nav-link{
    margin:0 8px;
}

}

/*==========================
Tablet
==========================*/

@media (max-width:991px){

.navbar{
    padding:12px 0;
}

.navbar-collapse{
    margin-top:20px;
    padding:20px;
    border-radius:15px;
    background:#0d1635;
}

.navbar-nav{
    text-align:center;
}

.nav-item{
    margin-bottom:10px;
}

.whatsapp-btn{
    width:100%;
    margin-top:15px;
}

.hero{
    text-align:center;
    padding-top:130px;
}

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

.hero-text{
    font-size:16px;
    max-width:650px;
    margin:auto;
}

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

.hero-image{
    max-width:480px;
    margin-top:50px;
}

.feature-box{
    margin-bottom:20px;
}

.service-wrapper{
    margin-top:60px;
    padding:30px 20px;
}

.stats-section{
    margin-top:50px;
}

.stats-section .col-lg-3::after{
    display:none;
}

}

/*==========================
Mobile
==========================*/

@media (max-width:768px){

.hero{
    padding:110px 0 60px;
}

.hero-title{
    font-size:34px;
    line-height:1.3;
}

.hero-text{
    font-size:15px;
}

.hero-buttons{
    flex-direction:column;
}

.btn-primary-custom,
.btn-outline-custom{
    width:100%;
    text-align:center;
}

.hero-image{
    max-width:360px;
}

.hero-badge{
    font-size:13px;
    padding:10px 18px;
}

.feature-box{
    padding:20px 10px;
}

.feature-box i{
    font-size:28px;
}

.feature-box h6{
    font-size:16px;
}

.service-item{
    padding:20px 10px;
}

.service-item i{
    width:65px;
    height:65px;
    font-size:28px;
}

.service-item h5{
    font-size:18px;
}

.service-item p{
    font-size:14px;
}

.stats-section h2{
    font-size:34px;
}

.stats-section p{
    font-size:14px;
}

}

/*==========================
Small Mobile
==========================*/

@media (max-width:576px){

.navbar-brand img{
    width:45px;
}

.navbar-brand h5{
    font-size:16px;
}

.navbar-brand small{
    font-size:8px;
    letter-spacing:2px;
}

.hero-title{
    font-size:30px;
}

.hero-text{
    font-size:14px;
}

.hero-image{
    max-width:100%;
}

.feature-box{
    padding:18px 10px;
}

.service-wrapper{
    padding:25px 15px;
}

.stats-section{
    padding:30px 15px;
}

.stats-section .col-6{
    margin-bottom:25px;
}

}

/*==========================
Extra Small Devices
==========================*/

@media (max-width:400px){

.hero-title{
    font-size:26px;
}

.hero-badge{
    font-size:12px;
}

.btn-primary-custom,
.btn-outline-custom{
    padding:14px;
    font-size:15px;
}

.hero-image{
    margin-top:30px;
}

}

/*==========================
Smooth Hover Effects
==========================*/

.nav-link,
.btn,
.feature-box,
.service-item,
.hero-image{
    transition:all .3s ease;
}

.feature-box:hover,
.service-item:hover{
    transform:translateY(-6px);
}

.hero-image:hover{
    transform:scale(1.02);
}

/*==========================
Text Selection
==========================*/

::selection{
    background:#5b5eff;
    color:#fff;
}

/*==========================
End of CSS
==========================*/

/*=============================
Trusted Brands
==============================*/

.trusted-brands{
    background:#071014;
    overflow:hidden;
}

.section-badge{
    display:inline-block;
    background:#fe6f24;
    color:#fff;
    padding:8px 20px;
    border-radius:30px;
    font-size:14px;
    font-weight:600;
}

.section-title{
    font-size:42px;
    font-weight:700;
    color:#fff;
}

.section-text{
    color:#b9c0d8;
    max-width:700px;
    margin:auto;
}

/* Slider */

.logo-slider{
    overflow:hidden;
    position:relative;
    width:100%;
    margin-top:40px;
}

.logo-track{

    display:flex;

    width:max-content;

    animation:scroll 30s linear infinite;

}

.logo-slider:hover .logo-track{
    animation-play-state:paused;
}

.logo-item{

    width:180px;

    height:110px;

    margin:0 15px;

    display:flex;

    justify-content:center;

    align-items:center;

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

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

    border-radius:18px;

    transition:.3s;

}

.logo-item:hover{

    transform:translateY(-6px);

    background:#151d3c;

}

.logo-item img{

    max-width:90px;

    max-height:50px;

    object-fit:contain;

    filter:grayscale(100%);

    opacity:.75;

    transition:.3s;

}

.logo-item:hover img{

    filter:none;

    opacity:1;

}

/* Animation */

@keyframes scroll{

    from{
        transform:translateX(0);
    }

    to{
        transform:translateX(-50%);
    }

}

/* Responsive */

@media(max-width:768px){

.section-title{
    font-size:30px;
}

.logo-item{

    width:140px;

    height:90px;

}

.logo-item img{

    max-width:70px;

}

}

.services-section{
    background:#071014;
}

.service-tabs{
    gap:12px;
}

.service-tabs .nav-link{

    background:#21343d;

    color:#cfd6ea;

    border-radius:50px;

    padding:12px 22px;

    font-weight:600;

    border:none;

    transition:.3s;
}

.service-tabs .nav-link:hover{
    background:#fe6f24;
    color:#fff;
}

.service-tabs .nav-link.active{

    background:linear-gradient(90deg,#fe6f24,#fdb213);

    color:#fff;

    box-shadow:0 10px 25px rgb(0 177 196 / 30%);

}

.tab-content{

    background:#ffffff08;

    border-radius:20px;

    padding:35px;

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

}

.service-item{

    background:#21343d;

    color:#fff;

    border-radius:12px;

    text-align:center;

    padding:15px;

    font-weight:500;

    transition:.3s;

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

}

.service-item:hover{

    background:#fe6f24;

    transform:translateY(-4px);

}

/*=========================
Why Choose Us
==========================*/

.why-us{
    background:#071014;
    padding:100px 0;
}

.choose-card{

    background:#ffffff15;

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

    border-radius:20px;

    padding:35px 30px;

    text-align:center;

    height:100%;

    transition:.35s;

    position:relative;

    overflow:hidden;

}

.choose-card::before{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

    background:rgb(0 186 206 / 8%);

    border-radius:50%;

    top:-80px;

    right:-80px;

    transition:.4s;

}

.choose-card:hover{

    transform:translateY(-10px);

    border-color:#fe6f24;

    box-shadow:0 20px 45px rgb(0 177 196 / 30%);

}

.choose-card:hover::before{

    transform:scale(1.4);

}

.choose-icon{

    width:80px;

    height:80px;

    margin:0 auto 25px;

    border-radius:18px;

    background:linear-gradient(135deg,#fe6f24,#fdb213);

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:34px;

    color:#fff;

}

.choose-card h4{

    color:#fff;

    font-size:24px;

    font-weight:700;

    margin-bottom:15px;

}

.choose-card p{

    color:#b8c2d6;

    font-size:15px;

    line-height:1.8;

    margin:0;

}

/* Hover Icon */

.choose-card:hover .choose-icon{

    transform:rotate(10deg) scale(1.08);

    transition:.3s;

}

/* Mobile */

@media(max-width:768px){

    .choose-card{
        padding:30px 20px;
    }

    .choose-icon{
        width:70px;
        height:70px;
        font-size:30px;
    }

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

}

/*==============================
Pricing Section
===============================*/

.pricing-section{
    background:#071014;
    padding:100px 0;
}

.pricing-card{

    background:#ffffff15;

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

    border-radius:25px;

    padding:40px 35px;

    position:relative;

    text-align:center;

    transition:.35s;

    height:100%;

    overflow:hidden;

}

.pricing-card:hover{

    transform:translateY(-10px);

    border-color:#fe6f24;

    box-shadow:0 25px 50px rgba(0 177 196 / 10%);

}

.featured{

    background:linear-gradient(180deg, #fe6f244f, #fdb21330);

    transform:scale(1.05);

    border:2px solid #ffffff63;

}

.featured:hover{

    transform:scale(1.08) translateY(-8px);

}

.popular-tag{

    position:absolute;

    top:5%;

    right:-40px;

    background:#ff9800;

    color:#fff;

    padding:8px 45px;

    font-size:12px;

    font-weight:700;

    transform:rotate(45deg);

}

.plan-badge{

    display:inline-block;

    background:#1eecfc14;

    color:#1eecfc;

    padding:8px 18px;

    border-radius:50px;

    font-size:13px;

    margin-bottom:20px;

}

.pricing-card h3{

    color:#fff;

    font-size:30px;

    font-weight:700;

    margin-bottom:8px;

}

.plan-for{

    color:#b9c4dd;

    margin-bottom:20px;

}

.price{

    color:#fff;

    font-size:50px;

    font-weight:800;

    margin-bottom:10px;

}

.custom-price{

    color:#b9c4dd;

    font-size:18px;

    margin-bottom:20px;

}

.pricing-list{

    list-style:none;

    padding:0;

    margin:30px 0;

    text-align:left;

}

.pricing-list li{

    color:#d7dff2;

    padding:12px 0;

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

}

.pricing-list li:last-child{

    border:none;

}

.pricing-list i{

    color:#22c55e;

    margin-right:10px;

}

.pricing-card .btn{

    padding:14px;

    border-radius:12px;

    font-weight:600;

}

.featured .btn{

    background:#fff;

    color:#fe6f24;

    border:none;

}

.featured .btn:hover{

    background:#f4f4f4;

    color:#fe6f24;

}

/* Mobile */

@media(max-width:991px){

    .featured{

        transform:none;

    }

    .featured:hover{

        transform:translateY(-8px);

    }

}

/*====================================
HOW IT WORKS
====================================*/

.how-it-works{
    background:#071014;
    padding:100px 0;
}

.step-card{

    background:#ffffff15;

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

    border-radius:20px;

    padding:30px 20px;

    text-align:center;

    height:100%;

    transition:.35s;

    position:relative;

}

.step-card:hover{

    transform:translateY(-10px);

    border-color:#fe6f24;

    box-shadow:0 20px 45px rgba(0 177 196 / 10%);

}

.step-icon{

    width:75px;

    height:75px;

    margin:auto;

    margin-bottom:20px;

    border-radius:18px;

    background:linear-gradient(135deg,#fe6f24,#fdb213);

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:32px;

}

.step-number{

    display:inline-block;

    background:#1eecfc14;

    color:#1eecfc;

    padding:6px 16px;

    border-radius:30px;

    font-size:13px;

    font-weight:600;

    margin-bottom:15px;

}

.step-card h5{

    color:#fff;

    font-size:20px;

    font-weight:700;

    margin-bottom:12px;

}

.step-card p{

    color:#b8c2d6;

    font-size:14px;

    line-height:1.7;

    margin:0;

}

.step-arrow{

    font-size:34px;

    color:#fe6f24;

    animation:moveArrow 1.5s infinite;

}

@keyframes moveArrow{

    0%{
        transform:translateX(0);
    }

    50%{
        transform:translateX(8px);
    }

    100%{
        transform:translateX(0);
    }

}

/* Mobile */

@media(max-width:991px){

    .step-card{
        padding:25px 18px;
    }

    .step-icon{

        width:65px;

        height:65px;

        font-size:28px;

    }

    .step-card h5{
        font-size:18px;
    }

}

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

.contact-section{

    background:#071014;

    padding:100px 0;

}

.contact-card{

    background:#ffffff15;

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

    border-radius:20px;

    padding:35px;

    height:100%;

}

.contact-card h4{

    color:#fff;

    font-weight:700;

    margin-bottom:30px;

}

.contact-item{

    display:flex;

    align-items:flex-start;

    gap:20px;

    margin-bottom:30px;

}

.contact-item:last-child{

    margin-bottom:0;

}

.contact-icon{

    width:60px;

    height:60px;

    border-radius:15px;

    background:linear-gradient(135deg,#fe6f24,#fdb213);

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:24px;

    flex-shrink:0;

}

.contact-icon.whatsapp{

    background:linear-gradient(135deg,#25D366,#128C7E);

}

.contact-icon.email{

    background:linear-gradient(135deg,#ef4444,#f97316);

}

.contact-icon.address{

    background:linear-gradient(135deg,#0ea5e9,#2563eb);

}

.contact-icon.time{

    background:linear-gradient(135deg,#f59e0b,#f97316);

}

.contact-item h6{

    color:#fff;

    margin-bottom:6px;

    font-weight:600;

}

.contact-item p{

    color:#b8c2d6;

    margin:0;

    line-height:1.7;

}

.contact-item a{

    color:#b8c2d6;

    text-decoration:none;

    transition:.3s;

}

.contact-item a:hover{

    color:#fe6f24;

}

.map-card{

    height:100%;

    min-height:520px;

    overflow:hidden;

    border-radius:20px;

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

}

.map-card iframe{

    width:100%;

    height:100%;

    min-height:520px;

    border:0;

}

/* Mobile */

@media(max-width:991px){

    .contact-card{

        padding:25px;

    }

    .map-card{

        min-height:400px;

    }

    .map-card iframe{

        min-height:400px;

    }

}

@media(max-width:576px){

    .contact-item{

        gap:15px;

    }

    .contact-icon{

        width:50px;

        height:50px;

        font-size:20px;

    }

}

/*=====================================
FOOTER
======================================*/

.footer{

    background:#050b18;

    color:#c6d0e4;

    padding:80px 0 30px;
    border-top: 1px solid #363636;

}

.footer-logo{

    max-width:40%;

}

.footer-about{

    color:#9aa8c3;

    line-height:1.8;

    margin-bottom:30px;

}

.footer h5{

    color:#fff;

    margin-bottom:25px;

    font-weight:700;

}

.footer-links{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-links li{

    margin-bottom:12px;

}

.footer-contact li a{
    color: #9aa8c3;
}
.footer-contact li a:hover{
    color: #fe6f24;
}


.footer-links a{

    color:#9aa8c3;

    text-decoration:none;

    transition:.3s;

}

.footer-links a:hover{

    color:#fe6f24;

    padding-left:6px;

}

.footer-contact{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-contact li{

    display:flex;

    align-items:flex-start;

    gap:12px;

    margin-bottom:18px;

    color:#9aa8c3;

}

.footer-contact i{

    color:#fe6f24;

    font-size:18px;

    margin-top:3px;

}

.footer-social{

    display:flex;

    gap:12px;

}

.footer-social a{

    width:45px;

    height:45px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#ffffff15;

    color:#fff;

    font-size:18px;

    transition:.35s;

}

.footer-social a:hover{

    background:#fe6f24;

    transform:translateY(-5px);

}

.footer-divider{

    border-color:rgba(255,255,255,.08);

    margin:50px 0 25px;

}

.copyright{

    margin:0;

    color:#8b99b7;

}

.madeby{

    margin:0;

    color:#8b99b7;

}

@media(max-width:768px){

.footer{

    text-align:center;

}

.footer-social{

    justify-content:center;

}

.footer-contact li{

    justify-content:center;

}

.madeby{

    margin-top:10px;

}

}

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

.cta-section{
    padding:100px 0;
    background:#050816;
}

.cta-wrapper{

    position:relative;

    overflow:hidden;

    border-radius:30px;

    padding:70px;

    background:radial-gradient(circle at top right, #2f5fff33, transparent 35%), 
    radial-gradient(circle at bottom left, #913cff22, transparent 30%), 
    linear-gradient(135deg, #0b181d, #08202a, #0b181d);

    border:1px solid rgba(88,102,255,.25);

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

}

/* Glow Effects */

.cta-wrapper::before{

    content:"";

    position:absolute;

    width:450px;

    height:450px;

    background:radial-gradient(circle, #1eecfc2b, transparent 70%);

    bottom:-220px;

    left:40%;

    z-index:0;

}

.cta-wrapper::after{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    background:radial-gradient(circle, #9fefff29, transparent 70%);

    top:-180px;

    right:-150px;

    z-index:0;

}

.cta-wrapper .row{
    position:relative;
    z-index:2;
}

/* Badge */

.offer-badge{

    display:inline-block;

    padding:12px 24px;

    background:#fe6f245c;

    color:#fff;

    border-radius:50px;

    font-size:15px;

    font-weight:700;

    letter-spacing:.5px;

    text-transform:uppercase;

}

/* Title */

.cta-title{

    font-size:66px;

    font-weight:800;

    color:#fff;

    line-height:1.08;

    margin-bottom:25px;

}

.gradient-text{

    background:linear-gradient(90deg, #fe6f24, #fcca1e, #1eecfc);

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}

/* Paragraph */

.cta-text{

    color:#cfd5ea;

    font-size:17px;

    line-height:1.8;

    max-width:620px;

    margin-bottom:45px;

}



/* Image */

.cta-image{

    position:relative;

    text-align:center;

}

.cta-image img{

    max-width:110%;

    width:650px;

    position: absolute;
    bottom: -180px;
    right: 0%;

    z-index:2;

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

    filter:drop-shadow(0 30px 60px rgba(0,0,0,.45));

}

.cta-image::before{

    content:"";

    position:absolute;

    width:520px;

    height:520px;

    background:radial-gradient(circle, #9fefff42, transparent 70%);

    right:50px;

    bottom:0;

    z-index:1;

}

@keyframes float{

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

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

}

/*=========================
Responsive
=========================*/

@media(max-width:1199px){

    .cta-title{
        font-size:54px;
    }

    .cta-text{
        font-size:19px;
    }

}

@media(max-width:991px){

    .cta-wrapper{

        padding:60px 35px;

        text-align:center;

    }

    .cta-title{

        font-size:46px;

    }

    .cta-text{

        margin:auto auto 35px;

    }


    .cta-image img{

        width:480px;

    }

}

@media(max-width:767px){

    .hero img{
        display: none;
    }

    .service-tabs .nav-link{
        font-size: 12px;
        margin: 0;
    }


    .service-tabs {
    gap: 6px;
    margin-bottom: 15px !important;
}

    .cta-image img {
        display: none;
    }
    .hero-buttons {
        margin-top: 20px;
    }
    .cta-wrapper{

        padding:40px 25px;

        border-radius:20px;

    }

    .offer-badge{

        font-size:13px;

        padding:10px 20px;

    }

    .cta-title{

        font-size:36px;

    }

    .cta-text{

        font-size:17px;

        line-height:1.7;

    }

  

    .cta-image img{

        width:100%;

    }

}