/* header.css - Premium Enterprise Redesign (2026) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');

:root {
  /* ---- Brand Colors (kept from source) ---- */
  --color-primary-navy: #004D88;
  --color-primary-teal: #009C8D;
  --color-accent: #883B00;

  /* ---- Derived brand tones ---- */
  --color-navy-deep: #004D88;
  --color-navy-tint: #EAF3FA;
  --color-teal-deep: #007367;
  --color-teal-tint: #E3F7F5;
  --color-accent-tint: #F7ECE4;

  /* Gradients (signature) */
  --gradient-brand: linear-gradient(135deg, var(--color-navy-deep) 0%, var(--color-primary-navy) 45%, var(--color-primary-teal) 100%);
  --gradient-brand-hover: linear-gradient(135deg, #002647 0%, #00385f 45%, var(--color-teal-deep) 100%);
  --gradient-sheen: linear-gradient(115deg, transparent 20%, rgba(255,255,255,0.22) 45%, transparent 70%);

  /* Backgrounds */
  --color-white: #FFFFFF;
  --color-light-bg: #F8FAFC;

  /* Text Colors */
  --color-text-main: #101B2D;
  --color-text-muted: #64748B;

  /* Borders & Shadows */
  --color-border: #E2E8F0;
  --shadow-sm: 0 1px 3px rgba(16, 27, 45, 0.06), 0 1px 2px rgba(16, 27, 45, 0.04);
  --shadow-md: 0 6px 16px -4px rgba(0, 77, 136, 0.10), 0 2px 6px -2px rgba(0, 77, 136, 0.06);
  --shadow-lg: 0 24px 48px -12px rgba(0, 48, 92, 0.16), 0 8px 20px -8px rgba(0, 48, 92, 0.08);
  --shadow-glow: 0 0 0 1px rgba(0, 156, 141, 0.12), 0 12px 28px -8px rgba(0, 156, 141, 0.28);
  --shadow-navy-glow: 0 10px 24px -6px rgba(0, 77, 136, 0.35);

  /* Radii */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 22px;
  --radius-pill: 9999px;

  /* Transitions */
  --transition-fast: 160ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 320ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-spring: 480ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Base resets & utilities */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Inter', sans-serif;
  color: var(--color-text-main);
  -webkit-font-smoothing: antialiased;
}

a {
  text-decoration: none;
  color: inherit;
}

ul {
  list-style: none;
}

button {
  border: none;
  background: none;
  font-family: inherit;
  cursor: pointer;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  
  border-width: 0;
}

.text-teal {
  color: var(--color-primary-teal);
}

/* ==========================================================================
   HEADER LAYOUT
   ========================================================================== */
.incepbio-header {
  position: fixed;
  top: 42px;
  left: 0;
  width: 100%;
  z-index: 50;
  background-color: var(--color-white);
  transition: all var(--transition-normal);
  pointer-events: auto;
  box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}

.top-info-bar {
  background: var(--gradient-brand);
  color: #fff;
  height: 42px;
  font-size: 0.8rem;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 51;
}

body {
  padding-top: 112px !important;
}

@media (max-width: 991px) {
  body { padding-top: 68px !important; }
}

@media (max-width: 374px) {
  body { padding-top: 60px !important; }
}

/* Restore the bottom gradient line */
.incepbio-header::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: var(--gradient-brand);
}

.incepbio-header.is-scrolled {
    /* Kept at top: 42px so it doesn't slide under the top-info-bar */
    background-color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  }
  
  /* Fix Google Translate pushing the page down */
  html {
    top: 0px !important;
    position: static !important;
  }
  body {
    top: 0px !important;
  }

.incepbio-header__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1800px; /* Expanded slightly for enterprise header spacing */
  margin: 0 auto;
  padding: 0 1.5rem;
  height: 70px;
}

/* Logo */
.incepbio-header__logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  transition: transform var(--transition-normal);
}

.incepbio-header__logo:hover {
  transform: scale(1.02);
}

.main-header-logo {
  height: 40px;
  width: auto;
  object-fit: contain;
}

/* ==========================================================================
   DESKTOP NAVIGATION
   ========================================================================== */
.incepbio-header__nav {
  display: none;
}

.incepbio-header__menu {
  display: flex;
  align-items: center;
  height: 100%;
  gap: 0.25rem;
}

.incepbio-header__item {
  /* Intentionally static: the mega-menu below anchors to the fixed
     header itself (its nearest positioned ancestor), so it centers
     on the full page width instead of drifting under whichever nav
     item happens to trigger it. */
}

.incepbio-header__link {
  white-space: nowrap !important;
  position: relative;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-primary-navy);
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.625rem 0.9rem;
  border-radius: var(--radius-pill);
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.incepbio-header__link::after {
  content: '';
  position: absolute;
  bottom: 0.15rem;
  left: 0.9rem;
  width: calc(100% - 1.8rem);
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary-navy), var(--color-primary-teal));
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--transition-normal);
}

.incepbio-header__link:hover {
  color: var(--color-teal-deep);
  background-color: var(--color-teal-tint);
}

.incepbio-header__link:hover::after {
  transform: scaleX(1);
}

.dropdown-icon {
  transition: transform var(--transition-normal), color var(--transition-fast);
}

.has-dropdown:hover .dropdown-icon,
.dropdown-toggle[aria-expanded="true"] .dropdown-icon {
  transform: rotate(180deg);
  color: var(--color-primary-teal);
}

/* Right Actions */
.incepbio-header__actions {
  display: none;
  align-items: center;
  gap: 12px;
}

/* ==========================================================================
   MEGA MENU (GENERAL)
   ========================================================================== */
.incepbio-header__mega-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(14px) scale(0.98);
  width: 940px;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--transition-normal), transform var(--transition-spring), visibility var(--transition-normal);
  pointer-events: none;
}

.has-dropdown:hover .incepbio-header__mega-menu,
.dropdown-toggle[aria-expanded="true"] + .incepbio-header__mega-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(14px) scale(1);
  pointer-events: auto;
}

.mega-menu__bridge {
  position: absolute;
  top: -24px;
  left: 0;
  width: 100%;
  height: 24px;
}

.mega-menu__inner {
  background-color: var(--color-white);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--color-border);
  padding: 1.75rem;
}

/* ==========================================================================
   SERVICES MEGA MENU
   ========================================================================== */
.mega-menu__inner--services {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.75rem;
}

.services-mega__eyebrow {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.services-mega__eyebrow-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-primary-teal);
}

.services-mega__heading {
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-navy-deep);
  letter-spacing: -0.01em;
}

/* Top Section: 2x2 Grid of 4 Core Service Cards */
.services-cards-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.service-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 1.1rem 1.2rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  transition: transform var(--transition-normal), border-color var(--transition-normal), box-shadow var(--transition-normal);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  height: 100%;
  text-decoration: none;
  isolation: isolate;
}

