/* ===== Root Colors ===== */
:root {
  --orange: #ec6e15;
  --green: #16a34a;
  --white: #ffffff;
  --black: #000;
}

/* ===== Navbar ===== */
.navbar {
  /* background: linear-gradient(90deg, var(--black), #000000); */
  padding: 0rem 2rem;
}

.navbar-brand {
  font-weight: bold;
  color: var(--orange) !important;
  font-size: 1.4rem;
}

.nav-link {
  color: var(--orange) !important;
  font-weight: 500;
  margin: 0 8px;
  transition: 0.3s;
}
.text-orange{
  color: var(--orange);
}

.nav-link:hover {
  color: var(--orange) !important;
}
.logo{
  max-width: 100px;
}

/* ===== Offcanvas ===== */
.offcanvas {
  /* background: var(--black); */
  color: var(--orange);
  width: 75% !important;
}

.offcanvas a {
  color: var(--orange);
  font-size: 1.1rem;
  margin: 10px 0;
  text-decoration: none;
}

.offcanvas a:hover {
  color: var(--orange);
}

/* ===== Button ===== */
.custom-btn {
  background: var(--orange);
  color: var(--white) !important;
  font-weight: 600;
  border-radius: 25px;
  padding: 6px 18px;
  transition: 0.3s;
  text-decoration: none;
}

.custom-btn:hover {
  background: var(--green);
  color: var(--white);
}

/* who we are */
.who-we-are{
  background-color: #189446;
}
.who-we-are h2 {
  color: #fff;
}

.who-we-are p {
  line-height: 1.7;
  font-size: 1rem;
  color: #fff;
}
.who-we-are .text-muted{
  color: #fff !important;
  font-size: 18px;
}
.who-we-are img {
  border-radius: 12px;
}
.who-we-are .btn{
  background-color: #fff !important;
  color: #000;
}
@media (max-width: 767px) {
    .who-we-are h2{
        text-align: center;
    }
    .who-we-are p{
        text-align: center;
    }
    .logo{
      max-width: 80px !important;
    }
     .who-we-are h3{
        text-align: center;
     }
     .center-btn{
        display: flex;
        justify-self: center;

     }
     .text-margin{
      position: relative;
      top: 12px;
     }
     .impact-title{
      font-size: 24px !important;
     }
     .container-pd{
      padding: 0px !important;
     }
     .impact-section{
      padding: 50px 20px !important;
     }
     .process-flow-section{
      padding: 25px 20px !important;
     }
     
.gallery-item img{
  display: flex;
  justify-self: center;
}
}

/* brands */
.brand-card {
  transition: transform 0.3s, box-shadow 0.3s;
}
.brand-card img{
  width: 60% !important;

}
.brand-card:hover {
  transform: translateY(-10px) scale(1.05);
  /* box-shadow: 0 20px 40px rgba(0,0,0,0.3); */
}
@media (max-width: 767px) {
  /* .carousel-inner .row {
    display: flex;
    flex-direction: column;
  } */

  .carousel-inner .row > .col-10 {
    width: 100%; /* Ensure each item takes full width */
    display: block;
    margin: 0 auto;
  }

  /* .carousel-item {
    display: flex;
    justify-content: center;
  } */

  .carousel-item .col-10 {
    width: 100%; 
  }
}


/* process */

.process-flow-section {
  background: #f9fbfd;
  padding: 60px 20px;
  text-align: center;
}

.process-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 50px;
  position: relative;
  display: inline-block;
}

.process-title::after {
  content: "";
  display: block;
  width: 60%;
  height: 3px;
  background: #2ecc71;
  margin: 8px auto 0;
  border-radius: 2px;
}

.process-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px;
}

.step-box {
  background: #ffffff;
  padding: 30px 25px;
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
  min-width: 220px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.step-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.12);
}

.step-icon {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #2ecc71, #27ae60);
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
  box-shadow: 0 4px 10px rgba(46, 204, 113, 0.4);
}

.step-arrow {
  width: 80px;
  height: 2px;
  background: #2ecc71;
  position: relative;
}

