/* ================= HOME BANNER ================= */
.home-banner{
    width:100%;
    overflow:hidden;
  }
  
  /* banner image */
  .banner-item img{
    width:100%;
    /*height:75vh;*/
    height: auto;
    object-fit:cover;
    display:block;
  }
  
  /* dots position */
  .banner-carousel .owl-dots{
    position:absolute;
    bottom:20px;
    left:50%;
    transform:translateX(-50%);
  }
  
  .banner-carousel .owl-dot span{
    background:#fff !important;
    opacity:.5;
  }
  
  .banner-carousel .owl-dot.active span{
    background:var(--brand) !important;
    opacity:1;
  }
  
.banner-item {
  position: relative;
}

.explore-btn {
  position: absolute;
      top: 77%;
    left: 10%;
  transform: translate(-50%, -50%);
  background-color: #ff4d4d; /* Button color */
  color: #fff;
  padding: 12px 22px;
  font-size: 18px;
  font-weight: 600;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.explore-btn:hover {
  background-color: #e60000;
}
.explore-btn2 {
  position: absolute;
       top: 94%;
    left: 59%;
  transform: translate(-50%, -50%);
  background-color: #ff4d4d; /* Button color */
  color: #fff;
  padding: 10px 20px;
  font-size: 18px;
  font-weight: 600;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.explore-btn2:hover {
  background-color: #e60000;
}
@media (max-width: 1024px) {

  /* Banner image proper fit */
  .banner-item img {
    width: 100%;
    height: auto;          
    object-fit: contain; 
  }

  /* First button */
  .explore-btn {
    top: 75%;
    left: 11%;
    transform: translate(-50%, -50%);
    padding: 8px 19px;
    font-size: 16px;
  }

  /* Second button */
  .explore-btn2 {
    top: 91%;
    left: 60%;
    transform: translate(-50%, -50%);
    padding: 8px 19px;
    font-size: 16px;
  }

}
/*@media (max-width: 992px) {*/
/*    .container {*/
/*        max-width: 960px;*/
/*    }*/
/*}*/
/* ===== FIX FOR <= 991px ONLY ===== */
@media (max-width: 991px) {

  /* Banner image proper fit */
  .banner-item img {
    width: 100%;
    height: auto;          
    object-fit: contain; 
  }

  /* First button */
  .explore-btn {
    top: 75%;
    left: 10%;
    transform: translate(-50%, -50%);
    padding: 8px 16px;
    font-size: 13px;
  }

  /* Second button */
  .explore-btn2 {
    top: 91%;
    left: 59%;
    transform: translate(-50%, -50%);
    padding: 8px 14px;
    font-size: 13px;
  }

}

@media (max-width: 768px) {
    .banner-item img {
    height: auto !important; 
    object-fit: cover;
  }
  .explore-btn {
  position: absolute;
  top: 73%;
  left: 11%;
  transform: translate(-50%, -50%);
  background-color: #e45555; 
  color: #fff;
         padding: 6px 9px;
        font-size: 14px;
  font-weight: 600;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}


.explore-btn2 {
         position: absolute;
         top: 91%;
        left: 61%;
        transform: translate(-50%, -50%);
        background-color: #e45555;
        color: #fff;
                padding: 6px 11px;
        font-size: 14px;
        font-weight: 600;
        border-radius: 30px;
        text-decoration: none;
        transition: 0.3s;
}



}

@media (max-width: 568px) {
    .banner-item img {
    height: auto !important; 
    object-fit: cover;
  }
  .explore-btn {
  position: absolute;
  top: 73%;
  left: 13%;
  transform: translate(-50%, -50%);
  background-color: #e45555; 
  color: #fff;
  padding: 3px 8px;
  font-size: 8px;
  font-weight: 600;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.explore-btn:hover {
  background-color: #e60000;
}
.explore-btn2 {
         position: absolute;
         top: 91%;
        left: 61%;
        transform: translate(-50%, -50%);
        background-color: #e45555;
        color: #fff;
        padding: 3px 7px;
        font-size: 7px;
        font-weight: 600;
        border-radius: 30px;
        text-decoration: none;
        transition: 0.3s;
}


.explore-btn2:hover {
  background-color: #e60000;
}

.ps-img img {
    width: 100%;
    object-fit: cover;
    display: block;
    height: 260px !important;
}
}
  /* ================= ABOUT US SECTION ================= */
.about-us{
    padding: 70px 0;
    background:#fff;
  }
  
  .about-content p{
    font-size: 16px;
    line-height: 1.75;
    color: #3c4555;
    max-width: 560px;
  }
  
  /* button like screenshot (outlined pill) */
  .about-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding: 10px 22px;
    border-radius: 999px;
    border: 2px solid #111;
    color:#111;
    text-decoration:none;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: .6px;
    transition: all .25s ease;
  }
  .about-btn:hover{
    background: var(--brand);
    border-color: var(--brand);
    color:#fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(238,70,34,.25);
  }
  
  /* highlights */
  .about-points{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
  }
  .about-points .point{
    display:flex;
    align-items:center;
    gap:8px;
    padding: 10px 14px;
    border-radius: 14px;
    background: #f7f8fb;
    border: 1px solid #eef1f4;
    font-weight: 700;
    color:#1a1f2b;
    transition: transform .2s ease, box-shadow .2s ease;
  }
  .about-points .point i{
    color: var(--brand);
    font-size: 18px;
  }
  .about-points .point:hover{
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0,0,0,.06);
  }
  
  /* image card */
  .about-image-wrap{
    background:#ffffff;
    border-radius: 24px;
    padding: 18px;
    border: 1px solid #eef1f4;
    box-shadow: 0 18px 35px rgba(0,0,0,.06);
  }
  
  .about-image{
    width:100%;
    height:auto;
    display:block;
    border-radius: 18px;
    object-fit: contain;
  }
  .section-heading{
    font-size: 52px;
    font-weight: 700;
    color: #1a1f2b;     /* dark text */
    line-height: 1.15;
    margin-bottom: 30px;
  }
  .section-heading span{
    color: var(--brand);   /* orange highlight */
  }

  /* ================= PRODUCTS SHOWCASE ================= */
.products-showcase{
    background:#2f3a40; /* dark */
    padding: 70px 0;
    overflow:hidden;
  }
  
  /* left side */
  .ps-left .ps-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--brand);
    color: #fff;
    font-weight: 700;
    padding: 6px 18px;
    border-radius: 999px;
    font-size: 18px;
    margin-bottom: 22px;
}
  
  .ps-title{
    color:#fff;
    font-size: 52px;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 16px;
  }
  .ps-title span{
    color: var(--brand);
  }
  
  .ps-desc{
    color: rgba(255,255,255,.78);
    font-size: 16px;
    line-height: 1.7;
    max-width: 360px;
  }
  
  /* slider spacing */
  .ps-slider .owl-stage-outer{
    padding: 10px 0 40px;
  }
  
  /* card */
  .ps-card{
    background:#fff;
    border-radius: 28px;
    padding: 18px 18px 22px;
    box-shadow: 0 18px 35px rgba(0,0,0,.18);
    position: relative;
    min-height: 420px;
  }
  
  .ps-img{
    border-radius: 18px;
    overflow:hidden;
    background:#f3f4f6;
  }
  .ps-img img {
    width: 100%;
     object-fit: cover; 
    display: block;
    height: 340px;
}
  
  /* text */
  .ps-card h4{
    margin: 16px 0 10px;
    font-size: 18px;
    color:#111827;
  }
  .ps-card p{
    font-size: 16px;
    line-height: 1.7;
    color:#374151;
    margin-bottom: 18px;
  }
  
  /* button */
  .ps-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: 10px 18px;
    border-radius: 999px;
    background: var(--brand);
    color:#fff;
    font-weight: 700;
    font-size: 16px;
    letter-spacing:.6px;
    text-decoration:none;
    transition: transform .2s ease, box-shadow .2s ease;
  }
  .ps-btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 14px 24px rgba(238,70,34,.30);
    color:#fff;
  }
  
  /* floating arrow like screenshot */
  .ps-float-arrow{
    position:absolute;
    right:-18px;
    top: 55%;
    transform: translateY(-50%);
    width: 46px;
    height: 46px;
    border-radius: 999px;
    background: var(--brand);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    box-shadow: 0 14px 24px rgba(238,70,34,.32);
  }
  .ps-float-arrow:hover{
    color:#fff;
    filter: brightness(.98);
  }
  
  /* owl dots like screenshot */
 .ps-slider .owl-dots {
    position: absolute;
    bottom: -22px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 8px;
}
  .ps-slider .owl-dot span{
    width: 10px !important;
    height: 10px !important;
    background: rgba(255,255,255,.35) !important;
  }
  .ps-slider .owl-dot.active span{
    background: #fff !important;
  }
  /* ================= OWL NAV CUSTOM ================= */
