
.herobanner_section:before {
    background-image: linear-gradient(#2ddace 1px, transparent 1px), linear-gradient(90deg, #2edccfbf 1px, transparent 1px) !important;
    background-size: 64px 64px;
    opacity: 0.1 !important;
}

.subheadingbox svg {
    animation: liveLocation 1s infinite !important;
}

@keyframes liveLocation {
    0% {
        fill: #2ddace;
    }

    50% {
        fill: #fff;
    }

    100% {
        fill: #2ddace;
    }
}

.subheadingbox .elementor-icon-list-item{
	    backdrop-filter: blur(18px) saturate(140%);
    background: linear-gradient(#ffffff0a, #ffffff03);
    border: 1px solid #ffffff14;
    width: fit-content;
    padding: 2px 15px !important;
    border-radius: 30px;
}
.marquee .elementor-widget-container {
    overflow: hidden;
    width: 100%;
    position: relative;
}

.marquee .elementor-icon-list-items {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    gap: 40px;
    white-space: nowrap;
    animation: marquee 50s linear infinite;
    width: max-content;
}

.marquee .elementor-icon-list-item {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* Pause marquee on hover */
.marquee .elementor-icon-list-items:hover {
    animation-play-state: paused;
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

.marquee .elementor-icon-list-item {
    opacity: 1;
    transition: all 0.3s ease;
}

.marquee:hover .elementor-icon-list-item {
    opacity: 0.5;
}

.marquee .elementor-icon-list-item:hover {
    opacity: 1;
}

.marquee .elementor-icon-list-item:hover .elementor-icon-list-text {
    color: #2edccf !important;
}
.differenceprogressbox .elementor-progress-wrapper{overflow: unset !important;}

.differenceprogressbox .elementor-progress-percentage{
    position: absolute;
    right: -12px;
    top: -17px;
    font-size: 17px;
}

.technologylabel .elementor-icon-list-items{gap:6px;}
.technologylabel .elementor-icon-list-item{border: 1px solid #2edccf8f;width: fit-content;padding: 2px 15px !important;border-radius: 30px;background: #021d3d6b;}
.technologylabel .elementor-icon-list-text{padding-inline-start: 0 !important;}
.technologylabel:hover .elementor-icon-list-item:hover{background: #032B5A !important;}

.homeprocess{position: relative !important;}
.homeprocess::before{content: '' !important;
    position: absolute !important;
    top: 45px !important;
    left: 14% !important;
    right: 28px !important;
    height: 1px !important;
    background: linear-gradient(90deg, #2edccf, rgba(0, 212, 200, 0.1));
    z-index: 0;
    width: 73% !important;}
 

/* ==========================================
   MODERN TECH STACK SECTION
========================================== */

.modernTechstack_section{
    --accent:#2edccf;
    --card:#07173d;
    --card-dark:#04122f;
    --text:#ffffff;
    --text-light:rgba(255,255,255,.65);
}

/* =========================
   ROW ALIGNMENT
========================= */

.modernTechstack_section .row{
    align-items:center;
}

/* =========================
   LEFT NAVIGATION
========================= */

.modernTechstack_section .col-lg-5{width: 47.67%;}

.modernTechstack_section .mil-tabs-left-nav{
    list-style:none;
    padding:0;
    margin:0 !important;
}

.modernTechstack_section .mil-tabs-left-nav li{
    margin-bottom:14px;
}

.modernTechstack_section .mil-tabs-left-nav li:last-child{
    margin-bottom:0;
}

.modernTechstack_section .mil-tabs-left-nav a{
    position:relative;
    display:flex;
    align-items:center;
    overflow:hidden;

    min-height:96px;

    padding:18px 70px 18px 82px;

    border-radius:22px;

    background:
        linear-gradient(
            90deg,
            rgba(10,27,66,.95),
            rgba(6,18,48,.95)
        ) !important;

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

    transition:all .35s ease;

    text-decoration:none;
}

/* glow overlay */

.modernTechstack_section .mil-tabs-left-nav a::after{
    content:"➜";

    position:absolute;

    right:28px;
    top:50%;

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

    opacity:0;

    color:var(--accent);

    font-size:26px;

    transition:.35s ease;
}

/* icon container */

.modernTechstack_section .mil-tabs-left-nav a::before{
    content:"";

    position:absolute;

    left:22px;
    top:50%;

    transform:translateY(-50%);

    width:46px;
    height:46px;

    border-radius:14px;

    background-color:#162c59;

    background-repeat:no-repeat;
    background-position:center;
    background-size:18px;

    transition:.35s ease;
}

/* icon mapping */

.modernTechstack_section .mil-tabs-left-nav li:nth-child(1) a:before{
    background-image:url("https://appeaktech.com/wp-content/uploads/2026/01/code-slash-svgrepo-com.svg");
}

.modernTechstack_section .mil-tabs-left-nav li:nth-child(2) a:before{
    background-image:url("https://appeaktech.com/wp-content/uploads/2026/06/Backend.svg");
}

.modernTechstack_section .mil-tabs-left-nav li:nth-child(3) a:before{
    background-image:url("https://appeaktech.com/wp-content/uploads/2026/06/Mobile.svg");
}

.modernTechstack_section .mil-tabs-left-nav li:nth-child(4) a:before{
    background-image:url("https://appeaktech.com/wp-content/uploads/2026/06/Cloud.svg");
}

.modernTechstack_section .mil-tabs-left-nav li:nth-child(5) a:before{
    background-image:url("https://appeaktech.com/wp-content/uploads/2026/06/AI-Accelerated-Development.svg");
}

/* active card */

.modernTechstack_section .mil-tabs-left-nav a:hover,
.modernTechstack_section .mil-tabs-left-nav a.mil-active{

    border-color:rgba(46,220,207,.85);

    background:
        linear-gradient(
            90deg,
            rgba(46,220,207,.12),
            rgba(7,24,58,.95)
        );

    box-shadow:
        0 0 0 1px rgba(46,220,207,.2),
        0 0 35px rgba(46,220,207,.18);

    transform:translateX(6px);
}

.modernTechstack_section .mil-tabs-left-nav a:hover::after,
.modernTechstack_section .mil-tabs-left-nav a.mil-active::after{
    opacity:1;
    transform:translateY(-50%) translateX(0);
}

.modernTechstack_section .mil-tabs-left-nav a:hover::before,
.modernTechstack_section .mil-tabs-left-nav a.mil-active::before{
    background-color:var(--accent);
    box-shadow:0 0 25px rgba(46,220,207,.45);
}

.modernTechstack_section .mil-tabs-left-nav a > span{
    display:block;

    font-size:18px;
    font-weight:700;

    color:#fff;
}

.modernTechstack_section .mil-tabs-left-nav a > span span{
    display:block;

    margin-top:0px;

    font-size:15px;
    line-height:1.6;

    color:var(--text-light);

    font-weight:400;
}

/* =========================
   RIGHT PANEL
========================= */

.modernTechstack_section .mil-tabs-slider{

    position:relative;

    min-height:540px;

    border-radius:34px;

    overflow:hidden;

    padding:35px;

    background:
        radial-gradient(
            circle at top right,
            rgba(46,220,207,.12),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #07205a,
            #04163f
        );

    border:1px solid rgba(46,220,207,.4);

    box-shadow:
        inset 0 0 40px rgba(46,220,207,.04),
        0 0 40px rgba(46,220,207,.08);
    margin-bottom: 0px !important;    
}

.modernTechstack_section .mil-tabs-slider::before{
    content:"";

    position:absolute;

    width:250px;
    height:250px;

    right:-80px;
    top:-80px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(46,220,207,.15),
            transparent 70%
        );
}

.righttitle{
    font-size: 24px !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* =========================
   HEADER ICON
========================= */


.modernTechstack_section .mil-icon-frame{

    width:52px !important;
    height:52px;

    border-radius:18px;

    background:var(--accent);

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:20px;
     float: left;
    margin-right: 20px;
}

.modernTechstack_section .mil-icon-frame img{
    max-width:24px;
}

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

.modernTechstack_section .mil-h5{
    color:#fff;
}

.modernTechstack_section .mil-h5 div{
    font-size:34px;
    font-weight:700;
    line-height:1.3;
}

.modernTechstack_section .mil-h5 span{
    display:block;

    margin-top:5px;

    font-size:16px;

    font-weight:400;

    color:rgba(255,255,255,.75);
}

/* =========================
   TECH CARDS
========================= */

.middletechbox{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    margin-top:25px;
}

.techItem{

    min-width:160px;

    padding:18px;

    border-radius:18px;

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

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

    transition:.35s ease;
}

.techItem:hover{
    transform:translateY(-8px);

    border-color:rgba(46,220,207,.4);

    box-shadow:0 10px 25px rgba(46,220,207,.12);
}

.techtitle{
    display:block;

    color:#fff;

    font-size:20px;
    font-weight:600;
}

.techdescription{
    display:block;

    margin-top:8px;

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

    font-size:13px;
}

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

.footertechbox{

    position:absolute;

    bottom:25px;
    left:35px;
    right:35px;

    display:flex;
    justify-content:space-between;
}

.footeritem{
    display:flex;
    align-items:center;
    gap:10px;
}

.footeritem img{
    width:18px;
}

.footertitle{
    color:rgba(255,255,255,.7);
    font-size:14px;
}

.modernTechstack_section .swiper-wrapper .mil-link{opacity: 0;}
.modernTechstack_section .swiper-slide-active>div{height: 460px}

@media (min-width: 768px) and (max-width: 936px) {
 
.wayarrow .elementor-icon{margin-left: -8px;}
.theaiAdvantage_imgbox{display: none !important;}
.theaiAdvantage_gird, .ctahomegrid{--e-con-grid-template-columns: repeat(1, 1fr) !important;}
.homeprocess .elementor-heading-title{font-size: 14px !important;line-height: 18px !important;}
.homeprocess .elementor-icon{font-size: 18px !important;}
.homeprocess .processItem{padding: 15px !important;}
.herobanner_section{margin-top: -50px !important;}
.modernTechstack_section .swiper-slide-active>div {height: unset;}

}


@media screen and (max-width: 768px){

.modernTechstack_section .col-lg-5 {width: 100%;margin-bottom: 40px;}
.modernTechstack_section .mil-tabs-left-nav a::after{rotate: 90deg;top: 20%;}   
.wayarrow .elementor-icon{rotate: 90deg;} 
.middletechbox{justify-content: space-between;flex-wrap: wrap;}
.techItem{width: 47% !important;min-width: 47%;}
.footertechbox{left: 5px;flex-direction: column;}
.modernTechstack_section .mil-tabs-slider{min-height: max-content !important;}
.modernTechstack_section .mil-tabs-left-nav a::before{top: 38%}
.modernTechstack_section .swiper-slide-active>div {height: unset;}

}