.step-arrow::after {
  content: "";
  position: absolute;
  right: -8px;
  top: -6px;
  border-left: 12px solid #2ecc71;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
}
@media (max-width: 767px) {
.step-arrow{
    width: 30px !important;
     transform: rotate(88deg) !important;
}
.step-arrow::after{
   top: -7px !important;
   
}
.banner-img {
    padding: 2% !important;
}

}
/* banner */
.banner-slide {
  min-height: 500px;
  background: url('images/bg.jpg');
}

.banner-img {
  height: auto;
  object-fit: cover;
  padding: 1%;
 

}

/* .banner-img img{
 width: 300px;
 height: auto;
} */
.banner-content {
  max-width: 500px;
}

.banner-title {
  font-size: 2.5rem;
  font-weight: bold;
  color: #1b5e20;
}

.banner-subtitle {
  font-size: 1.3rem;
  color: #388e3c;
  margin-bottom: 15px;
}

.banner-desc {
  font-size: 1rem;
  color: #555;
  line-height: 1.6;
}


/* impact section  */

.impact-section {
  background: linear-gradient(
      rgba(46, 125, 50, 0.9), 
      rgba(27, 94, 32, 0.9)
    ),
    url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?w=1920&h=800&fit=crop') center/cover no-repeat;
  color: #fff;
  padding: 80px 20px;
  text-align: center;
  position: relative;
}


.impact-title {
  font-size: 32px;
  font-weight: 800;
  margin-bottom: 20px;
}

.impact-subtitle {
  font-size: 16px;
  max-width: 850px;
  margin: 0 auto 50px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
}

.impact-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
}

.impact-card {
  background: #fff;
  color: #333;
  border-radius: 16px;
  padding: 30px 20px;
  min-width: 230px;
  max-width: 260px;
  text-align: center;
  box-shadow: 0 8px 18px rgba(0,0,0,0.15);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.impact-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.2);
}

.impact-badge {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #4CAF50;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: -50px auto 20px;
  box-shadow: 0 4px 10px rgba(76, 175, 80, 0.4);
}

.impact-badge.purple { background: #8e44ad; box-shadow: 0 4px 10px rgba(142, 68, 173, 0.4); }
.impact-badge.orange { background: #e67e22; box-shadow: 0 4px 10px rgba(230, 126, 34, 0.4); }
.impact-badge.blue   { background: #2980b9; box-shadow: 0 4px 10px rgba(41, 128, 185, 0.4); }

.impact-card h4 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}

.impact-quote {
  font-size: 14px;
  color: #555;
  font-style: italic;
}
/* footer */

.avha-footer {
  background:var(--green);
  color: #ffffff;
  padding: 70px 20px 25px;
  font-family: 'Segoe UI', sans-serif;
  position: relative;
  overflow: hidden;
  font-weight: bold;
}

.footer-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 50px;
  max-width: 1200px;
  margin: auto;
}

.footer-col h4 {
  font-size: 18px;
  margin-bottom: 18px;
  font-weight: 700;
  position: relative;
  padding-bottom: 8px;
}

.footer-col h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 40px;
  height: 3px;
  background: var(--green);
  border-radius: 2px;
}

.footer-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-col ul li {
  margin-bottom: 12px;
}

.footer-col ul li a {
  text-decoration: none;
  color: #ffffff;
  font-size: 15px;
  transition: color 0.3s, padding-left 0.3s;
  font-weight: bold;
}

.footer-col ul li a:hover {
  color: var(--black);
  padding-left: 5px;
}

.footer-logo {
  max-width: 160px;
  margin-bottom: 15px;
}

.footer-tagline {
  font-size: 14px;
  margin-bottom: 18px;
  opacity: 0.85;
}

.footer-socials a {
  margin: 0 8px;
  color: #eee;
  font-size: 18px;
  transition: color 0.3s, transform 0.3s;
}

.footer-socials a:hover {
  color: var(--black);
  transform: scale(1.2);
}

.footer-col p {
  font-size: 14px;
  margin: 10px 0;
  line-height: 1.6;
}

