/* background gridlines */

#about-section,
.model-section
.Highlights,
.events,
.rules-section,
.schedule,
.rolling-gallery,
.faq-sections,
.checklist ,
 .team-section{
    position: relative;
}

#about-section::before,
.model-section::before,
.Highlights::before,
.events::before,
.rules-section::before,
.schedule::before,
.rolling-gallery::before,
.faq-sections::before,
.checklist::before,
 .team-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        linear-gradient(rgba(139, 69, 19, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(139, 69, 19, 0.1) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
    z-index: 1;
}

/* Ensure content stays above grid */
#about-section > *,
.Highlights > *,
.events > *,
.rules-section > *,
.schedule > *,
.rolling-gallery > *,
.faq-sections > *,
.checklist > * ,
.team-section > * {
    position: relative;
    z-index: 2;
}


/* ===== MODERN DESIGN ENHANCEMENTS ===== */


/* Enhanced Button Interactions */
.gallery-btn, .schedule .section-button a {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--secondary-60), var(--secondary-70));
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 
    0 8px 25px rgba(0, 0, 0, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.gallery-btn::after, .schedule .section-button a::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%);
  transform: translate(-50%, -50%);
  transition: width 0.6s ease, height 0.6s ease;
  border-radius: 50%;
}

.gallery-btn:hover::after, .schedule .section-button a:hover::after {
  width: 300px;
  height: 300px;
}

/* Modern Tab Design */
.tab-btn {
  background: linear-gradient(145deg, 
    rgba(255, 255, 255, 0.1), 
    rgba(255, 255, 255, 0.05));
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(15px);
  position: relative;
}

.tab-btn::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--secondary-base), var(--secondary-60));
  transform: translateX(-50%);
  transition: width 0.3s ease;
}

.tab-btn.active::before, .tab-btn:hover::before {
  width: 100%;
}

/* Enhanced Gallery with Depth */
.gallery-grid img {
  filter: brightness(0.85) saturate(1.2) contrast(1.1);
  border: 2px solid rgba(255, 255, 255, 0.3);
  box-shadow: 
    0 15px 35px rgba(0, 0, 0, 0.2),
    0 5px 15px rgba(141, 11, 65, 0.1);
}

.gallery-grid img:hover {
  filter: brightness(1) saturate(1.3) contrast(1.2);
  box-shadow: 
    0 25px 50px rgba(0, 0, 0, 0.3),
    0 10px 25px rgba(211, 157, 85, 0.2);
}

/* Modern Footer with Gradient Overlays */
.footer {
  background: 
    linear-gradient(135deg, rgba(141, 11, 65, 0.9), rgba(141, 11, 65, 0.8)),
    radial-gradient(circle at 20% 20%, rgba(211, 157, 85, 0.1) 0%, transparent 50%),
    linear-gradient(135deg, var(--primary-70), var(--primary-90));
}

/* Enhanced Social Links */
.social-links a {
  background: linear-gradient(145deg, 
    rgba(255, 255, 255, 0.1), 
    rgba(255, 255, 255, 0.05));
  border: 1px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(15px);
  position: relative;
}

.social-links a::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  background: linear-gradient(135deg, var(--secondary-base), var(--secondary-60));
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.4s ease;
  z-index: -1;
}

.social-links a:hover::before {
  width: 100%;
  height: 100%;
}

/* Advanced Scrollbar Styling */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: linear-gradient(180deg, var(--primary-90), var(--primary-100));
  border-radius: 6px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--secondary-base), var(--secondary-70));
  border-radius: 6px;
  border: 2px solid var(--primary-90);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}


/* Modern Loading States */
.loading {
  position: relative;
  overflow: hidden;
}

.loading::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, 
    transparent, 
    rgba(211, 157, 85, 0.3), 
    transparent);
  animation: loadingShimmer 1.5s infinite;
}

@keyframes loadingShimmer {
  0% { left: -100%; }
  100% { left: 100%; }
}

/* Enhanced 3D Model Section */


.photo {
  border: 3px solid rgba(255, 255, 255, 0.5);
  box-shadow: 
    0 15px 35px rgba(0, 0, 0, 0.2),
    0 5px 15px rgba(141, 11, 65, 0.1);
  backdrop-filter: blur(2px);
}