:root{
  --gold:#c59d33;
  --black:#000000;
  --gold-light:#d4a749;
  --gold-dark:#b88d2b;
}

body{
  background:#fff;
  color:#111;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  scroll-behavior: smooth;
}

/* Smooth scrolling offset for fixed navbar */
html {
  scroll-behavior: smooth;
}

#about {
  scroll-margin-top: 80px;
}

/* Colors */
.bg-black{background:var(--black) !important}
.text-gold{color:var(--gold) !important}
.bg-gold{background:var(--gold) !important}

/* Buttons */
.btn-gold{
  background:var(--gold);
  color:#000;
  border:none;
  font-weight:600;
  transition: all 0.3s ease;
}
.btn-gold:hover{
  background:var(--gold-dark);
  color:#000;
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(197,157,51,0.3);
}

/* Header */
.site-header .navbar-brand img{height:40px}
.navbar-nav .nav-link:hover{
  color:var(--gold-light) !important;
  transition: color 0.3s ease;
}

/* Hero Video */
.hero-video {
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.video-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.video-background video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-overlay {
  z-index: 2;
  position: relative;
}

.hero{
  min-height:500px;
  position:relative;
}
.min-vh-50{min-height:50vh}

/* Commitment Section */
.commitment-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

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

.commitment-icon {
  transition: all 0.3s ease;
}

.commitment-card:hover .commitment-icon {
  transform: scale(1.1);
  box-shadow: 0 6px 15px rgba(197,157,51,0.4);
}

/* Who We Serve Section */
.serve-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

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

.serve-icon {
  transition: all 0.3s ease;
}

.serve-card:hover .serve-icon {
  transform: scale(1.1);
  box-shadow: 0 6px 15px rgba(0,0,0,0.3);
}

.serve-badge {
  position: relative;
  display: inline-block;
  font-size: 0.75rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.serve-icon-wrapper {
  position: relative;
}

/* Cards */
.card{
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover{
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.program-card .program-icon{
  transition: transform 0.3s ease;
}
.program-card:hover .program-icon{
  transform: scale(1.1);
}

/* Feature Icons */
.feature-icon{
  transition: all 0.3s ease;
}
.card:hover .feature-icon{
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(197,157,51,0.3);
}

.contact-icon{
  transition: all 0.3s ease;
}
.contact-item:hover .contact-icon{
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(197,157,51,0.3);
}

/* Links */
a{
  transition: color 0.3s ease;
}
a:hover{
  color:var(--gold) !important;
}

/* Social Links */
.social-links .btn:hover{
  background:var(--gold);
  border-color:var(--gold);
  color:#000;
}

/* Modal */
.modal-content{
  border-radius:10px;
  overflow:hidden;
}

/* Animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.card, .feature-icon, .program-icon {
  animation: fadeInUp 0.6s ease-out;
}

/* Reveal on scroll utility */
.reveal{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: opacity, transform;
}
.reveal.visible{
  opacity: 1;
  transform: translateY(0);
}
.reveal[data-delay]{
  transition-delay: var(--reveal-delay, 0ms);
}
.reveal[data-delay="0"]{ --reveal-delay: 0ms; }
.reveal[data-delay="100"]{ --reveal-delay: 100ms; }
.reveal[data-delay="200"]{ --reveal-delay: 200ms; }
.reveal[data-delay="300"]{ --reveal-delay: 300ms; }
.reveal[data-delay="400"]{ --reveal-delay: 400ms; }
.reveal[data-delay="500"]{ --reveal-delay: 500ms; }

/* Responsive */
@media (max-width: 768px) {
  .hero-video {
    height: 70vh;
  }
  
  .hero{min-height:400px}
  .display-4{font-size:2rem}
  .display-5{font-size:1.8rem}
  .display-6{font-size:1.6rem}
  .display-3{font-size:2.5rem}
  
  .video-overlay .lead.fs-3 {
    font-size: 1.5rem !important;
  }
  
  .video-overlay .fs-5 {
    font-size: 1.1rem !important;
  }
}

/* Map Section */
.map-container {
  position: relative;
}

.map-frame {
  border: 3px solid var(--gold);
  transition: all 0.3s ease;
}

.map-frame:hover {
  box-shadow: 0 15px 35px rgba(197,157,51,0.3) !important;
  transform: translateY(-2px);
}

.map-info .card {
  backdrop-filter: blur(10px);
  border: 1px solid rgba(197,157,51,0.2);
}

.map-icon {
  transition: all 0.3s ease;
}

.map-info:hover .map-icon {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(197,157,51,0.4);
}

.map-actions .btn {
  backdrop-filter: blur(10px);
  border: 1px solid var(--gold);
}

.map-actions .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(197,157,51,0.4);
}

/* Responsive Map */
@media (max-width: 768px) {
  .map-frame {
    height: 350px !important;
  }
  
  .map-info {
    position: relative !important;
    margin: 0 !important;
    margin-top: 1rem !important;
  }
  
  .map-actions {
    position: relative !important;
    margin: 0 !important;
    margin-top: 1rem !important;
    text-align: center;
  }
}

/* Utility */
.text-decoration-none:hover{
  text-decoration:underline !important;
}