.service-card::before {
  content: '';
  position: absolute;
  top: -60px;
  right: -60px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 156, 141, 0.14) 0%, transparent 70%);
  opacity: 0;
  transition: opacity var(--transition-normal), transform var(--transition-normal);
  transform: scale(0.8);
  z-index: -1;
}

.service-card--valbio::before {
  background: radial-gradient(circle, rgba(0, 77, 136, 0.14) 0%, transparent 70%);
}

.service-card--airflow::before {
  background: radial-gradient(circle, rgba(0, 156, 141, 0.16) 0%, transparent 70%);
}

.service-card--cqv::before {
  background: radial-gradient(circle, rgba(136, 59, 0, 0.12) 0%, transparent 70%);
}

.service-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 156, 141, 0.4);
  box-shadow: var(--shadow-md), var(--shadow-glow);
}

.service-card:hover::before {
  opacity: 1;
  transform: scale(1);
}

.service-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.7rem;
}

.service-card__icon {
  width: 34px;
  height: 34px;
  background: linear-gradient(150deg, var(--color-light-bg) 0%, var(--color-teal-tint) 100%);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-primary-teal);
  transition: all var(--transition-normal);
}

.service-card:hover .service-card__icon {
  background: var(--gradient-brand);
  color: var(--color-white);
  transform: scale(1.06) rotate(-4deg);
  box-shadow: var(--shadow-navy-glow);
}

.service-card--cqv:hover .service-card__icon {
  background: linear-gradient(135deg, var(--color-accent) 0%, #b4571a 100%);
  box-shadow: 0 10px 24px -6px rgba(136, 59, 0, 0.35);
}

.service-card__logo-container {
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.3rem 0.6rem;
  background-color: var(--color-white);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
}

.service-card__logo {
  height: 18px;
  width: auto;
  object-fit: contain;
  transition: transform var(--transition-normal);
}

.service-card:hover .service-card__logo {
  transform: scale(1.03);
}

.service-card__arrow {
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--color-border);
  color: var(--color-text-muted);
  transition: all var(--transition-normal);
}

.service-card:hover .service-card__arrow {
  border-color: transparent;
  background-color: var(--color-primary-teal);
  color: var(--color-white);
  transform: translateX(2px) scale(1.05);
}

.service-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.service-card__title {
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-navy-deep);
  letter-spacing: -0.01em;
}

.service-card__desc {
  font-size: 0.78rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

/* Flagship card variant (IncepOne) */
.service-card--flagship {
  background: var(--gradient-brand);
  border-color: transparent;
  box-shadow: var(--shadow-navy-glow);
}

.service-card--flagship::before {
  background: radial-gradient(circle, rgba(255, 255, 255, 0.22) 0%, transparent 70%);
  opacity: 1;
  top: -50px;
  right: -40px;
}

.service-card--flagship:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px -10px rgba(0, 48, 92, 0.45), var(--shadow-glow);
}

.service-card--flagship .service-card__desc {
  color: rgba(255, 255, 255, 0.82);
}

.service-card--flagship .service-card__arrow {
  border-color: rgba(255, 255, 255, 0.35);
  color: var(--color-white);
}

.service-card--flagship:hover .service-card__arrow {
  background-color: var(--color-white);
  color: var(--color-navy-deep);
}

.service-card__badge {
  position: absolute;
  top: 0.9rem;
  right: 0.9rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-white);
  background-color: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  padding: 0.25rem 0.55rem;
  border-radius: var(--radius-pill);
}

/* Bottom Section: Remaining Service Categories */
.services-categories-footer {
  border-top: 1px solid var(--color-border);
  padding-top: 1.15rem;
}

.categories-grid-4col {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.category-col {
  display: flex;
  flex-direction: column;
}

.category-col__title {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--color-primary-navy);
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--color-light-bg);
}

.category-col__icon {
  color: var(--color-primary-teal);
  flex-shrink: 0;
}

.category-col__list {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.category-col__link {
  position: relative;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-main);
  transition: color var(--transition-fast), padding-left var(--transition-fast);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0 0.35rem 0.6rem;
  border-radius: var(--radius-sm);
}

.category-col__link::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 0;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--color-primary-navy), var(--color-primary-teal));
  transition: height var(--transition-fast);
}

.cs__indicator {
  display: none;
}

.category-col__link:hover {
  color: var(--color-teal-deep);
  background-color: var(--color-teal-tint);
  padding-left: 0.8rem;
}

.category-col__link:hover::before {
  height: 60%;
}

/* ==========================================================================
   RESOURCES MEGA MENU
   ========================================================================== */
.incepbio-header__mega-menu--resources {
  width: 680px;
}

.incepbio-header__mega-menu--resources .mega-menu__inner {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 1.25rem;
  padding: 1.5rem;
}

.editorial-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.4rem;
  align-content: start;
}

.editorial-item {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  padding: 0.7rem;
  border-radius: var(--radius-md);
  transition: background-color var(--transition-normal), transform var(--transition-normal);
  background-color: transparent;
  border: 1px solid transparent;
}

.editorial-item:hover {
  background-color: var(--color-light-bg);
  border-color: var(--color-border);
  transform: translateX(3px);
}

.editorial-item__icon {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  background-color: var(--color-white);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-primary-navy);
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--color-border);
  transition: color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}

.editorial-item:hover .editorial-item__icon {
  color: var(--color-white);
  background: var(--gradient-brand);
  border-color: transparent;
  box-shadow: var(--shadow-navy-glow);
}

.editorial-item__icon svg {
  width: 18px;
  height: 18px;
}

.editorial-item__text {
  display: flex;
  flex-direction: column;
}

.editorial-item__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-navy-deep);
  margin-bottom: 0.2rem;
  transition: color var(--transition-fast);
}

.editorial-item:hover .editorial-item__title {
  color: var(--color-teal-deep);
}

.editorial-item__desc {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  line-height: 1.4;
}

/* Feature spotlight column */
.editorial-panel__feature {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.15rem;
  background: linear-gradient(160deg, var(--color-navy-tint) 0%, var(--color-teal-tint) 100%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  position: relative;
  overflow: hidden;
}

.editorial-panel__feature::before {
  content: '';
  position: absolute;
  top: -40px;
  right: -40px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 156, 141, 0.18) 0%, transparent 70%);
}

.editorial-panel__feature-eyebrow {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-primary-teal);
}

.editorial-panel__feature-title {
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-navy-deep);
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.editorial-panel__feature-desc {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.editorial-panel__feature-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--color-primary-navy);
  margin-top: 0.25rem;
  transition: gap var(--transition-fast), color var(--transition-fast);
}

.editorial-panel__feature-link svg {
  transition: transform var(--transition-fast);
}

.editorial-panel__feature-link:hover {
  color: var(--color-teal-deep);
  gap: 0.6rem;
}

