/* style.css - Maroon & White theme */
:root {
  --maroon: #800000;
  --maroon-dark: #5c0000;
  --accent: #ffffff;
  --muted: #fbf9f9;
  --card-shadow: rgba(0,0,0,0.08);
}

* { box-sizing: border-box; }

/* Navbar */
.navbar-maroon {
  background-color: #063772; /* Deep navy */
  color: #f8f9fa; /* Soft white */

  /* Increase navbar height via padding */
  padding-top: 1.2rem;
  padding-bottom: 1.2rem;

  /* Optional: fixed height alternative (commented out) */
  /* height: 90px; */
}

/* Keep navbar content vertically aligned */
.navbar-maroon .container {
  display: flex;
  align-items: center;
}

/* Brand text styling */
.navbar-maroon .navbar-brand {
  font-size: 1.75rem;  /* Increase size of "उत्तूर ग्रामपंचायत" */
  font-weight: 700;
  color: #ffffff !important; /* Ensure bright white text */
  letter-spacing: 0.5px;      /* Optional: improve readability */
}

/* Nav links */
.navbar-maroon .nav-link {
  color: #f8f9fa;
  text-decoration: none;
  font-size: 1.1rem;     /* Slightly larger links */
  padding: 0.75rem 1rem; /* Makes them easier to click */
}

.navbar-maroon .nav-link:hover {
  color: #c2d0eb;
}






/* Hero carousel */
.hero .carousel-item img {
  height: 480px;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 10px 30px var(--card-shadow);
}

/* Section heading */
.section-title {
  color: #063772;
  font-weight: 700;
  border-bottom: 4px solid #063772;
  display: inline-block;
  padding-bottom: 6px;
  margin-bottom: 18px;
}

/* Cards */
.info-card {
  border: none;
  border-radius: 12px;
  box-shadow: 0 8px 24px var(--card-shadow);
  transition: transform .18s ease, box-shadow .18s ease;
  background: #fff;
}
.info-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px var(--card-shadow); }

.btn-maroon {
 background-color: #063772; /* Deep navy */
  color: #f8f9fa; /* Soft white */
  border-radius: 30px;
  border: none;

}
.btn-maroon:hover { background: #c2d0eb;
 }

/* Member card */
.member-card {
  text-align: center;
  padding: 18px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px var(--card-shadow);
}
.member-card img {
  width:120px;height:120px;object-fit:cover;border-radius:50%;
  border:4px solid var(--maroon);
  margin-bottom:10px;
}

/* counters */
.counter {
  font-size: 2.2rem;
  color: #f8f9fa; /* White text */;
  font-weight: 800;
}


/* blockquote */
.blockquote-card {
  background: #fff; padding: 18px; border-radius: 10px; box-shadow: 0 8px 20px var(--card-shadow);
  border-left: 6px solid var(--maroon);
}

/* footer */
.footer-navy {
  background-color: #0a2342; /* Deep navy */
  color: #f8f9fa; /* Soft white */
}

.footer-navy a {
  color: #f4c542; /* Muted gold */
  text-decoration: none;
}

.footer-navy a:hover {
  color: #ffd700; /* Bright gold on hover */
}


/* responsive tweaks */
@media (max-width:767px) {
  .hero .carousel-item img { height: 260px; }
  .member-card img { width:100px;height:100px; }
}
.header-logo-title {
  color: white; /* keep text white */
}

.header-logo {
  width: 50px;        /* Adjust size as needed */
  height: 50px;       /* Make height equal to width for perfect circle */
  border-radius: 50%; /* Makes the image circular */
  object-fit: cover;  /* Ensures the image covers the circle without distortion */
  border: 2px solid white; /* Optional: white border for better contrast */
}

.header-title {
  font-weight: 700;
  font-size: 1.8rem;
  color: white;
  text-decoration: none;
  white-space: nowrap;
}