.footer-col p i {
  color: #ffcc00;
  margin-right: 10px;
}

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.2);
  margin-top: 50px;
  padding-top: 18px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 14px;
  color: #ddd;
  text-align: center;
}

.footer-bottom a {
  margin-left: 15px;
  text-decoration: none;
  color: #ccc;
  transition: color 0.3s;
}

.footer-bottom a:hover {
  color: var(--black);
}

/* faq section  */
/* FAQ Section */
.faq-container {
  max-width: 800px;
  margin: 50px auto;
  padding: 25px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0px 4px 12px rgba(0,0,0,0.08);
}

.faq-title {
  text-align: center;
  font-size: 26px;
  font-weight: 700;
  color: #012246;
  margin-bottom: 25px;
  position: relative;
}

.faq-title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: #012246;
  margin: 10px auto 0;
  border-radius: 3px;
}

.faq-item {
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
}

.faq-question {
  width: 100%;
  text-align: left;
  padding: 14px 18px;
  font-size: 17px;
  font-weight: 600;
  color: #333;
  background: #f8f9fb;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  outline: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background 0.3s ease;
}

.faq-question:hover {
  background: #eef2f9;
}

.faq-icon {
  font-size: 18px;
  color: #012246;
  font-weight: bold;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  padding: 0 18px;
  background: #fff;
  transition: max-height 0.4s ease, padding 0.3s ease;
  border-left: 3px solid #012246;
  margin-top: 5px;
  border-radius: 6px;
}

.faq-answer.show {
  max-height: 500px;
  padding: 15px 18px;
}

.faq-answer p {
  margin: 0;
  color: #555;
  line-height: 1.6;
}

/* gallery  */
.gallery-container {padding:40px;}
.gallery-item img {transition:transform .3s; cursor:pointer; height: 300px;}
.gallery-item img:hover {transform:scale(1.1);}
.video-item iframe {border-radius:12px;}

@media (max-width: 767px) {
  .gallery-item img{
    height: 200px !important;
  }  
  .banner-title{
    font-size: 1.7rem !important;
  }
  .navbar-toggler-icon{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28255,142,1, 0.9%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
  }
  .wizard-nav .step-indicator{
    font-size: 10px !important;
    padding: 0 !important;
    color: #000 !important;
  }
  .wizard-actions .btn-next{
    font-size: 10px;

  }
   .wizard-actions .btn-prev{
    font-size: 10px;
    
  }
   .wizard-actions .btn-submit{
    font-size: 10px;
    
  }
  .option-row{
    justify-content: center;
  }
  
}
.form-text-font{
    text-align: center !important;
    color: var(--orange) !important;
    font-size: 1.2rem !important;
font-weight: bold;
  }

/* blogs section  */
/* Container helpers */
.container{max-width:1200px;margin:auto;padding:24px}