.editorial-panel__feature-link:hover svg {
  transform: translateX(2px);
}

/* ==========================================================================
   MOBILE MENU TOGGLE
   ========================================================================== */
.incepbio-header__mobile-toggle {
  display: none;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 10000;
  background-color: var(--color-light-bg);
  border-radius: var(--radius-sm);
  transition: background-color var(--transition-fast);
}

.incepbio-header__mobile-toggle:hover {
  background-color: var(--color-teal-tint);
}

.hamburger,
.hamburger::before,
.hamburger::after {
  content: '';
  display: block;
  background-color: var(--color-primary-navy);
  height: 2px;
  width: 20px;
  transition: all 0.3s ease-in-out;
  border-radius: 2px;
}

.hamburger::before {
  transform: translateY(-6px);
}
.hamburger::after {
  transform: translateY(4px);
}

.incepbio-header__mobile-toggle[aria-expanded="true"] .hamburger {
  background-color: transparent;
}
.incepbio-header__mobile-toggle[aria-expanded="true"] .hamburger::before {
  transform: translateY(0) rotate(45deg);
  background-color: var(--color-primary-teal);
}
.incepbio-header__mobile-toggle[aria-expanded="true"] .hamburger::after {
  transform: translateY(-2px) rotate(-45deg);
  background-color: var(--color-primary-teal);
}

/* ==========================================================================
   MOBILE FULL-SCREEN NAVIGATION
   ========================================================================== */
.incepbio-mobile-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
  pointer-events: none;
  visibility: hidden;
}

.incepbio-mobile-nav.is-open {
  pointer-events: auto;
  visibility: visible;
}

.incepbio-mobile-nav__backdrop {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 48, 92, 0.45);
  opacity: 0;
  transition: opacity var(--transition-normal);
  backdrop-filter: blur(4px);
}

.incepbio-mobile-nav.is-open .incepbio-mobile-nav__backdrop {
  opacity: 1;
}

.incepbio-mobile-nav__container {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 400px;
  height: 100%;
  background-color: var(--color-white);
  box-shadow: -16px 0 40px rgba(0, 20, 45, 0.18);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform var(--transition-spring);
}

.incepbio-mobile-nav.is-open .incepbio-mobile-nav__container {
  transform: translateX(0);
}

.incepbio-mobile-nav__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 1.5rem;
  border-bottom: 1px solid var(--color-border);
}

.mobile-close-btn {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-light-bg);
  border-radius: var(--radius-sm);
  color: var(--color-primary-navy);
  transition: background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);
}

.mobile-close-btn:hover {
  background-color: var(--color-accent);
  color: var(--color-white);
  transform: rotate(90deg);
}

/* Mobile Search */
.incepbio-mobile-nav__search {
  padding: 1.5rem 1.5rem 0;
}

.search-wrapper {
  position: relative;
}

.search-icon {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-text-muted);
}

.mobile-search-input {
  width: 100%;
  padding: 0.875rem 1rem 0.875rem 3rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-family: inherit;
  font-size: 0.9375rem;
  background-color: var(--color-light-bg);
  transition: border-color var(--transition-fast), background-color var(--transition-fast), box-shadow var(--transition-fast);
}

.mobile-search-input:focus {
  outline: none;
  border-color: var(--color-primary-teal);
  background-color: var(--color-white);
  box-shadow: 0 0 0 4px rgba(0, 156, 141, 0.14);
}

/* Mobile Menu Scrollable Content */
.incepbio-mobile-nav__content {
  flex: 1;
  overflow-y: auto;
  padding: 1.5rem;
}

.mobile-nav__list {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.mobile-nav__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-primary-navy);
  border-radius: var(--radius-md);
  transition: background-color var(--transition-fast), color var(--transition-fast);
}

.mobile-nav__link:hover,
.mobile-nav__link:focus {
  background-color: var(--color-teal-tint);
  color: var(--color-teal-deep);
}

/* Accordion Logic */
.accordion-icon {
  transition: transform var(--transition-normal), color var(--transition-fast);
  color: var(--color-text-muted);
}

.accordion-toggle[aria-expanded="true"] .accordion-icon {
  transform: rotate(180deg);
  color: var(--color-primary-teal);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--transition-normal);
}

.accordion-content.is-open {
  max-height: 2000px;
}

/* Mobile Sub-menus */
.mobile-sub-categories {
  padding: 0.75rem 0.25rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* Featured / Resources: premium icon-row cards */
.mobile-feature-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.mobile-feature-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.85rem 0.9rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: border-color var(--transition-fast), background-color var(--transition-fast), transform var(--transition-fast);
}

.mobile-feature-card:active {
  transform: scale(0.98);
}

.mobile-feature-card:hover {
  border-color: rgba(0, 156, 141, 0.35);
  background-color: var(--color-teal-tint);
}

.mobile-feature-card__icon {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  background: linear-gradient(150deg, var(--color-light-bg) 0%, var(--color-teal-tint) 100%);
  color: var(--color-primary-teal);
}

.mobile-feature-card__icon--logo {
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  padding: 0.3rem 0.4rem;
}

.mobile-feature-card__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.mobile-feature-card__title-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.mobile-feature-card__title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-navy-deep);
}

.mobile-feature-card__desc {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.mobile-feature-card__chevron {
  flex-shrink: 0;
  color: var(--color-text-muted);
  transition: transform var(--transition-fast), color var(--transition-fast);
}

.mobile-feature-card:hover .mobile-feature-card__chevron {
  color: var(--color-primary-teal);
  transform: translateX(2px);
}

/* Flagship (IncepOne) variant */
.mobile-feature-card--flagship {
  background: var(--gradient-brand);
  border-color: transparent;
  box-shadow: var(--shadow-navy-glow);
}

.mobile-feature-card--flagship .mobile-feature-card__desc {
  color: rgba(255, 255, 255, 0.82);
}

.mobile-feature-card--flagship .mobile-feature-card__chevron {
  color: rgba(255, 255, 255, 0.8);
}

.mobile-feature-card--flagship:hover {
  background: var(--gradient-brand-hover);
}

.mobile-feature-card__badge {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-white);
  background-color: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.32);
  padding: 0.2rem 0.5rem;
  border-radius: var(--radius-pill);
}

.mobile-nav-logo {
  height: 20px;
  width: auto;
  object-fit: contain;
}

/* Category groups: bordered card with icon-labeled title + row links */
.mobile-sub-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.9rem 1rem;
  background-color: var(--color-light-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.mobile-sub-title {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: var(--color-primary-teal);
  margin-bottom: 0.3rem;
}

.mobile-sub-title__icon {
  color: var(--color-primary-teal);
  flex-shrink: 0;
}

.mobile-sub-menu {
  display: flex;
  flex-direction: column;
}

.mobile-sub-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--color-text-main);
  padding: 0.7rem 0.6rem;
  border-radius: var(--radius-sm);
  transition: color var(--transition-fast), background-color var(--transition-fast), padding-left var(--transition-fast);
}

