.cql-wrap { --cql-primary: var(--cq-primary, #123c5a); --cql-accent: var(--cq-accent, #f28c28); --cql-line: #dbe3e8; --cql-soft: #f4f8fa; }
.cql-form { display: grid; gap: 14px; }
.cql-progress { display: flex; gap: 8px; margin: 0 0 8px; }
.cql-progress span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; border: 1px solid var(--cql-line); color: #6a7680; background: #fff; font-size: .78rem; font-weight: 850; }
.cql-progress span.is-active, .cql-progress span.is-done { border-color: var(--cql-primary); background: var(--cql-primary); color: #fff; }
.cql-step { display: grid; gap: 12px; }
.cql-step[hidden] { display: none !important; }
.cql-step h3 { margin: 0 0 2px; color: var(--cql-primary); font-size: 1.12rem; }
.cql-step label, .cql-step legend { color: #263744; font-size: .83rem; font-weight: 800; }
.cql-step input[type="text"], .cql-step input[type="email"], .cql-step input[type="tel"], .cql-step select, .cql-step textarea { width: 100%; margin-top: 5px; border: 1px solid #cbd7dd; border-radius: 8px; background: #fff; padding: 9px 10px; color: #18232d; font-size: .91rem; font-weight: 500; }
.cql-step input:focus, .cql-step select:focus, .cql-step textarea:focus { outline: 3px solid rgba(18,60,90,.17); border-color: var(--cql-primary); }
.cql-grid-2 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.cql-check-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 6px; }
.cql-check-grid label, .cql-consent { font-weight: 600; line-height: 1.35; }
.cql-actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 3px; }
.cql-next, .cql-submit, .cql-back { border: 0; border-radius: 999px; padding: 10px 15px; cursor: pointer; font-weight: 850; }
.cql-next, .cql-submit { margin-left: auto; background: var(--cql-accent); color: #1f2933; }
.cql-back { background: #eef3f5; color: var(--cql-primary); }
.cql-alert { margin: 0 0 12px; border-radius: 8px; padding: 10px 12px; font-size: .86rem; }
.cql-success { background: #e9f8ef; color: #17623f; }
.cql-error { background: #fff0f0; color: #9c2d2d; }
.cql-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 560px) { .cql-grid-2, .cql-check-grid { grid-template-columns: 1fr; } }