/* Nexaqua Premium V5 - consolidated production stylesheet */

/* Source: styles.css */

:root {
  --navy-950: #031b3d;
  --navy-900: #052a5a;
  --navy-800: #07427e;
  --blue-700: #075eb5;
  --blue-600: #0784d1;
  --aqua-500: #11bde5;
  --aqua-300: #7ee8f8;
  --green-500: #36a64f;
  --ink: #0b2447;
  --muted: #5d7189;
  --surface: #ffffff;
  --surface-2: #f4fbff;
  --surface-3: #eaf8ff;
  --line: rgba(7, 94, 181, 0.13);
  --shadow-sm: 0 12px 30px rgba(4, 39, 76, 0.09);
  --shadow-md: 0 24px 70px rgba(3, 42, 90, 0.16);
  --shadow-lg: 0 40px 120px rgba(3, 42, 90, 0.24);
  --radius-sm: 14px;
  --radius-md: 24px;
  --radius-lg: 36px;
  --content: min(1180px, calc(100vw - 40px));
  --ease: cubic-bezier(.2,.8,.2,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
  margin: 0;
  color: var(--ink);
  background: #f9fdff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
::selection { background: rgba(17,189,229,.26); color: var(--navy-950); }

.skip-link {
  position: fixed; left: 16px; top: -60px; z-index: 1000;
  padding: 12px 18px; background: #fff; color: var(--navy-950);
  border-radius: 12px; box-shadow: var(--shadow-sm); transition: .2s;
}
.skip-link:focus { top: 16px; }

.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  transition: background .35s ease, box-shadow .35s ease, transform .35s ease;
}
.site-header.scrolled {
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 10px 40px rgba(3,42,90,.08);
  border-bottom: 1px solid rgba(255,255,255,.7);
}
.nav-shell {
  width: var(--content); height: 84px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.brand { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; }
.brand img { width: 116px; height: 68px; object-fit: contain; filter: drop-shadow(0 10px 20px rgba(5,94,181,.10)); }
.nav-links { display: flex; align-items: center; gap: 6px; }
.nav-links a {
  padding: 10px 12px; border-radius: 999px; font-weight: 750; font-size: 13px;
  color: rgba(11,36,71,.76); transition: .25s var(--ease);
}
.nav-links a:hover, .nav-links a.active { color: var(--blue-700); background: rgba(7,132,209,.08); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.nav-toggle {
  display: none; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(7,132,209,.09); color: var(--navy-900); place-items: center;
}
.nav-toggle span, .nav-toggle::before, .nav-toggle::after {
  content: ""; display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; transition: .25s;
}
.nav-toggle span { margin: 4px 0; }
.nav-toggle.open span { opacity: 0; }
.nav-toggle.open::before { transform: translateY(6px) rotate(45deg); }
.nav-toggle.open::after { transform: translateY(-6px) rotate(-45deg); }

.btn {
  appearance: none; border: 0; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 22px; font-weight: 800; font-size: 14px; letter-spacing: .01em;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: linear-gradient(135deg, var(--blue-700), var(--aqua-500)); box-shadow: 0 14px 30px rgba(7,132,209,.25); }
.btn-primary:hover { box-shadow: 0 20px 42px rgba(7,132,209,.35); }
.btn-secondary { color: var(--blue-700); background: rgba(255,255,255,.72); border: 1px solid rgba(7,94,181,.16); box-shadow: var(--shadow-sm); }
.btn-ghost { color: var(--navy-900); background: rgba(7,132,209,.07); }
.btn-sm { min-height: 42px; padding: 0 17px; font-size: 12px; }

.container { width: var(--content); margin-inline: auto; }
.section { position: relative; padding: 112px 0; }
.section-sm { padding: 82px 0; }
.section-tint { background: linear-gradient(180deg, #f5fbff 0%, #eefaff 100%); }
.section-dark { color: #fff; background: radial-gradient(circle at 18% 0%, rgba(17,189,229,.22), transparent 34%), linear-gradient(135deg, var(--navy-950), #064677 68%, #075e8b); overflow: hidden; }
.section-dark::after {
  content: ""; position: absolute; width: 540px; height: 540px; right: -220px; top: -260px;
  border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 60px rgba(255,255,255,.025), 0 0 0 120px rgba(255,255,255,.018);
}
.section-kicker { display: inline-flex; align-items: center; gap: 10px; color: var(--blue-700); font-weight: 900; font-size: 12px; letter-spacing: .15em; text-transform: uppercase; }
.section-kicker::before { content: ""; width: 28px; height: 2px; background: linear-gradient(90deg, var(--blue-700), var(--aqua-500)); border-radius: 2px; }
.section-dark .section-kicker { color: var(--aqua-300); }
.section-title { margin: 14px 0 18px; max-width: 760px; font-size: clamp(34px, 5vw, 60px); line-height: 1.04; letter-spacing: -.045em; color: var(--navy-950); }
.section-dark .section-title { color: #fff; }
.section-copy { margin: 0; max-width: 670px; color: var(--muted); font-size: 17px; }
.section-dark .section-copy { color: rgba(255,255,255,.73); }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 46px; }
.section-head .section-title { margin-bottom: 0; }

.hero {
  min-height: 100svh; position: relative; display: grid; place-items: center; overflow: hidden;
  background:
    radial-gradient(circle at 72% 28%, rgba(17,189,229,.17), transparent 27%),
    radial-gradient(circle at 15% 22%, rgba(7,132,209,.11), transparent 24%),
    linear-gradient(180deg, #fbfeff 0%, #eefaff 72%, #e7f8ff 100%);
}
#water-canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .7; pointer-events: none; }
.hero::before {
  content: ""; position: absolute; inset: auto -10% -22% -10%; height: 52%;
  background: radial-gradient(ellipse at center, rgba(17,189,229,.28), rgba(17,189,229,.08) 46%, transparent 70%);
  filter: blur(10px);
}
.hero-grid {
  width: var(--content); padding: 128px 0 72px; display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: 24px; position: relative; z-index: 2;
}
.hero-copy { max-width: 690px; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 13px; border-radius: 999px;
  background: rgba(255,255,255,.72); border: 1px solid rgba(7,132,209,.15); box-shadow: var(--shadow-sm);
  color: var(--blue-700); font-size: 12px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase;
}
.eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 5px rgba(54,166,79,.13); }
.hero h1 { margin: 20px 0 22px; font-size: clamp(50px, 7.5vw, 94px); line-height: .95; letter-spacing: -.065em; color: var(--navy-950); }
.hero h1 .accent { display: block; background: linear-gradient(90deg, var(--blue-700), var(--aqua-500) 72%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-copy > p { margin: 0; max-width: 630px; color: var(--muted); font-size: clamp(17px, 2vw, 20px); }
.hero-actions { margin-top: 32px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.hero-proof { margin-top: 34px; display: flex; gap: 22px; flex-wrap: wrap; color: rgba(11,36,71,.68); font-size: 13px; font-weight: 720; }
.hero-proof span { display: inline-flex; align-items: center; gap: 8px; }
.hero-proof i { width: 9px; height: 9px; border: 2px solid var(--aqua-500); border-radius: 50%; box-shadow: 0 0 0 5px rgba(17,189,229,.11); }

.hero-visual { position: relative; min-height: 610px; display: grid; place-items: center; perspective: 1200px; }
.orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(7,132,209,.14); animation: orbitSpin 18s linear infinite; }
.orbit.one { width: 510px; height: 510px; }
.orbit.two { width: 410px; height: 410px; animation-direction: reverse; animation-duration: 13s; }
.orbit::before, .orbit::after { content: ""; position: absolute; width: 10px; height: 10px; background: var(--aqua-500); border-radius: 50%; box-shadow: 0 0 20px rgba(17,189,229,.8); }
.orbit::before { left: 13%; top: 13%; }
.orbit::after { right: 9%; bottom: 21%; width: 7px; height: 7px; background: var(--green-500); }
.drop-stage { position: relative; width: 360px; height: 500px; transform-style: preserve-3d; transition: transform .25s ease-out; }
.water-drop {
  position: absolute; width: 290px; height: 390px; left: 50%; top: 42%; transform: translate(-50%,-50%) rotate(45deg);
  border-radius: 72% 28% 68% 32% / 70% 31% 69% 30%;
  background:
    radial-gradient(circle at 27% 25%, rgba(255,255,255,.98) 0 5%, rgba(255,255,255,.46) 6% 14%, transparent 15%),
    radial-gradient(circle at 68% 70%, rgba(7,94,181,.65), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,.9), rgba(126,232,248,.65) 18%, rgba(17,189,229,.88) 50%, rgba(7,94,181,.96) 82%);
  border: 1px solid rgba(255,255,255,.9);
  box-shadow: inset 16px 16px 30px rgba(255,255,255,.45), inset -24px -34px 54px rgba(3,42,90,.42), 0 38px 85px rgba(5,94,181,.36);
  animation: dropFloat 5.5s ease-in-out infinite; overflow: hidden;
}
.water-drop::before {
  content: ""; position: absolute; width: 190px; height: 190px; left: 26px; top: 37px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.46); box-shadow: 0 0 0 20px rgba(255,255,255,.04), 0 0 0 46px rgba(255,255,255,.025);
}
.water-drop::after {
  content: ""; position: absolute; inset: 22%; border-radius: 48%; transform: rotate(-45deg);
  background: url('../img/nexaqua-logo.png') center/contain no-repeat; filter: drop-shadow(0 10px 20px rgba(3,42,90,.18)); opacity: .94;
}
.water-surface {
  position: absolute; width: 480px; height: 155px; left: 50%; bottom: 18px; transform: translateX(-50%) rotateX(70deg);
  border-radius: 50%; background: radial-gradient(ellipse, rgba(17,189,229,.32), rgba(7,132,209,.07) 52%, transparent 70%);
  box-shadow: inset 0 0 40px rgba(255,255,255,.7); filter: blur(.1px);
}
.ripple { position: absolute; left: 50%; bottom: 70px; width: 240px; height: 70px; transform: translateX(-50%) rotateX(70deg); border: 3px solid rgba(17,189,229,.5); border-radius: 50%; opacity: 0; animation: ripplePulse 3.2s ease-out infinite; }
.ripple.r2 { animation-delay: 1.05s; }
.ripple.r3 { animation-delay: 2.1s; }
.float-card {
  position: absolute; display: flex; align-items: center; gap: 11px; padding: 13px 16px; min-width: 175px;
  border: 1px solid rgba(255,255,255,.85); border-radius: 18px; background: rgba(255,255,255,.66); backdrop-filter: blur(18px);
  box-shadow: var(--shadow-md); font-weight: 820; font-size: 13px; color: var(--navy-900); animation: cardFloat 5s ease-in-out infinite;
}
.float-card .icon { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: linear-gradient(135deg, rgba(7,132,209,.12), rgba(17,189,229,.18)); color: var(--blue-700); font-size: 20px; }
.float-card.c1 { left: -18px; top: 118px; }
.float-card.c2 { right: -28px; top: 238px; animation-delay: -1.3s; }
.float-card.c3 { left: 12px; bottom: 82px; animation-delay: -2.4s; }
.scroll-cue { position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 3; display: grid; place-items: center; gap: 7px; color: rgba(11,36,71,.48); font-size: 10px; letter-spacing: .16em; font-weight: 850; text-transform: uppercase; }
.scroll-mouse { width: 26px; height: 40px; border: 2px solid rgba(7,94,181,.32); border-radius: 16px; position: relative; }
.scroll-mouse::after { content: ""; position: absolute; width: 4px; height: 8px; left: 50%; top: 7px; transform: translateX(-50%); background: var(--blue-700); border-radius: 4px; animation: scrollDot 1.8s ease-in-out infinite; }

.trust-strip { position: relative; z-index: 5; margin-top: -1px; background: rgba(255,255,255,.94); border-top: 1px solid rgba(255,255,255,.8); border-bottom: 1px solid var(--line); box-shadow: 0 18px 50px rgba(3,42,90,.06); }
.trust-grid { width: var(--content); margin: auto; display: grid; grid-template-columns: repeat(4,1fr); }
.trust-item { padding: 24px; display: flex; align-items: center; justify-content: center; gap: 12px; font-weight: 850; font-size: 13px; text-align: center; border-right: 1px solid var(--line); }
.trust-item:last-child { border-right: 0; }
.trust-icon { width: 42px; height: 42px; border-radius: 15px; display: grid; place-items: center; color: var(--blue-700); background: linear-gradient(135deg, rgba(7,132,209,.10), rgba(17,189,229,.16)); font-size: 20px; flex: 0 0 auto; }

.challenge-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 54px; align-items: start; }
.challenge-menu { display: grid; gap: 12px; margin-top: 30px; }
.challenge-tab {
  width: 100%; padding: 15px 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.72); color: var(--ink);
  display: flex; align-items: center; justify-content: space-between; text-align: left; font-weight: 820; transition: .25s var(--ease);
}
.challenge-tab span { display: flex; align-items: center; gap: 12px; }
.challenge-tab i { width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; background: rgba(7,132,209,.08); font-style: normal; }
.challenge-tab:hover, .challenge-tab.active { transform: translateX(6px); color: var(--blue-700); border-color: rgba(7,132,209,.28); background: #fff; box-shadow: var(--shadow-sm); }
.challenge-panel { min-height: 510px; position: relative; padding: 40px; border-radius: var(--radius-lg); overflow: hidden; background: linear-gradient(135deg, #ffffff, #ecfaff); box-shadow: var(--shadow-md); border: 1px solid rgba(255,255,255,.85); }
.challenge-panel::before { content: ""; position: absolute; width: 330px; height: 330px; border-radius: 50%; right: -90px; bottom: -140px; background: radial-gradient(circle, rgba(17,189,229,.22), rgba(17,189,229,.03) 65%); }
.challenge-visual { height: 220px; border-radius: 26px; display: grid; place-items: center; background: radial-gradient(circle at 50% 35%, rgba(255,255,255,.96), rgba(126,232,248,.26) 48%, rgba(7,132,209,.12)); overflow: hidden; position: relative; }
.challenge-visual .mega-icon { font-size: 100px; filter: drop-shadow(0 26px 30px rgba(7,94,181,.18)); animation: iconFloat 4s ease-in-out infinite; }
.challenge-panel h3 { margin: 28px 0 8px; font-size: 31px; line-height: 1.08; letter-spacing: -.03em; }
.challenge-panel p { margin: 0; color: var(--muted); }
.bullet-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px 20px; margin-top: 22px; }
.bullet-grid span { display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 720; }
.bullet-grid span::before { content: "✓"; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--green-500); font-size: 12px; flex: 0 0 auto; }

.lifecycle-shell { position: relative; z-index: 2; }
.lifecycle-track { margin-top: 54px; display: grid; grid-template-columns: repeat(6,1fr); gap: 18px; position: relative; }
.lifecycle-track::before { content: ""; position: absolute; left: 8%; right: 8%; top: 61px; height: 3px; background: linear-gradient(90deg, rgba(126,232,248,.25), var(--aqua-500), var(--green-500)); box-shadow: 0 0 20px rgba(17,189,229,.5); }
.lifecycle-flow { position: absolute; top: 55px; left: 8%; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 0 20px 8px rgba(17,189,229,.45); animation: flowAcross 7s linear infinite; }
.lifecycle-node { position: relative; z-index: 2; text-align: center; }
.lifecycle-icon { width: 122px; height: 122px; margin: 0 auto 18px; border-radius: 50%; display: grid; place-items: center; font-size: 43px; background: linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,.06)); border: 1px solid rgba(255,255,255,.24); box-shadow: inset 0 0 30px rgba(255,255,255,.08), 0 22px 44px rgba(0,0,0,.18); backdrop-filter: blur(10px); transition: .3s var(--ease); }
.lifecycle-node:hover .lifecycle-icon { transform: translateY(-10px) scale(1.04); border-color: rgba(126,232,248,.6); }
.lifecycle-node h4 { margin: 0 0 4px; font-size: 15px; }
.lifecycle-node p { margin: 0; color: rgba(255,255,255,.60); font-size: 12px; }

.card-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.service-card { position: relative; min-height: 290px; padding: 28px; border-radius: var(--radius-md); background: rgba(255,255,255,.82); border: 1px solid rgba(255,255,255,.92); box-shadow: var(--shadow-sm); overflow: hidden; transition: .32s var(--ease); }
.service-card::before { content: ""; position: absolute; width: 140px; height: 140px; right: -48px; top: -54px; border-radius: 50%; background: linear-gradient(135deg, rgba(17,189,229,.24), rgba(7,132,209,.03)); transition: .35s; }
.service-card:hover { transform: translateY(-10px); box-shadow: var(--shadow-md); }
.service-card:hover::before { transform: scale(1.3); }
.card-icon { width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center; font-size: 28px; color: var(--blue-700); background: linear-gradient(135deg, rgba(7,132,209,.11), rgba(17,189,229,.21)); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); }
.service-card h3 { margin: 24px 0 9px; font-size: 21px; letter-spacing: -.02em; }
.service-card p { margin: 0 0 20px; color: var(--muted); font-size: 14px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--blue-700); font-weight: 850; font-size: 13px; }
.text-link::after { content: "→"; transition: .25s; }
.text-link:hover::after { transform: translateX(5px); }

.tech-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.tech-visual { position: relative; min-height: 580px; display: grid; place-items: center; }
.tech-visual::before { content: ""; position: absolute; width: 430px; height: 430px; border-radius: 50%; background: radial-gradient(circle, rgba(17,189,229,.17), rgba(7,132,209,.04) 65%, transparent 66%); }
.tech-visual img { width: min(560px, 100%); position: relative; filter: drop-shadow(0 35px 45px rgba(3,42,90,.18)); animation: cardFloat 6s ease-in-out infinite; }
.tech-pipe { position: absolute; width: 70%; height: 12px; bottom: 86px; border-radius: 10px; background: rgba(7,94,181,.12); overflow: hidden; }
.tech-pipe::after { content: ""; position: absolute; inset: 2px; border-radius: inherit; background: linear-gradient(90deg, transparent, var(--aqua-500), transparent); transform: translateX(-100%); animation: pipeFlow 2.2s linear infinite; }
.accordion { margin-top: 30px; display: grid; gap: 12px; }
.accordion-item { border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.76); overflow: hidden; }
.accordion-button { width: 100%; padding: 18px 20px; border: 0; background: transparent; display: flex; align-items: center; justify-content: space-between; color: var(--ink); font-weight: 860; text-align: left; }
.accordion-button span:last-child { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: rgba(7,132,209,.08); color: var(--blue-700); transition: .25s; }
.accordion-item.open .accordion-button span:last-child { transform: rotate(45deg); }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height .38s ease; }
.accordion-content p { margin: 0; padding: 0 20px 20px; color: var(--muted); font-size: 14px; }