.mobile-sub-item:not(:last-child) .mobile-sub-link {
  border-bottom: 1px solid var(--color-border);
  border-radius: 0;
}

.mobile-sub-link__chevron {
  flex-shrink: 0;
  color: var(--color-text-muted);
  opacity: 0.6;
  transition: transform var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);
}

.mobile-sub-link:hover {
  color: var(--color-teal-deep);
  background-color: var(--color-teal-tint);
  padding-left: 0.9rem;
}

.mobile-sub-link:hover .mobile-sub-link__chevron {
  color: var(--color-primary-teal);
  opacity: 1;
  transform: translateX(2px);
}

/* Mobile Actions Sticky Bottom */
.incepbio-mobile-nav__actions {
  padding: 1.25rem 1.5rem 1.5rem;
  background-color: var(--color-white);
  border-top: 1px solid var(--color-border);
  box-shadow: 0 -8px 24px -12px rgba(16, 27, 45, 0.12);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mobile-actions-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* ==========================================================================
   RESPONSIVE DESIGN (MEDIA QUERIES)
   ========================================================================== */

/* Tablet & Desktop */
@media (min-width: 992px) {
  .incepbio-header__mobile-toggle {
    display: none;
  }
  
  .incepbio-header__nav {
    display: block;
  }
  
  .incepbio-header__actions {
    display: flex;
  }
  
  .incepbio-mobile-nav {
    display: none !important;
  }
}

/* Large Desktop Adjustments */
@media (min-width: 1200px) {
  .incepbio-header__container {
    padding: 0 3rem;
  }
  
  .incepbio-header__menu {
    gap: 0.375rem;
  }
}

/* Laptops / Smaller Desktops */
@media (max-width: 1199px) and (min-width: 992px) {
  .incepbio-header__menu {
    gap: 0.125rem;
  }
  
  .btn {
    padding: 0.625rem 1rem;
  }
  
  .incepbio-header__mega-menu {
    width: 860px;
  }

  .incepbio-header__mega-menu--resources {
    width: 700px;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  * {
    transition-duration: 1ms !important;
    animation-duration: 1ms !important;
  }
}

/* ==========================================================================
   ACTIVE NAV LINK STATE
   ========================================================================== */
.incepbio-header__link.is-active {
  color: var(--color-primary-teal);
  background-color: var(--color-teal-tint);
}

.incepbio-header__link.is-active::after {
  transform: scaleX(1);
}

/* ==========================================================================
   CONTACT DROPDOWN â€” fixes overflow into nav area
   ========================================================================== */
.contact-dropdown-wrapper {
  position: relative; /* establishes containing block for the dropdown */
  display: inline-flex;
  align-items: center;
}

.contact-dropdown-wrapper > .btn {
  /* keep the trigger button in-flow */
  flex-shrink: 0;
}

/* The dropdown panel itself */
.contact-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 260px;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 12px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px) scale(0.98);
  transition: opacity var(--transition-normal), transform var(--transition-spring), visibility var(--transition-normal);
  z-index: 100;
   /* prevent text wrapping inside panel */
}

/* Show on hover */
.contact-dropdown-wrapper:hover .contact-dropdown,
.contact-dropdown-wrapper:focus-within .contact-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(8px) scale(1);
}

/* Bridge gap between button and panel */
.contact-dropdown::before {
  content: '';
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  height: 10px;
}

/* Each contact row */
.contact-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.contact-item__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(150deg, var(--color-navy-tint) 0%, var(--color-teal-tint) 100%);
  border-radius: var(--radius-sm);
  color: var(--color-primary-navy);
}

.contact-item__content {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.contact-item__label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--color-text-muted);
}

.contact-item__value {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary-navy);
  transition: color var(--transition-fast);
}

.contact-item__value:hover {
  color: var(--color-primary-teal);
}

/* ==========================================================================
   SERVICES MEGA-MENU â€” new HTML structure (core-card grid + cat-col lists)
   ========================================================================== */

/* 2Ã—2 grid of core service cards */
.services-core-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.65rem;
}

/* Individual core card */
.core-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0.85rem 1rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-normal), border-color var(--transition-normal), box-shadow var(--transition-normal);
  text-decoration: none;
  overflow: hidden;
  isolation: isolate;
}

.core-card:hover {
  transform: translateY(-3px);
  border-color: rgba(0, 156, 141, 0.35);
  box-shadow: var(--shadow-md);
}

/* Premium variant (gradient background) */
.core-card--premium {
  background: var(--gradient-brand);
  border-color: transparent;
  box-shadow: var(--shadow-navy-glow);
}

.core-card--premium:hover {
  box-shadow: 0 16px 32px -8px rgba(0, 48, 92, 0.4);
}

.core-card--premium .core-card__label,
.core-card--premium .core-card__name {
  color: rgba(255, 255, 255, 0.88);
}

.core-card--premium .core-card__name {
  color: var(--color-white);
}

.core-card--premium .core-card__arrow {
  color: rgba(255, 255, 255, 0.7);
}

/* Icon wrap */
.core-card__icon-wrap {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(150deg, var(--color-light-bg) 0%, var(--color-teal-tint) 100%);
  border-radius: var(--radius-sm);
  color: var(--color-primary-teal);
  transition: all var(--transition-normal);
}

.core-card__icon-wrap--logo {
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  padding: 0.3rem 0.5rem;
}

.core-card:hover:not(.core-card--premium) .core-card__icon-wrap {
  background: var(--gradient-brand);
  color: var(--color-white);
  box-shadow: var(--shadow-navy-glow);
}

/* Card body text */
.core-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.core-card__label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}

.core-card__name {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--color-navy-deep);
  
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Arrow icon */
.core-card__arrow {
  flex-shrink: 0;
  color: var(--color-text-muted);
  transition: transform var(--transition-fast), color var(--transition-fast);
}

.core-card:hover .core-card__arrow {
  transform: translateX(3px);
  color: var(--color-primary-teal);
}

/* Service categories section (4-column list below the cards) */
.services-category-section {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  border-top: 1px solid var(--color-border);
  padding-top: 1.1rem;
}

/* Category column */
.cat-col {
  display: flex;
  flex-direction: column;
}

.cat-col__heading {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-primary-navy);
  margin-bottom: 0.6rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--color-border);
}

.cat-col__list {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.cat-col__link {
  position: relative;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-main);
  padding: 0.35rem 0 0.35rem 0.6rem;
  border-radius: var(--radius-sm);
  transition: color var(--transition-fast), background-color var(--transition-fast), padding-left var(--transition-fast);
  display: block;
}

