/* ===== Global Typography ===== */
html { font-size: 14px; }
body { font-family: 'Open Sans', sans-serif; }
h1, h2, h3 { font-family: 'Poppins', sans-serif;  font-weight: 500;  letter-spacing: 0.5px; }
/* ===== Global Colors / Layout ===== */
.header-top-bg { background-color: #132b70; }
.header-bg { background-color: #FFFFFF; }
.footer-bg { background-color: #132b70; }
.text-blue-900 { color: #132b70; }
.sticky { position: sticky; top: 0; z-index: 50; }
/* ===== Navigation / Menu ===== */
.hamburger div { width: 25px; height: 3px; background-color: #FFFFFF; margin: 5px 0;  transition: all 0.3s ease;}
.submenu { position: absolute; top: 100%; left: 0; background: white; min-width: 200px; border-radius: 0.25rem; box-shadow: 0 5px 10px rgba(0,0,0,0.1); display: none;}
.group:hover .submenu { display: block; }
@media (max-width: 768px) {
.submenu { display: none; position: static;  opacity: 1 !important;  pointer-events: auto !important;  box-shadow: none;} 
.submenu-open { display: block !important; }}
/* ===== Reusable Content Blocks ===== */
.section-block {  background: #f9fafb;  padding: 1.5rem; border-radius: 6px;  position: relative; margin-bottom: 2rem; box-shadow: 0 2px 6px rgba(0,0,0,0.05);}
.section-block::after { content:""; position:absolute; right:0; bottom:0; border-width:0 0 40px 40px; border-style:solid; border-color:transparent transparent white transparent; filter:drop-shadow(-2px -2px 3px rgba(0,0,0,0.1));}
.section-block h2 { font-size: 1.5rem; font-weight: bold; color:#1E3A8A; margin-bottom: 1rem;}
/* ===== Mobile Menu Visibility ===== */
.mobile-menu-hidden { transform: translateX(100%); }
.mobile-menu-visible { transform: translateX(0); }
/* Mobile iframe fix */
@media (max-width: 768px) {
 #golibeFlightEngine { overflow: visible; }
  #golibeIframe { height: 600px !important; overflow: auto !important; }}
/* Hero Slider Images */

#heroSlider > div {
  transition: opacity 1.5s ease-in-out; /* smooth fade */
  position: absolute;
  opacity: 0;
  opacity: 0;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#heroSlider > div img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#heroSlider > div.active {
  opacity: 1;
  z-index: 10;
}