/*=========================
Google Font
=========================*/

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

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

body{
    font-family:'Poppins',sans-serif;
}

.container{
    width:90%;
    max-width:1320px;
    margin:auto;
}

/*=========================
Top Header
=========================*/

.top-header{

    background:#072b61;
    padding:8px 0;
    font-size:13px;

}

.top-header .container{

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

}

.top-left,
.top-right ul{

    display:flex;
    align-items:center;

}

.top-left{

    gap:25px;

}

.top-right ul{

    list-style:none;
    gap:28px;

}

.top-header a{

    color:#ffffff;
    text-decoration:none;
    transition:.3s;
    font-weight:400;

}

.top-header a:hover{

    color:#d6e5ff;

}

.top-header i{

    margin-right:6px;
    font-size:12px;

}

.language i{

    margin-left:5px;
    margin-right:0;
    font-size:10px;

}

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

@media (max-width:991px){

.top-header{

    padding:10px 0;

}

.top-header .container{

    flex-direction:column;
    gap:10px;

}

.top-left{

    flex-direction:column;
    gap:8px;

}

.top-right ul{

    flex-wrap:wrap;
    justify-content:center;
    gap:18px;

}

}

@media (max-width:576px){

.top-header{

    display:none;

}

}






/*=====================================
Main Header
======================================*/

.main-header{
    width:100%;
    background:#fff;
    border-bottom:1px solid #ececec;
    position:relative;
    z-index:999;
}

.main-header .container{
    max-width:1320px;
    margin:auto;
    padding:0 15px;

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

    height:82px;
}

/*=========================
Logo
==========================*/

.logo img{
    width:210px;
    display:block;
}

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

.navbar{
    margin-left:auto;
}

.nav-menu{
    display:flex;
    align-items:center;
    list-style:none;
    gap:30px;
}

.nav-menu li{
    position:relative;
}

.nav-menu li a{

    text-decoration:none;
    color:#222;

    font-size:13px;

    font-weight:600;

    letter-spacing:.3px;

    padding:31px 0;

    display:flex;
    align-items:center;
    gap:6px;

    transition:.3s;
}

/* Hover */

.nav-menu li a:hover{

    color:#0c3d82;

}

/* Active Menu */

.nav-menu li.active a{

    color:#0c3d82;

}

/* Bottom Border */

.nav-menu li.active::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:3px;

    background:#0c3d82;

}

/* Hover Border */

.nav-menu li::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:0;

    height:3px;

    background:#0c3d82;

    transition:.35s;

}

.nav-menu li:hover::after{

    width:100%;

}

/*=========================
Dropdown
==========================*/

.dropdown-menu{

    position:absolute;

    top:100%;

    left:0;

    width:300px;

    background:#fff;

    list-style:none;

    border-radius:6px;

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

    padding:12px 0;

    opacity:0;

    visibility:hidden;

    transform:translateY(15px);

    transition:.35s;

}

.dropdown:hover .dropdown-menu{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.dropdown-menu li{

    width:100%;

}

.dropdown-menu li::after{

    display:none;

}

.dropdown-menu li a{

    padding:12px 22px;

    font-size:14px;

    color:#333;

}

.dropdown-menu li a:hover{

    background:#0c3d82;

    color:#fff;

    padding-left:28px;

}

/*=========================
Quote Button
==========================*/

.quote-btn{

    display:inline-block;

    background:#082b63;

    color:#fff;

    text-decoration:none;

    padding:13px 22px;

    border-radius:4px;

    font-size:13px;

    font-weight:600;

    transition:.35s;

    white-space:nowrap;
	
	margin-left: 35px;

}

.quote-btn:hover{

    background:#0e438f;

}

/*=========================
Hamburger
==========================*/

.menu-toggle{

    display:none;

    font-size:28px;

    cursor:pointer;

    color:#082b63;

}


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

@media (max-width:1200px){

    .nav-menu{
        gap:20px;
    }

    .nav-menu li a{
        font-size:12px;
    }

    .logo img{
        width:240px;
    }

}

@media (max-width:991px){

    .main-header .container{

        height:75px;

    }

    .logo img{

        width:210px;

    }

    .menu-toggle{

        display:block;

        z-index:1001;

    }

    .header-btn{

        display:none;

    }

    .navbar{

        position:fixed;

        top:75px;

        left:-100%;

        width:320px;

        height:calc(100vh - 75px);

        background:#fff;

        overflow-y:auto;

        transition:.4s;

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

    }

    .navbar.active{

        left:0;

    }

    .nav-menu{

        flex-direction:column;

        align-items:flex-start;

        gap:0;

    }

    .nav-menu li{

        width:100%;

        border-bottom:1px solid #ececec;

    }

    .nav-menu li a{

        width:100%;

        padding:16px 20px;

        justify-content:space-between;

    }

    .nav-menu li::after{

        display:none;

    }

}

@media (max-width:991px){

.dropdown-menu{

    position:static;

    width:100%;

    opacity:1;

    visibility:visible;

    transform:none;

    box-shadow:none;

    border-radius:0;

    display:none;

    padding:0;

}

.dropdown.active .dropdown-menu{

    display:block;

}

.dropdown-menu li{

    border:none;

}

.dropdown-menu li a{

    background:#f8f8f8;

    padding-left:35px;

    font-size:13px;

}

.dropdown-menu li a:hover{

    padding-left:42px;

}

}

@media (max-width:576px){

.logo img{

    width:180px;

}

.navbar{

    width:100%;

}

}



/*=====================================
Hero Section
======================================*/
.hero {
    position: relative;
    min-height: 620px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

/* Background Slider */
.hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-bg img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: heroSlider 15s infinite;
}

/* 3 Images */
.hero-bg img:nth-child(1) {
    animation-delay: 0s;
}

.hero-bg img:nth-child(2) {
    animation-delay: 5s;
}

.hero-bg img:nth-child(3) {
    animation-delay: 10s;
}

/* Smooth Fade */
@keyframes heroSlider {

    0% {
        opacity: 0;
    }

    5% {
        opacity: 1;
    }

    30% {
        opacity: 1;
    }

    35% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

/* Dark Overlay */
.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    z-index: 1;
}

/* Content */
.hero .container {
    position: relative;
    z-index: 2;
    max-width: 1320px;
    margin: auto;
    padding: 0 15px;
}










.hero{

    position:relative;

    background:url("../images/hero-banner.jpg") center center/cover no-repeat;

    min-height:620px;

    display:flex;

    align-items:center;

    overflow:hidden;

}

/* Dark Overlay */

.hero::before{

    content:"";

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.45);

}

