/* ================================================
   SRI HELA — BLOB PAGE TRANSITION
   Organic SVG wave wipe — teal ocean + gold edge
   ================================================ */

/* The full-screen blob overlay container */
#sh-blob-overlay {
  position: fixed;
  inset: 0;
  z-index: 99998;
  pointer-events: none;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}

#sh-blob-overlay svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* ── Active state: block clicks during transition ── */
#sh-blob-overlay.active {
  pointer-events: all;
}

/* ── Page reveal transition ── */
html {
  transition: opacity 0.15s ease;
}

/* ================================================
   STICKY NAVIGATION — ALL PAGES
   ================================================ */
.main-header {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 2px 20px rgba(15, 61, 46, 0.08);
  padding: 0.85rem 0;
  transition: background 0.4s ease, box-shadow 0.4s ease, padding 0.4s ease;
  z-index: 1000;
}

.main-header .nav-link {
  color: #0F3D2E !important;
  text-shadow: none !important;
}
.main-header .nav-link:hover,
.main-header .nav-link.active {
  color: #C9A44C !important;
}

.main-header .nav-cta-btn {
  background: #0F3D2E !important;
  color: #fff !important;
}
.main-header .nav-cta-btn:hover {
  background: #C9A44C !important;
}

.main-header .mobile-menu-toggle {
  color: #0F3D2E !important;
}

/* Scrolled */
.main-header.scrolled {
  background: rgba(15, 61, 46, 0.97) !important;
  backdrop-filter: blur(16px);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.22) !important;
}
.main-header.scrolled .nav-link {
  color: rgba(255, 255, 255, 0.92) !important;
}
.main-header.scrolled .nav-link:hover,
.main-header.scrolled .nav-link.active {
  color: #C9A44C !important;
}
.main-header.scrolled .nav-cta-btn {
  background: #C9A44C !important;
  color: #fff !important;
}
.main-header.scrolled .mobile-menu-toggle {
  color: #fff !important;
}

/* Body padding for inner pages */
body.inner-page {
  padding-top: 80px;
}

/* ================================================
   TRANSPARENT HEADER ON PAGES WITH HERO (use-white-logo)
   ================================================ */
.main-header.use-white-logo:not(.scrolled) {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.main-header.use-white-logo:not(.scrolled) .nav-link {
  color: #fff !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5) !important;
}
.main-header.use-white-logo:not(.scrolled) .mobile-menu-toggle {
  color: #fff !important;
}
.main-header.use-white-logo:not(.scrolled) .nav-cta-btn {
  background: #fff !important;
  color: #0F3D2E !important;
}
.main-header.use-white-logo:not(.scrolled) .nav-cta-btn:hover {
  background: #C9A44C !important;
  color: #fff !important;
}

/* Pull hero wrapper up so it sits underneath the transparent header */
body.inner-page .hero-wrapper,
body.inner-page .ds-hero,
body.inner-page .ttds-hero,
body.inner-page .tpkg-hero {
  margin-top: -80px;
}