#contact-form[hidden], #contact-receipt[hidden] { display: none; }
#contact-form[aria-busy="true"] button[type="submit"] { opacity: .7; cursor: wait; }
#form-status[data-state="pending"] { padding: 16px; background: var(--sage); border-radius: 14px; }
.contact-success { text-align: center; }
#contact-confirmation { width: min(530px, calc(100% - 32px)); padding: 44px 36px 32px; }
#contact-confirmation h2, #contact-receipt h3 { margin: 22px 0 16px; font-size: clamp(27px, 5vw, 36px); line-height: 1.15; }
.success-icon { width: 76px; height: 76px; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--forest); }
.success-icon svg { width: 36px; height: 36px; }
.contact-success p { line-height: 1.7; font-size: 16px; }
.contact-success .success-benefit { border-radius: 16px; padding: 16px; background: var(--sage); font-size: 14px; font-weight: 700; margin-top: 20px; }
#contact-confirmation .button { width: 100%; justify-content: center; }
#contact-receipt { padding: 32px 0 12px; }
#receipt-open { margin-top: 20px; }
.phone-hint { display: block; font-size: 12px; margin: 6px 0; }
#hero { min-height: 0; padding-bottom: clamp(56px, 7vw, 100px); }
@media(max-width:600px) { #contact-confirmation { padding: 32px 24px 24px; } }