.hero .container{

    position:relative;

    z-index:2;

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/* Layout */

.hero-content{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:60px;

}

/* Left Side */

.hero-left{

    width:55%;

}

.hero-left h1{

    color:#fff;

    font-size:56px;

    font-weight:700;

    line-height:1.15;

    text-transform:uppercase;

    margin-bottom:25px;

}

.hero-left p{

    color:#ffffff;

    font-size:20px;

    line-height:1.8;

    max-width:700px;

    margin-bottom:40px;

}

/* Buttons */

.hero-btn{

    display:flex;

    gap:18px;

    flex-wrap:wrap;

}

.btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:16px 28px;

    text-decoration:none;

    font-weight:600;

    font-size:15px;

    border-radius:6px;

    transition:.35s;

}

.btn i{

    font-size:16px;

}

/* Blue Button */

.btn-blue{

    background:#082b63;

    color:#fff;

}

.btn-blue:hover{

    background:#114796;

}

/* White Button */

.btn-white{

    background:#fff;

    color:#082b63;

}

.btn-white:hover{

    background:#f3f3f3;

}

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

.hero-right{

    width:35%;

    display:flex;

    justify-content:flex-end;

}

/* Feature Card */

.feature-box{

    width:360px;

    background:rgba(8,43,99,.88);

    backdrop-filter:blur(8px);

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

    border-radius:12px;

    padding:18px 25px;

    box-shadow:0 15px 40px rgba(0,0,0,.35);

}

/* Single Item */

.feature{

    display:flex;

    align-items:center;

    gap:18px;

    padding:18px 0;

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

}

.feature:last-child{

    border-bottom:none;

}

/* Icon */

.feature i{

    width:52px;

    height:52px;

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

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:22px;

    flex-shrink:0;

}

/* Heading */

.feature h4{

    color:#fff;

    font-size:18px;

    font-weight:600;

    margin-bottom:5px;

}

/* Text */

.feature p{

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

    font-size:14px;

    line-height:1.5;

}

/* Hover */

.feature:hover i{

    background:#fff;

    color:#082b63;

    transition:.3s;

}

.feature:hover h4{

    color:#ffffff;

}

.feature:hover{

    transform:translateX(5px);

    transition:.3s;

}

@media(max-width:992px){

.hero-content{

    flex-direction:column;

}

.hero-left{

    width:100%;

}

.hero-right{

    width:100%;

    justify-content:center;

    margin-top:40px;

}

.feature-box{

    width:100%;

    max-width:420px;

}

}

@media(max-width:576px){

.feature-box{

    padding:15px;

}

.feature{

    gap:15px;

}

.feature i{

    width:45px;

    height:45px;

    font-size:18px;

}

.feature h4{

    font-size:16px;

}

.feature p{

    font-size:13px;

}

}

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

.stats-section{

    position:relative;

    left:50%;

    transform:translateX(-50%);

    bottom:40px;

    width:90%;

    max-width:1250px;

    background:#fff;

    border-radius:10px;

    display:grid;

    grid-template-columns:repeat(6,1fr);

    box-shadow:0 12px 35px rgba(0,0,0,.15);

    z-index:50;

    overflow:hidden;

}

/* Single Box */

.stat-box{

    display:flex;

    align-items:center;

    gap:16px;

    padding:28px 20px;

    border-right:1px solid #ececec;

}

.stat-box:last-child{

    border-right:none;

}

/* Icon */

.stat-box i{

    font-size:34px;

    color:#082b63;

}

/* Number */

.stat-text h3{

    font-size:36px;

    color:#082b63;

    font-weight:700;

    margin-bottom:5px;

}

/* Label */

.stat-text span{

    display:block;

    color:#333;

    font-size:13px;

    font-weight:600;

    line-height:1.6;

    text-transform:uppercase;

}

@media(max-width:1200px){

.stats-section{

    grid-template-columns:repeat(3,1fr);

}

}

@media(max-width:768px){

.stats-section{

    position:relative;

    left:0;

    bottom:0;

    transform:none;

    width:100%;

    margin-top:40px;

    grid-template-columns:repeat(2,1fr);

}

.stat-box{

    border-bottom:1px solid #eee;

}

}

@media(max-width:576px){

.stats-section{

    grid-template-columns:1fr;

}

.stat-box{

    border-right:none;

}

.stat-text h3{

    font-size:28px;

}

}




/*=====================================
Industries Section
======================================*/

.industries{

    padding:40px 0 70px;

    background:#ffffff;

}

.industries .container{

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/*=========================
Section Title
==========================*/

.section-title{

    text-align:center;

    margin-bottom:45px;

}

.section-title h2{

    font-size:38px;

    font-weight:700;

    color:#082b63;

    text-transform:uppercase;

    position:relative;

    display:inline-block;

    padding-bottom:18px;

}

.section-title h2::after{

    content:"";

    position:absolute;

    width:70px;

    height:4px;

    background:#082b63;

    left:50%;

    transform:translateX(-50%);

    bottom:0;

    border-radius:5px;

}

/*=========================
Grid
==========================*/

.industry-grid{

    display:grid;

    grid-template-columns:repeat(11,1fr);

    gap:8px;

}

/*=========================
Single Box
==========================*/

.industry-item{

    background:#fff;

    border:1px solid #e8e8e8;

    border-radius:8px;

    text-align:center;

    padding:22px 12px;

    transition:.35s;

    cursor:pointer;

    box-shadow:0 2px 10px rgba(0,0,0,.04);

}

.industry-item img{

    width:85px;

    height:85px;

    object-fit:contain;

    margin-bottom:0;

}

.industry-item h4{

    font-size:12px;

    font-weight:600;

    color:#222;

}

/* Hover */

.industry-item:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.12);

    border-color:#082b63;

}

.industry-item:hover h4{

    color:#082b63;

}

.industry-item:hover img{

    transform:scale(1.08);

    transition:.35s;

}

/*=========================
Button
==========================*/

.industry-btn{

    text-align:center;

    margin-top:35px;

}

.industry-btn .btn-primary{

    display:inline-block;

    background:#082b63;

    color:#fff;

    text-decoration:none;

    padding:15px 38px;

    border-radius:5px;

    font-size:15px;

    font-weight:600;

    transition:.35s;

}

.btn-primary:hover{

    background:#114796;

}

/*=========================
Laptop
==========================*/

@media(max-width:1200px){

.industry-grid{

    grid-template-columns:repeat(6,1fr);

}

}

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

@media(max-width:992px){

.section-title h2{

    font-size:32px;

}

.industry-grid{

    grid-template-columns:repeat(4,1fr);

}

}

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

@media(max-width:768px){

.industry-grid{

    grid-template-columns:repeat(3,1fr);

}

}

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