.ps-slider .owl-nav{
    position:absolute;
    top:50%;
    right:-24px;               /* card ke bahar */
    transform:translateY(-50%);
  }
  
  .ps-slider .owl-nav button{
    width:48px;
    height:48px;
    border-radius:50%;
    background:var(--brand) !important;
    color:#fff !important;
    border:none !important;
    box-shadow:0 14px 24px rgba(238,70,34,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform .2s ease, filter .2s ease;
  }
  
  /* hide PREV arrow (sirf right arrow chahiye) */
  .ps-slider .owl-nav .owl-prev{
    display:none;
  }
  
  .ps-slider .owl-nav button:hover{
    transform:scale(1.05);
    filter:brightness(.95);
  }
  
  .ps-slider .owl-nav i{
    font-size:20px;
    font-weight:700;
  }
  
  .about-content h2{
      font-size: 52px;
    }
    .about-content p{
      font-size: 16px;
    }
  .btn-arrow {
    font-size: 24px;
}

.owl-theme .owl-nav [class*=owl-] {
    border-radius: 30px;
}
/* ================= BLOGS SECTION ================= */
.blogs-sec{
    padding: 70px 0;
    background:#fff;
  }
  
  .blogs-head h2{
    font-size: 40px;
    font-weight: 700;
    color:#111827;
    margin-bottom: 8px;
  }
  .blogs-head p{
    max-width: 720px;
    margin: 0 auto 28px;
    color:#4b5563;
    line-height: 1.6;
    font-size: 15px;
  }
  
  /* card */
  .blog-card{
    background:#ececec;
    border-radius: 22px;
    overflow:hidden;
    padding: 16px;
  }
  
  .blog-img{
    position:relative;
    border-radius: 18px;
    overflow:hidden;
    background:#fff;
  }
  .blog-img img{
    width:100%;
    object-fit: cover;
    display:block;
  }
  
  /* date badge */
  .blog-date{
    position:absolute;
    left: 12px;
    bottom: 12px;
    background: var(--brand);
    color:#fff;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    font-weight: 700;
    line-height: 1.05;
  }
  .blog-date span{ font-size: 16px; }
  .blog-date small{ font-size: 16px; opacity:.95; }
  
  /* body */
  .blog-body{
    padding: 14px 6px 4px;
  }
  
  .blog-meta{
    display:flex;
    gap: 14px;
    flex-wrap:wrap;
    font-size: 16px;
    color:#374151;
    margin: 10px 0 10px;
  }
  .blog-meta i{
    color: var(--brand);
    margin-right: 6px;
  }
  
  .blog-body h4{
    font-size: 16px;
    font-weight: 700;
    line-height: 1.45;
    color:#111827;
    margin-bottom: 10px;
  }
  
  .blog-body p{
    font-size: 16px;
    line-height: 1.6;
    color:#374151;
    min-height: 80px;
  }
  
  /* explore button */
  .blog-btn{
    display:inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    border-radius: 999px;
    background: var(--brand);
    color:#fff;
    font-weight: 700;
    font-size: 16px;
    text-decoration:none;
    transition:.25s;
  }
  .blog-btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(238,70,34,.28);
    color:#fff;
  }
  
  /* owl dots */
  .blogs-slider .owl-dots{
    margin-top: 18px !important;
  }
  .blogs-slider .owl-dot span{
    width: 10px !important;
    height: 10px !important;
    background: rgba(17,24,39,.25) !important;
  }
  .blogs-slider .owl-dot.active span{
    background: var(--brand) !important;
  }
  
  /* bottom view more */
  .blogs-viewmore{
    display:inline-flex;
    padding: 10px 22px;
    border-radius: 999px;
    background: var(--brand);
    color:#fff;
    font-weight: 700;
    font-size: 16px;
    text-decoration:none;
    transition:.25s;
  }
  .blogs-viewmore:hover{
    color:#fff;
    transform: translateY(-2px);
    box-shadow: 0 14px 26px rgba(238,70,34,.32);
  }
  

  /* ================= COUNTER SECTION ================= */
  .counter-section{
    padding: 70px 280px 70px;
    background: url("../images/bg/counter-bg.png") center/cover no-repeat;
    position: relative;
    margin-bottom: 40px;
  }
  
  /* overlay for readability */
  .counter-section::before{
    content:"";
    position:absolute;
    inset:0;
    background: rgb(201 199 199 / 85%);
  }
  .counter-section .container{
    position: relative;
    z-index: 1;
  }
  
 
  
  /* icon circle */
  .counter-icon{
    width:120px;
    height:120px;
    margin: 0 auto 12px;
    border-radius:50%;
    background: var(--brand);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow: 0 12px 25px rgba(238,70,34,.35);
  }
  .counter-icon img {
    width: 90px;
    height: 90px;
    object-fit: contain;
}
  /* numbers */
  .counter-box h3{
    font-size: 36px;
    font-weight: 700;
    color:#111827;
    margin-bottom: 4px;
  }
  .counter-box p{
    font-size: 15px;
    font-weight: 600;
    color:#374151;
  }
  

