@media only screen and (min-width : 320px) and (max-width : 480px)  {
 .header-logo img{
         height: 40px !important;
 }
 .th-menu-toggle {
    width: 40px !important;
    height: 45px !important;
 }
 body .th-btn{
         padding: 14.5px 18px !important;
 }
 .counter-card_number {
    font-size: 26px !important;
 }
     .counter-card_text {
        font-size: 12px !important;
    }
    #loaderVideo {
    width: 40% !important;
    }
    body .counter-card {
                border-bottom: 1px solid #357AFA;
    }
    .adv-image img{
        margin-bottom:30px !important;
    }
    .counter-icon {
    font-size: 24px !important;
    }
 .hero-style13 .hero-title{
             font-size: 22px !important;
 }
 .th-hero-wrapper .checklist li { 
    font-size: 16px !important;
 }
 .img-box10 .img2 img{
         height: 80px !important;
 }
 .pillar-big {
    font-size: 58px !important;
 }
     .pillars-row { 
        gap: 8px !important;
    }
 .delivery-vehicle { 
    top: -9px !important; 
    font-size: 23px !important;
 }
 .title-area .sec-title{
     font-size: 22px !important;
 }
 .carbon-content .sec-title{
     font-size: 22px !important;
 }
 body .loader-container .logo {
    font-size: 42px !important;
 }
 .footer-contact_link {
    font-size: 15px !important;
 }
 .cta-content h2 {
    font-size: 22px !important;
 }
 select, .form-control, .form-select, textarea, input {
    height: 42px !important;
 }
 .logistics-route { 
    bottom: auto;
    top: -13px;
 }
 body .connect-line {
    margin-top: -15px;
    margin-bottom: 15px;
 }
  body .round-icon::before { 
    width: 95px;
    height: 95px;
  }
 .round-icon {
    width: 76px !important;
    height: 76px !important; 
    font-size: 18px !important;
 }
 .service-icon {
    width: 55px !important;
    height: 55px !important;
 }
 body .service-box { 
    padding: 18px 20px;
 }
 .hero-13 { 
    height: 600px !important;
 }
 .services-area .sec-title {
        font-size: 22px !important;
    }
    
     .th-hero-wrapper .checklist ul { 
        justify-content: left !important;
    }
}
 
 
 @media (max-width: 767px) {
    .th-hero-wrapper .checklist ul { 
        justify-content: left !important;
    }
}
 
 body .th-menu-wrapper .mobile-logo {
    padding-bottom: 20px;
    padding-top: 30px; 
    background-color: #ECE7F5 !important;
}
 .header-layout11 .header-top{
background: linear-gradient(
to right,
#000 50%,
#6f42c1 50%
);
}
#preloader{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
font-family:Poppins,sans-serif;
transition:opacity .6s;
}

.loader-container{
text-align:center;
max-width:700px;
}

/* video */
#loaderVideo{
width:55%;
max-width:420px;
border-radius:14px;
box-shadow:0 20px 40px rgba(0,0,0,.08);
}

/* road */
.road{
margin:25px auto;
width:200px;
height:4px;
background:#eee;
border-radius:4px;
position:relative;
}

