/* NAVBAR: keep bluish background you liked */
.custom-navbar{
  background: linear-gradient(90deg,#185a9d,#43cea2);
  box-shadow: 0 4px 14px rgba(0,0,0,.2);
}
.custom-navbar .btn{
  box-shadow: none;
}

/* Offcanvas menu with same brand vibe */
.offcanvas-gradient{
  background: linear-gradient(180deg,#185a9d 0%, #1f7fb6 40%, #2fbf9a 100%);
}
.offcanvas-gradient .nav-link{
  color:#fff;
  padding:.5rem 0;
}
.offcanvas-gradient .nav-link:hover{
  color:#ffeb3b;
}


.navbar-toggler {
  border-color: rgba(255,255,255,.5); /* makes border visible */
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' 
  xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,1)' 
  stroke-width='2' stroke-linecap='round' stroke-miterlimit='50' 
  d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* HERO */
.hero-section{
  position:relative;
  min-height:100vh;           /* big, full-screen hero */
  background-size:cover;      /* switch to 'contain' if you never want any crop */
  background-position: top center;
}
.hero-section .overlay{
  position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(24,90,157,.55), rgba(67,206,162,.45));
}
.hero-section .container{ position:relative; z-index:2; }

/* BIG logo on left with a gentle float animation */
.hero-logo{
  width:min(420px, 90%);      /* large but responsive */
  animation: floatLogo 5s ease-in-out infinite;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.35));
}
@keyframes floatLogo{
  0%,100%{ transform: translateY(0) }
  50%{ transform: translateY(-12px) }
}

/* Title box (animated glow + rise) */
.title-box{
  display:inline-block;
  padding:16px 20px;
  border-radius:14px;
  background: rgba(0,0,0,.35);
  border: 2.5px solid #43cea2;                 /* green border */
  box-shadow: 0 0 0 rgba(67,206,162,0);        /* will glow via animation */
  animation: riseIn .9s ease-out both, glowPulse 3s ease-in-out infinite 1.2s;
}
.title-box h1{
  font-size: clamp(1.8rem, 2.6vw + 1rem, 3rem);
  line-height: 1.25;
}

/* Simple entrance + glow animations (no external libs) */
@keyframes riseIn{
  from{ opacity:0; transform: translateY(16px) }
  to  { opacity:1; transform: translateY(0) }
}
@keyframes glowPulse{
  0%,100%{ box-shadow: 0 0 0 rgba(67,206,162,0) }
  50%    { box-shadow: 0 0 24px rgba(67,206,162,.45) }
}

/* Supporting text */
.event-intro{
  font-size: clamp(1.1rem, .6vw + 1rem, 1.5rem);
  letter-spacing:.3px;
}
.event-date{
  font-size: clamp(1rem, .5vw + .8rem, 1.25rem);
  opacity:.95;
}

/* Buttons */
.gradient-btn{
  background: linear-gradient(45deg,#43cea2,#185a9d);
  color:#fff; border:none; border-radius:30px;
  padding:12px 28px; transition:.25s;
}
.gradient-btn:hover{ transform: translateY(-2px); opacity:.95; }

.gradient-btn-outline{
  background:transparent; color:#fff;
  border:2px solid #fff; border-radius:30px;
  padding:12px 28px; transition:.25s;
}
.gradient-btn-outline:hover{
  background: linear-gradient(45deg,#43cea2,#185a9d);
  border-color: transparent;
}



.highlight-box {
  transition: all 0.3s ease;
}
.highlight-box:hover {
  transform: scale(1.05);
  border-color: #a6e86b; /* lighter green */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}