/* Blog list */
.blog-head{font-size:32px;font-weight:800;margin:10px 0 24px;color:#0f172a; display: flex; justify-self: center;}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.blog-card{display:flex;flex-direction:column;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;text-decoration:none;background:#fff;transition:.25s box-shadow,.25s transform}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(2,6,23,.08)}
.blog-img{aspect-ratio:16/10;background:#f1f5f9}
.blog-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.blog-card:hover .blog-img img{transform:scale(1.06)}
.img-ph{display:flex;align-items:center;justify-content:center;color:#64748b;height:100%}
.blog-body{padding:14px 14px 16px}
.blog-body h3{font-size:18px;color:#0f172a;margin:0 0 6px;font-weight:700}
.blog-body p{color:#334155;font-size:14px;margin:0 0 8px;line-height:1.45}
.blog-meta{font-size:12px;color:#64748b}

/* Single post */
.post-hero{position:relative;text-align:center;margin-bottom:18px}
.post-cover{width:100%;border-radius:18px;max-height:440px;object-fit:cover}
.post-title{font-size:36px;margin:14px 0 4px;color:#0b1220;font-weight:800}
.post-date{color:#64748b}
.post-content{color:#1f2937;line-height:1.75;font-size:16px;margin-top:14px}
.post-content img{max-width:100%;border-radius:12px}

/* FAQs */
.post-faqs{margin-top:40px}
.post-faqs h2{font-size:24px;font-weight:800;margin-bottom:12px;color:#0f172a}
.faq-list{display:flex;flex-direction:column;gap:10px}
.faq-item{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff}
.faq-q{width:100%;text-align:left;padding:14px 16px;background:#0b1220;color:#fff;border:0;cursor:pointer;font-weight:700}
.faq-q.active{background:#4f46e5}
.faq-a{display:none;padding:14px 16px;background:#f8fafc;color:#0f172a}
.faq-a.show{display:block}

/* Responsive */
@media (max-width:600px){
  .post-title{font-size:28px}
  .card-service{
      position: relative !important;
   top: 0 !important;
   display: block !important;
   

}
}

/* contact us  */
/* Contact Section */
#contact-section{
padding-top: 3rem;
  padding-bottom: 3rem;
  }
#contact-section .card {
  border-radius: 12px;
  
}

#contact-section .card-body h5 {
  font-size: 1.2rem;
}

#contact-section .card-body p {
  font-size: 0.95rem;
}

/* Info Boxes (Address & Email) */
#contact-section .border {
  border-radius: 10px;
  background: #f9f9f9;
  transition: all 0.3s ease;
}

#contact-section .border:hover {
  background: #f1fdf6;
  transform: translateY(-3px);
}

/* Franchise Box */
#contact-section .bg-success.bg-opacity-10 {
  border-radius: 12px;
}

#contact-section .bg-success.bg-opacity-10:hover {
  background: #e9f9ef !important;
}

/* Form Styling */
#contact-section .form-control {
  border-radius: 8px;
  padding: 10px 12px;
}

#contact-section textarea {
  resize: none;
}

#contact-section button {
  border-radius: 8px;
  padding: 12px;
  font-size: 1rem;
  transition: all 0.3s ease;
}

#contact-section button:hover {
  background: #00994c;
  transform: scale(1.02);
}
.card-service{
      position: absolute;
    display: flex;
    justify-self: center;
    top: 330px;

}
/* home gallery  */
.gallery-title {
  font-size: 2rem;
  font-weight: 700;
  color: #000000;
  position: relative;
  display: flow;
  justify-self: center;
}
.font-stroke-w{
  font-weight: 800;
}

.gallery-title::after {
  content: "";
  display: block;
  width: 60%;
  height: 3px;
  background: var(--green);
  margin: 8px auto 0;
  border-radius: 2px;
}

/* Image Card */
.gallery-card {
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.gallery-card img {
  width: 100%;
  height: auto;
  transition: transform 0.5s ease;
}

.gallery-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.25);
}

.gallery-card:hover img {
  transform: scale(1.1);
}

/* Button */
.gallery-btn {
  background: var(--orange);
  color: #ffffff;
  padding: 12px 28px;
  font-size: 1rem;
  border-radius: 30px;
  transition: all 0.3s ease;
}

.gallery-btn:hover {
  background: var(--green);
  color: #fff;
  transform: scale(1.05);
}
/* brand-page */

.brand-section {
  background: #f8f9fa;
}
.brand-section h1{
  text-align: center !important;
}

/* Brand Card */
.brand-section .brand-card {
  padding: 10px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 3px 8px rgba(0,0,0,0.12);
  transition: transform 0.3s ease;
}

.brand-section .brand-card:hover {
  transform: translateY(-4px);
}

/* Brand Image */
.brand-section .brand-img {
  max-height: 80px;
  object-fit: contain;
  /* filter: grayscale(100%); */
  transition: filter 0.3s ease, transform 0.3s ease;
}

.brand-section .brand-card:hover .brand-img {
  filter: grayscale(0%);
  transform: scale(1.05);
}

/* ===== Admin Manage Page ===== */
.brand-section .brand-admin-item {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
}

.brand-section .brand-admin-img {
  width: 80px;
  height: auto;
}

.brand-section .brand-delete {
  color: #fff;
  background: #cc0c39;
  padding: 6px 14px;
  border-radius: 6px;
  text-decoration: none;
}