.cat-col__link::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 0;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--color-primary-navy), var(--color-primary-teal));
  transition: height var(--transition-fast);
}

.cat-col__link:hover {
  color: var(--color-teal-deep);
  background-color: var(--color-teal-tint);
  padding-left: 0.85rem;
}

.cat-col__link:hover::before {
  height: 60%;
}

/* Services mega-menu header row */
.services-mega__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* ==========================================================================
   MOBILE NAV â€” missing sub-component styles
   ========================================================================== */

/* 2Ã—2 grid of core service cards in mobile */
.mobile-services-section-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
  margin-bottom: 0.5rem;
  display: block;
}

.mobile-services-grid {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.mobile-service-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 1rem;
  row-gap: 0.15rem;
  align-items: center;
  padding: 1.1rem 1.25rem;
  background: linear-gradient(135deg, #F0FAF9 0%, #E8F7F6 100%);
  border: 1px solid transparent;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.25s ease;
}

.mobile-service-card:active {
  transform: scale(0.98);
}

.mobile-service-card:hover {
  background: linear-gradient(135deg, #E8F7F6 0%, #DFEFEF 100%);
  border-color: rgba(0, 156, 141, 0.15);
  box-shadow: 0 6px 16px rgba(0, 156, 141, 0.08);
}

/* Premium variant override removed to keep it identical to desktop style */
.mobile-service-card--premium {
  /* No overrides needed, matches desktop soft green style */
}

.mobile-service-card--premium:hover {
  /* No overrides needed */
}

.mobile-service-card--premium .mobile-service-card__label {
  color: var(--color-text-muted);
}

.mobile-service-card--premium .mobile-service-card__name {
  color: var(--color-primary-navy);
}

/* Icon */
.mobile-service-card__icon {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border-radius: 8px;
  color: var(--color-primary-teal);
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.mobile-service-card__icon--logo {
  padding: 0.25rem 0.4rem;
}

/* Text labels */
.mobile-service-card__label {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  align-self: end;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}

.mobile-service-card__name {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
  align-self: start;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-primary-navy);
}

/* Mobile category groups (stacked list cards) */
.mobile-cat-groups {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mobile-cat-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.85rem 1rem;
  background-color: var(--color-light-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.mobile-cat-group__title {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--color-primary-teal);
  margin-bottom: 0.35rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--color-border);
}

.mobile-cat-group__list {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.mobile-cat-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text-main);
  padding: 0.5rem 0.5rem;
  border-radius: var(--radius-sm);
  transition: color var(--transition-fast), background-color var(--transition-fast);
}

.mobile-cat-link:hover {
  color: var(--color-teal-deep);
  background-color: var(--color-teal-tint);
}

.mobile-cat-link__chevron {
  flex-shrink: 0;
  color: var(--color-text-muted);
  opacity: 0.6;
  transition: transform var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);
}

.mobile-cat-link:hover .mobile-cat-link__chevron {
  color: var(--color-primary-teal);
  opacity: 1;
  transform: translateX(2px);
}

/* Mobile resources list */
.mobile-resources-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.mobile-resource-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0.75rem 0.9rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: border-color var(--transition-fast), background-color var(--transition-fast), transform var(--transition-fast);
}

.mobile-resource-item:active {
  transform: scale(0.98);
}

.mobile-resource-item:hover {
  border-color: rgba(0, 156, 141, 0.35);
  background-color: var(--color-teal-tint);
}

.mobile-resource-item__icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-light-bg);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  color: var(--color-primary-navy);
  transition: background var(--transition-fast), color var(--transition-fast);
}

.mobile-resource-item:hover .mobile-resource-item__icon {
  background: var(--gradient-brand);
  color: var(--color-white);
  border-color: transparent;
}

.mobile-resource-item__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.mobile-resource-item__title {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-navy-deep);
  transition: color var(--transition-fast);
}

.mobile-resource-item:hover .mobile-resource-item__title {
  color: var(--color-teal-deep);
}

.mobile-resource-item__desc {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  line-height: 1.4;
}

.mobile-resource-chevron {
  flex-shrink: 0;
  color: var(--color-text-muted);
  opacity: 0.6;
  transition: transform var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);
}

.mobile-resource-item:hover .mobile-resource-chevron {
  color: var(--color-primary-teal);
  opacity: 1;
  transform: translateX(2px);
}

/* Mobile active link */
.mobile-nav__link.is-active {
  background-color: var(--color-teal-tint);
  color: var(--color-teal-deep);
}

/* ==========================================================================
   HEADER CONTAINER â€” flex containment so no section overflows
   ========================================================================== */

/* Ensure three sections (logo / nav / actions) never overlap each other */
.incepbio-header__container {
  /* Override: use min-width on flex children so they shrink gracefully */
}

.incepbio-header__logo {
  flex-shrink: 0; /* logo never shrinks */
}

.incepbio-header__nav {
  flex: 1;               /* nav takes available space */
  min-width: 0;          /* allow shrink below intrinsic width */
  overflow: visible;     /* mega-menus must overflow */
  display: flex;
  justify-content: center;
}

.incepbio-header__actions {
  flex-shrink: 0;        /* actions never shrink */
  min-width: 0;
}

/* Ensure the actions are never displaced by nav growth */
@media (min-width: 992px) {
  .incepbio-header__nav {
    display: flex;        /* override display:block set above */
  }
}

/* ==========================================================================
   ADDITIONAL RESPONSIVE FIXES
   ========================================================================== */

/* Medium tablets: 768pxâ€“991px */
@media (max-width: 991px) {
  .incepbio-header__container {
    padding: 0 1.25rem;
    height: 68px;
  }

  /* Hide desktop nav and actions on mobile/tablet */
  .incepbio-header__nav,
  .incepbio-header__actions {
    display: none !important;
  }

  .incepbio-header__mobile-toggle {
    display: flex;
  }
}

/* Small phones: 320pxâ€“374px */
@media (max-width: 374px) {
  .incepbio-header__container {
    padding: 0 1rem;
    height: 60px;
  }

  .main-header-logo {
    height: 32px;
  }

  .incepbio-mobile-nav__container {
    max-width: 100%;
  }
}