/* ================= TESTIMONIALS (STATIC – NO SLIDER) ================= */
.testimonials-sec{
    background:#2f3a40;
    padding:70px 0;
  }
  
  /* LEFT SIDE */
  .t-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--brand);
    color:#fff;
    font-weight:700;
    padding:10px 18px;
    border-radius:999px;
    font-size: 16px;
    margin-bottom:18px;
  }
  
  .t-title{
    color:#fff;
    font-size:44px;
    font-weight:700; /* ✅ as you asked */
    line-height:1.1;
    margin-bottom:14px;
  }
  .t-title span{
    color:var(--brand);
  }
  
  .t-desc{
    color:rgba(255,255,255,.78);
    line-height:1.7;
    font-size:15.5px;
    max-width:380px;
  }
  
  /* ================= CARD DESIGN ================= */


  /* cut orange line from left till curve */
  .t-card::before{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:96px;
    height:96px;
    background:#fff;
    border-top-right-radius:96px;
    z-index:2;
  }
  
  /* content above */
  .t-card > *{
    position:relative;
    z-index:3;
  }
  
  /* avatar + stars */
  .t-avatar{
    display:flex;
    flex-direction:column;
    align-items:center;
    margin-bottom:10px;
  }
  .t-avatar img{
    width:38px;
    height:38px;
    object-fit:contain;
    margin-bottom:6px;
  }
  .t-stars{
    color:var(--brand);
    font-size:16px;
    letter-spacing:1px;
  }
  
  /* text */
  .t-card {
    background: #fff;
    position: relative;
    overflow: hidden;
    padding: 40px 54px 54px;
    border-radius: 60px 60px 2px 140px;
    box-shadow: 1px 4px 3px 0px #ee4622;
}

  /* name block */
  .t-name{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-top: 30px;
  }
  .t-name::before{
    content:"";
    width:3px;
    height:38px;
    background:#111;
    border-radius:3px;
    margin-top:2px;
  }
  .t-name strong{
    display:block;
    font-weight:700;
    font-size: 16px;
    color:#111827;
  }
  .t-name span{
    display:block;
    font-size: 16px;
    font-weight:700;
    color:var(--brand);
  }


  /* ================= DISCUSS / CONTACT SECTION ================= */
