/* WATER download gate. Uses the tokens in /assets/styles.css. */
.water-gate{width:min(calc(100% - 2rem),34rem);padding:clamp(1.5rem,4vw,2.5rem);background:#151515;color:var(--white);border:0;border-left:6px solid var(--red);box-shadow:0 30px 80px rgba(0,0,0,.6)}
.water-gate::backdrop{background:rgba(9,9,9,.78);backdrop-filter:blur(4px)}
.water-gate h2{font-size:clamp(2rem,6vw,3rem);margin:.4rem 0 .8rem}
.water-gate-lede{color:var(--muted);margin:0 0 1.2rem}
.water-gate-close{position:absolute;top:.6rem;right:.8rem;background:none;border:0;color:var(--white);font-size:1.8rem;line-height:1;cursor:pointer;padding:.25rem .5rem}
.water-gate-close:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.water-gate-form label{display:block;font-size:.74rem;font-weight:950;text-transform:uppercase;letter-spacing:.16em;color:#f05c62;margin-bottom:.4rem}
.water-gate-row{display:flex;gap:.6rem;flex-wrap:wrap}
.water-gate-row input{flex:1 1 14rem;min-width:0;padding:.85rem 1rem;font:inherit;color:var(--ink);background:var(--white);border:1px solid var(--white);border-radius:0}
.water-gate-row input:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.water-gate-row .button{flex:0 0 auto;color:#fff;border-color:var(--red)}
.water-gate-status{min-height:1.5em;margin:.9rem 0 0;font-weight:700;color:var(--blue)}
.water-gate-fine{font-size:.82rem;color:var(--muted);margin:.6rem 0 0}
.water-gate-fine a{color:var(--white)}