:root{
  --brand:#ff1212;
  --brand-bg:#f1f5f9; /* slate-100 - matching admin */
  --brand-white:#ffffff;
  --brand-surface:#ffffff;
  --brand-muted:#64748b; /* slate-500 */
  --brand-primary:#ff1212;
  --brand-primary-ghost:rgba(255,18,18,0.08);
  --brand-card:#ffffff;
  --brand-border:#e5e7eb;
}
body{
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color:#0f172a;
  background: var(--brand-bg);
}
.text-primary{ color: var(--brand-primary)!important; }
.text-danger{ color: #ff1212 !important; }
.bg-primary{ background-color: var(--brand-primary)!important; }
.bg-primary-10{ background-color: rgba(255,18,18,0.1)!important; }
.bg-brand{ background: var(--brand-primary); }
.btn-primary{
  background-color: var(--brand-primary)!important;
  border-color: var(--brand-primary)!important;
}
.btn-primary:hover{ 
  background-color: #cc0e0e;
  border-color: #cc0e0e;
}
.hero{
  color: var(--brand-white);
  position: relative;
  min-height: 90vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

/* Hero Banner Style (New Design) */
.hero-banner{
  position: relative;
  min-height: 90vh;
  padding: 8rem 0;
}

/* Homepage Hero Specific Styles */
.hero-banner-homepage{
  position: relative;
  min-height: 85vh;
  padding: 4rem 0 6rem;
}

@media (max-width: 768px) {
  .hero-banner-homepage{
    min-height: auto;
    padding: 3rem 0 4rem;
  }
}

/* Zones Page Hero Styles */
.hero-banner-zones{
  position: relative;
  min-height: 85vh;
  padding: 5rem 0 6rem;
}

@media (max-width: 768px) {
  .hero-banner-zones{
    min-height: auto;
    padding: 3rem 0 4rem;
  }
}

/* Zones Eyebrow Badge */
.badge-zones-eyebrow{
  background: rgba(255, 18, 18, 0.2);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 18, 18, 0.4);
  color: #ffffff;
  font-size: 0.9rem;
}

.badge-zones-eyebrow i{
  color: #ff1212;
  font-size: 1rem;
}

/* Zones Hero Title */
.hero-title-zones{
  font-size: clamp(2rem, 6vw, 3.25rem);
  font-weight: 800;
  line-height: 1.2;
  color: #ffffff;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  margin-bottom: 1.5rem;
  letter-spacing: -0.5px;
}

.hero-title-zones .text-primary-accent-zones{
  color: #ff1212 !important;
  display: inline-block;
  position: relative;
}

/* Zones Hero Subtitle */
.hero-subtitle-zones{
  font-size: clamp(1rem, 2.5vw, 1.2rem);
  color: rgba(255, 255, 255, 0.95);
  line-height: 1.8;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  margin-bottom: 1.5rem;
}

/* Zones Feature Items */
.hero-features-zones{
  margin-bottom: 2rem;
}

.feature-item-zones{
  margin-bottom: 1.25rem;
}

.feature-icon-zones{
  width: 44px;
  height: 44px;
  min-width: 44px;
  background: rgba(255, 18, 18, 0.25);
  border: 2px solid rgba(255, 18, 18, 0.4);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 4px 15px rgba(255, 18, 18, 0.2);
}

.feature-icon-zones i{
  color: #ff1212;
  font-size: 1.1rem;
  font-weight: 700;
}

.feature-title-zones{
  color: #ffffff;
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 0.25rem;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.feature-desc-zones{
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  line-height: 1.5;
}

/* Zones CTA Buttons */
.btn-hero-primary-zones{
  background: linear-gradient(135deg, #ff1212 0%, #ff4444 100%);
  color: #ffffff;
  border: none;
  font-weight: 700;
  border-radius: 50px;
  transition: all 0.3s ease;
  box-shadow: 0 6px 25px rgba(255, 18, 18, 0.4);
  font-size: 1rem;
}

.btn-hero-primary-zones:hover{
  background: linear-gradient(135deg, #cc0e0e 0%, #ff3333 100%);
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(255, 18, 18, 0.5);
}

.btn-hero-secondary-zones{
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  color: #ffffff;
  border: 2px solid rgba(255, 255, 255, 0.4);
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
  font-size: 1rem;
}

.btn-hero-secondary-zones:hover{
  background: rgba(255, 255, 255, 0.25);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.6);
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(255, 255, 255, 0.2);
}

/* Zones Stat Cards */
.stat-card-zones{
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(15px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 20px;
  padding: 1.75rem 1rem;
  text-align: center;
  transition: all 0.3s ease;
  height: 100%;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}

.stat-card-zones:hover{
  background: rgba(255, 255, 255, 0.18);
  transform: translateY(-5px);
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 255, 255, 0.4);
}

.stat-icon-zones{
  width: 55px;
  height: 55px;
  background: rgba(255, 18, 18, 0.25);
  border: 2px solid rgba(255, 18, 18, 0.4);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  box-shadow: 0 4px 15px rgba(255, 18, 18, 0.2);
}

.stat-icon-zones i{
  color: #ff1212;
  font-size: 1.5rem;
  font-weight: 600;
}

.stat-number-zones{
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 800;
  color: #ffffff;
  line-height: 1;
  margin-bottom: 0.5rem;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}

.stat-number-zones i{
  color: #ff1212;
  font-size: 2rem;
}

.stat-label-zones{
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.9);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
}

/* Mobile Responsive for Zones Hero */
@media (max-width: 768px) {
  .hero-title-zones{
    font-size: clamp(1.75rem, 8vw, 2.5rem);
    margin-bottom: 1rem;
  }
  
  .hero-subtitle-zones{
    font-size: clamp(0.95rem, 4vw, 1.1rem);
    margin-bottom: 1.5rem;
  }
  
  .hero-features-zones{
    margin-bottom: 2rem;
  }
  
  .feature-icon-zones{
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
  
  .feature-icon-zones i{
    font-size: 1rem;
  }
  
  .feature-title-zones{
    font-size: 1rem;
  }
  
  .feature-desc-zones{
    font-size: 0.85rem;
  }
  
  .hero-cta-zones{
    margin-bottom: 2rem;
  }
  
  .hero-cta-zones .btn{
    width: 100%;
    justify-content: center;
  }
  
  .stat-card-zones{
    padding: 1.5rem 0.75rem;
  }
  
  .stat-icon-zones{
    width: 45px;
    height: 45px;
  }
  
  .stat-icon-zones i{
    font-size: 1.25rem;
  }
  
  .stat-number-zones{
    font-size: 1.5rem;
  }
  
  .stat-number-zones i{
    font-size: 1.5rem;
  }
  
  .stat-label-zones{
    font-size: 0.75rem;
  }
}

@media (max-width: 576px) {
  .hero-banner-zones{
    padding: 2rem 0 3rem;
  }
  
  .badge-zones-eyebrow{
    font-size: 0.8rem;
    padding: 0.5rem 1rem;
  }
  
  .feature-icon-zones{
    width: 36px;
    height: 36px;
    min-width: 36px;
  }
  
  .feature-icon-zones i{
    font-size: 0.9rem;
  }
}

/* Background Image */
.hero-background-image{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: blur(3px);
  transform: scale(1.1); /* Slight zoom to hide blur edges */
  z-index: 0;
  background-color: #1a1a1a; /* Fallback dark background if image doesn't load */
}

/* Dark Overlay */
.hero-dark-overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.65); /* Dark semi-transparent overlay */
  z-index: 1;
}

.hero-banner .container{
  position: relative;
  z-index: 2;
}

.hero-banner .hero-title{
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 700;
  line-height: 1.2;
  color: #ffffff;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  margin-bottom: 1.5rem;
}

.hero-banner .hero-subtitle{
  font-size: clamp(1.1rem, 2vw, 1.4rem);
  color: rgba(255, 255, 255, 0.95);
  line-height: 1.7;
  max-width: 800px;
  margin: 0 auto;
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
}

/* Hero Buttons */
.btn-hero-primary{
  background-color: #ffffff;
  color: #0f172a;
  border: 2px solid #ffffff;
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.btn-hero-primary:hover{
  background-color: #f8f9fa;
  color: #0f172a;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}

.btn-hero-secondary{
  background-color: transparent;
  color: #ffffff;
  border: 2px solid #ffffff;
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.btn-hero-secondary:hover{
  background-color: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  border-color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 4px 15px rgba(255, 255, 255, 0.2);
}

/* Hero Stats */
.hero-banner .hero-stats{
  margin-top: 3rem;
}

.hero-banner .stat-item{
  text-align: center;
}

.hero-banner .stat-item .fs-2{
  font-size: 2.5rem;
  font-weight: 700;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.hero-banner .stat-item small{
  font-size: 0.95rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* Homepage Hero Title */
.hero-title-homepage{
  font-size: clamp(2rem, 6vw, 3.5rem);
  font-weight: 800;
  line-height: 1.15;
  color: #ffffff;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
  margin-bottom: 1.5rem;
  letter-spacing: -0.5px;
}

.hero-title-homepage .text-primary-accent{
  color: #ff1212 !important;
  position: relative;
  display: inline-block;
}

.hero-title-homepage .text-primary-accent::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, #ff1212, transparent);
  opacity: 0.3;
}

/* Homepage Hero Subtitle */
.hero-subtitle-homepage{
  font-size: clamp(1rem, 2.5vw, 1.25rem);
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.7;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  margin-bottom: 1.5rem;
}

/* Trust Badge */
.badge-trust{
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #ffffff;
  font-size: 0.9rem;
}

/* Benefit Icons */
.hero-benefits .benefit-icon{
  width: 32px;
  height: 32px;
  background: rgba(255, 18, 18, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.hero-benefits .benefit-icon i{
  color: #ff1212;
  font-size: 0.9rem;
}

/* Homepage Hero Buttons */
.btn-hero-primary-homepage{
  background: linear-gradient(135deg, #ff1212 0%, #ff4444 100%);
  color: #ffffff;
  border: none;
  font-weight: 700;
  border-radius: 50px;
  transition: all 0.3s ease;
  box-shadow: 0 6px 25px rgba(255, 18, 18, 0.4);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 0.95rem;
}

.btn-hero-primary-homepage:hover{
  background: linear-gradient(135deg, #cc0e0e 0%, #ff3333 100%);
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(255, 18, 18, 0.5);
}

.btn-hero-secondary-homepage{
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  color: #ffffff;
  border: 2px solid rgba(255, 255, 255, 0.3);
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
  font-size: 0.95rem;
}

.btn-hero-secondary-homepage:hover{
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.5);
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(255, 255, 255, 0.2);
}

/* Homepage Stat Cards */
.stat-card-homepage{
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(15px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 20px;
  padding: 1.5rem 1rem;
  text-align: center;
  transition: all 0.3s ease;
  height: 100%;
}

.stat-card-homepage:hover{
  background: rgba(255, 255, 255, 0.15);
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.stat-icon-homepage{
  width: 50px;
  height: 50px;
  background: rgba(255, 18, 18, 0.2);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.stat-icon-homepage i{
  color: #ff1212;
  font-size: 1.5rem;
}

.stat-number-homepage{
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 800;
  color: #ffffff;
  line-height: 1;
  margin-bottom: 0.5rem;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.stat-label-homepage{
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
}

/* Trust Indicators */
.hero-trust-indicators{
  padding-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.hero-trust-indicators i{
  font-size: 1rem;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .hero-title-homepage{
    font-size: clamp(1.75rem, 8vw, 2.5rem);
    margin-bottom: 1rem;
  }
  
  .hero-subtitle-homepage{
    font-size: clamp(0.95rem, 4vw, 1.1rem);
    margin-bottom: 1.5rem;
  }
  
  .hero-benefits{
    margin-bottom: 2rem;
  }
  
  .hero-benefits .d-flex{
    margin-bottom: 1rem !important;
  }
  
  .hero-cta-buttons{
    margin-bottom: 2rem;
  }
  
  .hero-cta-buttons .btn{
    width: 100%;
    justify-content: center;
  }
  
  .hero-trust-indicators{
    flex-direction: column;
    gap: 1rem !important;
    align-items: flex-start !important;
  }
  
  .stat-card-homepage{
    padding: 1.25rem 0.75rem;
  }
  
  .stat-icon-homepage{
    width: 40px;
    height: 40px;
  }
  
  .stat-icon-homepage i{
    font-size: 1.25rem;
  }
  
  .stat-number-homepage{
    font-size: 1.5rem;
  }
  
  .stat-label-homepage{
    font-size: 0.75rem;
  }
}

@media (max-width: 576px) {
  .hero-banner-homepage{
    padding: 2rem 0 3rem;
  }
  
  .badge-trust{
    font-size: 0.8rem;
    padding: 0.5rem 1rem;
  }
  
  .hero-benefits .benefit-icon{
    width: 28px;
    height: 28px;
  }
  
  .hero-benefits .benefit-icon i{
    font-size: 0.8rem;
  }
}

/* Legacy hero-modern styles (for backward compatibility) */
.hero-modern{
  position: relative;
  background: linear-gradient(120deg, #ff1212 0%, #ff6666 100%);
  overflow: hidden;
  padding: 5rem 0 6rem;
}
.hero-modern .hero-title{
  font-size: clamp(2.5rem, 4vw, 3.5rem);
  font-weight: 700;
  line-height: 1.2;
}
.hero-modern .hero-eyebrow{
  letter-spacing: .25rem;
  font-size: .85rem;
  color: rgba(255,255,255,0.8);
}
.hero-modern .hero-subtitle{
  color: rgba(255,255,255,0.85);
  font-size: 1.1rem;
  max-width: 560px;
  line-height: 1.7;
}
.hero-overlay{
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 20%, rgba(255,255,255,0.15), transparent 45%), radial-gradient(circle at 80% 0, rgba(255,255,255,0.2), transparent 40%), radial-gradient(circle at 50% 80%, rgba(0,0,0,0.2), transparent 45%);
  mix-blend-mode: screen;
}
.hero-visual{
  position: relative;
  border-radius: 26px;
  overflow: hidden;
  box-shadow: 0 20px 45px rgba(0,0,0,0.4);
  max-width: 320px;
  margin-left: auto;
}
.hero-visual:before{
  content:'';
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.45), transparent 55%);
  mix-blend-mode: screen;
}
.hero-image{
  width:100%;
  padding-top:100%;
  background-size: cover;
  background-position: center;
  filter: saturate(1.1);
}
.hero-visual-badge{
  position:absolute;
  top:20px;
  left:20px;
  background:rgba(15,23,42,.85);
  color:#fff;
  padding:.6rem 1.2rem;
  border-radius:999px;
  font-weight:600;
  display:inline-flex;
  align-items:center;
}
.glass{
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(10px);
  border: 1px solid var(--brand-border);
}
.card-hover:hover{ 
  transform: translateY(-2px); 
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.1); 
  border-color: var(--brand-border);
}
.card{
  background: var(--brand-card);
  border-color: var(--brand-border);
  color: #0f172a;
}
.nav-link{ 
  font-weight:500; 
  transition: all 0.3s ease;
  position: relative;
}
.nav-link:hover{
  background-color: var(--brand-primary-ghost);
  color: var(--brand-primary) !important;
  transform: translateY(-1px);
}

/* Navbar Styling */
.navbar{
  background: var(--brand-surface) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
}
.navbar.scrolled{
  background: var(--brand-surface) !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  opacity: 1 !important;
}
.navbar-light{
  background: var(--brand-surface) !important;
  opacity: 1 !important;
}
.navbar.bg-white{
  background: var(--brand-surface) !important;
  opacity: 1 !important;
}
.navbar-brand{
  transition: all 0.3s ease;
}
.navbar-brand:hover{
  transform: scale(1.05);
}
.navbar-brand .bg-primary{
  transition: all 0.3s ease;
}
.navbar-brand:hover .bg-primary{
  background-color: var(--brand-primary) !important;
  transform: rotate(5deg);
}
.navbar-brand:hover .bg-primary i{
  color: white !important;
}
.btn-primary{
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.btn-primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255, 18, 18, 0.3);
  background-color: #cc0e0e;
  border-color: #cc0e0e;
}
.btn-primary::before{
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition: left 0.5s;
}
.btn-primary:hover::before{
  left: 100%;
}
.section-title{ font-weight:700; letter-spacing:.3px; }
.footer a:hover{ color: var(--brand)!important; }

/* Feature Cards */
.feature-card{
  transition: all 0.3s ease;
  border: 1px solid rgba(0,0,0,0.05) !important;
}
.feature-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.1) !important;
  border-color: var(--brand-primary) !important;
}
.feature-card .icon-box{
  transition: all 0.3s ease;
}
.feature-card:hover .icon-box{
  transform: scale(1.1);
  background-color: var(--brand-primary) !important;
}
.feature-card:hover .icon-box i{
  color: white !important;
}

/* Additional Admin Panel Matching Styles */
.bg-primary,
.bg-primary.bg-opacity-10,
.bg-primary.bg-opacity-25,
.bg-primary.bg-opacity-50,
.bg-primary.bg-opacity-75{
  background-color: var(--brand-primary) !important;
}
.bg-primary.bg-opacity-10{
  background-color: rgba(255,18,18,0.1) !important;
}
.bg-primary-ghost{
  background-color: var(--brand-primary-ghost) !important;
}
.text-primary,
i.text-primary,
.fa-solid.text-primary,
.fa-regular.text-primary,
.fa-brands.text-primary{
  color: #ff1212 !important;
}
.text-muted{
  color: var(--brand-muted) !important;
}
.border-primary{
  border-color: var(--brand-primary) !important;
}
.shadow-sm{
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}
.shadow{
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}
.shadow-lg{
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Platform Cards */
.platform-card{
  transition: all 0.3s ease;
  border: 1px solid rgba(0,0,0,0.05) !important;
}
.platform-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.1) !important;
  border-color: var(--brand-primary) !important;
}
.platform-card .bg-primary,
.platform-card .bg-success,
.platform-card .bg-warning,
.platform-card .bg-info,
.platform-card .bg-danger{
  transition: all 0.3s ease;
}
.platform-card:hover .bg-primary{
  background-color: var(--brand-primary) !important;
}
.platform-card:hover .bg-primary i{
  color: white !important;
}
.platform-card:hover .bg-success{
  background-color: #059669 !important;
}
.platform-card:hover .bg-success i{
  color: white !important;
}
.platform-card:hover .bg-warning{
  background-color: #d97706 !important;
}
.platform-card:hover .bg-warning i{
  color: white !important;
}
.platform-card:hover .bg-info{
  background-color: #0891b2 !important;
}
.platform-card:hover .bg-info i{
  color: white !important;
}
.platform-card:hover .bg-danger{
  background-color: #ff1212 !important;
}
.platform-card:hover .bg-danger i{
  color: white !important;
}

/* Footer Styling */
footer .bg-primary,
footer .bg-primary.bg-opacity-10{
  background-color: rgba(255,18,18,0.1)!important;
}
footer .text-primary,
footer i.text-primary,
footer .fa-solid.text-primary,
footer .fa-regular.text-primary,
footer .fa-brands.text-primary{
  color: #ff1212!important;
}
footer a:hover{
  color: var(--brand-primary) !important;
  transition: color 0.3s ease;
}
footer .input-group .form-control{
  border-color: #495057;
  background-color: rgba(255,255,255,0.1);
  color: white;
}
footer .input-group .form-control::placeholder{
  color: rgba(255,255,255,0.6);
}
footer .input-group .form-control:focus{
  border-color: var(--brand-primary);
  box-shadow: 0 0 0 0.2rem rgba(255, 18, 18, 0.25);
  background-color: rgba(255,255,255,0.15);
}
footer .btn-primary{
  background-color: #ff1212!important;
  border-color: #ff1212!important;
}
footer .btn-primary:hover{
  background-color: #cc0e0e!important;
  border-color: #cc0e0e!important;
}

/* About Page Text Overrides */
.about-hero h1,
.about-hero .lead,
.about-hero span{
  color: #ffffff !important;
}
.about-hero{
  background: linear-gradient(135deg, #ff1212 0%, #ff4444 100%) !important;
  min-height: auto;
  position: relative;
}

/* Minimum viewport height utilities */
.min-vh-75 {
  min-height: 75vh !important;
}

/* Call to Action Section */
.cta-section h2,
.cta-section .lead{
  color: #ffffff !important;
}
.cta-section{
  background: linear-gradient(135deg, #ff1212 0%, #cc0e0e 100%) !important;
}

/* About Page Animations */
@keyframes rotate {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-20px); }
}

.about-hero .position-relative {
  animation: none;
}

.about-hero .position-relative > div {
  animation: rotate 20s linear infinite;
}

.about-hero .position-relative > div:nth-child(2) {
  animation: rotate 15s linear infinite reverse;
}

/* Pulse Animation for Founder Image */
@keyframes pulse {
  0% { transform: translate(-50%, -50%) scale(1); opacity: 0.2; }
  50% { transform: translate(-50%, -50%) scale(1.05); opacity: 0.4; }
  100% { transform: translate(-50%, -50%) scale(1); opacity: 0.2; }
}

/* Map Styling */
.text-purple { color: #8b5cf6 !important; }
.bg-purple { background-color: #8b5cf6 !important; }

.zone-marker {
  cursor: pointer;
  transition: all 0.3s ease;
}

.zone-marker:hover {
  transform: scale(1.2);
  filter: brightness(1.2);
}

.beliefs-card, .declarations-card{
  border-radius:24px;
  background:#fff;
}
.beliefs-list, .declarations-list{
  list-style:disc;
  padding-left:1.2rem;
  color:#475569;
  line-height:1.7;
}
.beliefs-list li:not(:last-child),
.declarations-list li:not(:last-child){
  margin-bottom:.6rem;
}

/* Map Container */
.map-container {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

/* Hero image mosaic */
.hero-image-mosaic{
  max-width: 360px;
  min-height: 360px;
}
.hero-image-mosaic .mosaic-card{
  position: absolute;
  border-radius: 24px;
}
.hero-image-mosaic .mosaic-card img{
  display: block;
  width: 100%;
  height: 100%;
}
.hero-image-mosaic .main{
  width: 240px;
  height: 320px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.hero-image-mosaic .secondary{
  width: 150px;
  height: 190px;
  top: -20px;
  right: -20px;
}
.hero-image-mosaic .tertiary{
  width: 140px;
  height: 180px;
  bottom: -10px;
  left: -10px;
}
.hero-image-mosaic .mosaic-badge{
  position: absolute;
  top: 12px;
  left: 12px;
  background: rgba(17,24,39,0.8);
  color: #fff;
  padding: 0.4rem 0.9rem;
  border-radius: 999px;
  display: inline-flex;
  gap: 0.4rem;
  align-items: center;
  font-size: 0.85rem;
  font-weight: 600;
}
.hero-image-mosaic .mosaic-stat{
  position: absolute;
  bottom: -20px;
  right: -20px;
  background: rgba(15,23,42,0.9);
  color: #fff;
  padding: 0.9rem 1.2rem;
  border-radius: 16px;
}

/* Welcome Section Styles - Interactive Version */
.welcome-section-interactive{
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  position: relative;
  overflow: hidden;
}

.welcome-section-interactive::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 18, 18, 0.1), transparent);
}

/* Welcome Badge */
.welcome-badge-interactive{
  display: inline-flex;
  align-items: center;
  background: linear-gradient(135deg, rgba(255, 18, 18, 0.1) 0%, rgba(255, 68, 68, 0.1) 100%);
  border: 1px solid rgba(255, 18, 18, 0.2);
  color: #ff1212;
  padding: 0.75rem 1.5rem;
  border-radius: 50px;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  animation: pulse-badge 2s ease-in-out infinite;
}

.welcome-badge-interactive i{
  animation: sparkle 1.5s ease-in-out infinite;
}

@keyframes pulse-badge {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 18, 18, 0.4); }
  50% { transform: scale(1.02); box-shadow: 0 0 0 8px rgba(255, 18, 18, 0); }
}

@keyframes sparkle {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.1); }
}

/* Welcome Heading */
.welcome-heading-interactive{
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -1px;
}

.welcome-text-gradient{
  background: linear-gradient(135deg, #ff1212 0%, #ff4444 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
  animation: gradient-shift 3s ease infinite;
}

.welcome-text-main{
  color: #0f172a;
  display: inline-block;
}

@keyframes gradient-shift {
  0%, 100% { filter: hue-rotate(0deg); }
  50% { filter: hue-rotate(5deg); }
}

/* Interactive Divider */
.welcome-divider-interactive{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin: 2rem 0;
}

.divider-line-animated{
  width: 80px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #ff1212, transparent);
  position: relative;
  animation: line-grow 1.5s ease-out;
}

@keyframes line-grow {
  0% { width: 0; opacity: 0; }
  100% { width: 80px; opacity: 1; }
}

.divider-icon-interactive{
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #ff1212 0%, #ff4444 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(255, 18, 18, 0.3);
  animation: icon-rotate 3s ease-in-out infinite;
  cursor: pointer;
  transition: all 0.3s ease;
}

.divider-icon-interactive:hover{
  transform: scale(1.1) rotate(180deg);
  box-shadow: 0 8px 25px rgba(255, 18, 18, 0.4);
}

@keyframes icon-rotate {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-5deg); }
  75% { transform: rotate(5deg); }
}

.divider-icon-interactive i{
  color: #ffffff;
  font-size: 1.1rem;
  animation: star-pulse 2s ease-in-out infinite;
}

@keyframes star-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

/* Welcome Cards */
.welcome-card-interactive{
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 2.5rem 2rem;
  height: 100%;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.welcome-card-interactive::before{
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 18, 18, 0.05), transparent);
  transition: left 0.5s ease;
}

.welcome-card-interactive:hover::before{
  left: 100%;
}

.welcome-card-interactive:hover{
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  border-color: #ff1212;
}

.welcome-card-icon{
  width: 70px;
  height: 70px;
  background: linear-gradient(135deg, rgba(255, 18, 18, 0.1) 0%, rgba(255, 68, 68, 0.1) 100%);
  border: 2px solid rgba(255, 18, 18, 0.2);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  transition: all 0.3s ease;
}

.welcome-card-interactive:hover .welcome-card-icon{
  background: linear-gradient(135deg, rgba(255, 18, 18, 0.15) 0%, rgba(255, 68, 68, 0.15) 100%);
  border-color: rgba(255, 18, 18, 0.4);
  transform: scale(1.1) rotate(5deg);
}

.welcome-card-icon i{
  color: #ff1212;
  font-size: 1.75rem;
  transition: all 0.3s ease;
}

.welcome-card-interactive:hover .welcome-card-icon i{
  transform: scale(1.1);
}

.welcome-card-title{
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
  transition: color 0.3s ease;
}

.welcome-card-interactive:hover .welcome-card-title{
  color: #ff1212;
}

.welcome-card-text{
  font-size: 1rem;
  line-height: 1.7;
  color: #64748b;
  margin: 0;
  transition: color 0.3s ease;
}

.welcome-card-interactive:hover .welcome-card-text{
  color: #475569;
}

/* Welcome CTA Section */
.welcome-cta-interactive{
  background: linear-gradient(135deg, rgba(255, 18, 18, 0.05) 0%, rgba(255, 68, 68, 0.05) 100%);
  border: 1px solid rgba(255, 18, 18, 0.1);
  border-radius: 24px;
  padding: 3rem 2rem;
  margin-top: 2rem;
}

.welcome-cta-text{
  font-size: 1.25rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.btn-welcome-primary{
  background: linear-gradient(135deg, #ff1212 0%, #ff4444 100%);
  color: #ffffff;
  border: none;
  font-weight: 700;
  border-radius: 50px;
  transition: all 0.3s ease;
  box-shadow: 0 6px 25px rgba(255, 18, 18, 0.3);
  position: relative;
  overflow: hidden;
}

.btn-welcome-primary::before{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}

.btn-welcome-primary:hover::before{
  width: 300px;
  height: 300px;
}

.btn-welcome-primary:hover{
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(255, 18, 18, 0.4);
}

.btn-welcome-primary span,
.btn-welcome-secondary span{
  position: relative;
  z-index: 1;
}

.btn-welcome-secondary{
  background: #ffffff;
  color: #0f172a;
  border: 2px solid #e2e8f0;
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.btn-welcome-secondary:hover{
  background: #f8fafc;
  border-color: #ff1212;
  color: #ff1212;
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

/* Mobile Responsive for Interactive Welcome */
@media (max-width: 768px) {
  .welcome-section-interactive{
    padding: 3rem 0;
  }
  
  .welcome-heading-interactive{
    font-size: 2rem;
  }
  
  .welcome-card-interactive{
    padding: 2rem 1.5rem;
    margin-bottom: 1rem;
  }
  
  .welcome-card-icon{
    width: 60px;
    height: 60px;
  }
  
  .welcome-card-icon i{
    font-size: 1.5rem;
  }
  
  .welcome-card-title{
    font-size: 1.25rem;
  }
  
  .welcome-card-text{
    font-size: 0.95rem;
  }
  
  .welcome-cta-interactive{
    padding: 2rem 1.5rem;
  }
  
  .welcome-cta-text{
    font-size: 1.1rem;
  }
  
  .btn-welcome-primary,
  .btn-welcome-secondary{
    width: 100%;
  }
  
  .divider-line-animated{
    width: 50px;
  }
  
  .divider-icon-interactive{
    width: 45px;
    height: 45px;
  }
}

@media (max-width: 576px) {
  .welcome-badge-interactive{
    font-size: 0.8rem;
    padding: 0.6rem 1.25rem;
  }
  
  .welcome-heading-interactive{
    font-size: 1.75rem;
  }
  
  .welcome-card-interactive{
    padding: 1.75rem 1.25rem;
  }
}

/* Club Snapshot Section Styles */
.snapshot-section{
  background: #f8fafc;
  position: relative;
}

.snapshot-heading{
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.5px;
  margin-bottom: 0.75rem;
}

.snapshot-subtitle{
  font-size: 1rem;
  color: #64748b;
  font-weight: 400;
}

.snapshot-card{
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 2rem 1.5rem;
  text-align: center;
  transition: all 0.3s ease;
  height: 100%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.snapshot-card:hover{
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  border-color: #ff1212;
}

.snapshot-icon-wrapper{
  width: 70px;
  height: 70px;
  background: linear-gradient(135deg, rgba(255, 18, 18, 0.1) 0%, rgba(255, 68, 68, 0.1) 100%);
  border: 2px solid rgba(255, 18, 18, 0.2);
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
  transition: all 0.3s ease;
}

.snapshot-card:hover .snapshot-icon-wrapper{
  background: linear-gradient(135deg, rgba(255, 18, 18, 0.15) 0%, rgba(255, 68, 68, 0.15) 100%);
  border-color: rgba(255, 18, 18, 0.4);
  transform: scale(1.05);
}

.snapshot-icon-wrapper i{
  color: #ff1212;
  font-size: 1.75rem;
  font-weight: 600;
}

.snapshot-number{
  font-size: clamp(2rem, 5vw, 2.75rem);
  font-weight: 800;
  color: #0f172a;
  line-height: 1;
  margin-bottom: 0.5rem;
  letter-spacing: -1px;
}

.snapshot-plus{
  color: #ff1212;
  font-weight: 700;
  margin-left: 2px;
}

.snapshot-label{
  font-size: 1rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 0.25rem;
  letter-spacing: 0.3px;
}

.snapshot-sublabel{
  font-size: 0.875rem;
  color: #64748b;
  font-weight: 400;
  line-height: 1.4;
}

/* Mobile Responsive for Welcome & Snapshot Sections */
@media (max-width: 768px) {
  .welcome-section,
  .snapshot-section{
    padding: 3rem 0;
  }
  
  .welcome-heading{
    font-size: 1.75rem;
    margin-bottom: 1rem;
  }
  
  .divider-icon{
    width: 35px;
    height: 35px;
  }
  
  .divider-icon i{
    font-size: 0.8rem;
  }
  
  .divider-line{
    width: 40px;
  }
  
  .welcome-text-primary{
    font-size: 1.1rem;
    margin-bottom: 1rem;
  }
  
  .welcome-text-secondary{
    font-size: 1rem;
  }
  
  .snapshot-heading{
    font-size: 1.75rem;
  }
  
  .snapshot-card{
    padding: 1.5rem 1rem;
  }
  
  .snapshot-icon-wrapper{
    width: 60px;
    height: 60px;
    margin-bottom: 1.25rem;
  }
  
  .snapshot-icon-wrapper i{
    font-size: 1.5rem;
  }
  
  .snapshot-number{
    font-size: 1.75rem;
  }
  
  .snapshot-label{
    font-size: 0.95rem;
  }
  
  .snapshot-sublabel{
    font-size: 0.8rem;
  }
}

@media (max-width: 576px) {
  .welcome-section,
  .snapshot-section{
    padding: 2.5rem 0;
  }
  
  .snapshot-card{
    padding: 1.25rem 0.75rem;
  }
  
  .snapshot-icon-wrapper{
    width: 55px;
    height: 55px;
  }
  
  .snapshot-icon-wrapper i{
    font-size: 1.25rem;
  }
}

/* About photo grid */
.about-photo-grid{
  position: relative;
  min-height: 300px;
}
.about-photo-grid .photo-large{
  width: 75%;
  height: 260px;
}
.about-photo-grid .photo-small{
  position: absolute;
  width: 140px;
  height: 160px;
}
.about-photo-grid .photo-small.top{
  top: -20px;
  right: 0;
}
.about-photo-grid .photo-small.bottom{
  bottom: -15px;
  left: 10px;
}
.about-photo-card{
  position:absolute;
  bottom:-5px;
  right:0;
  background:#fff;
  padding:1rem 1.2rem;
  border-radius:16px;
  max-width:220px;
}
.about-card{
  display:flex;
  gap:1rem;
  padding:1.2rem;
  border-radius:18px;
  background:#fff;
  margin-bottom:1rem;
  box-shadow:0 10px 30px rgba(15,23,42,0.08);
}
.about-card .icon{
  width:48px;
  height:48px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,18,18,0.1);
  color:var(--brand-primary);
  font-size:1.1rem;
}
.about-card.vision .icon{
  background:rgba(5,150,105,0.1);
  color:#059669;
}
.about-card h5{
  margin-bottom:.25rem;
  font-weight:600;
  color:#0f172a;
}
.about-stat{
  background:#fff;
  border-radius:20px;
  padding:1.2rem 1.5rem;
}
.about-stat .value{
  font-size:1.8rem;
  font-weight:700;
  color:#ff1212;
}

/* About Hero Stat Cards Hover Effect */
.about-hero .rounded-4:hover {
  transform: translateY(-5px);
  background: rgba(255,255,255,0.15) !important;
  border-color: rgba(255,255,255,0.25) !important;
}

/* Force Red Override for All Bootstrap Primary Classes - Must be at end to override everything */
.bg-primary,
.bg-primary.bg-opacity-10,
.bg-primary.bg-opacity-25,
.bg-primary.bg-opacity-50,
.bg-primary.bg-opacity-75,
.bg-primary.bg-opacity-90,
.bg-primary.bg-opacity-100{
  background-color: #ff1212 !important;
}
.bg-primary.bg-opacity-10{
  background-color: rgba(255,18,18,0.1) !important;
}
.bg-primary.bg-opacity-25{
  background-color: rgba(255,18,18,0.25) !important;
}
.bg-primary.bg-opacity-50{
  background-color: rgba(255,18,18,0.5) !important;
}
.bg-primary.bg-opacity-75{
  background-color: rgba(255,18,18,0.75) !important;
}
.bg-primary.bg-opacity-90{
  background-color: rgba(255,18,18,0.9) !important;
}

.text-primary,
.text-primary *,
i.text-primary,
.fa-solid.text-primary,
.fa-regular.text-primary,
.fa-brands.text-primary,
[class*="text-primary"]{
  color: #ff1212 !important;
}

.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active{
  background-color: #ff1212 !important;
  border-color: #ff1212 !important;
}
.btn-primary:hover{
  background-color: #cc0e0e !important;
  border-color: #cc0e0e !important;
}

/* Policy Pages Styles */
.policy-page{
  background: #f8f9fa;
  min-height: 70vh;
}

.policy-icon-wrapper{
  width: 100px;
  height: 100px;
  background: linear-gradient(135deg, rgba(255,18,18,0.1) 0%, rgba(255,18,18,0.05) 100%);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 3px solid rgba(255,18,18,0.2);
  animation: pulse-badge 2s ease-in-out infinite;
}

.policy-icon-wrapper i{
  font-size: 2.5rem;
  color: #ff1212;
}

.policy-page-title{
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.policy-page-subtitle{
  font-size: 1rem;
  color: #64748b;
  font-weight: 500;
}

.policy-content-card{
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  overflow: hidden;
  border: 1px solid #e5e7eb;
}

.policy-content-body{
  padding: 3rem;
}

.policy-content-body h3{
  font-size: 1.75rem;
  font-weight: 700;
  color: #0f172a;
  margin-top: 2rem;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 3px solid rgba(255,18,18,0.2);
}

.policy-content-body h3:first-child{
  margin-top: 0;
}

.policy-content-body h4{
  font-size: 1.35rem;
  font-weight: 600;
  color: #1e293b;
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}

.policy-content-body p{
  font-size: 1rem;
  line-height: 1.8;
  color: #475569;
  margin-bottom: 1rem;
}

.policy-content-body ul,
.policy-content-body ol{
  margin: 1rem 0;
  padding-left: 2rem;
}

.policy-content-body li{
  font-size: 1rem;
  line-height: 1.8;
  color: #475569;
  margin-bottom: 0.5rem;
}

.policy-content-body strong{
  color: #0f172a;
  font-weight: 600;
}

.policy-contact-box{
  background: linear-gradient(135deg, rgba(255,18,18,0.05) 0%, rgba(255,18,18,0.02) 100%);
  border: 2px solid rgba(255,18,18,0.1);
  border-radius: 15px;
  padding: 2.5rem;
}

.policy-contact-box h5{
  font-size: 1.5rem;
  font-weight: 600;
  color: #0f172a;
}

@media (max-width: 768px){
  .policy-content-body{
    padding: 2rem 1.5rem;
  }
  
  .policy-icon-wrapper{
    width: 80px;
    height: 80px;
  }
  
  .policy-icon-wrapper i{
    font-size: 2rem;
  }
  
  .policy-page-title{
    font-size: 2rem;
  }
  
  .policy-content-body h3{
    font-size: 1.5rem;
  }
  
  .policy-content-body h4{
    font-size: 1.2rem;
  }
  
  .policy-contact-box{
    padding: 1.5rem;
  }
}

/* Events Page Styles */
.events-hero-section{
  background: linear-gradient(135deg, rgba(255,18,18,0.05) 0%, rgba(255,18,18,0.02) 100%);
  position: relative;
  overflow: hidden;
}

.events-hero-section::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(circle at 20% 30%, rgba(255,18,18,0.08) 0%, transparent 50%), 
                    radial-gradient(circle at 80% 70%, rgba(255,18,18,0.06) 0%, transparent 50%);
  pointer-events: none;
}

.events-badge-eyebrow{
  background: rgba(255, 18, 18, 0.15);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 18, 18, 0.3);
  color: #ff1212;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.events-badge-eyebrow i{
  color: #ff1212;
  font-size: 1rem;
}

.events-page-title{
  font-size: clamp(2rem, 6vw, 3.5rem);
  font-weight: 800;
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 1.5rem;
  letter-spacing: -0.5px;
}

.events-page-title .text-primary-accent-events{
  color: #ff1212 !important;
  position: relative;
  display: inline-block;
}

.events-page-title .text-primary-accent-events::after{
  content: '';
  position: absolute;
  bottom: 0.15em;
  left: 0;
  right: 0;
  height: 0.2em;
  background: linear-gradient(90deg, rgba(255,18,18,0.3) 0%, rgba(255,18,18,0.1) 100%);
  border-radius: 2px;
  z-index: -1;
}

.events-page-subtitle{
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: #64748b;
  line-height: 1.7;
  max-width: 700px;
  margin: 0 auto;
}

/* Events Listing Section */
.events-listing-section{
  background: #f8f9fa;
}

/* Event Card Modern */
.event-card-modern{
  background: #ffffff;
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  border: 1px solid #e5e7eb;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
}

/* Landscape Event Card */
.event-card-landscape{
  min-height: auto;
  height: auto;
}

.event-card-landscape-content{
  display: flex;
  flex-direction: row;
  gap: 0;
}

.event-card-landscape-left{
  flex: 1;
  padding: 2.5rem;
  border-right: 1px solid #e5e7eb;
  display: flex;
  align-items: flex-start;
  background: linear-gradient(to right, #ffffff 0%, #fafbfc 100%);
}

.event-card-landscape-left .event-card-body{
  padding: 0;
  width: 100%;
  max-width: 100%;
}

.event-card-landscape-right{
  flex: 0 0 380px;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.event-card-subtitle{
  font-size: 0.9rem;
  font-weight: 600;
  color: #64748b;
  margin-bottom: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.event-card-meta-landscape{
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 0;
  padding: 0;
  border: none;
}

.event-meta-item-landscape{
  display: flex;
  align-items: flex-start;
  margin-bottom: 0;
}

.event-card-footer-landscape{
  margin-top: auto;
  padding-top: 0;
}

.event-card-modern::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #ff1212 0%, rgba(255,18,18,0.5) 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.event-card-modern:hover{
  transform: translateY(-8px);
  box-shadow: 0 12px 40px rgba(255,18,18,0.15);
  border-color: rgba(255,18,18,0.3);
}

.event-card-modern:hover::before{
  transform: scaleX(1);
}

.event-card-badge{
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  z-index: 2;
}

.badge-event-status{
  background: rgba(255,18,18,0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,18,18,0.2);
  color: #ff1212;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.4rem 0.9rem;
  border-radius: 50px;
  display: inline-flex;
  align-items: center;
  letter-spacing: 0.3px;
}

.badge-event-status i{
  font-size: 0.5rem;
  animation: pulse-dot 2s ease-in-out infinite;
}

@keyframes pulse-dot{
  0%, 100%{ opacity: 1; }
  50%{ opacity: 0.5; }
}

.event-card-body{
  padding: 2rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.event-card-landscape-left .event-card-body{
  padding: 0;
}

.event-card-title{
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 0.75rem;
  line-height: 1.2;
  padding-right: 3rem;
  letter-spacing: -0.02em;
  position: relative;
}

.event-card-title::after{
  content: '';
  position: absolute;
  bottom: -0.5rem;
  left: 0;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, #ff1212 0%, rgba(255,18,18,0.3) 100%);
}

.event-card-description{
  font-size: 0.95rem;
  line-height: 1.7;
  color: #64748b;
  margin-bottom: 1.5rem;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.event-card-description-full{
  font-size: 1rem;
  line-height: 1.85;
  color: #475569;
  margin-bottom: 0;
  margin-top: 1.5rem;
  white-space: pre-wrap;
  word-wrap: break-word;
  font-weight: 400;
  letter-spacing: 0.01em;
}

.event-card-description-full p{
  margin-bottom: 1.25rem;
  text-align: justify;
}

.event-card-description-full p:last-child{
  margin-bottom: 0;
}

.event-card-meta{
  margin-bottom: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e5e7eb;
}

.event-meta-item{
  display: flex;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.event-meta-item:last-child{
  margin-bottom: 0;
}

.event-meta-icon{
  width: 40px;
  height: 40px;
  min-width: 40px;
  background: rgba(255,18,18,0.1);
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.75rem;
  flex-shrink: 0;
}

.event-meta-icon i{
  color: #ff1212;
  font-size: 1rem;
}

.event-meta-content{
  flex: 1;
  display: flex;
  flex-direction: column;
}

.event-meta-label{
  font-size: 0.75rem;
  font-weight: 600;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 0.25rem;
}

.event-meta-value{
  font-size: 0.95rem;
  font-weight: 600;
  color: #0f172a;
}

.event-card-footer{
  margin-top: auto;
  padding-top: 1rem;
}

.btn-event-register{
  width: 100%;
  background: linear-gradient(135deg, #ff1212 0%, #cc0e0e 100%);
  color: #ffffff;
  border: none;
  font-weight: 600;
  font-size: 1rem;
  padding: 0.875rem 1.5rem;
  border-radius: 0;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  box-shadow: 0 4px 15px rgba(255,18,18,0.25);
  position: relative;
  overflow: hidden;
}

.btn-event-register::before{
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition: left 0.5s ease;
}

.btn-event-register:hover::before{
  left: 100%;
}

.btn-event-register:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 25px rgba(255,18,18,0.35);
  background: linear-gradient(135deg, #cc0e0e 0%, #ff1212 100%);
}

.btn-event-register:active{
  transform: translateY(0);
}

.btn-event-register .btn-text{
  display: flex;
  align-items: center;
}

.btn-event-register .btn-icon{
  display: flex;
  align-items: center;
  transition: transform 0.3s ease;
}

.btn-event-register:hover .btn-icon{
  transform: translateX(4px);
}

.btn-event-register.disabled,
.btn-event-register:disabled{
  background: #94a3b8 !important;
  cursor: not-allowed;
  opacity: 0.7;
  box-shadow: none;
}

.btn-event-register.disabled:hover,
.btn-event-register:disabled:hover{
  transform: none;
  box-shadow: none;
}

/* Event Countdown Timer */
.event-countdown-wrapper{
  background: linear-gradient(135deg, rgba(255,18,18,0.08) 0%, rgba(255,18,18,0.04) 100%);
  border: 1px solid rgba(255,18,18,0.15);
  border-radius: 0;
  padding: 1rem;
  margin-bottom: 1.5rem;
}

.event-countdown-label{
  font-size: 0.85rem;
  font-weight: 600;
  color: #ff1212;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
}

.event-countdown{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.countdown-item{
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 60px;
}

.countdown-value{
  font-size: 2rem;
  font-weight: 800;
  color: #ff1212;
  line-height: 1;
  margin-bottom: 0.25rem;
  font-variant-numeric: tabular-nums;
}

.countdown-label-small{
  font-size: 0.7rem;
  font-weight: 600;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.event-registration-closed{
  background: rgba(148, 163, 184, 0.1);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 0;
  padding: 1rem;
  margin-bottom: 1.5rem;
  text-align: center;
  font-size: 0.9rem;
  font-weight: 600;
  color: #64748b;
}

/* Empty State */
.events-empty-state{
  background: #ffffff;
  border-radius: 0;
  padding: 4rem 2rem;
  text-align: center;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  border: 1px solid #e5e7eb;
}

.events-empty-icon{
  width: 120px;
  height: 120px;
  margin: 0 auto;
  background: linear-gradient(135deg, rgba(255,18,18,0.1) 0%, rgba(255,18,18,0.05) 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid rgba(255,18,18,0.2);
}

.events-empty-icon i{
  font-size: 3.5rem;
  color: #ff1212;
  opacity: 0.7;
}

.events-empty-title{
  font-size: 1.75rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.events-empty-text{
  font-size: 1rem;
  color: #64748b;
  line-height: 1.7;
  max-width: 500px;
  margin: 0 auto;
}

/* Responsive Styles for Events Page */
@media (max-width: 992px){
  .events-hero-section{
    padding: 3rem 0 4rem;
  }
  
  .event-card-body{
    padding: 1.75rem;
  }
  
  .event-card-title{
    padding-right: 2rem;
  }
}

@media (max-width: 768px){
  .events-hero-section{
    padding: 2.5rem 0 3rem;
  }
  
  .events-badge-eyebrow{
    font-size: 0.85rem;
    padding: 0.5rem 1rem;
  }
  
  .events-page-title{
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  
  .events-page-subtitle{
    font-size: 1rem;
  }
  
  .event-card-modern{
    border-radius: 0;
  }
  
  .event-card-body{
    padding: 1.5rem;
  }
  
  .event-card-landscape-content{
    flex-direction: column;
  }
  
  .event-card-landscape-left{
    border-right: none;
    border-bottom: 1px solid #e5e7eb;
    padding: 1.75rem;
  }
  
  .event-card-landscape-right{
    flex: 1;
    padding: 1.75rem;
  }
  
  .event-card-title{
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    margin-bottom: 0.75rem;
  }
  
  .event-card-description-full{
    font-size: 0.95rem;
    line-height: 1.75;
  }
  
  .event-card-title{
    font-size: 1.25rem;
    padding-right: 1.5rem;
  }
  
  .event-card-description{
    font-size: 0.9rem;
    -webkit-line-clamp: 3;
  }
  
  .event-card-description-full{
    font-size: 0.9rem;
  }
  
  .event-countdown-wrapper{
    padding: 0.875rem;
  }
  
  .countdown-value{
    font-size: 1.75rem;
  }
  
  .event-registration-closed{
    padding: 0.875rem;
    font-size: 0.85rem;
  }
  
  .event-meta-icon{
    width: 36px;
    height: 36px;
    min-width: 36px;
  }
  
  .event-meta-icon i{
    font-size: 0.9rem;
  }
  
  .event-meta-value{
    font-size: 0.9rem;
  }
  
  .btn-event-register{
    font-size: 0.95rem;
    padding: 0.75rem 1.25rem;
  }
  
  .events-empty-state{
    padding: 3rem 1.5rem;
  }
  
  .events-empty-icon{
    width: 100px;
    height: 100px;
  }
  
  .events-empty-icon i{
    font-size: 3rem;
  }
  
  .events-empty-title{
    font-size: 1.5rem;
  }
}

@media (max-width: 576px){
  .events-hero-section{
    padding: 2rem 0 2.5rem;
  }
  
  .events-listing-section{
    padding: 2rem 0;
  }
  
  .event-card-badge{
    top: 1rem;
    right: 1rem;
  }
  
  .badge-event-status{
    font-size: 0.7rem;
    padding: 0.35rem 0.75rem;
  }
  
  .event-card-body{
    padding: 1.25rem;
  }
  
  .event-card-title{
    font-size: 1.15rem;
    padding-right: 1rem;
  }
  
  .event-card-landscape-left{
    padding: 1.5rem;
  }
  
  .event-card-landscape-right{
    padding: 1.5rem;
    flex: 1;
  }
  
  .event-card-title{
    font-size: 1.35rem;
    margin-bottom: 0.75rem;
    padding-right: 0;
  }
  
  .event-card-description-full{
    font-size: 0.9rem;
    line-height: 1.7;
  }
  
  .event-meta-item{
    margin-bottom: 0.75rem;
  }
  
  .event-meta-icon{
    width: 32px;
    height: 32px;
    min-width: 32px;
    margin-right: 0.5rem;
  }
  
  .event-meta-icon i{
    font-size: 0.85rem;
  }
  
  .event-meta-label{
    font-size: 0.7rem;
  }
  
  .event-meta-value{
    font-size: 0.85rem;
  }
  
  .events-empty-state{
    padding: 2.5rem 1.25rem;
  }
  
  .events-empty-icon{
    width: 80px;
    height: 80px;
  }
  
  .events-empty-icon i{
    font-size: 2.5rem;
  }
  
  .events-empty-title{
    font-size: 1.35rem;
  }
  
  .events-empty-text{
    font-size: 0.95rem;
  }
}

.border-primary{
  border-color: #ff1212 !important;
}