html, body { overflow: auto !important; height: auto !important; background: var(--db-ffffff, #fff); }
.ci { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; min-height: 100vh; box-sizing: border-box; padding: 0 8%; align-items: center; background: radial-gradient(60% 90% at 100% 20%, var(--db-beb4ff, rgb(190, 180, 255)), transparent 70%), radial-gradient(60% 60% at 100% 100%, var(--db-bef0eb, rgb(190, 240, 235)), transparent 70%), var(--db-ffffff, #fff); }
.ci-x { position: absolute; top: 24px; right: 24px; display: grid; place-items: center; width: 40px; height: 40px; color: var(--df-0d0d0d, rgb(13, 13, 13)); }
.ci-x svg { width: 24px; height: 24px; }
.ci-t small { font: 600 13px/18px var(--font); color: var(--df-6950f3, rgb(105, 80, 243)); }
.ci-t h1 { margin: 8px 0 16px; font: 700 36px/44px var(--font); }
.ci-t p { margin: 0 0 24px; font: 400 15px/22px var(--font); }
.ci-t ul { display: grid; gap: 16px; margin: 0 0 32px; padding: 0; list-style: none; font: 400 15px/22px var(--font); }
.ci-t li { display: flex; gap: 12px; }
.ci-t li svg { flex: none; width: 22px; height: 22px; }
.ci-b { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ci-go { height: 48px; padding: 0 20px; border: 0; border-radius: 999px; background: var(--db-0d0d0d, rgb(13, 13, 13)); color: var(--do-ffffff, #fff); font: 600 15px/20px var(--font); cursor: pointer; }
.ci-more { height: 48px; padding: 0 8px; border: 0; background: none; font: 600 15px/20px var(--font); cursor: pointer; }
.ci-soon { margin: 16px 0 0 !important; color: var(--df-767676, rgb(118, 118, 118)); }
.ci-art { display: grid; place-items: center; }
.ci-phone { position: relative; width: 300px; height: 600px; box-sizing: border-box; border: 8px solid rgb(120, 125, 135); border-radius: 44px; background: linear-gradient(160deg, rgb(35, 70, 170), rgb(150, 215, 215)); color: #fff; }
.ci-time { padding-top: 56px; text-align: center; }
.ci-time span { display: block; font: 500 15px/20px var(--font); }
.ci-time b { font: 600 64px/72px var(--font); }
.ci-note { position: absolute; left: 12px; right: 12px; bottom: 96px; display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 16px; background: rgba(255, 255, 255, .25); }
.ci-note i { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--db-ffffff-60, rgba(255, 255, 255, .6)); }
.ci-note b { display: block; font: 600 13px/16px var(--font); }
.ci-note small { font: 400 12px/16px var(--font); }
@media (max-width: 767px) { .ci { grid-template-columns: minmax(0, 1fr); padding: 72px 16px 32px; } .ci-t h1 { font-size: 28px; line-height: 34px; } .ci-art { display: none; } }