.discuss-sec{
    padding:70px 0;
    background:#fff;
  }
  
  /* Outer dark container */
  .discuss-wrap{
    background:#2f3a40;
    border-radius:18px;
    padding:22px;
    display:grid;
    grid-template-columns: 1fr 1.15fr;
    gap:22px;
    box-shadow:0 18px 40px rgba(0,0,0,.12);
  }
  
  /* ---------- LEFT PANEL ---------- */
  .discuss-left{
    color:#fff;
    border-radius:14px;
    padding:26px 22px;
  }
  
  .discuss-title{
    font-size:52px;
    font-weight:700;
    line-height:1.15;
    margin:0 0 26px;
  }
  .discuss-title span{ color:var(--brand); }
  
  .discuss-info{
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  
  .info-row{
    display:flex;
    align-items:flex-start;
    gap:12px;
    font-size: 16px;
    line-height:1.5;
    color:rgba(255,255,255,.85);
  }
  .info-ico{
    width:30px;
    height:30px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.08);
    flex:0 0 30px;
    margin-top:2px;
  }
  .info-ico i{
    color:#fff;
    font-size: 16px;
  }
  
  /* phone pill */
  .info-row-pill{
    border:1px solid rgba(255,255,255,.35);
    border-radius:12px;
    padding:10px 12px;
    width:fit-content;
  }
  
  /* ---------- RIGHT FORM CARD ---------- */
  .discuss-right{
    background:#dedede;
    border-radius:14px;
    padding:22px 22px;
  }
  
  .form-title{
    font-size:18px;
    font-weight:700;
    color:#111827;
    margin:0 0 12px;
  }
  
  /* tags row */
  .tag-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:18px;
  }
  
  .tag-btn{
    border:1.5px solid rgba(17,24,39,.55);
    background:transparent;
    color:#111827;
    padding:7px 10px;
    border-radius:10px;
    font-size: 16px;
    font-weight:700;
    cursor:pointer;
    transition:transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
  }
  .discuss-info span{
    font-size: 16px;
  }
 
  .tag-btn:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.55);
  }
  .tag-btn.active{
    background:#2f3a40;
    color:#fff;
    border-color:#2f3a40;
  }
  
  /* form fields */
  .discuss-form{
    margin-top:6px;
  }
  
  .f-group{
    margin-bottom:16px;
  }
  .f-group label{
    display:block;
    font-size: 16px;
    font-weight:700;
    color:#111827;
    margin-bottom:6px;
  }
  
  /* underline style inputs */
  .f-group input,
  .f-group textarea{
    width:100%;
    border:none;
    outline:none;
    background:transparent;
    border-bottom:1.5px solid rgba(17,24,39,.55);
    padding:8px 2px;
    font-size:13px;
    color:#111827;
    transition:border-color .2s ease;
  }
  .f-group textarea{
    resize:none;
    padding-top:10px;
  }
  
  .f-group input:focus,
  .f-group textarea:focus{
    border-bottom-color: var(--brand);
  }
  
  /* button */
  .send-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 18px;
    border-radius:10px;
    background:var(--brand);
    color:#fff;
    font-weight: 700;
    font-size: 16px;
    border:none;
    cursor:pointer;
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
  }
  .send-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 26px rgba(238,70,34,.30);
    filter:brightness(.98);
  }

  /* ---------- RESPONSIVE ---------- */

 
  /* ================= CTA STRIP ================= */
