:root{
  --c-blue:#0076f1;
  --c-cyan:#48cbff;
  --c-gray:#777;
  --c-border:#e6e6e6;
}

/* overlay */
#centrale-quote-modal{
  position:fixed; inset:0;
  background:rgba(0,0,0,.45);
  z-index:9999;
  padding:18px;
  overflow:auto; /* helps on very small screens */
}

/* modal box */
.cq-modal{
  background:#fff;
  width:min(980px, 96vw);          /* wider */
  margin:0 auto;
  border-radius:12px;
  overflow:hidden;
  max-height:calc(100vh - 36px);   /* critical */
  display:flex;
  flex-direction:column;
  box-shadow:0 18px 55px rgba(0,0,0,.25);
}

/* header/footer */
.cq-header,.cq-footer{
  padding:12px 16px;
  background:linear-gradient(90deg, rgba(0,118,241,.10), rgba(72,203,255,.10));
  border-bottom:1px solid var(--c-border);
}
.cq-footer{ border-bottom:none; border-top:1px solid var(--c-border); display:flex; justify-content:flex-end; gap:10px; }

/* scrollable body */
.cq-body{
  padding:14px 16px;
  overflow:auto; /* critical: the form scrolls */
}

/* 2-col on desktop, 1-col on mobile */
.cq-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:820px){ .cq-grid{ grid-template-columns:1fr; } }

/* fields */
.cq-row{ margin-bottom:12px; }
.cq-row label{ display:block; margin-bottom:6px; font-size:12px; color:var(--c-gray); font-weight:600; }
.cq-row input,.cq-row select{
  width:100%;
  padding:10px 12px;
  border:1px solid var(--c-border);
  border-radius:10px;
  outline:none;
}
.cq-row input:focus,.cq-row select:focus{
  border-color:rgba(0,118,241,.55);
  box-shadow:0 0 0 3px rgba(72,203,255,.25);
}

/* buttons */
.cq-btn{
  padding:10px 14px;
  border-radius:10px;
  cursor:pointer;
  border:1px solid rgba(0,118,241,.25);
  background:#fff;
  color:var(--c-blue);
  font-weight:700;
}
.cq-btn-primary{ background:var(--c-blue); color:#fff; border-color:var(--c-blue); }