/* ---------- owner form: sending state, errors, thank-you ---------- */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form .btn[disabled]{opacity:.75;cursor:progress}
.form .btn .spin{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;animation:ld-spin .8s linear infinite}
@keyframes ld-spin{to{transform:rotate(360deg)}}
.form-error{display:none;margin-top:var(--s4);padding:var(--s3) var(--s4);border-radius:var(--r-md);background:#fbeee8;color:#7a2e12;font-size:var(--text-sm);line-height:1.5}
.form-error.show{display:block}
.form-error a{color:inherit;font-weight:600}
.form .field input.invalid,.form .field textarea.invalid{border-color:#b4532a!important}

.thanks{display:none;text-align:center}
.form.done > *:not(.thanks){display:none!important}
.form.done .thanks{display:block;animation:ty-in .6s cubic-bezier(.2,.8,.3,1) both}
@keyframes ty-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

.pool{position:relative;width:100%;max-width:420px;margin:0 auto var(--s6);border-radius:var(--r-lg);overflow:hidden;aspect-ratio:21/10;
  background:linear-gradient(180deg,#e8f1f4 0%,#e8f1f4 38%,#8fd0e0 39%,#5fb3c9 70%,#12667a 100%);box-shadow:inset 0 0 0 1px rgba(18,102,122,.12)}
.pool svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.pool .wave{animation:ty-wave 3.2s linear infinite}
.pool .wave.w2{animation-duration:4.6s;animation-direction:reverse;opacity:.55}
@keyframes ty-wave{from{transform:translateX(0)}to{transform:translateX(-160px)}}
.pool .lane{animation:ty-lane 5s linear infinite}
@keyframes ty-lane{from{transform:translateX(0)}to{transform:translateX(-40px)}}
.pool .swimmer{animation:ty-swim 7s linear infinite}
@keyframes ty-swim{from{transform:translateX(-80px)}to{transform:translateX(250px)}}
.pool .bob{animation:ty-bob 1.1s ease-in-out infinite;transform-box:fill-box}
@keyframes ty-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(2.5px)}}
.pool .arm{transform-box:view-box;animation:ty-stroke 1.1s linear infinite}
.pool .arm.a2{animation-delay:-.55s}
@keyframes ty-stroke{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.pool .kick{animation:ty-kick .35s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}
.pool .kick.k2{animation-delay:-.17s}
@keyframes ty-kick{from{transform:scale(.6);opacity:.35}to{transform:scale(1.15);opacity:.95}}
.pool .bubble{animation:ty-bub 2.4s ease-in infinite;opacity:0}
.pool .bubble.b2{animation-delay:.8s}.pool .bubble.b3{animation-delay:1.6s}
@keyframes ty-bub{0%{transform:translateY(0);opacity:0}20%{opacity:.8}100%{transform:translateY(-26px);opacity:0}}

.thanks{outline:none}
.form .thanks .eyebrow{display:block;margin-bottom:var(--s2);color:var(--primary)}
.form .thanks h3{color:var(--text);font-size:var(--text-2xl);letter-spacing:-.02em;margin-bottom:var(--s3)}
.thanks p{color:var(--muted);font-size:var(--text-base);max-width:34ch;margin:0 auto}
.thanks .ty-actions{display:flex;flex-wrap:wrap;gap:var(--s3);justify-content:center;margin-top:var(--s6)}
.thanks .ty-actions .btn{width:auto;margin-top:0}
.thanks .ty-link{font-size:var(--text-sm);font-weight:600;color:var(--primary);text-decoration:none;align-self:center}
.thanks .ty-link:hover{color:var(--primary-hover)}
@media(max-width:520px){.thanks .ty-actions .btn{width:100%}}
@media(prefers-reduced-motion:reduce){
  .pool .wave,.pool .lane,.pool .swimmer,.pool .bob,.pool .arm,.pool .kick,.pool .bubble{animation:none}
  .pool .swimmer{transform:translateX(80px)}
}
