/* Pole "Spýtajte sa": otázka + kontakt, animácia odoslania a potvrdenie */
.ask-box{margin-top:48px}
.ask-h{font-size:clamp(30px,8vw,52px);letter-spacing:-.04em;line-height:1;margin-bottom:12px}
.ask{position:relative;display:grid}
.ask-fields{display:grid;gap:12px;transition:opacity var(--dur-2) var(--ease),transform var(--dur-2) var(--ease)}
.f-ta{font:inherit;font-size:var(--fs-lg);height:auto;min-height:60px;max-height:200px;padding-top:26px;padding-bottom:8px;resize:none;overflow-y:hidden;line-height:1.3}
.fld textarea:focus+label,.fld textarea:not(:placeholder-shown)+label{transform:translateY(-14px) scale(.65)}
.fld textarea:focus+label{color:var(--fg)}
.fld .f-in[aria-invalid="true"]{border-bottom-color:#ff9a9a}
/* medová pasca pre botov: mimo obrazovky, nie display:none (roboty vyplnia každé viditeľné pole) */
.ask-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.ask-btn{justify-self:start;min-width:210px;margin-top:6px;overflow:hidden}
.ask-btn .btn-t{display:inline-flex;align-items:center}
.ask-ck{display:none;flex:none}
.ask-ck path{stroke-dasharray:24;stroke-dashoffset:24}
.ask-btn[data-state="busy"]{pointer-events:none;opacity:.9}
.ask-btn[data-state="busy"] .btn-t::after{content:"";display:inline-block;width:16px;height:16px;margin-left:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
.ask-btn[data-state="done"]{pointer-events:none}
.ask-btn[data-state="done"] .ask-ck{display:block}
.ask-btn[data-state="done"] .ask-ck path{stroke-dashoffset:0;transition:stroke-dashoffset var(--dur-3) .05s var(--ease)}
.ask-status{min-height:0}
.ask-mail{justify-self:start}
.ask-mail[hidden]{display:none}
.ask-done{display:grid;justify-items:start;gap:6px;padding:4px 0}
.ask-done[hidden]{display:none}
.ask-ring{color:var(--fg);margin-bottom:6px}
.ask-ring circle{stroke-dasharray:176;stroke-dashoffset:0}
.ask-ring path{stroke-dasharray:60;stroke-dashoffset:0}
.ask-done-t{font-size:clamp(24px,6.4vw,32px);font-weight:600;letter-spacing:-.03em;line-height:1.1}
.ask-done-s{color:var(--mute);font-size:var(--fs-md)}
.ask-again{min-height:48px;margin-top:4px;padding:0;border:0;background:transparent;cursor:pointer;color:var(--fg)}
.ask.is-sent .ask-fields{display:none}
@media (prefers-reduced-motion:no-preference){
  :where(html:not(.is-paused)) .ask.is-sent .ask-done .ask-ring circle{animation:ask-ring .8s var(--ease-io) both}
  :where(html:not(.is-paused)) .ask.is-sent .ask-done .ask-ring path{animation:ask-tick .45s .55s var(--ease) both}
  :where(html:not(.is-paused)) .ask.is-sent .ask-done-t,:where(html:not(.is-paused)) .ask.is-sent .ask-done-s,:where(html:not(.is-paused)) .ask.is-sent .ask-again{animation:ask-rise .5s var(--ease) both}
  :where(html:not(.is-paused)) .ask.is-sent .ask-done-t{animation-delay:.5s}
  :where(html:not(.is-paused)) .ask.is-sent .ask-done-s{animation-delay:.62s}
  :where(html:not(.is-paused)) .ask.is-sent .ask-again{animation-delay:.74s}
  :where(html:not(.is-paused)) .ask.is-leaving .ask-fields{opacity:0;transform:translateY(-10px)}
}
@keyframes ask-ring{from{stroke-dashoffset:176}}
@keyframes ask-tick{from{stroke-dashoffset:60}}
@keyframes ask-rise{from{opacity:0;transform:translateY(10px)}}