@media(max-width:576px){

.section-title h2{

    font-size:26px;

}

.industry-grid{

    grid-template-columns:repeat(2,1fr);

}

.industry-item{

    padding:18px 10px;

}

.industry-item img{

    width:42px;

    height:42px;

}

.industry-item h4{

    font-size:14px;

}

.btn-primary{

    width:100%;

    padding:14px;

}

}



 
 
 
 
 /*=========================================
Products Section
=========================================*/

.products-section{

    background:#082b63;

    padding:70px 0;

    position:relative;

}

.products-section .container{

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/*=========================
Heading
==========================*/

.products-section .section-title{

    text-align:center;

    margin-bottom:45px;

}

.products-section .section-title h2{

    color:#fff;

    font-size:36px;

    font-weight:700;

    text-transform:uppercase;

    position:relative;

    display:inline-block;

    padding-bottom:15px;

}

.products-section .section-title h2::after{

    content:"";

    width:70px;

    height:3px;

    background:#ffffff;

    position:absolute;

    left:50%;

    bottom:0;

    transform:translateX(-50%);

}

/*=========================
Swiper
==========================*/

 
.productSlider{
  width:100%;

    overflow:hidden;
}
.swiper{

    width:100%;

}
.swiper-wrapper{

    display:flex;

}
.swiper-slide{

    height:auto;

}
/*=========================
Product Card
==========================*/

.product-card{

    background:#fff;

    border-radius:8px;

    overflow:hidden;

    transition:.35s;

    box-shadow:0 8px 20px rgba(0,0,0,.15);

   display:flex;

    flex-direction:column;

    height:100%;
	text-align: center;

}

.product-card:hover{

    transform:translateY(-8px);

}

/*=========================
Image
==========================*/

.product-card img{

    width:100%;

    height:170px;

    object-fit:cover;

    transition:.4s;

}

.product-card:hover img{

    transform:scale(1.08);

}

/*=========================
Content
==========================*/

.product-content{

    padding:18px;

}

.product-content h3{

    font-size:15px;

    color:#082b63;

    margin-bottom:12px;

    font-weight:700;

}

.product-content p{

    color:#444;

    font-size:15px;

    line-height:1.7;

    margin-bottom:18px;

    min-height:75px;

}

.product-content a{

    text-decoration:none;

    color:#082b63;

    font-weight:700;

    font-size:14px;

    transition:.3s;

}

.product-content a:hover{

    color:#0d56bf;

}

/*=========================
Button
==========================*/

.product-btn{

    text-align:center;

    margin-top:35px;

}

.product-btn a{

    background:#fff;

    color:#082b63;

    padding:15px 35px;

    border-radius:5px;

    text-decoration:none;

    font-weight:700;

    transition:.3s;

}

.product-btn a:hover{

    background:#0d56bf;

    color:#fff;

}

.swiper-button-next,
.swiper-button-prev{

    width:48px;

    height:48px;

    border-radius:50%;

    background:#ffffff;

    color:#082b63;

    box-shadow:0 5px 15px rgba(0,0,0,.20);

}

.swiper-button-next::after,
.swiper-button-prev::after{

    font-size:18px;

    font-weight:bold;

}

.swiper-button-next:hover,
.swiper-button-prev:hover{

    background:#082b63;

    color:#fff;

}

@media(max-width:1200px){

.product-card img{

    height:160px;

}

}

@media(max-width:768px){

.products-section{

    padding:50px 0;

}

.products-section .section-title h2{

    font-size:28px;

}

.product-content h3{

    font-size:18px;

}

.product-content p{

    font-size:14px;

}

.productSlider{

    padding:5px 20px 25px;

}

}


/*==================================
Product Heading
===================================*/

.product-heading{

    text-align:center;

    margin-bottom:40px;

}

.product-heading h2{

    position:relative;

    display:inline-block;

    font-size:42px;

    font-weight:700;

    color:#ffffff;

    text-transform:uppercase;

    letter-spacing:.5px;

    line-height:1;

    padding-bottom:18px;

    margin:0;

}

/* Underline */

.product-heading h2::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:0;

    transform:translateX(-50%);

    width:58px;

    height:4px;

    background:#ffffff;

    border-radius:30px;

}

@media(max-width:992px){

.product-heading h2{

    font-size:34px;

}

}

@media(max-width:768px){

.product-heading{

    margin-bottom:30px;

}

.product-heading h2{

    font-size:28px;

    padding-bottom:15px;

}

.product-heading h2::after{

    width:50px;

    height:3px;

}

}

@media(max-width:480px){

.product-heading h2{

    font-size:24px;

}

}

.product-heading h2{

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

}



/*=========================================
Wire Recommendation Section
=========================================*/

.wire-section{

    padding:80px 0;

    background:#f8f9f8;

}

