/* Form states, both skins. */
.rk-form-success{
  padding: 22px 24px; border-radius: 16px;
  background: var(--sky-pale, #FDE6DC); color: var(--ink, #1C1D22);
  border: 1px solid rgba(0,0,0,0.06);
  font-size: 15.5px; line-height: 1.6;
}
.rk-form-success strong{ display:block; font-size: 18px; margin-bottom: 4px; }
.rk-form-error{ margin-top: 10px; font-size: 14px; color: #B83407; }
.rk-form-error a{ color: inherit; text-decoration: underline; }
.audit .rk-form-success{ background: rgba(255,255,255,0.08); color:#fff; border-color: rgba(255,255,255,0.14); }
.audit .rk-form-error{ color:#FF9A6E; }

/* A form set to hidden must actually disappear: several form classes declare
   their own `display`, which beats the browser's [hidden] rule. */
[hidden]{ display: none !important; }

/* ---------------------------------------------------------------------------
   The confirmation after a form is sent. Replaces the form in place: what
   happened, what happens next, and one thing to read while they wait.
   --------------------------------------------------------------------------- */
.rk-done{
  --done-ink: #1A120F; --done-soft: #3A2E2A; --done-accent: #CC3D0B;
  --done-bg: #fff; --done-line: #F2DFD7; --done-tint: #FDF1EC;
  display:flex; flex-direction:column; gap: 18px;
  padding: 28px 30px; border-radius: 22px;
  background: var(--done-bg); border: 1px solid var(--done-line);
  box-shadow: 0 30px 60px -40px rgba(120,55,30,0.55);
  opacity: 0; transform: translateY(10px);
  transition: opacity .4s ease, transform .4s cubic-bezier(.2,.7,.2,1);
}
.rk-done.is-in{ opacity: 1; transform: none; }
.rk-done:focus{ outline: none; }
.rk-done:focus-visible{ outline: 2px solid var(--done-accent); outline-offset: 3px; }

.rk-done-top{ display:flex; align-items:flex-start; gap: 16px; }
.rk-done-tick{
  flex:none; width: 46px; height: 46px; border-radius: 50%;
  background: var(--done-accent); color:#fff; display:grid; place-items:center;
  box-shadow: 0 12px 24px -12px rgba(204,61,11,0.8);
  animation: rk-done-pop .5s cubic-bezier(.2,.9,.3,1.4) .08s both;
}
.rk-done-tick svg{ width: 24px; height: 24px; stroke-dasharray: 28; stroke-dashoffset: 28; animation: rk-done-draw .45s ease .3s forwards; }
@keyframes rk-done-pop{ from{ transform: scale(.4); opacity: 0; } to{ transform: none; opacity: 1; } }
@keyframes rk-done-draw{ to{ stroke-dashoffset: 0; } }
.rk-done-top h3{
  font-family: var(--ff-display, inherit); font-weight: 800; letter-spacing: -0.015em;
  font-size: clamp(20px, 2.4vw, 26px); line-height: 1.15; margin: 4px 0 6px; color: var(--done-ink);
}
.rk-done-top p{ margin: 0; font-size: 15.5px; line-height: 1.55; color: var(--done-soft); max-width: 52ch; }

.rk-done-steps{ list-style:none; margin: 0; padding: 16px 0 0; border-top: 1px solid var(--done-line); display:flex; flex-direction:column; gap: 12px; }
.rk-done-steps li{ display:flex; align-items:flex-start; gap: 12px; }
.rk-done-steps b{
  flex:none; width: 22px; height: 22px; border-radius: 50%;
  background: var(--done-tint); color: var(--done-accent);
  font-family: var(--ff-mono, monospace); font-size: 11px; font-weight: 500;
  display:grid; place-items:center; margin-top: 1px;
}
.rk-done-steps span{ font-size: 14.5px; line-height: 1.45; color: var(--done-soft); }
.rk-done-steps strong{ display:block; font-size: 15px; color: var(--done-ink); margin-bottom: 1px; }
.rk-done-note{ margin: 0; font-size: 13px; line-height: 1.5; color: #8A7A72; }

.rk-done-next{ display:flex; flex-wrap:wrap; align-items:center; gap: 6px 14px; padding-top: 16px; border-top: 1px solid var(--done-line); }
.rk-done-next > span{ font-family: var(--ff-mono, monospace); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: #8A7A72; }
.rk-done-next a{ display:inline-flex; align-items:center; gap: 7px; font-weight: 700; font-size: 15px; color: var(--done-accent); text-decoration: none; }
.rk-done-next a svg{ width: 17px; height: 17px; transition: transform .2s ease; }
.rk-done-next a:hover svg{ transform: translateX(4px); }
.rk-done-next a:hover{ text-decoration: underline; text-underline-offset: 3px; }

/* on the dark scorecard panel and anywhere else with a dark ground */
.audit .rk-done, .fl-ask .rk-done, .fl-hb-form-wrap .rk-done{ box-shadow: 0 30px 60px -40px rgba(0,0,0,0.6); }
.audit .rk-done{
  --done-ink:#fff; --done-soft: rgba(255,255,255,0.82); --done-accent:#FF7A45;
  --done-bg: rgba(255,255,255,0.07); --done-line: rgba(255,255,255,0.16); --done-tint: rgba(255,122,69,0.16);
}
.audit .rk-done-note{ color: rgba(255,255,255,0.55); }
.audit .rk-done-next > span{ color: rgba(255,255,255,0.55); }
.audit .rk-done-tick{ color:#1A120F; }

@media (max-width: 560px){
  .rk-done{ padding: 22px 20px; gap: 16px; }
  .rk-done-top{ gap: 12px; }
  .rk-done-tick{ width: 38px; height: 38px; }
  .rk-done-tick svg{ width: 20px; height: 20px; }
}
@media (prefers-reduced-motion: reduce){
  .rk-done{ transition: none; opacity: 1; transform: none; }
  .rk-done-tick{ animation: none; }
  .rk-done-tick svg{ animation: none; stroke-dashoffset: 0; }
}