@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
:root{
      --blue: #0b4a8b;   /* header/footer */
      --nav-blue:#08366b;
      --red: #ff4757;    /* CTA */
      --heroA: #e85d04;  /* hero gradient left */
      --heroB: #d00000;  /* hero gradient right */
      --chip: #e7f0ff;   /* chart box bg */
      --muted: #6b7280;
    }

    *{box-sizing:border-box}
    body{
      font-family: 'Poppins', sans-serif;
      background: #f6f9ff;
      color: #12202b;
      margin:0;
    }

    /* NAV */
    .navbar{
        position: sticky;
        width: 100%;
        padding: 0px;
        top: 0;
        z-index: 100;
        background: #004182;
        box-shadow: 0 6px 20px rgb(2 13 42 / 3%);
    }
    .navbar .navbar-brand{color: #ffc107;font-weight:700;display:flex;align-items:center;gap:.6rem}
    .navbar .navbar-brand img{height: 50px;width: 100%;border-radius:6px;}
    .nav-link{ color:#fff !important; font-weight:500 }
    .btn-sign{ background:var(--red); color:#fff; border-radius:30px; padding:.45rem 1rem; border:none }

    /* HERO */
    header.hero{
      position: relative;
      overflow:hidden;
      color: #fff;
      text-align: left;
      
       background: linear-gradient(90deg, rgb(232 93 4 / 0%), rgb(208 0 0 / 11%)), url(../img/banner-bg.jpg) center / cover no-repeat;
      padding: 360px 0 120px;
      border-bottom-left-radius:80px;
      border-bottom-right-radius:80px;
    }
    .hero h1{
      font-size: 3.2rem; line-height:1.02; font-weight:700; margin-bottom:6px;
      text-shadow: 0 6px 22px rgba(0,0,0,0.25);
    }
    .hero p.lead{ font-size:1.05rem; opacity:0.95; margin-bottom:0; }
.tag.kedaR {
    background: #0bad41;
    color: #fff;
}
    /* decorative image stack on the right */
    .hero-stack{
      position:absolute; right:6%; top:14%;
      display:grid; gap:14px; grid-auto-flow:row;
    }
    .hs-card{ background:#fff; border-radius:26px; padding:8px; width:220px; height:150px; box-shadow:0 12px 30px rgba(0,0,0,0.22); overflow:hidden}
    .hs-card img{ width:100%; height:100%; object-fit:cover; border-radius:18px; display:block }
    .hs-card.small{ width:170px; height:120px; justify-self:end }
    .hs-card.tall{ height:210px }

    /* LEADERS row */
    .leaders{ margin-top:100px; padding-bottom:20px }
    .leader-card{
      margin-bottom: 40px;
      background:#fff;
      border-bottom: 5px solid #0a4380;
      border-radius:18px;
      padding:18px 14px 26px;
      text-align:center;
      box-shadow:0 14px 32px rgba(3,18,57,0.06);
    }
    .leader-card img{
      width:120px; height:120px; object-fit:cover; border-radius:12px;
      border:6px solid rgba(255,255,255,0.9); margin-top:-60px; box-shadow:0 10px 20px rgba(3,18,57,0.12)
    }
    .leader-card h6{ font-size:1rem; font-weight:700; margin-top:10px }
    .leader-card p.caption{ font-size:.78rem; color:var(--muted); margin:0 }

    /* blue rounded strip */
    .info-strip{
    
background: linear-gradient(90deg, rgb(59 77 171 / 74%), rgb(39 92 131)), url(../img/yatra.jpg) center / cover no-repeat;
    
border-radius: 40px;
    
padding: 100px 20px;
    
margin-top: 12px;
    
text-align: center;
    
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
    }
    .info-strip h4{ color:#08366b; font-weight:700; margin-bottom:8px }
    .info-strip p{ color:#51647a; margin-bottom:0; font-size:.95rem; line-height:1.55 }

    /* KEY INSIGHTS */
    .section-title{ font-weight:700; margin-bottom:18px; font-size:1.5rem; color:#0b2540 }
    .insight-card{
      background:#fff;
      border-bottom: 5px solid #0a4380;
      border-radius:16px;
      padding:14px;
      text-align:center;
      box-shadow: 0 10px 28px rgba(3,18,57,0.06);
      transition: transform .25s ease;
    }
    .insight-card:hover{ transform: translateY(-6px) }
    .insight-circle{
      width:122px;
      height:122px;
      border-radius:50%;
      padding:6px;
      overflow:hidden;
      /* border:6px solid #eef5ff; */
      margin:0 auto 10px;
    }
    .insight-circle img{width:100%;height:100%;object-fit:cover;border-radius:50%}

    .count-small{ font-size:.82rem; color:var(--muted); margin:0 }
    .tag{ display:inline-block; font-size:.82rem; font-weight:700; border-radius:10px; padding:4px 8px; margin-top:8px; }
    .tag.badri{ background:#1e90ff; color:#fff } .tag.kedar{ background:#0fb07a; color:#fff }
    .tag.gango{ background:#ffd43b } .tag.yam{ background:#ff6b6b; color:#fff }
    .tag.hem{ background:#4db8ff; color:#fff } .tag.all{ background:#0ea5e9; color:#fff }

    /* chart box */
    .chart-box{background: linear-gradient(90deg, rgb(237 237 237 / 96%), rgb(211 236 255)), url(../img/yatra.jpg) center / cover no-repeat;border-radius:18px;padding:18px;border: 5px solid #0a4380;box-shadow:0 8px 26px rgba(3,18,57,0.06)}
    .chart-title{ font-size:.88rem; color:#e62e2e; font-weight:700; text-align:center; margin-bottom:10px }

    /* monthwise mini cards */
    .mini-card{background:#fff;border-radius:20px;padding:18px;border: 5px solid #0a4380;box-shadow:0 12px 30px rgba(3,18,57,0.06)}

    /* footer */
    footer{background: linear-gradient(90deg, #6c9acb, #0a4380);margin-top:36px;color:#fff;padding: 20px;border-top-left-radius:80px;border-top-right-radius:80px}
    footer .copyright{ padding:22px 0; text-align:center; font-weight:500 }

    /* utilities for canvas sizes */
    canvas{ display:block; max-width:100% }

    @media (max-width: 991px){
      .hero h1{ font-size:2.2rem; text-align:center }
      .hero p.lead{ text-align:center }
      .hero-stack{ position: static; display:flex; gap:12px; justify-content:center; margin-top:18px }
      .hs-card{ transform: scale(.9) }
      .leader-card img{ margin-top:-40px }
      header.hero{ padding-bottom:60px; border-bottom-left-radius:40px; border-bottom-right-radius:40px }
    }
    /* Mobile view fix */
@media (max-width: 768px) {
  /* Navbar center alignment */
  .navbar-brand, 
  .navbar-toggler {
    display: flex;
    justify-content: center;
    align-items: center;
    /* margin: 0 auto; */ /* Center horizontally */
  }

  .navbar {
    text-align: center;
  }

  /* Toggle button white color */
  .navbar-toggler {
    border-color: white;
  }

  .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='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
  }

  /* Hero banner responsive */
  .hero-banner {
    width: 100%;
    height: auto;
    background-size: cover;
    background-position: center;
    text-align: center;
    padding: 20px;
  }

  .hero-banner img {
    width: 100%;
    height: auto;
  }
}
.navbar-collapse {
  
    margin: 20px 0!important;
    
}
.insight-card {
  background: #fff;
  transition: all 0.3s ease;
}
.insight-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.12);
}
.insight-circle img {
  /* width: 70px; */
  /* height: 70px; */
  object-fit: contain;
}
.count-small {
  margin: 0;
  color: #555;
}
.tag {
  margin-top: 8px;
  display: inline-block;
  padding: 4px 10px;
  font-size: 0.85rem;
  border-radius: 20px;
  background: #f1f1f1;
}