/* V22: restored open, cascading central-rail waterfall with non-overlapping lanes. */
.how-subhero{min-height:auto;padding-bottom:78px}
.how-overview{width:min(calc(100% - 56px),1530px);padding:10px 0 120px}
.how-overview-head,.how-summary-intro{max-width:920px}
.how-overview-head h2,.how-summary-intro h2{margin:0;font:500 clamp(44px,5.6vw,78px)/1 Manrope,Inter,sans-serif;letter-spacing:-.055em}
.how-overview-head>p:last-child,.how-summary-grid article p{color:#a29d92;font-size:16px;line-height:1.7}
.waterfall-story{margin-top:52px;display:grid;grid-template-columns:minmax(0,1.42fr) minmax(340px,.78fr);gap:clamp(28px,3vw,55px);align-items:start}
.waterfall-sticky{position:sticky;top:90px;min-width:0}
.waterfall-visual{
  --axis-x:50%;
  position:relative;min-width:0;width:100%;height:780px;
  background:radial-gradient(ellipse at 30% 16%,rgba(216,173,89,.065),transparent 55%),radial-gradient(ellipse at 75% 85%,rgba(216,173,89,.035),transparent 48%);
  border:0;border-radius:0;box-shadow:none;isolation:isolate;
}
.wf-background-grid{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.3;background-image:linear-gradient(rgba(240,236,223,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(240,236,223,.028) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(180deg,transparent,black 8%,black 90%,transparent)}
/* Axis is a decorative connecting element behind every label and information tile. */
.wf-core-line,.wf-progress-line{position:absolute;left:var(--axis-x);top:44px;transform:translateX(-50%);width:2px;border-radius:3px;z-index:0;pointer-events:none}
.wf-core-line{height:682px;background:linear-gradient(180deg,rgba(216,173,89,.1),rgba(216,173,89,.25),rgba(216,173,89,.07))}
.wf-progress-line{height:var(--wf-progress,95px);max-height:682px;background:linear-gradient(180deg,#efd38e,#c18c37);box-shadow:0 0 14px rgba(216,173,89,.25);transition:height .65s cubic-bezier(.2,.72,.2,1)}
.wf-pulse{position:absolute;left:var(--axis-x);transform:translateX(-50%);width:15px;height:15px;border:1px solid rgba(216,173,89,.3);border-radius:50%;background:#17140d;z-index:1;pointer-events:none}
.wf-pulse::before{content:"";position:absolute;inset:-7px;border:1px solid rgba(216,173,89,.2);border-radius:50%;animation:wfPulse 2.6s ease-in-out infinite}
.wf-pulse::after{content:"";position:absolute;inset:3px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff7da,#d8ad59 70%);box-shadow:0 0 12px rgba(216,173,89,.7)}
.wf-pulse-top{top:37px}
.wf-pulse-bottom{top:calc(44px + var(--wf-progress,95px) - 8px);transition:top .65s cubic-bezier(.2,.72,.2,1)}
/* Stage titles alternate beside the central flow, and never occupy a shared lane with chips. */
.wf-stage{position:absolute;z-index:3;display:flex;gap:12px;align-items:center;width:43%;max-width:295px;min-width:0;opacity:.76;transition:opacity .4s ease}
.wf-stage-number{width:40px;height:40px;display:grid;place-items:center;flex:0 0 40px;border:1px solid rgba(216,173,89,.34);border-radius:50%;background:#15120c;color:var(--gold-light);font:600 11px Manrope,sans-serif;letter-spacing:.1em;box-shadow:0 0 0 6px rgba(9,9,7,.95)}
.wf-stage-copy{min-width:0;padding:0;background:none;border:0;border-radius:0}
.wf-stage-copy small{display:block;margin-bottom:5px;color:var(--gold);font:600 11px/1.2 Manrope,sans-serif;letter-spacing:.13em}
.wf-stage-copy strong{display:block;color:#f0e9dc;font:500 clamp(15px,1.35vw,20px)/1.2 Manrope,sans-serif;letter-spacing:-.025em}
.wf-stage-launch{top:24px;left:3%}
.wf-stage-build{top:205px;right:2%}
.wf-stage-trade{top:364px;left:3%}
.wf-stage-recover{top:586px;right:2%}
.wf-stage.is-active{opacity:1}
.wf-stage.is-active .wf-stage-number{border-color:var(--gold-light);box-shadow:0 0 0 6px rgba(9,9,7,.95),0 0 18px rgba(216,173,89,.23)}
/* Launch: three equal lanes, separated from the build stage below. */
.wf-launch-branches{position:absolute;left:5%;right:5%;top:95px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;z-index:3}
.wf-branch{min-width:0;min-height:89px;padding:13px 14px;border:1px solid rgba(216,173,89,.16);border-radius:16px;background:linear-gradient(145deg,#17150f,#0e0d0a);opacity:.76;transform:translateY(5px);transition:opacity .4s ease,transform .4s ease,border-color .4s ease}
.wf-branch small,.wf-underlayer-item small{display:block;color:var(--gold);font:600 11px/1.3 Manrope,sans-serif;letter-spacing:.12em;margin-bottom:8px}
.wf-branch strong,.wf-underlayer-item strong{display:block;color:#e7dfd2;font:500 clamp(13px,1.2vw,17px)/1.3 Manrope,sans-serif}
.wf-branch-lines{position:absolute;top:81px;height:21px;width:1px;background:linear-gradient(180deg,rgba(216,173,89,.35),transparent);z-index:1;pointer-events:none}
.wf-branch-line-one{left:20%}.wf-branch-line-two{left:50%}.wf-branch-line-three{left:80%}
/* Build: a clearly distinct horizontal band. */
.wf-build-controls{position:absolute;left:6%;right:6%;top:300px;min-height:38px;display:flex;flex-wrap:wrap;gap:7px;align-items:center;justify-content:center;z-index:3;opacity:.76;transition:opacity .4s ease}
.wf-build-controls span{background:#14120d;border:1px solid rgba(216,173,89,.19);border-radius:24px;padding:9px 12px;font-size:12px;line-height:1.35;color:#d4c8b5;text-align:center}
.wf-build-controls span:first-child{border-color:rgba(216,173,89,.4);color:var(--gold-light)}
/* Trade: two inputs and the reserve layer form two non-overlapping rows. */
.wf-trade-streams{position:absolute;left:6%;right:6%;top:419px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;z-index:3}
.wf-trade-pill{position:relative;min-height:45px;padding:11px 15px;opacity:.76;border-radius:14px;background:#14120d;border:1px solid rgba(216,173,89,.21);color:#e1d8c9;font-size:12px;line-height:1.45;transition:opacity .4s ease}
.wf-trade-streams::before,.wf-trade-streams::after{content:"";position:absolute;top:21px;left:calc(50% - 14px);width:28px;height:1px;z-index:0;opacity:0;background:linear-gradient(90deg,transparent,var(--gold),transparent);pointer-events:none}
.wf-underlayer{position:absolute;left:6%;right:6%;top:479px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:11px;align-items:center;z-index:3}
.wf-underlayer-item{min-width:0;min-height:73px;padding:13px 16px;background:#15130e;border:1px solid rgba(216,173,89,.15);border-radius:16px}
.wf-underlayer-link{color:var(--gold);font-size:16px}
/* Recovery: separate tier for consolidation and a final clear payout. */
.wf-recovery-payout{position:absolute;left:6%;right:6%;top:653px;z-index:3;opacity:.76;transition:opacity .4s ease}
.wf-recovery-sources{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.wf-recovery-sources span{font-size:11px;line-height:1.3;color:#d1c5b1;padding:8px 11px;background:#15130e;border:1px solid rgba(216,173,89,.2);border-radius:22px}
.wf-recovery-arrow{width:1px;height:16px;margin:7px auto;background:var(--gold)}
.wf-holders{display:flex;gap:8px;align-items:center;justify-content:center;background:#12100c;width:max-content;max-width:100%;padding:6px 12px;margin:0 auto;border-radius:20px}
.wf-holders i{width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 33% 30%,#fff4cc,#d8ad59);box-shadow:0 0 8px rgba(216,173,89,.26)}
.wf-holders b{margin-left:5px;font:500 14px/1.2 Manrope,sans-serif;color:#eee4d4}
.waterfall-visual[data-stage="0"]{--wf-progress:110px}
.waterfall-visual[data-stage="1"]{--wf-progress:264px}
.waterfall-visual[data-stage="2"]{--wf-progress:488px}
.waterfall-visual[data-stage="3"]{--wf-progress:682px}
.waterfall-visual[data-stage="0"] .wf-branch{opacity:1;transform:translateY(0);border-color:rgba(216,173,89,.36)}
.waterfall-visual[data-stage="1"] .wf-build-controls{opacity:1}
.waterfall-visual[data-stage="2"] .wf-trade-pill{opacity:1}
.waterfall-visual[data-stage="3"] .wf-recovery-payout{opacity:1}
.waterfall-visual[data-stage="0"] .wf-stage-launch,.waterfall-visual[data-stage="1"] .wf-stage-build,.waterfall-visual[data-stage="2"] .wf-stage-trade,.waterfall-visual[data-stage="3"] .wf-stage-recover{opacity:1}
/* Narrative remains a separate scroll lane, not placed over the diagram. */
.waterfall-copy{display:grid;gap:16px;min-width:0}
.wf-step{min-height:76vh;display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:center;opacity:.65;transition:opacity .35s ease}
.wf-step.is-active{opacity:1}
.wf-step-index{color:rgba(216,173,89,.32);font:500 clamp(46px,4vw,69px)/.9 Manrope,sans-serif;letter-spacing:-.06em}
.wf-step-body{min-width:0;padding:22px 4px 22px 10px;border-radius:0;border:0;background:transparent}
.wf-step-body h3{margin:9px 0 16px;color:#f0eadf;font:500 clamp(27px,2.9vw,39px)/1.07 Manrope,sans-serif;letter-spacing:-.04em}
.wf-step-body p:not(.eyebrow){margin:0 0 17px;color:#a39d91;font-size:16px;line-height:1.7}
.wf-step-body ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.wf-step-body li{position:relative;padding-left:18px;color:#d5cec0;font-size:14px;line-height:1.6}
.wf-step-body li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.how-summary{padding:10px 0 135px}
.how-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.how-summary-grid article{border:1px solid var(--line-soft);border-radius:22px;padding:28px;background:rgba(255,255,255,.015)}
.how-summary-grid small{display:block;color:var(--gold);font-size:11px;letter-spacing:.13em;margin-bottom:18px}
.how-summary-grid strong{display:block;color:#f0eadf;font:500 23px/1.15 Manrope,sans-serif;margin-bottom:10px}
@keyframes wfPulse{0%,100%{transform:scale(.8);opacity:.35}50%{transform:scale(1.1);opacity:.8}}
/* Tablet: diagram gets full measure; smaller viewport uses a shorter scroll summary. */
@media(max-width:1120px){
 .waterfall-story{grid-template-columns:minmax(0,1fr);gap:28px}
 .waterfall-sticky{position:relative;top:auto}
 .waterfall-visual{max-width:920px;margin-inline:auto}
 .waterfall-copy{gap:6px}
 .wf-step{min-height:auto;grid-template-columns:54px minmax(0,1fr);padding:18px 0}
}
@media(max-width:680px){
 .how-overview{width:min(calc(100% - 32px),1530px)}
 .waterfall-visual{height:870px;--axis-x:50%}
 .wf-stage{width:45%;max-width:none;gap:8px}
 .wf-stage-number{width:32px;height:32px;flex-basis:32px}
 .wf-stage-copy strong{font-size:14px}
 .wf-stage-copy small{font-size:11px}
 .wf-stage-launch{top:15px;left:0}
 .wf-stage-build{top:291px;right:0}
 .wf-stage-trade{top:456px;left:0}
 .wf-stage-recover{top:692px;right:0}
 .wf-core-line,.wf-progress-line{top:38px;max-height:772px}
 .wf-core-line{height:772px}
 .wf-pulse-top{top:31px}
 .wf-pulse-bottom{top:calc(38px + var(--wf-progress,95px) - 8px)}
 .waterfall-visual[data-stage="0"]{--wf-progress:156px}
 .waterfall-visual[data-stage="1"]{--wf-progress:332px}
 .waterfall-visual[data-stage="2"]{--wf-progress:591px}
 .waterfall-visual[data-stage="3"]{--wf-progress:772px}
 .wf-launch-branches{top:88px;left:4%;right:4%;grid-template-columns:1fr;gap:7px}
 .wf-branch{min-height:53px;padding:9px 13px;border-radius:12px}
 .wf-branch small{font-size:10px;margin-bottom:3px}
 .wf-branch strong{font-size:14px}
 .wf-branch-lines{display:none}
 .wf-build-controls{top:361px;left:4%;right:4%;gap:6px}
 .wf-build-controls span{font-size:11px;padding:7px 10px}
 .wf-trade-streams{top:528px;left:4%;right:4%;gap:7px}
 .wf-trade-pill{font-size:12px;padding:9px 10px}
 .wf-underlayer{top:601px;left:4%;right:4%;gap:6px}
 .wf-underlayer-item{padding:10px 9px;min-height:70px}
 .wf-underlayer-item strong{font-size:12px}
 .wf-underlayer-item small{font-size:10px}
 .wf-recovery-payout{top:754px;left:2%;right:2%}
 .wf-recovery-sources{gap:4px}
 .wf-recovery-sources span{font-size:11px;padding:6px 8px}
 .wf-recovery-arrow{height:11px;margin:5px auto}
 .wf-holders{padding:6px 10px}
 .wf-holders b{font-size:12px}
 .wf-step{grid-template-columns:1fr;gap:9px}
 .wf-step-index{font-size:41px}
 .wf-step-body{padding:18px 4px 18px 0}
 .wf-step-body h3{font-size:28px}
 .how-summary-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.wf-progress-line,.wf-pulse-bottom,.wf-stage,.wf-branch,.wf-build-controls,.wf-trade-pill,.wf-recovery-payout,.wf-step{transition:none}.wf-pulse::before{animation:none}}

/* V23: give the TRADE heading its own clear lane above the transaction inputs.
   Keep the original waterfall composition and scroll animation unchanged. */
@media (min-width: 681px) {
  .wf-stage-trade { top: 346px; }
  .wf-trade-streams { top: 445px; }
  .wf-underlayer { top: 505px; }
  .wf-stage-recover { top: 601px; }
  .wf-recovery-payout { top: 665px; }
}

/* Homepage placement */
.homepage-waterfall { padding-top: 118px; padding-bottom: 128px; border-top: 1px solid var(--line-soft); }
@media (max-width: 800px) { .homepage-waterfall { padding-top: 92px; padding-bottom: 96px; } }

/* V28: shorter lifecycle narrative */
.wf-step { min-height: 62vh; }
.wf-step-body p:not(.eyebrow) { margin-bottom: 0; max-width: 640px; }
@media (max-width: 1120px) { .wf-step { min-height: auto; padding: 34px 0; } }