.cta-strip{
    background:#111;
  }
  
  .cta-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
  }
  
  .cta-box{
    position:relative;
        min-height: 250px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 80px 28px;
    overflow:hidden;
  }
  
  /* background images (replace with your images) */
  .cta-left{
    background:url("../images/bg/footer-2.png") center/cover no-repeat;
  }
  .cta-right{
    background:url("../images/bg/footer-img.png") center/cover no-repeat;
  }
  
  .cta-overlay{
    position:absolute;
    inset:0;
    background: rgba(0,0,0,.55);
  }
  
  .cta-content{
    position:relative;
    z-index:2;
    text-align:center;
    max-width: 420px;
  }
  
  .cta-content h3{
    color:#fff;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 6px;
  }
  
  .cta-content p{
    color: rgba(255,255,255,.85);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 14px;
  }
  
  .cta-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding: 8px 16px;
    border-radius: 999px;
    background: var(--brand);
    color:#fff;
    font-weight: 700;
    font-size: 11px;
    text-decoration:none;
    letter-spacing: .6px;
    transition: transform .2s ease, box-shadow .2s ease;
  }
  .cta-btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 14px 26px rgba(238,70,34,.30);
    color:#fff;
  }
  
  /* ================= FOOTER ================= */
  .site-footer{
    background:#2f3a40;
    color:#fff;
    padding: 35px 0 0;
  }
  
  .f-title{
    font-size:24px;
    font-weight:700;
    margin-bottom: 12px;
    color:#fff;
  }
  
  .f-text{
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255,255,255,.75);
    margin:0;
  }
  
  .f-list{
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:8px;
  }
  
  .f-list a{
    font-size: 16px;
    color: rgba(255,255,255,.75);
    text-decoration:none;
    transition: color .2s ease, transform .2s ease;
  }
  .f-list a:hover{
    color: var(--brand);
    transform: translateX(3px);
  }
  
  .f-contact{
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .f-contact li{
    font-size: 16px;
    line-height:1.6;
    color: rgba(255,255,255,.75);
    display:flex;
    gap:10px;
    align-items:flex-start;
  }
  .f-contact i{
    color: var(--brand);
    margin-top:2px;
  }
  
  /* bottom bar */
  .footer-bottom{
    margin-top: 25px;
    padding: 14px 0;
    border-top: 1px solid rgba(255,255,255,.12);
  }
  
  .copy-text{
    font-size: 16px;
    color: rgba(255,255,255,.65);
  }


/***About us****/
img {
  max-width: 100%;
  height: auto;
}

/* ===============================
   HERO / BANNER
================================ */
.hero {
  background: linear-gradient(135deg, #1f2c33, #273a43);
  color: #ffffff;
}

.hero h1 {
  font-size: 48px;
  font-weight: 700;
}

.hero h1 span {
  color: #ff4d1c;
}

.hero p {
  font-size: 17px;
  opacity: 0.9;
}

/* ===============================
   BADGE / SMALL TITLE
================================ */
.badge-custom {
  display: inline-block;
  background: #ff4d1c;
  color: #fff;
  padding: 8px 18px;
  border-radius: 30px;
  font-size: 14px;
  margin-bottom: 15px;
}

/* ===============================
   CARD STYLE
================================ */
.card-custom {
  background: #ffffff;
  border-radius: 16px;
  border: none;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.card-custom:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
}

/* ===============================
   ICONS
================================ */
.card-custom i,
.icon-box i {
  font-size: 36px;
  color: #ff4d1c;
}

.icon-box {
  padding: 30px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* ===============================
   MISSION / VISION
================================ */
.bg-light {
  background-color: #f7f9fb !important;
}

/* ===============================
   TIMELINE (OUR JOURNEY)
================================ */
.timeline {
  border-left: 4px solid #ff4d1c;
  padding-left: 25px;
}

.timeline-item {
  position: relative;
  margin-bottom: 35px;
}

.timeline-item::before {
  content: "";
  position: absolute;
  left: -12px;
  top: 5px;
  width: 16px;
  height: 16px;
  background: #ff4d1c;
  border-radius: 50%;
}

.timeline-item h5 {
  font-weight: 700;
  color: #ff4d1c;
  margin-bottom: 5px;
}

/* ===============================
   INDUSTRIES WE SERVE
================================ */
.icon-box h5 {
  margin-top: 12px;
  font-weight: 600;
}

/* ===============================
   WHY CHOOSE US
================================ */
.why-box {
  text-align: center;
}

.why-box h6 {
  margin-top: 12px;
  font-weight: 600;
}
.section-padding {
  padding: 80px 0;
}
/* ===============================
   CTA
================================ */
.cta {
  background: linear-gradient(135deg, #ff4d1c, #ff6a3d);
  color: #ffffff;
  text-align: center;
}

.cta h2 {
  font-weight: 700;
}

.cta a {
  display: inline-block;
  margin-top: 20px;
  padding: 14px 36px;
  background: #ffffff;
  color: #ff4d1c;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.3s;
}

.cta a:hover {
  background: #1f2c33;
  color: #ffffff;
}

/* ===============================
   RESPONSIVE
================================ */

/***About us***/
.breadcrumb-area {
  position: relative;
  background-image: url('../images/banner/1.jpg'); /* change image */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 80px 0;
}

/* Dark overlay */
.breadcrumb-area::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(31 40 51 / 88%);
}

.breadcrumb-area .container {
  position: relative;
  z-index: 2;
}

.breadcrumb-title {
  color: #fff;
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 10px;
}

/* Breadcrumb styling */
.breadcrumb {
  background: transparent;
  margin-bottom: 0;
}

.breadcrumb-item a {
  color: #d1d1d1;
  text-decoration: none;
  font-weight: 500;
}

.breadcrumb-item a:hover {
  color: #ffffff;
}

.breadcrumb-item.active {
  color: #ffffff;
  font-weight: 600;
}

/* Separator color */
.breadcrumb-item + .breadcrumb-item::before {
  color: #bfbfbf;
}
a.btn.btn-contact-rectangle {
  background: #ee4622;
  color: white;
  font-weight: 700;
  font-size: 18px;
  border-radius: 0;
  padding: 10px 24px;
}
a.btn.btn-contact-rectangle:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 25px rgba(238,70,34,.35);
  background-color:#1f2833;
  color:#fff;
}
/* Section background */
.usp-section {
  padding: 70px 0;
  background: #202a31; /* dark */
}

/* Headings */
.usp-head .usp-subtitle {
  color: #ffffff;
  font-size: 24px;
  font-weight: 600;
}

.usp-head .usp-title {
  color: #ee4622;
  font-size: 52px;
  font-weight: 700;
  line-height: 1.2;
}
/* Cards */
.usp-card {
  background: #f7f8f9;
  border-radius: 18px;
  padding: 26px 22px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.12);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.usp-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 35px rgba(0,0,0,0.30);
}

/* Icon area */
.usp-icon {
  width: 54px;
  height: 54px;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.usp-icon img {
  width: 100%;   /* change as needed */
  height: 100%; 
  object-fit: contain;
}

/* Text */
.usp-card-title {
  font-weight: 700;
  font-size: 18px;
  color: #121417;
  margin-bottom: 10px;
}

.usp-card-text {
  color: #4b5661;
  font-size: 16px;
  margin-bottom: 0;
}


.why-choose-sec{
  padding: 55px 0px;
  background: #fff;
}


.wc-badge-icon{
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255,255,255,0.22);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 800;
}

/* Title + text */
.wc-title {
  font-size: 52px;
  font-weight: 700;
  line-height: 1.15;
  color: #1b1f24;
}

.text-orange{ color: #ff3b1d; }

.wc-para {
  color: #040404;
  font-size: 16px;
}

/* Points */
.wc-points{
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.wc-point{
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.wc-icon{
  width: 54px;
  height: 54px;
  background: #ff3b1d;
  border-radius: 50%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 54px;
  box-shadow: 0 10px 22px rgba(255,59,29,0.22);
}

.wc-icon img{
  width: 28px;
  height: 28px;
  object-fit: contain;
  filter: brightness(0) invert(1); /* PNG white look */
}

.wc-info h5 {
  margin: 0 0 6px;
  font-weight: 700;
  font-size: 18px;
  color: #15181c;
}

.wc-info p {
  margin: 0;
  color: #030303;
  font-size: 16px;
}
/* Image */
.wc-img-wrap{
  border-radius: 26px;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(0,0,0,0.15);
}

.wc-img-wrap img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}


 /* Section Specific Styles */
 .mvv-container {
  padding-bottom: 70px;
  background-color: #ffffff;
}

.mvv-header {
  text-align: center;
  margin-bottom: 50px;
}

.mvv-header h1 {
  font-size: 52px;
  font-weight: 700;
  color: #1a202c;
  margin-bottom: 15px;
}

.mvv-header p {
  font-size: 16px;
  color: #333;
  max-width: 800px;
  margin: 0 auto;
  font-weight: 500;
}

/* Grid Layout */
.mvv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
}

.mvv-card {
  background: #f2f2f2;
  border-radius: 20px;
  padding: 30px;
  position: relative;
  box-shadow: 0 10px 0 rgba(0,0,0,0.12);
  border:1px solid rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
}

/* Decorative Line and Icon */
.card-top {
  position: relative;
  height: 80px;
  margin-bottom: 10px;
}

.card-title {
  font-size: 26px;
  font-weight: bold;
  position: absolute;
  top: 0;
}

.line-decorator {
position: absolute;
left: -30px;
top: 40px;
height: 22px;
width: 95%;
z-index: 1;
}

.icon-circle {
position: absolute;
right: 0;
top: 5px;
width: 80px;
height: 80px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
color: white;
font-size: 42px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.mvv-card p {
  font-size: 16px;
  color: #444;
  margin-top: 10px;
}

/* Colors Management */
.color-orange .card-title { color: #e85a2d; }
.color-orange .line-decorator, 
.color-orange .icon-circle { background-color: #e85a2d; }

.color-dark .card-title { color: #212529; }
.color-dark .line-decorator, 
.color-dark .icon-circle { background-color: #212529; }

/* Icons (using Unicode as fallback, use FontAwesome for better look) */
.icon-mission::before { content: '🎯'; }
.icon-vision::before { content: '👁️'; }
.icon-values::before { content: '🛡️'; }



/**********Conact us**************/
/* Top info cards */
.info-card {
  padding: 40px 10px;
  background: #ffffff;
  border: 1.5px solid #ff5a3c;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(16, 24, 40, 0.06);
}

.info-icn {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(255, 90, 60, 0.12);
  color: #ff5a3c;
  font-size: 18px;
}

/* Middle panel */
.contact-panel {
  margin: 50px 0px;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 10px 25px rgba(16, 24, 40, 0.06);
}

.contact-photo {
  min-height: 260px;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.10)),
    url("https://images.unsplash.com/photo-1521737604893-d14cc237f11d?auto=format&fit=crop&w=1200&q=60");
  background-size: cover;
  background-position: center;
}
.btn-orange {
  background: #ff5a3c;
  border-color: #ff5a3c;
  color: #fff;
  border-radius: 10px;
}
.btn-orange:hover {
  background: #e94b30;
  border-color: #e94b30;
  color: #fff;
}

/* Map */
.map-box {
  margin: 30px 0px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 10px 25px rgba(16, 24, 40, 0.06);
}
.map-box iframe {
  width: 100%;
  height: 320px;
  border: 0;
  display: block;
}

  /* mobile me arrow hide */
  @media(max-width: 768px){
        .mvv-grid { grid-template-columns: 1fr; }
  .wc-img-wrap {
    margin-top: 30px;
}
.about-us .ps-left {
  margin-top: 20px;
}
    .ps-slider .owl-nav{
      display:none;
    }
    .banner-item img{
      height:55vh;
    }
     .blogs-head h2{ font-size: 32px; }
    .blog-card{ min-height: auto; }
        .counter-box h3{ font-size: 30px; }
  
  .counter-section {
    padding: 70px 20px 70px;
  }
  .desktop-content{
    display: none;
  }
  .main-nav {
    padding: 0;
  }
  .brand-logo {
    width: 100px;
    height: auto;
}
 .hero h1 {
    font-size: 34px;
  }

  .test-head h2 {
    font-size: 32px;
  }
  }  

  
    /* responsive */
  @media (max-width: 992px){
      .container{
          padding:0px 18px;
      }
       .section-heading, .t-title, .mvv-header h1{ font-size:36px!important; }
    .discuss-wrap{
      grid-template-columns: 1fr;
    }
    .discuss-title{
      font-size:34px;
    }
     .cta-grid{ grid-template-columns: 1fr; }
    .cta-box{ min-height: 170px; }
     .wc-title{ font-size: 32px; }
    .about-content h2{
      font-size: 36px;
    }
    .about-us{
      padding: 55px 0;
    }
    .why-choose-sec {
      padding: 55px 0px;
    }
    .mvv-container {
      padding-top:0px;
  }
    .ps-title{ font-size: 40px; }
    .ps-desc{ max-width: 100%; }
    .ps-card{ min-height: auto; }
    .ps-float-arrow{ display:none; } /* mobile me hide */
  }
  @media (max-width: 576px){
    .products-showcase{ padding: 55px 0; }
    .ps-title{ font-size: 34px; }
      .discuss-sec{ padding:55px 0; }
    .discuss-wrap{ padding:16px; gap:16px; }
  
    .discuss-left{ padding:20px 16px; }
    .discuss-right{ padding:18px 16px; }
  
    .discuss-title{ font-size:30px; }
  
    .info-row{ font-size:13px; }
  
    .tag-btn{
      font-size:11.5px;
      padding:7px 9px;
    }
   
  .usp-head .usp-title {
    font-size: 28px;
  }

  }
  
 
  @media (max-width: 2560px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 2400px;
    }
}
@media (max-width: 1440px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
      max-width: 1230px;
  }
}

@media (max-width: 1240px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
      max-width: 960px;
  }
}




.pack-hero{
  position: relative;
  background: #fff;
  overflow: hidden;
}

.pack-title {
     font-size: 52px;
    line-height: 1.15;
    font-weight: 700;
    color: #111;
    /* letter-spacing: -0.3px; */
    margin: 0;
}

.pack-desc{
  font-size: 16px;
  line-height: 1.65;
  color: #5a5a5a;
  max-width: 520px;
}

.text-accent{ color: #f04b23; }

/* Button (bootstrap style but custom color) */
.btn-accent{
  background: #f04b23;
  border-color: #f04b23;
  color: #fff;
  font-weight: 600;
  border-radius: 8px;
}
.btn-accent:hover{
  background: #d83f1c;
  border-color: #d83f1c;
  color: #fff;
}

/* Image wrapper */
.pack-media{
  position: relative;
  max-width: 520px;
}
.pack-img{
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Bottom diagonal stripes (right aligned like sample) */
.pack-stripes{
  position: absolute;
  right: -40px;
  bottom: -26px;
  width: min(520px, 70vw);
  height: 90px;
  pointer-events: none;
  transform: rotate(-12deg);
  transform-origin: right bottom;
  display: flex;
  gap: 10px;
  align-items: flex-end;
  justify-content: flex-end;
}

.pack-stripes .stripe{
  display: block;
  height: 10px;
  border-radius: 999px;
  width: 38%;
}

/* hero image */
.faq-hero-img{
  max-height: 220px;
  object-fit: contain;
}

/* header bar */
.faq-bar{
  background:#e9e7e5;
  border-radius:14px;
  padding:16px 18px;
}
.faq-left{
  font-weight:700;
  color:#222;
  letter-spacing:.5px;
}
.faq-center{
  font-weight:700;
  color:#222;
}
.faq-cta-btn{
  background:#f04b23;
  color:#fff;
  border-radius:999px;
  padding:10px 16px;
  font-weight:700;
  font-size:16px;
}
.faq-cta-btn:hover{ background:#d83f1c; color:#fff; }

/* faq cards */
.faq-item{
  background:#fff;
  border-radius:12px;
  padding:0;
  box-shadow:0 10px 20px rgba(0,0,0,.06);
  overflow:hidden;
}
.faq-list{ display:flex; flex-direction:column; gap:14px; }

.faq-q{
  width:100%;
  border:0;
  background:transparent;
  padding:16px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  text-align:left;
  font-weight:700;
  color:#222;
}

.faq-ic{
  width:22px;
  height:22px;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#111827; /* dark */
  color:#fff;
  font-weight:700;
  line-height:1;
  flex:0 0 auto;
}

/* answer */
.faq-a{
  padding:0 16px 16px 16px;
  color:#606060;
  font-size:16px;
  line-height:1.6;
  display:none;
}
.faq-item.is-open .faq-a{ display:block; }
.faq-item.is-open .faq-ic{ background:#f04b23; }

.pack-stripes .s1{ background: #f0b323; } /* yellow */
.pack-stripes .s2{ background: #0aa84f; } /* green */
.pack-stripes .s3{ background: #e53935; } /* red */

/* Mobile tweaks */
@media (max-width: 991.98px){
    .pack-title {
     font-size: 32px;}
  .pack-media{ max-width: 520px; }
  .pack-stripes{
    right: -70px;
    bottom: -34px;
    height: 80px;
    transform: rotate(-10deg);
  }
}
section.product-list {
    background: #ededed;
    padding: 40px 0px;
}




.icon-box img{
  width:100%;
  height:auto;
}

/* Text */
.unbox-tag{
  color:#f24a1d;
      font-size: 24px;
  font-weight:600;
}

.unbox-title{
  font-size:clamp(26px,3vw,34px);
  font-weight:700;
  line-height:1.2;
  color:#1c1c1c;
}

.unbox-desc{
  font-size:16px;
  color:#555;
  max-width:620px;
}

/* Pills */
.tag-pill{
  background:#f24a1d;
  color:#fff;
  font-size:14px;
  padding:8px 14px;
  border-radius:999px;
  font-weight:500;
  white-space:nowrap;
}

.faqs-wrap {
    background: #e9e7e5;
    margin: 5px;
    padding-bottom: 60px;
    padding-top: 30px;
    border-radius: 14px;
}

.form-alert{
  padding: 12px 15px;
  margin-bottom: 15px;
  border-radius: 5px;
  font-size: 14px;
}

.form-alert.success{
  background: #e6fffa;
  color: #065f46;
  border: 1px solid #10b981;
}

.form-alert.error{
  background: #fee2e2;
  color: #7f1d1d;
  border: 1px solid #ef4444;
}
