.demo-modal[hidden] { display: none; }
.demo-modal { position: fixed; z-index: 99999; inset: 0; display: grid; place-items: center; padding: 24px; }
.demo-modal__overlay { position: absolute; inset: 0; background: rgb(12 28 55 / .52); backdrop-filter: blur(7px); }
.demo-modal__dialog { position: relative; width: min(960px, 100%); max-height: min(90vh, 900px); overflow: auto; box-sizing: border-box; padding: 38px; border: 1px solid rgb(220 228 240); border-radius: 26px; background: #fff; box-shadow: 0 28px 80px rgb(9 27 55 / .28); color: #142746; }
.demo-modal__close { position: absolute; z-index: 1; top: 18px; right: 18px; display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid #dbe4f0; border-radius: 50%; background: #fff; color: #142746; cursor: pointer; font-size: 26px; line-height: 1; }
.demo-modal__close:hover, .demo-modal__close:focus-visible { background: #fff6d6; border-color: #f5c540; outline: none; }
.demo-modal__intro { max-width: 660px; padding-right: 42px; margin-bottom: 28px; }
.demo-modal__intro .eyebrow { display: inline-block; margin-bottom: 8px; }
.demo-modal__intro h2 { margin: 0 0 10px; color: #12284a; font-size: clamp(26px, 3vw, 36px); line-height: 1.16; }
.demo-modal__intro p { margin: 0; color: #61718b; font-size: 15px; line-height: 1.65; }
.demo-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.demo-form fieldset { min-width: 0; padding: 22px; margin: 0; border: 1px solid #e4ebf4; border-radius: 18px; background: #fbfcff; }
.demo-form legend { padding: 0 5px; color: #142746; font-size: 16px; font-weight: 800; }
.demo-form label { display: grid; gap: 7px; margin-top: 13px; color: #344661; font-size: 13px; font-weight: 700; }
.demo-form input:not([type="radio"]):not([type="checkbox"]), .demo-form select, .demo-form textarea { box-sizing: border-box; width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid #d9e3ef; border-radius: 11px; background: #fff; color: #142746; font: inherit; font-weight: 500; }
.demo-form textarea { min-height: 82px; resize: vertical; }
.demo-form input:focus, .demo-form select:focus, .demo-form textarea:focus { border-color: #f1b900; outline: 3px solid rgb(255 205 62 / .2); }
.demo-label { display: block; margin-top: 13px; color: #344661; font-size: 13px; font-weight: 700; }
.demo-packages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 9px; }
.demo-packages label { display: block; margin: 0; cursor: pointer; }
.demo-packages input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; }
.demo-packages span { display: block; min-height: 108px; padding: 15px; border: 1px solid #dce5f0; border-radius: 13px; background: #fff; transition: border-color .2s, box-shadow .2s, background .2s; }
.demo-packages b { display: block; margin-bottom: 7px; color: #142746; font-size: 14px; }
.demo-packages small { color: #677892; font-size: 12px; line-height: 1.5; }
.demo-packages input:checked + span { border-color: #f3bc22; background: #fff9e8; box-shadow: inset 0 0 0 1px #f3bc22; }
.demo-packages input:focus-visible + span { outline: 3px solid rgb(255 205 62 / .3); }
.demo-sources { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 12px; margin-top: 8px; }
.demo-sources label, .demo-check { display: flex !important; align-items: flex-start; gap: 8px; margin-top: 5px !important; font-size: 12px !important; line-height: 1.5; }
.demo-sources input, .demo-check input { width: auto; margin: 3px 0 0; accent-color: #e5ae11; }
.demo-check { margin-top: 13px !important; font-weight: 500 !important; }
.demo-check a { color: #142746; font-weight: 800; }
.demo-other[hidden] { display: none; }
.demo-form__footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 22px; }
.demo-form__footer .button { min-height: 52px; border: 0; cursor: pointer; white-space: nowrap; }
.demo-form__feedback { min-height: 22px; margin: 0; color: #b42318; font-size: 13px; font-weight: 700; }
.demo-form__feedback.is-success { color: #16744b; }
.demo-form__footer .button.is-loading { pointer-events: none; opacity: .76; }
.demo-hp { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
html.demo-modal-open, body.demo-modal-open { overflow: hidden; }
@media (max-width: 700px) { .demo-modal { align-items: start; padding: 12px; } .demo-modal__dialog { max-height: calc(100vh - 24px); padding: 28px 20px 22px; border-radius: 20px; } .demo-modal__intro { padding-right: 35px; margin-bottom: 21px; } .demo-form__grid { grid-template-columns: 1fr; gap: 13px; } .demo-form fieldset { padding: 17px; } .demo-form__footer { align-items: stretch; flex-direction: column; } .demo-form__footer .button { width: 100%; } }
@media (max-width: 420px) { .demo-packages, .demo-sources { grid-template-columns: 1fr; } .demo-packages span { min-height: 0; } }