.wire-section .container{

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

.wire-wrapper{

    display:grid;

    grid-template-columns:485px 240px 1fr;

    border:1px solid #e5e5e5;

    border-radius:8px;

    background:#fff;

    overflow:hidden;

}

/*==================================
Left Form
==================================*/

.wire-form{

    padding:22px;

    border-right:1px solid #ececec;

}

.wire-form h2{

    font-size:22px;

    color:#082b63;

    font-weight:700;

    line-height:1.3;

    margin-bottom:10px;

    text-transform:uppercase;

}

.wire-form p{

    font-size:15px;

    color:#666;

    line-height:1.7;

    margin-bottom:25px;

}

.wire-form form{

    display:flex;

    flex-direction:column;

    gap:15px;

}

.wire-form select{

    width:100%;

    height:48px;

    border:1px solid #dcdcdc;

    border-radius:4px;

    padding:0 15px;

    font-size:14px;

    outline:none;

    background:#fff;

    cursor:pointer;

}

.wire-form select:focus{

    border-color:#082b63;

}

.wire-form button{

    margin-top:10px;

    height:50px;

    background:#082b63;

    color:#fff;

    border:none;

    border-radius:5px;

    font-size:15px;

    font-weight:600;

    cursor:pointer;

    transition:.3s;

}

.wire-form button:hover{

    background:#114796;

}

.wire-form button i{

    margin-left:8px;

}

/*==================================
Image
==================================*/

.wire-image{

    display:block;

    justify-content:center;

    align-items:center;

    padding: 12px;
    margin-top: 70px;

   

}

.wire-image img{

    width:100%;

    max-width:260px;

    transition:.4s;

}

.wire-image img:hover{

    transform:scale(1.05);

}

/*==================================
Content
==================================*/

.wire-content{

    padding:35px;

}

.wire-content span{

    font-size:13px;

    color:#082b63;

    font-weight:700;

    letter-spacing:.5px;

}

.wire-content h3{

    margin:10px 0 25px;

    font-size:34px;

    color:#082b63;

    font-weight:700;

}

/*==================================
Table
==================================*/

.wire-content table{

    width:100%;

    border-collapse:collapse;

    margin-bottom:30px;

}

.wire-content table td{

    padding:10px 0;

    font-size:15px;

    border-bottom:1px solid #eee;

}

.wire-content table td:first-child{

    font-weight:600;

    color:#333;

    width:180px;

}

.wire-content table td:last-child{

    color:#555;

}

/*==================================
Button
==================================*/

.wire-content .quote-btn{

    display:inline-block;

    background:#082b63;

    color:#fff;

    padding:14px 35px;

    border-radius:5px;

    text-decoration:none;

    font-weight:600;

    margin-bottom:30px;

    transition:.3s;

}

.wire-content .quote-btn:hover{

    background:#114796;

}

/*==================================
Features
==================================*/

.wire-content ul{

    list-style:none;

    padding:0;

    margin:0;

}

.wire-content ul li{

    display:flex;

    align-items:center;

    gap:12px;

    padding:10px 0;

    font-size:15px;

    color:#444;

}

.wire-content ul li i{

    color:#082b63;

    font-size:18px;

}

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

@media(max-width:992px){

.wire-wrapper{

    grid-template-columns:1fr;

}

.wire-form,
.wire-image{

    border-right:none;

    border-bottom:1px solid #eee;

}

.wire-image{

    padding:30px;

}

}

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

@media(max-width:576px){

.wire-section{

    padding:50px 0;

}

.wire-form,
.wire-content{

    padding:20px;

}

.wire-form h2{

    font-size:22px;

}

.wire-content h3{

    font-size:24px;

}

.wire-content table td{

    font-size:14px;

}

.wire-content .quote-btn{

    width:100%;

    text-align:center;

}

}


 
 
 
 /*==========================
Right Area
==========================*/

.wire-info{

    display:grid;

    grid-template-columns:1.2fr .8fr;

    height:100%;

}

/*==========================
Specification
==========================*/

.wire-spec{

    padding:50px 0px;

    border-right:1px solid #ececec;

}

.sub-title{

    display:block;

    font-size:12px;

    font-weight:700;

    color:#082b63;

    letter-spacing:1px;

    margin-bottom:12px;

}

.wire-spec h3{

    font-size:22px;

    color:#082b63;

    margin-bottom:25px;

    font-weight:700;

}

.wire-spec table{

    width:100%;

    border-collapse:collapse;
	
	border: none;
    text-align: left;

}

.wire-spec td{

    padding:9px 0;

    font-size:15px;

}

.wire-spec td:first-child{

    font-weight:700;

    color:#082b63;

   

}

.wire-spec td:last-child{

    color:#555;

}

/*==========================
Features
==========================*/

.wire-feature{

    display:block;

    align-items:center;

    justify-content:center;

    padding:50px 10px;

}

.wire-feature ul{

    list-style:none;

    padding:0;

    margin:0;

    width:100%;

}

.wire-feature li{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:30px;

    color:#1d2d50;

    font-size:15px;

    font-weight:500;

}

.wire-feature li:last-child{

    margin-bottom:0;

}

.wire-feature i{

    color:#0b3473;

    font-size:22px;

}

/*====================================
Large Laptop
====================================*/

@media(max-width:1400px){

.wire-wrapper{

    grid-template-columns:320px 240px 1fr;

}

.wire-spec h3{

    font-size:30px;

}

}


/*====================================
Laptop
====================================*/

@media(max-width:1200px){

.wire-wrapper{

    grid-template-columns:300px 220px 1fr;

}

.wire-form,
.wire-spec,
.wire-feature{

    padding:25px;

}

.wire-form h2{

    font-size:24px;

}

.wire-spec h3{

    font-size:28px;

}

}


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

@media(max-width:992px){

.wire-wrapper{

    grid-template-columns:1fr;

}

.wire-form{

    border-right:none;

    border-bottom:1px solid #eee;

}

.wire-image{

    border-right:none;

    border-bottom:1px solid #eee;

    padding:30px;

}

.wire-image img{

    max-width:260px;

}

.wire-info{

    grid-template-columns:1fr;

}

.wire-spec{

    border-right:none;

    border-bottom:1px solid #eee;

}

.wire-feature{

    justify-content:flex-start;

}

}


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

@media(max-width:768px){

.wire-section{

    padding:50px 0;

}

.wire-form,
.wire-spec,
.wire-feature{

    padding:20px;

}

.wire-form h2{

    font-size:22px;

    line-height:1.4;

}

.wire-form p{

    font-size:14px;

}

.wire-form select{

    height:46px;

    font-size:14px;

}

.wire-form button{

    width:100%;
	

}

.wire-image{

    padding:20px;
	margin-top: 0;

}

.wire-image img{

    max-width:220px;

}

.wire-spec h3{

    font-size:24px;

}

.wire-spec table td{

    font-size:14px;

    padding:8px 0;

}

.wire-feature li{

    font-size:14px;

    margin-bottom:18px;

}

.quote-btn{

    width:100%;

    text-align:center;
	margin-left: 0;

}

}


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

@media(max-width:576px){

.wire-wrapper{

    border-radius:6px;

}

.wire-form h2{

    font-size:20px;

}

.wire-spec h3{

    font-size:22px;

}

.wire-image img{

    width:180px;

}

.wire-spec table{

    display:block;

    width:100%;

}

.wire-spec table tr{

    display:flex;

    justify-content:space-between;

    border-bottom:1px solid #eee;

    padding:10px 0;

}

.wire-spec table td{

    border:none;

    padding:0;

}

.wire-feature li{

    font-size:13px;

}

}


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

@media(max-width:400px){

.wire-form,
.wire-spec,
.wire-feature{

    padding:15px;

}

.wire-form h2{

    font-size:18px;

}

.wire-form p{

    font-size:13px;

}

.wire-image img{

    width:150px;

}

.wire-spec h3{

    font-size:20px;

}

.wire-spec table tr{

    flex-direction:column;

    gap:5px;

}

.wire-feature li{

    font-size:12px;

}

}

.btn2{
margin-left: 0;
padding: 13px 60px;
margin-top: 10px;
}



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

.why-choose{

    padding:80px 0;

    background:#f8f9f8;

}

.choose-grid{

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:18px;

}

.choose-item{

    display:flex;

    align-items:flex-start;

    gap:15px;

    background:#fff;

    border:1px solid #e8e8e8;

    border-radius:8px;

    padding:20px;

    transition:.35s;

}

.choose-item:hover{

    transform:translateY(-8px);

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

    border-color:#0b3473;

}

.choose-icon{

    flex-shrink:0;

}

.choose-icon img{

    width:42px;

    height:42px;

}

.choose-content h4{

    font-size:17px;

    color:#082b63;

    margin-bottom:8px;

    font-weight:700;

}

.choose-content p{

    font-size:14px;

    color:#666;

    line-height:1.6;

}


/* Large Laptop */

@media(max-width:1400px){

.choose-grid{

    grid-template-columns:repeat(3,1fr);

}

}

/* Tablet */

@media(max-width:992px){

.choose-grid{

    grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:576px){

.choose-grid{

    grid-template-columns:1fr;

}

.choose-item{

    padding:18px;

}

.choose-icon img{

    width:36px;

    height:36px;

}

.choose-content h4{

    font-size:16px;

}

.choose-content p{

    font-size:13px;

}

}



/*=========================================
Factory & Global
=========================================*/

.factory-global{

    display:grid;

    grid-template-columns:1fr 1fr;

}

.factory-box,
.global-box{

   position:relative;

    overflow:hidden;

    height:300px;

    margin:0;

    padding:0;


}

.factory-box img,
.global-box img{

    display:block;

    width:100%;

    height:100%;

    object-fit:cover;

}

.factory-box:hover img,
.global-box:hover img{

    transform:scale(1.08);

}

/* Overlay */

.overlay{

    position:absolute;

    inset:0;

   

}

/* Content */

.factory-content{

    position:absolute;

    inset:0;

    display:flex;

    align-items:center;

    padding:40px;

    color:#fff;

    z-index:2;

}

.factory-text{

    margin-left:30px;

}

.factory-text h2{

    font-size:38px;

    margin-bottom:12px;

    font-weight:700;

}

.factory-text p{

    font-size:17px;

    line-height:1.8;

    margin-bottom:25px;

}

/* Play Button */

.play-btn{

    width:90px;

    height:90px;

    border:3px solid #fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:34px;

    text-decoration:none;

    transition:.35s;

}

.play-btn:hover{

    background:#fff;

    color:#082b63;

}

/* Right */

.global-content{

    position:absolute;

    top:50%;

    left:50px;

    transform:translateY(-50%);

    z-index:2;

    color:#fff;

}

.global-content h2{

    font-size:36px;

    margin-bottom:10px;

}

.global-content p{

    font-size:18px;

    margin-bottom:30px;

}

/* Buttons */

.white-btn{

    display:inline-block;

    background:#fff;

    color:#082b63;

    padding:14px 34px;

    border-radius:5px;

    text-decoration:none;

    font-weight:700;

}

.blue-btn{

    display:inline-block;

    background:#082b63;

    color:#fff;

    padding:14px 34px;

    border-radius:5px;

    text-decoration:none;

    font-weight:700;

}

.white-btn:hover,
.blue-btn:hover{

    opacity:.9;

}


@media(max-width:992px){

.factory-global{

    grid-template-columns:1fr;

}

.factory-box,
.global-box{

    min-height:320px;

}

}

@media(max-width:768px){

.factory-content{

    flex-direction:column;

    justify-content:center;

    text-align:center;

}

.factory-text{

    margin:20px 0 0;

}

.play-btn{

    width:70px;

    height:70px;

    font-size:26px;

}

.factory-text h2,
.global-content h2{

    font-size:28px;

}

.global-content{

    left:30px;

}

}

@media(max-width:576px){

.factory-box,
.global-box{

    min-height:260px;

}

.factory-content{

    padding:20px;

}

.global-content{

    left:20px;

    right:20px;

}

.white-btn,
.blue-btn{

    width:100%;

    text-align:center;

}

}


.factory-global{

 display:grid;

    grid-template-columns:repeat(2,1fr);

    width:100%;

    margin:0;

    padding:0;

    gap:0;

}


@media(max-width:1200px){

.factory-content,
.global-content{

    padding:35px;

}

.factory-text h2,
.global-content h2{

    font-size:32px;

}

.play-btn{

    width:75px;

    height:75px;

}

}


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

.footer{

    background:#06265a;

    color:#ffffff;

    padding:60px 0 0;

}

.footer .container{

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/*=========================================
GRID
=========================================*/

.footer-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1fr 1fr 1.4fr;

    gap:35px;

    padding-bottom:40px;

}

/*=========================================
HEADINGS
=========================================*/

.footer h3{

    font-size:18px;

    font-weight:700;

    margin-bottom:22px;

    color:#ffffff;

    text-transform:uppercase;

    position:relative;

}

.footer h3::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:35px;

    height:2px;

    background:#ffffff;

}

/*=========================================
ABOUT
=========================================*/

.footer-logo{

    width:220px;

    margin-bottom:20px;

}

.footer-about p{

    color:#d8d8d8;

    line-height:1.8;

    font-size:15px;

    margin-bottom:25px;

}

/*=========================================
SOCIAL
=========================================*/

.social-icons{

    display:flex;

    gap:12px;

}

.social-icons a{

    width:42px;

    height:42px;

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

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    text-decoration:none;

    transition:.35s;

}

.social-icons a:hover{

    background:#ffffff;

    color:#06265a;

    transform:translateY(-4px);

}

/*=========================================
LINKS
=========================================*/

.footer-links ul,
.footer-contact ul{

    list-style:none;

    margin:0;

    padding:0;

}

.footer-links li{

    margin-bottom:12px;

}

.footer-links a{

    color:#d8d8d8;

    text-decoration:none;

    transition:.3s;

    font-size:15px;

}

.footer-links a:hover{

    color:#ffffff;

    padding-left:6px;

}

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

.footer-contact li{

    display:flex;

    gap:12px;

    color:#d8d8d8;

    line-height:1.8;

    margin-bottom:18px;

    font-size:15px;

}

.footer-contact i{

    color:#ffffff;

    margin-top:5px;

    min-width:18px;

}

/*=========================================
BOTTOM
=========================================*/

.footer-bottom{

    border-top:1px solid rgba(255,255,255,.15);

    padding:18px 0;

    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:15px;

}

.footer-bottom p{

    margin:0;

    color:#d8d8d8;

    font-size:14px;

}

.footer-policy{

    display:flex;

    align-items:center;

    gap:12px;

}

.footer-policy a{

    color:#d8d8d8;

    text-decoration:none;

    font-size:14px;

}

.footer-policy a:hover{

    color:#ffffff;

}

/*=========================
Large Laptop
=========================*/

@media(max-width:1200px){

.footer-grid{

    grid-template-columns:repeat(3,1fr);

}

}

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

@media(max-width:992px){

.footer-grid{

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

}

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

@media(max-width:768px){

.footer{

    padding-top:45px;

}

.footer-grid{

    grid-template-columns:1fr;

}

.footer-logo{

    width:180px;

}

.footer-bottom{

    flex-direction:column;

    text-align:center;

}

}

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

@media(max-width:480px){

.footer h3{

    font-size:17px;

}

.footer-about p,
.footer-links a,
.footer-contact li{

    font-size:14px;

}

.social-icons{

    justify-content:center;

}

.footer-policy{

    flex-direction:column;

    gap:8px;

}

}


.footer-grid > div{

    position:relative;

    padding-right:25px;

}

.footer-grid > div:not(:last-child)::after{

    content:"";

    position:absolute;

    right:0;

    top:0;

    width:1px;

    height:100%;

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

}

@media(max-width:1200px){

.footer-grid > div::after{

    display:none;

}

}


/*==================================
Product Banner
===================================*/

.product-banner{

    position:relative;

    background:url(../images/hero-banner.jpg) center center/cover no-repeat;

    padding:90px 0;

    overflow:hidden;

}

.product-banner::before{

    content:"";

    position:absolute;

    inset:0;

    background:rgba(5,25,65,.55);

}

.product-banner .container{

    position:relative;

    z-index:2;

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/*=========================
Breadcrumb
=========================*/

.breadcrumb{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:22px;

}

.breadcrumb a{

    color:#ffffff;

    text-decoration:none;

    font-size:15px;

    transition:.3s;

}

.breadcrumb a:hover{

    color:#cbd8ff;

}

.breadcrumb span{

    color:#ffffff;

    font-size:15px;

}

/*=========================
Title
=========================*/

.product-banner h1{

    color:#ffffff;

    font-size:42px;

    font-weight:700;

    margin-bottom:18px;

    line-height:1.2;

}

/*=========================
Underline
=========================*/

.title-line{

    width:55px;

    height:4px;

    background:#58a8ff;

    border-radius:20px;

}


/* Laptop */

@media(max-width:1200px){

.product-banner{

    padding:75px 0;

}

.product-banner h1{

    font-size:46px;

}

}

/* Tablet */

@media(max-width:992px){

.product-banner{

    padding:65px 0;

}

.product-banner h1{

    font-size:38px;

}

}

/* Mobile */

@media(max-width:768px){

.product-banner{

    padding:55px 0;

}

.breadcrumb{

    gap:8px;

}

.breadcrumb a,
.breadcrumb span{

    font-size:14px;

}

.product-banner h1{

    font-size:30px;

}

.title-line{

    width:45px;

    height:3px;

}

}

/* Small Mobile */

@media(max-width:480px){

.product-banner{

    padding:45px 0;

}

.product-banner h1{

    font-size:24px;

}

.breadcrumb{

    font-size:13px;

}

}



/*==================================
PRODUCT DETAILS
===================================*/

.product-details{

    padding:80px 0;

    background:#ffffff;

}

.product-details .container{

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/*==================================
Layout
===================================*/

.product-wrapper{

    display:grid;

    grid-template-columns:48% 48%;

    justify-content:space-between;

    align-items:start;

    gap:40px;

}

/*==================================
LEFT SIDE
===================================*/

.product-gallery{

    width:100%;

}

/* Main Image */

.main-image{

    position:relative;

    border:1px solid #e6e6e6;

    border-radius:10px;

    overflow:hidden;

    background:#fff;

}

.main-image img{

    width:100%;

    display:block;

    transition:.4s;

}

.main-image:hover img{

    transform:scale(1.04);

}

/* Zoom */

.zoom-btn{

    position:absolute;

    top:15px;

    right:15px;

    width:42px;

    height:42px;

    background:#fff;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    box-shadow:0 4px 15px rgba(0,0,0,.12);

    cursor:pointer;

    color:#082B63;

}

/*==================================
Thumbnail
===================================*/

.thumb-slider{

    margin-top:22px;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:14px;

}

.thumb-prev,
.thumb-next{

    width:40px;

    height:40px;

    border-radius:50%;

    border:1px solid #ddd;

    background:#fff;

    cursor:pointer;

    transition:.3s;

}

.thumb-prev:hover,
.thumb-next:hover{

    background:#082B63;

    color:#fff;

}

.thumbs{

    display:flex;

    gap:15px;

}

.thumbs img{

    width:90px;

    height:90px;

    border-radius:8px;

    object-fit:cover;

    border:2px solid transparent;

    cursor:pointer;

    transition:.3s;

}

.thumbs img:hover{

    transform:translateY(-5px);

}

.thumbs img.active{

    border-color:#082B63;

}

/*==================================
RIGHT SIDE
===================================*/

.product-info h2{

   text-transform: uppercase;
    font-size: 32px;

    color:#082B63;

    margin-bottom:15px;

    font-weight:700;

}

.title-line{

    width:55px;

    height:4px;

    background:#3d8bfd;

    border-radius:20px;

    margin-bottom:25px;

}

.product-info p{

    font-size:16px;

    color:#555;

    line-height:1.9;

    margin-bottom:30px;

}

/*==================================
Table
===================================*/

.spec-table{

    width:100%;

    border-collapse:collapse;

    margin-bottom:35px;

}

.spec-table td{

    border:1px solid #ececec;

    padding:16px 18px;

    font-size:15px;

}

.spec-table td:first-child{

    width:38%;

    font-weight:700;

    color:#082B63;

}

.spec-table td:last-child{

    color:#444;

}

/*==================================
Buttons
===================================*/

.product-btns{

    display:flex;

    gap:18px;

}

.btn-primary{

    flex:1;

    background:#082B63;

    color:#fff;

    text-decoration:none;

    height:60px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:6px;

    font-weight:600;

    transition:.3s;

}

.btn-primary:hover{

    background:#0d3b85;

}

.btn-outline{

    flex:1;

    border:2px solid #082B63;

    color:#082B63;

    text-decoration:none;

    height:60px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:6px;

    font-weight:600;

    transition:.3s;

}

.btn-outline:hover{

    background:#082B63;

    color:#fff;

}

.btn-primary i,
.btn-outline i{

    margin-right:10px;

}

/*=========================
Laptop
=========================*/

@media(max-width:1200px){

.product-info h2{

    font-size:40px;

}

}

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

@media(max-width:992px){

.product-wrapper{

    grid-template-columns:1fr;

}

.product-info{

    margin-top:20px;

}

}

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

@media(max-width:768px){

.product-details{

    padding:60px 0;

}

.product-info h2{

    font-size:30px;

}

.product-info p{

    font-size:15px;

}

.product-btns{

    flex-direction:column;

}

.btn-primary,
.btn-outline{

    width:100%;
	padding: 10px 0px;

}

.thumbs{

    gap:10px;

}

.thumbs img{

    width:70px;

    height:70px;

}

}

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

@media(max-width:480px){

.product-info h2{

    font-size:26px;

}

.spec-table td{

    padding:12px;

    font-size:14px;

}

.thumb-slider{

    gap:8px;

}

.thumbs img{

    width:60px;

    height:60px;

}

}


.image-popup{

    position:fixed;

    left:0;

    top:0;

    width:100%;

    height:100%;

    background:rgba(0,0,0,.9);

    display:none;

    justify-content:center;

    align-items:center;

    z-index:9999;

}

.image-popup img{

    max-width:90%;

    max-height:90%;

}

.close-popup{

    position:absolute;

    top:30px;

    right:40px;

    color:#fff;

    font-size:45px;

    cursor:pointer;

}

/*=====================================
PRODUCT FEATURES
======================================*/

.product-features{

    padding:0px 0 50px 0px;

    background:#fff;

}
.product-features h2 {
    text-transform: uppercase;
    font-size: 32px;
    color: #082B63;
    margin-bottom: 15px;
    font-weight: 700;
}
.feature-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    border:1px solid #e7e7e7;

    border-radius:10px;

    overflow:hidden;

    background:#f9f9fa;

}

.feature-item{

    display:flex;

    align-items:center;

    gap:18px;

    padding:28px;

    position:relative;

    transition:.35s;

}

.feature-item:not(:last-child){

    border-right:1px solid #e7e7e7;

}

.feature-item:hover{

    background:#f8fbff;

}

.feature-icon{

    width:60px;

    min-width:60px;

}

.feature-icon img{

    width:100%;

    display:block;

}

.feature-content h4{

    font-size:18px;

    color:#082B63;

    font-weight:700;

    margin-bottom:8px;

    line-height:1.3;

}

.feature-content p{

    font-size:15px;

    color:#666;

    line-height:1.7;

    margin:0;

}

/*==========================
Laptop
==========================*/

@media(max-width:1200px){

.feature-grid{

    grid-template-columns:repeat(2,1fr);

}

.feature-item:nth-child(2){

    border-right:none;

}

.feature-item:nth-child(-n+2){

    border-bottom:1px solid #e7e7e7;

}

}

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

@media(max-width:768px){

.feature-grid{

    grid-template-columns:1fr;

}

.feature-item{

    border-right:none !important;

    border-bottom:1px solid #e7e7e7;

}

.feature-item:last-child{

    border-bottom:none;

}

}

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

@media(max-width:480px){

.product-features{

    padding:40px 0;

}

.feature-item{

    padding:20px;

    gap:15px;

}

.feature-icon{

    width:50px;

    min-width:50px;

}

.feature-content h4{

    font-size:16px;

}

.feature-content p{

    font-size:14px;

}

}


.a-content{
}

.a-content h2{
text-transform: uppercase;
    font-size: 32px;
    color: #082B63;
    margin-bottom: 15px;
    font-weight: 700;
}

.a-content p{
    font-size: 16px;
    color: #555;
    line-height: 1.9;
    margin-bottom: 30px;
}

table{
width:100%;
}

/*=========================================
CONTACT PAGE BANNER
=========================================*/

.contact-banner{

    position:relative;

    width:100%;

    min-height:340px;

    display:flex;

    align-items:center;

    background:url("../images/hero-banner.jpg") center center/cover no-repeat;

    overflow:hidden;

}

.contact-banner::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(90deg,
    rgba(3,20,55,.92) 0%,
    rgba(3,20,55,.78) 35%,
    rgba(3,20,55,.30) 100%);

}

.contact-banner .container{

    position:relative;

    z-index:2;

    max-width:1320px;

    margin:auto;

    padding:0 15px;

    width:100%;

}

.contact-banner-content{

    max-width:570px;

}

.contact-banner h1{

    color:#fff;

    font-size:42px;

    font-weight:700;

    margin-bottom:18px;

    line-height:1.2;

}

.breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:18px;

}

.breadcrumb a{

    color:#ffffff;

    text-decoration:none;

    font-size:16px;

}

.breadcrumb span{

    color:#ffffff;

    font-size:15px;

}

.title-line{

    width:55px;

    height:4px;

    background:#4ea3ff;

    border-radius:30px;

    margin-bottom:28px;

}

.contact-banner p{

    color:#ffffff;

    font-size:15px;

    line-height:1.8;

    max-width:570px;

}

/*==========================
Laptop
==========================*/

@media(max-width:1200px){

.contact-banner{

    min-height:300px;

}

.contact-banner h1{

    font-size:48px;

}

.contact-banner p{

    font-size:18px;

}

}

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

@media(max-width:992px){

.contact-banner{

    min-height:260px;

}

.contact-banner h1{

    font-size:40px;

}

.contact-banner p{

    font-size:17px;

}

}

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

@media(max-width:768px){

.contact-banner{

    min-height:240px;

}

.contact-banner-content{

    max-width:100%;

}

.contact-banner h1{

    font-size:32px;

}

.contact-banner p{

    font-size:15px;

    line-height:1.7;

}

.breadcrumb{

    gap:8px;

    flex-wrap:wrap;

}

}

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

@media(max-width:480px){

.contact-banner{

    min-height:210px;

}

.contact-banner h1{

    font-size:28px;

}

.contact-banner p{

    font-size:14px;

}

.title-line{

    width:45px;

}

}



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

.contact-section{

    padding:80px 0;

    background:#ffffff;

}

.contact-section .container{

    max-width:1320px;

    margin:auto;

    padding:0 15px;

}

/*=========================================
Layout
=========================================*/

.contact-wrapper{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:30px;

}

/*=========================================
Common Box
=========================================*/

.contact-form-box,
.contact-info-box{

    background:#ffffff;

    border:1px solid #e8e8e8;

    border-radius:12px;

    padding:35px;

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

}

/*=========================================
Heading
=========================================*/

.contact-form-box h2,
.contact-info-box h2{

    color:#082B63;

    font-size:34px;

    font-weight:700;

    margin-bottom:15px;

}

.heading-line{

    width:55px;

    height:4px;

    background:#2f7cff;

    border-radius:20px;

    margin-bottom:25px;

}

.contact-form-box p{

    color:#555;

    font-size:16px;

    line-height:1.8;

    margin-bottom:35px;

}

/*=========================================
FORM
=========================================*/

.form-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:20px;

}