.brand-section .brand-delete:hover {
  background: #a50c2e;
}

/* frenchise model  */
/* Supreme Section */
.supreme-section {
    background: #f8f9fa;
    font-family: 'Segoe UI', sans-serif;
}

.supreme-box {
    background: #fff;
    padding: 35px;
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.12);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    position: relative;
}

.supreme-box:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.2);
}

.supreme-icon {
    font-size: 2.5rem;
    color: #ff8e01;
    margin-bottom: 15px;
}

.supreme-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #012246;
    margin-bottom: 12px;
    position: relative;
}

.supreme-title::after {
    content: "";
    display: block;
    width: 50px;
    height: 3px;
    background: #ff8e01;
    border-radius: 2px;
    margin-top: 6px;
}

.supreme-desc {
    margin-top: 10px;
}

.supreme-list {
    list-style: none;
    padding-left: 0;
}

.supreme-list li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 10px;
    color: #333;
    font-size: 0.95rem;
}

.supreme-list li::before {
    content: "✔";
    position: absolute;
    left: 0;
    top: 0;
    color: #23e923;
    font-size: 1rem;
}

@media (max-width: 767px) {
    .supreme-box {
        padding: 20px;
    }
    .supreme-title {
        font-size: 1.25rem;
    }
    .supreme-icon {
        font-size: 2rem;
    }
    #contact-section{
padding-top: 0rem !important;
  padding-bottom: 0rem !important;
  }
  .mbl-d-none{
    display: none;

  }
  .mbl-text-center{
text-align: center !important;
  }
}
@media (min-width: 992px) {
  .navbar .dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
  }


  
}
.navbar .dropdown-toggle::after {
  transform: rotate(-180deg);
  transition: transform 0.3s ease;
}

/* On hover: rotate to indicate open (up arrow) */
@media (min-width: 992px) {
  .navbar .dropdown:hover .dropdown-toggle::after {
    transform: rotate(0deg);
  }
}

