/* ----------------------------------------------------
   ZELMAR GROTTO BRANDING OVERRIDES
   Works with Bootstrap 5.x
---------------------------------------------------- */

/* GLOBAL TYPOGRAPHY */
body {
  font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background-color: #FFF7E8; /* soft cream */
  color: #2A2A2A; /* deep charcoal */
}

h1, h2, h3, h4, h5 {
  font-weight: 700;
  color: #8B1E1E; /* grotto red */
}

/* LINKS */
a {
  color: #8B1E1E;
  text-decoration: none;
}

a:hover {
  color: #D9A441; /* warm gold */
}

/* BUTTONS */
.btn-primary {
  background-color: #8B1E1E;
  border-color: #8B1E1E;
}

.btn-primary:hover {
  background-color: #6E1717;
  border-color: #6E1717;
}

.btn-outline-primary {
  color: #8B1E1E;
  border-color: #8B1E1E;
}

.btn-outline-primary:hover {
  background-color: #8B1E1E;
  color: #FFF7E8;
}

/* HERO SECTION */
.hero {
  background: linear-gradient(
    rgba(139, 30, 30, 0.75),
    rgba(139, 30, 30, 0.75)
  ),
  url('../images/hero-bg.jpg') center/cover no-repeat;
  color: white;
  padding: 120px 0;
}

.hero h1 {
  color: #FFF7E8;
}

.hero p {
  font-size: 1.25rem;
  color: #FDEED6;
}

/* CARDS */
.card {
  border: none;
  border-radius: 12px;
  background-color: #FFFFFF;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.card-title {
  color: #8B1E1E;
  font-weight: 600;
}

.card-text {
  color: #2A2A2A;
}

/* DONATION SECTION */
#donate {
  background-color: #8B1E1E !important;
  color: #FFF7E8 !important;
}

#donate .btn-light {
  background-color: #FFF7E8;
  color: #8B1E1E;
  border: none;
}

#donate .btn-light:hover {
  background-color: #D9A441;
  color: #2A2A2A;
}

/* NAVBAR */
.navbar {
  background-color: #8B1E1E !important;
}

.navbar-brand,
.navbar-nav .nav-link {
  color: #FFF7E8 !important;
  font-weight: 600;
}

.navbar-nav .nav-link:hover {
  color: #D9A441 !important;
}
.navbar.navbar-dark {
  --bs-navbar-bg: #8B1E1E !important;
  background-color: #8B1E1E !important;
}
/* FOOTER */
footer {
  background-color: #2A2A2A;
  color: #FFF7E8;
}

footer a {
  color: #D9A441;
}

footer a:hover {
  color: #FFF7E8;
}

/* IMAGE STYLING */
img.rounded.shadow {
  border: 4px solid #D9A441;
  border-radius: 12px !important;
}

/* HAND-DRAWN STYLE ICONS (optional) */
.icon-fez,
.icon-tooth {
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2));
}

/* SECTION SPACING */
section {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

/* CUSTOM UTILITIES */
.bg-cream {
  background-color: #FFF7E8 !important;
}

.text-grotto {
  color: #8B1E1E !important;
}

.border-gold {
  border-color: #D9A441 !important;
}