.form-group{

    margin-bottom:20px;

}

.form-group input,
.form-group textarea{

    width:100%;

    padding:17px 18px;

    border:1px solid #dddddd;

    border-radius:8px;

    font-size:15px;

    transition:.3s;

    outline:none;

    font-family:inherit;

    background:#fff;

}

.form-group textarea{

    resize:vertical;

    min-height:170px;

}

.form-group input:focus,
.form-group textarea:focus{

    border-color:#0b3b88;

    box-shadow:0 0 0 3px rgba(11,59,136,.08);

}

/*=========================================
Checkbox
=========================================*/

.checkbox-area{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:30px;

    font-size:15px;

}

.checkbox-area input{

    width:18px;

    height:18px;

}

.checkbox-area a{

    color:#0b3b88;

    text-decoration:none;

    font-weight:600;

}

/*=========================================
Button
=========================================*/

.contact-btn{

    background:#082B63;

    color:#fff;

    border:none;

    height:58px;

    padding:0 35px;

    border-radius:6px;

    font-size:16px;

    font-weight:600;

    cursor:pointer;

    transition:.3s;

}

.contact-btn i{

    margin-left:10px;

}

.contact-btn:hover{

    background:#0b3b88;

}

/*=========================================
CONTACT INFO
=========================================*/