/* electric line */
.road::before{
content:"";
position:absolute;
width:60px;
height:100%;
background:linear-gradient(90deg,transparent,#6F42C1,transparent);
animation:roadMove 1.5s linear infinite;
}

/* bike */
.bike{
position:absolute;
top:-22px;
left:0;
font-size:26px;
z-index:2;
animation:bikeMove 3s linear infinite;
}

/* TEN logo */
.logo{
font-size:48px;
font-weight:800;
letter-spacing:8px;
margin-top:10px;

background:linear-gradient(90deg,#6F42C1,#a678ff,#6F42C1);
background-size:200%;
-webkit-background-clip:text;
color:transparent;

animation:logoGlow 3s linear infinite;
}

/* tagline */
.tagline{
margin-top:12px;
font-size:12px;
letter-spacing:4px;
text-transform:uppercase;
display:flex;
justify-content:center;
gap:8px;
}

.tagline span{
opacity:0;
transform:translateY(10px);
animation:tagReveal .8s forwards;
}

.tagline span:nth-child(1){animation-delay:.3s;}
.tagline span:nth-child(2){animation-delay:.6s;}
.tagline span:nth-child(3){animation-delay:.9s;}


/* animations */

@keyframes roadMove{
0%{left:-60px}
100%{left:200px}
}

@keyframes bikeMove{
0%{left:-30px}
100%{left:200px}
}

@keyframes logoGlow{
0%{background-position:0%}
100%{background-position:200%}
}

@keyframes tagReveal{
to{
opacity:1;
transform:translateY(0);
}
}



    .th-header .th-btn{
        border-radius: 25px;
    }
    .th-btn{
        border-radius: 25px;
    }
    .hero-13{
position:relative;
height:700px;
overflow:hidden;
}

/* video background */

.hero-video{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
opacity: .2;
animation:heroMove 20s linear infinite;
z-index:0;
}

/* overlay */

.hero-13::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;

background:rgba(111,66,193,0.11);
z-index:1;
}

/* content */

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

 .hero-bottom-shape{
position:absolute;
bottom:0;
left:0;
width:100%;
line-height:0;
z-index:2;
}

.hero-bottom-shape svg{
width:100%;
height:140px;
display:block;
}

.hero-bottom-shape path{
fill:#ffffff;
}

/* glow line effect */

.hero-bottom-shape::before{
content:"";
position:absolute;
    bottom: 69px;
left:0;
width:100%;
height:40px;

background:linear-gradient(
90deg,
transparent,
rgba(111,66,193,0.4),
transparent
);

filter:blur(25px);
opacity:.7;
}



/* ROUTE CONTAINER */

.logistics-route{
position:absolute;
bottom:103px;
left:0;
width:100%;
height:60px;
z-index:1;
pointer-events:none;
}

/* moving path */

.route-line{
position:absolute;
width:100%;
height:3px;

background:linear-gradient(
90deg,
transparent,
#6f42c1,
transparent
);

opacity:.35;
animation:routeMove 6s linear infinite;
}

/* vehicle */
 
.delivery-vehicle{
position:absolute;
top:-18px;
left:-80px;
font-size:34px;
color:#6f42c1;

animation:vehicleMove 10s linear infinite;
}
body .th-menu-toggle{
    position: relative;
    animation: none !important;
    transform: none !important;
}
/* glow */
i{
    animation: none !important;
    transform: none !important;
}
.delivery-vehicle i{
filter:drop-shadow(0 0 8px rgba(111,66,193,.7)) !important;
animation:vanBounce 0.6s infinite alternate !important;
}

/* vehicle movement */

@keyframes vehicleMove{

0%{
left:-100px;
}

100%{
left:110%;
}

}

/* road vibration / wheel motion effect */

@keyframes vanBounce{

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

100%{
transform:translateY(-2px);
}

}


 .ten-pillars-line{

position:relative;
padding:40px 0;
background:linear-gradient(135deg,#0f0f1a,#1b1b2f);
color:#fff;
}

/* row */

.pillars-row{
display:flex;
justify-content:space-between;
align-items:center;
gap:50px;
flex-wrap:wrap;
}

/* item */

.pillar-item{
display:flex;
align-items:center;
position:relative;
cursor:pointer;
}

/* BIG LETTER */

.pillar-big{
font-size:80px;
font-weight:800;
margin-right:8px;
    line-height: 70px;
background:linear-gradient(135deg,#9b6bff,#6f42c1);
-webkit-background-clip:text;
color:transparent;

text-shadow:0 0 20px rgba(155,107,255,.7); 
}
.pillar-big::before{
content: "";
    position: absolute;
    width: 130px;
    height: 80px;
    background: #6f42c1;
    filter: blur(40px);
    opacity: 0.6;
    left: -3px;
    z-index: 1;
}
.ten-pillars-line{
overflow:visible;
}
/* text */

.pillar-text{
font-size:20px;
color:#dcdcdc;
}

.pillar-text strong{
color:#fff;
font-weight:700;
}

/* hover glow */

.pillar-item:hover .pillar-big{
transform:scale(1.2);
text-shadow:0 0 35px rgba(155,107,255,.9);
}

.pillar-item:hover .pillar-text{
color:#ffffff;
}

/* divider */

.pillar-item:not(:last-child)::after{
content:"";
position:absolute;
right:-25px;
top:50%;
transform:translateY(-50%);
height:45px;
width:2px;
background:linear-gradient(to bottom,transparent,#6f42c1,transparent);
}

/* responsive */

@media(max-width:900px){

.pillars-row{
flex-direction:column;
align-items:flex-start;
gap:35px;
}

.pillar-item::after{
display:none;
}

}




/* SERVICES SECTION */

.services-area{
padding:90px 0;
background:linear-gradient(135deg,#f7f8ff,#f2edfc);
}

/* section title */

.services-area .sub-title{
color:#6f42c1;
font-weight:600;
letter-spacing:2px;
text-transform:uppercase;
font-size:14px;
display:block;
margin-bottom:10px;
}

.services-area .sec-title{
font-size:36px;
margin-bottom:15px;
color:#111;
}

/* SERVICE CARD */

.service-box{
position:relative;
background:#fff;
padding:40px 30px;
border-radius:16px;
overflow:hidden;

box-shadow:0 15px 40px rgba(0,0,0,0.06);
transition:all .4s ease;
}

/* gradient border */

.service-box::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#6f42c1,#9b6bff);
transition:.4s;
}

/* icon circle */

.service-icon{
width:65px;
height:65px;
background:linear-gradient(135deg,#6f42c1,#9b6bff);
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
color:#fff;
font-size:28px;
margin-bottom:18px;

box-shadow:0 10px 25px rgba(111,66,193,0.3);
transition:.4s;
}

/* title */

.service-box h3{
font-size:20px;
margin-bottom:12px;
color:#111;
}

/* text */

.service-box p{
font-size:15px;
color:#666;
line-height:1.7;
}

/* HOVER EFFECT */

.service-box:hover{
transform:translateY(-12px);
box-shadow:0 30px 60px rgba(0,0,0,0.12);
}

.service-box:hover .service-icon{
transform:rotate(10deg) scale(1.1);
box-shadow:0 15px 35px rgba(111,66,193,0.45);
}

.service-box:hover::before{
height:100%;
opacity:.05;
}

/* responsive */

@media(max-width:768px){

.services-area{
padding:70px 0;
}

.services-area .sec-title{
font-size:30px;
}

}




    .ten-network-round{
padding:100px 0;
background:#fff;
color:#666;
}

.network-round-row{
display:flex;
align-items:center;
justify-content:center;
gap:30px;
flex-wrap:wrap;
}

/* round card */
.round-item{
text-align:center;
position:relative;
max-width:240px;
transition:0.4s;
}

/* floating hover */

.round-item:hover{
transform:translateY(-10px);
}

/* STEP BADGE */

.step-number{
position:absolute;
top:-15px;
left:50%;
transform:translateX(-50%);
z-index: 9;
background:linear-gradient(135deg,#6f42c1,#000);
color:#fff;

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

padding:6px 10px;
border-radius:30px;

box-shadow:0 5px 15px rgba(111,66,193,.5);
letter-spacing:1px;
}

/* MAIN CIRCLE */

.round-icon{
width:100px;
height:100px;

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

margin:auto;
margin-bottom:18px;

border-radius:50%;

font-size:42px;
color:#fff;

background:linear-gradient(135deg,#6f42c1,#9b6bff);

position:relative;

box-shadow:
0 10px 40px rgba(111,66,193,.6);

transition:0.4s;
}

/* glowing outer ring */

.round-icon::before{
content:"";
position:absolute;

width:110px;
height:110px;

border-radius:50%;

border:2px dashed rgba(111,66,193,.4);

animation:spinRing 12s linear infinite;
}

/* soft glow background */

.round-icon::after{
content:"";
position:absolute;

width:150px;
height:150px;

border-radius:50%;

background:radial-gradient(circle,rgba(111,66,193,.25),transparent 70%);

z-index:-1;
}

/* hover effect */

.round-item:hover .round-icon{

transform:scale(1.05);
box-shadow:0 0 60px rgba(111,66,193,.9);
}

/* icon rotate */

.round-item:hover .round-icon i{
transform:rotate(15deg);
transition:0.3s;
}

/* rotating ring animation */

@keyframes spinRing{

0%{
transform:rotate(0deg);
}

100%{
transform:rotate(360deg);
}

}
/* text */

.round-item h4{
font-size:18px;
margin-bottom:8px;
}

.round-item p{
font-size:14px;
color:#666;
}

/* connecting line */

.connect-line{
width:100px;
height:3px;

background:linear-gradient(
90deg,
transparent,
#6f42c1,
transparent
);

position:relative;
}

/* moving light */

.connect-line::before{
content:"";
position:absolute;

width:40px;
height:3px;

background:#9b6bff;

animation:lineMove 2.5s linear infinite;
}

@keyframes lineMove{

0%{
left:-40px;
}

100%{
left:100%;
}

}






    .counter-area-2{
padding:60px 0;
background:#0f0f1c;
color:#fff;
}

.counter-card{
text-align:center;
padding:40px 25px;
border-radius:14px;

background:rgba(255,255,255,0.04);
backdrop-filter:blur(10px);

transition:.4s;
position:relative;
overflow:hidden;
}

/* icon */

.counter-icon{
font-size:36px;
color:#6f42c1;
margin-bottom:15px;
}

/* number */

.counter-card_number{
font-size:38px;
font-weight:700;
margin-bottom:8px;
}

/* text */

.counter-card_text{
color:#bbb;
font-size:14px;
}

/* hover effect */

.counter-card:hover{
transform:translateY(-10px);
box-shadow:0 15px 40px rgba(111,66,193,.35);
background:#181836;
}

/* glow line */

.counter-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:3px;
background:linear-gradient(90deg,#6f42c1,#9b6bff);
opacity:0;
transition:.4s;
}

.counter-card:hover::before{
opacity:1;
}



    .sec-title{
        font-size:36px;
    }
    .ten-advantages{
padding:100px 0;
background:#f8f9fc;
}

/* image */

.adv-image img {
    width: 100%; 
    height: 419px;
    border-radius: 14px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.10);
}

/* list */

.adv-list{
margin-top:20px;
}

/* item */

.adv-item{
display:flex;
gap:10px;
margin-bottom:15px;
padding:10px;
border-radius:10px;
background:#fff;
transition:.35s;
}

/* icon */

.adv-icon{
width:50px;
height:50px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:linear-gradient(135deg,#6f42c1,#9b6bff);
color:#fff;
font-size:15px;
flex-shrink:0;
}

/* text */

.adv-text h5{
margin-bottom:5px;
font-size:16px;
}

.adv-text p{
font-size:14px;
color:#666;
margin:0;
}

/* hover */

.adv-item:hover{
transform:translateX(6px);
box-shadow:0 10px 30px rgba(111,66,193,.2);
}







 .header-layout11 .header-top{
background: linear-gradient(
to right,
#000 50%,
#6f42c1 50%
);
}
#preloader{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
font-family:Poppins,sans-serif;
transition:opacity .6s;
}

.loader-container{
text-align:center;
max-width:700px;
}

/* video */
#loaderVideo{
width:55%;
max-width:420px;
border-radius:14px;
box-shadow:0 20px 40px rgba(0,0,0,.08);
}

/* road */
.road{
margin:25px auto;
width:200px;
height:4px;
background:#eee;
border-radius:4px;
position:relative;
}

/* electric line */
.road::before{
content:"";
position:absolute;
width:60px;
height:100%;
background:linear-gradient(90deg,transparent,#6F42C1,transparent);
animation:roadMove 1.5s linear infinite;
}

/* bike */
.bike{
position:absolute;
top:-22px;
left:0;
font-size:26px;
z-index:2;
animation:bikeMove 3s linear infinite;
}

/* TEN logo */
.logo{
font-size:48px;
font-weight:800;
letter-spacing:8px;
margin-top:10px;

background:linear-gradient(90deg,#6F42C1,#a678ff,#6F42C1);
background-size:200%;
-webkit-background-clip:text;
color:transparent;

animation:logoGlow 3s linear infinite;
}

/* tagline */
.tagline{
margin-top:12px;
font-size:12px;
letter-spacing:4px;
text-transform:uppercase;
display:flex;
justify-content:center;
gap:8px;
}

.tagline span{
opacity:0;
transform:translateY(10px);
animation:tagReveal .8s forwards;
}

.tagline span:nth-child(1){animation-delay:.3s;}
.tagline span:nth-child(2){animation-delay:.6s;}
.tagline span:nth-child(3){animation-delay:.9s;}


/* animations */

@keyframes roadMove{
0%{left:-60px}
100%{left:200px}
}

@keyframes bikeMove{
0%{left:-30px}
100%{left:200px}
}

@keyframes logoGlow{
0%{background-position:0%}
100%{background-position:200%}
}

@keyframes tagReveal{
to{
opacity:1;
transform:translateY(0);
}
}















  .cta-sec{
background: linear-gradient(rgba(15,23,42,0.75), rgba(111,66,193,0.75)),
            url("../img/new/bg.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 80px 0;
color: #fff; 
}
.cta-content h2{
font-size:36px;
color:#fff;
font-weight:700;
margin-bottom:10px;
}

.cta-content p{
    color:#fff;
font-size:16px;
opacity:0.9;
}

.cta-btn .th-btn{
background:#fff;
color:#6f42c1;
padding:14px 32px;
border-radius:30px;
font-weight:600;
text-decoration:none;
transition:0.3s;
}

.cta-btn .th-btn:hover{
background:#000;
color:#fff;
}

.testi-box{
    border: 1px solid lightgrey;
}
.testi-box_img img {
    height: 60px;
}




    .result-box{
margin-top:20px;
padding:10px;
background:#6f42c1;
color:#fff;
border-radius:10px;
text-align:center;
}

.result-box p{
font-size:20px;
font-weight:700;
margin:0;
}
    .carbon-calculator-sec{
background: linear-gradient(135deg,#0f172a,#0f172a,#6f42c1);
padding:100px 0;
color:#fff;
position:relative;
overflow:hidden;
}

.carbon-content p{
opacity:0.9;
color:#ccc;
margin-bottom:25px;
}

.carbon-card{
background:rgba(255,255,255,0.08);
backdrop-filter:blur(15px);
padding:35px;
border-radius:16px;
border:1px solid rgba(255,255,255,0.2);
box-shadow:0 20px 60px rgba(0,0,0,0.3);
}

.form-group{
margin-bottom:20px;
}

.form-group label{
display:block;
margin-bottom:6px;
font-weight:600;
color: #ccc;
}

.form-group input{
width:100%;
padding:12px;
border-radius:8px;
border:none;
outline:none;
}

.carbon-btn{
width:100%;
background:#6f42c1;
border:1px solid #6f42c1;
padding:19px 15px;
margin-top: 28px;
border-radius:8px;
font-weight:600;
color:#fff;
transition:0.3s;
}

.carbon-btn:hover{
background:#6f42c1;
transform:translateY(-2px);
}

.carbon-result-box{
margin-top:20px;
background:rgba(27,191,114,0.2);
padding:15px;
border-radius:10px;
text-align:center;
}

.carbon-result-box p{
font-size:32px;
font-weight:700;
margin:0;
}

/* RIGHT SIDE */

.carbon-visual{
position:relative;
text-align:center;
}

.carbon-visual img{
width:100%;
border-radius: 10px;
border-right:10px solid #825dc6;
border-top-right-radius: 170px; 
background-size: cover; 
animation:float 4s ease-in-out infinite;
}

.eco-circle{
position:absolute;
top:25%;
right:10%;
width:140px;
height:140px;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
text-align:center;
border-radius:50%;
color:#fff;
z-index:9;

/* Gradient background */
background:linear-gradient(135deg,#1ca529,#3d6321);

/* Glow shadow */
box-shadow:0 0 25px rgba(27,191,114,0.6),
           0 15px 40px rgba(0,0,0,0.3);

/* Border glow */
border:7px solid rgba(255,255,255,0.3);

/* Animation */
animation:ecoPulse 3s infinite ease-in-out;
}

/* Text styling */
.eco-circle h3{
font-size:20px;
font-weight:700;
text-transform: uppercase;
margin:0;
color: #fff;
}

.eco-circle p{
font-size:12px;
color: #ccc;
opacity:0.9;
margin:2px 0 0;
}

/* Pulse Animation */
@keyframes ecoPulse{
0%{
transform:scale(1);
box-shadow:0 0 20px rgba(27,191,114,0.5);
}
50%{
transform:scale(1.08);
box-shadow:0 0 40px rgba(27,191,114,0.8);
}
100%{
transform:scale(1);
box-shadow:0 0 20px rgba(27,191,114,0.5);
}
}

@keyframes float{
0%{transform:translateY(0);}
50%{transform:translateY(-15px);}
100%{transform:translateY(0);}
}


    .footer-contact_icon:after, .footer-contact_icon:before{
        display: none;
    }
    .footer-contact { 
    padding: 11px 0;
}
.footer-layout3 .th-social a { 
      background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.34);
}
.footer-contact_link {
    font-size: 16px;
}
.th-social h6{
     font-size: 16px;
}

.testi-box_img img {
   height:50px !important;
}