/* === Glossy Green Theme (Masjid Al-Amal) === */
:root {
  --green-main: #4CAF50;
  --green-light: #A5D6A7;
  --green-glass: rgba(76, 175, 80, 0.15);
  --white-glass: rgba(255, 255, 255, 0.8);
}

body {
  background: linear-gradient(135deg, #e8f5e9, #ffffff);
  color: #333;
  font-family: 'Poppins', sans-serif;
}

/* Hero Section */
.home-hero {
  background: linear-gradient(135deg, var(--green-light), #ffffff);
  border-bottom: 2px solid var(--green-main);
}
.text-glow {
  text-shadow: 0 0 10px rgba(76,175,80,0.3);
}
.text-green {
  color: var(--green-main);
}
.btn-green {
  background: var(--green-main);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 10px 24px;
  transition: all 0.3s ease;
}
.btn-green:hover {
  background: #43A047;
  transform: scale(1.03);
}
.btn-outline-green {
  color: var(--green-main);
  border: 1px solid var(--green-main);
  border-radius: 6px;
  transition: all 0.3s ease;
}
.btn-outline-green:hover {
  background: var(--green-main);
  color: #fff;
}

/* Glossy Cards */
.glossy-card {
  background: var(--white-glass);
  backdrop-filter: blur(8px);
  border: 1px solid var(--green-light);
  border-radius: 10px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.glossy-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

/* Section Background */
.glossy-bg {
  background: linear-gradient(135deg, var(--green-glass), var(--white-glass));
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--green-light);
}

/* ==== NAV & FOOTER GLOSSY ==== */
:root{
  --green-main:#4CAF50; --green-light:#A5D6A7; --white-glass:rgba(255,255,255,.85);
}
.brand-green{ color:var(--green-main); }
.navbar.glass-nav{
  background: linear-gradient(135deg, rgba(165,214,167,.45), rgba(255,255,255,.75));
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--green-light);
}
.navbar.glass-nav .nav-link{
  color:#2f3e33;
  border-radius: .5rem;
  padding: .5rem .75rem;
}
.navbar.glass-nav .nav-link:hover{ background: rgba(76,175,80,.08); color:#1b5e20; }
.navbar.glass-nav .nav-link.active{
  background: rgba(76,175,80,.15);
  color:#1b5e20;
  font-weight:600;
}

.glass-footer{
  background: linear-gradient(135deg, rgba(255,255,255,.8), rgba(165,214,167,.35));
  backdrop-filter: blur(6px);
  border-top: 1px solid var(--green-light);
}

/* Button green (sudah dipakai di halaman lain juga) */
.btn-green{
  background: var(--green-main);
  color:#fff;
  border:none;
  border-radius: .6rem;
  transition: all .25s ease;
}
.btn-green:hover{ background:#43A047; transform: translateY(-1px); }
.text-green{ color: var(--green-main); }