.info-item{

    display:flex;

    gap:18px;

    margin-bottom:28px;

    align-items:flex-start;

}

.info-icon{

    width:55px;

    height:55px;

    border-radius:50%;

    background:#f4f7fc;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#082B63;

    font-size:22px;

    flex-shrink:0;

}

.info-content h4{

    font-size:20px;

    color:#082B63;

    margin-bottom:8px;

}

.info-content p{

    color:#555;

    line-height:1.8;

    margin:0;

}

/*=========================================
MAP
=========================================*/

.map-title{

    margin:30px 0 18px;

    color:#082B63;

    font-size:24px;

    font-weight:700;

}

.map-box{

    border-radius:10px;

    overflow:hidden;

    border:1px solid #ddd;

}

.map-box iframe{

    width:100%;

    height:280px;

    border:0;

    display:block;

}


/*==================================
1200px
==================================*/

@media(max-width:1200px){

.contact-form-box,
.contact-info-box{

    padding:30px;

}

}

/*==================================
992px
==================================*/

@media(max-width:992px){

.contact-wrapper{

    grid-template-columns:1fr;

}

}

/*==================================
768px
==================================*/

@media(max-width:768px){

.contact-section{

    padding:60px 0;

}

.form-grid{

    grid-template-columns:1fr;

}

.contact-form-box h2,
.contact-info-box h2{

    font-size:28px;

}

.info-content h4{

    font-size:18px;

}

.contact-btn{

    width:100%;

}

.map-box iframe{

    height:250px;

}

}

