:root{ --brand:#B40F1A; }
.roof-form-noscroll{ overflow:hidden; }
.roof-form-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  display:none; align-items:center; justify-content:center; z-index:2147483647;
  padding:16px;
}
.roof-form-overlay.open{ display:flex; }
.roof-form-modal{
  width:min(720px, 100%); background:#fff; border-radius:12px; position:relative;
  box-shadow:0 20px 60px rgba(0,0,0,.35); padding:24px 24px 8px;
  font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
/* Close: black X */
.roof-form-close{
  position:absolute; right:10px; top:10px; border:0; background:transparent;
  font-size:28px; line-height:1; cursor:pointer; color:#000;
  width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; z-index:3;
}
.roof-form-progress{ height:6px; background:#f2f2f2; border-radius:6px; overflow:hidden; margin:20px 0 16px; position:relative; z-index:1; }
.roof-form-progress .bar{ height:100%; width:0; background:var(--brand) !important; transition:width .3s ease; }

.roof-form-step{ display:none; text-align:left; }
.roof-form-step.is-active{ display:block; }

/* Intro */
.intro-step{ padding:0; }
.intro-step .intro-card{ background:#fff; color:#222; text-align:center; border-radius:12px; padding:24px 24px 28px; }
.intro-step .intro-logo{ max-width:208px; height:auto; margin:6px auto 40px; display:block; }
.intro-step h2{ margin:0 0 8px; color:#222; font-size:28px; }
.intro-step p{ color:#333; margin:6px 0; }

.options{ display:grid; gap:8px; }
.opt{ border:1px solid #e5e5e5; padding:10px 12px; border-radius:10px; cursor:pointer; display:flex; gap:8px; align-items:center; background:rgba(180,15,26,0.06) !important; }
.opt input{ transform:scale(1.1); accent-color: var(--brand); }
.opt.disabled{ opacity:.5; pointer-events:none; }

label{ display:block; margin:8px 0; }
input[type="text"], input[type="email"], input[type="number"], input[type="date"]{ width:100%; padding:10px 12px; border:1px solid #dcdcdc; border-radius:10px; }
input.disabled{ opacity:.6; background:#f7f7f7; }

.checks .chk{ display:block; margin:8px 0; }
.role{ border:0; padding:0; margin-top:8px; }
.role legend{ font-weight:600; margin-bottom:4px; }

/* Contact step centered */
.contact-step{ text-align:center; }
.contact-step label{ text-align:left; display:block; margin-left:auto; margin-right:auto; max-width:420px; }
.contact-step .checks, .contact-step .role{ text-align:left; margin-left:auto; margin-right:auto; max-width:520px; }

.actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:14px; }
.actions.center{ justify-content:center; }
.btn{ border:0; background:var(--brand) !important; color:#fff !important; padding:10px 18px; border-radius:10px; cursor:pointer; font-weight:600; }
.btn.prev{ background:#d5d5d5 !important; color:#222 !important; }
.btn.submit{ box-shadow:0 4px 0 rgba(0,0,0,.08); }

.roof-form-result{ font-size:1.1rem; padding:16px; text-align:center; }

/* Validation */
.error{ outline:2px solid #e53935; border-color:#e53935 !important; }
.options.has-error{ outline:2px solid #e53935; border-radius:12px; padding:8px; }
.error-msg{ display:block; font-size:.85rem; color:#e53935; margin-top:4px; }
.error-msg.group{ margin-top:8px; }