/* Shared confirmation state for the contact and service-request forms. */
.contact-form,
.book-form { position: relative; }

.form-success[hidden] { display: none; }
.form-success {
  position: absolute; z-index: 5; inset: 0; min-height: 100%;
  padding: clamp(32px, 6vw, 72px); overflow: hidden;
  background:
    radial-gradient(circle at 50% 38%, rgba(32, 143, 96, .11), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.88), transparent 52%),
    var(--paper);
  display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; justify-items: center;
  text-align: center; opacity: 0; visibility: hidden;
  transform: scale(.985);
  transition: opacity .42s var(--ease), transform .55s var(--ease), visibility 0s .55s;
}
.is-success-visible .form-success {
  opacity: 1; visibility: visible; transform: scale(1);
  transition-delay: 0s;
}
.is-success > :not(.form-success) {
  pointer-events: none;
  animation: submission-content-out .3s var(--ease) forwards;
}

.form-success__icon {
  position: relative; width: 96px; height: 96px; margin-bottom: 28px;
  color: #168354; filter: drop-shadow(0 12px 18px rgba(22, 131, 84, .16));
}
.form-success__icon::before,
.form-success__icon::after {
  content: ""; position: absolute; border-radius: 50%; pointer-events: none;
}
.form-success__icon::before { inset: -10px; border: 1px solid rgba(22, 131, 84, .14); }
.form-success__icon::after { inset: 9px; background: rgba(22, 131, 84, .075); }
.form-success__icon svg { position: relative; z-index: 1; width: 100%; height: 100%; overflow: visible; }
.form-success__ring,
.form-success__check { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.form-success__ring { stroke-width: 2; stroke-dasharray: 227; stroke-dashoffset: 227; }
.form-success__check { stroke-width: 4; stroke-dasharray: 58; stroke-dashoffset: 58; }
.is-success-visible .form-success__ring { animation: submission-ring .7s .12s var(--ease) forwards; }
.is-success-visible .form-success__check { animation: submission-check .48s .64s var(--ease) forwards; }

.form-success__eyebrow {
  margin-bottom: 15px; color: #168354;
  font: 600 .67rem/1.4 var(--f-mono); letter-spacing: .15em; text-transform: uppercase;
  opacity: 0; transform: translateY(8px);
}
.form-success h2 {
  width: min(100%, 13ch); color: var(--ink); font: 400 clamp(2.35rem, 4.5vw, 3.65rem)/.98 "Instrument Serif", Georgia, serif;
  letter-spacing: -.025em; text-wrap: balance; opacity: 0; transform: translateY(10px);
}
.form-success__copy {
  width: min(100%, 44ch); margin-top: 17px; color: var(--ink-60); font-size: .98rem; line-height: 1.65;
  opacity: 0; transform: translateY(10px);
}
.form-success__next {
  width: min(100%, 390px); margin-top: 30px; padding: 16px 18px;
  border: 1px solid rgba(22, 131, 84, .18); border-radius: 8px;
  background: rgba(22, 131, 84, .055); display: grid; gap: 5px;
  opacity: 0; transform: translateY(10px);
}
.form-success__next span { color: #168354; font: 600 .61rem/1.4 var(--f-mono); letter-spacing: .11em; text-transform: uppercase; }
.form-success__next strong { color: var(--ink-80); font-size: .88rem; line-height: 1.45; }
.form-success__call {
  margin-top: 22px; color: var(--ink-60); font-size: .8rem; text-decoration: none;
  opacity: 0; transform: translateY(10px); transition: color .2s var(--ease);
}
.form-success__call strong { color: var(--ink); }
.form-success__call:hover,
.form-success__call:focus-visible { color: #168354; }
.form-success:focus { outline: none; }

.is-success-visible .form-success__eyebrow,
.is-success-visible .form-success h2,
.is-success-visible .form-success__copy,
.is-success-visible .form-success__next,
.is-success-visible .form-success__call { animation: submission-rise .55s var(--ease) forwards; }
.is-success-visible .form-success__eyebrow { animation-delay: .48s; }
.is-success-visible .form-success h2 { animation-delay: .56s; }
.is-success-visible .form-success__copy { animation-delay: .64s; }
.is-success-visible .form-success__next { animation-delay: .72s; }
.is-success-visible .form-success__call { animation-delay: .8s; }

@keyframes submission-content-out { to { opacity: 0; transform: translateY(-8px); } }
@keyframes submission-ring { to { stroke-dashoffset: 0; } }
@keyframes submission-check { to { stroke-dashoffset: 0; } }
@keyframes submission-rise { to { opacity: 1; transform: translateY(0); } }

@media (max-width: 560px) {
  .form-success { padding: 34px 22px; }
  .form-success__icon { width: 82px; height: 82px; margin-bottom: 23px; }
  .form-success h2 { width: min(100%, 11ch); font-size: 2.3rem; line-height: 1.02; }
  .form-success__next { margin-top: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .form-success,
  .is-success > :not(.form-success),
  .is-success-visible .form-success__ring,
  .is-success-visible .form-success__check,
  .is-success-visible .form-success__eyebrow,
  .is-success-visible .form-success h2,
  .is-success-visible .form-success__copy,
  .is-success-visible .form-success__next,
  .is-success-visible .form-success__call {
    animation: none !important; transition: none !important; transform: none !important;
  }
  .is-success-visible .form-success,
  .is-success-visible .form-success__eyebrow,
  .is-success-visible .form-success h2,
  .is-success-visible .form-success__copy,
  .is-success-visible .form-success__next,
  .is-success-visible .form-success__call { opacity: 1; visibility: visible; }
  .is-success-visible .form-success__ring,
  .is-success-visible .form-success__check { stroke-dashoffset: 0; }
  .is-success > :not(.form-success) { opacity: 0; }
}