/*==================================
480px
==================================*/

@media(max-width:480px){

.contact-form-box,
.contact-info-box{

    padding:22px;

}

.contact-form-box h2,
.contact-info-box h2{

    font-size:24px;

}

.contact-form-box p{

    font-size:14px;

}

.form-group input,
.form-group textarea{

    padding:15px;

    font-size:14px;

}

.info-item{

    gap:12px;

}

.info-icon{

    width:45px;

    height:45px;

    font-size:18px;

}

.info-content h4{

    font-size:16px;

}

.info-content p{

    font-size:14px;

}

.map-title{

    font-size:20px;

}

.map-box iframe{

    height:220px;

}

}



.pro-spec table {
    border-collapse: collapse;
    border: #CCC solid 1px;
    text-align: center;
    font-size: 14px;
}

.pro-spec tr, td {
    width: 5%;
    padding: 5px;
}

.floating-buttons {
  position: fixed;
  bottom: 25px;
  right: 10px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  z-index: 999;
}

/* Common Button Styles */
.floating-buttons a {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 24px;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  animation: pulse 1.5s infinite;
  transition: transform 0.3s ease;
}

.floating-buttons a:hover {
  transform: scale(1.1);
}

/* WhatsApp Button */
.whatsapp {
  background-color: #25d366;
}

