nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  background: rgba(255,255,255,0.97); backdrop-filter: blur(12px);
  border-bottom: 1px solid #E2ECF8;
  padding: 0 32px !important; display: flex; align-items: center;
  justify-content: space-between; height: 60px;
}
.nav-brand { font-size: 15px; font-weight: 700; color: #0F1C33; letter-spacing: -.2px; text-decoration: none; flex-shrink: 0; }
.nav-brand span { color: #1E5FA8; }
.nav-links { display: flex; gap: 24px; }
.nav-links a { font-size: 13px; font-weight: 500; color: #4A5568; text-decoration: none; transition: color .2s; }
.nav-links a:hover { color: #1E5FA8; }
.nav-links a.nav-active { color: #1E5FA8; font-weight: 700; }

/* Tighten nav at medium viewports so the button never gets squeezed out */
@media (min-width: 769px) and (max-width: 1140px) {
  nav { padding: 0 24px !important; }
  .nav-links { gap: 16px !important; }
  .desktop-actions { gap: 8px !important; }
}

/* 2. DESKTOP NAV ACTIONS (Socials & Button) */
.desktop-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.nav-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 6px; flex-shrink: 0;
  color: #4A5568; text-decoration: none; transition: background .2s, color .2s;
  background: none; border: none; cursor: pointer; padding: 0;
}
.nav-icon-btn:hover { background: #EBF4FF; color: #1E5FA8; }
.nav-cta {
  font-size: 13px; font-weight: 600; color: #fff;
  background: #1E5FA8; padding: 8px 18px; border-radius: 6px;
  text-decoration: none; transition: background .2s;
  white-space: nowrap; flex-shrink: 0;
}
.nav-cta:hover { background: #164780; }

/* 3. HAMBURGER BUTTON — visible by default, hidden on desktop */
.nav-hamburger {
  display: flex; flex-direction: column; gap: 5px; cursor: pointer;
  padding: 8px; border: none; background: none; z-index: 10001;
  -webkit-tap-highlight-color: transparent; flex-shrink: 0;
}
@media (min-width: 1280px) {
  .nav-hamburger { display: none !important; }
}
.nav-hamburger span {
  display: block; width: 22px; height: 2px; background: #0F1C33;
  border-radius: 2px; transition: all .28s ease;
}
.nav-hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; transform: translateX(-8px); }
.nav-hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* Mobile-only right cluster: globe + hamburger */
/* Default: visible. Hidden on desktop via min-width query below. */
.nav-mobile-right {
  display: flex; align-items: center; gap: 4px; flex-shrink: 0;
}
@media (min-width: 1280px) {
  .nav-mobile-right { display: none !important; }
}
.nav-lang-mobile {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 6px;
  background: none; border: none; cursor: pointer;
  color: #4A5568; -webkit-tap-highlight-color: transparent;
  transition: background .2s, color .2s;
}
.nav-lang-mobile:hover, .nav-lang-mobile:active { background: #EBF4FF; color: #1E5FA8; }

/* 4. ENHANCED MOBILE MENU */
.mobile-menu {
  display: none; position: fixed; top: 60px; left: 0; right: 0;
  background: rgba(255,255,255,0.98); backdrop-filter: blur(12px);
  z-index: 9999; padding: 10px 0 24px; border-bottom: 1px solid #E2ECF8;
  box-shadow: 0 10px 32px rgba(0,0,0,.1);
}
.mobile-menu.open { display: flex !important; flex-direction: column; }
.mobile-menu a.mob-link {
  font-size: 16px; font-weight: 500; color: #0F1C33; text-decoration: none;
  padding: 14px 24px; border-bottom: 1px solid #E2ECF8; display: block;
  transition: background .15s, color .15s;
}
.mobile-menu a.mob-link:last-of-type { border-bottom: none; }
.mobile-menu a.mob-link:active { background: #EBF4FF; }
.mobile-menu a.mob-link.nav-active { color: #1E5FA8; font-weight: 700; }

.mob-socials { display: flex; gap: 18px; padding: 24px 24px 12px; }
.mob-socials a { color: #4A5568; transition: color .2s; }
.mob-socials a:hover { color: #1E5FA8; }

.mob-cta {
  margin: 12px 24px 0; background: #1E5FA8; color: #fff !important;
  border-radius: 8px; text-align: center; padding: 14px 24px;
  text-decoration: none; font-weight: 600; font-size: 15px;
  box-shadow: 0 4px 12px rgba(30,95,168,.2);
}

/* 5. TABLET SECTION PADDING — reduces 48px side gutter before it gets too tight */
@media (max-width: 920px) {
  .section { padding-left: 28px; padding-right: 28px; }
  .page-hero { padding-left: 28px; padding-right: 28px; }
  .stats-band { padding-left: 28px; padding-right: 28px; }
}

/* 6. MOBILE LAYOUT FIXES */
@media (max-width: 768px) {
  nav { padding: 0 16px !important; justify-content: space-between !important; }
  .nav-hamburger { display: flex !important; }
  .section { padding-left: 20px; padding-right: 20px; }
  .page-hero { padding-left: 20px; padding-right: 20px; }
  .stats-band { padding-left: 20px; padding-right: 20px; }
}

/* Floating Buttons (Home and Top) */
#btn-top, #btn-home {
  position: fixed; 
  left: 28px; 
  width: 44px; 
  height: 44px; 
  border-radius: 50%; 
  background: #fff; 
  color: #1E5FA8; /* Your Royal Blue color */
  border: none; 
  cursor: pointer; 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  box-shadow: 0 2px 12px rgba(0,0,0,.15); 
  opacity: 0; 
  pointer-events: none; 
  z-index: 9000; 
  transition: opacity 0.3s, transform 0.2s, box-shadow 0.2s;
  text-decoration: none;
}

/* Position the buttons on top of each other */
#btn-top { bottom: 28px; }
#btn-home { bottom: 84px; } /* Sits exactly above the top button */

/* Show the buttons when scrolled */
#btn-top.visible, #btn-home.visible { 
  opacity: 1; 
  pointer-events: auto; 
}

/* Hover effects */
#btn-top:hover, #btn-home:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.2);
}

/* ── LANGUAGE SWITCHER ── */
.lang-switcher { position: relative; }

.lang-toggle {
  position: relative; cursor: pointer;
  border: none; background: none; padding: 0;
}
.lang-active-dot {
  position: absolute; top: 5px; right: 5px;
  width: 7px; height: 7px; border-radius: 50%;
  background: #0DB5B5; border: 1.5px solid #fff;
  pointer-events: none;
}

.lang-dropdown {
  position: absolute; top: calc(100% + 10px); right: 0;
  background: #fff; border: 1px solid #E2ECF8;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(30,95,168,.13), 0 2px 8px rgba(0,0,0,.06);
  min-width: 210px; z-index: 10000;
  opacity: 0; pointer-events: none;
  transform: translateY(-6px) scale(.98);
  transform-origin: top right;
  transition: opacity .18s ease, transform .18s ease;
  overflow: hidden;
}
.lang-dropdown.open {
  opacity: 1; pointer-events: auto;
  transform: translateY(0) scale(1);
}
.lang-dropdown-header {
  padding: 11px 16px 9px;
  font-size: 10px; font-weight: 700; letter-spacing: 1.6px;
  text-transform: uppercase; color: #8BA4C8;
  border-bottom: 1px solid #E2ECF8;
  background: #F8FAFF;
}
.lang-option {
  display: flex; align-items: center; gap: 10px;
  width: 100%; padding: 10px 16px;
  border: none; background: none; cursor: pointer;
  font-size: 13.5px; font-weight: 500; color: #0F1C33;
  text-align: left; transition: background .13s, color .13s;
}
.lang-option:hover { background: #EBF4FF; color: #1E5FA8; }
.lang-option.active { color: #1E5FA8; font-weight: 700; background: #F0F6FF; }
.lang-flag { font-size: 17px; line-height: 1; flex-shrink: 0; }
.lang-label { flex: 1; }
.lang-check { color: #0DB5B5; display: flex; align-items: center; }

/* Mobile globe dropdown — opens downward from nav bar */
#lang-dropdown-mobile {
  right: 44px; /* offset left of the hamburger */
}

/* Hide Google Translate toolbar & artifacts */
.goog-te-banner-frame, .skiptranslate { display: none !important; }
body { top: 0 !important; }
#goog-gt-tt, .goog-te-balloon-frame { display: none !important; }
.goog-tooltip, .goog-tooltip:hover { display: none !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }

/* 7. TABLET NAV — hide desktop items, show hamburger */
@media (min-width: 769px) and (max-width: 1279px) {
  .nav-links, .desktop-actions { display: none !important; }
  .nav-mobile-right { display: flex !important; }
  .nav-hamburger { display: flex !important; }
}

/* 8. DESKTOP NAV — show all desktop items, hide hamburger */
@media (min-width: 1280px) {
  .nav-links { display: flex !important; }
  .desktop-actions { display: flex !important; }
  .nav-mobile-right { display: none !important; }
  .nav-hamburger { display: none !important; }
}