/* Custom Keyframes for Animations */
 /* Prevent horizontal overflow globally (helps fixed, transformed children) */
 html {
   overflow-x: hidden;
 }

 @supports (overflow-x: clip) {
   html {
     overflow-x: clip;
   }
 }

 /* Prevent long words from causing horizontal scroll on small screens */
 body,
 h1,
 h2,
 h3,
 p,
 a,
 li,
 button,
 input,
 textarea {
   overflow-wrap: anywhere;
   word-break: break-word;
 }

 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 @keyframes slideDown {
   from {
     opacity: 0;
     transform: translateY(-100%);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 /* Animation Utility Classes */
 .animate-fadeInUp {
   animation: fadeInUp 0.6s ease-out forwards;
 }

 .animate-slideDown {
   animation: slideDown 0.3s ease-out forwards;
 }

 @keyframes floatSoft {

   0%,
   100% {
     transform: translateY(0);
   }

   50% {
     transform: translateY(-6px);
   }
 }

 .animate-floatSoft {
   animation: floatSoft 6s ease-in-out infinite;
 }

 /* Navbar visuals */
 .navbar {
   backdrop-filter: blur(10px);
   -webkit-backdrop-filter: blur(10px);
   overflow: visible;
 }

 .navbar .container {
   overflow: visible;
 }

 .group\/nav {
   position: static !important;
 }

 .navbar.scrolled {
   background: rgba(0, 51, 160, 0.95);
   box-shadow: 0 6px 24px rgba(0, 0, 0, 0.2);
 }

 .nav-link {
   transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
   border-radius: 9999px;
 }

 .nav-link:hover {
   transform: translateY(-1px);
 }

 /* Off‑canvas mobile menu without causing page X-overflow when closed */
 .mobile-menu {
   left: 100% !important;
   transform: none;
   transition: left 0.3s ease-in-out;
   overflow-x: hidden;
 }

 .mobile-menu.open {
   left: 0 !important;
 }

 .mega-panel {
   pointer-events: auto;
   z-index: 9999;
 }

 @media (max-width: 640px) {

   /* Ensure mega panel never overflows viewport width */
   .mega-panel {
     left: 50% !important;
     transform: translateX(-50%) translateY(0) !important;
     width: calc(100vw - 24px) !important;
   }
 }


 .hamburger-line {
   transition: all 0.3s ease;
 }

 .hamburger.active .hamburger-line:nth-child(1) {
   transform: rotate(45deg) translate(5px, 5px);
 }

 .hamburger.active .hamburger-line:nth-child(2) {
   opacity: 0;
 }

 .hamburger.active .hamburger-line:nth-child(3) {
   transform: rotate(-45deg) translate(7px, -6px);
 }

 /* Partners strip */
 .marquee {
   position: relative;
   overflow-x: hidden;
   overflow-y: visible;
   padding-block: 8px;
 }

 .marquee::before,
 .marquee::after {
   content: "";
   position: absolute;
   top: 0;
   bottom: 0;
   width: 64px;
   pointer-events: none;
   z-index: 20;
 }

 .marquee::before {
   left: 0;
   background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
 }

 .marquee::after {
   right: 0;
   background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
 }

 .marquee-track {
   display: flex;
   align-items: center;
   gap: 3rem;
   width: max-content;
   animation: marquee 40s linear infinite;
   overflow: visible;
   padding-block: 8px;
 }

 @keyframes marquee {
   0% {
     transform: translateX(0);
   }

   100% {
     transform: translateX(-50%);
   }
 }

 .partner-item {
   height: 72px;
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
 }

 .partner-item:hover {
   z-index: 30;
 }

 .partner-logo {
   height: 44px;
   display: block;
   filter: grayscale(100%);
   opacity: 0.7;
   transition: filter .3s ease, opacity .3s ease, transform .3s ease;
   position: relative;
   z-index: 1;
 }

 .partner-logo:hover {
   filter: grayscale(0%);
   opacity: 1;
   transform: translateY(-2px);
   z-index: 30;
 }

 /* Decorative background grid */
 .bg-grid {
   background-image: radial-gradient(rgba(13, 26, 46, 0.08) 1px, transparent 1.2px);
   background-size: 22px 22px;
 }

 /* Inline list micro-interactions */
 .icon-float {
   animation: floatSoft 6s ease-in-out infinite;
 }

 /* Services – accordion lanes */
 .service-lane {
   background: transparent;
 }

 .lane-header {
   width: 100%;
   display: grid;
   grid-template-columns: 56px 1fr 28px;
   gap: 16px;
   align-items: center;
   padding: 18px 4px;
   background: transparent;
   border: none;
   text-align: left;
   cursor: pointer;
 }

 .lane-num {
   display: grid;
   place-items: center;
   width: 48px;
   height: 48px;
   border-radius: 12px;
   background: rgba(0, 51, 160, 0.08);
   color: #0033A0;
   font-weight: 700;
 }

 .lane-text .lane-title {
   display: block;
   font-size: 1.5rem;
   font-weight: 800;
   color: #0d1a2e;
 }

 .lane-text .lane-sub {
   display: block;
   font-size: 0.875rem;
   color: #64748b;
   margin-top: 2px;
 }

 .lane-chev {
   color: #0033A0;
   transition: transform .35s ease;
 }

 .lane-body {
   padding: 0 4px 18px 4px;
   overflow: hidden;
   height: 0;
   opacity: 0;
   transform: translateY(-4px);
   transition: height .35s ease, opacity .25s ease, transform .35s ease;
 }

 .service-lane.open .lane-body {
   opacity: 1;
   transform: translateY(0);
 }

 .service-lane.open .lane-chev {
   transform: none;
 }

 .lane-desc {
   color: #334155;
   margin-bottom: 10px;
 }

 .lane-list {
   display: grid;
   gap: 8px;
   color: #334155;
 }

 .lane-list i {
   color: #10b981;
   margin-right: 8px;
 }

 .lane-cta {
   margin-top: 12px;
   display: flex;
   gap: 12px;
   flex-wrap: wrap;
 }

 .lane-link {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   font-weight: 700;
   color: #0033A0;
 }

 .lane-contact {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   font-weight: 600;
   color: #0033A0;
   background: rgba(0, 51, 160, 0.08);
   padding: 8px 12px;
   border-radius: 9999px;
 }

 .lane-header:hover {
   background: rgba(0, 51, 160, 0.04);
   border-radius: 12px;
 }

 /* Footer link underline animation */
 .footer-link {
   position: relative;
   display: inline-block;
   text-decoration: none;
 }

 .footer-link::after {
   content: "";
   position: absolute;
   left: 0;
   bottom: -3px;
   height: 2px;
   width: 0%;
   background: currentColor;
   transition: width .25s ease;
 }

 .footer-link:hover::after {
   width: 100%;
 }

 /* Subtle dark grid for footer */
 .bg-grid-dark {
   background-image: radial-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1.2px);
   background-size: 22px 22px;
 }

 /* Timeline */
 .timeline {
   position: relative;
   padding-left: 2.5rem;
 }

 .timeline::before {
   content: "";
   position: absolute;
   left: 0.75rem;
   top: 0;
   bottom: 0;
   width: 2px;
   background: rgba(255, 255, 255, 0.15);
 }

 .timeline-item {
   position: relative;
   padding-left: 1rem;
 }

 .timeline-item+.timeline-item {
   margin-top: 1.25rem;
 }

 .timeline-icon {
   position: absolute;
   left: 0.75rem;
   top: 0.6rem;
   transform: translate(-50%, 0);
   height: 20px;
   width: 20px;
   border-radius: 9999px;
   background: #0033A0;
   box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.1);
 }

 /* Alternating center-rail timeline (desktop) */
 .alt-timeline {
   position: relative;
 }

 .alt-rail {
   position: absolute;
   left: 50%;
   top: 0;
   bottom: 0;
   transform: translateX(-50%);
   width: 2px;
   background: rgba(255, 255, 255, 0.15);
 }

 .alt-timeline {
   counter-reset: step;
 }

 .timeline-row {
   display: grid;
   grid-template-columns: 1fr 48px 1fr;
   align-items: center;
   position: relative;
 }

 .timeline-node {
   width: 48px;
   height: 48px;
   border-radius: 9999px;
   display: grid;
   place-items: center;
   background: #0033A0;
   color: white;
   box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.06);
 }

 .timeline-card {
   position: relative;
   border: 1px solid rgba(255, 255, 255, 0.1);
   background: rgba(255, 255, 255, 0.05);
   backdrop-filter: blur(6px);
   border-radius: 16px;
   padding: 18px 20px;
 }

 .timeline-card.left {
   margin-right: 32px;
 }

 .timeline-card.right {
   margin-left: 32px;
 }

 /* Responsive adjustments for alternating timeline */
 @media (max-width: 640px) {
   .alt-rail {
     display: none;
   }

   .timeline-row {
     display: block;
   }

   .timeline-node {
     display: none;
   }

   .timeline-card {
     margin: 0 0 18px 0;
   }

   .timeline-card.left,
   .timeline-card.right {
     margin: 0 0 18px 0;
   }

   .timeline-card {
     counter-increment: step;
   }

   .timeline-card::before {
     content: counter(step);
     display: inline-grid;
     place-items: center;
     width: 32px;
     height: 32px;
     margin-bottom: 8px;
     border-radius: 9999px;
     background: #0033A0;
     color: #ffffff;
     font-weight: 700;
     box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.06);
   }
 }

 /* Hero subservice bubbles */
 .hero-bubble {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   z-index: 20;
   background: rgba(255, 255, 255, 0.95);
   color: #0d1a2e;
   border-radius: 9999px;
   padding: 8px 12px;
   font-size: 12px;
   line-height: 1;
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
   border: 1px solid rgba(0, 51, 160, 0.12);
   white-space: nowrap;
   pointer-events: auto;
   transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease;
 }

 .hero-bubble:hover {
   transform: translate(-50%, -50%) scale(1.05);
   box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
   background: #ffffff;
 }

 .hero-bubble .dot {
   display: inline-block;
   width: 6px;
   height: 6px;
   border-radius: 9999px;
   background: #0033A0;
   margin-right: 8px;
 }

 /* Hero image scale without cropping container */
 .hero-zoom {
   transform: scale(1.06);
   transform-origin: center;
 }

 @media (min-width: 1024px) {
   .hero-zoom {
     transform: scale(1.12);
   }
 }

 /* Removed hotspot ring animation per design */

 /* Ensure hero hotspots and their tooltips stack above neighboring icons */
 .hotspots {
   overflow: visible;
 }

 .hotspots a.group:hover,
 .hotspots a.group:focus,
 .hotspots a.group:focus-within {
   z-index: 9999 !important;
 }

 /* Elevate the tooltip element itself */
 .hotspots a.group>div {
   z-index: 10000 !important;
 }

 /* Career job cards */
 .job-card {
   position: relative;
   overflow: hidden;
   background: #ffffff;
   border-radius: 16px;
   border: 1px solid rgba(0, 0, 0, 0.06);
   box-shadow: 0 6px 30px rgba(0, 0, 0, 0.06);
   transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
 }

 .job-card::before {
   content: "";
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   height: 3px;
   background: linear-gradient(90deg, #0033A0 0%, #60a5fa 50%, #0033A0 100%);
   opacity: .85;
 }

 .job-card:hover {
   transform: translateY(-2px);
   box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
   border-color: rgba(0, 51, 160, 0.18);
 }

 .job-list {
   margin-top: 1rem;
   display: grid;
   gap: .5rem;
   color: #334155;
 }

 .job-list li {
   display: grid;
   grid-template-columns: 28px 1fr;
   align-items: flex-start;
   gap: .75rem;
 }

 .job-list i {
   display: grid;
   place-items: center;
   width: 28px;
   height: 28px;
   border-radius: 9999px;
   background: #ecfdf5;
   color: #059669;
   margin: 0;
 }

 .job-meta {
   margin-top: .75rem;
   display: flex;
   flex-wrap: wrap;
   gap: .5rem .75rem;
   color: #64748b;
   font-size: .875rem;
 }

 .job-chip {
   display: inline-flex;
   align-items: center;
   gap: .375rem;
   padding: .25rem .5rem;
   border-radius: 9999px;
   background: #f8fafc;
   border: 1px solid #eef2f7;
 }

 .job-chip i {
   color: #64748b;
 }

 .job-cta {
   margin-top: 1rem !important;
 }

 /* Override navbar scrolled color */
 .navbar.scrolled {
   background: rgba(13, 26, 46, 0.95) !important;
   backdrop-filter: blur(12px);
   -webkit-backdrop-filter: blur(12px);
 }

 /* Hide Google reCAPTCHA Badge */
 .grecaptcha-badge {
   visibility: hidden;
 }