/* Call Button */
.call {
  background-color: #0084ff;
}

 

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  }
  70% {
    box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
  }
}

/* Different color pulse for call button */
.call {
  animation: pulseCall 1.5s infinite;
}

@keyframes pulseCall {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 132, 255, 0.7);
  }
  70% {
    box-shadow: 0 0 0 15px rgba(0, 132, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(0, 132, 255, 0);
  }
}


.pt-space{
padding: 60px 0 0 0px;
}

/* ==============================
   VIDEO POPUP
================================= */

.video-modal {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .85);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.video-modal.active {
    display: flex;
}

.video-popup {
    position: relative;
    width: 900px;
    max-width: 100%;
    background: #000;
    border-radius: 10px;
    overflow: visible;
    box-shadow: 0 20px 60px rgba(0,0,0,.5);
}

.video-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
}

.video-wrapper iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: none;
    border-radius: 10px;
}

.video-close {
    position: absolute;
    top: -45px;
    right: 0;

    width: 38px;
    height: 38px;

    border: none;
    border-radius: 50%;

    background: #fff;
    color: #082b63;

    font-size: 28px;
    line-height: 1;

    cursor: pointer;
    z-index: 10;

    transition: .3s;
}

.video-close:hover {
    background: #082b63;
    color: #fff;
}

.flag-col{
width: 20%;
    float: left;
    margin-bottom: 70px;
}
.flag-col img{
border: #e3e3e3 solid 1px;
    padding: 5px;
}

#formMessage {
    margin-top: 20px;
}

.success-message {
    padding: 15px 20px;
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
    border-radius: 5px;
    font-size: 15px;
}

.error-message {
    padding: 15px 20px;
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    border-radius: 5px;
    font-size: 15px;
}

 #recommendationMessage {
        width: 100%;
        margin-top: 15px;
        padding: 15px 20px;
        border-radius: 5px;
        font-size: 15px;
        line-height: 1.5;
        box-sizing: border-box;
    }

    .recommendation-success {
        background-color: #d4edda !important;
        color: #155724 !important;
        border: 1px solid #c3e6cb !important;
    }

    .recommendation-error {
        background-color: #f8d7da !important;
        color: #721c24 !important;
        border: 1px solid #f5c6cb !important;
    }

    #recommendationBtn:disabled {
        opacity: 0.7;
        cursor: not-allowed;
    }

@media(max-width:576px){
.hero-left h1 {
    color: #fff;
    font-size: 50px;
    padding-top: 60px;
}
.stats-section {
	width: 90%;
    margin: 40px 25px;
}
.wire-spec table td {
width: auto;
}
.wire-spec tbody{
width: auto;
display:block;
}
.factory-global {
grid-template-columns: repeat(1, 1fr);
}
.play-btn {
      display: block;
}
.footer-policy {
        flex-direction: initial;
  }
 .hero-right {
       margin-bottom: 40px;
  }    
}