/* Contact page (template-contact.php): a plain light page like checkout, no box. Step 1 picks a topic, step 2 is the Fluent form, step 3 the confirmation.
   Purple (secondary-brand) for accents; lime only ever sits on dark. The form sits in .lwpr-pop-form so the button, grid and errors are the popup's. */

.lwpr-contact-page{padding-top:var(--size-160);padding-bottom:var(--size-160);min-height:70vh}
.lwpr-contact-wrap{max-width:40rem;margin:0 auto}
.lwpr-contact-h1{margin:0 0 var(--size-32)}
.lwpr-contact-h1 em{font-style:normal;color:var(--secondary-brand-2)}

.lwpr-contact{color:var(--primary-dark-1)}
.lwpr-contact [hidden]{display:none!important}

.lwpr-contact-steps{display:flex;align-items:center;justify-content:space-between;gap:var(--size-12);margin:0 0 var(--size-24);font-size:.875rem;color:var(--primary-dark-2)}
.lwpr-contact-bars{display:flex;flex:1;max-width:7.5rem;gap:6px}
.lwpr-contact-bars span{flex:1;height:4px;border-radius:999px;background:var(--primary-light-3)}
.lwpr-contact-bars span.is-on{background:var(--secondary-brand-2)}

.lwpr-contact-title{margin:0 0 var(--size-20);font-family:var(--heading-font);font-size:1.75rem;font-weight:800;line-height:1.1;letter-spacing:-.02em;color:var(--primary-dark-1);text-wrap:balance}

.lwpr-contact-topics{display:grid;gap:10px}
.lwpr-contact-topic{display:block;width:100%;padding:1rem 1.125rem;border:1px solid var(--primary-light-3);border-radius:.875rem;background:#fff;color:var(--primary-dark-1);font:inherit;font-family:var(--heading-font);font-size:1.0625rem;font-weight:700;letter-spacing:-.01em;text-align:left;cursor:pointer;transition:border-color .15s,background-color .15s}
.lwpr-contact-topic:hover{border-color:var(--secondary-brand-1);background:var(--secondary-light-1)}
.lwpr-contact-topic:focus-visible{outline:2px solid var(--secondary-brand-1);outline-offset:2px}

.lwpr-contact-chiprow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 var(--size-20)}
.lwpr-contact-chip{padding:6px 14px;border-radius:999px;background:var(--secondary-light-1);color:var(--secondary-brand-2);font-size:.875rem;font-weight:600}
.lwpr-contact-change{padding:4px 2px;border:0;background:none;color:var(--primary-dark-2);font:inherit;font-size:.875rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.lwpr-contact-change:hover{color:var(--primary-dark-1)}
.lwpr-contact-change:focus-visible{outline:2px solid var(--secondary-brand-1);outline-offset:2px;border-radius:4px}

/* Fluent form (grid, button and error styles come from .lwpr-pop-form) */
.lwpr-contact .lwpr-pop-form .frm-fluent-form fieldset{margin:0;padding:0;border:0;gap:var(--size-16)}
.lwpr-contact .lwpr-pop-form .ff-el-group:has([name=message]){grid-column:1 / -1}
/* Labels stay visible here, unlike in the popup */
.lwpr-contact .lwpr-pop-form .ff-el-input--label{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;margin:0 0 6px}
.lwpr-contact .lwpr-pop-form .ff-el-input--label label{margin:0;font-size:.9375rem;font-weight:600;color:var(--primary-dark-1)}
.lwpr-contact .lwpr-pop-form .ff-el-input--label.ff-el-is-required label::after{color:var(--error-1)}
.lwpr-contact .lwpr-pop-form .fluentform .ff-el-form-control{width:100%;padding:.75rem .875rem;border:1px solid var(--primary-light-3);border-radius:.75rem;background:#fff;color:var(--primary-dark-1);font:inherit;box-shadow:none;outline:0}
.lwpr-contact .lwpr-pop-form .fluentform textarea.ff-el-form-control{min-height:10.5rem;resize:vertical}
.lwpr-contact .lwpr-pop-form .fluentform .ff-el-form-control::placeholder{color:var(--primary-dark-3)}
.lwpr-contact .lwpr-pop-form .fluentform .ff-el-form-control:focus{border-color:var(--secondary-brand-1);box-shadow:0 0 0 2px var(--secondary-brand-1);outline:0}
.lwpr-contact .lwpr-pop-form .fluentform .ff-el-is-error .ff-el-form-control{border-color:var(--error-1);box-shadow:0 0 0 1px var(--error-1)}
.lwpr-contact .lwpr-pop-form .error.text-danger{padding-left:0}


.lwpr-contact .lwpr-pop-form .ff-message-success{padding:0;background:none}
.lwpr-contact .lwpr-pop-form .ff-message-success p{margin:0 0 .5rem;font-size:1rem;line-height:1.55;color:var(--primary-dark-2)}
.lwpr-contact .lwpr-pop-form .ff-message-success p:first-child{font-family:var(--heading-font);font-size:1.75rem;font-weight:800;line-height:1.1;letter-spacing:-.02em;color:var(--primary-dark-1)}

@media (max-width:520px){.lwpr-contact .lwpr-pop-form .frm-fluent-form fieldset{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.lwpr-contact-topic{transition:none}}