/* One continuous, reversible water journey, painted behind the page content. */
.home .site-main { position: relative; isolation: isolate; overflow-x: clip; }
.home { background: #f2fafc; }
.water-journey { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.journey-atmosphere { position: absolute; inset: -20%; background: radial-gradient(ellipse at 78% 40%, #bce7f45c, transparent 42%), radial-gradient(ellipse at 18% 75%, #b9e5ea55, transparent 45%), #f3fafc; }
.journey-flow { position: absolute; inset: 0; overflow: visible; opacity: .36; }
.journey-flow path { fill: none; stroke: #7db7c7; stroke-width: .8; }
.journey-flow .flow-echo { stroke-dasharray: 2 10; opacity: .5; }
.journey-drop.water-visual { position: absolute; inset: 0 auto auto 0; width: 620px; height: 620px; max-width: none; max-height: none; margin: 0; aspect-ratio: auto; transform-origin: 50% 50%; will-change: transform, opacity; z-index: 2; }
.journey-drop .water-canvas { transition: opacity .6s; }
.journey-drop .water-fallback {
  inset: 0; border: 0; border-radius: 0; box-shadow: none; transform: none;
  background: url('water-fallback.svg') center / contain no-repeat;
}
.journey-drop[data-water-renderer="svg"] .water-canvas { opacity: 0; transition: none; }
.drop-halo { position: absolute; inset: 16%; background: radial-gradient(ellipse, #7fc8e120, transparent 70%); filter: blur(28px); z-index: -1; }
.journey-hud { position: absolute; right: 34px; bottom: 24px; display: flex; align-items: center; gap: 12px; padding: 11px 16px; background: #f8feffbd; border: 1px solid #d9edf0; border-radius: 30px; backdrop-filter: blur(16px); font: 16px ui-monospace, monospace; color: #557f91; letter-spacing: .04em; }
.hud-dot { width: 5px; height: 5px; border-radius: 50%; background: #d32028; box-shadow: 0 0 0 4px #d3202808; }
.hud-track { width: 66px; height: 1px; background: #d1e4eb; }
.hud-track i { display: block; height: 1px; width: 100%; background: #368fa8; transform: scaleX(var(--journey-progress, 0)); transform-origin: left; }
.hud-end { color: #1f697f; }
.journey-section { position: relative; z-index: 1; background: none !important; }
.hero.journey-section { height: 105svh; min-height: 780px; }
.hero.journey-section .hero-sticky { position: relative; height: 100%; min-height: inherit; background: none; overflow: visible; }
.hero-sticky::after { display: none; }
.hero-grid { min-height: inherit; padding: 135px 0 145px; grid-template-columns: 1.06fr .94fr; }
.hero-copy { opacity: 1; transform: none; }
.hero-water-slot { position: relative; width: 100%; height: min(62svh, 580px); }
.hero-water-slot .water-orbit { inset: 9% -6%; }
.hero-water-slot .orbit-two { inset: 2% -10%; }
.hero-water-slot .visual-card { bottom: 17%; right: -4%; }
.hero-water-slot .water-coordinate { left: 0; top: 6%; }
.hero-water-slot .water-formula { right: 0; }
.hero-water-slot .scene-caption { bottom: 4%; }
.scene-caption { position: absolute; left: 50%; bottom: 7%; transform: translateX(-50%); width: max-content; max-width: 100%; text-align: center; font: 16px ui-monospace, monospace; letter-spacing: .05em; color: #6c94a4; }
.hero .scroll-cue { bottom: 112px; }
.hero-index { background: #f6fcfd40; }
.journey-columns { display: grid; gap: 80px; grid-template-columns: .36fr .64fr; align-items: stretch; }
.journey-columns.visual-right { grid-template-columns: .61fr .39fr; }
.journey-content { position: relative; min-width: 0; }
.journey-lane { position: relative; min-width: 0; }
.lane-sticky { position: sticky; top: calc(50svh - 260px); height: 520px; width: 100%; }
.lane-orbits { position: absolute; inset: 14% -5%; border: 1px solid #a8d1de40; border-radius: 50%; transform: rotate(-28deg) scaleY(.76); }
.lane-orbits::before { content: ''; position: absolute; inset: -12%; border: 1px dashed #a8d1de40; border-radius: 50%; transform: rotate(54deg) scaleY(.9); }
.lane-index { position: absolute; top: 10%; left: 0; color: #8baab7; font: 16px ui-monospace, monospace; letter-spacing: .12em; }
.journey-content .split-heading { display: block; margin-bottom: 40px; }
.journey-content .section-intro { margin-top: 25px; max-width: 550px; }
.journey-content .section-title { font-size: clamp(38px, 3.5vw, 54px); }
.journey-content .solutions-grid { grid-template-columns: 1fr 1fr; }
.journey-content .solution-card { background: #ffffffb3; min-height: 295px; backdrop-filter: blur(12px); }
.journey-content .solution-card.priority { background: #0b3747f2; }
.journey-content .solution-card h3 { font-size: 22px; margin-top: 80px; }
.journey-content .solution-card p { font-size: 16px; }
#solutions { padding: 110px 0 130px; }

/* The filtration device stays in view while the same drop crosses its membrane. */
.filtration-section { height: 210svh; min-height: 1450px; }
.filtration-sticky { position: sticky; top: 0; height: 100svh; min-height: 720px; display: flex; align-items: center; }
.filtration-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: center; }
.filter-copy { padding-right: 30px; }
.filter-copy h2 { font-size: clamp(40px, 4.2vw, 63px); }
.filter-copy h2 span { color: #3b90a8; }
.filter-copy .section-intro { font-size: 16px; line-height: 1.9; }
.filter-stages { display: flex; margin-top: 40px; border-top: 1px solid #c6dfe8; }
.filter-stages > div { flex: 1; padding-top: 20px; opacity: .4; transition: opacity .3s; }
.filter-stages > div.is-active { opacity: 1; }
.filter-stages b { display: block; color: #d32028; font: 16px ui-monospace, monospace; margin-bottom: 9px; }
.filter-stages span { font-size: 16px; color: #385e6f; }
.filter-note { display: block; margin-top: 25px; font-size: 16px; color: #8ba6b1; }
.filter-device { position: relative; height: min(73svh, 600px); width: min(100%, 440px); justify-self: center; }
.filter-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.filter-captured { opacity: var(--captured, 0); }
.filter-port-label { position: absolute; left: 63%; color: #779aaa; font: 16px ui-monospace, monospace; letter-spacing: .1em; }
.port-in { top: 4%; }.port-out { bottom: 3%; }
.filter-trace { position: absolute; top: 18%; bottom: 17%; left: 23%; right: 23%; border: 1px solid #bbecf9; box-shadow: 0 0 45px #84cfe122; opacity: var(--captured, 0); border-radius: 100px; transform: scaleY(var(--filter-sweep, 0)); transform-origin: top; pointer-events: none; }

#partners { padding: 110px 0 120px; overflow: visible; color: var(--ink); }
.journey-content .partners-head { display: block; margin-bottom: 40px; }
.journey-content .partners-head p { max-width: 520px; color: #6b8794; font-size: 16px; margin: 25px 0 0; }
.journey-content .partners-grid { grid-template-columns: 1fr 1fr; }
.journey-content .partner-card, .journey-content .partner-card.featured { grid-column: auto; background: #ffffffb8; border-color: #d7e7ed; min-height: 190px; padding: 24px; }
.journey-content .partner-card.featured { background: #103746ed; color: white; min-height: 240px; border-color: #254e5c; }
.journey-content .partner-card:last-child { grid-column: 1 / -1; min-height: 170px; }
.journey-content .partner-type { color: #6d94a6; font-size: 16px; }
.journey-content .partner-card h3 { font-size: 26px; }
.journey-content .partner-card p { color: #638292; font-size: 16px; }
.journey-content .featured .partner-type, .journey-content .featured p { color: #9ab8c5; }
.journey-content .partner-card:hover { background: #faffffed; border-color: #75afbf; }
.journey-content .featured:hover { background: #174555; }
#process { padding: 140px 0; }
.journey-content .process-grid { grid-template-columns: 1fr 1fr; gap: 38px 28px; border: 0; margin-top: 48px; }
.journey-content .process-step, .journey-content .process-step + .process-step { border: 0; border-top: 1px solid #cbdfe7; padding: 25px 12px 0 0; margin: 0; }
.journey-content .process-step::before, .journey-content .process-step + .process-step::before { top: -4px; left: 0; }
.journey-content .process-step h3 { margin: 24px 0 14px; }
.journey-content .process-grid::before { display: none; }

/* Destination: the cup now closes the story, immediately before the footer. */
.arrival-section { height: 220svh; min-height: 1600px; padding: 0 !important; overflow: visible !important; }
.arrival-sticky { position: sticky; top: 0; height: 100svh; min-height: 760px; display: flex; align-items: center; }
.arrival-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 95px; align-items: center; }
.arrival-section .focus-content { padding: 85px 0 45px; background: none; }
.arrival-section .focus-content h2 { font-size: clamp(38px, 3.8vw, 56px); max-width: 540px; margin-bottom: 20px; }
.arrival-section .focus-content > p:not(.section-kicker) { font-size: 16px; margin-bottom: 20px; max-width: 510px; }
.arrival-section .check-list { grid-template-columns: 1fr 1fr; margin: 25px 0; gap: 12px 24px; }
.arrival-cta { padding-top: 23px; border-top: 1px solid #c4dce5; }
.arrival-cta h3 { font-size: 22px; line-height: 1.3; letter-spacing: -.03em; font-weight: 500; margin: 0 0 13px; max-width: 470px; }
.arrival-cta p { font-size: 16px !important; line-height: 1.8; color: #6b8592 !important; max-width: 450px; margin: 0 0 20px; }
.arrival-cta .button { min-height: 46px; font-size: 16px; }
.arrival-cta .button::after { display: none; }
.arrival-contact-anchor { position: absolute; top: calc(100% - 100svh); left: 0; width: 1px; height: 1px; scroll-margin-top: 0; }
.arrival-visual-wrap { position: relative; height: min(84svh, 730px); }
.arrival-visual { position: relative; height: 100%; width: 100%; }
.arrival-wordmark { position: absolute; top: 8%; left: 0; right: 0; text-align: center; font-size: clamp(27px, 2.6vw, 40px); line-height: 1.15; letter-spacing: -.055em; font-weight: 500; opacity: var(--arrival-title, 0); transform: translateY(calc((1 - var(--arrival-title, 0))*20px)); }
.arrival-wordmark span { color: #4a99b0; }
.destination-glass { display: block; height: 100%; width: 100%; overflow: visible; position: relative; z-index: 2; }
.destination-fill { transform: translateY(calc((1 - var(--cup-fill, 0))*175px)); }
.destination-splash { transform-box: fill-box; transform-origin: center; transform: scaleX(calc(.12 + var(--splash, 0)*1.25)); opacity: calc(1 - var(--splash, 0)); }
.arrival-stream { stroke-dasharray: 120; stroke-dashoffset: calc(120px*(1 - var(--pour, 0))); opacity: var(--pour, 0); }
.splash-beads { opacity: var(--pour, 0); transform: translateY(calc(var(--splash, 0)*-20px)); }
.arrival-ripples { position: absolute; top: 71%; left: 50%; width: 72%; aspect-ratio: 1; transform: translate(-50%, -50%) rotateX(74deg); opacity: var(--splash, 0); }
.arrival-ripples i { position: absolute; inset: 0; border: 1px solid #80c3d8; border-radius: 50%; transform: scale(calc(.3 + var(--splash, 0)*1.1)); opacity: calc(1 - var(--splash, 0)*.55); }
.arrival-ripples i:nth-child(2) { inset: -14%; }.arrival-ripples i:nth-child(3) { inset: -28%; }
.arrival-visual .focus-label { bottom: 10%; left: 0; background: #f8feffbf; border-color: #cde5ef; }
.arrival-visual .scene-caption { bottom: 0; }
.site-footer { position: relative; z-index: 2; }

@media (max-width: 1100px) {
  .journey-columns { gap: 42px; grid-template-columns: .3fr .7fr; }
  .journey-columns.visual-right { grid-template-columns: .68fr .32fr; }
  .journey-content .solution-card { padding: 22px; }
  .journey-content .solution-card h3 { font-size: 21px; }
  .filtration-grid { gap: 45px; }
  .filter-copy { padding-right: 0; }
  .arrival-grid { gap: 45px; }
  .arrival-section .focus-content h2 { font-size: 43px; }
  .arrival-section .check-list { gap: 10px 14px; }
}
@media (max-width: 760px) {
  .hero.journey-section { height: auto; min-height: 900px; }
  .hero.journey-section .hero-sticky { min-height: 900px; }
  .hero-grid { display: block; padding: 130px 0 160px; }
  .hero h1 { font-size: clamp(40px, 8.5vw, 58px); max-width: 600px; }
  .hero h1 span { display: block; }
  .hero-lead { font-size: 16px; max-width: 420px; }
  .hero-actions { flex-direction: row; }
  .hero-water-slot { width: 88%; max-width: 420px; height: 330px; margin: 15px auto 0; }
  .hero-water-slot .water-coordinate { font-size: 16px; }
  .hero-water-slot .visual-card { right: -5%; bottom: 20%; }
  .hero .scroll-cue { bottom: 105px; }
  .scene-caption { font-size: 16px; }
  .journey-columns { gap: 18px; grid-template-columns: 100px minmax(0, 1fr); }
  .journey-columns.visual-right { grid-template-columns: minmax(0, 1fr) 100px; }
  .journey-content .section-title { font-size: 34px; }
  .journey-content .section-intro { font-size: 16px; }
  .journey-content .solutions-grid { grid-template-columns: 1fr; }
  .journey-content .solution-card { padding: 23px; min-height: 270px; }
  .journey-content .solution-card h3 { font-size: 23px; }
  .journey-content .solution-card p { font-size: 16px; }
  .lane-sticky { height: 400px; top: calc(50svh - 200px); }
  .lane-sticky .scene-caption { white-space: normal; width: 110px; font-size: 16px; bottom: 8%; line-height: 1.8; }
  .lane-index { font-size: 16px; letter-spacing: .04em; }
  .lane-orbits { inset: 27% -20%; }
  #solutions, #partners { padding: 85px 0; }
  .filtration-section { height: 225svh; min-height: 1800px; }
  .filtration-sticky { min-height: 850px; }
  .filtration-grid { display: block; padding-top: 70px; }
  .filter-copy { max-width: 550px; }
  .filter-copy h2 { font-size: 38px; }
  .filter-copy .section-intro { font-size: 16px; margin-top: 18px; }
  .filter-stages { margin-top: 24px; }
  .filter-stages > div { padding-top: 13px; }
  .filter-stages span { font-size: 16px; }
  .filter-stages b { font-size: 16px; margin-bottom: 5px; }
  .filter-note { margin-top: 13px; font-size: 16px; }
  .filter-device { width: 300px; max-width: 85%; height: 420px; margin: 10px auto 0; }
  .journey-content .partners-grid { grid-template-columns: 1fr; }
  .journey-content .partner-card, .journey-content .partner-card.featured, .journey-content .partner-card:last-child { grid-column: auto; padding: 22px; min-height: 215px; }
  .journey-content .partner-card h3 { font-size: 27px; }
  .journey-content .partner-card p { font-size: 16px; }
  .journey-content .partners-head p { font-size: 16px; }
  #process { padding: 100px 0 65px; }
  .journey-content .process-grid { grid-template-columns: 1fr; gap: 30px; }
  .journey-content .process-step h3 { font-size: 23px; }
  .journey-content .process-step p { font-size: 16px; }
  .arrival-section { height: auto; min-height: 0; }
  .arrival-sticky { display: block; height: auto; min-height: 0; position: relative; }
  .arrival-grid { display: block; }
  .arrival-section .focus-content { padding: 100px 0 30px; }
  .arrival-section .focus-content h2 { font-size: 42px; }
  .arrival-section .focus-content > p:not(.section-kicker) { font-size: 16px; }
  .arrival-section .check-list { grid-template-columns: 1fr 1fr; }
  .arrival-cta h3 { font-size: 27px; }
  .arrival-cta p { font-size: 16px !important; }
  .arrival-cta .button { font-size: 16px; }
  .arrival-visual-wrap { height: 185svh; min-height: 1250px; }
  .arrival-visual { position: sticky; top: 0; height: 100svh; min-height: 650px; }
  .destination-glass { position: absolute; top: 0; left: -22.5%; width: 145%; height: 85%; }
  .arrival-wordmark { top: 17%; font-size: 39px; }
  .arrival-visual .focus-label { bottom: 15%; left: 10px; }
  .arrival-visual .scene-caption { bottom: 6%; }
  .arrival-contact-anchor { top: 110px; scroll-margin-top: 110px; }
  .journey-hud { bottom: 15px; right: 15px; font-size: 16px; padding: 10px 12px; gap: 9px; }
  .hud-track { width: 40px; }
}
@media (max-width: 420px) {
  .journey-columns { grid-template-columns: 74px minmax(0, 1fr); gap: 13px; }
  .journey-columns.visual-right { grid-template-columns: minmax(0, 1fr) 74px; }
  .journey-content .section-title { font-size: 31px; }
  .journey-content .section-kicker { font-size: 16px; gap: 8px; }
  .journey-content .section-kicker::before { width: 15px; }
  .journey-content .solution-card, .journey-content .partner-card, .journey-content .partner-card.featured { padding: 19px; }
  .journey-content .solution-card h3 { font-size: 21px; }
  .journey-content .solution-card p { font-size: 16px; }
  .journey-content .solution-mark { width: 48px; height: 48px; right: 18px; }
  .journey-content .partner-card h3 { font-size: 25px; }
  .filter-copy h2 { font-size: 34px; }
  .filter-device { height: 390px; }
  .lane-sticky .scene-caption { width: 85px; }
}
@media (prefers-reduced-motion: reduce) {
  .journey-drop { display: none; }
  .journey-flow, .journey-hud { display: none; }
  .hero-water-slot::after { content: ''; position: absolute; inset: 15% 28%; background: linear-gradient(135deg, #ecfcff, #82c4d8); border: 2px solid #faffff; border-radius: 55% 55% 55% 55% / 75% 75% 40% 40%; box-shadow: inset 10px 15px 30px #ffffffa0; }
  .filtration-section, .arrival-section { height: auto; min-height: 0; }
  .filtration-sticky, .arrival-sticky { position: relative; height: auto; min-height: 0; padding: 70px 0; }
  .filter-device { min-height: 420px; }
  .arrival-visual-wrap { height: 650px; min-height: 0; }
  .arrival-visual { position: relative; height: 100%; }
  .destination-fill { transform: none; }
  .filter-captured { opacity: .6; }
  .arrival-contact-anchor { top: 0; }
}