/* Tablets: 768pxâ€“991px â€” mobile nav full width */
@media (max-width: 991px) and (min-width: 768px) {
  .incepbio-mobile-nav__container {
    max-width: 360px;
  }

  .mobile-services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Very tight desktops: 992pxâ€“1100px */
@media (max-width: 1100px) and (min-width: 992px) {
  .incepbio-header__link {
    font-size: 0.875rem;
    padding: 0.5rem 0.7rem;
  }

  .btn {
    font-size: 0.8125rem;
    padding: 0.6rem 0.875rem;
  }

  .incepbio-header__actions {
    gap: 0.5rem;
  }
}

/* Ensure mega menu does not go off-screen on narrow desktops */
@media (max-width: 1100px) and (min-width: 992px) {
  .incepbio-header__mega-menu {
    width: min(860px, calc(100vw - 2rem));
  }

  .incepbio-header__mega-menu--resources {
    width: min(600px, calc(100vw - 2rem));
  }
}

/* 1440px+ â€” wider spacing */
@media (min-width: 1440px) {
  .incepbio-header__container {
    padding: 0 4rem;
  }
}

/* ==========================================================================
   REF SERVICES MEGA MENU (2-COLUMN) - PREMIUM GREEN/TEAL DESIGN
   ========================================================================== 
*/
.mega-menu__inner--services {
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-columns: 360px 1fr;
  border-radius: var(--radius-xl, 16px);
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

.ref-mega-left {
  background-color: #ffffff;
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-right: 1px solid #f1f5f9;
}

.ref-mega-right {
  background-color: #ffffff;
  padding: 2.25rem 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Left Column Cards (Premium Soft Gradient) */
.ref-card-main {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.1rem 1.4rem;
  background: linear-gradient(135deg, #F0FAF9 0%, #E8F7F6 100%);
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.25s ease;
  border: 1px solid transparent;
}
.ref-card-main:hover {
  background: linear-gradient(135deg, #E8F7F6 0%, #DFEFEF 100%);
  border-color: rgba(0, 156, 141, 0.15);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 156, 141, 0.08);
}

.ref-card-main__content {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.ref-card-main__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--color-primary-navy, #001A33);
  line-height: 1.2;
}
.ref-card-main__desc {
  font-size: 0.8rem;
  color: var(--color-text-muted, #64748b);
  line-height: 1.4;
}
.ref-card-main__arrow {
  color: var(--color-primary-navy, #004d89);
  width: 24px;
  height: 24px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.25s ease;
}
.ref-card-main__arrow svg {
  width: 12px;
  height: 12px;
}
.ref-card-main:hover .ref-card-main__arrow {
  color: #ffffff;
  background: var(--color-primary-navy, #004d89);
  border-color: var(--color-primary-navy, #004d89);
}

/* Right Column List Styles */
.ref-list-group {
  margin-bottom: 1rem;
}
.ref-list-group__header {
  border-bottom: 1px solid #f1f5f9;
  padding-bottom: 0.6rem;
}
.ref-list-group ul li a:hover {
  color: var(--color-primary-teal, #009c8d) !important;
}


/* ==========================================================================
   TOP INFORMATION BAR (Restored)
   ========================================================================== */


.top-info-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0 4rem;
  max-width: 1800px;
  margin: 0 auto;
  height: 100%;
}

@media (max-width: 991px) {
  .top-info-bar {
    display: none;
  }
  .incepbio-header {
    top: 0;
  }
}

.top-info-item { display: flex; align-items: center; gap: 0.5rem; color: #fff; text-decoration: none; transition: color 0.2s ease; } .top-info-item:hover { color: #009c8d; }

.top-info-item svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
  flex-shrink: 0;
}





.top-info-left, .top-info-right {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.top-info-divider {
  width: 1px;
  height: 14px;
  background-color: rgba(255, 255, 255, 0.2);
}

.top-socials {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.top-socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #fff;
  color: var(--color-primary-teal, #009c8d);
  transition: all 0.3s ease;
}

.top-socials a svg {
  width: 14px;
  height: 14px;
  fill: var(--color-primary-teal, #009c8d) !important;
  stroke: none !important;
}

.top-socials a:hover {
  background: var(--color-primary-navy, #003366);
  color: #fff;
  transform: translateY(-2px);
}

.top-socials a:hover svg {
  fill: #ffffff !important;
}

.lang-selector-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.lang-selector-btn {
  background: transparent;
  border: none;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-size: 0.8rem;
  padding: 0.5rem 0;
  font-family: inherit;
}

.lang-selector-btn svg {
  width: 10px;
  height: 10px;
  fill: currentColor;
  transition: transform 0.2s ease;
}

.lang-current-text {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

.lang-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
  min-width: 160px;
  padding: 0.5rem 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.3s ease;
  z-index: 1000;
}

.lang-selector-wrapper:hover .lang-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.lang-group {
  padding: 0.25rem 1rem;
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #888;
  font-weight: 600;
  margin-top: 0.25rem;
}

.lang-option {
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  color: #333;
  text-decoration: none;
  font-size: 0.8rem;
  transition: background 0.2s;
}

.lang-option:hover {
  background: #f5f5f5;
  color: var(--color-primary-navy, #004d89);
}

/* ==========================================================================
   HIDE GOOGLE TRANSLATE BANNER & TOOLTIPS
   ========================================================================== */
body {
  top: 0px !important;
  position: static !important;
}

iframe.goog-te-banner-frame,
.goog-te-banner-frame,
.skiptranslate > iframe.goog-te-banner-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
#goog-gt-tt,
.goog-tooltip,
body > .skiptranslate {
  display: none !important;
  visibility: hidden !important;
}

.goog-text-highlight {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}


.incepbio-header__logo {
  margin: 0 !important;
  padding: 0 !important;
}
.main-header-logo {
  display: block;
}


/* Removed global actions block */



.btn svg, .btn i {
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.contact-dropdown-wrapper {
  display: flex;
  align-items: center;
}

.incepbio-header__container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 80px !important;
}

.main-header-logo {
  height: 44px !important;
  width: auto !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
}
.incepbio-header__logo { margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; height: 100% !important; }
.incepbio-header__menu { margin: 0 !important; padding: 0 !important; }
.incepbio-header__item { margin: 0 !important; padding: 0 !important; }

/* ==========================================================================
   NEW MEGA MENU LAYOUT (2-COLUMN)
   ========================================================================== */
.mega-menu__inner--services-new {
  display: grid;
  grid-template-columns: 350px 1fr;
  gap: 2.5rem;
  padding: 2rem;
  background: #ffffff;
  border-radius: var(--radius-lg);
}

.mega-menu-left-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.mm-service-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background: #F0F9F8; /* Light teal background */
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
  border: 1px solid transparent;
}

.mm-service-card:hover {
  background: #E4F4F3;
  transform: translateX(5px);
  border-color: rgba(0, 156, 141, 0.2);
}

.mm-service-card-text h4 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: #004D88; /* Navy */
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.2rem 0;
  line-height: 1.2;
}

.mm-service-card-text p {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: #64748B; /* Gray */
  font-size: 0.8125rem;
  margin: 0;
  line-height: 1.2;
}

.mm-service-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid #004D88;
  color: #004D88;
  transition: all 0.3s ease;
}

.mm-service-card:hover .mm-service-card-icon {
  background: #004D88;
  color: #ffffff;
}

.mega-menu-right-categories {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem 1.5rem;
}

.mm-category-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: #004D88;
  font-size: 1.0625rem;
  font-weight: 700;
  margin: 0 0 1rem 0;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #E2E8F0;
}

.mm-category-title svg {
  color: #009C8D; /* Teal Icon */
}

.mm-category-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.mm-category-list li a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: #475569;
  font-size: 0.9rem;
  text-decoration: none;
  transition: color 0.2s ease;
}

.mm-category-list li a:hover {
  color: #009C8D;
}


/* ============================================================
   INCEPBIO HEADER — PRODUCTION QUALITY PATCH v1.0
   Complete enterprise-grade refinements for launch
   ============================================================ */

/* ── 1. UNIFIED HEADER HEIGHT (single source of truth) ── */
.incepbio-header__container {
  height: 72px !important;
}

@media (max-width: 991px) {
  .incepbio-header__container {
    height: 64px !important;
    padding: 0 1rem !important;
  }
  body {
    padding-top: 64px !important;
  }
}

@media (max-width: 374px) {
  .incepbio-header__container {
    height: 56px !important;
  }
  body {
    padding-top: 56px !important;
  }
}

@media (min-width: 992px) {
  body {
    padding-top: 114px !important; /* 42px top bar + 72px header */
  }
  .incepbio-header {
    top: 42px;
  }
}

/* ── 2. LOGO — Perfect vertical centering ── */
.incepbio-header__logo {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  flex-shrink: 0 !important;
}

.main-header-logo {
  height: 42px !important;
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
}

@media (max-width: 991px) {
  .main-header-logo {
    height: 36px !important;
  }
}

@media (max-width: 374px) {
  .main-header-logo {
    height: 30px !important;
  }
}

/* ── 3. NAVIGATION — Perfect spacing & visual hierarchy ── */
.incepbio-header__nav {
  display: none;
  flex: 1;
  min-width: 0;
  overflow: visible;
  justify-content: center;
  align-items: center;
}

@media (min-width: 992px) {
  .incepbio-header__nav {
    display: flex !important;
  }
}

.incepbio-header__menu {
  display: flex;
  align-items: center;
  height: 100%;
  gap: 2px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.incepbio-header__link {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-primary-navy);
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  border-radius: 8px;
  white-space: nowrap;
  transition: color 160ms ease, background-color 160ms ease;
  min-height: 40px; /* WCAG 2.5.5 touch target */
}

.incepbio-header__link:hover {
  color: var(--color-teal-deep);
  background-color: var(--color-teal-tint);
}

/* Tight desktop: 992–1100px */
@media (max-width: 1100px) and (min-width: 992px) {
  .incepbio-header__link {
    font-size: 0.8125rem;
    padding: 7px 9px;
  }
}

/* ── 4. ACTIVE LINK — Current page indicator ── */
.incepbio-header__link.is-active {
  color: var(--color-primary-teal) !important;
  background-color: var(--color-teal-tint) !important;
  font-weight: 700 !important;
}

.incepbio-header__link.is-active::after {
  transform: scaleX(1) !important;
}

/* ── 5. HEADER ACTIONS AREA ── */
.incepbio-header__actions {
  display: none;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

@media (min-width: 992px) {
  .incepbio-header__actions {
    display: flex !important;
  }
}

/* ── 6. HEADER BUTTONS — Override shared-components.css icon sizes ── */
.incepbio-header .btn svg,
.incepbio-header .btn i,
.incepbio-header__actions .btn svg,
.incepbio-header__actions .btn i,
.incepbio-header__actions .btn--secondary svg,
.incepbio-header__actions .btn--secondary i {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
  stroke: #ffffff !important;
}

/* Header primary button */
.incepbio-header__actions .btn:not(.btn--secondary):not(.contact-trigger) {
  padding: 10px 18px !important;
  font-size: 0.875rem !important;
}

/* Header secondary button */
.incepbio-header__actions .btn--secondary {
  padding: 9px 16px !important;
  font-size: 0.875rem !important;
}

/* ── 7. CONTACT DROPDOWN — Smooth & accessible ── */
.contact-dropdown-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.contact-dropdown {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 270px;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 40px -8px rgba(0, 48, 92, 0.18);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 10px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px) scale(0.98);
  transition: opacity 220ms ease, transform 320ms cubic-bezier(0.16, 1, 0.3, 1), visibility 220ms ease;
  z-index: 200;
}

.contact-dropdown-wrapper:hover .contact-dropdown,
.contact-dropdown-wrapper:focus-within .contact-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

/* ── 8. MEGA MENU — Force-open support for keyboard/click ── */
.has-dropdown.force-open .incepbio-header__mega-menu {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(-50%) translateY(14px) scale(1) !important;
  pointer-events: auto !important;
}

/* Ensure mega menu doesn't go off-screen */
@media (max-width: 1100px) and (min-width: 992px) {
  .incepbio-header__mega-menu {
    width: min(880px, calc(100vw - 2rem));
    left: 50%;
  }
}

/* ── 9. TOP INFO BAR — Production polish ── */
.top-info-bar {
  height: 42px;
  font-size: 0.775rem;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.top-info-container {
  padding: 0 2rem;
  max-width: 1800px;
}

@media (min-width: 1440px) {
  .top-info-container {
    padding: 0 4rem;
  }
}

.top-info-item {
  min-height: 42px; /* Full bar height = touch target */
  gap: 6px;
  font-size: 0.775rem;
}

.top-info-item svg {
  width: 13px;
  height: 13px;
  opacity: 0.9;
}

.top-info-left, .top-info-right {
  gap: 1.25rem;
}

/* Social icon touch targets */
.top-socials a {
  width: 26px;
  height: 26px;
  border-radius: 50%;
}

.top-socials a svg {
  width: 12px;
  height: 12px;
}

/* ── 10. LANGUAGE SELECTOR — Refined ── */
.lang-selector-btn {
  font-size: 0.775rem;
  font-weight: 500;
  padding: 0.25rem 0.5rem;
  border-radius: 5px;
  transition: background-color 160ms ease;
  gap: 5px;
}

.lang-selector-btn:hover {
  background-color: rgba(255,255,255,0.15);
}

.lang-selector-btn svg {
  width: 9px;
  height: 9px;
  transition: transform 220ms ease;
}

.lang-selector-wrapper:hover .lang-selector-btn svg {
  transform: rotate(180deg);
}

.lang-dropdown {
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(0, 48, 92, 0.15);
  padding: 6px 0;
  min-width: 170px;
  border: 1px solid rgba(226, 232, 240, 0.8);
}

.lang-option {
  font-size: 0.8125rem;
  padding: 7px 14px;
  transition: background 160ms ease, color 160ms ease;
  gap: 6px;
}

.lang-group {
  font-size: 0.65rem;
  padding: 4px 14px;
  letter-spacing: 0.08em;
}

/* ── 11. STICKY HEADER — Smooth scroll behavior ── */
.incepbio-header {
  will-change: box-shadow, background-color;
  transition: box-shadow 300ms ease, background-color 300ms ease;
}

.incepbio-header.is-scrolled {
  background-color: rgba(255, 255, 255, 0.97) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 4px 24px rgba(0, 48, 92, 0.1) !important;
}

/* Bottom gradient line remains on scroll */
.incepbio-header::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #004D88 0%, #009C8D 50%, #00CFBB 100%);
  opacity: 0.8;
}

/* ── 12. MOBILE HAMBURGER — Touch target compliance ── */
.incepbio-header__mobile-toggle {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 8px;
  display: none;
  align-items: center;
  justify-content: center;
  background: var(--color-light-bg);
  transition: background-color 160ms ease, transform 160ms ease;
  flex-shrink: 0;
}

.incepbio-header__mobile-toggle:hover {
  background-color: var(--color-teal-tint);
}

.incepbio-header__mobile-toggle:active {
  transform: scale(0.94);
}

/* ── 13. MOBILE NAV DRAWER — Production refinements ── */
.incepbio-mobile-nav__container {
  box-shadow: -20px 0 60px rgba(0, 20, 45, 0.22);
}

.incepbio-mobile-nav__header {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--color-border);
  background: #fff;
}

.mobile-close-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 8px;
  transition: background-color 160ms ease, transform 200ms ease;
}

/* ── 14. MOBILE NAV LINKS — Min touch targets ── */
.mobile-nav__link {
  min-height: 52px;
  padding: 0.875rem 1rem;
}

.mobile-sub-link {
  min-height: 44px;
  padding: 0.75rem 0.75rem;
}

.mobile-cat-link {
  min-height: 44px;
}

/* ── 15. MODAL REFINEMENTS ── */
.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 20, 45, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 9000;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  animation: modalFadeIn 200ms ease;
}

.modal-overlay.active,
.modal-overlay.is-open {
  display: flex;
}

@keyframes modalFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.modal-box {
  background: #fff;
  border-radius: 20px;
  padding: 2.5rem;
  width: 100%;
  max-width: 520px;
  position: relative;
  box-shadow: 0 30px 80px rgba(0, 20, 45, 0.25);
  animation: modalSlideUp 280ms cubic-bezier(0.16, 1, 0.3, 1);
  max-height: 90vh;
  overflow-y: auto;
}

.modal-box--wide {
  max-width: 680px;
}

@keyframes modalSlideUp {
  from { opacity: 0; transform: translateY(20px) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.modal-close {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--color-light-bg);
  border: none;
  font-size: 1.25rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 160ms ease, transform 160ms ease;
  color: var(--color-text-muted);
}

.modal-close:hover {
  background: #fee2e2;
  color: #dc2626;
  transform: rotate(90deg);
}

.modal-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--color-navy-deep);
  margin-bottom: 0.4rem;
  line-height: 1.25;
  padding-right: 2rem;
}

.modal-sub {
  font-size: 0.9rem;
  color: var(--color-text-muted);
  margin-bottom: 1.5rem;
  line-height: 1.5;
}

.modal-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 480px) {
  .form-row {
    grid-template-columns: 1fr;
  }
  .modal-box {
    padding: 1.75rem 1.25rem;
    border-radius: 16px;
  }
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-field label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-main);
}

.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1.5px solid var(--color-border);
  border-radius: 10px;
  font-family: inherit;
  font-size: 0.9rem;
  color: var(--color-text-main);
  background: var(--color-light-bg);
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
  min-height: 44px; /* Touch target */
}

.form-field textarea {
  min-height: 100px;
  resize: vertical;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline: none;
  border-color: var(--color-primary-teal);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(0, 156, 141, 0.12);
}

.modal-submit {
  width: 100%;
  padding: 0.875rem 1.5rem;
  background: linear-gradient(135deg, #009C8D 0%, #004D88 100%);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform 200ms ease, box-shadow 200ms ease, background 200ms ease;
  margin-top: 0.25rem;
  min-height: 52px;
}

.modal-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0, 156, 141, 0.35);
  background: linear-gradient(135deg, #00CFBB 0%, #004D88 100%);
}

.modal-submit:active {
  transform: translateY(0);
}

.modal-note {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  text-align: center;
  margin-top: 0.5rem;
  line-height: 1.5;
}

.modal-note a {
  color: var(--color-primary-teal);
  text-decoration: underline;
}

/* Body scroll lock when modal is open */
body.modal-open {
  overflow: hidden;
}

/* ── 16. DROPDOWN ICON ANIMATION ── */
.dropdown-icon {
  transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), color 160ms ease;
  flex-shrink: 0;
}