.industry-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.industry-card { min-height: 240px; padding: 24px; border-radius: 24px; position: relative; overflow: hidden; color: #fff; background: linear-gradient(145deg, rgba(3,42,90,.92), rgba(7,132,209,.76)); box-shadow: var(--shadow-sm); transition: .35s var(--ease); isolation: isolate; }
.industry-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 75% 15%, rgba(126,232,248,.38), transparent 35%); z-index: -1; }
.industry-card::after { content: ""; position: absolute; width: 150px; height: 150px; right: -40px; bottom: -55px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; box-shadow: 0 0 0 30px rgba(255,255,255,.03); z-index: -1; transition: .35s; }
.industry-card:hover { transform: translateY(-10px) rotateX(3deg); box-shadow: var(--shadow-md); }
.industry-card:hover::after { transform: scale(1.25); }
.industry-card .card-icon { background: rgba(255,255,255,.14); color: #fff; }
.industry-card h3 { margin: 54px 0 5px; font-size: 22px; }
.industry-card p { margin: 0; color: rgba(255,255,255,.67); font-size: 13px; }

.project-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.project-card { border-radius: 28px; overflow: hidden; background: #fff; box-shadow: var(--shadow-sm); transition: .35s var(--ease); border: 1px solid rgba(7,94,181,.08); }
.project-card:hover { transform: translateY(-9px); box-shadow: var(--shadow-md); }
.project-image { aspect-ratio: 16/10; position: relative; overflow: hidden; background: #e9f8ff; }
.project-image img { width: 100%; height: 100%; object-fit: cover; transition: .6s var(--ease); }
.project-card:hover .project-image img { transform: scale(1.05); }
.project-tag { position: absolute; left: 16px; top: 16px; padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.88); backdrop-filter: blur(10px); color: var(--blue-700); font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.project-body { padding: 24px; }
.project-body h3 { margin: 0 0 8px; font-size: 21px; }
.project-body p { margin: 0; color: var(--muted); font-size: 14px; }
.project-meta { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 14px; color: var(--navy-900); font-size: 12px; font-weight: 850; }
.calc-note { margin-top: 18px; color: var(--muted); font-size: 12px; }

.impact-wrap { display: grid; grid-template-columns: .9fr 1.1fr; gap: 64px; align-items: center; position: relative; z-index: 2; }
.impact-globe { position: relative; min-height: 500px; display: grid; place-items: center; }
.impact-globe img { width: min(500px,100%); filter: drop-shadow(0 36px 60px rgba(0,0,0,.22)); animation: iconFloat 6s ease-in-out infinite; }
.impact-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-top: 34px; }
.stat-card { padding: 24px; border-radius: 20px; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.13); backdrop-filter: blur(12px); }
.stat-number { display: block; color: #fff; font-size: 42px; font-weight: 950; letter-spacing: -.05em; line-height: 1; }
.stat-label { display: block; margin-top: 8px; color: rgba(255,255,255,.65); font-size: 12px; font-weight: 750; }

.calculator-shell { padding: 42px; border-radius: 34px; display: grid; grid-template-columns: 1fr .82fr; gap: 36px; background: #fff; box-shadow: var(--shadow-md); border: 1px solid rgba(255,255,255,.9); }
.form-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.field { display: grid; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label { color: var(--navy-900); font-size: 12px; font-weight: 850; }
.field input, .field select, .field textarea {
  width: 100%; min-height: 52px; padding: 12px 14px; border: 1px solid rgba(7,94,181,.16); border-radius: 14px; outline: 0; color: var(--ink); background: #fafdff; transition: .25s;
}
.field textarea { min-height: 124px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--aqua-500); box-shadow: 0 0 0 4px rgba(17,189,229,.12); background: #fff; }
.result-panel { padding: 30px; border-radius: 26px; color: #fff; background: radial-gradient(circle at 85% 5%, rgba(126,232,248,.30), transparent 30%), linear-gradient(145deg, var(--navy-950), var(--blue-700)); position: relative; overflow: hidden; }
.result-panel::after { content: ""; position: absolute; width: 190px; height: 190px; right: -80px; bottom: -80px; border-radius: 50%; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 0 0 38px rgba(255,255,255,.03); }
.result-panel h3 { margin: 0 0 24px; font-size: 23px; }
.result-row { padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.13); position: relative; z-index: 1; }
.result-row:last-child { border-bottom: 0; }
.result-row small { display: block; color: rgba(255,255,255,.58); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.result-row strong { display: block; margin-top: 4px; font-size: 28px; line-height: 1; }

.cta-band { position: relative; overflow: hidden; padding: 78px 0; color: #fff; background: linear-gradient(135deg, var(--blue-700), var(--aqua-500)); }
.cta-band::before, .cta-band::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(255,255,255,.2); }
.cta-band::before { width: 420px; height: 420px; left: -190px; top: -240px; box-shadow: 0 0 0 50px rgba(255,255,255,.04); }
.cta-band::after { width: 320px; height: 320px; right: -140px; bottom: -200px; box-shadow: 0 0 0 60px rgba(255,255,255,.035); }
.cta-inner { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 32px; }
.cta-inner h2 { margin: 0; max-width: 650px; font-size: clamp(34px, 5vw, 58px); line-height: 1.02; letter-spacing: -.045em; }
.cta-inner p { margin: 14px 0 0; color: rgba(255,255,255,.75); }
.cta-band .btn-secondary { color: var(--navy-900); background: #fff; }

.site-footer { background: #031733; color: #fff; position: relative; overflow: hidden; }
.footer-main { padding: 18px 0 11px; display: grid; grid-template-columns: 1.3fr .7fr .8fr 1fr; gap: 24px; align-items: start; }
.footer-brand img { width: 130px; padding: 6px; border-radius: 16px; background: #fff; }
.footer-brand p { max-width: 330px; margin: 6px 0 0; color: rgba(255,255,255,.60); font-size: 12px; line-height: 1.28; }
.footer-col h4 { margin: 0 0 .5rem; font-size: 13.5px; line-height: 1.2; }
.footer-col a, .footer-col p { display: block; margin: 0 0 .5rem; color: rgba(255,255,255,.62); font-size: 12.5px; line-height: 1.28; }
.footer-col > :last-child { margin-bottom: 0; }
.footer-col a { position: relative; width: fit-content; cursor: pointer; transition: color .24s ease, transform .24s ease, text-shadow .24s ease; }
.footer-col a::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 100%; height: 1px; background: linear-gradient(90deg,var(--aqua-300),rgba(127,244,255,0)); transform: scaleX(0); transform-origin: left center; opacity: .8; transition: transform .24s ease; pointer-events: none; }
.footer-col a:hover, .footer-col a:focus-visible { color: var(--aqua-300); transform: translateX(4px); text-shadow: 0 0 14px rgba(127,244,255,.18); }
.footer-col a:hover::after, .footer-col a:focus-visible::after { transform: scaleX(1); }
.footer-col a:focus-visible { outline: none; }
.footer-bottom { padding: 8px 0 9px; border-top: 1px solid rgba(255,255,255,.09); display: flex; justify-content: space-between; gap: 8px; color: rgba(255,255,255,.45); font-size: 11.5px; line-height: 1.25; }

.page-hero { min-height: 540px; padding-top: 118px; display: grid; align-items: center; position: relative; overflow: hidden; background: radial-gradient(circle at 75% 20%, rgba(17,189,229,.2), transparent 30%), linear-gradient(145deg, #f9fdff, #eaf8ff); }
.page-hero::after { content: ""; position: absolute; width: 600px; height: 600px; right: -220px; bottom: -330px; border-radius: 50%; border: 1px solid rgba(7,132,209,.14); box-shadow: 0 0 0 55px rgba(7,132,209,.035), 0 0 0 110px rgba(7,132,209,.025); }
.page-hero-grid { display: grid; grid-template-columns: 1fr .78fr; gap: 48px; align-items: center; position: relative; z-index: 2; }
.page-hero h1 { margin: 14px 0 18px; font-size: clamp(48px, 7vw, 82px); line-height: .96; letter-spacing: -.055em; }
.page-hero p { max-width: 650px; color: var(--muted); font-size: 18px; }
.page-hero-art { min-height: 360px; display: grid; place-items: center; }
.page-hero-art img { max-height: 360px; filter: drop-shadow(0 32px 50px rgba(3,42,90,.2)); animation: iconFloat 5s ease-in-out infinite; }
.content-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 24px; }
.info-card { padding: 30px; border-radius: 24px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.info-card h3 { margin: 18px 0 8px; }
.info-card p { margin: 0; color: var(--muted); }
.process-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; counter-reset: process; }
.process-card { padding: 28px; border-radius: 24px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); position: relative; }
.process-card::before { counter-increment: process; content: "0" counter(process); display: block; color: rgba(7,132,209,.24); font-size: 40px; font-weight: 950; line-height: 1; }
.process-card h3 { margin: 22px 0 8px; }
.process-card p { margin: 0; color: var(--muted); font-size: 14px; }
.team-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.value-card { padding: 30px; border-radius: 24px; background: linear-gradient(145deg, #fff, #f2fbff); border: 1px solid var(--line); }
.value-card h3 { margin: 18px 0 8px; }
.value-card p { margin: 0; color: var(--muted); }
.contact-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 50px; align-items: start; }
.contact-card { padding: 30px; border-radius: 26px; background: linear-gradient(145deg, var(--navy-950), var(--blue-700)); color: #fff; box-shadow: var(--shadow-md); }
.contact-card h3 { font-size: 28px; margin: 0 0 18px; }
.contact-line { display: flex; gap: 14px; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.contact-line:last-child { border-bottom: 0; }
.contact-line .card-icon { width: 44px; height: 44px; font-size: 20px; flex: 0 0 auto; background: rgba(255,255,255,.12); color: #fff; }
.contact-line strong, .contact-line span { display: block; }
.contact-line span { color: rgba(255,255,255,.62); font-size: 13px; }
.contact-form { padding: 34px; border-radius: 28px; background: #fff; box-shadow: var(--shadow-md); }
.notice { padding: 14px 16px; border-radius: 14px; color: #07563e; background: #e8fff5; border: 1px solid #b7efd8; font-size: 13px; display: none; }
.notice.show { display: block; }

.reveal { opacity: 0; transform: translateY(30px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal-delay-1 { transition-delay: .08s; }
.reveal-delay-2 { transition-delay: .16s; }
.reveal-delay-3 { transition-delay: .24s; }

.floating-actions { position: fixed; left: 18px; bottom: 22px; z-index: 80; display: grid; gap: 10px; }
.float-action { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--blue-700), var(--aqua-500)); box-shadow: 0 14px 30px rgba(7,94,181,.28); transition: .25s; }
.float-action:hover { transform: translateY(-3px) scale(1.04); }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 200; padding: 14px 18px; border-radius: 14px; color: #fff; background: var(--navy-950); box-shadow: var(--shadow-md); transform: translateY(100px); opacity: 0; transition: .35s; }
.toast.show { transform: translateY(0); opacity: 1; }

@keyframes orbitSpin { to { transform: rotate(360deg); } }
@keyframes dropFloat { 0%,100% { transform: translate(-50%,-50%) rotate(45deg) translateY(0) rotateY(0deg); } 50% { transform: translate(-50%,-50%) rotate(45deg) translateY(-16px) rotateY(10deg); } }
@keyframes ripplePulse { 0% { transform: translateX(-50%) rotateX(70deg) scale(.45); opacity: .7; } 100% { transform: translateX(-50%) rotateX(70deg) scale(1.9); opacity: 0; } }
@keyframes cardFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes iconFloat { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-12px) rotate(2deg); } }
@keyframes flowAcross { 0% { left: 8%; } 100% { left: 90%; } }
@keyframes pipeFlow { to { transform: translateX(100%); } }
@keyframes scrollDot { 0% { opacity: 0; transform: translate(-50%,0); } 35% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%,14px); } }

@media (max-width: 1050px) {
  .nav-links { position: fixed; inset: 84px 18px auto 18px; padding: 16px; border-radius: 24px; background: rgba(255,255,255,.96); backdrop-filter: blur(20px); box-shadow: var(--shadow-md); display: grid; gap: 4px; transform: translateY(-18px); opacity: 0; pointer-events: none; transition: .3s; }
  .nav-links.open { transform: none; opacity: 1; pointer-events: auto; }
  .nav-links a { padding: 13px 15px; }
  .nav-toggle { display: grid; }
  .header-actions .btn { display: none; }
  .hero-grid { grid-template-columns: 1fr; padding-top: 126px; text-align: center; }
  .hero-copy { margin-inline: auto; }
  .hero-copy > p { margin-inline: auto; }
  .hero-actions, .hero-proof { justify-content: center; }
  .hero-visual { min-height: 540px; }
  .challenge-layout, .tech-layout, .impact-wrap, .calculator-shell, .contact-layout, .page-hero-grid { grid-template-columns: 1fr; }
  .card-grid, .project-grid, .team-grid { grid-template-columns: repeat(2,1fr); }
  .industry-grid, .process-grid { grid-template-columns: repeat(2,1fr); }
  .lifecycle-track { grid-template-columns: repeat(3,1fr); row-gap: 34px; }
  .lifecycle-track::before, .lifecycle-flow { display: none; }
  .footer-main { grid-template-columns: repeat(2,1fr); }
  .page-hero-art { order: -1; min-height: 250px; }
  .page-hero-art img { max-height: 250px; }
}

@media (max-width: 720px) {
  :root { --content: min(100% - 28px, 1180px); }
  .section { padding: 82px 0; }
  .section-sm { padding: 66px 0; }
  .nav-shell { height: 74px; }
  .brand img { width: 96px; height: 60px; }
  .nav-links { top: 74px; }
  .hero-grid { padding-top: 104px; padding-bottom: 54px; }
  .hero h1 { font-size: clamp(45px, 16vw, 68px); }
  .hero-visual { min-height: 470px; transform: scale(.84); margin: -35px -50px; }
  .float-card.c1 { left: 14px; }
  .float-card.c2 { right: 12px; }
  .trust-grid { grid-template-columns: repeat(2,1fr); }
  .trust-item { border-bottom: 1px solid var(--line); }
  .section-head, .cta-inner { align-items: flex-start; flex-direction: column; }
  .challenge-panel, .calculator-shell { padding: 24px; }
  .bullet-grid, .form-grid, .impact-stats, .content-grid { grid-template-columns: 1fr; }
  .card-grid, .project-grid, .industry-grid, .process-grid, .team-grid { grid-template-columns: 1fr; }
  .lifecycle-track { grid-template-columns: repeat(2,1fr); }
  .lifecycle-icon { width: 100px; height: 100px; }
  .tech-visual { min-height: 410px; }
  .footer-main { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; }
  .floating-actions { left: 12px; bottom: 12px; }
  .page-hero { min-height: 630px; padding-top: 100px; }
  .page-hero h1 { font-size: clamp(46px, 15vw, 66px); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1; transform: none; }
}

@media (max-width: 720px) {
  .hero-visual { overflow: hidden; min-width: 0; }
}

@media (max-width: 720px) {
  .hero-visual { transform: none; margin: -20px 0 -34px; width: 100%; }
  .drop-stage { scale: .80; }
  .orbit.one { width: 420px; height: 420px; }
  .orbit.two { width: 340px; height: 340px; }
  .float-card { scale: .82; }
}

@media (max-width: 720px) {
  .orbit.one { width: 360px; height: 360px; }
  .orbit.two { width: 294px; height: 294px; }
  .water-surface { width: 420px; }
}

.water-drop-svg {
  position: absolute; width: 300px; height: 420px; left: 50%; top: 42%;
  transform: translate(-50%, -50%); filter: drop-shadow(0 38px 44px rgba(5,94,181,.35));
  animation: dropFloatSvg 5.5s ease-in-out infinite; overflow: visible;
}
.water-drop-svg .drop-liquid { transform-origin: center; animation: liquidDrift 4.8s ease-in-out infinite; }
@keyframes dropFloatSvg { 0%,100% { transform: translate(-50%,-50%) translateY(0) rotateY(0deg); } 50% { transform: translate(-50%,-50%) translateY(-16px) rotateY(8deg); } }
@keyframes liquidDrift { 0%,100% { transform: translateX(-2px) translateY(1px); } 50% { transform: translateX(4px) translateY(-4px); } }
@media (max-width: 720px) { .water-drop-svg { width: 270px; height: 378px; } }


/* Source: premium-v2.css */
/* Nexaqua Premium Motion System v2
   Layered on top of the base design so every existing page remains functional. */

:root {
  --electric-aqua: #45e9ff;
  --deep-water: #02142e;
  --glass-line: rgba(155, 238, 255, .20);
  --glass-fill: rgba(6, 39, 77, .48);
  --premium-ease: cubic-bezier(.16, 1, .3, 1);
}

body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.ui-icon,
.metric-icon svg,
.challenge-svg,
.lifecycle-svg,
.float-action svg {
  width: 1em;
  height: 1em;
  display: block;
  fill: none;
  overflow: visible;
}

/* ---------- Cinematic intro ---------- */
.aqua-intro {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 48%, rgba(15, 164, 219, .28), transparent 26%),
    radial-gradient(circle at 50% 120%, rgba(24, 208, 239, .20), transparent 43%),
    linear-gradient(145deg, #010b1b, #032d5b 60%, #064f78);
  transition: opacity .8s var(--premium-ease), visibility .8s;
}
.aqua-intro::before {
  content: "";
  position: absolute;
  inset: -30%;
  background:
    repeating-radial-gradient(ellipse at 50% 70%, transparent 0 20px, rgba(102, 231, 255, .045) 21px 22px, transparent 23px 46px);
  animation: introCaustics 7s linear infinite;
}
.aqua-intro.is-finished {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.intro-skip {
  position: absolute;
  right: 24px;
  top: 24px;
  z-index: 2;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  padding: 8px 14px;
  color: rgba(255,255,255,.65);
  background: rgba(255,255,255,.05);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.intro-core {
  position: relative;
  width: min(420px, 84vw);
  height: 420px;
  display: grid;
  place-items: center;
}

.intro-core img {
  position: relative;
  z-index: 3;
  width: 210px;
  margin-top: 65px;
  opacity: 0;
  filter: drop-shadow(0 20px 38px rgba(0, 17, 41, .35));
  animation: introLogo 1.25s .55s var(--premium-ease) forwards;
}

.intro-core p {
  position: absolute;
  bottom: 28px;
  margin: 0;
  color: rgba(255,255,255,.66);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
  opacity: 0;
  animation: introLogo 1s .9s ease forwards;
}

.intro-drop {
  position: absolute;
  top: 54px;
  left: 50%;
  width: 74px;
  height: 96px;
  transform: translateX(-50%);
  filter: drop-shadow(0 0 34px rgba(73, 232, 255, .72));
  animation: introDrop 1.22s var(--premium-ease) forwards;
}

.intro-drop span {
  position: absolute;
  inset: 0;
  border-radius: 74% 26% 68% 32% / 75% 28% 72% 25%;
  transform: rotate(45deg);
  background:
    radial-gradient(circle at 28% 25%, #fff 0 5%, rgba(255,255,255,.42) 6% 13%, transparent 14%),
    linear-gradient(135deg, rgba(198,250,255,.94), #22cbe8 48%, #0862bd 82%);
  box-shadow: inset -12px -16px 26px rgba(0,33,86,.42), inset 9px 9px 18px rgba(255,255,255,.55);
}

.intro-rings {
  position: absolute;
  left: 50%;
  top: 248px;
  width: 280px;
  height: 80px;
  transform: translateX(-50%) rotateX(65deg);
}

.intro-rings i {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 80px;
  height: 80px;
  border: 2px solid rgba(111, 233, 255, .64);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.2);
  animation: introRipple 1.7s .7s ease-out forwards;
}

.intro-rings i:nth-child(2) { animation-delay: .88s; }
.intro-rings i:nth-child(3) { animation-delay: 1.06s; }

/* ---------- Home hero ---------- */
.home-page .hero {
  min-height: max(820px, 100svh);
  color: #fff;
  isolation: isolate;
  background:
    radial-gradient(circle at 77% 45%, rgba(24, 204, 239, .18), transparent 24%),
    radial-gradient(circle at 8% 10%, rgba(14, 110, 196, .28), transparent 30%),
    linear-gradient(126deg, #010c20 0%, #042858 48%, #055b80 100%);
}

.home-page .hero::before {
  inset: 0;
  height: auto;
  z-index: -2;
  filter: none;
  background:
    linear-gradient(rgba(91, 215, 248, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(91, 215, 248, .04) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to right, #000, transparent 84%);
  animation: blueprintDrift 18s linear infinite;
}

.home-page .hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -30%;
  opacity: .6;
  background:
    repeating-radial-gradient(ellipse at 72% 54%, transparent 0 24px, rgba(118, 235, 255, .035) 25px 26px, transparent 27px 54px);
  animation: causticDrift 20s linear infinite;
}

.home-page #water-canvas {
  opacity: .55;
  mix-blend-mode: screen;
}

.home-page .hero-grid {
  grid-template-columns: minmax(0, .92fr) minmax(520px, 1.08fr);
  gap: 22px;
  padding-top: 116px;
  padding-bottom: 92px;
}

.home-page .hero-copy {
  position: relative;
  z-index: 8;
}

.home-page .eyebrow {
  color: #a8f2ff;
  border-color: rgba(153, 237, 255, .22);
  background: rgba(8, 42, 82, .38);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 14px 42px rgba(0,11,30,.18);
  backdrop-filter: blur(16px);
}

.home-page .eyebrow-dot {
  background: #6cf5a0;
  box-shadow: 0 0 0 5px rgba(108,245,160,.11), 0 0 20px rgba(108,245,160,.6);
}

.home-page .hero h1 {
  max-width: 780px;
  color: #fff;
  font-size: clamp(60px, 6.6vw, 105px);
  line-height: .91;
  letter-spacing: -.072em;
  text-wrap: balance;
  text-shadow: 0 22px 60px rgba(0, 9, 30, .32);
}

.home-page .hero h1 .accent {
  background: linear-gradient(90deg, #fff 0%, #7aeaff 36%, #24cae9 75%, #7df4ba 115%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 8px 26px rgba(29, 205, 235, .18));
}

.home-page .hero-copy > p {
  max-width: 615px;
  color: rgba(226, 247, 255, .70);
  font-size: clamp(16px, 1.7vw, 19px);
}

.home-page .btn-primary {
  color: #00254d;
  background: linear-gradient(135deg, #ddfbff, #43e4f9 58%, #79f1be);
  box-shadow: 0 18px 44px rgba(16, 202, 233, .24), inset 0 1px 0 rgba(255,255,255,.8);
}

.home-page .btn-secondary {
  color: #eafaff;
  border-color: rgba(145, 231, 250, .24);
  background: rgba(5, 31, 68, .42);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 16px 40px rgba(0, 8, 24, .16);
  backdrop-filter: blur(16px);
}

.home-page .hero-proof {
  color: rgba(221, 246, 255, .62);
}

.home-page .hero-proof i {
  border-color: #5ce7fb;
  box-shadow: 0 0 0 5px rgba(92,231,251,.09), 0 0 16px rgba(92,231,251,.35);
}

.hero-live-status {
  display: inline-grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 0 10px;
  margin-top: 26px;
  color: rgba(234, 250, 255, .86);
  font-size: 11px;
  letter-spacing: .02em;
}

.hero-live-status small {
  grid-column: 2;
  color: rgba(214, 242, 250, .45);
}

.pulse-dot {
  grid-row: 1 / 3;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #66f0a1;
  box-shadow: 0 0 0 0 rgba(102,240,161,.55);
  animation: statusPulse 2.2s infinite;
}

/* Dark navigation before scroll, crisp glass navigation after scroll. */
.home-page .site-header:not(.scrolled) .nav-links a { color: rgba(232, 249, 255, .70); }
.home-page .site-header:not(.scrolled) .nav-links a:hover,
.home-page .site-header:not(.scrolled) .nav-links a.active {
  color: #fff;
  background: rgba(255,255,255,.08);
}
.home-page .site-header:not(.scrolled) .brand {
  padding: 3px 12px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 16px 42px rgba(0,8,25,.18);
}
.home-page .site-header:not(.scrolled) .nav-toggle {
  color: #fff;
  background: rgba(255,255,255,.09);
}

/* ---------- Real-time water scene ---------- */
.hero-visual {
  min-height: 690px;
  perspective: 1500px;
}

.water-scene {
  position: relative;
  width: min(680px, 100%);
  aspect-ratio: 1 / 1.04;
  margin-inline: auto;
  overflow: visible;
  transform-style: preserve-3d;
  isolation: isolate;
}

#water-webgl {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  pointer-events: none;
  filter: saturate(1.12) contrast(1.04) drop-shadow(0 48px 60px rgba(0, 12, 40, .30));
}

.scene-blueprint {
  position: absolute;
  z-index: 0;
  inset: 10%;
  border-radius: 50%;
  opacity: .38;
  background:
    linear-gradient(rgba(123,231,252,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(123,231,252,.08) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: radial-gradient(circle, #000 0 52%, transparent 73%);
  animation: blueprintOrbit 18s linear infinite;
}

.scene-aura {
  position: absolute;
  z-index: 1;
  inset: 12% 11% 8%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(35,214,245,.20), rgba(11,87,162,.10) 42%, transparent 70%);
  filter: blur(18px);
  animation: auraBreathe 5s ease-in-out infinite;
}

.scene-orbit {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(132, 235, 255, .20);
  border-radius: 50%;
  transform-style: preserve-3d;
  pointer-events: none;
}

.scene-orbit::before {
  content: "";
  position: absolute;
  inset: 8%;
  border: 1px dashed rgba(129,230,249,.13);
  border-radius: inherit;
}

.scene-orbit i {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #7ff3ff;
  box-shadow: 0 0 18px 5px rgba(51,216,244,.42);
}

.orbit-a {
  width: 82%;
  height: 82%;
  transform: translate(-50%,-50%) rotateX(68deg) rotateZ(8deg);
  animation: orbitA 15s linear infinite;
}
.orbit-a i:first-child { left: 8%; top: 26%; }
.orbit-a i:last-child { right: 10%; bottom: 21%; width: 6px; height: 6px; background: #78efaa; }

.orbit-b {
  width: 61%;
  height: 61%;
  transform: translate(-50%,-50%) rotateY(66deg) rotateZ(-12deg);
  animation: orbitB 11s linear infinite reverse;
}
.orbit-b i { right: 9%; top: 30%; width: 7px; height: 7px; }

.water-scene-logo {
  position: absolute;
  z-index: 6;
  left: 50%;
  top: 53%;
  width: 31%;
  transform: translate(-50%, -50%) translateZ(60px);
  pointer-events: none;
  opacity: 0;
  filter: drop-shadow(0 13px 22px rgba(0,24,70,.35));
  animation: sceneLogoIn 1.2s 1.4s var(--premium-ease) forwards, logoFloat 4.4s 2.7s ease-in-out infinite;
}

.water-scene-logo img { width: 100%; }

.scene-metric {
  position: absolute;
  z-index: 8;
  min-width: 205px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 15px;
  border: 1px solid var(--glass-line);
  border-radius: 19px;
  color: #fff;
  background: linear-gradient(135deg, rgba(9,48,91,.67), rgba(4,31,68,.42));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 20px 55px rgba(0,11,31,.25);
  backdrop-filter: blur(18px) saturate(140%);
  transform-style: preserve-3d;
  animation: metricFloat 5s ease-in-out infinite;
}

.scene-metric::after {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(120deg, transparent 25%, rgba(147,241,255,.18), transparent 75%);
  background-size: 220% 100%;
  animation: glassShimmer 6s linear infinite;
}

.metric-a { left: -3%; top: 25%; }
.metric-b { right: -4%; top: 48%; animation-delay: -1.6s; }
.metric-c { left: 5%; bottom: 12%; animation-delay: -3.1s; }

.metric-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #74efff;
  background: linear-gradient(145deg, rgba(92,230,250,.17), rgba(82,207,235,.05));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14);
  font-size: 22px;
}

.scene-metric b,
.scene-metric small { display: block; }
.scene-metric b { font-size: 12px; letter-spacing: .01em; }
.scene-metric small { margin-top: 2px; color: rgba(216,245,252,.52); font-size: 9px; letter-spacing: .05em; text-transform: uppercase; }

.scene-caption {
  position: absolute;
  z-index: 8;
  right: 8%;
  bottom: 7%;
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(213,245,252,.52);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.scene-caption span { width: 26px; height: 1px; background: #61e6f9; box-shadow: 0 0 10px rgba(97,230,249,.7); }

.water-fallback { display: none; position: absolute; inset: 0; }
.webgl-fallback #water-webgl,
.webgl-fallback .water-scene-logo { display: none; }
.webgl-fallback .water-fallback { display: block; }
.fallback-drop {
  position: absolute;
  left: 50%; top: 44%;
  width: 250px; height: 330px;
  transform: translate(-50%,-50%) rotate(45deg);
  border-radius: 72% 28% 68% 32% / 72% 28% 72% 28%;
  background: radial-gradient(circle at 25% 24%, #fff, transparent 13%), linear-gradient(135deg,#d7fbff,#21cce9 50%,#075cb2);
  box-shadow: inset -25px -32px 55px rgba(0,31,87,.4), 0 45px 90px rgba(0,15,52,.4);
  animation: fallbackFloat 5s ease-in-out infinite;
}
.fallback-ripple {
  position: absolute;
  left: 50%; bottom: 13%;
  width: 390px; height: 95px;
  transform: translateX(-50%) rotateX(68deg);
  border: 2px solid rgba(78,226,249,.55);
  border-radius: 50%;
  animation: ripplePulse 3s ease-out infinite;
}

.hero-waterline {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  bottom: -24px;
  height: 118px;
  overflow: hidden;
  pointer-events: none;
  opacity: .85;
}

.hero-waterline span {
  position: absolute;
  left: -10%;
  width: 120%;
  height: 92px;
  border-radius: 48% 52% 0 0 / 70% 70% 0 0;
  background: rgba(21, 182, 225, .10);
  filter: drop-shadow(0 -12px 22px rgba(40, 219, 246, .08));
  animation: waterlineMove 9s ease-in-out infinite alternate;
}
.hero-waterline span:nth-child(1) { bottom: -52px; }
.hero-waterline span:nth-child(2) { bottom: -61px; opacity: .62; animation-delay: -3s; animation-duration: 12s; }
.hero-waterline span:nth-child(3) { bottom: -69px; opacity: .38; animation-delay: -6s; animation-duration: 15s; }

.scroll-progress {
  position: absolute;
  z-index: 12;
  right: 23px;
  top: 32%;
  width: 2px;
  height: 170px;
  overflow: hidden;
  border-radius: 3px;
  background: rgba(255,255,255,.11);
}
.scroll-progress i {
  display: block;
  width: 100%;
  height: calc(var(--hero-scroll, 0) * 100%);
  background: linear-gradient(#83f2ff,#6cf4a9);
  box-shadow: 0 0 12px rgba(82,234,251,.55);
}

.home-page .scroll-cue { color: rgba(216,245,252,.42); }
.home-page .scroll-mouse { border-color: rgba(155,235,251,.28); }
.home-page .scroll-mouse::after { background: #68e9fa; }

/* ---------- Premium motion language across the rest of the site ---------- */
.site-header.scrolled {
  background: rgba(250, 254, 255, .82);
  backdrop-filter: blur(22px) saturate(170%);
}

.section {
  overflow: clip;
}

.section-tint::before {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -310px;
  top: -220px;
  border-radius: 50%;
  border: 1px solid rgba(17,189,229,.08);
  box-shadow: 0 0 0 70px rgba(17,189,229,.025), 0 0 0 140px rgba(17,189,229,.018);
  pointer-events: none;
}

.section-kicker::before {
  box-shadow: 0 0 12px rgba(17,189,229,.40);
}

.trust-strip {
  background: rgba(255,255,255,.91);
  backdrop-filter: blur(18px);
}
.trust-icon .ui-icon { font-size: 23px; }
.trust-item { transition: transform .35s var(--premium-ease), background .35s; }
.trust-item:hover { transform: translateY(-4px); background: rgba(240,251,255,.72); }

.challenge-tab i { color: var(--blue-700); font-size: 19px; }
.challenge-tab.active i {
  color: #fff;
  background: linear-gradient(135deg,var(--blue-700),var(--aqua-500));
  box-shadow: 0 10px 24px rgba(7,132,209,.24);
}

.challenge-panel {
  transform-style: preserve-3d;
  background:
    radial-gradient(circle at 72% 12%, rgba(69,229,251,.22), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(230,248,255,.88));
  box-shadow: 0 34px 90px rgba(2,42,88,.15), inset 0 1px 0 #fff;
}
.challenge-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.55), transparent 55%);
  transform: translateX(-120%);
  animation: panelSweep 8s ease-in-out infinite;
}

.challenge-visual {
  isolation: isolate;
  background:
    linear-gradient(rgba(7,132,209,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7,132,209,.05) 1px, transparent 1px),
    radial-gradient(circle at 50% 38%, #fff, rgba(101,225,246,.24) 50%, rgba(6,101,182,.10));
  background-size: 26px 26px, 26px 26px, auto;
}
.challenge-visual::after {
  content: "";
  position: absolute;
  left: 20%; right: 20%; bottom: 15%;
  height: 32px;
  border-radius: 50%;
  border: 2px solid rgba(12,145,205,.24);
  transform: rotateX(70deg);
  animation: symbolRipple 2.8s ease-out infinite;
}

.challenge-symbol {
  position: relative;
  width: 138px;
  height: 138px;
  display: grid;
  place-items: center;
  color: #0784d1;
  font-size: 96px;
  filter: drop-shadow(0 28px 30px rgba(7,94,181,.18));
  animation: symbolFloat 4.3s ease-in-out infinite;
}
.challenge-symbol .challenge-svg { position: relative; z-index: 2; width: 1em; height: 1em; }
.symbol-ring {
  position: absolute;
  inset: 4%;
  border: 1px solid rgba(7,132,209,.22);
  border-radius: 50%;
  animation: symbolOrbit 7s linear infinite;
}
.symbol-ring.r2 { inset: -12%; border-style: dashed; animation-direction: reverse; animation-duration: 10s; }
.symbol-particle {
  position: absolute;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #26cae8;
  box-shadow: 0 0 14px rgba(38,202,232,.55);
}
.symbol-particle.p1 { left: 3%; top: 32%; animation: particleBob 3s ease-in-out infinite; }
.symbol-particle.p2 { right: 0; bottom: 27%; width: 6px; height: 6px; background: #56c36b; animation: particleBob 3.8s -1.4s ease-in-out infinite; }

.section-dark {
  background:
    radial-gradient(circle at 12% -10%, rgba(25,213,240,.24), transparent 32%),
    radial-gradient(circle at 86% 100%, rgba(35,135,208,.23), transparent 32%),
    linear-gradient(135deg, #01162f, #044c78 70%, #076181);
}
.section-dark::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .45;
  background: repeating-radial-gradient(ellipse at 50% 120%, transparent 0 26px, rgba(124,231,249,.035) 27px 28px, transparent 29px 58px);
  animation: lifecycleWater 15s linear infinite;
}

.lifecycle-track::before {
  height: 4px;
  background: linear-gradient(90deg,rgba(126,232,248,.16),#5fe7f6 40%,#5ceba1);
}
.lifecycle-flow {
  width: 20px;
  height: 20px;
  top: 53px;
  background: radial-gradient(circle at 35% 30%,#fff,#55e8fa 45%,#0b84d0);
  box-shadow: 0 0 24px 10px rgba(55,218,242,.38);
}
.lifecycle-icon {
  position: relative;
  overflow: hidden;
  font-size: 48px;
  color: #89effc;
  transform-style: preserve-3d;
}
.lifecycle-icon::before {
  content: "";
  position: absolute;
  inset: -60% 15% 30%;
  border-radius: 50%;
  background: rgba(255,255,255,.14);
  transform: rotate(22deg);
  animation: iconGlass 6s ease-in-out infinite;
}
.lifecycle-svg { position: relative; z-index: 2; }
.node-glow {
  position: absolute;
  inset: 15%;
  border-radius: 50%;
  background: rgba(45,218,243,.17);
  filter: blur(12px);
  animation: nodeGlow 3.2s ease-in-out infinite;
}

.service-card,
.project-card,
.industry-card,
.stat-card,
.result-panel {
  transform-style: preserve-3d;
  will-change: transform;
}

.service-card {
  border-color: rgba(126,225,243,.24);
  background: linear-gradient(145deg,rgba(255,255,255,.96),rgba(238,250,255,.86));
  box-shadow: 0 18px 50px rgba(3,42,90,.09), inset 0 1px 0 #fff;
}
.service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(circle at var(--spot-x,70%) var(--spot-y,20%),rgba(93,229,250,.22),transparent 34%);
  opacity: 0;
  transition: opacity .35s;
}
.service-card:hover::after { opacity: 1; }
.service-card .card-icon { color: var(--blue-700); font-size: 29px; }

.tech-pipe::after {
  box-shadow: 0 0 14px rgba(26,203,231,.55);
}

.project-card,
.industry-card,
.info-card,
.process-card,
.value-card,
.contact-form {
  transition: transform .45s var(--premium-ease), box-shadow .45s var(--premium-ease), border-color .35s;
}
.project-card:hover,
.industry-card:hover,
.info-card:hover,
.process-card:hover,
.value-card:hover {
  transform: translateY(-9px);
  border-color: rgba(17,189,229,.28);
  box-shadow: 0 26px 70px rgba(3,42,90,.15);
}

.cta-band {
  background:
    radial-gradient(circle at 80% 20%,rgba(134,246,255,.34),transparent 24%),
    linear-gradient(125deg,#075eb5,#0eb8dc 62%,#42c873);
}
.cta-band::before { animation: ctaOrbit 12s linear infinite; }
.cta-band::after { animation: ctaOrbit 16s linear infinite reverse; }

.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .36;
  background:
    linear-gradient(rgba(7,132,209,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7,132,209,.045) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to right,transparent,#000);
  animation: blueprintDrift 22s linear infinite;
}
.page-hero-art { perspective: 1100px; }
.page-hero-art img {
  transform-style: preserve-3d;
  animation: pageArtFloat 6s ease-in-out infinite;
}

/* Faster, more dimensional entrance choreography. */
.reveal {
  opacity: 0;
  transform: translate3d(0,42px,0) scale(.985);
  filter: blur(5px);
  transition:
    opacity .9s var(--premium-ease),
    transform .9s var(--premium-ease),
    filter .8s var(--premium-ease);
}
.reveal.is-visible {
  opacity: 1;
  transform: translate3d(0,0,0) scale(1);
  filter: blur(0);
}

/* ---------- Keyframes ---------- */
@keyframes introCaustics { to { transform: translate3d(4%, -3%, 0) rotate(7deg); } }
@keyframes introDrop {
  0% { transform: translate(-50%,-150px) scale(.55); opacity: 0; }
  62% { transform: translate(-50%,125px) scale(1); opacity: 1; }
  76% { transform: translate(-50%,110px) scaleY(.76) scaleX(1.18); }
  100% { transform: translate(-50%,120px) scale(.1); opacity: 0; }
}
@keyframes introRipple {
  0% { opacity: .75; transform: translate(-50%,-50%) scale(.15); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(3.5); }
}
@keyframes introLogo { to { opacity: 1; transform: translateY(-4px); } }
@keyframes blueprintDrift { to { background-position: 64px 64px, 64px 64px; } }
@keyframes causticDrift { to { transform: rotate(12deg) translate3d(3%,-4%,0); } }
@keyframes statusPulse { 70% { box-shadow: 0 0 0 10px rgba(102,240,161,0); } 100% { box-shadow: 0 0 0 0 rgba(102,240,161,0); } }
@keyframes blueprintOrbit { to { transform: rotate(360deg) scale(1.03); } }
@keyframes auraBreathe { 50% { transform: scale(1.08); opacity: .72; } }
@keyframes orbitA { to { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(368deg); } }
@keyframes orbitB { to { transform: translate(-50%,-50%) rotateY(66deg) rotateZ(348deg); } }
@keyframes sceneLogoIn { from { opacity: 0; transform: translate(-50%,-42%) scale(.78) translateZ(20px); } to { opacity: .92; transform: translate(-50%,-50%) scale(1) translateZ(60px); } }
@keyframes logoFloat { 50% { transform: translate(-50%,-54%) translateZ(60px) rotateY(3deg); } }
@keyframes metricFloat { 50% { translate: 0 -10px; } }
@keyframes glassShimmer { to { background-position: -120% 0; } }
@keyframes fallbackFloat { 50% { transform: translate(-50%,-55%) rotate(45deg) rotateY(9deg); } }
@keyframes waterlineMove { to { transform: translateX(3%) skewX(-2deg); } }
@keyframes panelSweep { 0%,65% { transform: translateX(-120%); } 85%,100% { transform: translateX(120%); } }
@keyframes symbolFloat { 50% { transform: translateY(-11px) rotateY(8deg); } }
@keyframes symbolOrbit { to { transform: rotate(360deg); } }
@keyframes symbolRipple { from { opacity: .7; transform: rotateX(70deg) scale(.55); } to { opacity: 0; transform: rotateX(70deg) scale(1.6); } }
@keyframes particleBob { 50% { transform: translateY(-14px); } }
@keyframes lifecycleWater { to { transform: translateY(-58px); } }
@keyframes iconGlass { 50% { transform: translateY(130%) rotate(22deg); } }
@keyframes nodeGlow { 50% { transform: scale(1.25); opacity: .5; } }
@keyframes ctaOrbit { to { transform: rotate(360deg); } }
@keyframes pageArtFloat { 50% { transform: translateY(-15px) rotateY(-4deg) rotateX(2deg); } }

/* ---------- Responsive and motion safety ---------- */
@media (max-width: 1180px) {
  .home-page .hero-grid { grid-template-columns: minmax(0,.9fr) minmax(480px,1.1fr); }
  .scene-metric { min-width: 190px; }
  .metric-a { left: 0; }
  .metric-b { right: 0; }
}

@media (max-width: 1050px) {
  .home-page .hero-grid { grid-template-columns: 1fr; }
  .home-page .hero-copy { text-align: center; margin-inline: auto; }
  .hero-live-status { text-align: left; }
  .hero-visual { min-height: 640px; }
  .water-scene { width: min(660px,100%); }
  .home-page .site-header:not(.scrolled) .nav-links {
    background: rgba(3,24,54,.94);
    border: 1px solid rgba(132,230,249,.18);
  }
}

@media (max-width: 720px) {
  .aqua-intro .intro-skip { display: none; }
  .home-page .hero { min-height: 1040px; }
  .home-page .hero-grid { padding-top: 108px; padding-bottom: 80px; }
  .home-page .hero h1 { font-size: clamp(48px,15.5vw,69px); }
  .home-page .hero-copy > p { font-size: 15px; }
  .hero-visual { min-height: 510px; margin-top: 8px; }
  .water-scene { width: min(540px,128vw); margin-left: 50%; transform: translateX(-50%); }
  .scene-metric { min-width: 166px; padding: 10px 11px; border-radius: 16px; }
  .metric-icon { width: 34px; height: 34px; font-size: 18px; border-radius: 11px; }
  .scene-metric b { font-size: 10px; }
  .scene-metric small { font-size: 7px; }
  .metric-a { left: 9%; top: 22%; }
  .metric-b { right: 8%; top: 52%; }
  .metric-c { left: 13%; bottom: 8%; }
  .water-scene-logo { width: 29%; }
  .scene-caption { display: none; }
  .scroll-progress { display: none; }
  .home-page .scroll-cue { bottom: 15px; }
  .challenge-symbol { width: 116px; height: 116px; font-size: 78px; }
}

@media (max-width: 480px) {
  .hero-visual { min-height: 450px; }
  .water-scene { width: 138vw; }
  .metric-a { left: 17%; }
  .metric-b { right: 15%; }
  .metric-c { left: 20%; }
  .scene-metric { min-width: 150px; }
  .scene-orbit { opacity: .7; }
}

@media (prefers-reduced-motion: reduce) {
  .aqua-intro { display: none; }
  .scene-orbit,
  .scene-blueprint,
  .scene-aura,
  .scene-metric,
  .water-scene-logo,
  .hero-waterline span,
  .challenge-symbol,
  .symbol-ring,
  .lifecycle-icon::before,
  .section-dark::before { animation: none !important; }
  .water-scene-logo { opacity: .92; }
  .reveal { filter: none; }
}

.lifecycle-node.is-current .lifecycle-icon {
  transform: translateY(-10px) scale(1.06);
  color: #fff;
  border-color: rgba(126,239,252,.68);
  box-shadow: inset 0 0 34px rgba(255,255,255,.12), 0 0 0 8px rgba(61,220,241,.07), 0 24px 54px rgba(0,0,0,.24);
}
.lifecycle-node.is-current h4 { color: #91f2ff; }

/* SVG fallback preserves the premium droplet when WebGL is unavailable. */
.webgl-fallback #water-webgl { display: none; }
.webgl-fallback .water-scene-logo { display: block; opacity: .92; }
.water-fallback { display: none; position: absolute; inset: 0; z-index: 3; }
.webgl-fallback .water-fallback { display: block; }
.fallback-drop { display: none; }
.fallback-drop-svg {
  position: absolute;
  left: 50%;
  top: 49%;
  width: 48%;
  transform: translate(-50%,-50%);
  overflow: visible;
  animation: fallbackSvgFloat 5.2s ease-in-out infinite;
}
.fallback-liquid { transform-origin: center; animation: fallbackLiquid 4.8s ease-in-out infinite; }
.fallback-ripple {
  position: absolute;
  left: 50%;
  bottom: 16%;
  width: 48%;
  height: 12%;
  transform: translateX(-50%) rotateX(68deg) scale(.35);
  border: 2px solid rgba(92,232,252,.58);
  border-radius: 50%;
  opacity: 0;
  animation: fallbackRipple 3.2s ease-out infinite;
}
.fallback-ripple.r2 { animation-delay: 1.05s; }
.fallback-ripple.r3 { animation-delay: 2.1s; }
@keyframes fallbackSvgFloat { 50% { transform: translate(-50%,-54%) rotateY(5deg); } }
@keyframes fallbackLiquid { 50% { transform: translate(5px,-4px); } }
@keyframes fallbackRipple { 0% { opacity: .75; transform: translateX(-50%) rotateX(68deg) scale(.35); } 100% { opacity: 0; transform: translateX(-50%) rotateX(68deg) scale(1.75); } }

/* Hero copy has its own deterministic stagger, independent of scroll observers. */
.home-page .hero-copy.reveal,
.home-page .hero-copy.reveal.is-visible {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}
.home-page .hero-copy > * {
  opacity: 0;
  transform: translate3d(0,24px,0);
}
.home-page.intro-complete .hero-copy > *,
.home-page .intro-complete .hero-copy > * {
  animation: heroElementIn .86s var(--premium-ease) forwards;
}
.home-page.intro-complete .hero-copy > :nth-child(1) { animation-delay: .06s; }
.home-page.intro-complete .hero-copy > :nth-child(2) { animation-delay: .14s; }
.home-page.intro-complete .hero-copy > :nth-child(3) { animation-delay: .24s; }
.home-page.intro-complete .hero-copy > :nth-child(4) { animation-delay: .34s; }
.home-page.intro-complete .hero-copy > :nth-child(5) { animation-delay: .44s; }
.home-page.intro-complete .hero-copy > :nth-child(6) { animation-delay: .54s; }
@keyframes heroElementIn { to { opacity: 1; transform: translate3d(0,0,0); } }
@media (prefers-reduced-motion: reduce) { .home-page .hero-copy > * { opacity: 1; transform: none; } }


/* Source: premium-v3.css */
/* Nexaqua Premium Motion System v3
   Compact luxury sizing + liquid page-to-page transitions. */

:root {
  --premium-ease: cubic-bezier(.16, 1, .3, 1);
  --liquid-ease: cubic-bezier(.22, .8, .2, 1);
  --content: min(1120px, calc(100vw - 44px));
}

/* ---------- Liquid page transition ---------- */
@property --liquid-hole {
  syntax: '<length>';
  inherits: false;
  initial-value: 0px;
}

.liquid-page-transition {
  --impact-y: 45%;
  --liquid-hole: 0px;
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: all;
  overflow: hidden;
  isolation: isolate;
  color: #eafbff;
}

.liquid-page-transition.is-idle {
  visibility: hidden;
  pointer-events: none;
}

.transition-curtain,
.transition-bloom,
.transition-caustics {
  position: absolute;
  inset: 0;
}

.transition-curtain {
  z-index: 1;
  background:
    radial-gradient(circle at 50% 46%, rgba(36, 211, 239, .18), transparent 23%),
    linear-gradient(145deg, #010b1b, #032a55 58%, #075b7c);
  -webkit-mask-image: radial-gradient(circle at 50% var(--impact-y), transparent 0 var(--liquid-hole), #000 calc(var(--liquid-hole) + 2px));
  mask-image: radial-gradient(circle at 50% var(--impact-y), transparent 0 var(--liquid-hole), #000 calc(var(--liquid-hole) + 2px));
}

.transition-bloom {
  z-index: 1;
  opacity: 0;
  clip-path: circle(0 at 50% var(--impact-y));
  background:
    radial-gradient(circle at 50% var(--impact-y), rgba(89, 234, 250, .32), transparent 15%),
    linear-gradient(145deg, #010b1b, #032a55 58%, #075b7c);
}

.transition-caustics {
  z-index: 2;
  opacity: .26;
  background:
    repeating-radial-gradient(ellipse at 50% 58%, transparent 0 28px, rgba(129, 238, 255, .07) 29px 30px, transparent 31px 62px);
  mix-blend-mode: screen;
  animation: liquidCaustics 11s linear infinite;
}

.transition-stage {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}

.transition-drop {
  position: absolute;
  left: 50%;
  top: -84px;
  width: 34px;
  height: 46px;
  opacity: 0;
  transform: translateX(-50%) scale(.78);
  filter: drop-shadow(0 8px 20px rgba(54, 222, 244, .48));
}

.transition-drop span {
  position: absolute;
  inset: 0;
  border-radius: 72% 28% 68% 32% / 74% 28% 72% 26%;
  transform: rotate(45deg);
  background:
    radial-gradient(circle at 28% 24%, #fff 0 8%, rgba(255,255,255,.55) 9% 17%, transparent 18%),
    linear-gradient(135deg, #d9fcff, #41def0 48%, #0a69bf 84%);
  box-shadow:
    inset -8px -10px 16px rgba(0,34,84,.38),
    inset 6px 7px 12px rgba(255,255,255,.56);
}

.transition-impact {
  position: absolute;
  left: 50%;
  top: var(--impact-y);
  width: 220px;
  height: 58px;
  transform: translate(-50%, -50%) rotateX(67deg);
  opacity: 0;
}

.transition-impact i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 58px;
  height: 58px;
  border: 1.5px solid rgba(135, 239, 252, .78);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(.2);
  box-shadow: 0 0 24px rgba(49, 211, 237, .18);
}
.transition-impact i:nth-child(2) { border-color: rgba(135,239,252,.46); }
.transition-impact i:nth-child(3) { border-color: rgba(135,239,252,.24); }

.transition-wordmark {
  position: absolute;
  left: 50%;
  top: calc(var(--impact-y) + 78px);
  transform: translateX(-50%) translateY(8px);
  opacity: 0;
  color: rgba(232, 251, 255, .76);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .23em;
  text-transform: uppercase;
  white-space: nowrap;
}

.liquid-page-transition.is-entering .transition-drop,
.liquid-page-transition.is-leaving .transition-drop {
  animation: liquidDropFall .70s cubic-bezier(.32,.02,.36,1) forwards;
}

.liquid-page-transition.is-impact .transition-drop {
  opacity: 0;
}

.liquid-page-transition.is-impact .transition-impact {
  opacity: 1;
}

.liquid-page-transition.is-impact .transition-impact i {
  animation: liquidImpactRing .78s ease-out forwards;
}
.liquid-page-transition.is-impact .transition-impact i:nth-child(2) { animation-delay: .09s; }
.liquid-page-transition.is-impact .transition-impact i:nth-child(3) { animation-delay: .18s; }

.liquid-page-transition.is-impact .transition-wordmark {
  animation: liquidWordmark .55s var(--premium-ease) forwards;
}

.liquid-page-transition.is-opening {
  animation: transitionDisablePointer 1.05s .72s linear forwards;
}

.liquid-page-transition.is-opening .transition-curtain {
  animation: liquidPageReveal 1.02s var(--liquid-ease) forwards;
}

.liquid-page-transition.is-opening .transition-caustics,
.liquid-page-transition.is-opening .transition-stage {
  animation: liquidLayerFade .48s .38s ease forwards;
}

.liquid-page-transition.is-leaving .transition-curtain {
  display: none;
}

.liquid-page-transition.is-leaving .transition-bloom {
  opacity: 1;
  animation: liquidPageCover .72s .62s var(--liquid-ease) forwards;
}

.liquid-page-transition.is-leaving .transition-caustics {
  opacity: 0;
  animation: liquidCausticsIn .5s .62s ease forwards;
}

@keyframes liquidDropFall {
  0% { top: -84px; opacity: 0; transform: translateX(-50%) scale(.68) rotate(-3deg); }
  14% { opacity: 1; }
  82% { top: calc(var(--impact-y) - 18px); opacity: 1; transform: translateX(-50%) scale(1) rotate(2deg); }
  93% { top: calc(var(--impact-y) - 3px); transform: translateX(-50%) scaleX(1.28) scaleY(.68); }
  100% { top: var(--impact-y); opacity: 0; transform: translateX(-50%) scaleX(1.55) scaleY(.18); }
}

@keyframes liquidImpactRing {
  0% { opacity: .9; transform: translate(-50%, -50%) scale(.16); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(3.9); }
}

@keyframes liquidWordmark {
  to { opacity: .74; transform: translateX(-50%) translateY(0); }
}

@keyframes liquidPageReveal {
  0%, 14% { --liquid-hole: 0px; }
  100% { --liquid-hole: 150vmax; }
}

@keyframes liquidPageCover {
  from { clip-path: circle(0 at 50% var(--impact-y)); }
  to { clip-path: circle(150vmax at 50% var(--impact-y)); }
}

@keyframes liquidCaustics {
  to { transform: translate3d(3%, -3%, 0) rotate(5deg) scale(1.04); }
}

@keyframes liquidLayerFade {
  to { opacity: 0; }
}

@keyframes liquidCausticsIn {
  to { opacity: .24; }
}

@keyframes transitionDisablePointer {
  to { pointer-events: none; }
}

/* ---------- Compact premium scale ---------- */
.nav-shell { height: 76px; }
.brand img { width: 102px; height: 58px; }
.nav-links a { padding: 8px 10px; font-size: 12px; }
.btn { min-height: 44px; padding-inline: 19px; font-size: 13px; }
.btn-sm { min-height: 38px; padding-inline: 15px; font-size: 11px; }

.section { padding: 88px 0; }
.section-sm { padding: 68px 0; }
.section-head { margin-bottom: 34px; }
.section-title {
  margin-top: 10px;
  margin-bottom: 14px;
  max-width: 720px;
  font-size: clamp(31px, 4vw, 48px);
  line-height: 1.08;
  letter-spacing: -.038em;
}
.section-copy { max-width: 640px; font-size: 15.5px; line-height: 1.72; }

.home-page .hero {
  min-height: max(720px, 100svh);
}
.home-page .hero-grid {
  grid-template-columns: minmax(0, .98fr) minmax(470px, 1.02fr);
  gap: 28px;
  padding-top: 98px;
  padding-bottom: 66px;
}
.home-page .hero h1 {
  max-width: 690px;
  font-size: clamp(48px, 5.35vw, 76px);
  line-height: .98;
  letter-spacing: -.058em;
}
.home-page .hero-copy > p {
  max-width: 570px;
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1.72;
}
.home-page .hero-visual { min-height: 540px; }
.water-scene { width: min(610px, 100%); }
.scene-metric { min-width: 176px; padding: 10px 12px; border-radius: 16px; }
.scene-metric b { font-size: 10px; }
.scene-metric small { font-size: 8px; }
.metric-icon { width: 35px; height: 35px; font-size: 18px; }
.hero-live-status { max-width: 390px; padding: 11px 14px; }
.home-page .scroll-cue { font-size: 10px; }

.page-hero {
  min-height: 560px;
  padding-top: 96px;
}
.page-hero-grid { gap: 34px; }
.page-hero h1 {
  font-size: clamp(42px, 5.3vw, 67px);
  line-height: 1;
  letter-spacing: -.052em;
}
.page-hero p { max-width: 610px; font-size: 16px; }
.page-hero-art { min-height: 270px; }
.page-hero-art img { max-height: 270px; }

.service-card,
.project-card,
.industry-card,
.info-card,
.process-card,
.value-card,
.contact-form,
.result-panel,
.stat-card {
  border-radius: 20px;
}

.service-card,
.industry-card,
.info-card,
.process-card,
.value-card { padding: 24px; }

.project-card:hover,
.industry-card:hover,
.info-card:hover,
.process-card:hover,
.value-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 48px rgba(3,42,90,.12);
}

.reveal {
  transform: translate3d(0, 24px, 0) scale(.994);
  filter: blur(2px);
  transition-duration: .72s;
}

/* Reduce visual noise while preserving depth. */
.scene-blueprint { opacity: .48; }
.scene-orbit { opacity: .66; }
.home-page .hero::after { opacity: .38; }
.home-page #water-canvas { opacity: .38; }

@media (max-width: 1050px) {
  .home-page .hero-grid { grid-template-columns: 1fr; padding-top: 102px; }
  .home-page .hero-copy { max-width: 760px; }
  .hero-visual { min-height: 560px; }
  .water-scene { width: min(600px, 100%); }
}

@media (max-width: 720px) {
  :root { --content: min(100% - 30px, 1120px); }
  .nav-shell { height: 68px; }
  .brand img { width: 90px; height: 52px; }
  .section { padding: 64px 0; }
  .section-sm { padding: 54px 0; }
  .section-title { font-size: clamp(29px, 9vw, 40px); }
  .section-copy { font-size: 14.5px; }
  .home-page .hero { min-height: 900px; }
  .home-page .hero-grid { padding-top: 88px; padding-bottom: 60px; }
  .home-page .hero h1 { font-size: clamp(43px, 13.5vw, 58px); }
  .home-page .hero-copy > p { font-size: 14.5px; }
  .hero-visual { min-height: 440px; margin-top: 0; }
  .water-scene { width: min(500px, 122vw); }
  .scene-metric { min-width: 146px; padding: 8px 9px; }
  .metric-icon { width: 30px; height: 30px; }
  .metric-a { left: 12%; }
  .metric-b { right: 11%; }
  .metric-c { left: 17%; }
  .page-hero { min-height: 520px; padding-top: 84px; }
  .page-hero h1 { font-size: clamp(39px, 12vw, 54px); }
  .page-hero p { font-size: 14.5px; }
  .transition-drop { width: 29px; height: 40px; }
  .transition-impact { width: 175px; }
  .transition-wordmark { top: calc(var(--impact-y) + 62px); font-size: 9px; }
}

@media (max-width: 480px) {
  .home-page .hero { min-height: 850px; }
  .hero-visual { min-height: 400px; }
  .water-scene { width: 126vw; }
  .scene-metric { min-width: 138px; }
}

@media (prefers-reduced-motion: reduce) {
  .liquid-page-transition { display: none !important; }
  .reveal { opacity: 1; transform: none; filter: none; }
}


/* Source: premium-v4.css */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@600;700&display=swap');

@property --v4-portal-radius {
  syntax: '<length>';
  inherits: false;
  initial-value: 0px;
}

:root {
  --font-heading: "Manrope", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --v4-ease: cubic-bezier(.16, 1, .3, 1);
}

html, body { font-family: var(--font-body); }
h1, h2, h3, h4, h5, h6, .stat-number, .brand-name { font-family: var(--font-heading); }

/* Compact, premium typography. */
.home-page .hero h1 {
  max-width: 680px;
  margin: 18px 0 18px;
  font-size: clamp(44px, 4.5vw, 62px) !important;
  line-height: 1.07 !important;
  letter-spacing: -.035em !important;
  font-weight: 700;
}
.home-page .hero-copy > p,
.hero-copy > p {
  max-width: 620px;
  font-size: clamp(15px, 1.3vw, 17px) !important;
  line-height: 1.72;
}
.page-hero h1 {
  max-width: 720px;
  font-size: clamp(38px, 4vw, 54px) !important;
  line-height: 1.09 !important;
  letter-spacing: -.035em !important;
}
.page-hero p { max-width: 680px; font-size: clamp(15px, 1.4vw, 18px) !important; line-height: 1.7; }
.section-title {
  max-width: 780px;
  font-size: clamp(31px, 3.25vw, 44px) !important;
  line-height: 1.13 !important;
  letter-spacing: -.025em !important;
}
.section-copy { max-width: 700px; font-size: 16px; line-height: 1.72; }
.card-title, .solution-card h3, .industry-card h3, .project-card h3 { font-size: clamp(18px, 1.55vw, 21px) !important; line-height: 1.3; }
.card-copy, .solution-card p, .industry-card p, .project-card p { font-size: 14px; line-height: 1.65; }
.cta-inner h2 { font-size: clamp(30px, 3.2vw, 43px) !important; line-height: 1.14 !important; }
.stat-number { font-size: clamp(34px, 3.6vw, 48px) !important; }

/* Cleaner scale and spacing. */
.container { width: min(1180px, calc(100% - 48px)); }
.section { padding-top: 88px; padding-bottom: 88px; }
.site-header { min-height: 72px; }
.header-inner { min-height: 72px; }
.logo img { width: 92px !important; max-height: 58px; object-fit: contain; }
.nav-links { gap: 20px !important; }
.nav-links a { font-size: 14px !important; font-weight: 500 !important; }
.nav-links .btn { min-height: 42px; padding: 0 16px; font-size: 13px !important; }
.btn { min-height: 45px; padding: 0 18px; font-size: 14px !important; font-weight: 600; }
.hero { min-height: 740px !important; padding-top: 128px !important; }
.hero-grid { grid-template-columns: minmax(0, 1.04fr) minmax(430px, .96fr) !important; gap: 44px !important; }
.hero-visual { min-height: 520px !important; }
.page-hero { min-height: 500px !important; padding: 132px 0 72px !important; }
.page-hero-grid { gap: 44px !important; }
.page-hero-art img { max-height: 330px !important; object-fit: contain; }

/* 3D and glass are controlled rather than exaggerated. */
[data-tilt] { transform-style: preserve-3d; will-change: transform; }
.solution-card, .industry-card, .project-card, .info-card, .contact-form, .stat-card,
.challenge-panel, .calculator-shell, .tech-visual, .value-card, .process-card {
  border-radius: 20px !important;
  box-shadow: 0 18px 46px rgba(0, 46, 87, .09) !important;
  transition: transform .32s var(--v4-ease), border-color .3s ease, box-shadow .3s ease !important;
}
.solution-card:hover, .industry-card:hover, .project-card:hover, .info-card:hover, .stat-card:hover {
  transform: translateY(-4px) scale(1.012) !important;
  box-shadow: 0 25px 58px rgba(0, 46, 87, .14) !important;
}

/* Hero depth is subtle and cinematic. */
.water-scene { transform: translate3d(0, calc(var(--scene-scroll, 0) * 13px), 0) !important; }
.water-webgl, #water-webgl { filter: saturate(1.05) contrast(1.03); }
.orbit-node, .water-data-card { backdrop-filter: blur(14px); }
.caustic-layer, .hero::after { opacity: .45 !important; }

/* Page-specific opening feel. */
.page-hero .reveal.is-visible:first-child { animation: v4HeroSettle .5s var(--v4-ease) both; }
.page-hero-art.reveal.is-visible { animation: v4VisualSettle .72s var(--v4-ease) both; }
@keyframes v4HeroSettle { from { opacity: .25; transform: translateY(15px); } to { opacity: 1; transform: none; } }
@keyframes v4VisualSettle { from { opacity: .2; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }

/* Signature page transition: top-center drop, impact and outward liquid portal. */
.page-liquid-transition {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .08s linear, visibility 0s linear .08s;
}
.page-liquid-transition.is-leaving,
.page-liquid-transition.is-arriving,
.liquid-arrival-pending .page-liquid-transition {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  transition-delay: 0s;
}
.liquid-transition-bg {
  opacity: 0;
  background:
    radial-gradient(circle at 50% 49%, rgba(50, 224, 243, .25), transparent 19%),
    radial-gradient(circle at 50% 115%, rgba(37, 188, 225, .18), transparent 38%),
    linear-gradient(145deg, rgba(0, 7, 20, .96), rgba(2, 36, 75, .96) 58%, rgba(4, 80, 105, .96));
  backdrop-filter: blur(3px);
  transition: opacity .09s ease;
}
.is-leaving .liquid-transition-bg,
.liquid-arrival-pending .liquid-transition-bg { opacity: 1; }
.is-arriving .liquid-transition-bg { opacity: 0; }

.liquid-drop-stage {
  top: 50% !important;
  width: 330px !important;
  height: 250px !important;
}
.liquid-drop-3d {
  top: -52vh !important;
  width: 72px !important;
  height: 92px !important;
  transform: translateX(-50%) rotate(-2deg) !important;
}
.liquid-drop-shell {
  border-radius: 72% 28% 68% 32% / 78% 28% 72% 22% !important;
  transform: rotate(45deg) translateZ(20px) !important;
  box-shadow:
    inset 12px 11px 20px rgba(255,255,255,.72),
    inset -17px -21px 28px rgba(0,29,97,.48),
    0 22px 34px rgba(0,8,32,.42),
    0 0 30px rgba(70,229,246,.28) !important;
}
.is-leaving .liquid-drop-3d { animation: v4DropFall .31s cubic-bezier(.23,.75,.25,1) forwards !important; }
@keyframes v4DropFall {
  0% { top: -52vh; opacity: 0; transform: translateX(-50%) rotate(-2deg) scale(.64,.9); }
  14% { opacity: 1; }
  76% { top: 36%; opacity: 1; transform: translateX(-50%) rotate(0) scale(.82,1.2); }
  100% { top: 45%; opacity: 0; transform: translateX(-50%) rotate(0) scale(1.28,.34); }
}
.liquid-impact-bloom { top: 61% !important; }
.is-leaving .liquid-impact-bloom { animation: v4Impact .23s .25s ease-out forwards !important; }
@keyframes v4Impact { 0% { opacity:0; transform:translate(-50%,-50%) scale(.2); } 35% { opacity:1; } 100% { opacity:0; transform:translate(-50%,-50%) scale(9,3.2); } }
.liquid-ripple-set { top: 62% !important; }
.is-leaving .liquid-ripple-set i { animation: v4Ring .34s .25s ease-out forwards !important; }
.is-leaving .liquid-ripple-set i:nth-child(2) { animation-delay: .29s !important; }
.is-leaving .liquid-ripple-set i:nth-child(3) { animation-delay: .33s !important; }
@keyframes v4Ring { 0%{opacity:0;transform:translate(-50%,-50%) scale(.12)} 22%{opacity:.9} 100%{opacity:0;transform:translate(-50%,-50%) scale(4.8,1.7)} }
.liquid-splash { top: 60% !important; }
.is-leaving .liquid-splash i { animation-duration: .32s !important; animation-delay: .25s !important; }
.liquid-transition-copy { top: calc(50% + 125px) !important; }
.liquid-transition-copy span { font-size: 9px !important; letter-spacing: .18em !important; }
.liquid-transition-copy strong { font-family: var(--font-heading); font-size: clamp(18px, 2.1vw, 26px) !important; }
.is-leaving .liquid-transition-copy { animation: liquidCopyIn .34s .04s var(--v4-ease) forwards !important; }

.liquid-reveal-curtain {
  --liquid-radius: 0px;
  background:
    radial-gradient(circle at 50% 50%, rgba(72, 225, 242, .22), transparent 20%),
    linear-gradient(145deg, #010817, #03254d 58%, #07516f) !important;
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent 0 var(--liquid-radius), #000 calc(var(--liquid-radius) + 2px)) !important;
  mask-image: radial-gradient(circle at 50% 50%, transparent 0 var(--liquid-radius), #000 calc(var(--liquid-radius) + 2px)) !important;
}
.is-arriving .liquid-reveal-curtain { animation: v4PortalReveal .22s var(--v4-ease) forwards !important; }
@keyframes v4PortalReveal { to { --liquid-radius: 145vmax; } }
.liquid-arrival-brand { display: none !important; }

/* Keep the new page settling quickly after the portal. */
.liquid-arrival-pending main { opacity: .55; transform: translateY(8px); }
html:not(.liquid-arrival-pending) main { transition: opacity .24s ease, transform .32s var(--v4-ease); }

/* Forms. */
.form-status {
  display: none;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 13px;
}
.form-status.show { display: block; }
.form-status.success { color: #0d6b48; background: #eafaf2; border: 1px solid #b9ead3; }
.form-status.error { color: #8d2831; background: #fff0f1; border: 1px solid #efc7ca; }
.btn.loading { opacity: .72; pointer-events: none; }
.btn.loading::after {
  content: "";
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: v4Spin .7s linear infinite;
}
@keyframes v4Spin { to { transform: rotate(360deg); } }
.honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

/* Mobile: simpler, faster and better proportioned. */
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr !important; }
  .hero-copy { text-align: center; }
  .hero-copy > p { margin-inline: auto; }
  .hero-actions, .hero-trust { justify-content: center; }
  .hero-visual { min-height: 460px !important; }
  .page-hero { padding-top: 116px !important; }
  .page-hero-grid { grid-template-columns: 1fr !important; }
  .page-hero-art { min-height: 260px !important; }
  .page-hero-art img { max-height: 280px !important; }
  .section { padding-top: 72px; padding-bottom: 72px; }
}
@media (max-width: 620px) {
  .container { width: min(100% - 32px, 1180px); }
  .home-page .hero h1 { font-size: clamp(36px, 10.5vw, 43px) !important; line-height: 1.1 !important; }
  .page-hero h1 { font-size: clamp(33px, 9.5vw, 40px) !important; }
  .section-title { font-size: clamp(28px, 8.3vw, 34px) !important; }
  .hero { padding-top: 108px !important; }
  .hero-visual { min-height: 370px !important; }
  .page-hero-art { min-height: 220px !important; }
  .liquid-transition-copy { top: calc(50% + 105px) !important; }
  .liquid-drop-3d { width: 58px !important; height: 74px !important; }
  .is-leaving .liquid-drop-3d { animation-duration: .24s !important; }
  .is-leaving .liquid-impact-bloom { animation-delay: .19s !important; }
  .is-leaving .liquid-ripple-set i, .is-leaving .liquid-splash i { animation-delay: .19s !important; }
  .is-arriving .liquid-reveal-curtain { animation-duration: .18s !important; }
}

@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition .liquid-drop-stage,
  .page-liquid-transition .liquid-transition-copy,
  .page-liquid-transition .liquid-splash,
  .page-liquid-transition .liquid-ripple-set { display: none !important; }
  .page-liquid-transition.is-leaving,
  .page-liquid-transition.is-arriving { background: rgba(2, 20, 43, .88); transition: opacity .16s ease !important; }
  [data-tilt] { transform: none !important; }
}

/* V4 navigation polish and quick history reveal. */
.page-liquid-transition.is-back-arriving {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  background: rgba(1, 18, 40, .68);
  animation: v4BackFade .21s ease-out forwards;
}
.page-liquid-transition.is-back-arriving .liquid-transition-bg { opacity: .42; }
.page-liquid-transition.is-back-arriving .liquid-reveal-curtain {
  opacity: 1;
  animation: v4BackRipple .21s var(--v4-ease) forwards;
}
@keyframes v4BackFade { from { opacity: 1; } to { opacity: 0; visibility: hidden; } }
@keyframes v4BackRipple { from { --liquid-radius: 0px; } to { --liquid-radius: 145vmax; } }

/* First-session cinematic logo intro. */
.aqua-intro { z-index: 2147482900; }
.aqua-intro .intro-core { transform: scale(.9); }
.aqua-intro .intro-core img { width: 176px; }
.aqua-intro .intro-skip {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: none;
  cursor: pointer;
}

/* Premium header: transparent at the top, compact liquid glass after scrolling. */
.site-header { background: rgba(1, 20, 43, .18) !important; border-bottom: 1px solid rgba(117, 232, 248, .11) !important; backdrop-filter: blur(10px); }
.site-header.scrolled { background: rgba(2, 28, 58, .86) !important; backdrop-filter: blur(20px) saturate(1.18); box-shadow: 0 12px 34px rgba(0, 17, 39, .16); }
.site-header .nav-shell { transition: min-height .28s var(--v4-ease); }
.site-header.scrolled .nav-shell { min-height: 64px; }
.nav-links a.active::after, .nav-links a[aria-current="page"]::after { opacity: 1 !important; transform: scaleX(1) !important; }

/* Liquid button fill without oversized motion. */
.btn { position: relative; overflow: hidden; isolation: isolate; }
.btn::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -12%;
  right: -12%;
  bottom: -130%;
  height: 160%;
  border-radius: 48% 52% 0 0;
  background: linear-gradient(120deg, rgba(51, 222, 242, .34), rgba(14, 127, 213, .52));
  transition: bottom .42s var(--v4-ease), transform .42s var(--v4-ease);
  transform: rotate(-3deg);
}
.btn:hover::before, .btn:focus-visible::before { bottom: -38%; transform: rotate(0); }

/* Page-specific opening identities. */
.subpage .page-hero { overflow: hidden; isolation: isolate; }
.subpage .page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .22;
  background: repeating-radial-gradient(ellipse at 78% 45%, transparent 0 30px, rgba(87, 223, 243, .10) 31px 32px, transparent 33px 64px);
  animation: v4CausticDrift 16s linear infinite;
}
.about-page .page-hero-art::before,
.solutions-page .page-hero-art::before,
.industries-page .page-hero-art::before,
.projects-page .page-hero-art::before,
.technologies-page .page-hero-art::before,
.sustainability-page .page-hero-art::before,
.careers-page .page-hero-art::before,
.contact-page .page-hero-art::before {
  content: "";
  position: absolute;
  inset: 8% 9%;
  border: 1px solid rgba(86, 226, 245, .28);
  border-radius: 50%;
  transform: rotateX(65deg);
  box-shadow: 0 0 38px rgba(34, 191, 225, .15);
  animation: v4HeroRing 4.8s ease-in-out infinite;
}
.about-page .page-hero-art img { animation: v4ParticleStory 6s ease-in-out infinite; }
.solutions-page .page-hero-art::after {
  content: ""; position: absolute; left: 10%; right: 10%; top: 54%; height: 3px; border-radius: 99px;
  background: linear-gradient(90deg, transparent, #69efff, #15a7da, transparent); background-size: 220% 100%; animation: v4PipelineFlow 2.6s linear infinite;
}
.industries-page .page-hero-art img { animation: v4BubbleFloat 5.8s ease-in-out infinite; }
.projects-page .project-card { overflow: hidden; }
.projects-page .project-card::after {
  content: ""; position: absolute; inset: auto -30% -80% -30%; height: 75%; border-radius: 50%; opacity: 0;
  border: 1px solid rgba(67, 211, 235, .34); transition: opacity .3s, transform .55s var(--v4-ease); transform: scale(.4);
}
.projects-page .project-card:hover::after { opacity: 1; transform: scale(1.4); }
.technologies-page .page-hero-art img { animation: v4FilterPulse 5.5s ease-in-out infinite; }
.sustainability-page .page-hero-art img, .sustainability-page .impact-globe img { animation: v4GlobeFloat 8s ease-in-out infinite; }
.careers-page .page-hero::before {
  content: ""; position: absolute; left: -10%; right: -10%; bottom: -25%; height: 46%; border-radius: 50%;
  background: radial-gradient(ellipse at 50% 0, rgba(64, 222, 240, .22), transparent 62%); animation: v4WaveBreath 6s ease-in-out infinite;
}
.contact-page .page-hero-art::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; border-radius: 50%; background: #5cecf8;
  box-shadow: 0 0 0 0 rgba(92, 236, 248, .5); animation: v4MapPulse 2.2s ease-out infinite;
}
@keyframes v4HeroRing { 50% { opacity: .45; transform: rotateX(65deg) scale(1.08); } }
@keyframes v4ParticleStory { 50% { transform: translateY(-8px) rotate(.4deg); filter: drop-shadow(0 20px 30px rgba(0, 81, 137, .15)); } }
@keyframes v4PipelineFlow { to { background-position: -220% 0; } }
@keyframes v4BubbleFloat { 50% { transform: translateY(-10px) scale(1.012); } }
@keyframes v4FilterPulse { 50% { transform: translateY(-5px); filter: saturate(1.15) drop-shadow(0 18px 30px rgba(8, 109, 171, .18)); } }
@keyframes v4GlobeFloat { 50% { transform: translateY(-8px) rotate(1.2deg); } }
@keyframes v4WaveBreath { 50% { transform: translateY(-8%) scaleX(1.04); opacity: .72; } }
@keyframes v4MapPulse { 80%,100% { box-shadow: 0 0 0 36px rgba(92, 236, 248, 0); } }
@keyframes v4CausticDrift { to { transform: translate3d(3%, -2%, 0) rotate(1deg); } }

/* Qualitative impact cards, no unsupported public metrics. */
.impact-stats.qualitative .stat-card { min-height: 150px; align-content: start; }
.impact-stats.qualitative .stat-number { font-size: 18px !important; line-height: 1.3; color: #7defff; }
.impact-stats.qualitative .stat-label { margin-top: 8px; line-height: 1.55; }

/* Live forms and upload controls. */
.contact-form { position: relative; overflow: hidden; }
.contact-form::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .23;
  background: radial-gradient(circle at var(--spot-x, 85%) var(--spot-y, 10%), rgba(80, 226, 245, .35), transparent 28%);
}
.contact-form label { font-size: 13px; font-weight: 600; }
.contact-form input, .contact-form select, .contact-form textarea {
  font-family: var(--font-body); font-size: 15px; border-radius: 12px !important;
}
.field-help { display: block; margin-top: 7px; color: #647789; font-size: 12px; line-height: 1.5; }
.consent-field { display: flex; gap: 10px; align-items: flex-start; }
.consent-field input { width: 17px; height: 17px; margin-top: 3px; flex: 0 0 auto; }
.consent-field label { font-weight: 400; line-height: 1.55; }
.form-success-ripple {
  position: absolute; left: 50%; bottom: 52px; width: 30px; height: 30px; border: 2px solid rgba(31, 194, 219, .72); border-radius: 50%;
  transform: translate(-50%, 50%) scale(.2); opacity: 0; pointer-events: none;
}
.form-success-ripple.active { animation: v4FormRipple .85s ease-out forwards; }
@keyframes v4FormRipple { 20% { opacity: 1; } to { opacity: 0; transform: translate(-50%, 50%) scale(12, 4); } }

/* Legal content width and typography. */
.legal-content { max-width: 780px; margin-inline: auto; }
.legal-content h2 { margin-top: 34px; font-size: clamp(23px, 2.3vw, 30px); }
.legal-content p, .legal-content li { line-height: 1.78; }

@media (max-width: 900px) {
  .nav-links { background: rgba(2, 27, 56, .96) !important; backdrop-filter: blur(22px); }
  .site-header { background: rgba(2, 27, 56, .8) !important; }
  .about-page .page-hero-art::before, .solutions-page .page-hero-art::before, .industries-page .page-hero-art::before,
  .projects-page .page-hero-art::before, .technologies-page .page-hero-art::before, .sustainability-page .page-hero-art::before,
  .careers-page .page-hero-art::before, .contact-page .page-hero-art::before { inset: 14% 16%; }
}

@media (prefers-reduced-motion: reduce) {
  .subpage .page-hero::after, .page-hero-art::before, .page-hero-art::after,
  .sustainability-page .page-hero-art img, .sustainability-page .impact-globe img,
  .technologies-page .page-hero-art img, .industries-page .page-hero-art img,
  .about-page .page-hero-art img, .careers-page .page-hero::before { animation: none !important; }
}

/* Destination reflection inside the falling drop. */
.liquid-drop-preview {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 59%;
  width: 130%;
  transform: translate(-50%, -50%) rotate(-45deg) scaleX(.68);
  color: rgba(235, 254, 255, .78);
  font: 700 9px/1.1 var(--font-heading);
  letter-spacing: .03em;
  text-align: center;
  text-shadow: 0 2px 8px rgba(0, 32, 85, .45);
  opacity: .68;
  filter: blur(.15px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.liquid-navigation-locked body > :not(.page-liquid-transition) {
  transition: filter .12s ease, transform .2s var(--v4-ease), opacity .12s ease;
}
html.liquid-navigation-locked:has(.page-liquid-transition.is-leaving) body > :not(.page-liquid-transition) {
  filter: blur(2.2px) brightness(.78);
  transform: scale(.997);
}

/* Interactive technology process visual. */
.tech-visual { position: relative; overflow: hidden; }
.tech-stage-label {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 22px;
  z-index: 3;
  padding: 13px 15px;
  border: 1px solid rgba(113, 226, 242, .25);
  border-radius: 14px;
  background: rgba(2, 32, 67, .72);
  backdrop-filter: blur(13px);
  color: white;
}
.tech-stage-label small { display: block; margin-bottom: 4px; color: rgba(195, 244, 251, .65); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.tech-stage-label strong { font: 600 16px/1.25 var(--font-heading); }
.tech-flow-stream { position: absolute; left: 14%; right: 14%; top: 48%; height: 5px; overflow: hidden; border-radius: 99px; background: rgba(16, 129, 186, .17); }
.tech-flow-stream i { position: absolute; top: 0; width: 18%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, transparent, rgba(116, 245, 255, .9), transparent); animation: v4TechFlow 2s linear infinite; }
.tech-flow-stream i:nth-child(2) { animation-delay: -.5s; }
.tech-flow-stream i:nth-child(3) { animation-delay: -1s; }
.tech-flow-stream i:nth-child(4) { animation-delay: -1.5s; }
.tech-visual.is-switching img { animation: v4TechSwitch .42s var(--v4-ease); }
.tech-visual.is-switching .tech-stage-label { animation: v4TechLabel .42s var(--v4-ease); }
@keyframes v4TechFlow { from { left: -20%; } to { left: 105%; } }
@keyframes v4TechSwitch { 50% { transform: scale(.985); filter: blur(1.5px) saturate(1.3); } }
@keyframes v4TechLabel { from { opacity: .3; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.industry-bubble-detail { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; opacity: .74; }
.industry-bubble-detail span { padding: 5px 8px; border: 1px solid rgba(19, 151, 196, .16); border-radius: 999px; color: #35637b; background: rgba(221, 249, 253, .45); font-size: 10px; }
.industry-card:hover .industry-bubble-detail span { border-color: rgba(25, 188, 220, .35); background: rgba(210, 250, 255, .75); }
.project-disclosure { margin-top: 26px; padding: 20px 22px; border: 1px solid rgba(22, 151, 194, .15); border-radius: 16px; background: rgba(239, 251, 253, .8); }
.project-disclosure strong { font: 600 16px/1.3 var(--font-heading); color: #073c68; }
.project-disclosure p { margin: 7px 0 0; color: #536d7c; line-height: 1.65; }
.form-title { margin: 14px 0 26px; font-size: clamp(28px, 3vw, 38px); line-height: 1.12; letter-spacing: -.02em; }

@media (max-width: 620px) {
  .liquid-drop-preview { font-size: 7px; }
  .tech-stage-label { left: 14px; right: 14px; bottom: 14px; }
}


/* Source: premium-final.css */
/* Nexaqua Premium Liquid Navigation — Final
   Every internal page switch is choreographed as a falling 3D water drop,
   impact ripple, and a liquid lens that reveals the destination page. */

:root {
  --liquid-ink: #010b1d;
  --liquid-navy: #022d5f;
  --liquid-blue: #0788d3;
  --liquid-cyan: #4cecff;
  --liquid-mint: #7cf1b6;
  --liquid-ease: cubic-bezier(.16, 1, .3, 1);
}

@property --liquid-radius {
  syntax: '<length>';
  inherits: false;
  initial-value: 0px;
}

html.liquid-navigation-locked,
html.liquid-navigation-locked body,
html.liquid-arrival-pending,
html.liquid-arrival-pending body {
  overflow: hidden !important;
}

.page-liquid-transition {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  color: #fff;
  isolation: isolate;
  transition: opacity .14s ease, visibility 0s linear .18s;
}

.page-liquid-transition.is-leaving,
.page-liquid-transition.is-arriving,
.liquid-arrival-pending .page-liquid-transition {
  visibility: visible;
  opacity: 1;
  pointer-events: all;
  transition-delay: 0s;
}

.liquid-transition-bg,
.liquid-reveal-curtain {
  position: absolute;
  inset: 0;
}

.liquid-transition-bg {
  z-index: 0;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 45%, rgba(42, 221, 246, .30), transparent 18%),
    radial-gradient(circle at 50% 110%, rgba(33, 195, 231, .20), transparent 42%),
    linear-gradient(142deg, #000817 0%, #022047 52%, #06577a 100%);
  transition: opacity .18s ease;
}

.is-leaving .liquid-transition-bg,
.liquid-arrival-pending .liquid-transition-bg { opacity: 1; }
.is-arriving .liquid-transition-bg { opacity: 0; }

.liquid-transition-bg::before,
.liquid-transition-bg::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.liquid-transition-bg::before {
  inset: -35%;
  opacity: .64;
  background:
    repeating-radial-gradient(ellipse at 50% 50%, transparent 0 30px, rgba(123, 238, 255, .052) 31px 32px, transparent 33px 62px);
  animation: liquidCausticOrbit 9s linear infinite;
}

.liquid-transition-bg::after {
  left: -20%;
  right: -20%;
  bottom: -28vh;
  height: 55vh;
  border-radius: 50% 50% 0 0;
  opacity: .45;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(85, 230, 255, .34), transparent 52%),
    repeating-radial-gradient(ellipse at 50% 0%, transparent 0 26px, rgba(111, 240, 255, .08) 27px 28px, transparent 29px 55px);
  filter: blur(1px);
  animation: liquidSurfaceDrift 5.8s ease-in-out infinite alternate;
}

.liquid-drop-stage {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 45%;
  width: 360px;
  height: 220px;
  transform: translate(-50%, -50%);
  perspective: 1100px;
  pointer-events: none;
}

.liquid-drop-3d {
  position: absolute;
  left: 50%;
  top: 44%;
  width: 94px;
  height: 116px;
  opacity: 0;
  transform-style: preserve-3d;
  filter: drop-shadow(0 24px 26px rgba(0, 9, 32, .46)) drop-shadow(0 0 30px rgba(65, 226, 255, .32));
}

.liquid-drop-shell {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border: 1px solid rgba(219, 254, 255, .88);
  border-radius: 74% 26% 67% 33% / 76% 28% 72% 24%;
  background:
    radial-gradient(circle at 28% 24%, #fff 0 5%, rgba(255,255,255,.72) 6% 10%, transparent 11%),
    radial-gradient(circle at 68% 72%, rgba(0, 69, 154, .55), transparent 43%),
    linear-gradient(135deg, rgba(226, 253, 255, .96) 0%, #54e9fa 30%, #0da1dd 58%, #064ba4 100%);
  box-shadow:
    inset 13px 12px 22px rgba(255,255,255,.68),
    inset -18px -21px 30px rgba(0,24,94,.48),
    inset 0 -4px 14px rgba(12, 231, 255, .34),
    0 0 0 1px rgba(105, 233, 255, .16);
  transform: rotate(45deg) translateZ(20px);
  transform-style: preserve-3d;
}

.liquid-drop-shell::before,
.liquid-drop-shell::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.liquid-drop-shell::before {
  left: 16%;
  top: 15%;
  width: 20%;
  height: 42%;
  transform: rotate(-18deg);
  background: linear-gradient(to bottom, rgba(255,255,255,.94), rgba(255,255,255,0));
  filter: blur(1px);
}

.liquid-drop-shell::after {
  right: -15%;
  bottom: -12%;
  width: 70%;
  height: 64%;
  border: 1px solid rgba(161, 246, 255, .30);
  box-shadow: inset 0 0 25px rgba(69, 230, 255, .24);
}

.liquid-drop-shell img {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 55%;
  width: 74%;
  opacity: .70;
  transform: translate(-50%, -50%) rotate(-45deg) translateZ(32px);
  filter: drop-shadow(0 8px 11px rgba(0, 31, 88, .25));
}

.is-leaving .liquid-drop-3d {
  animation: liquidDropFall .66s cubic-bezier(.24,.78,.24,1) forwards;
}

.liquid-impact-bloom {
  position: absolute;
  left: 50%;
  top: 67%;
  width: 40px;
  height: 14px;
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.3);
  background: rgba(146, 247, 255, .95);
  box-shadow:
    0 0 24px 8px rgba(60, 225, 255, .62),
    0 0 80px 34px rgba(21, 155, 225, .28);
}
.is-leaving .liquid-impact-bloom { animation: liquidImpactBloom .42s .40s var(--liquid-ease) forwards; }

.liquid-ripple-set {
  position: absolute;
  left: 50%;
  top: 68%;
  width: 280px;
  height: 90px;
  transform: translate(-50%, -50%) rotateX(67deg);
  transform-style: preserve-3d;
}

.liquid-ripple-set i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 68px;
  height: 68px;
  border: 2px solid rgba(116, 239, 255, .88);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.14);
  box-shadow: 0 0 20px rgba(46, 220, 247, .34), inset 0 0 15px rgba(255,255,255,.12);
}
.is-leaving .liquid-ripple-set i { animation: liquidImpactRing .58s .42s ease-out forwards; }
.is-leaving .liquid-ripple-set i:nth-child(2) { animation-delay: .48s; }
.is-leaving .liquid-ripple-set i:nth-child(3) { animation-delay: .54s; }

.liquid-splash {
  position: absolute;
  left: 50%;
  top: 66%;
  width: 1px;
  height: 1px;
}
.liquid-splash i {
  --sx: 0px;
  --sy: -72px;
  position: absolute;
  left: 0;
  top: 0;
  width: 8px;
  height: 14px;
  border-radius: 70% 30% 60% 40%;
  opacity: 0;
  background: linear-gradient(#d7fdff, #26cde9 65%, #0874c4);
  box-shadow: 0 0 14px rgba(67, 226, 250, .55);
}
.liquid-splash i:nth-child(1) { --sx: -94px; --sy: -58px; transform: rotate(-62deg); }
.liquid-splash i:nth-child(2) { --sx: -66px; --sy: -91px; transform: rotate(-42deg) scale(.8); }
.liquid-splash i:nth-child(3) { --sx: -31px; --sy: -110px; transform: rotate(-20deg) scale(.62); }
.liquid-splash i:nth-child(4) { --sx: 35px; --sy: -106px; transform: rotate(22deg) scale(.72); }
.liquid-splash i:nth-child(5) { --sx: 73px; --sy: -84px; transform: rotate(43deg) scale(.88); }
.liquid-splash i:nth-child(6) { --sx: 102px; --sy: -52px; transform: rotate(62deg) scale(.68); }
.liquid-splash i:nth-child(7) { --sx: -120px; --sy: -25px; transform: rotate(-75deg) scale(.55); }
.liquid-splash i:nth-child(8) { --sx: 124px; --sy: -24px; transform: rotate(76deg) scale(.55); }
.is-leaving .liquid-splash i { animation: liquidSplashParticle .48s .40s cubic-bezier(.18,.7,.25,1) forwards; }

.liquid-transition-copy {
  position: absolute;
  z-index: 7;
  left: 50%;
  top: calc(45% + 145px);
  width: min(520px, 88vw);
  text-align: center;
  opacity: 0;
  transform: translate(-50%, 16px);
}
.liquid-transition-copy span {
  display: block;
  margin-bottom: 7px;
  color: rgba(173, 242, 255, .64);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .25em;
  text-transform: uppercase;
}
.liquid-transition-copy strong {
  display: block;
  overflow: hidden;
  color: #fff;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 16px 42px rgba(0, 7, 30, .45);
}
.is-leaving .liquid-transition-copy { animation: liquidCopyIn .52s .08s var(--liquid-ease) forwards; }

.liquid-reveal-curtain {
  z-index: 10;
  opacity: 0;
  --liquid-radius: 0px;
  background:
    radial-gradient(circle at 50% 45%, rgba(40, 219, 246, .24), transparent 20%),
    repeating-radial-gradient(ellipse at 50% 45%, transparent 0 34px, rgba(118, 235, 255, .042) 35px 36px, transparent 37px 70px),
    linear-gradient(142deg, #000817 0%, #022047 52%, #06577a 100%);
  -webkit-mask-image: radial-gradient(circle at 50% 45%, transparent 0 var(--liquid-radius), #000 calc(var(--liquid-radius) + 14px));
  mask-image: radial-gradient(circle at 50% 45%, transparent 0 var(--liquid-radius), #000 calc(var(--liquid-radius) + 14px));
  will-change: -webkit-mask-image, mask-image;
}

.liquid-arrival-pending .liquid-reveal-curtain,
.is-arriving .liquid-reveal-curtain { opacity: 1; }
.is-arriving .liquid-reveal-curtain { animation: liquidPageReveal .56s .02s var(--liquid-ease) forwards; }

.liquid-arrival-brand {
  position: absolute;
  z-index: 12;
  left: 50%;
  top: 45%;
  display: grid;
  place-items: center;
  width: 190px;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.82);
  pointer-events: none;
}
.liquid-arrival-brand::before,
.liquid-arrival-brand::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(111, 236, 255, .48);
  border-radius: 50%;
  opacity: .0;
}
.liquid-arrival-brand::before { width: 210px; height: 72px; transform: rotateX(66deg); }
.liquid-arrival-brand::after { width: 285px; height: 98px; transform: rotateX(66deg); }
.liquid-arrival-brand img {
  width: 145px;
  filter: drop-shadow(0 18px 28px rgba(0, 18, 54, .36));
}
.liquid-arrival-brand span {
  margin-top: 9px;
  color: rgba(213, 249, 255, .72);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.liquid-arrival-pending .liquid-arrival-brand { opacity: 1; }
.is-arriving .liquid-arrival-brand { animation: liquidBrandRelease .48s .02s ease-out forwards; }
.is-arriving .liquid-arrival-brand::before { animation: liquidArrivalRing .46s .01s ease-out forwards; }
.is-arriving .liquid-arrival-brand::after { animation: liquidArrivalRing .54s .05s ease-out forwards; }

/* Premium finishing touches shared by every page. */
.site-header .brand,
.nav-links a,
.btn,
[data-tilt] {
  transform-style: preserve-3d;
}

.site-header .brand img { transition: transform .5s var(--liquid-ease), filter .5s var(--liquid-ease); }
.site-header .brand:hover img { transform: translateZ(22px) scale(1.035); filter: drop-shadow(0 12px 18px rgba(0, 76, 150, .20)); }

.nav-links a { position: relative; overflow: hidden; }
.nav-links a::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 5px;
  height: 2px;
  border-radius: 99px;
  opacity: 0;
  transform: scaleX(.25);
  background: linear-gradient(90deg, transparent, var(--liquid-cyan), var(--liquid-mint), transparent);
  box-shadow: 0 0 12px rgba(68, 231, 252, .58);
  transition: opacity .35s, transform .45s var(--liquid-ease);
}
.nav-links a:hover::after,
.nav-links a.active::after { opacity: .85; transform: scaleX(1); }

.btn { position: relative; overflow: hidden; isolation: isolate; }
.btn::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -70%;
  bottom: -70%;
  left: -40%;
  width: 30%;
  opacity: .0;
  transform: skewX(-22deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), transparent);
}
.btn:hover::before { animation: premiumButtonSheen .72s ease; }

[data-tilt] { will-change: transform; }


.subpage .page-hero { isolation: isolate; }
.subpage .page-hero::before { z-index: -2; }
.subpage .page-hero::after { animation: subpageOrbitalRing 12s linear infinite; }
.page-hero-art { position: relative; transform-style: preserve-3d; }
.page-hero-art::before {
  content: "";
  position: absolute;
  width: min(410px, 78vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(54, 214, 244, .16), rgba(5, 104, 186, .06) 48%, transparent 70%);
  filter: blur(10px);
  animation: premiumArtAura 5.2s ease-in-out infinite;
}
.page-hero-art img { position: relative; z-index: 2; filter: drop-shadow(0 36px 54px rgba(3,42,90,.24)) saturate(1.08); }

.reveal {
  transform-origin: 50% 100%;
  perspective: 1000px;
}

@keyframes liquidDropFall {
  0% { opacity: 0; transform: translate3d(-50%, -63vh, 120px) rotateZ(-5deg) scale3d(.34,.72,.34); }
  13% { opacity: 1; }
  55% { transform: translate3d(-50%, -11vh, 65px) rotateZ(2deg) scale3d(.78,1.09,.78); }
  71% { opacity: 1; transform: translate3d(-50%, 0, 15px) rotateZ(0) scale3d(.96,1.04,.96); }
  81% { opacity: 1; transform: translate3d(-50%, 20px, 0) rotateZ(0) scale3d(1.52,.37,1.3); }
  100% { opacity: 0; transform: translate3d(-50%, 22px, -30px) rotateZ(0) scale3d(2.1,.08,1.6); }
}
@keyframes liquidImpactBloom {
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.2); }
  30% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(9); }
}
@keyframes liquidImpactRing {
  0% { opacity: .9; transform: translate(-50%,-50%) scale(.12); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(5.2); }
}
@keyframes liquidSplashParticle {
  0% { opacity: 0; translate: 0 5px; scale: .35; }
  18% { opacity: 1; }
  72% { opacity: .82; translate: var(--sx) var(--sy); }
  100% { opacity: 0; translate: calc(var(--sx) * 1.16) calc(var(--sy) * .72); scale: .5; }
}
@keyframes liquidCopyIn {
  0% { opacity: 0; transform: translate(-50%, 18px); filter: blur(5px); }
  55% { opacity: 1; transform: translate(-50%, 0); filter: blur(0); }
  100% { opacity: .8; transform: translate(-50%, -3px); filter: blur(0); }
}
@keyframes liquidPageReveal {
  0% { --liquid-radius: 0px; filter: saturate(1.15); }
  72% { --liquid-radius: 94vmax; }
  100% { --liquid-radius: 150vmax; filter: saturate(1); }
}
@keyframes liquidBrandRelease {
  0% { opacity: 1; transform: translate(-50%,-50%) scale(.82); filter: blur(0); }
  56% { opacity: .88; transform: translate(-50%,-50%) scale(1.02); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.16); filter: blur(5px); }
}
@keyframes liquidArrivalRing {
  0% { opacity: .70; scale: .28; }
  100% { opacity: 0; scale: 2.7; }
}
@keyframes liquidCausticOrbit { to { transform: rotate(10deg) translate3d(3%,-4%,0); } }
@keyframes liquidSurfaceDrift { to { transform: translate3d(3%, -2%, 0) scaleX(1.04); } }
@keyframes premiumButtonSheen { 0% { left: -40%; opacity: 0; } 18% { opacity: .9; } 100% { left: 125%; opacity: 0; } }
@keyframes subpageOrbitalRing { to { transform: rotate(360deg); } }
@keyframes premiumArtAura { 50% { transform: scale(1.12); opacity: .68; } }

@media (max-width: 720px) {
  .liquid-drop-stage { width: 290px; }
  .liquid-drop-3d { width: 76px; height: 94px; }
  .liquid-transition-copy { top: calc(45% + 120px); }
  .liquid-ripple-set { width: 220px; }
  .liquid-arrival-brand { width: 155px; }
  .liquid-arrival-brand img { width: 118px; }
}

@media (prefers-reduced-motion: reduce) {
  .liquid-transition-bg::before,
  .liquid-transition-bg::after,
  .liquid-drop-3d,
  .liquid-impact-bloom,
  .liquid-ripple-set i,
  .liquid-splash i,
  .liquid-arrival-brand,
  .liquid-arrival-brand::before,
  .liquid-arrival-brand::after { animation: none !important; }
  .is-leaving .liquid-drop-3d { opacity: 1; transform: translate3d(-50%,0,0); }
  .is-arriving .liquid-reveal-curtain { animation: liquidPageReveal .18s linear forwards !important; }
}


/* V5 precision overrides */
/* Nexaqua V5 — compact premium scale and signature 3D water-drop navigation */
@property --nx-portal-hole {
  syntax: '<length>';
  inherits: false;
  initial-value: 0px;
}

:root {
  --nx-navy-1000: #010817;
  --nx-navy-950: #02152f;
  --nx-navy-900: #03284f;
  --nx-blue: #087ec8;
  --nx-aqua: #54e8f5;
  --nx-mint: #76e8b0;
  --nx-ease: cubic-bezier(.16, 1, .3, 1);
  --nx-smooth: cubic-bezier(.22, .74, .22, 1);
}

html { background: var(--nx-navy-1000); }
body { font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
h1, h2, h3, h4, h5, h6, .stat-number, .form-title { font-family: "Manrope", "Inter", system-ui, sans-serif; }

/* Smaller, calmer hierarchy. */
.home-page .hero h1 {
  max-width: 650px;
  margin: 16px 0 17px;
  font-size: clamp(42px, 4.15vw, 58px) !important;
  line-height: 1.075 !important;
  letter-spacing: -.036em !important;
}
.home-page .hero-copy > p,
.hero-copy > p {
  max-width: 585px;
  font-size: clamp(15px, 1.18vw, 17px) !important;
  line-height: 1.68 !important;
}
.page-hero h1 {
  max-width: 690px;
  font-size: clamp(36px, 3.65vw, 50px) !important;
  line-height: 1.095 !important;
  letter-spacing: -.032em !important;
}
.page-hero p { max-width: 650px; font-size: clamp(15px, 1.25vw, 18px) !important; line-height: 1.68 !important; }
.section-title {
  max-width: 740px;
  font-size: clamp(30px, 2.95vw, 41px) !important;
  line-height: 1.14 !important;
  letter-spacing: -.024em !important;
}
.section-copy { max-width: 680px; font-size: 15.5px !important; line-height: 1.72 !important; }
.service-card h3, .solution-card h3, .industry-card h3, .project-card h3,
.info-card h3, .process-card h3, .value-card h3 { font-size: clamp(17px, 1.35vw, 20px) !important; line-height: 1.3 !important; }
.service-card p, .solution-card p, .industry-card p, .project-card p,
.info-card p, .process-card p, .value-card p { font-size: 14px !important; line-height: 1.64 !important; }
.cta-inner h2 { font-size: clamp(28px, 2.8vw, 40px) !important; }
.form-title { font-size: clamp(27px, 2.7vw, 36px) !important; }

.container { width: min(1160px, calc(100% - 44px)) !important; }
.section { padding-top: 78px !important; padding-bottom: 78px !important; }
.site-header, .nav-shell { min-height: 68px !important; }
.nav-shell { height: 68px !important; }
.brand img, .logo img { width: 90px !important; height: 54px !important; max-height: 54px !important; }
.nav-links { gap: 3px !important; }
.nav-links a { padding: 9px 10px !important; font-size: 13.5px !important; font-weight: 500 !important; }
.header-actions .btn { min-height: 39px !important; padding-inline: 14px !important; font-size: 12.5px !important; }
.btn { min-height: 43px !important; padding: 0 17px !important; font-size: 14px !important; border-radius: 999px !important; }
.hero { min-height: 690px !important; padding-top: 108px !important; padding-bottom: 48px !important; }
.hero-grid { grid-template-columns: minmax(0, 1.03fr) minmax(405px, .97fr) !important; gap: 38px !important; }
.hero-visual { min-height: 480px !important; }
.page-hero { min-height: 445px !important; padding: 112px 0 62px !important; }
.page-hero-grid { gap: 38px !important; }
.page-hero-art { min-height: 300px !important; }
.page-hero-art img { max-height: 305px !important; }

/* Controlled glass depth. */
.solution-card, .industry-card, .project-card, .info-card, .contact-form, .stat-card,
.challenge-panel, .calculator-shell, .tech-visual, .value-card, .process-card, .service-card {
  border-radius: 18px !important;
  box-shadow: 0 16px 42px rgba(0, 46, 87, .085) !important;
}
.solution-card:hover, .industry-card:hover, .project-card:hover, .info-card:hover,
.stat-card:hover, .service-card:hover {
  transform: translateY(-3px) scale(1.008) !important;
  box-shadow: 0 22px 52px rgba(0, 46, 87, .13) !important;
}

/* Cleaner liquid-glass header. */
.site-header {
  background: linear-gradient(180deg, rgba(1, 18, 42, .54), rgba(1, 18, 42, .08)) !important;
  border-bottom: 1px solid rgba(121, 232, 245, .10) !important;
  backdrop-filter: blur(10px) saturate(1.08) !important;
}
.site-header.scrolled {
  background: rgba(2, 25, 54, .91) !important;
  backdrop-filter: blur(18px) saturate(1.18) !important;
  box-shadow: 0 10px 30px rgba(0, 15, 36, .16) !important;
}
.nav-links a::after {
  height: 2px !important;
  background: linear-gradient(90deg, transparent, var(--nx-aqua) 25%, #87f6e4 72%, transparent) !important;
  box-shadow: 0 0 12px rgba(84, 232, 245, .42) !important;
}

/* ---------- V5 signature page transition ---------- */
html.liquid-navigation-locked,
html.liquid-navigation-locked body,
html.liquid-arrival-pending,
html.liquid-arrival-pending body,
html.liquid-back-pending,
html.liquid-back-pending body { overflow: hidden !important; }

.page-liquid-transition {
  --origin-x: 50vw;
  --origin-y: 7vh;
  --impact-x: 50%;
  --impact-y: 54%;
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: block !important;
  overflow: hidden !important;
  isolation: isolate !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  background: transparent !important;
  transition: opacity .06s linear, visibility 0s linear .08s !important;
}
.page-liquid-transition.is-leaving,
.page-liquid-transition.is-arriving,
.page-liquid-transition.is-back-arriving,
.liquid-arrival-pending .page-liquid-transition,
.liquid-back-pending .page-liquid-transition {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: all !important;
  transition-delay: 0s !important;
}

.liquid-transition-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  opacity: 0 !important;
  background:
    radial-gradient(circle at 50% 52%, rgba(63, 229, 245, .22), transparent 20%),
    radial-gradient(circle at 50% 112%, rgba(20, 160, 211, .20), transparent 42%),
    linear-gradient(145deg, rgba(0, 8, 23, .88), rgba(2, 35, 73, .92) 58%, rgba(5, 78, 104, .92)) !important;
  backdrop-filter: blur(0) saturate(1) !important;
}
.liquid-transition-bg::before {
  content: "";
  position: absolute;
  inset: -28%;
  opacity: .36;
  background: repeating-radial-gradient(ellipse at 50% 56%, transparent 0 31px, rgba(130, 242, 255, .065) 32px 33px, transparent 34px 66px);
  transform: rotate(-4deg);
}
.is-leaving .liquid-transition-bg { animation: nxDimCurrent .47s linear forwards !important; }
.liquid-arrival-pending .liquid-transition-bg,
.liquid-back-pending .liquid-transition-bg { opacity: 1 !important; backdrop-filter: blur(2px) saturate(1.08) !important; }
.is-arriving .liquid-transition-bg { animation: nxArrivalBg .18s ease-out forwards !important; }
@keyframes nxDimCurrent {
  0% { opacity: 0; backdrop-filter: blur(0) saturate(1); }
  16% { opacity: .28; backdrop-filter: blur(1.5px) saturate(.95); }
  67% { opacity: .68; backdrop-filter: blur(2.4px) saturate(.92); }
  100% { opacity: 1; backdrop-filter: blur(3px) saturate(.9); }
}
@keyframes nxArrivalBg { from { opacity: 1; } to { opacity: 0; } }

/* Small bubble travels from the clicked navigation item to the drop origin. */
.liquid-origin-bubble {
  position: absolute;
  z-index: 8;
  left: 0;
  top: 0;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  opacity: 0;
  border: 1px solid rgba(255,255,255,.84);
  background: radial-gradient(circle at 30% 24%, #fff 0 8%, rgba(184,249,255,.82) 9% 21%, rgba(31,182,226,.66) 48%, rgba(3,56,128,.72) 100%);
  box-shadow: inset -3px -4px 8px rgba(0,31,86,.45), 0 0 18px rgba(83,231,246,.45);
  will-change: transform, opacity;
}
.is-leaving .liquid-origin-bubble { animation: nxOriginTravel .12s var(--nx-smooth) forwards !important; }
@keyframes nxOriginTravel {
  0% { opacity: 0; transform: translate3d(calc(var(--origin-x) - 8px), calc(var(--origin-y) - 8px), 0) scale(.2); }
  18% { opacity: .9; }
  100% { opacity: 0; transform: translate3d(calc(50vw - 8px), calc(7vh - 8px), 0) scale(.82); }
}

.liquid-drop-stage {
  position: absolute !important;
  inset: 0 !important;
  z-index: 10 !important;
  width: auto !important;
  height: auto !important;
  top: 0 !important;
  left: 0 !important;
  pointer-events: none !important;
}
.liquid-drop-3d {
  position: absolute !important;
  left: 50% !important;
  top: 7vh !important;
  width: 62px !important;
  height: 82px !important;
  opacity: 0 !important;
  transform: translate3d(-50%, -18px, 0) scale(.55,.74) !important;
  filter: drop-shadow(0 18px 22px rgba(0, 9, 35, .42));
  will-change: transform, opacity;
}
.liquid-drop-shell {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border: 1px solid rgba(236, 254, 255, .82) !important;
  border-radius: 72% 28% 69% 31% / 78% 30% 70% 22% !important;
  transform: rotate(45deg) !important;
  background:
    radial-gradient(circle at 26% 19%, rgba(255,255,255,.98) 0 5%, rgba(255,255,255,.48) 6% 17%, transparent 18%),
    radial-gradient(circle at 65% 68%, rgba(31,173,224,.28), transparent 45%),
    linear-gradient(145deg, rgba(229,253,255,.84), rgba(72,224,242,.62) 28%, rgba(9,127,205,.76) 67%, rgba(2,42,104,.88)) !important;
  box-shadow:
    inset 10px 9px 18px rgba(255,255,255,.76),
    inset -14px -18px 24px rgba(0,26,89,.48),
    0 18px 30px rgba(0,8,32,.38),
    0 0 25px rgba(73,230,247,.26) !important;
}
.liquid-drop-shell::before {
  content: "";
  position: absolute;
  inset: 8% 12% 48% 16%;
  border-radius: 50%;
  background: linear-gradient(140deg, rgba(255,255,255,.9), rgba(255,255,255,.08));
  filter: blur(.2px);
}
.liquid-drop-shell::after {
  content: "";
  position: absolute;
  left: -22%;
  right: -22%;
  bottom: 12%;
  height: 35%;
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(129,245,255,.08), rgba(0,78,174,.42));
  transform: rotate(-4deg);
  box-shadow: 0 -2px 7px rgba(218,252,255,.54);
}
.liquid-drop-shell > img { opacity: .18 !important; filter: saturate(.85) contrast(1.15) !important; }
.liquid-drop-preview {
  z-index: 5 !important;
  top: 58% !important;
  width: 138% !important;
  color: rgba(239,254,255,.82) !important;
  font: 700 8px/1.1 "Manrope", sans-serif !important;
  letter-spacing: .01em !important;
  text-shadow: 0 2px 8px rgba(0,23,70,.55) !important;
  opacity: .74 !important;
}
.is-leaving .liquid-drop-3d { animation: nxDropFall .25s .06s cubic-bezier(.2,.72,.22,1) forwards !important; }
@keyframes nxDropFall {
  0% { opacity: 0; transform: translate3d(-50%, -18px, 0) rotate(-2deg) scale(.55,.74); }
  18% { opacity: 1; transform: translate3d(-50%, 0, 0) rotate(-1deg) scale(.92,1.02); }
  72% { opacity: 1; transform: translate3d(-50%, 42vh, 0) rotate(0) scale(.87,1.20); }
  100% { opacity: .08; transform: translate3d(-50%, 46vh, 0) rotate(0) scale(1.38,.24); }
}

.liquid-impact-bloom,
.liquid-ripple-set,
.liquid-splash,
.liquid-surface-line {
  position: absolute !important;
  left: var(--impact-x) !important;
  top: var(--impact-y) !important;
  z-index: 11 !important;
  pointer-events: none !important;
}
.liquid-impact-bloom {
  width: 42px !important;
  height: 18px !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  transform: translate(-50%,-50%) scale(.2) !important;
  background: radial-gradient(ellipse, rgba(238,255,255,.96), rgba(84,232,245,.44) 40%, transparent 72%) !important;
  filter: blur(.2px) !important;
}
.is-leaving .liquid-impact-bloom { animation: nxImpact .15s .295s ease-out forwards !important; }
@keyframes nxImpact {
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.2); }
  28% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(7.2,2.55); }
}
.liquid-ripple-set { width: 1px !important; height: 1px !important; }
.liquid-ripple-set i {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 76px !important;
  height: 24px !important;
  margin: -12px 0 0 -38px !important;
  border: 1.5px solid rgba(175,249,255,.82) !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  box-shadow: 0 0 12px rgba(68,224,242,.32) !important;
}
.is-leaving .liquid-ripple-set i { animation: nxRipple .22s .30s ease-out forwards !important; }
.is-leaving .liquid-ripple-set i:nth-child(2) { animation-delay: .325s !important; }
.is-leaving .liquid-ripple-set i:nth-child(3) { animation-delay: .35s !important; }
@keyframes nxRipple {
  0% { opacity: 0; transform: scale(.16); }
  24% { opacity: .9; }
  100% { opacity: 0; transform: scale(5.8,2.4); }
}
.liquid-splash { width: 1px !important; height: 1px !important; }
.liquid-splash i {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 5px !important;
  height: 15px !important;
  margin: -7px 0 0 -2px !important;
  border-radius: 70% 30% 65% 35% !important;
  background: linear-gradient(#dffeff, #42dced) !important;
  opacity: 0 !important;
  transform-origin: 50% 100% !important;
}
.is-leaving .liquid-splash i { animation: nxSplash .18s .30s ease-out forwards !important; }
.liquid-splash i:nth-child(1) { --a:-72deg; --d:34px; }
.liquid-splash i:nth-child(2) { --a:-51deg; --d:44px; }
.liquid-splash i:nth-child(3) { --a:-29deg; --d:30px; }
.liquid-splash i:nth-child(4) { --a:-10deg; --d:46px; }
.liquid-splash i:nth-child(5) { --a:12deg; --d:42px; }
.liquid-splash i:nth-child(6) { --a:31deg; --d:31px; }
.liquid-splash i:nth-child(7) { --a:52deg; --d:45px; }
.liquid-splash i:nth-child(8) { --a:73deg; --d:34px; }
@keyframes nxSplash {
  0% { opacity: 0; transform: rotate(var(--a)) translateY(0) scaleY(.25); }
  22% { opacity: .9; }
  100% { opacity: 0; transform: rotate(var(--a)) translateY(calc(-1 * var(--d))) scaleY(.8); }
}
.liquid-surface-line {
  width: 190px;
  height: 2px;
  opacity: 0;
  transform: translate(-50%,-50%) scaleX(.1);
  border-radius: 50%;
  background: linear-gradient(90deg, transparent, rgba(211,253,255,.85), transparent);
  box-shadow: 0 0 12px rgba(79,225,242,.4);
}
.is-leaving .liquid-surface-line { animation: nxSurface .18s .29s ease-out forwards !important; }
@keyframes nxSurface { 35% { opacity: .9; } 100% { opacity: 0; transform: translate(-50%,-50%) scaleX(2.2); } }

.liquid-transition-copy {
  position: absolute !important;
  z-index: 13 !important;
  left: 50% !important;
  top: calc(var(--impact-y) + 72px) !important;
  width: min(320px, 78vw) !important;
  transform: translate(-50%, 9px) !important;
  opacity: 0 !important;
  text-align: center !important;
}
.liquid-transition-copy span { font-size: 8px !important; letter-spacing: .16em !important; opacity: .62 !important; }
.liquid-transition-copy strong { margin-top: 4px !important; font: 600 clamp(16px, 1.55vw, 21px)/1.2 "Manrope", sans-serif !important; letter-spacing: -.01em !important; }
.is-leaving .liquid-transition-copy { animation: nxCopy .18s .30s var(--nx-ease) forwards !important; }
@keyframes nxCopy { to { opacity: .92; transform: translate(-50%,0); } }

.liquid-reveal-curtain {
  position: absolute !important;
  inset: 0 !important;
  z-index: 20 !important;
  opacity: 1 !important;
  clip-path: circle(0 at var(--impact-x) var(--impact-y)) !important;
  -webkit-clip-path: circle(0 at var(--impact-x) var(--impact-y)) !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  background:
    radial-gradient(circle at var(--impact-x) var(--impact-y), rgba(79,229,244,.38), transparent 15%),
    repeating-radial-gradient(ellipse at var(--impact-x) var(--impact-y), transparent 0 28px, rgba(113,235,248,.055) 29px 30px, transparent 31px 60px),
    linear-gradient(145deg, #010817, #03264f 58%, #07536f) !important;
  will-change: clip-path, -webkit-mask-image, mask-image;
}
.is-leaving .liquid-reveal-curtain { animation: nxPortalCover .095s .375s var(--nx-smooth) forwards !important; }
@keyframes nxPortalCover { to { clip-path: circle(155vmax at var(--impact-x) var(--impact-y)); -webkit-clip-path: circle(155vmax at var(--impact-x) var(--impact-y)); } }

/* The destination starts fully covered, then a circular liquid hole reveals it. */
.liquid-arrival-pending .liquid-reveal-curtain,
.liquid-back-pending .liquid-reveal-curtain {
  clip-path: circle(155vmax at 50% 50%) !important;
  -webkit-clip-path: circle(155vmax at 50% 50%) !important;
}
.page-liquid-transition.is-arriving .liquid-reveal-curtain {
  --nx-portal-hole: 0px;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent 0 var(--nx-portal-hole), #000 calc(var(--nx-portal-hole) + 2px)) !important;
  mask-image: radial-gradient(circle at 50% 50%, transparent 0 var(--nx-portal-hole), #000 calc(var(--nx-portal-hole) + 2px)) !important;
  animation: nxPortalReveal .17s var(--nx-ease) forwards !important;
}
@keyframes nxPortalReveal { to { --nx-portal-hole: 155vmax; } }
.page-liquid-transition.is-arriving .liquid-drop-stage,
.page-liquid-transition.is-arriving .liquid-origin-bubble,
.page-liquid-transition.is-arriving .liquid-transition-copy { display: none !important; }
.liquid-arrival-brand { display: none !important; }

.page-liquid-transition.is-back-arriving {
  background: rgba(1,18,40,.48) !important;
  animation: nxBackOverlay .18s ease-out forwards !important;
}
.page-liquid-transition.is-back-arriving .liquid-transition-bg { opacity: .52 !important; }
.page-liquid-transition.is-back-arriving .liquid-reveal-curtain {
  --nx-portal-hole: 0px;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  -webkit-mask-image: radial-gradient(circle at 50% 48%, transparent 0 var(--nx-portal-hole), #000 calc(var(--nx-portal-hole) + 2px)) !important;
  mask-image: radial-gradient(circle at 50% 48%, transparent 0 var(--nx-portal-hole), #000 calc(var(--nx-portal-hole) + 2px)) !important;
  animation: nxBackHole .18s var(--nx-ease) forwards !important;
}
@keyframes nxBackOverlay { to { opacity: 0; visibility: hidden; } }
@keyframes nxBackHole { to { --nx-portal-hole: 155vmax; } }

html.liquid-navigation-locked body > :not(.page-liquid-transition) {
  transition: filter .10s ease, transform .18s var(--nx-ease), opacity .10s ease !important;
}
html.liquid-navigation-locked:has(.page-liquid-transition.is-leaving) body > :not(.page-liquid-transition) {
  filter: blur(2px) brightness(.82) saturate(.92) !important;
  transform: scale(.998) !important;
}
.liquid-arrival-pending main { opacity: .90 !important; transform: translateY(6px) !important; }
html.page-arriving main { animation: nxPageSettle .34s var(--nx-ease) both; }
@keyframes nxPageSettle { from { opacity: .82; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---------- First-visit intro: visible logo, short cinematic fall and ripple ---------- */
.aqua-intro {
  z-index: 2147482900 !important;
  background:
    radial-gradient(circle at 50% 46%, rgba(32,195,226,.23), transparent 24%),
    radial-gradient(circle at 50% 112%, rgba(52,222,239,.17), transparent 42%),
    linear-gradient(145deg, #010817, #03264e 60%, #07516d) !important;
}
.aqua-intro::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 64%;
  width: min(540px, 86vw);
  height: 110px;
  transform: translate(-50%,-50%) rotateX(67deg);
  border-radius: 50%;
  border: 1px solid rgba(128,241,252,.18);
  box-shadow: 0 0 70px rgba(48,203,230,.15);
  animation: nxIntroSurface 1.55s ease-out both;
}
.aqua-intro .intro-core { width: min(360px, 84vw) !important; height: 360px !important; transform: none !important; }
.aqua-intro .intro-core img {
  width: 190px !important;
  opacity: .14;
  transform: translateY(6px) scale(.92);
  filter: drop-shadow(0 16px 34px rgba(27,188,221,.25));
  animation: nxIntroLogo 1.35s .15s var(--nx-ease) both !important;
}
.aqua-intro .intro-core p {
  margin-top: 168px !important;
  font: 500 12px/1.3 "Inter", sans-serif !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: rgba(219,250,255,.72) !important;
  animation: nxIntroText .65s .45s ease-out both !important;
}
.aqua-intro .intro-drop {
  width: 28px !important;
  height: 38px !important;
  top: 16px !important;
  opacity: 0;
  animation: nxIntroDrop 1.18s .16s cubic-bezier(.2,.72,.22,1) both !important;
}
.aqua-intro .intro-rings { top: 64% !important; }
.aqua-intro .intro-rings i { animation-duration: .58s !important; }
.aqua-intro .intro-rings i:nth-child(1) { animation-delay: .93s !important; }
.aqua-intro .intro-rings i:nth-child(2) { animation-delay: 1.00s !important; }
.aqua-intro .intro-rings i:nth-child(3) { animation-delay: 1.07s !important; }
.aqua-intro .intro-skip {
  right: 20px !important;
  top: 18px !important;
  padding: 7px 12px !important;
  font-size: 10px !important;
  color: rgba(233,253,255,.66) !important;
  background: rgba(255,255,255,.045) !important;
}
@keyframes nxIntroLogo {
  0% { opacity: .14; transform: translateY(6px) scale(.92); filter: blur(2px) drop-shadow(0 16px 34px rgba(27,188,221,.2)); }
  38% { opacity: .98; transform: translateY(0) scale(1); filter: blur(0) drop-shadow(0 16px 34px rgba(27,188,221,.28)); }
  78% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(38px) scale(.78); }
}
@keyframes nxIntroText { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@keyframes nxIntroDrop {
  0% { opacity: 0; transform: translate(-50%,-18px) rotate(45deg) scale(.55,.72); }
  24% { opacity: 1; }
  76% { opacity: 1; transform: translate(-50%,196px) rotate(45deg) scale(.9,1.15); }
  100% { opacity: 0; transform: translate(-50%,216px) rotate(45deg) scale(1.4,.24); }
}
@keyframes nxIntroSurface { 0%,55% { opacity: .2; transform: translate(-50%,-50%) rotateX(67deg) scale(.5); } 100% { opacity: 0; transform: translate(-50%,-50%) rotateX(67deg) scale(1.5); } }

/* Page-specific animation remains subtle and purposeful. */
.subpage .page-hero::after { opacity: .16 !important; animation-duration: 22s !important; }
.about-page .page-hero-art img,
.industries-page .page-hero-art img,
.technologies-page .page-hero-art img,
.sustainability-page .page-hero-art img,
.sustainability-page .impact-globe img { animation-duration: 8s !important; }
.projects-page .project-card:hover::after { transform: scale(1.18) !important; }

/* Mobile: compact and lighter; hero visual stays visible without oversized text. */
@media (max-width: 900px) {
  .container { width: min(100% - 36px, 1160px) !important; }
  .hero { min-height: auto !important; padding-top: 96px !important; padding-bottom: 46px !important; }
  .hero-grid { grid-template-columns: 1fr !important; gap: 18px !important; }
  .hero-copy { text-align: center !important; }
  .hero-copy > p { margin-inline: auto !important; }
  .hero-actions, .hero-proof, .hero-trust { justify-content: center !important; }
  .hero-visual { min-height: 335px !important; }
  .page-hero { min-height: auto !important; padding: 102px 0 54px !important; }
  .page-hero-grid { grid-template-columns: 1fr !important; gap: 25px !important; }
  .page-hero-art { min-height: 245px !important; }
  .page-hero-art img { max-height: 255px !important; }
  .section { padding-top: 64px !important; padding-bottom: 64px !important; }
  .nav-shell { height: 66px !important; min-height: 66px !important; }
  .brand img, .logo img { width: 84px !important; height: 50px !important; }
  .nav-links { background: rgba(2,24,52,.97) !important; backdrop-filter: blur(18px) !important; }
}

@media (max-width: 620px) {
  .container { width: min(100% - 28px, 1160px) !important; }
  .home-page .hero h1 {
    max-width: 360px;
    margin-inline: auto;
    font-size: clamp(34px, 9.5vw, 39px) !important;
    line-height: 1.09 !important;
    letter-spacing: -.032em !important;
  }
  .home-page .hero-copy > p { max-width: 355px; font-size: 15.5px !important; line-height: 1.66 !important; }
  .page-hero h1 { font-size: clamp(31px, 8.9vw, 37px) !important; }
  .section-title { font-size: clamp(27px, 7.6vw, 32px) !important; }
  .section-copy { font-size: 15px !important; }
  .hero-actions { gap: 10px !important; }
  .hero-actions .btn { width: min(100%, 286px) !important; }
  .hero-proof, .hero-live-status { display: none !important; }
  .hero-visual { min-height: 265px !important; margin-top: 2px !important; }
  .water-scene { transform: scale(.86); transform-origin: top center; }
  .page-hero-art { min-height: 205px !important; }
  .section { padding-top: 56px !important; padding-bottom: 56px !important; }
  .btn { min-height: 42px !important; font-size: 13.5px !important; }
  .liquid-origin-bubble { display: none !important; }
  .liquid-drop-3d { width: 50px !important; height: 67px !important; top: 7vh !important; }
  .is-leaving .liquid-drop-3d { animation-duration: .20s !important; animation-delay: .045s !important; }
  .is-leaving .liquid-impact-bloom { animation-delay: .235s !important; animation-duration: .12s !important; }
  .is-leaving .liquid-ripple-set i,
  .is-leaving .liquid-splash i,
  .is-leaving .liquid-surface-line { animation-delay: .235s !important; }
  .is-leaving .liquid-reveal-curtain { animation-delay: .29s !important; animation-duration: .05s !important; }
  .liquid-transition-copy { display: none !important; }
  .page-liquid-transition.is-arriving .liquid-reveal-curtain { animation-duration: .13s !important; }
  .aqua-intro .intro-core { width: min(310px, 86vw) !important; height: 320px !important; }
  .aqua-intro .intro-core img { width: 160px !important; }
}

/* Low-performance mode keeps the signature, removes expensive continuous effects. */
html.low-motion .scene-orbit,
html.low-motion .scene-blueprint,
html.low-motion .caustic-layer,
html.low-motion #water-canvas { display: none !important; }
html.low-motion [data-tilt] { transform: none !important; }
html.low-motion .subpage .page-hero::after { animation: none !important; }
html.low-motion .page-liquid-transition .liquid-splash i:nth-child(n+5) { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .aqua-intro { display: none !important; }
  .page-liquid-transition .liquid-origin-bubble,
  .page-liquid-transition .liquid-drop-stage,
  .page-liquid-transition .liquid-transition-copy { display: none !important; }
  .page-liquid-transition.is-leaving .liquid-transition-bg { animation: nxReducedCover .15s ease forwards !important; }
  .page-liquid-transition.is-leaving .liquid-reveal-curtain { animation: none !important; clip-path: circle(155vmax at 50% 50%) !important; }
  .page-liquid-transition.is-arriving .liquid-reveal-curtain { animation-duration: .16s !important; }
  [data-tilt], .page-hero-art img, .impact-globe img { transform: none !important; animation: none !important; }
}
@keyframes nxReducedCover { to { opacity: 1; } }

/* V5 QA refinements: remove double hero padding and keep the mobile scene compact. */
.home-page .hero-grid {
  grid-template-columns: minmax(0, 1.13fr) minmax(385px, .87fr) !important;
  gap: 30px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.home-page .hero h1 { max-width: 675px !important; font-size: clamp(41px, 4vw, 55px) !important; }
.hero-visual { min-height: 455px !important; }
.water-scene { width: min(570px, 100%) !important; }

/* Tighter 400 ms outgoing timeline; destination reveal completes the signature transition. */
.is-leaving .liquid-drop-3d { animation-duration: .22s !important; animation-delay: .05s !important; }
.is-leaving .liquid-impact-bloom { animation-duration: .125s !important; animation-delay: .255s !important; }
.is-leaving .liquid-ripple-set i { animation-duration: .18s !important; animation-delay: .26s !important; }
.is-leaving .liquid-ripple-set i:nth-child(2) { animation-delay: .28s !important; }
.is-leaving .liquid-ripple-set i:nth-child(3) { animation-delay: .30s !important; }
.is-leaving .liquid-splash i { animation-duration: .15s !important; animation-delay: .26s !important; }
.is-leaving .liquid-surface-line { animation-duration: .15s !important; animation-delay: .255s !important; }
.is-leaving .liquid-transition-copy { animation-duration: .14s !important; animation-delay: .27s !important; }
.is-leaving .liquid-reveal-curtain { animation-duration: .07s !important; animation-delay: .33s !important; }
.page-liquid-transition.is-arriving .liquid-reveal-curtain { animation-duration: .135s !important; }

@media (max-width: 900px) {
  .home-page .hero-grid { grid-template-columns: 1fr !important; padding: 0 !important; }
}

@media (max-width: 620px) {
  .home-page .hero { padding-top: 86px !important; padding-bottom: 34px !important; }
  .home-page .hero-grid { gap: 12px !important; padding: 0 !important; }
  .home-page .hero h1 { max-width: 358px !important; font-size: clamp(32px, 8.8vw, 35px) !important; line-height: 1.1 !important; }
  .home-page .hero-copy > p { max-width: 350px !important; font-size: 15px !important; }
  .hero-visual { min-height: 275px !important; height: 275px !important; overflow: hidden !important; margin-top: 0 !important; }
  .water-scene {
    width: min(315px, 92vw) !important;
    height: 275px !important;
    aspect-ratio: auto !important;
    margin: 0 auto !important;
    transform: none !important;
  }
  .scene-metric, .scene-caption { display: none !important; }
  .scene-blueprint { inset: 4% !important; }
  .scene-aura { inset: 4% 2% 0 !important; }
  .fallback-drop-svg { width: 52% !important; top: 47% !important; }
  .fallback-ripple { width: 54% !important; bottom: 10% !important; }
  .water-scene-logo { width: 31% !important; top: 50% !important; }
  .is-leaving .liquid-drop-3d { animation-duration: .18s !important; animation-delay: .04s !important; }
  .is-leaving .liquid-impact-bloom { animation-duration: .10s !important; animation-delay: .215s !important; }
  .is-leaving .liquid-ripple-set i,
  .is-leaving .liquid-splash i,
  .is-leaving .liquid-surface-line { animation-delay: .22s !important; }
  .is-leaving .liquid-reveal-curtain { animation-duration: .05s !important; animation-delay: .265s !important; }
  .page-liquid-transition.is-arriving .liquid-reveal-curtain { animation-duration: .11s !important; }
}

/* V5.2 overlapped navigation: the outgoing portal continues while the next
   document is already being requested, then the arrival veil clears quickly. */
.page-liquid-transition.is-arriving .liquid-reveal-curtain {
  animation-duration: .09s !important;
}
@media (max-width: 620px) {
  .page-liquid-transition.is-arriving .liquid-reveal-curtain {
    animation-duration: .075s !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition.is-arriving .liquid-reveal-curtain {
    animation-duration: .105s !important;
  }
}

@media (max-width: 620px) {
  .page-liquid-transition.is-arriving .liquid-reveal-curtain {
    animation-duration: .058s !important;
  }
}

/* Navigation requests begin while this outgoing animation continues. */
.page-liquid-transition.is-arriving .liquid-reveal-curtain {
  animation-duration: .07s !important;
}
@media (max-width: 620px) {
  .page-liquid-transition.is-arriving .liquid-reveal-curtain {
    animation-duration: .045s !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition.is-arriving .liquid-reveal-curtain {
    animation-duration: .07s !important;
  }
}

/* ==========================================================================\n   NEXAQUA V6 DEFINITIVE OVERRIDES\n   Visible water-drop navigation, restrained typography and premium spacing.\n   ========================================================================== */

:root {
  --nx6-deep: #020d1f;
  --nx6-navy: #032b55;
  --nx6-blue: #0877bf;
  --nx6-cyan: #35d8ed;
  --nx6-mist: #eafaff;
  --nx6-ease: cubic-bezier(.22,.72,.2,1);
}

body {
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.68 !important;
}
h1, h2, h3, h4, h5, h6, .stat-number, .form-title {
  font-family: "Manrope", "Inter", system-ui, sans-serif !important;
}

/* Smaller, cleaner type scale. */
.home-page .hero h1,
.hero h1 {
  max-width: 700px !important;
  margin: 18px 0 18px !important;
  font-size: clamp(40px, 4.35vw, 58px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.035em !important;
  font-weight: 700 !important;
}
.home-page .hero h1 .accent,
.hero h1 .accent { display: inline !important; }
.hero-copy > p {
  max-width: 590px !important;
  font-size: clamp(15.5px, 1.18vw, 17.5px) !important;
  line-height: 1.72 !important;
}
.page-hero h1 {
  max-width: 700px !important;
  font-size: clamp(36px, 3.55vw, 48px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.03em !important;
  font-weight: 700 !important;
}
.page-hero p { max-width: 650px !important; font-size: clamp(15.5px, 1.2vw, 17.5px) !important; }
.section-title {
  max-width: 760px !important;
  font-size: clamp(29px, 2.8vw, 39px) !important;
  line-height: 1.17 !important;
  letter-spacing: -.025em !important;
  font-weight: 700 !important;
}
.section-copy { max-width: 680px !important; font-size: 15.5px !important; line-height: 1.72 !important; }
.info-card h3, .process-card h3, .value-card h3, .industry-card h3, .project-card h3 {
  font-size: clamp(17px, 1.28vw, 20px) !important;
  line-height: 1.32 !important;
  font-weight: 600 !important;
}
.info-card p, .process-card p, .value-card p, .industry-card p, .project-card p { font-size: 14.5px !important; line-height: 1.66 !important; }
.form-title { font-size: clamp(26px, 2.5vw, 35px) !important; }
.cta-inner h2 { font-size: clamp(27px, 2.6vw, 38px) !important; }

/* Compact premium header. */
.nav-shell { height: 72px !important; min-height: 72px !important; gap: 18px !important; }
.brand img { width: 98px !important; height: 58px !important; }
.nav-links { gap: 1px !important; }
.nav-links a {
  position: relative !important;
  padding: 8px 9px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: 10px !important;
  background: transparent !important;
}
.nav-links a::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 3px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--aqua-500), transparent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .28s var(--nx6-ease);
}
.nav-links a:hover::after, .nav-links a.active::after { transform: scaleX(1); }
.header-actions .btn { min-height: 38px !important; padding-inline: 14px !important; font-size: 12.5px !important; }
.btn { min-height: 43px !important; padding: 0 18px !important; font-size: 14px !important; font-weight: 600 !important; }

/* Deliberate spacing: premium, not oversized. */
.hero { min-height: 720px !important; }
.hero-grid {
  padding-top: 112px !important;
  padding-bottom: 54px !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(390px, .95fr) !important;
  gap: 34px !important;
}
.hero-visual { min-height: 470px !important; }
.section { padding-top: 82px !important; padding-bottom: 82px !important; }
.section-sm { padding-top: 62px !important; padding-bottom: 62px !important; }
.section-head { margin-bottom: 34px !important; }

/* Refined glass and 3D depth. */
.info-card, .process-card, .value-card, .industry-card, .project-card, .stat-card, .calculator-shell, .contact-panel, .form-shell {
  border: 1px solid rgba(108, 216, 239, .22) !important;
  box-shadow: 0 18px 55px rgba(2, 43, 83, .09) !important;
  transform-style: preserve-3d;
}
[data-tilt] { transition: transform .28s var(--nx6-ease), box-shadow .28s ease, border-color .28s ease !important; }
[data-tilt]:hover {
  transform: translateY(-4px) rotateX(1.2deg) rotateY(-1.2deg) scale(1.012) !important;
  border-color: rgba(53, 216, 237, .45) !important;
  box-shadow: 0 24px 70px rgba(2, 43, 83, .14) !important;
}

/* --------------------------------------------------------------------------
   Signature page transition: drop from top, impact, ripple, liquid portal.
   -------------------------------------------------------------------------- */
.page-liquid-transition {
  --origin-x: 50vw;
  --origin-y: 36px;
  --impact-x: 50vw;
  --impact-y: 52vh;
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  overflow: hidden !important;
  background: transparent !important;
  isolation: isolate !important;
}
.page-liquid-transition.nx-leave,
.page-liquid-transition.nx-enter,
.page-liquid-transition.nx-back,
.page-liquid-transition.nx-fade-out,
.liquid-arrival-pending .page-liquid-transition,
.liquid-back-pending .page-liquid-transition {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.liquid-transition-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  opacity: 0 !important;
  background:
    radial-gradient(circle at 50% 38%, rgba(53,216,237,.14), transparent 29%),
    linear-gradient(150deg, rgba(1,8,24,.72), rgba(2,35,71,.76)) !important;
  backdrop-filter: blur(0) saturate(1) !important;
}
.nx-leave .liquid-transition-bg {
  animation: nx6Dim 170ms ease-out forwards !important;
}
@keyframes nx6Dim {
  to { opacity: 1; backdrop-filter: blur(3px) saturate(.88); }
}

.liquid-origin-bubble {
  position: fixed !important;
  z-index: 5 !important;
  left: var(--origin-x) !important;
  top: var(--origin-y) !important;
  width: 14px !important;
  height: 14px !important;
  margin: -7px 0 0 -7px !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  background: radial-gradient(circle at 30% 25%, #fff, #85eff8 18%, rgba(10,154,207,.92) 58%, rgba(5,64,116,.82)) !important;
  box-shadow: inset 2px 2px 4px rgba(255,255,255,.72), 0 0 22px rgba(53,216,237,.75) !important;
}
.nx-leave .liquid-origin-bubble { animation: nx6BubbleTravel 150ms var(--nx6-ease) forwards !important; }
@keyframes nx6BubbleTravel {
  0% { opacity: 0; transform: scale(.35); }
  20% { opacity: 1; }
  100% { opacity: 0; left: 50%; top: 48px; transform: scale(1.05); }
}

.liquid-drop-stage {
  position: absolute !important;
  inset: 0 !important;
  z-index: 8 !important;
  pointer-events: none !important;
}
.liquid-drop-3d {
  position: absolute !important;
  z-index: 10 !important;
  left: 50% !important;
  top: 0 !important;
  width: 88px !important;
  height: 116px !important;
  opacity: 0 !important;
  transform-origin: 50% 80% !important;
  filter: drop-shadow(0 18px 20px rgba(0,22,50,.38)) drop-shadow(0 0 18px rgba(70,225,242,.32)) !important;
  will-change: transform, opacity !important;
}
.liquid-drop-shell {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: 62% 38% 66% 34% / 70% 39% 61% 30% !important;
  transform: rotate(45deg) !important;
  border: 1px solid rgba(255,255,255,.88) !important;
  background:
    radial-gradient(circle at 28% 23%, rgba(255,255,255,.98) 0 6%, rgba(255,255,255,.45) 7% 16%, transparent 17%),
    radial-gradient(circle at 70% 72%, rgba(3,70,132,.72), transparent 44%),
    linear-gradient(135deg, rgba(255,255,255,.85), rgba(135,240,250,.58) 23%, rgba(31,188,224,.84) 58%, rgba(5,80,150,.95)) !important;
  box-shadow:
    inset 11px 11px 18px rgba(255,255,255,.52),
    inset -17px -20px 29px rgba(1,42,92,.48),
    0 0 0 1px rgba(95,225,244,.22) !important;
}
.liquid-drop-shell::before {
  content: "";
  position: absolute;
  inset: 11px 13px 28px 10px;
  border-radius: 55% 45% 58% 42%;
  border: 1px solid rgba(255,255,255,.42);
  background: linear-gradient(120deg, rgba(255,255,255,.26), transparent 45%);
}
.liquid-drop-shell::after {
  content: "";
  position: absolute;
  left: 15px;
  top: 13px;
  width: 25px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  filter: blur(5px);
  transform: rotate(-18deg);
}
.liquid-drop-shell > img {
  position: absolute !important;
  width: 51px !important;
  height: 51px !important;
  left: 50% !important;
  top: 54% !important;
  object-fit: contain !important;
  opacity: .34 !important;
  transform: translate(-50%,-50%) rotate(-45deg) !important;
  filter: saturate(.85) contrast(.9) !important;
}
.liquid-drop-preview {
  position: absolute !important;
  left: 50% !important;
  bottom: 13px !important;
  max-width: 68px !important;
  transform: translateX(-50%) rotate(-45deg) !important;
  color: rgba(232,253,255,.72) !important;
  font: 600 7px/1.1 "Inter", sans-serif !important;
  white-space: nowrap !important;
  opacity: .7 !important;
}
.nx-leave .liquid-drop-3d { animation: nx6DropFall 440ms 70ms cubic-bezier(.18,.69,.19,1) both !important; }
@keyframes nx6DropFall {
  0% { opacity: 0; transform: translate3d(-50%,-130px,0) scale(.55,.76); }
  12% { opacity: 1; }
  68% { opacity: 1; transform: translate3d(-50%,calc(var(--impact-y) - 112px),0) scale(.9,1.17); }
  82% { opacity: 1; transform: translate3d(-50%,calc(var(--impact-y) - 82px),0) scale(1.34,.38); }
  100% { opacity: 0; transform: translate3d(-50%,calc(var(--impact-y) - 76px),0) scale(1.8,.12); }
}

.liquid-impact-bloom {
  position: absolute !important;
  z-index: 9 !important;
  left: var(--impact-x) !important;
  top: var(--impact-y) !important;
  width: 42px !important;
  height: 18px !important;
  margin: -9px 0 0 -21px !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  background: radial-gradient(ellipse, rgba(227,254,255,.98), rgba(52,218,238,.64) 36%, transparent 72%) !important;
  box-shadow: 0 0 30px rgba(72,231,246,.66) !important;
}
.nx-leave .liquid-impact-bloom { animation: nx6Impact 170ms 420ms ease-out forwards !important; }
@keyframes nx6Impact {
  0% { opacity: 0; transform: scale(.3); }
  35% { opacity: 1; transform: scale(1.8,.7); }
  100% { opacity: 0; transform: scale(3.2,.22); }
}

.liquid-surface-line {
  position: absolute !important;
  z-index: 8 !important;
  left: var(--impact-x) !important;
  top: var(--impact-y) !important;
  width: min(250px, 52vw) !important;
  height: 2px !important;
  opacity: 0 !important;
  transform: translate(-50%,-50%) scaleX(.15) !important;
  background: linear-gradient(90deg, transparent, rgba(210,252,255,.94), transparent) !important;
  box-shadow: 0 0 14px rgba(54,222,239,.55) !important;
}
.nx-leave .liquid-surface-line { animation: nx6Surface 210ms 420ms ease-out forwards !important; }
@keyframes nx6Surface {
  30% { opacity: .95; }
  100% { opacity: 0; transform: translate(-50%,-50%) scaleX(2.1); }
}

.liquid-ripple-set {
  position: absolute !important;
  z-index: 8 !important;
  left: var(--impact-x) !important;
  top: var(--impact-y) !important;
  width: 1px !important;
  height: 1px !important;
}
.liquid-ripple-set i {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 74px !important;
  height: 25px !important;
  margin: -12px 0 0 -37px !important;
  border: 1.5px solid rgba(132,240,249,.78) !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  box-shadow: 0 0 18px rgba(63,225,240,.28) !important;
}
.nx-leave .liquid-ripple-set i:nth-child(1) { animation: nx6Ripple 260ms 420ms ease-out forwards !important; }
.nx-leave .liquid-ripple-set i:nth-child(2) { animation: nx6Ripple 300ms 455ms ease-out forwards !important; }
.nx-leave .liquid-ripple-set i:nth-child(3) { animation: nx6Ripple 340ms 490ms ease-out forwards !important; }
@keyframes nx6Ripple {
  0% { opacity: 0; transform: scale(.25); }
  22% { opacity: .9; }
  100% { opacity: 0; transform: scale(5.2,3.1); }
}

.liquid-splash {
  position: absolute !important;
  z-index: 11 !important;
  left: var(--impact-x) !important;
  top: var(--impact-y) !important;
  width: 1px !important;
  height: 1px !important;
}
.liquid-splash i {
  position: absolute !important;
  width: 8px !important;
  height: 12px !important;
  border-radius: 70% 30% 65% 35% !important;
  opacity: 0 !important;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(45,212,234,.82) 48%, rgba(5,98,169,.92)) !important;
  box-shadow: 0 0 12px rgba(65,224,241,.48) !important;
}
.nx-leave .liquid-splash i { animation: nx6Splash 260ms 425ms ease-out forwards !important; }
.liquid-splash i:nth-child(1) { --sx: -84px; --sy: -54px; transform: rotate(-25deg); }
.liquid-splash i:nth-child(2) { --sx: -55px; --sy: -76px; transform: rotate(-12deg) scale(.8); }
.liquid-splash i:nth-child(3) { --sx: -28px; --sy: -42px; transform: rotate(8deg) scale(.68); }
.liquid-splash i:nth-child(4) { --sx: 30px; --sy: -48px; transform: rotate(18deg) scale(.72); }
.liquid-splash i:nth-child(5) { --sx: 57px; --sy: -78px; transform: rotate(22deg) scale(.86); }
.liquid-splash i:nth-child(6) { --sx: 88px; --sy: -52px; transform: rotate(28deg); }
.liquid-splash i:nth-child(7) { --sx: -104px; --sy: -22px; transform: rotate(-36deg) scale(.6); }
.liquid-splash i:nth-child(8) { --sx: 108px; --sy: -20px; transform: rotate(38deg) scale(.62); }
@keyframes nx6Splash {
  0% { opacity: 0; translate: -4px 0; scale: .3; }
  20% { opacity: 1; }
  100% { opacity: 0; translate: var(--sx) var(--sy); scale: .75; }
}

.liquid-transition-copy {
  position: absolute !important;
  z-index: 13 !important;
  left: 50% !important;
  top: calc(var(--impact-y) + 62px) !important;
  width: min(330px, 78vw) !important;
  transform: translate(-50%,10px) !important;
  text-align: center !important;
  opacity: 0 !important;
  color: rgba(231,253,255,.78) !important;
}
.liquid-transition-copy span { display: block !important; font-size: 8px !important; letter-spacing: .16em !important; text-transform: uppercase !important; }
.liquid-transition-copy strong { display: block !important; margin-top: 4px !important; font: 600 18px/1.2 "Manrope", sans-serif !important; color: #fff !important; }
.nx-leave .liquid-transition-copy { animation: nx6Copy 200ms 455ms var(--nx6-ease) forwards !important; }
@keyframes nx6Copy { to { opacity: 1; transform: translate(-50%,0); } }

.liquid-reveal-curtain {
  position: absolute !important;
  inset: 0 !important;
  z-index: 20 !important;
  opacity: 1 !important;
  clip-path: circle(0 at var(--impact-x) var(--impact-y)) !important;
  background:
    radial-gradient(circle at var(--impact-x) var(--impact-y), rgba(58,219,237,.3), transparent 19%),
    radial-gradient(circle at 30% 18%, rgba(20,148,203,.16), transparent 28%),
    linear-gradient(145deg, #010817, #03284f 58%, #07536e) !important;
}
.nx-leave .liquid-reveal-curtain { animation: nx6PortalClose 170ms 500ms var(--nx6-ease) forwards !important; }
@keyframes nx6PortalClose { to { clip-path: circle(160vmax at var(--impact-x) var(--impact-y)); } }

/* Destination begins covered, then opens from the impact point. */
.liquid-arrival-pending .liquid-reveal-curtain,
.liquid-back-pending .liquid-reveal-curtain {
  clip-path: circle(160vmax at 50% 50%) !important;
}
.page-liquid-transition.nx-enter .liquid-transition-bg,
.page-liquid-transition.nx-back .liquid-transition-bg { opacity: 1 !important; }
.page-liquid-transition.nx-enter .liquid-reveal-curtain {
  animation: nx6PortalOpen 320ms var(--nx6-ease) forwards !important;
}
.page-liquid-transition.nx-back .liquid-reveal-curtain {
  animation: nx6PortalOpen 220ms ease-out forwards !important;
}
@keyframes nx6PortalOpen {
  from { clip-path: circle(160vmax at 50% 50%); }
  to { clip-path: circle(0 at 50% 50%); }
}
.page-liquid-transition.nx-enter .liquid-drop-stage,
.page-liquid-transition.nx-enter .liquid-origin-bubble,
.page-liquid-transition.nx-enter .liquid-transition-copy,
.page-liquid-transition.nx-back .liquid-drop-stage,
.page-liquid-transition.nx-back .liquid-origin-bubble,
.page-liquid-transition.nx-back .liquid-transition-copy { display: none !important; }
.liquid-arrival-brand { display: none !important; }

html.nx-page-leaving body > :not(.page-liquid-transition) {
  transition: filter 150ms ease, transform 250ms var(--nx6-ease) !important;
  filter: blur(2.5px) brightness(.76) saturate(.84) !important;
  transform: scale(.997) !important;
}
html.nx-page-entering main { animation: nx6PageSettle 420ms var(--nx6-ease) both !important; }
@keyframes nx6PageSettle {
  from { opacity: .72; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

.page-liquid-transition.nx-fade-out .liquid-transition-bg { opacity: 1 !important; }
.page-liquid-transition.nx-fade-out .liquid-reveal-curtain { clip-path: circle(160vmax at 50% 50%) !important; }

/* Intro made unmistakably visible without becoming slow. */
.aqua-intro { min-height: 100svh !important; }
.aqua-intro .intro-drop { width: 42px !important; height: 56px !important; }
.aqua-intro .intro-core img { width: 174px !important; }

@media (max-width: 1100px) {
  .nav-links a { padding-inline: 7px !important; font-size: 12.5px !important; }
  .header-actions .btn { display: none !important; }
}

@media (max-width: 900px) {
  .nav-shell { height: 66px !important; min-height: 66px !important; }
  .brand img { width: 86px !important; height: 50px !important; }
  .hero { min-height: auto !important; padding-top: 92px !important; padding-bottom: 42px !important; }
  .hero-grid { grid-template-columns: 1fr !important; gap: 14px !important; padding: 0 !important; }
  .hero-copy { text-align: center !important; }
  .hero-copy > p { margin-inline: auto !important; }
  .hero-actions { justify-content: center !important; margin-top: 24px !important; }
  .hero-visual { min-height: 320px !important; }
  .section { padding-top: 62px !important; padding-bottom: 62px !important; }
  .page-hero { padding-top: 94px !important; padding-bottom: 46px !important; }
}

@media (max-width: 700px) {
  .home-page .hero h1, .hero h1 {
    max-width: 360px !important;
    margin-inline: auto !important;
    font-size: clamp(32px, 9vw, 38px) !important;
    line-height: 1.1 !important;
    letter-spacing: -.028em !important;
  }
  .hero-copy > p { max-width: 350px !important; font-size: 15px !important; line-height: 1.68 !important; }
  .page-hero h1 { font-size: clamp(30px, 8.4vw, 36px) !important; }
  .section-title { font-size: clamp(26px, 7.3vw, 31px) !important; }
  .section-copy { font-size: 15px !important; }
  .hero-visual { min-height: 290px !important; }
  .hero-actions { gap: 9px !important; }
  .hero-actions .btn { width: min(100%, 285px) !important; }

  .liquid-origin-bubble { display: none !important; }
  .liquid-drop-3d { width: 64px !important; height: 86px !important; }
  .nx-leave .liquid-drop-3d { animation-duration: 330ms !important; animation-delay: 45ms !important; }
  .nx-leave .liquid-impact-bloom { animation-delay: 325ms !important; }
  .nx-leave .liquid-surface-line { animation-delay: 325ms !important; }
  .nx-leave .liquid-ripple-set i:nth-child(1) { animation-delay: 325ms !important; }
  .nx-leave .liquid-ripple-set i:nth-child(2) { animation-delay: 350ms !important; }
  .nx-leave .liquid-ripple-set i:nth-child(3) { animation-delay: 375ms !important; }
  .nx-leave .liquid-splash i { animation-delay: 330ms !important; }
  .nx-leave .liquid-transition-copy { animation-delay: 350ms !important; }
  .nx-leave .liquid-reveal-curtain { animation-delay: 385ms !important; animation-duration: 135ms !important; }
  .liquid-transition-copy { top: calc(var(--impact-y) + 50px) !important; }
  .liquid-transition-copy strong { font-size: 16px !important; }
  [data-tilt]:hover { transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition .liquid-origin-bubble,
  .page-liquid-transition .liquid-drop-stage,
  .page-liquid-transition .liquid-transition-copy { display: none !important; }
  .page-liquid-transition.nx-fade-out .liquid-transition-bg { transition: opacity 150ms ease !important; }
  html.nx-page-entering main { animation-duration: 180ms !important; }
}

/* V6.1 correction: neutralise legacy transform so the falling drop is truly centered. */
.liquid-drop-stage {
  width: auto !important;
  height: auto !important;
  transform: none !important;
  translate: none !important;
}
.home-page .hero h1,
.hero h1 { font-size: clamp(38px, 3.9vw, 52px) !important; max-width: 640px !important; }
.page-hero h1 { font-size: clamp(34px, 3.25vw, 44px) !important; }
.section-title { font-size: clamp(28px, 2.55vw, 36px) !important; }
@media (max-width: 700px) {
  .home-page .hero h1, .hero h1 { font-size: clamp(31px, 8.5vw, 36px) !important; }
  .page-hero h1 { font-size: clamp(29px, 7.9vw, 34px) !important; }
  .section-title { font-size: clamp(25px, 6.9vw, 29px) !important; }
}

/* V6.2: animate registered liquid variables so legacy !important rules cannot freeze motion. */
@property --nx6-bg-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-drop-y { syntax: "<length>"; inherits: false; initial-value: -130px; }
@property --nx6-drop-sx { syntax: "<number>"; inherits: false; initial-value: .55; }
@property --nx6-drop-sy { syntax: "<number>"; inherits: false; initial-value: .76; }
@property --nx6-drop-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-impact-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-impact-scale-x { syntax: "<number>"; inherits: false; initial-value: .3; }
@property --nx6-impact-scale-y { syntax: "<number>"; inherits: false; initial-value: .3; }
@property --nx6-surface-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-surface-scale { syntax: "<number>"; inherits: false; initial-value: .15; }
@property --nx6-ripple-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-ripple-x { syntax: "<number>"; inherits: false; initial-value: .25; }
@property --nx6-ripple-y { syntax: "<number>"; inherits: false; initial-value: .25; }
@property --nx6-splash-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-splash-x { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --nx6-splash-y { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --nx6-copy-alpha { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --nx6-copy-y { syntax: "<length>"; inherits: false; initial-value: 10px; }
@property --nx6-portal-radius { syntax: "<length>"; inherits: false; initial-value: 0px; }

.liquid-transition-bg {
  --nx6-bg-alpha: 0;
  opacity: var(--nx6-bg-alpha) !important;
}
.nx-leave .liquid-transition-bg { animation: nx6BgVariable 170ms ease-out forwards !important; }
@keyframes nx6BgVariable { to { --nx6-bg-alpha: 1; } }

.liquid-drop-3d {
  --nx6-drop-y: -130px;
  --nx6-drop-sx: .55;
  --nx6-drop-sy: .76;
  --nx6-drop-alpha: 0;
  top: 0 !important;
  opacity: var(--nx6-drop-alpha) !important;
  transform: translate3d(-50%, var(--nx6-drop-y), 0) scale(var(--nx6-drop-sx), var(--nx6-drop-sy)) !important;
  animation: none !important;
}
.nx-leave .liquid-drop-3d { animation: nx6DropVariables 440ms 70ms cubic-bezier(.18,.69,.19,1) both !important; }
@keyframes nx6DropVariables {
  0% { --nx6-drop-y: -130px; --nx6-drop-sx: .55; --nx6-drop-sy: .76; --nx6-drop-alpha: 0; }
  12% { --nx6-drop-alpha: 1; }
  68% { --nx6-drop-y: calc(var(--impact-y) - 112px); --nx6-drop-sx: .9; --nx6-drop-sy: 1.17; --nx6-drop-alpha: 1; }
  82% { --nx6-drop-y: calc(var(--impact-y) - 82px); --nx6-drop-sx: 1.34; --nx6-drop-sy: .38; --nx6-drop-alpha: 1; }
  100% { --nx6-drop-y: calc(var(--impact-y) - 76px); --nx6-drop-sx: 1.8; --nx6-drop-sy: .12; --nx6-drop-alpha: 0; }
}

.liquid-impact-bloom {
  --nx6-impact-alpha: 0;
  --nx6-impact-scale-x: .3;
  --nx6-impact-scale-y: .3;
  opacity: var(--nx6-impact-alpha) !important;
  transform: scale(var(--nx6-impact-scale-x), var(--nx6-impact-scale-y)) !important;
  animation: none !important;
}
.nx-leave .liquid-impact-bloom { animation: nx6ImpactVariables 170ms 420ms ease-out forwards !important; }
@keyframes nx6ImpactVariables {
  0% { --nx6-impact-alpha: 0; --nx6-impact-scale-x: .3; --nx6-impact-scale-y: .3; }
  35% { --nx6-impact-alpha: 1; --nx6-impact-scale-x: 1.8; --nx6-impact-scale-y: .7; }
  100% { --nx6-impact-alpha: 0; --nx6-impact-scale-x: 3.2; --nx6-impact-scale-y: .22; }
}

.liquid-surface-line {
  --nx6-surface-alpha: 0;
  --nx6-surface-scale: .15;
  opacity: var(--nx6-surface-alpha) !important;
  transform: translate(-50%,-50%) scaleX(var(--nx6-surface-scale)) !important;
  animation: none !important;
}
.nx-leave .liquid-surface-line { animation: nx6SurfaceVariables 210ms 420ms ease-out forwards !important; }
@keyframes nx6SurfaceVariables {
  0% { --nx6-surface-alpha: 0; --nx6-surface-scale: .15; }
  30% { --nx6-surface-alpha: .95; }
  100% { --nx6-surface-alpha: 0; --nx6-surface-scale: 2.1; }
}

.liquid-ripple-set i {
  --nx6-ripple-alpha: 0;
  --nx6-ripple-x: .25;
  --nx6-ripple-y: .25;
  opacity: var(--nx6-ripple-alpha) !important;
  transform: scale(var(--nx6-ripple-x), var(--nx6-ripple-y)) !important;
  animation: none !important;
}
.nx-leave .liquid-ripple-set i:nth-child(1) { animation: nx6RippleVariables 260ms 420ms ease-out forwards !important; }
.nx-leave .liquid-ripple-set i:nth-child(2) { animation: nx6RippleVariables 300ms 455ms ease-out forwards !important; }
.nx-leave .liquid-ripple-set i:nth-child(3) { animation: nx6RippleVariables 340ms 490ms ease-out forwards !important; }
@keyframes nx6RippleVariables {
  0% { --nx6-ripple-alpha: 0; --nx6-ripple-x: .25; --nx6-ripple-y: .25; }
  22% { --nx6-ripple-alpha: .9; }
  100% { --nx6-ripple-alpha: 0; --nx6-ripple-x: 5.2; --nx6-ripple-y: 3.1; }
}

.liquid-splash i {
  --nx6-splash-alpha: 0;
  --nx6-splash-x: 0px;
  --nx6-splash-y: 0px;
  opacity: var(--nx6-splash-alpha) !important;
  translate: var(--nx6-splash-x) var(--nx6-splash-y) !important;
  animation: none !important;
}
.nx-leave .liquid-splash i { animation: nx6SplashVariables 260ms 425ms ease-out forwards !important; }
@keyframes nx6SplashVariables {
  0% { --nx6-splash-alpha: 0; --nx6-splash-x: 0px; --nx6-splash-y: 0px; }
  20% { --nx6-splash-alpha: 1; }
  100% { --nx6-splash-alpha: 0; --nx6-splash-x: var(--sx); --nx6-splash-y: var(--sy); }
}

.liquid-transition-copy {
  --nx6-copy-alpha: 0;
  --nx6-copy-y: 10px;
  opacity: var(--nx6-copy-alpha) !important;
  transform: translate(-50%, var(--nx6-copy-y)) !important;
  animation: none !important;
}
.nx-leave .liquid-transition-copy { animation: nx6CopyVariables 200ms 455ms var(--nx6-ease) forwards !important; }
@keyframes nx6CopyVariables { to { --nx6-copy-alpha: 1; --nx6-copy-y: 0px; } }

.liquid-reveal-curtain {
  --nx6-portal-radius: 0px;
  clip-path: circle(var(--nx6-portal-radius) at var(--impact-x) var(--impact-y)) !important;
  -webkit-clip-path: circle(var(--nx6-portal-radius) at var(--impact-x) var(--impact-y)) !important;
  animation: none !important;
}
.nx-leave .liquid-reveal-curtain { animation: nx6PortalCloseVariables 170ms 500ms var(--nx6-ease) forwards !important; }
@keyframes nx6PortalCloseVariables { to { --nx6-portal-radius: 160vmax; } }

.liquid-arrival-pending .liquid-reveal-curtain,
.liquid-back-pending .liquid-reveal-curtain { --nx6-portal-radius: 160vmax; }
.page-liquid-transition.nx-enter .liquid-reveal-curtain {
  --nx6-portal-radius: 160vmax;
  animation: nx6PortalOpenVariables 320ms var(--nx6-ease) forwards !important;
}
.page-liquid-transition.nx-back .liquid-reveal-curtain {
  --nx6-portal-radius: 160vmax;
  animation: nx6PortalOpenVariables 220ms ease-out forwards !important;
}
@keyframes nx6PortalOpenVariables { to { --nx6-portal-radius: 0px; } }

@media (max-width: 700px) {
  .nx-leave .liquid-drop-3d { animation: nx6DropVariablesMobile 330ms 45ms cubic-bezier(.18,.69,.19,1) both !important; }
  @keyframes nx6DropVariablesMobile {
    0% { --nx6-drop-y: -96px; --nx6-drop-sx: .55; --nx6-drop-sy: .76; --nx6-drop-alpha: 0; }
    14% { --nx6-drop-alpha: 1; }
    70% { --nx6-drop-y: calc(var(--impact-y) - 86px); --nx6-drop-sx: .9; --nx6-drop-sy: 1.14; --nx6-drop-alpha: 1; }
    84% { --nx6-drop-y: calc(var(--impact-y) - 62px); --nx6-drop-sx: 1.28; --nx6-drop-sy: .38; --nx6-drop-alpha: 1; }
    100% { --nx6-drop-y: calc(var(--impact-y) - 58px); --nx6-drop-sx: 1.65; --nx6-drop-sy: .13; --nx6-drop-alpha: 0; }
  }
  .nx-leave .liquid-impact-bloom { animation-delay: 325ms !important; }
  .nx-leave .liquid-surface-line { animation-delay: 325ms !important; }
  .nx-leave .liquid-ripple-set i:nth-child(1) { animation-delay: 325ms !important; }
  .nx-leave .liquid-ripple-set i:nth-child(2) { animation-delay: 350ms !important; }
  .nx-leave .liquid-ripple-set i:nth-child(3) { animation-delay: 375ms !important; }
  .nx-leave .liquid-splash i { animation-delay: 330ms !important; }
  .nx-leave .liquid-transition-copy { animation-delay: 350ms !important; }
  .nx-leave .liquid-reveal-curtain { animation: nx6PortalCloseVariables 115ms 385ms var(--nx6-ease) forwards !important; }
}

/* V6.3: sharper teardrop silhouette instead of an oval bubble. */
.liquid-drop-shell {
  inset: auto !important;
  left: 50% !important;
  top: 13% !important;
  width: 76% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 0 58% 58% 58% !important;
  transform: translateX(-50%) rotate(45deg) !important;
  transform-origin: 50% 50% !important;
}
.liquid-drop-shell > img {
  width: 68% !important;
  height: 68% !important;
  left: 52% !important;
  top: 54% !important;
}
.liquid-drop-preview { bottom: 10% !important; }

/* V6.4: make the signature transition drop clearly noticeable. */
.liquid-drop-3d { width: 104px !important; height: 136px !important; }
@media (max-width: 700px) { .liquid-drop-3d { width: 70px !important; height: 94px !important; } }

/* ========================================================================== 
   NEXAQUA V7 — PHP 7.4 build visual polish
   Compact typography + page-specific signature water interactions
   ========================================================================== */
:root {
  --nx-v7-radius: 22px;
  --nx-v7-glass: rgba(255,255,255,.68);
  --nx-v7-border: rgba(51,193,229,.18);
}

body { font-size: 16px; }
.home-page .hero h1,
.hero h1 {
  font-size: clamp(37px, 3.5vw, 48px) !important;
  max-width: 600px !important;
  line-height: 1.06 !important;
  letter-spacing: -.042em !important;
}
.page-hero h1 {
  font-size: clamp(32px, 2.8vw, 40px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.036em !important;
  max-width: 760px !important;
}
.section-title {
  font-size: clamp(27px, 2.15vw, 33px) !important;
  line-height: 1.14 !important;
  letter-spacing: -.026em !important;
}
.page-hero p,
.section-copy { font-size: 16px !important; line-height: 1.68 !important; }
.service-card h3,
.info-card h3,
.project-card h3,
.industry-card h3 { font-size: 18px !important; line-height: 1.28 !important; }
.nav-shell { min-height: 72px !important; }
.brand img { max-height: 48px !important; width: auto !important; }
.nav-links a { font-size: 12.5px !important; padding: 8px 9px !important; }
.btn { min-height: 42px !important; padding: 0 17px !important; font-size: 13.5px !important; }
.section { padding-top: clamp(66px, 7vw, 96px) !important; padding-bottom: clamp(66px, 7vw, 96px) !important; }
.page-hero { min-height: 0 !important; padding-top: clamp(118px, 12vw, 150px) !important; padding-bottom: clamp(56px, 7vw, 88px) !important; }
.page-hero-grid { gap: clamp(30px, 5vw, 70px) !important; }
.page-hero-art { min-height: 330px !important; max-height: 430px !important; position: relative; isolation: isolate; }
.page-hero-art > img { position: relative; z-index: 1; max-height: 390px !important; filter: saturate(.92) contrast(1.02); }

/* Glass refinement without oversized cards */
.info-card,
.service-card,
.process-card,
.project-card,
.contact-form,
.contact-card,
.challenge-panel,
.tech-visual {
  border-radius: var(--nx-v7-radius) !important;
}
[data-tilt] { transform-style: preserve-3d; }
[data-tilt]::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at var(--spot-x, 20%) var(--spot-y, 0%), rgba(185,248,255,.18), transparent 34%);
  opacity: 0;
  transition: opacity .25s ease;
}
[data-tilt]:hover::after { opacity: .8; }

/* Hero signature host */
.page-hero-art.has-nx-signature { overflow: hidden; border-radius: 30px; }
.page-hero-art.has-nx-signature::before {
  content: "";
  position: absolute;
  inset: 9% 7%;
  z-index: 0;
  border-radius: 45% 55% 58% 42% / 44% 42% 58% 56%;
  background: radial-gradient(circle at 30% 18%, rgba(255,255,255,.95), rgba(99,225,245,.24) 24%, rgba(20,139,207,.12) 48%, transparent 70%);
  filter: blur(2px);
}
.nx-signature {
  --sig-x: 0px;
  --sig-y: 0px;
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  transform: translate3d(var(--sig-x),var(--sig-y),0);
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.nx-signature *, .nx-signature *::before, .nx-signature *::after { animation-play-state: paused !important; }
.nx-signature.is-active * { animation-play-state: running !important; }
.nx-signature.is-static * { animation: none !important; }

/* About — water-particle timeline orbit */
.nx-signature-about .nx-orbit-ring { position:absolute; left:50%; top:50%; border:1px solid rgba(63,216,239,.32); border-radius:50%; transform:translate(-50%,-50%); }
.nx-signature-about .ring-a { width:72%; aspect-ratio:1; animation:nxSpin 14s linear infinite; }
.nx-signature-about .ring-b { width:48%; aspect-ratio:1; border-style:dashed; animation:nxSpinReverse 10s linear infinite; }
.nx-signature-about .nx-drop-node { position:absolute; width:18px; height:24px; border-radius:62% 38% 60% 40% / 70% 40% 60% 30%; background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(56,211,236,.62) 45%,rgba(4,107,185,.75)); box-shadow:0 10px 24px rgba(0,91,167,.23), inset 3px 3px 7px rgba(255,255,255,.65); animation:nxFloat 4.5s ease-in-out infinite; }
.nx-signature-about .n1 { left:18%; top:30%; }.nx-signature-about .n2{right:14%;top:38%;animation-delay:-1.3s}.nx-signature-about .n3{left:48%;bottom:9%;animation-delay:-2.4s}
.nx-signature-core { position:absolute; left:50%; top:50%; width:110px; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; border:1px solid rgba(255,255,255,.72); background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.9),rgba(54,212,237,.24) 38%,rgba(8,84,159,.1) 70%); box-shadow:0 22px 55px rgba(0,64,126,.16), inset 0 0 24px rgba(255,255,255,.5); animation:nxPulse 4s ease-in-out infinite; }
.nx-signature-core span{position:absolute;inset:28%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 12%,#42d5ec 45%,#0879c8 100%);box-shadow:0 0 28px rgba(74,221,241,.42)}

/* Solutions — transparent engineering pipeline */
.nx-signature-solutions .nx-pipe { position:absolute; height:18px; border-radius:999px; border:1px solid rgba(255,255,255,.72); background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(69,206,235,.18)); box-shadow:inset 0 3px 6px rgba(255,255,255,.55),0 10px 24px rgba(0,89,154,.12); }
.nx-signature-solutions .p1{left:7%;top:32%;width:48%}.nx-signature-solutions .p2{left:44%;top:50%;width:43%;transform:rotate(22deg)}.nx-signature-solutions .p3{left:16%;top:68%;width:55%;transform:rotate(-12deg)}
.nx-flow-dot{position:absolute;width:11px;height:11px;border-radius:50%;background:#bffaff;box-shadow:0 0 18px #29d4ed;animation:nxPipeFlow 3.2s linear infinite}.nx-signature-solutions .d1{left:9%;top:33%}.nx-signature-solutions .d2{left:47%;top:49%;animation-delay:-1.1s}.nx-signature-solutions .d3{left:20%;top:68%;animation-delay:-2.1s}
.nx-output-drop{position:absolute;right:12%;bottom:13%;width:58px;height:74px;border-radius:60% 40% 62% 38% / 72% 45% 55% 28%;transform:rotate(45deg);background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(58,215,238,.58),rgba(5,93,176,.7));box-shadow:0 18px 36px rgba(0,86,155,.22),inset 5px 5px 10px rgba(255,255,255,.62);animation:nxFloat 4s ease-in-out infinite}

/* Industries — floating sector bubbles */
.nx-sector-hub{position:absolute;left:50%;top:50%;width:78px;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 30% 20%,#fff,rgba(70,216,237,.46) 36%,rgba(10,93,176,.42));box-shadow:0 0 0 14px rgba(87,222,240,.06),0 22px 50px rgba(1,65,124,.18);animation:nxPulse 4s ease-in-out infinite}
.nx-sector-bubble{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.8);background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.96),rgba(72,214,237,.25) 42%,rgba(4,95,178,.12));box-shadow:0 14px 30px rgba(0,83,149,.12),inset 4px 4px 11px rgba(255,255,255,.65);animation:nxFloat 5s ease-in-out infinite}
.nx-signature-industries .b1{width:54px;left:12%;top:20%}.nx-signature-industries .b2{width:72px;right:10%;top:26%;animation-delay:-1s}.nx-signature-industries .b3{width:43px;left:18%;bottom:20%;animation-delay:-2.1s}.nx-signature-industries .b4{width:58px;right:18%;bottom:14%;animation-delay:-3s}.nx-signature-industries .b5{width:34px;left:44%;top:12%;animation-delay:-1.8s}.nx-sector-bubble{aspect-ratio:1}

/* Projects — sonar/ripple scanner */
.nx-signature-projects .nx-scan-ring{position:absolute;left:50%;top:50%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(76,216,239,.34);transform:translate(-50%,-50%);animation:nxScanPulse 3.8s ease-out infinite}.nx-signature-projects .r1{width:30%}.nx-signature-projects .r2{width:52%;animation-delay:-1.2s}.nx-signature-projects .r3{width:76%;animation-delay:-2.4s}
.nx-scan-beam{position:absolute;left:50%;top:50%;width:37%;height:2px;transform-origin:left center;background:linear-gradient(90deg,rgba(64,223,243,.9),transparent);animation:nxRadar 5.8s linear infinite;box-shadow:0 0 18px rgba(67,222,243,.45)}
.nx-project-chip{position:absolute;width:58px;height:34px;border-radius:10px;border:1px solid rgba(94,218,237,.36);background:rgba(255,255,255,.45);backdrop-filter:blur(8px);box-shadow:0 12px 24px rgba(0,76,137,.1);animation:nxFloat 4.4s ease-in-out infinite}.nx-project-chip.c1{left:18%;top:26%}.nx-project-chip.c2{right:12%;bottom:22%;animation-delay:-2s}

/* Technologies — animated filtration chamber */
.nx-filter-shell{position:absolute;left:50%;top:48%;width:126px;height:210px;transform:translate(-50%,-50%);border-radius:60px 60px 46px 46px;border:1px solid rgba(255,255,255,.8);background:linear-gradient(90deg,rgba(255,255,255,.55),rgba(76,211,235,.16),rgba(255,255,255,.5));box-shadow:0 25px 55px rgba(0,75,135,.16),inset 0 0 22px rgba(255,255,255,.58);overflow:hidden}
.nx-filter-shell i{display:block;height:25%;border-bottom:1px solid rgba(64,196,224,.2);background:repeating-linear-gradient(90deg,rgba(15,134,193,.08) 0 4px,transparent 4px 9px);animation:nxFilterBreath 4s ease-in-out infinite}.nx-filter-shell i:nth-child(2){background:radial-gradient(circle,rgba(33,158,205,.18) 1px,transparent 2px);background-size:8px 8px;animation-delay:-1s}.nx-filter-shell i:nth-child(3){background:linear-gradient(90deg,rgba(60,207,229,.1),rgba(7,116,184,.18));animation-delay:-2s}.nx-filter-shell i:nth-child(4){background:linear-gradient(rgba(45,212,235,.18),rgba(4,113,187,.08));animation-delay:-3s}
.nx-filter-stream{position:absolute;left:calc(50% - 2px);top:6%;width:4px;height:22%;border-radius:999px;background:linear-gradient(#c8fbff,#26d4ec);box-shadow:0 0 16px rgba(47,215,236,.5);animation:nxStream 2.1s ease-in-out infinite}.nx-filter-output{position:absolute;left:50%;bottom:8%;width:34px;height:42px;transform:translateX(-50%) rotate(45deg);border-radius:60% 40% 60% 40%;background:linear-gradient(145deg,#e9ffff,#45d9ee,#0b7cc6);box-shadow:0 12px 25px rgba(0,92,164,.22);animation:nxFloat 3.5s ease-in-out infinite}

/* Sustainability — transparent water globe */
.nx-water-globe{position:absolute;left:50%;top:50%;width:142px;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(255,255,255,.78);background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.95),rgba(55,213,235,.3) 34%,rgba(4,103,180,.24) 68%,rgba(4,75,139,.22));box-shadow:0 24px 50px rgba(0,75,136,.18),inset 8px 8px 20px rgba(255,255,255,.45);animation:nxPulse 4.5s ease-in-out infinite}.nx-water-globe i{position:absolute;inset:24%;border-radius:48% 52% 55% 45%;background:linear-gradient(145deg,rgba(42,176,110,.6),rgba(83,223,164,.32));filter:blur(.2px);animation:nxMorph 7s ease-in-out infinite}
.nx-globe-orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(67,216,239,.34);border-radius:50%}.nx-globe-orbit.o1{width:68%;height:34%;transform:translate(-50%,-50%) rotateX(68deg);animation:nxGlobeSpinX 9s linear infinite}.nx-globe-orbit.o2{width:52%;height:24%;transform:translate(-50%,-50%) rotateY(65deg);animation:nxGlobeSpinY 12s linear infinite reverse}.nx-leaf-pulse{position:absolute;right:16%;top:20%;width:34px;height:52px;border-radius:70% 20% 70% 20%;background:linear-gradient(150deg,#8be6bd,#1b9f69);transform:rotate(36deg);box-shadow:0 14px 28px rgba(18,135,89,.2);animation:nxFloat 4.4s ease-in-out infinite}

/* Careers — calm wave energy */
.nx-career-wave{position:absolute;left:-8%;width:116%;height:72px;border-radius:50%;border-top:2px solid rgba(74,215,238,.38);filter:drop-shadow(0 6px 12px rgba(4,109,176,.08));animation:nxWave 6s ease-in-out infinite}.nx-career-wave.w1{top:33%}.nx-career-wave.w2{top:48%;animation-delay:-2s;opacity:.65}.nx-career-wave.w3{top:64%;animation-delay:-4s;opacity:.42}.nx-career-particle{position:absolute;width:11px;height:11px;border-radius:50%;background:rgba(185,250,255,.88);box-shadow:0 0 18px rgba(39,211,234,.5);animation:nxCareerParticle 5.5s linear infinite}.nx-career-particle.p1{left:17%;top:52%}.nx-career-particle.p2{left:42%;top:38%;animation-delay:-2s}.nx-career-particle.p3{left:72%;top:61%;animation-delay:-3.7s}

/* Contact — location sonar */
.nx-map-grid{position:absolute;inset:15%;border-radius:26px;background-image:linear-gradient(rgba(50,183,217,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(50,183,217,.1) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(circle,#000 30%,transparent 76%)}
.nx-map-pin{position:absolute;left:50%;top:47%;width:30px;height:40px;transform:translate(-50%,-60%) rotate(45deg);border-radius:58% 42% 62% 38%;background:linear-gradient(145deg,#f4ffff,#44d9ed 48%,#0878c5);box-shadow:0 16px 28px rgba(0,94,166,.22),inset 4px 4px 8px rgba(255,255,255,.7);animation:nxFloat 3.8s ease-in-out infinite}.nx-map-ripple{position:absolute;left:50%;top:56%;width:46px;aspect-ratio:1;border-radius:50%;border:1px solid rgba(51,208,232,.45);transform:translate(-50%,-50%);animation:nxMapRipple 3s ease-out infinite}.nx-map-ripple.r2{animation-delay:-1s}.nx-map-ripple.r3{animation-delay:-2s}

/* Page-specific card motion accents */
.solutions-page .service-card::before,
.projects-page .project-card::before,
.industries-page .industry-card::before {
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:2px;
  background:linear-gradient(90deg,transparent,#37d7eb,transparent);
  transform:translateX(-100%);
  transition:transform .7s ease;
}
.solutions-page .service-card:hover::before,
.projects-page .project-card:hover::before,
.industries-page .industry-card:hover::before { transform:translateX(100%); }

@keyframes nxSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes nxSpinReverse{to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes nxFloat{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes nxPulse{0%,100%{scale:1}50%{scale:1.035}}
@keyframes nxPipeFlow{0%{transform:translateX(0);opacity:.2}20%{opacity:1}100%{transform:translateX(210px);opacity:0}}
@keyframes nxScanPulse{0%{opacity:.85;scale:.72}100%{opacity:0;scale:1.16}}
@keyframes nxRadar{to{transform:rotate(360deg)}}
@keyframes nxFilterBreath{0%,100%{filter:saturate(.9)}50%{filter:saturate(1.25)}}
@keyframes nxStream{0%,100%{opacity:.35;transform:scaleY(.7);transform-origin:top}50%{opacity:1;transform:scaleY(1.05);transform-origin:top}}
@keyframes nxMorph{0%,100%{border-radius:48% 52% 55% 45%}50%{border-radius:62% 38% 44% 56%;transform:rotate(12deg)}}
@keyframes nxGlobeSpinX{to{transform:translate(-50%,-50%) rotateX(68deg) rotateZ(360deg)}}
@keyframes nxGlobeSpinY{to{transform:translate(-50%,-50%) rotateY(65deg) rotateZ(-360deg)}}
@keyframes nxWave{0%,100%{transform:translateX(-1%) translateY(0) rotate(-1deg)}50%{transform:translateX(1%) translateY(-8px) rotate(1deg)}}
@keyframes nxCareerParticle{0%{transform:translate3d(-30px,20px,0);opacity:0}20%{opacity:1}100%{transform:translate3d(200px,-90px,0);opacity:0}}
@keyframes nxMapRipple{0%{opacity:.8;scale:.45}100%{opacity:0;scale:3.6}}

@media (max-width: 900px) {
  .page-hero-art { min-height: 280px !important; max-height: 340px !important; }
  .page-hero-art > img { max-height: 310px !important; }
}
@media (max-width: 700px) {
  .home-page .hero h1,
  .hero h1 { font-size: clamp(30px, 8.2vw, 34px) !important; max-width: 350px !important; }
  .page-hero h1 { font-size: clamp(28px, 7.5vw, 32px) !important; }
  .section-title { font-size: clamp(24px, 6.7vw, 28px) !important; }
  .page-hero p,.section-copy { font-size: 15px !important; }
  .page-hero { padding-top: 102px !important; padding-bottom: 46px !important; }
  .page-hero-art { min-height: 230px !important; max-height: 280px !important; border-radius: 24px !important; }
  .page-hero-art > img { max-height: 245px !important; }
  .nx-signature { transform:scale(.88) translate3d(var(--sig-x),var(--sig-y),0); transform-origin:center; }
  .nav-shell { min-height: 66px !important; }
  .brand img { max-height: 42px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .nx-signature *, .nx-signature *::before, .nx-signature *::after { animation:none !important; transition:none !important; }
  .nx-signature { transform:none !important; }
}


/* ==========================================================================\n   V7.1 HEADER VISIBILITY PATCH\n   High-contrast liquid-glass navigation on every page.\n   ========================================================================== */
.site-header {
  background: rgba(4, 29, 61, .94) !important;
  border-bottom: 1px solid rgba(111, 229, 244, .18) !important;
  backdrop-filter: blur(18px) saturate(1.16) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.16) !important;
  box-shadow: 0 8px 30px rgba(0, 17, 38, .13) !important;
}
.site-header.scrolled {
  background: rgba(3, 25, 54, .97) !important;
  border-bottom-color: rgba(111, 229, 244, .22) !important;
  box-shadow: 0 12px 34px rgba(0, 15, 36, .20) !important;
}
.nav-shell {
  height: 76px !important;
  min-height: 76px !important;
  gap: 16px !important;
}
.site-header .brand {
  width: 104px !important;
  min-width: 104px !important;
  height: 68px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.site-header .brand img {
  width: 96px !important;
  height: auto !important;
  max-width: 96px !important;
  max-height: 68px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 7px 16px rgba(0, 0, 0, .22)) !important;
}
.site-header .nav-links {
  gap: 1px !important;
}
.site-header .nav-links a,
.home-page .site-header:not(.scrolled) .nav-links a {
  color: rgba(239, 251, 255, .84) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  padding: 10px 8px !important;
  border-radius: 9px !important;
  background: transparent !important;
  text-shadow: 0 1px 12px rgba(0, 13, 31, .14) !important;
}
.site-header .nav-links a:hover,
.site-header .nav-links a:focus-visible,
.site-header .nav-links a.active,
.site-header .nav-links a[aria-current="page"],
.home-page .site-header:not(.scrolled) .nav-links a:hover,
.home-page .site-header:not(.scrolled) .nav-links a.active {
  color: #ffffff !important;
  background: rgba(77, 219, 240, .075) !important;
}
.site-header .nav-links a::after {
  left: 9px !important;
  right: 9px !important;
  bottom: 4px !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, #20d7ef 22%, #72f1df 72%, transparent) !important;
  box-shadow: 0 0 11px rgba(57, 226, 242, .48) !important;
}
.site-header .nav-links a.active,
.site-header .nav-links a[aria-current="page"] {
  color: #57e7f3 !important;
}
.site-header .header-actions .btn-primary {
  min-height: 39px !important;
  padding: 0 16px !important;
  color: #032343 !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  background: linear-gradient(110deg, #a7f3ff 0%, #35dcec 54%, #5ce9c6 100%) !important;
  box-shadow: 0 8px 24px rgba(30, 214, 232, .22) !important;
}
.site-header .header-actions .btn-primary:hover,
.site-header .header-actions .btn-primary:focus-visible {
  transform: translateY(-1px) !important;
  box-shadow: 0 11px 28px rgba(30, 214, 232, .30) !important;
}
.site-header .nav-toggle {
  color: #effcff !important;
  border: 1px solid rgba(120, 233, 245, .20) !important;
  background: rgba(255, 255, 255, .07) !important;
}

@media (max-width: 1180px) {
  .site-header .nav-links a,
  .home-page .site-header:not(.scrolled) .nav-links a {
    font-size: 12.25px !important;
    padding-inline: 6px !important;
  }
  .site-header .brand { width: 94px !important; min-width: 94px !important; }
  .site-header .brand img { width: 88px !important; max-width: 88px !important; }
  .site-header .header-actions .btn-primary { padding-inline: 13px !important; font-size: 12px !important; }
}

@media (max-width: 1050px) {
  .nav-shell { height: 70px !important; min-height: 70px !important; }
  .site-header .brand { width: 92px !important; min-width: 92px !important; height: 62px !important; }
  .site-header .brand img { width: 84px !important; max-width: 84px !important; max-height: 62px !important; }
  .site-header .nav-links {
    top: 78px !important;
    inset-inline: 18px !important;
    padding: 12px !important;
    border: 1px solid rgba(103, 224, 241, .17) !important;
    background: rgba(3, 25, 54, .985) !important;
    box-shadow: 0 24px 60px rgba(0, 14, 33, .32) !important;
  }
  .site-header .nav-links a,
  .home-page .site-header:not(.scrolled) .nav-links a {
    font-size: 14px !important;
    padding: 12px 13px !important;
  }
}

@media (max-width: 720px) {
  .nav-shell { height: 66px !important; min-height: 66px !important; }
  .site-header .brand { width: 82px !important; min-width: 82px !important; height: 58px !important; }
  .site-header .brand img { width: 76px !important; max-width: 76px !important; max-height: 56px !important; }
  .site-header .nav-links { top: 72px !important; }
}

/* =========================================================
   NEXAQUA V8 — final compact premium layer
   ========================================================= */
:root{--v8-glass:rgba(255,255,255,.72);--v8-line:rgba(20,160,193,.16);--v8-deep:#052449}
html{scroll-behavior:smooth}.site-header{background:rgba(4,28,62,.91)!important;border-bottom:1px solid rgba(132,234,246,.14)!important;box-shadow:0 12px 34px rgba(2,29,60,.13)!important}.site-header .nav-shell{min-height:66px!important}.site-header .brand img{width:auto!important;height:52px!important;max-height:52px!important;filter:drop-shadow(0 7px 12px rgba(0,0,0,.16))}.site-header .nav-links a{color:rgba(255,255,255,.82)!important;font-size:13px!important;font-weight:500!important}.site-header .nav-links a:hover,.site-header .nav-links a.active{color:#7ff4ff!important}.site-header .nav-links a::after{background:linear-gradient(90deg,#42e5f0,#24dfc0)!important;height:2px!important}.site-header .btn-sm{font-size:12px!important;padding:10px 15px!important}.home-page .hero h1,.hero h1{font-size:clamp(38px,3.8vw,50px)!important;line-height:1.04!important;letter-spacing:-.035em!important;max-width:610px!important}.hero-copy>p{font-size:16px!important;line-height:1.68!important;max-width:570px!important}.page-hero h1{font-size:clamp(34px,3.1vw,42px)!important;line-height:1.08!important;letter-spacing:-.03em!important}.page-hero p{font-size:16px!important;line-height:1.68!important}.section-title{font-size:clamp(28px,2.5vw,34px)!important;line-height:1.12!important;letter-spacing:-.026em!important}.section-copy,.section p,.service-card p,.info-card p,.project-card p{font-size:15px;line-height:1.68}.service-card h3,.info-card h3,.project-card h3,.industry-card h3{font-size:18px!important}.v8-page-hero{min-height:auto!important;padding-top:112px!important;padding-bottom:58px!important}.v8-page-hero .page-hero-grid{min-height:350px!important}.v8-page-hero .page-hero-art{min-height:310px!important}.v8-hero-accent{display:block;margin-top:4px;color:#087eb8}.section{padding-top:76px!important;padding-bottom:76px!important}.footer-admin-link{display:inline-block;margin-top:8px;font-size:10px!important;opacity:.55;text-decoration:none}.footer-admin-link:hover{opacity:1}

/* page signature enhancements */
.v8-hero-art>img{opacity:.42;filter:saturate(.88) contrast(.95)}.v8-signature{filter:drop-shadow(0 22px 45px rgba(6,78,133,.15))}.v8-data-line{position:absolute;height:1px;width:32%;background:linear-gradient(90deg,transparent,#55dceb,transparent);animation:v8Data 3.6s linear infinite}.v8-data-line.dl1{left:12%;top:38%;transform:rotate(18deg)}.v8-data-line.dl2{right:10%;bottom:34%;transform:rotate(-22deg);animation-delay:-1.8s}.v8-valve{position:absolute;width:26px;height:26px;border:2px solid rgba(68,213,234,.6);border-radius:50%;box-shadow:inset 0 0 0 6px rgba(255,255,255,.55);animation:v8Spin 6s linear infinite}.v8-valve.v1{left:43%;top:29%}.v8-valve.v2{right:23%;bottom:25%;animation-direction:reverse}.v8-sector-line{position:absolute;width:34%;height:1px;background:linear-gradient(90deg,transparent,rgba(49,201,224,.46),transparent);left:34%;top:50%;transform-origin:center}.v8-sector-line.l1{transform:rotate(30deg)}.v8-sector-line.l2{transform:rotate(-35deg)}.v8-project-pulse{position:absolute;inset:29%;border-radius:50%;background:radial-gradient(circle,rgba(64,225,240,.25),transparent 68%);animation:v8Pulse 2.8s ease-in-out infinite}.v8-micro-drop,.v8-orbit-dot{position:absolute;width:9px;height:12px;border-radius:60% 40% 65% 35%;background:linear-gradient(145deg,#fff,#45d7ee 55%,#0878c6);box-shadow:0 0 15px rgba(58,214,237,.7)}.v8-micro-drop.md1{left:31%;top:18%;animation:v8Fall 3.2s linear infinite}.v8-micro-drop.md2{right:28%;top:12%;animation:v8Fall 3.2s -1.6s linear infinite}.v8-orbit-dot.od1{left:18%;top:47%;animation:v8Float 4s ease-in-out infinite}.v8-orbit-dot.od2{right:18%;top:36%;animation:v8Float 5s -2s ease-in-out infinite}.v8-career-drop{position:absolute;left:48%;top:22%;width:28px;height:38px;border-radius:60% 40% 65% 35%;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(56,213,236,.48),rgba(6,111,184,.55));animation:v8Float 4s ease-in-out infinite}.v8-contact-beam{position:absolute;left:50%;top:50%;width:46%;height:1px;background:linear-gradient(90deg,#43dcec,transparent);transform-origin:left;animation:v8Radar 4s linear infinite}

/* About timeline */
.v8-story-section{overflow:hidden}.v8-timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:38px}.v8-timeline-flow{position:absolute;left:5%;right:5%;top:26px;height:3px;border-radius:99px;background:rgba(24,154,190,.12);overflow:hidden}.v8-timeline-flow::after{content:"";position:absolute;inset:0;width:32%;background:linear-gradient(90deg,transparent,#20d4de,#49efc9,transparent);animation:v8FlowLine 4s linear infinite}.v8-timeline-node{position:relative;padding-top:58px}.v8-timeline-node::before{content:"";position:absolute;left:8px;top:15px;width:22px;height:22px;border:5px solid #fff;border-radius:50%;background:#18bfd5;box-shadow:0 0 0 1px rgba(10,140,180,.23),0 8px 20px rgba(5,122,170,.18)}.v8-timeline-node span{font-size:11px;font-weight:800;color:#08a9c5}.v8-timeline-node h3{font-size:18px;margin:6px 0 8px}.v8-timeline-node p{font-size:14px;margin:0;color:#5f788b}

/* Solutions pipeline */
.v8-pipeline-section{background:linear-gradient(180deg,#f9feff,#effaff)}.v8-process-pipe{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:34px;padding:26px 18px;border:1px solid rgba(16,163,196,.13);border-radius:24px;background:rgba(255,255,255,.72);box-shadow:0 24px 60px rgba(4,77,116,.07);overflow:hidden}.v8-pipe-line{position:absolute;left:8%;right:8%;top:49px;height:12px;border:1px solid rgba(20,174,206,.23);border-radius:99px;background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(52,206,230,.14));box-shadow:inset 0 3px 5px rgba(255,255,255,.7)}.v8-pipe-line i{display:block;height:100%;width:24%;border-radius:99px;background:linear-gradient(90deg,transparent,#20d7ec,#4df1d2,transparent);animation:v8Pipe 3.4s linear infinite}.v8-pipe-stage{position:relative;text-align:center;z-index:1}.v8-pipe-stage span{display:grid;place-items:center;margin:0 auto 15px;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid #b9e7ef;box-shadow:0 8px 20px rgba(0,107,158,.12);font-size:10px;font-weight:800;color:#0a89ab}.v8-pipe-stage b{font-size:12px;color:#214b67}.v8-mini-flow{margin-top:14px;padding:9px 10px;border-radius:10px;background:linear-gradient(90deg,rgba(18,196,216,.07),rgba(34,224,192,.07));font-size:11px;line-height:1.5;color:#337087;border:1px solid rgba(13,168,198,.1)}

/* Industry bubbles */
.v8-industry-field{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}.v8-industry-bubble{--mx:50%;--my:50%;position:relative;min-height:285px;padding:30px 24px;border:1px solid rgba(65,194,220,.2);border-radius:34% 66% 55% 45%/54% 42% 58% 46%;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.98),rgba(235,251,255,.86) 46%,rgba(169,232,244,.34));box-shadow:inset 8px 8px 24px rgba(255,255,255,.8),inset -10px -12px 28px rgba(64,181,212,.1),0 22px 55px rgba(5,74,113,.08);overflow:hidden;transition:transform .35s ease,border-radius .5s ease}.v8-industry-bubble:hover{transform:translateY(-4px) scale(1.012);border-radius:48% 52% 42% 58%/58% 40% 60% 42%}.v8-bubble-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.75);color:#058cb6}.v8-industry-bubble h3{font-size:19px;margin:16px 0}.v8-bubble-detail b{font-size:10px;text-transform:uppercase;color:#079ab5}.v8-bubble-detail p{font-size:13px;margin:4px 0 10px;color:#557489}.v8-bubble-detail span{display:inline-flex;font-size:10px;font-weight:700;padding:6px 9px;border-radius:999px;background:#e9f9fc;color:#19718b}

/* Projects */
.v8-project-empty{display:grid;grid-template-columns:250px 1fr;align-items:center;gap:38px;margin-top:30px;padding:34px;border-radius:26px;background:linear-gradient(135deg,#f5fcfe,#fff);border:1px solid var(--v8-line)}.v8-project-radar{position:relative;width:210px;aspect-ratio:1;margin:auto;border-radius:50%;background:radial-gradient(circle,#dff9fd 0 8%,transparent 9%),linear-gradient(rgba(23,168,201,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(23,168,201,.08) 1px,transparent 1px);background-size:auto,24px 24px,24px 24px}.v8-project-radar i{position:absolute;inset:18%;border:1px solid rgba(14,177,207,.23);border-radius:50%;animation:v8RadarRing 3.6s ease-out infinite}.v8-project-radar i:nth-child(2){inset:32%;animation-delay:-1.2s}.v8-project-radar i:nth-child(3){inset:5%;animation-delay:-2.4s}.v8-project-radar b{position:absolute;left:50%;top:50%;width:46%;height:2px;background:linear-gradient(90deg,#1ed2e2,transparent);transform-origin:left;animation:v8Radar 4s linear infinite}.v8-case-card{--mx:50%;--my:50%;position:relative}.v8-case-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.3),transparent 24%);opacity:0;transition:opacity .25s}.v8-case-card:hover::after{opacity:1}.v8-case-ripple{position:absolute;inset:50% auto auto 50%;width:22px;height:22px;border:1px solid rgba(100,239,255,.8);border-radius:50%;transform:translate(-50%,-50%);animation:v8RadarRing 3s ease-out infinite}.v8-metric-chips{display:flex;flex-wrap:wrap;gap:7px;margin:13px 0}.v8-metric-chips span{display:grid;padding:7px 9px;border:1px solid #e1eef2;background:#f7fcfd;border-radius:9px;font-size:11px;font-weight:700}.v8-metric-chips small{font-size:8px;color:#7890a0;text-transform:uppercase}.v8-case-outcome{margin-top:12px;padding-top:12px;border-top:1px solid #e5eef2}.v8-case-outcome b{font-size:10px;color:#0589a7}.v8-before-after{position:relative;margin-top:14px;height:180px;border-radius:14px;overflow:hidden;background:#eaf6fa}.v8-before-after>img,.v8-before-after>div,.v8-before-after>div img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.v8-before-after>div{z-index:2}.v8-before-after input{position:absolute;left:8%;right:8%;bottom:10px;z-index:3;width:84%}

/* Technology chamber */
.v8-tech-lab-grid{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:60px;align-items:center}.v8-filter-chamber{position:relative;min-height:450px;display:grid;place-items:center}.v8-chamber-glass{position:relative;width:190px;height:390px;border:1px solid rgba(166,244,252,.55);border-radius:70px 70px 48px 48px;background:linear-gradient(90deg,rgba(255,255,255,.09),rgba(88,214,234,.13),rgba(255,255,255,.05));box-shadow:inset 20px 0 34px rgba(255,255,255,.08),inset -20px 0 34px rgba(26,190,213,.08),0 35px 70px rgba(0,16,47,.3);overflow:hidden}.v8-chamber-glass::before{content:"";position:absolute;left:19px;top:28px;bottom:28px;width:12px;border-radius:99px;background:linear-gradient(#fff8,transparent)}.v8-water-feed{position:absolute;left:0;right:0;top:-40%;height:50%;background:linear-gradient(180deg,transparent,rgba(33,190,220,.38),rgba(55,222,225,.58));animation:v8ChamberFlow 4.5s linear infinite}.v8-chamber-glass .layer{position:absolute;left:20px;right:20px;height:46px;border-radius:16px;background:repeating-linear-gradient(90deg,rgba(142,239,244,.32) 0 5px,rgba(27,126,168,.3) 5px 8px);border:1px solid rgba(136,236,246,.22);box-shadow:0 8px 20px rgba(0,15,45,.16)}.v8-chamber-glass .l1{top:78px}.v8-chamber-glass .l2{top:145px}.v8-chamber-glass .l3{top:212px}.v8-chamber-glass .l4{top:279px}.v8-clean-stream{position:absolute;left:50%;bottom:-75px;width:18px;height:90px;transform:translateX(-50%);background:linear-gradient(#7cf1f5,#17c1e0);border-radius:0 0 99px 99px;filter:drop-shadow(0 0 12px rgba(41,216,233,.45))}.v8-chamber-labels{position:absolute;right:8%;top:62px;bottom:45px;display:flex;flex-direction:column;justify-content:space-between;font-size:10px;color:#8edbe7}.v8-tech-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.v8-tech-tab{border:1px solid rgba(110,222,237,.2);background:rgba(255,255,255,.06);color:#bfeaf1;border-radius:999px;padding:8px 11px;font-weight:700;font-size:11px;cursor:pointer}.v8-tech-tab.active{background:linear-gradient(90deg,#28d8e1,#3ee7c5);color:#052948;border-color:transparent}.v8-tech-readout{padding:20px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}.v8-tech-readout h3{margin:0 0 7px;color:#fff;font-size:21px}.v8-tech-readout p{color:#a9ccd8}.v8-tech-readout>div{display:grid;gap:3px;margin-top:12px}.v8-tech-readout span{font-size:9px;text-transform:uppercase;color:#61d7e6}.v8-tech-readout strong{font-size:12px;color:#fff}.v8-filter-chamber.pulse{animation:v8ChamberPulse .65s ease}

/* Sustainability globe */
.v8-sustain-world{overflow:hidden}.v8-water-globe-wrap{display:grid;place-items:center;min-height:430px}.v8-water-globe{position:relative;width:260px;aspect-ratio:1;border-radius:50%;border:1px solid rgba(155,242,250,.5);background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.74),rgba(43,203,226,.2) 35%,rgba(0,91,157,.18) 62%,rgba(0,20,62,.35));box-shadow:inset 25px 20px 55px rgba(255,255,255,.1),inset -30px -25px 60px rgba(0,29,87,.35),0 35px 90px rgba(0,0,0,.25);animation:v8GlobeFloat 6s ease-in-out infinite}.v8-water-globe .continent{position:absolute;background:linear-gradient(145deg,rgba(48,204,141,.55),rgba(28,134,111,.25));border-radius:45% 55% 58% 42%;filter:blur(.2px)}.v8-water-globe .c1{width:80px;height:55px;left:48px;top:75px;transform:rotate(18deg)}.v8-water-globe .c2{width:65px;height:90px;right:48px;bottom:52px;transform:rotate(-24deg)}.v8-water-globe .orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(78,221,235,.32);border-radius:50%;transform:translate(-50%,-50%) rotateX(67deg);animation:v8Spin 10s linear infinite}.v8-water-globe .o1{width:125%;height:38%}.v8-water-globe .o2{width:140%;height:48%;transform:translate(-50%,-50%) rotateX(67deg) rotateZ(55deg);animation-duration:14s}.v8-water-globe .o3{width:115%;height:35%;transform:translate(-50%,-50%) rotateX(67deg) rotateZ(-55deg);animation-duration:12s;animation-direction:reverse}.v8-water-globe .drop{position:absolute;left:50%;top:50%;width:30px;height:40px;border-radius:60% 40% 65% 35%;background:linear-gradient(145deg,#fff,#55e4eb 50%,#087ec0);box-shadow:0 0 22px rgba(59,225,235,.55);transform:translate(-50%,-50%)}

/* Careers + contact */
.v8-job-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}.v8-job-card{padding:22px;border:1px solid var(--v8-line);border-radius:18px;background:#fff;box-shadow:0 16px 35px rgba(6,72,109,.06)}.v8-job-card>span{font-size:9px;text-transform:uppercase;color:#0798b0;font-weight:800}.v8-job-card h3{font-size:18px;margin:8px 0}.v8-job-card p{font-size:13px;color:#5d7588}.v8-job-card>div{display:flex;gap:8px;margin:12px 0;font-size:10px}.v8-job-card small{color:#7b91a0}.v8-career-flow{position:relative;overflow:hidden}.v8-career-wave-bg{position:absolute;inset:auto -5% 0;height:190px;opacity:.16;pointer-events:none}.v8-career-wave-bg i{position:absolute;left:-5%;width:110%;height:90px;border:2px solid #13b7d0;border-radius:50%;animation:v8Wave 8s ease-in-out infinite}.v8-career-wave-bg i:nth-child(2){bottom:-20px;animation-delay:-2.5s}.v8-career-wave-bg i:nth-child(3){bottom:-50px;animation-delay:-5s}.v8-upload-story{display:grid;grid-template-columns:auto 1fr auto auto 1fr auto auto 1fr;align-items:center;gap:8px;margin-top:28px;font-size:10px}.v8-upload-story span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#0bb9d2;color:#fff;font-weight:800}.v8-upload-story i{width:24px;height:1px;background:#a8dce6}.v8-file-drop-indicator{margin-top:8px;padding:8px 10px;border:1px dashed #b9dce5;border-radius:10px;font-size:10px;color:#6b8898}.v8-file-drop-indicator span{display:inline-block;width:8px;height:10px;margin-right:6px;border-radius:60% 40%;background:#20bcd5}.v8-file-drop-indicator.ready{background:#eafff9;color:#0a7a5a;border-color:#a7e7d5}.v8-contact-card{overflow:hidden}.v8-sonar-map{position:relative;height:190px;margin:-20px -20px 20px;border-radius:18px;background:linear-gradient(rgba(8,131,173,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(8,131,173,.08) 1px,transparent 1px),radial-gradient(circle at 50% 50%,#eaffff,#eff9fc 65%);background-size:26px 26px,26px 26px,auto;overflow:hidden}.v8-sonar-map .pin{position:absolute;left:50%;top:50%;width:16px;height:22px;transform:translate(-50%,-60%);border-radius:60% 40% 60% 40%;background:linear-gradient(145deg,#15d4e0,#087bc0);box-shadow:0 8px 18px rgba(3,107,160,.25);z-index:2}.v8-sonar-map i{position:absolute;left:50%;top:50%;width:40px;height:40px;border:1px solid rgba(17,182,208,.42);border-radius:50%;transform:translate(-50%,-50%);animation:v8Sonar 3.6s ease-out infinite}.v8-sonar-map i:nth-of-type(2){animation-delay:-1.2s}.v8-sonar-map i:nth-of-type(3){animation-delay:-2.4s}.v8-sonar-map b{position:absolute;left:50%;top:67%;transform:translateX(-50%);font-size:10px;color:#177895}

@keyframes v8Data{from{transform:translateX(-20%) rotate(var(--r,0deg));opacity:0}30%{opacity:1}to{transform:translateX(180%);opacity:0}}@keyframes v8Spin{to{transform:rotate(360deg)}}@keyframes v8Pulse{50%{transform:scale(1.12);opacity:.5}}@keyframes v8Fall{0%{transform:translateY(-30px);opacity:0}20%{opacity:1}100%{transform:translateY(210px);opacity:0}}@keyframes v8Float{50%{transform:translateY(-10px)}}@keyframes v8FlowLine{from{transform:translateX(-120%)}to{transform:translateX(380%)}}@keyframes v8Pipe{from{transform:translateX(-110%)}to{transform:translateX(470%)}}@keyframes v8RadarRing{0%{transform:scale(.2);opacity:0}18%{opacity:.65}100%{transform:scale(2.3);opacity:0}}@keyframes v8Radar{to{transform:rotate(360deg)}}@keyframes v8ChamberFlow{from{transform:translateY(-100%)}to{transform:translateY(280%)}}@keyframes v8ChamberPulse{50%{transform:scale(1.018);filter:brightness(1.15)}}@keyframes v8GlobeFloat{50%{transform:translateY(-9px) rotate(2deg)}}@keyframes v8Wave{50%{transform:translateX(4%) translateY(-10px)}}@keyframes v8Sonar{0%{transform:translate(-50%,-50%) scale(.3);opacity:.7}100%{transform:translate(-50%,-50%) scale(4.5);opacity:0}}

@media(max-width:900px){.v8-timeline{grid-template-columns:1fr 1fr}.v8-timeline-flow{display:none}.v8-industry-field{grid-template-columns:1fr 1fr}.v8-tech-lab-grid{grid-template-columns:1fr;gap:20px}.v8-filter-chamber{min-height:390px}.v8-job-grid{grid-template-columns:1fr 1fr}.v8-process-pipe{grid-template-columns:repeat(3,1fr);row-gap:28px}.v8-pipe-line{display:none}.v8-project-empty{grid-template-columns:1fr}.v8-upload-story{grid-template-columns:auto 1fr;}.v8-upload-story i{display:none}}
@media(max-width:700px){.site-header .nav-shell{min-height:61px!important}.site-header .brand img{height:46px!important}.site-header .nav-links{background:rgba(4,28,62,.98)!important}.home-page .hero h1,.hero h1{font-size:clamp(31px,8.5vw,35px)!important;line-height:1.1!important}.page-hero h1{font-size:clamp(29px,7.8vw,33px)!important}.section-title{font-size:clamp(25px,6.9vw,29px)!important}.section{padding-top:58px!important;padding-bottom:58px!important}.v8-page-hero{padding-top:88px!important;padding-bottom:34px!important}.v8-page-hero .page-hero-grid{min-height:auto!important}.v8-page-hero .page-hero-art{min-height:240px!important}.v8-timeline{grid-template-columns:1fr}.v8-industry-field{grid-template-columns:1fr}.v8-industry-bubble{min-height:240px}.v8-process-pipe{grid-template-columns:1fr 1fr}.v8-job-grid{grid-template-columns:1fr}.v8-water-globe{width:210px}.v8-water-globe-wrap{min-height:330px}.v8-chamber-glass{width:165px;height:340px}.v8-filter-chamber{min-height:350px}.v8-chamber-labels{display:none}.v8-project-radar{width:170px}.v8-project-empty{padding:24px}.v8-sonar-map{height:160px}}
@media(prefers-reduced-motion:reduce){.v8-timeline-flow::after,.v8-pipe-line i,.v8-industry-bubble,.v8-water-globe,.v8-water-feed,.v8-career-wave-bg i,.v8-sonar-map i,.v8-signature *{animation:none!important;transition:none!important}}

/* =========================================================
   V8.1 INDUSTRIES BUBBLE CONTENT-SAFE FIX
   Keeps the organic liquid silhouette without clipping text.
   ========================================================= */
.industries-page .v8-industry-bubble {
  position: relative !important;
  isolation: isolate;
  min-height: 330px !important;
  padding: 34px 38px 42px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.industries-page .v8-industry-bubble::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border: 1px solid rgba(65, 194, 220, .22);
  border-radius: 34% 66% 55% 45% / 54% 42% 58% 46%;
  background:
    radial-gradient(circle at var(--mx, 50%) var(--my, 50%),
      rgba(255,255,255,.99),
      rgba(235,251,255,.88) 46%,
      rgba(169,232,244,.36));
  box-shadow:
    inset 8px 8px 24px rgba(255,255,255,.82),
    inset -10px -12px 28px rgba(64,181,212,.10),
    0 22px 55px rgba(5,74,113,.08);
  transition: border-radius .5s ease, box-shadow .35s ease, transform .35s ease;
  pointer-events: none;
}

.industries-page .v8-industry-bubble:hover {
  transform: translateY(-4px) scale(1.012) !important;
  border-radius: 0 !important;
}

.industries-page .v8-industry-bubble:hover::before {
  border-radius: 48% 52% 42% 58% / 58% 40% 60% 42%;
  box-shadow:
    inset 8px 8px 26px rgba(255,255,255,.86),
    inset -10px -12px 30px rgba(64,181,212,.12),
    0 26px 62px rgba(5,74,113,.11);
}

.industries-page .v8-bubble-icon,
.industries-page .v8-industry-bubble h3,
.industries-page .v8-bubble-detail {
  position: relative;
  z-index: 1;
}

.industries-page .v8-bubble-detail {
  width: 100%;
  max-width: 100%;
  padding: 0 2px 4px;
}

.industries-page .v8-bubble-detail p {
  margin: 5px 0 11px !important;
  line-height: 1.55 !important;
  overflow-wrap: anywhere;
}

.industries-page .v8-bubble-detail span {
  max-width: 100%;
  white-space: normal;
  line-height: 1.35;
}

@media (max-width: 1100px) {
  .industries-page .v8-industry-bubble {
    min-height: 350px !important;
    padding: 34px 34px 42px !important;
  }
}

@media (max-width: 900px) {
  .industries-page .v8-industry-bubble {
    min-height: 315px !important;
    padding: 32px 34px 38px !important;
  }
}

@media (max-width: 700px) {
  .industries-page .v8-industry-bubble {
    min-height: 285px !important;
    padding: 30px 30px 36px !important;
  }

  .industries-page .v8-industry-bubble::before {
    border-radius: 29% 71% 62% 38% / 48% 45% 55% 52%;
  }
}

/* ========================================================================== 
   NEXAQUA V8.3 — Branded signature page transition
   Keeps the existing 3D water-drop fall, ripple and portal timing intact.
   The Nexaqua brand now travels visibly inside the drop and flashes cleanly
   at impact before the next page opens.
   ========================================================================== */
.page-liquid-transition .liquid-drop-shell > img {
  z-index: 6 !important;
  width: 72% !important;
  height: 72% !important;
  left: 52% !important;
  top: 54% !important;
  opacity: .90 !important;
  transform: translate(-50%, -50%) rotate(-45deg) scale(.94) !important;
  transform-origin: 50% 50% !important;
  object-fit: contain !important;
  mix-blend-mode: normal !important;
  filter:
    saturate(1.10)
    contrast(1.08)
    drop-shadow(0 2px 2px rgba(232, 255, 255, .32))
    drop-shadow(0 7px 11px rgba(0, 29, 81, .34)) !important;
  will-change: transform, opacity, filter !important;
}

/* The page name inside the tiny falling drop competed with the brand mark. */
.page-liquid-transition .liquid-drop-preview {
  display: none !important;
}

/* Refraction pulse while the logo travels inside the falling water drop. */
.page-liquid-transition.nx-leave .liquid-drop-shell > img {
  animation: nxBrandTravelsInsideDrop 440ms 70ms cubic-bezier(.18,.69,.19,1) both !important;
}
@keyframes nxBrandTravelsInsideDrop {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(-45deg) scale(.68,.82) !important;
    filter: blur(2.6px) saturate(.82) contrast(.92) drop-shadow(0 4px 9px rgba(0,30,82,.18)) !important;
  }
  16% {
    opacity: .82;
    transform: translate(-50%, -50%) rotate(-45deg) scale(.90,1.02) !important;
    filter: blur(.55px) saturate(1.10) contrast(1.06) drop-shadow(0 7px 12px rgba(0,30,82,.28)) !important;
  }
  52% {
    opacity: .96;
    transform: translate(-50%, -50%) rotate(-45deg) scale(1) !important;
    filter: blur(0) saturate(1.12) contrast(1.08) drop-shadow(0 8px 12px rgba(0,30,82,.34)) !important;
  }
  76% {
    opacity: .90;
    transform: translate(-50%, -50%) rotate(-45deg) scale(.96,1.06) !important;
  }
  100% {
    opacity: .18;
    transform: translate(-50%, -50%) rotate(-45deg) scale(1.08,.80) !important;
    filter: blur(1.2px) saturate(1.04) contrast(1.02) drop-shadow(0 2px 7px rgba(0,30,82,.18)) !important;
  }
}

/* Independent brand flash at the water impact point; it is not stretched by
   the impact-bloom ellipse, so the logo remains crisp and recognisable. */
.page-liquid-transition .liquid-drop-stage::after {
  content: "";
  position: absolute !important;
  z-index: 16 !important;
  left: var(--impact-x) !important;
  top: var(--impact-y) !important;
  width: 150px !important;
  height: 82px !important;
  opacity: 0;
  pointer-events: none !important;
  background: url('../img/nexaqua-logo-transparent.png') center / contain no-repeat !important;
  transform: translate(-50%, -50%) scale(.66) !important;
  transform-origin: 50% 50% !important;
  filter:
    brightness(1.08)
    saturate(1.06)
    drop-shadow(0 0 10px rgba(191, 250, 255, .52))
    drop-shadow(0 10px 18px rgba(0, 20, 62, .34)) !important;
  will-change: opacity, transform, filter !important;
}
.page-liquid-transition.nx-leave .liquid-drop-stage::after {
  animation: nxImpactBrandFlash 200ms 410ms cubic-bezier(.16,.76,.26,1) both !important;
}
@keyframes nxImpactBrandFlash {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.62) !important;
    filter: blur(2px) brightness(1.25) saturate(1.08) drop-shadow(0 0 16px rgba(207,252,255,.64)) !important;
  }
  32% {
    opacity: .96;
    transform: translate(-50%, -50%) scale(.91) !important;
    filter: blur(0) brightness(1.12) saturate(1.08) drop-shadow(0 0 14px rgba(207,252,255,.54)) drop-shadow(0 9px 17px rgba(0,20,62,.30)) !important;
  }
  68% {
    opacity: .82;
    transform: translate(-50%, -50%) scale(1) !important;
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.08) !important;
    filter: blur(.7px) brightness(1.05) saturate(1.02) drop-shadow(0 0 8px rgba(207,252,255,.24)) !important;
  }
}

@media (max-width: 700px) {
  .page-liquid-transition .liquid-drop-shell > img {
    width: 74% !important;
    height: 74% !important;
  }
  .page-liquid-transition.nx-leave .liquid-drop-shell > img {
    animation: nxBrandTravelsInsideDropMobile 330ms 45ms cubic-bezier(.18,.69,.19,1) both !important;
  }
  @keyframes nxBrandTravelsInsideDropMobile {
    0% { opacity: 0; transform: translate(-50%, -50%) rotate(-45deg) scale(.70,.84) !important; filter: blur(2px) saturate(.86) !important; }
    20% { opacity: .88; }
    62% { opacity: .96; transform: translate(-50%, -50%) rotate(-45deg) scale(1) !important; filter: blur(0) saturate(1.10) !important; }
    100% { opacity: .16; transform: translate(-50%, -50%) rotate(-45deg) scale(1.06,.82) !important; filter: blur(1px) saturate(1.02) !important; }
  }
  .page-liquid-transition .liquid-drop-stage::after {
    width: 108px !important;
    height: 60px !important;
  }
  .page-liquid-transition.nx-leave .liquid-drop-stage::after {
    animation: nxImpactBrandFlash 145ms 320ms cubic-bezier(.16,.76,.26,1) both !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition .liquid-drop-stage::after {
    display: none !important;
  }
}

/* ==========================================================================\n   NEXAQUA HEADER LOGO SIZE FIX — new transparent brand artwork\n   Keeps the compact premium header while making the redesigned logo readable.\n   ========================================================================== */
@media (min-width: 1181px) {
  .site-header .nav-shell {
    min-height: 72px !important;
    height: 72px !important;
  }

  .site-header .brand {
    width: 142px !important;
    min-width: 142px !important;
    height: 68px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
  }

  .site-header .brand img {
    width: 132px !important;
    max-width: none !important;
    height: 62px !important;
    max-height: 62px !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: scale(1.12) !important;
    transform-origin: left center !important;
    filter: drop-shadow(0 8px 16px rgba(0, 0, 0, .18)) !important;
  }

  .site-header .brand:hover img {
    transform: scale(1.16) translateY(-1px) !important;
  }
}

@media (min-width: 1051px) and (max-width: 1180px) {
  .site-header .brand {
    width: 116px !important;
    min-width: 116px !important;
    overflow: visible !important;
  }

  .site-header .brand img {
    width: 110px !important;
    max-width: none !important;
    height: 58px !important;
    max-height: 58px !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: scale(1.08) !important;
    transform-origin: left center !important;
  }
}

@media (max-width: 1050px) {
  .site-header .brand {
    overflow: visible !important;
  }

  .site-header .brand img {
    width: 96px !important;
    max-width: none !important;
    height: 54px !important;
    max-height: 54px !important;
    object-fit: contain !important;
    object-position: left center !important;
    transform: scale(1.06) !important;
    transform-origin: left center !important;
  }
}

@media (max-width: 720px) {
  .site-header .brand {
    width: 88px !important;
    min-width: 88px !important;
  }

  .site-header .brand img {
    width: 84px !important;
    height: 50px !important;
    max-height: 50px !important;
    transform: scale(1.04) !important;
  }
}


/* ==========================================================
   V8 quick-contact patch — WhatsApp + Contact, right side only
   ========================================================== */
.floating-actions,
.floating-actions.floating-actions-right {
  position: fixed !important;
  left: auto !important;
  right: 20px !important;
  bottom: calc(22px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 120 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 11px !important;
  width: auto !important;
  pointer-events: none;
}

.floating-actions .float-action {
  position: relative;
  width: 54px;
  height: 58px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  pointer-events: auto;
  text-decoration: none;
  color: #ffffff;
  border: 1px solid rgba(144, 243, 255, .46);
  border-radius: 52% 48% 50% 50% / 64% 64% 36% 36%;
  background:
    radial-gradient(circle at 32% 20%, rgba(255,255,255,.52), transparent 18%),
    linear-gradient(145deg, #15d7e4 0%, #079ecb 48%, #0873ba 100%);
  box-shadow:
    inset 5px 7px 13px rgba(255,255,255,.16),
    inset -6px -8px 14px rgba(1,45,105,.12),
    0 13px 28px rgba(3,81,135,.20);
  isolation: isolate;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.floating-actions .float-action::before {
  content: "";
  position: absolute;
  inset: 5px 7px auto 10px;
  height: 13px;
  border-radius: 50%;
  background: linear-gradient(115deg, rgba(255,255,255,.48), rgba(255,255,255,0));
  transform: rotate(-18deg);
  pointer-events: none;
}

.floating-actions .float-action svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  position: relative;
  z-index: 2;
}

.floating-actions .float-whatsapp svg path:first-child {
  fill: none;
}

.floating-actions .float-whatsapp svg path:nth-child(2) {
  fill: currentColor;
  stroke: none;
}

.floating-actions .float-whatsapp {
  background:
    radial-gradient(circle at 32% 20%, rgba(255,255,255,.48), transparent 18%),
    linear-gradient(145deg, #20d9c5 0%, #0eae9b 48%, #087f8f 100%);
}

.floating-actions .float-action:hover {
  transform: translateY(-3px) scale(1.035);
  filter: saturate(1.08);
  box-shadow:
    inset 5px 7px 13px rgba(255,255,255,.20),
    inset -6px -8px 14px rgba(1,45,105,.12),
    0 16px 32px rgba(3,81,135,.26);
}

.floating-actions .float-action:focus-visible {
  outline: 3px solid rgba(96, 235, 255, .82);
  outline-offset: 4px;
}

.float-tooltip {
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%) translateX(5px);
  padding: 7px 10px;
  border-radius: 9px;
  background: rgba(3,29,66,.94);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  box-shadow: 0 8px 20px rgba(1,35,68,.18);
  pointer-events: none;
}

.float-action:hover .float-tooltip,
.float-action:focus-visible .float-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

@media (max-width: 700px) {
  .floating-actions,
  .floating-actions.floating-actions-right {
    left: auto !important;
    right: 12px !important;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    gap: 9px !important;
  }

  .floating-actions .float-action {
    width: 49px;
    height: 52px;
  }

  .floating-actions .float-action svg {
    width: 21px;
    height: 21px;
  }

  .float-tooltip {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .floating-actions .float-action,
  .float-tooltip {
    transition: none !important;
  }
}

/* ========================================================================== 
   NEXAQUA V8.4 — Transition-only brand watermark
   Visible only while the water-drop portal fills/reveals the screen.
   Never appears on the normal page after the transition completes.
   ========================================================================== */
.page-liquid-transition::before,
.page-liquid-transition::after {
  position: absolute !important;
  right: clamp(22px, 4.2vw, 72px) !important;
  z-index: 24 !important;
  pointer-events: none !important;
  opacity: 0 !important;
  will-change: opacity, transform, filter !important;
}

.page-liquid-transition::before {
  content: "" !important;
  bottom: clamp(54px, 7vh, 92px) !important;
  width: clamp(118px, 10.5vw, 188px) !important;
  height: clamp(54px, 5.4vw, 92px) !important;
  background: url("../img/nexaqua-logo-transparent.png") right center / contain no-repeat !important;
  filter: grayscale(.12) brightness(1.35) saturate(.72) blur(.15px) !important;
  transform: translate3d(10px, 5px, 0) scale(.985) !important;
}

.page-liquid-transition::after {
  content: "INTEGRATED WATER SOLUTIONS" !important;
  bottom: clamp(31px, 4.2vh, 57px) !important;
  color: rgba(211, 248, 255, .66) !important;
  font: 600 clamp(7px, .53vw, 9px)/1.2 "Inter", sans-serif !important;
  letter-spacing: .19em !important;
  text-transform: uppercase !important;
  text-align: right !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 12px rgba(46, 216, 237, .14) !important;
  transform: translate3d(8px, 5px, 0) !important;
}

/* The mark softly appears only when the falling drop has impacted and the
   blue liquid portal is expanding to full screen. */
.page-liquid-transition.nx-leave::before {
  animation: nxTransitionWatermarkLogoIn 190ms 455ms ease-out forwards !important;
}
.page-liquid-transition.nx-leave::after {
  animation: nxTransitionWatermarkTextIn 180ms 475ms ease-out forwards !important;
}

/* Keep the same mark for the first instant of the destination reveal, then
   dissolve it so absolutely nothing remains on the normal page. */
.page-liquid-transition.nx-enter::before,
.page-liquid-transition.nx-back::before,
.liquid-arrival-pending .page-liquid-transition::before,
.liquid-back-pending .page-liquid-transition::before {
  animation: nxTransitionWatermarkLogoOut 280ms ease-out forwards !important;
}
.page-liquid-transition.nx-enter::after,
.page-liquid-transition.nx-back::after,
.liquid-arrival-pending .page-liquid-transition::after,
.liquid-back-pending .page-liquid-transition::after {
  animation: nxTransitionWatermarkTextOut 235ms ease-out forwards !important;
}

@keyframes nxTransitionWatermarkLogoIn {
  0%   { opacity: 0; transform: translate3d(10px, 5px, 0) scale(.985); filter: grayscale(.2) brightness(1.28) saturate(.66) blur(1.2px); }
  58%  { opacity: .105; }
  100% { opacity: .085; transform: translate3d(0, 0, 0) scale(1); filter: grayscale(.12) brightness(1.35) saturate(.72) blur(.15px); }
}
@keyframes nxTransitionWatermarkTextIn {
  0%   { opacity: 0; transform: translate3d(8px, 5px, 0); }
  100% { opacity: .42; transform: translate3d(0, 0, 0); }
}
@keyframes nxTransitionWatermarkLogoOut {
  0%   { opacity: .085; transform: translate3d(0, 0, 0) scale(1); }
  100% { opacity: 0; transform: translate3d(5px, 3px, 0) scale(.992); }
}
@keyframes nxTransitionWatermarkTextOut {
  0%   { opacity: .42; transform: translate3d(0, 0, 0); }
  100% { opacity: 0; transform: translate3d(5px, 3px, 0); }
}

@media (max-width: 700px) {
  .page-liquid-transition::before,
  .page-liquid-transition::after {
    right: 17px !important;
  }
  .page-liquid-transition::before {
    bottom: calc(48px + env(safe-area-inset-bottom, 0px)) !important;
    width: 106px !important;
    height: 50px !important;
  }
  .page-liquid-transition::after {
    bottom: calc(28px + env(safe-area-inset-bottom, 0px)) !important;
    font-size: 6.5px !important;
    letter-spacing: .14em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition::before,
  .page-liquid-transition::after {
    animation: none !important;
    opacity: 0 !important;
  }
}

/* ========================================================================== 
   NEXAQUA V8.5 — Visible transition watermark (final correction)
   Uses the existing .liquid-arrival-brand markup as the watermark so the logo
   is guaranteed to render above the full-screen liquid portal. It is visible
   only during the page transition and is hidden on normal page content.
   ========================================================================== */

/* Disable the earlier pseudo-element watermark attempt. */
.page-liquid-transition::before,
.page-liquid-transition::after {
  content: none !important;
  animation: none !important;
  opacity: 0 !important;
}

/* Re-purpose the existing transition brand as a bottom-right watermark. */
.page-liquid-transition .liquid-arrival-brand {
  display: flex !important;
  position: absolute !important;
  z-index: 60 !important;
  left: auto !important;
  top: auto !important;
  right: clamp(28px, 3.8vw, 62px) !important;
  bottom: clamp(26px, 4.2vh, 48px) !important;
  width: auto !important;
  min-width: 150px !important;
  max-width: min(240px, 34vw) !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate3d(12px, 5px, 0) scale(.985) !important;
  transform-origin: 100% 100% !important;
  pointer-events: none !important;
  filter: none !important;
  will-change: opacity, transform !important;
}

/* Remove the old arrival rings around the logo. */
.page-liquid-transition .liquid-arrival-brand::before,
.page-liquid-transition .liquid-arrival-brand::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

.page-liquid-transition .liquid-arrival-brand img {
  display: block !important;
  width: clamp(112px, 9.2vw, 162px) !important;
  height: auto !important;
  margin: 0 !important;
  opacity: .34 !important;
  object-fit: contain !important;
  filter:
    brightness(1.28)
    saturate(.78)
    drop-shadow(0 3px 14px rgba(70, 221, 239, .10)) !important;
}

/* Replace the old helper copy with the requested watermark caption. */
.page-liquid-transition .liquid-arrival-brand span {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  white-space: nowrap !important;
}
.page-liquid-transition .liquid-arrival-brand span::after {
  content: "INTEGRATED WATER SOLUTIONS" !important;
  display: block !important;
  color: rgba(214, 247, 255, .58) !important;
  font: 600 clamp(7px, .52vw, 9px)/1.2 "Inter", sans-serif !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  text-align: right !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 10px rgba(37, 205, 229, .10) !important;
}

/* Start appearing at impact and remain visible through the full-screen blue
   portal until the browser moves to the destination page. */
.page-liquid-transition.nx-leave .liquid-arrival-brand {
  visibility: visible !important;
  animation: nxWatermarkLeaveFinal 205ms 405ms ease-out forwards !important;
}

@keyframes nxWatermarkLeaveFinal {
  0% {
    opacity: 0;
    transform: translate3d(12px, 5px, 0) scale(.985);
  }
  55% {
    opacity: .82;
  }
  100% {
    opacity: .82;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

/* The destination initially arrives already covered by the liquid curtain.
   Keep the watermark visible immediately, then softly dissolve it while the
   portal opens. */
.liquid-arrival-pending .page-liquid-transition .liquid-arrival-brand,
.liquid-back-pending .page-liquid-transition .liquid-arrival-brand {
  visibility: visible !important;
  opacity: .82 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
}

.page-liquid-transition.nx-enter .liquid-arrival-brand {
  visibility: visible !important;
  opacity: .82 !important;
  animation: nxWatermarkEnterFinal 245ms 35ms ease-out forwards !important;
}
.page-liquid-transition.nx-back .liquid-arrival-brand {
  visibility: visible !important;
  opacity: .72 !important;
  animation: nxWatermarkEnterFinal 185ms 20ms ease-out forwards !important;
}

@keyframes nxWatermarkEnterFinal {
  0% {
    opacity: .82;
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate3d(5px, 3px, 0) scale(.992);
  }
}

/* Normal page = no watermark. These selectors only become visible while one
   of the transition classes above is active. */
.page-liquid-transition:not(.nx-leave):not(.nx-enter):not(.nx-back) .liquid-arrival-brand {
  opacity: 0 !important;
  visibility: hidden !important;
}

@media (max-width: 700px) {
  .page-liquid-transition .liquid-arrival-brand {
    right: 16px !important;
    bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    min-width: 118px !important;
    max-width: 42vw !important;
    gap: 3px !important;
  }
  .page-liquid-transition .liquid-arrival-brand img {
    width: 108px !important;
    opacity: .32 !important;
  }
  .page-liquid-transition .liquid-arrival-brand span::after {
    font-size: 6.4px !important;
    letter-spacing: .12em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition .liquid-arrival-brand {
    animation: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }
}

/* ========================================================================== 
   NEXAQUA V8.6 — Watermark state/timing correction
   Important declarations in the existing transition stylesheet can override
   keyframe opacity. This final override uses delayed CSS transitions instead,
   so the watermark is guaranteed to become visible at impact/full-screen and
   fade away on the destination reveal.
   ========================================================================== */
.page-liquid-transition .liquid-arrival-brand {
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate3d(10px, 4px, 0) scale(.988) !important;
  transition:
    opacity 155ms ease-out 0ms,
    transform 185ms ease-out 0ms !important;
}

/* Outgoing page: wait for the drop impact, then show the watermark. */
.page-liquid-transition.nx-leave .liquid-arrival-brand {
  animation: none !important;
  opacity: .86 !important;
  visibility: visible !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition-delay: 390ms !important;
}

/* Destination is initially fully covered by the blue portal. Keep the brand
   already visible during that first covered frame. */
html.liquid-arrival-pending .page-liquid-transition .liquid-arrival-brand,
html.liquid-back-pending .page-liquid-transition .liquid-arrival-brand {
  animation: none !important;
  opacity: .86 !important;
  visibility: visible !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
}

/* As the new page opens, dissolve the watermark smoothly. */
.page-liquid-transition.nx-enter .liquid-arrival-brand {
  animation: none !important;
  opacity: 0 !important;
  visibility: visible !important;
  transform: translate3d(5px, 3px, 0) scale(.994) !important;
  transition:
    opacity 250ms ease-out 45ms,
    transform 250ms ease-out 45ms !important;
}
.page-liquid-transition.nx-back .liquid-arrival-brand {
  animation: none !important;
  opacity: 0 !important;
  visibility: visible !important;
  transform: translate3d(5px, 3px, 0) scale(.994) !important;
  transition:
    opacity 185ms ease-out 25ms,
    transform 185ms ease-out 25ms !important;
}

/* Slightly stronger than the failed version, but still a true watermark. */
.page-liquid-transition .liquid-arrival-brand img {
  opacity: .48 !important;
  filter:
    brightness(1.30)
    saturate(.84)
    drop-shadow(0 3px 16px rgba(70, 221, 239, .12)) !important;
}
.page-liquid-transition .liquid-arrival-brand span::after {
  color: rgba(218, 249, 255, .68) !important;
}

@media (max-width: 700px) {
  .page-liquid-transition.nx-leave .liquid-arrival-brand {
    transition-delay: 315ms !important;
  }
  .page-liquid-transition .liquid-arrival-brand img {
    opacity: .44 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-liquid-transition .liquid-arrival-brand,
  .page-liquid-transition.nx-leave .liquid-arrival-brand,
  html.liquid-arrival-pending .page-liquid-transition .liquid-arrival-brand,
  html.liquid-back-pending .page-liquid-transition .liquid-arrival-brand,
  .page-liquid-transition.nx-enter .liquid-arrival-brand,
  .page-liquid-transition.nx-back .liquid-arrival-brand {
    opacity: 0 !important;
    visibility: hidden !important;
    transition: none !important;
    animation: none !important;
  }
}

/* Pending-state specificity guard: keeps the watermark visible on the first
   fully-covered destination frame before nx-enter is applied. */
html.liquid-arrival-pending .page-liquid-transition:not(.nx-leave):not(.nx-enter):not(.nx-back) .liquid-arrival-brand,
html.liquid-back-pending .page-liquid-transition:not(.nx-leave):not(.nx-enter):not(.nx-back) .liquid-arrival-brand {
  animation: none !important;
  opacity: .86 !important;
  visibility: visible !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
}

/* ========================================================================== 
   PDF verification patch — compact heading-only cards only.
   Normal service/solution cards and all existing diagrams keep their design.
   ========================================================================== */
.service-card.compact-card {
  min-height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.service-card.compact-card h3 {
  margin-top: 0;
  margin-bottom: 0;
}
.service-card.compact-card .card-icon + h3 {
  margin-top: 12px;
}
@media (max-width: 720px) {
  .service-card.compact-card { min-height: 112px; }
}


/* ==========================================================
   NEXAQUA V8.5 — header logo proportion + contact map polish
   Keeps the existing header design; removes forced logo scaling so the
   horizontal artwork stays crisp, centered and naturally proportioned.
   ========================================================== */
.site-header .brand{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  overflow:visible!important;
}
.site-header .brand img{
  display:block!important;
  width:184px!important;
  height:auto!important;
  max-width:184px!important;
  max-height:46px!important;
  object-fit:contain!important;
  object-position:left center!important;
  transform:none!important;
  transform-origin:left center!important;
  filter:drop-shadow(0 5px 10px rgba(0,0,0,.14))!important;
  transition:transform .22s ease,filter .22s ease!important;
}
.site-header .brand:hover img{
  transform:translateY(-1px) scale(1.015)!important;
  filter:drop-shadow(0 7px 14px rgba(0,0,0,.18))!important;
}
@media (min-width:1321px){
  .site-header .brand{width:200px!important;min-width:200px!important;height:66px!important}
}
@media (min-width:1181px) and (max-width:1320px){
  .site-header .brand{width:166px!important;min-width:166px!important;height:66px!important}
  .site-header .brand img{width:158px!important;max-width:158px!important;max-height:42px!important}
}
@media (min-width:1051px) and (max-width:1180px){
  .site-header .brand{width:132px!important;min-width:132px!important}
  .site-header .brand img{width:126px!important;max-width:126px!important;max-height:38px!important}
}
@media (max-width:1050px){
  .site-header .brand{width:132px!important;min-width:132px!important}
  .site-header .brand img{width:126px!important;max-width:126px!important;max-height:38px!important}
}
@media (max-width:720px){
  .site-header .brand{width:118px!important;min-width:118px!important}
  .site-header .brand img{width:112px!important;max-width:112px!important;max-height:34px!important}
}
.v8-sonar-map.v8-map-link{display:block;text-decoration:none;color:inherit;cursor:pointer}
.v8-sonar-map.v8-map-link:focus-visible{outline:2px solid #7ff4ff;outline-offset:3px}
.contact-direct-link{color:#fff;text-decoration:none;transition:color .2s ease}
.contact-direct-link:hover,.contact-direct-link:focus-visible{color:#7ff4ff}
.contact-map-link{display:inline-flex!important;margin-top:6px;color:#8ff6ff!important;font-size:12px!important;font-weight:700;text-decoration:none}
.contact-map-link:hover,.contact-map-link:focus-visible{color:#fff!important;text-decoration:underline}

.footer-col .footer-address-link{line-height:1.35;max-width:270px}

/* ==========================================================
   NEXAQUA V8.6 — desktop header single-line fit
   Keeps the improved logo proportions while preventing nav/CTA wrapping.
   ========================================================== */
@media (min-width: 1181px) {
  .site-header .nav-shell {
    width: min(1440px, calc(100vw - 48px)) !important;
    gap: 14px !important;
  }
  .site-header .brand {
    flex: 0 0 200px !important;
    width: 200px !important;
    min-width: 200px !important;
  }
  .site-header .brand img {
    width: 184px !important;
    max-width: 184px !important;
    max-height: 46px !important;
  }
  .site-header .nav-links {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    justify-content: center !important;
    gap: 1px !important;
    white-space: nowrap !important;
  }
  .site-header .nav-links a,
  .home-page .site-header:not(.scrolled) .nav-links a {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding-inline: 7px !important;
  }
  .site-header .header-actions {
    flex: 0 0 auto !important;
    min-width: max-content !important;
  }
  .site-header .header-actions .btn-primary {
    width: auto !important;
    min-width: max-content !important;
    white-space: nowrap !important;
    padding-inline: 18px !important;
  }
}

/* Keep the full desktop navigation on medium-wide screens without wrapping. */
@media (min-width: 1051px) and (max-width: 1180px) {
  .site-header .nav-shell {
    width: min(100% - 28px, 1140px) !important;
    gap: 8px !important;
  }
  .site-header .brand {
    flex: 0 0 126px !important;
    width: 126px !important;
    min-width: 126px !important;
  }
  .site-header .brand img {
    width: 122px !important;
    max-width: 122px !important;
    max-height: 38px !important;
  }
  .site-header .nav-links {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    justify-content: center !important;
    gap: 0 !important;
    white-space: nowrap !important;
  }
  .site-header .nav-links a,
  .home-page .site-header:not(.scrolled) .nav-links a {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    font-size: 11.5px !important;
    padding-inline: 5px !important;
  }
  .site-header .header-actions {
    flex: 0 0 auto !important;
    min-width: max-content !important;
  }
  .site-header .header-actions .btn-primary {
    width: auto !important;
    min-width: max-content !important;
    white-space: nowrap !important;
    font-size: 11.5px !important;
    padding-inline: 12px !important;
  }
}