/* ============================================================
   Demo lead-capture modal — scoped under #demoModal
   On-brand (Manrope/Inter, crimson #DC102E, navy, system radii)
   ============================================================ */
#demoModal{
  position:fixed; inset:0; z-index:9999999 !important;
  display:none; align-items:flex-start; justify-content:center;
  padding:140px 20px 20px;
  background:rgba(10,26,47,0.48);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  overflow-y:auto;
}
#demoModal.is-open{ display:flex; animation:demoFade .24s var(--ease-out,ease) both; }
@keyframes demoFade{ from{opacity:0;} to{opacity:1;} }
.demo-modal__panel{
  position:relative; width:100%; max-width:720px;
  background:var(--bg-surface); border-radius:var(--radius-xl,20px);
  box-shadow:var(--shadow-2xl); overflow:visible;
  animation:demoRise .28s var(--ease-out,ease) both;
  max-height:none;
}
@keyframes demoRise{ from{opacity:0; transform:translateY(14px) scale(.98);} to{opacity:1; transform:none;} }
.demo-modal__head{
  position:relative; padding:24px 28px;
  background:linear-gradient(150deg,var(--color-midnight-900),var(--color-midnight-800));
  color:#fff; overflow:hidden;
}
.demo-modal__head::after{
  content:""; position:absolute; top:-50%; right:-6%; width:300px; height:300px;
  background:radial-gradient(circle,rgba(220,16,46,0.30),transparent 60%); pointer-events:none;
}
.demo-modal__eyebrow{
  position:relative; font-family:var(--font-display); font-size:var(--text-2xs,11px);
  font-weight:var(--fw-bold); letter-spacing:0.14em; text-transform:uppercase;
  color:var(--color-crimson-300); margin-bottom:8px;
}
.demo-modal__title{
  position:relative; font-family:var(--font-display); font-weight:var(--fw-bold);
  font-size:22px; line-height:1.2; margin:0 0 6px; letter-spacing:-0.01em;
  color:#fff;
}
.demo-modal__sub{ position:relative; font-size:13.5px; color:var(--color-midnight-100); margin:0; line-height:1.5; }
.demo-modal__close{
  position:absolute; top:16px; right:16px; z-index:2;
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,0.12); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background var(--dur-fast,.16s) var(--ease-out,ease);
}
.demo-modal__close:hover{ background:rgba(255,255,255,0.24); }
.demo-modal__close svg{ width:18px; height:18px; }

/* form body */
.crm-lead-form{ padding:26px 28px 30px; font-family:var(--font-body); }
.crm-lead-form .form-row{ display:flex; gap:14px; margin-bottom:14px; }
.crm-lead-form .form-group{ flex:1; min-width:0; }
.crm-lead-form .form-group.full{ flex:100%; }
.crm-lead-form label{
  display:block; margin-bottom:6px; font-family:var(--font-display);
  font-weight:var(--fw-semibold); font-size:13px; color:var(--fg-secondary);
}
.crm-lead-form label .required{ color:var(--color-crimson-500); }
.crm-lead-form input,
.crm-lead-form select,
.crm-lead-form textarea{
  width:100%; padding:11px 13px;
  border:1px solid var(--border-default); border-radius:var(--radius-sm,8px);
  font-size:14px; font-family:inherit; color:var(--fg-primary);
  background:var(--bg-surface); box-sizing:border-box;
  transition:border-color .2s, box-shadow .2s;
}
.crm-lead-form input::placeholder,
.crm-lead-form textarea::placeholder{ color:var(--fg-tertiary); }
.crm-lead-form input:focus,
.crm-lead-form select:focus,
.crm-lead-form textarea:focus{
  outline:none; border-color:var(--color-crimson-500);
  box-shadow:0 0 0 3px rgba(220,16,46,0.12);
}
.crm-lead-form .radio-group{ display:flex; flex-wrap:wrap; gap:10px 22px; padding:4px 2px; }
.crm-lead-form .radio-item{
  display:flex; align-items:center; gap:9px; cursor:pointer;
  font-size:14px; color:var(--fg-primary); font-weight:normal; margin:0;
}
.crm-lead-form input[type="radio"]{
  width:auto; padding:0; margin:0; accent-color:var(--color-crimson-500);
  box-shadow:none; flex-shrink:0;
}
.crm-lead-form input[type="radio"]:focus{ box-shadow:0 0 0 3px rgba(220,16,46,0.2); }
.crm-lead-form textarea{ resize:vertical; min-height:84px; }
.crm-lead-form button[type="submit"]{
  width:100%; padding:14px 24px; margin-top:8px;
  background:var(--color-crimson-500); color:#fff; border:none;
  border-radius:var(--radius-sm,8px); font-family:var(--font-display);
  font-size:16px; font-weight:var(--fw-semibold); cursor:pointer;
  box-shadow:0 8px 20px -6px rgba(220,16,46,0.5);
  transition:background var(--dur-fast,.16s), transform .1s;
}
.crm-lead-form button[type="submit"]:hover{ background:var(--color-crimson-600); }
.crm-lead-form button[type="submit"]:active{ transform:scale(0.98); }
.crm-lead-form button[type="submit"]:disabled{ background:var(--color-neutral-400); cursor:not-allowed; box-shadow:none; }
.crm-lead-form .form-message{ padding:12px 16px; border-radius:var(--radius-sm,8px); margin-top:14px; font-size:14px; display:none; }
.crm-lead-form .form-message.success{ background:var(--color-success-50); color:var(--color-success-700); }
.crm-lead-form .form-message.error{ background:var(--color-danger-50); color:var(--color-danger-700); }
.crm-lead-form .hp-field{ position:absolute; left:-9999px; height:0; overflow:hidden; }

@media (max-width:600px){
  #demoModal{ padding:110px 0 20px; }
  .demo-modal__panel{ max-width:none; border-radius:0; }
  .crm-lead-form .form-row{ flex-direction:column; gap:0; }
  .crm-lead-form .form-group{ margin-bottom:14px; }
}

/* Guarantee the form modal scrolls on every screen */
#demoModal{ overflow-y:auto; -webkit-overflow-scrolling:touch; }
.demo-modal__body, .crm-lead-form{ overflow:visible; }

/* ===== Video modal ===== */
#videoModal{
  position:fixed; inset:0; z-index:2147483648;
  display:none; align-items:center; justify-content:center; padding:24px;
  background:rgba(10,26,47,0.78);
}
#videoModal.is-open{ display:flex; animation:demoFade .24s var(--ease-out,ease) both; }
.video-modal__panel{
  position:relative; width:100%; max-width:960px;
  border-radius:var(--radius-xl,20px); overflow:hidden;
  background:#000; box-shadow:var(--shadow-2xl);
}
.video-modal__frame{ position:relative; width:100%; aspect-ratio:16/9; }
.video-modal__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-modal__close{
  position:absolute; top:-14px; right:-14px; z-index:3;
  width:40px; height:40px; border-radius:50%;
  background:var(--bg-surface); color:var(--fg-primary); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-lg);
  transition:transform var(--dur-fast,.16s) var(--ease-out,ease);
}
.video-modal__close:hover{ transform:scale(1.08); }
.video-modal__close svg{ width:20px; height:20px; }
@media (max-width:600px){
  #videoModal{ padding:16px; }
  .video-modal__close{ top:-12px; right:-6px; width:34px; height:34px; }
}