/* Unique classes prefixed with cs- */
.cs-body {
  background: linear-gradient(120deg,#f8fafc,#eef2ff) !important;
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
}
.cs-card-unique {
  border-radius:18px;
  padding:0.75rem;
  border:0;
  overflow:hidden
}
.cs-heading {
  font-weight:700;
  color:#0b3d91;
  margin-bottom:1rem
}
.cs-submit {
  border-radius:12px;
  padding:0.6rem 1.4rem
}
.cs-input:focus {
  box-shadow:0 8px 30px rgba(11,61,145,0.08);
  transform:translateY(-2px);
  transition:all .18s
}
@media(max-width:576px){
  .cs-card-unique{padding:0.5rem}
}

/* mart-location */
.fran-container { max-width: 1200px; margin: auto; }
.fran-container .fran-title { font-size: 2rem; font-weight: bold; text-align: center; }
.fran-container .fran-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.fran-container .fran-card { display: block; text-decoration: none; border-radius: 15px; overflow: hidden; box-shadow: 0 4px 12px rgba(0,0,0,0.1); background: #fff; transition: .3s; }
.fran-container .fran-card:hover { transform: translateY(-5px); }
.fran-container .fran-img { width: 100%; height: 450px; object-fit: cover; }
.fran-container .fran-body { padding: 15px; background: #f9f7ef; }
.fran-container .fran-name { font-size: 1.2rem; color: #2c3e50; }
.fran-container .fran-text { font-size: 0.9rem; color: #555; }
.fran-container .fran-contact, .fran-city { font-weight: bold; color: #000; margin-top: 5px; }
.fran-container .fran-btn { background: #28a745; color: #fff; border: none; padding: 8px 15px; border-radius: 8px; cursor: pointer; }
.fran-container .fran-btn:hover { background: #218838; }

/* Layout */
/* Layout */
.fran-details {
  padding: 60px 0;
  background: linear-gradient(135deg, #f6f9fc, #eef2f7);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.fran-wrapper {
  display: flex;
  gap: 40px;
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 35px rgba(0,0,0,0.1);
}
.fran-left, .fran-right {
  flex: 1;
}

/* Image */
.fran-img {
  position: relative;
  height: 100%;
}
.fran-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fran-overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 25px;
  background: linear-gradient(to top, rgba(0,0,0,0.75), transparent);
  color: #fff;
}
.fran-overlay h1 {
  font-size: 30px;
  margin-bottom: 6px;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.fran-overlay p {
  font-size: 15px;
  opacity: 0.85;
}

/* Right side */
.fran-right {
  padding: 35px;
}

/* Info Cards */
.fran-info {
  display: grid;
  gap: 18px;
  margin-bottom: 25px;
}
.fran-details .fran-card {
  display: flex;
  align-items: flex-start;
  background: #fdfdfd;
  border: 1px solid #eee;
  padding: 18px 20px;
  border-radius: 14px;
  transition: all 0.3s ease;
  box-shadow: 0 3px 10px rgba(0,0,0,0.04);
}
.fran-details .fran-card:hover {
  background: linear-gradient(135deg, #0d6f38, #17914cb6);
  color: #fff;
  transform: translateY(-3px);
}
.fran-card .icon {
  font-size: 24px;
  margin-right: 14px;
  color: #0d6f38;
  transition: color 0.3s;
}
.fran-card:hover .icon {
  color: #fff;
}
.fran-card h4 {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 600;
}
.fran-card p {
  margin: 0;
  font-size: 14px;
}

/* Sections */
.fran-section {
  margin-bottom: 30px;
}
.fran-section h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #222;
  position: relative;
}
.fran-section h3::after {
  content: '';
  width: 50px;
  height: 3px;
  background: linear-gradient(90deg, #0d6f38, #52f406);
  position: absolute;
  left: 0;
  bottom: -6px;
  border-radius: 2px;
}
.fran-section p {
  font-size: 15px;
  line-height: 1.7;
  color: #444;
}

/* Map */
.fran-map iframe {
  width: 100%;
  height: 260px;
  border: none;
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

/* Animations */
.fade-in {
  animation: fadeInUp 0.7s ease forwards;
  opacity: 0;
}
@keyframes fadeInUp {
  from {opacity:0; transform:translateY(20px);}
  to {opacity:1; transform:translateY(0);}
}

/* Responsive */
@media(max-width: 991px) {
  .fran-wrapper {
    flex-direction: column;
  }
  .fran-img {
    height: 280px;
  }
  .fran-overlay h1 {
    font-size: 24px;
  }

}


/* breadcremp */
/* General styles */
.breadcremp-con {
  padding: 15px;
  background: url('images/breadcremp.webp') ;/* Light background for contrast */
  height: 84px;
  background-size: cover;
}

.breadcremp-con-gap {
  margin-bottom: 10px;
}

.breadcrumb {
  background-color: transparent;
  padding: 0;
  margin-bottom: 0;
}

.breadcrumb-item {
  font-size: 16px;
}

.breadcrumb-item a {
  text-decoration: none;
  color: #007bff; /* Bootstrap link color */
}

.breadcrumb-item.active {
  color: #6c757d; /* Lighter color for active item */
}

/* Mobile view: 320px and up */
@media (max-width: 400px) {
  .breadcrumb-item {
    font-size: 14px;
  }
    .breadcremp-con {
  padding: 15px;
  background: url('images/breadcremp-mbl.webp') !important; 
        background-size: cover !important;
        background-repeat: no-repeat;
        height: 175px;
}
 .breadcremp-con h2{
    font-size: 32px;
   }



  /* Reduce padding on mobile */
  .breadcremp-con {
    padding: 10px;
  }
  
  .breadcremp-con-gap {
    margin-bottom: 5px;
  }
}


/* Desktop view: 768px and up */
@media (min-width: 768px) {
  .breadcrumb-item {
    font-size: 22px;
  }

   .breadcremp-con h2{
    font-size: 60px;
   }


  .breadcremp-con {
    padding: 20px;
    background-repeat: no-repeat;
    background-size: cover;
    height: 204px;
  }
}
@media (min-width: 1380px) {

  .breadcremp-con{
    height: 250px;
  }
}