.has-dropdown:hover .dropdown-icon,
.has-dropdown.force-open .dropdown-icon,
.dropdown-toggle[aria-expanded="true"] .dropdown-icon {
  transform: rotate(180deg);
  color: var(--color-primary-teal);
}

/* ── 17. MM SERVICE CARD — Heading override for gradient text system ── */
.mm-service-card-text h4,
.mm-category-title,
.core-card__name,
.editorial-item__title,
.editorial-panel__feature-title,
.service-card__title {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: initial !important;
  color: var(--color-navy-deep) !important;
}

/* ── 18. MEGA MENU BACKDROP ── */
.mega-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 40;
  pointer-events: none;
  opacity: 0;
  background: transparent;
}

/* ── 19. FOCUS VISIBLE — Keyboard accessibility ── */
.incepbio-header__link:focus-visible,
.incepbio-header__mobile-toggle:focus-visible,
.mobile-nav__link:focus-visible,
.mobile-sub-link:focus-visible,
.modal-close:focus-visible,
.modal-submit:focus-visible,
.lang-selector-btn:focus-visible {
  outline: 2px solid #009C8D;
  outline-offset: 2px;
}

/* ── 20. PRINT — Hide header chrome ── */
@media print {
  .top-info-bar,
  .incepbio-header__actions,
  .incepbio-header__mobile-toggle,
  .incepbio-mobile-nav {
    display: none !important;
  }
  body {
    padding-top: 0 !important;
  }
}

/* ── 21. TOP BAR RESPONSIVE — Hide gracefully ── */
@media (max-width: 991px) {
  .top-info-bar {
    display: none !important;
  }
  .incepbio-header {
    top: 0 !important;
  }
}

/* ── 22. MOBILE SERVICES GRID ─ 2 columns on tablet ── */
@media (min-width: 640px) and (max-width: 991px) {
  .mobile-services-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }
}

/* ── 23. PREVENT HORIZONTAL OVERFLOW ── */
.incepbio-header {
  overflow: visible;
}

.incepbio-mobile-nav,
.incepbio-mobile-nav__container {
  overflow-x: hidden;
}

/* ── END PRODUCTION PATCH ── */


@media (max-width: 991px) { .incepbio-header__mobile-toggle { display: flex !important; } }
