/* Requires /assets/css/new-style/global/base.css BEFORE this file.
   Preserve existing HTML/JS: all .nkq-* selectors remain compatible.
   If the separate cluster.css was retired, base.css must contain clusters. */

/* ============================================================
   QUIZ DESIGN TOKENS
   Uses NewKey base.css for brand colors, motion, fields and buttons.
   Local tokens retain the quiz's compact layout and can be tuned alone.
   ============================================================ */
.nkq {
    --nkq-choice-size: 16px;
    --nkq-small-size: 13px;
}

/* ============================================================
   HEBREW / RTL TYPOGRAPHY
   Directions and mirrored arrows are handled by the existing RTL rules.
   Use local size tokens only; never scale the complete dialog.
   ============================================================ */
.lang-he .nkq,
.nkq.lang-he {
    --nkq-choice-size: 17px;
    --nkq-small-size: 14px;
}
.lang-he .nkq__brand,
.lang-he .nkq__badge {
    letter-spacing: normal;
    text-transform: none;
}
.lang-he .nkq__step,
.lang-he .nkq__step-label,
.lang-he .nkq__hintline,
.lang-he .nkq__err {
    font-size: var(--nkq-small-size);
}

/* ============================================================
   NEWKEY QUIZ
   Base styles
   ============================================================ */

.nkq { position: fixed; inset: 0; z-index: 99993; display: none; font-family: var(--kh-font); color: var(--kh-text); }

.nkq.is-open { display: block; }

.nkq__bg { position: absolute; inset: 0; background: var(--kh-overlay); opacity: 0; transition: opacity var(--kh-dur-base) var(--kh-ease); }

.nkq.is-in .nkq__bg { opacity: 1; }

.nkq__box { position: absolute; top: 50%; left: 50%; width: 960px; max-width:calc(100% - 32px);  height: 680px; max-height:calc(100% - 32px);  transform: translate(-50%, -50%) scale(.97); opacity: 0; display: grid; grid-template-columns: 320px minmax(0, 1fr); border-radius: var(--kh-r-card); overflow: hidden; background: var(--kh-surface); box-shadow: 0 30px 80px rgba(2,3,4,.4); transition: transform var(--kh-dur-base) var(--kh-ease-out), opacity var(--kh-dur-base) var(--kh-ease); }

.nkq.is-in .nkq__box { transform: translate(-50%, -50%) scale(1); opacity: 1; }

.nkq__side { position: relative; display: flex; flex-direction: column; padding: 32px 28px; background: var(--kh-indigo); color: #fff; overflow: clip; }

.nkq__side .nk-cluster { z-index: 0; opacity: .7; }

.nkq__brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: #9fd0ff; }

.nkq__art { position: relative; z-index: 1; flex: 1; display: flex; align-items: center; justify-content: center; min-height: 0; }

.nkq__art-icon { --nk-icon-box: 128px; --nk-icon-size: 56px; border-radius: 40px; background: rgba(255,255,255,.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); transition: transform var(--kh-dur-base) var(--kh-ease-out), opacity var(--kh-dur-base); }

.nkq__art-icon.is-swap { transform: scale(.85); opacity: 0; }

.nkq__mood { position: relative; z-index: 1; margin: 0 0 20px; font-size: 18px; line-height: 1.4; font-weight: 500; color: #fff; min-height: 2.8em; }

/* ------------------------------------------------------------
   STEP PROGRESS
   ------------------------------------------------------------ */

.nkq__progress { position: relative; z-index: 1; }

.nkq__bar { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; }

.nkq__bar li { flex: 1; height: 6px; border-radius: 3px; background: rgba(255,255,255,.18); overflow: hidden; }

.nkq__bar li i { display: block; height: 100%; width: 0; border-radius: 3px; background: var(--kh-blue); transition: width var(--kh-dur-base) var(--kh-ease); }

.nkq__bar li.is-done i, .nkq__bar li.is-current i { width: 100%; }

.nkq__bar li.is-current i { background: var(--kh-surface); }

.nkq__step { margin: 10px 0 0; font-size: 13px; color: rgba(255,255,255,.72); font-variant-numeric: tabular-nums; }

.nkq__main { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-height: 0; }

.nkq__close { position: absolute; z-index: 5; inset-block-start: 16px; inset-inline-end: 16px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--kh-mist); color: var(--kh-indigo); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; transition: background var(--kh-dur-fast), color var(--kh-dur-fast); }

.nkq__close::after { content: ""; position: absolute; inset: -2px; }

/* 44px hit area (BRAND §16) */

.nkq__close .nk-icon { --nk-icon-box: 24px; --nk-icon-size: 18px; }

.nkq__close:hover { background: var(--kh-indigo); color: #fff; }

.nkq__head { padding: 36px 72px 8px 40px; }
.lang-he .nkq__head {padding: 36px 40px 8px 72px;}

.nkq__badge { gap: 6px; margin-block-end: 12px; }
.nkq__badge .nk-icon { --nk-icon-box: 18px; --nk-icon-size: 14px; }

.nkq__title { margin: 0; }

.nkq__hint { margin: 8px 0 0; }

.nkq__body { position: relative; overflow: auto; padding: 16px 40px 24px; min-height: 0; overscroll-behavior: contain; }

.nkq__body:focus-visible { outline: none; }

/* step transitions: the step container fades + slides, the box height never changes */

.nkq__panel { transition: opacity var(--kh-dur-base) var(--kh-ease), transform var(--kh-dur-base) var(--kh-ease-out); }

.nkq__panel.is-out-next { opacity: 0; transform: translateX(-24px); }

.nkq__panel.is-out-prev { opacity: 0; transform: translateX(24px); }

.nkq__panel.is-in-next { opacity: 0; transform: translateX(24px); }

.nkq__panel.is-in-prev { opacity: 0; transform: translateX(-24px); }

.nkq__head.is-swap, .nkq__step.is-swap, .nkq__mood.is-swap { opacity: 0; }

.nkq__head, .nkq__mood, .nkq__step { transition: opacity var(--kh-dur-fast); }

.nkq__zones { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }

.nkq__zone { padding: 14px 16px 16px; border: 1px solid var(--kh-mist); border-radius: 16px; background: var(--kh-surface); transition: border-color var(--kh-dur-fast), box-shadow var(--kh-dur-fast); }

.nkq__zone.is-some, .nkq__zone.is-all { border-color: var(--kh-blue); box-shadow: 0 0 0 1px var(--kh-blue); }

.nkq__zone-head { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; cursor: pointer; }

.nkq__zone-head b { font-size: 16px; font-weight: 600; color: var(--kh-indigo); }

.nkq__zone-head small { margin-inline-start: auto; font-size: 12px; color: var(--kh-text-3); font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------
   CHECKBOX: custom 3-state input (quiz-specific)
   ------------------------------------------------------------ */

.nkq__cb { position: relative; flex: none; width: 22px; height: 22px; }

.nkq__cb input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }

.nkq__cb i { position: absolute; inset: 0; border: 2px solid var(--kh-indigo); border-radius: 7px; background: var(--kh-surface); transition: background var(--kh-dur-fast), border-color var(--kh-dur-fast); }

.nkq__cb i::after { content: ""; position: absolute; inset: 0; opacity: 0; background: var(--kh-surface); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center / 14px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center / 14px no-repeat; transition: opacity var(--kh-dur-fast); }

.nkq__cb input:checked + i { background: var(--kh-blue); border-color: var(--kh-blue); }

.nkq__cb input:checked + i::after { opacity: 1; }

.nkq__cb input:indeterminate + i { background: var(--kh-blue); border-color: var(--kh-blue); }

.nkq__cb input:indeterminate + i::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E"); opacity: 1; }

.nkq__cb input:focus-visible + i { outline: 2px solid var(--kh-blue); outline-offset: 3px; }

/* ------------------------------------------------------------
   CHIPS / ANSWER CARDS
   ------------------------------------------------------------ */

.nkq__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

.nkq__chip { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px; border: 0; border-radius: var(--kh-r-pill); background: var(--kh-sky); color: var(--kh-indigo); font: inherit; font-size: 15px; font-weight: 500; cursor: pointer; transition: background var(--kh-dur-fast), color var(--kh-dur-fast), transform var(--kh-dur-fast); }

.nkq__chip:hover { background: #c9e2ff; }

.nkq__chip .nk-icon { --nk-icon-box: 18px; --nk-icon-size: 14px; display: none; }

.nkq__chip[aria-pressed="true"] { background: var(--kh-blue); color: #fff; padding-inline-start: 12px; }

.nkq__chip[aria-pressed="true"] .nk-icon { display: inline-flex; }

.nkq__chip:focus-visible { outline: 2px solid var(--kh-blue); outline-offset: 3px; }

.nkq__chips--lg .nkq__chip { min-height: 48px; padding: 0 20px; font-size: 16px; }

.nkq__cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }

.nkq__card { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 76px; padding: 14px 16px; border: 1.5px solid var(--kh-mist); border-radius: 16px; background: var(--kh-surface); color: var(--kh-indigo); font: inherit; text-align: start; cursor: pointer; transition: border-color var(--kh-dur-fast), background var(--kh-dur-fast), transform var(--kh-dur-fast) var(--kh-ease), box-shadow var(--kh-dur-fast); }

.nkq__card .nk-icon { --nk-icon-box: 44px; --nk-icon-size: 22px; flex: none; border-radius: 12px; background: var(--kh-sky); color: var(--kh-indigo); transition: background var(--kh-dur-fast), color var(--kh-dur-fast); }

.nkq__card b { display: block; font-size: var(--nkq-choice-size); font-weight: 600; line-height: 1.25; }

.nkq__card small { display: block; margin-block-start: 2px; font-size: 13px; color: var(--kh-text-2); }

.nkq__card:hover { border-color: var(--kh-blue); transform: translateY(-2px); box-shadow: var(--kh-sh-md); }

.nkq__card[aria-pressed="true"] { border-color: var(--kh-blue); background: var(--kh-sky-050); box-shadow: 0 0 0 1px var(--kh-blue); }

.nkq__card[aria-pressed="true"] .nk-icon { background: var(--kh-blue); color: #fff; }

.nkq__card:focus-visible { outline: 2px solid var(--kh-blue); outline-offset: 3px; }

.nkq__summary { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; padding: 0; list-style: none; }

.nkq__summary li { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: var(--kh-r-pill); background: var(--kh-sky); color: var(--kh-indigo); font-size: 13px; font-weight: 500; }

.nkq__summary li.is-edit { background: transparent; padding: 0; }

.nkq__summary button { height: 28px; padding: 0 8px; border: 0; border-radius: var(--kh-r-pill); background: transparent; color: var(--kh-blue); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

.nkq__form { display: grid; gap: 14px; }

.nkq__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.nkq__input .nk-icon { --nk-icon-box: 44px; --nk-icon-size: 20px; flex: none; color: var(--kh-text-3); }

.nkq__input input { padding-inline-start: 0; padding-inline-end: 14px; }

.nkq__field.is-invalid .nkq__input { border-color: var(--kh-danger); }

.nkq__field.is-invalid .nkq__input .nk-icon { color: var(--kh-danger); }

.nkq__err { display: none; }

.nkq__field.is-invalid .nkq__err { display: block; }

.nkq__consent { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; color: var(--kh-text-2); cursor: pointer; }

.nkq__consent .nkq__cb { margin-block-start: 1px; }

.nkq__consent a { color: var(--kh-blue); text-decoration: underline; text-underline-offset: 3px; }

.nkq__consent.is-invalid { color: var(--kh-danger); }

.nkq__consent.is-invalid .nkq__cb i { border-color: var(--kh-danger); }

.nkq__sent-err { display: none; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; background: var(--kh-danger-bg, #fdecec); color: #9b1c1c; font-size: 14px; }

.nkq__sent-err.is-on { display: flex; }

.nkq__sent-err .nk-icon { --nk-icon-box: 22px; --nk-icon-size: 18px; flex: none; }

.nkq__foot { display: flex; align-items: center; gap: 12px; padding: 16px 40px 24px; border-block-start: 1px solid var(--kh-line); background: var(--kh-surface); }

.nkq__foot .nkq__consult { margin-inline-end: auto; font-size: 14px; font-weight: 500; color: var(--kh-text-2); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: transparent; transition: color var(--kh-dur-fast), text-decoration-color var(--kh-dur-fast); }

.nkq__foot .nkq__consult:hover { color: var(--kh-blue); text-decoration-color: currentColor; }

.nkq__foot .kh-btn { padding-inline: 26px; }

.nkq__foot .kh-btn .nk-icon { --nk-icon-box: 22px; --nk-icon-size: 18px; }

.nkq__foot .kh-btn[hidden] { display: none; }

.nkq__foot .kh-btn.is-busy { pointer-events: none; opacity: .85; }

.nkq__foot .kh-btn.is-busy .nkq__spin { display: block; }

.nkq__spin { display: none; width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(255,255,255,.4); border-block-start-color: #fff; animation: nkq-spin .8s linear infinite; }

@keyframes nkq-spin { to { transform: rotate(360deg); } }

.nkq__confirm { position: absolute; inset: 0; z-index: 10; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(255,255,255,.92); backdrop-filter: blur(4px); }

.nkq__confirm.is-on { display: flex; }

.nkq__confirm-box { max-width: 360px; text-align: center; }

.nkq__confirm-box b { display: block; font-size: 20px; color: var(--kh-indigo); margin: 0 0 6px; }

.nkq__confirm-box p { margin: 0; font-size: 15px; color: var(--kh-text-2); }

.nkq__confirm-box div { display: flex; justify-content: center; gap: 10px; margin-block-start: 18px; }

.nkq__confirm-box .kh-btn { height: 44px; padding: 0 20px; color: #fff; }

.nkq__confirm-box .kh-btn--secondary { color: var(--kh-indigo); }

.nkq__success { display: grid; align-content: center; justify-items: center; text-align: center; min-height: 100%; padding: 8px 0; }

.nkq__tick { width: 96px; height: 96px; margin: 0 0 18px; }

.nkq__tick circle { fill: var(--kh-sky); }

.nkq__tick path { fill: none; stroke: var(--kh-blue); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 60; stroke-dashoffset: 60; animation: nkq-tick .6s var(--kh-ease-out) .25s forwards; }

@keyframes nkq-tick { to { stroke-dashoffset: 0; } }

.nkq__success p { margin: 10px 0 0; max-width: 420px; font-size: 16px; color: var(--kh-text-2); }

.nkq__next { display: grid; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; text-align: start; }

.nkq__next li { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--kh-text); }

.nkq__next .nk-icon { --nk-icon-box: 28px; --nk-icon-size: 16px; flex: none; border-radius: 50%; background: var(--kh-sky); color: var(--kh-indigo); }

.nkq__success .kh-btn { margin-block-start: 24px; color: #fff; }

.nkq__success small { display: block; margin-block-start: 12px; font-size: 13px; color: var(--kh-text-3); }

.nkq__nums { display: grid; gap: 14px; }

.nkq__affix { display: inline-flex; align-items: center; height: 100%; padding-inline: 14px 4px; font-size: 16px; font-weight: 500; color: var(--kh-text-3); flex: none; }

.nkq__affix--end { padding-inline: 4px 14px; }

.nkq__hintline { font-size: 12px; color: var(--kh-text-3); }

/* Legacy key icon sizing: keep until the HTML gains .kh-btn--brand.
   The shared button modifier in base.css uses the same dimensions. */
.nkq[hidden] { display: none !important; }

.nkq__form-shell {
    display: grid;
    grid-column: 1;
    grid-row: 1 / -1;
    grid-template-rows: minmax(0, 1fr) auto;
    width: 100%;
    height: 100%;
    min-height: 0;
}

.nkq__viewport {
    position: relative;
    min-height: 0;
    overflow: hidden;
}

.nkq__panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100%;
    min-height: 0;
}

.nkq__panel[hidden] {
    display: none;
}

.nkq__body {
    overflow: auto;
}

.nkq__chip-label,
.nkq__card-label {
    display: block;
    margin: 0;
    cursor: pointer;
}

.nkq__chip-label > input,
.nkq__card-label > input {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

.nkq__chip-label.is-selected .nkq__chip {
    background: var(--kh-blue);
    color: #fff;
}

.nkq__chip-label > input:focus-visible + .nkq__chip,
.nkq__card-label > input:focus-visible + .nkq__card {
    outline: 2px solid var(--kh-blue);
    outline-offset: 3px;
}

.nkq__card-label.is-selected .nkq__card {
    border-color: var(--kh-blue);
    background: var(--kh-sky-050);
    box-shadow: 0 0 0 1px var(--kh-blue);
}

.nkq__step-error {
    margin: 14px 0 0;
    font-size: 13px;
    color: var(--kh-danger);
}

.nkq__info-block {
    margin-block-start: 18px;
    padding: 16px 18px;
    border-radius: 16px;
    background: var(--kh-sky-050);
}

.nkq__info-block .site-list {
    margin: 0;
}

.nkq__contact-form {
    display: grid;
    gap: 14px;
}

.nkq__messages:empty {
    display: none;
}

.nkq__step-label {
    margin: 10px 0 0;
    font-size: 13px;
    color: rgba(255,255,255,.72);
    font-variant-numeric: tabular-nums;
}

.nkq__foot [data-nkq-submit].is-busy .nkq__spin {
    display: block;
}

/* Mortgage benefits: visible only after choosing "Yes". */

.nkq__info-block[hidden] {
    display: none !important;
}

.nkq__info-block {
    margin-block-start: 16px;
    padding: 16px 18px;
}

.nkq__info-block .site-list {
    margin: 0;
    padding-inline-start: 24px;
}

.nkq__info-block .site-list li + li {
    margin-block-start: 8px;
}

.nkq__zone-head {
    position: relative;
}

.nkq__zone-count {
    margin-inline-start: auto;
    font-size: 12px;
    color: var(--kh-text-3);
    font-variant-numeric: tabular-nums;
}

.nkq__zone.is-some,
.nkq__zone.is-all {
    border-color: var(--kh-blue);
    box-shadow: 0 0 0 1px var(--kh-blue);
}

.nkq__cb input:indeterminate + i {
    background: var(--kh-blue);
    border-color: var(--kh-blue);
}

.nkq__cb input:indeterminate + i::after {
    opacity: 1;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E");
}

.nkq__consult {
    margin-inline-end: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--kh-text-2);
    font: inherit;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: 3px;
    transition: color var(--kh-dur-fast), text-decoration-color var(--kh-dur-fast);
}

.nkq__consult:hover {
    color: var(--kh-blue);
    text-decoration-color: currentColor;
}

.nkq__card {
    gap: 14px;
}

.nkq__card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--kh-sky);
    color: var(--kh-indigo);
}

.nkq__card-icon svg {
    width: 22px;
    height: 22px;
}

.nkq__card-label.is-selected .nkq__card-icon {
    background: var(--kh-blue);
    color: #fff;
}

.nkq__badge-icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
}

.nkq__badge-icon svg {
    width: 100%;
    height: 100%;
}

.nkq__summary-wrap {
    margin-block-end: 24px;
}

.nkq__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.nkq__summary li {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: var(--kh-r-pill);
    background: var(--kh-sky);
    color: var(--kh-indigo);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
}

.nkq__edit-answers {
    margin-block-start: 8px;
    padding: 0 8px;
    border: 0;
    background: transparent;
    color: var(--kh-blue);
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.nkq__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.nkq__input-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 44px;
    height: 100%;
    color: var(--kh-text-3);
}

.nkq__input-icon svg {
    width: 20px;
    height: 20px;
}

.nkq__card-icon--currency {
    font-size: 24px;
    line-height: 1;
    font-weight: 600;
}

.nkq__art-currency {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 54px;
    line-height: 1;
    font-weight: 500;
}

.nkq__foot .kh-btn[data-nkq-next]:disabled,
.nkq__foot .kh-btn[data-nkq-next].is-disabled {
    opacity: .42;
    cursor: not-allowed;
    pointer-events: none;
    box-shadow: none;
    transform: none;
}

.nkq__card-icon--currency {
    font-family: Arial, sans-serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 1;
}

.nkq__success-screen {
    position: relative;
    grid-column: 1;
    grid-row: 1 / -1;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: auto;
    background: var(--kh-surface);
}

.nkq__success-screen[hidden] {
    display: none !important;
}

.nkq__success-head {
    padding: 36px 72px 8px 40px;
}

.nkq__success-body {
    display: grid;
    justify-items: center;
    align-content: start;
    padding: 30px 40px 40px;
    text-align: center;
}

.nkq__success-check {
    width: 96px;
    height: 96px;
    margin-block-end: 18px;
}

.nkq__success-check svg {
    width: 100%;
    height: 100%;
}

.nkq__success-check circle {
    fill: var(--kh-sky);
}

.nkq__success-check path {
    fill: none;
    stroke: var(--kh-blue);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 60;
    stroke-dashoffset: 60;
    animation: nkq-success-tick .6s var(--kh-ease-out) .2s forwards;
}

@keyframes nkq-success-tick {
    to { stroke-dashoffset: 0; }
}

.nkq__success-text {
    max-width: 500px;
    margin: 10px 0 0;
    font-size: 16px;
    line-height: 1.5;
    color: var(--kh-text-2);
}

.nkq__success-list {
    display: grid;
    gap: 10px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
    text-align: start;
}

.nkq__success-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    line-height: 1.4;
    color: var(--kh-text);
}

.nkq__success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--kh-sky);
    color: var(--kh-indigo);
}

.nkq__success-icon svg {
    width: 16px;
    height: 16px;
}

.nkq__success-btn {
    margin-block-start: 28px;
    min-width: 320px;
    justify-content: center;
    color: #fff;
}

.nkq__success-btn .nk-icon {
    --nk-icon-box: 22px;
    --nk-icon-size: 18px;
}

.nkq [data-success][hidden],
.nkq [data-validation-error][hidden] {
    display: none !important;
}

.nkq [data-error]:empty {
    display: none;
}

.nkq .nkq__field.is-invalid [data-error],
.nkq [data-error]:not(:empty) {
    display: block;
}

/* FetchIt may apply its configured invalid class directly to input. */

.nkq__input input.is-invalid,
.nkq__input input.error {
    color: inherit;
}

.nkq__input:has(input.is-invalid),
.nkq__input:has(input.error) {
    border-color: var(--kh-danger);
}

.nkq__card-icon--currency {
    font-family: inherit;
    font-size: 24px;
    font-weight: 600;
}

/* ============================================================
   RTL / Hebrew
   ============================================================ */
.lang-he .nkq__box {direction: rtl;}
.lang-he .nkq__panel.is-out-next, .lang-he .nkq__panel.is-in-prev { transform: translateX(24px); }

.lang-he .nkq__panel.is-out-prev, .lang-he .nkq__panel.is-in-next { transform: translateX(-24px); }



[dir="rtl"] .nkq__success-btn .nk-icon--arrow {
    transform: scaleX(-1);
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 900px) {
    .nkq__main {position: unset;}
}

@media (max-width: 900px) {
  .nkq__box { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); max-width: 100%; max-height: 100%; height: 100%; width: 100%; inset: 0; transform: none; border-radius: 0; }
  .lang-he .nkq__box, .nkq.is-in .nkq__box, .lang-he .nkq.is-in .nkq__box { transform: none; }
  .nkq__side { flex-direction: row; align-items: center; gap: 14px; padding: 14px 72px 14px 16px; }
  .nkq__brand, .nkq__art { display: none; }
  .nkq__mood { flex: 1; margin: 0; font-size: 15px; min-height: 0; }
  .nkq__progress { width: 120px; flex: none; }
  .nkq__step { margin-block-start: 6px; font-size: 12px; }
  .nkq__close { inset-block-start: 12px; inset-inline-end: 12px; background: rgba(255,255,255,.14); color: #fff; }
  .nkq__close:hover { background: var(--kh-surface); color: var(--kh-indigo); }
  .nkq__head { padding: 20px 20px 4px; }
  .nkq__body { padding: 12px 20px 20px; }
  .nkq__foot { position: sticky; inset-block-end: 0; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); }
  .nkq__foot .nkq__consult { order: 3; flex-basis: 100%; text-align: center; margin: 4px 0 0; }
  .nkq__foot { flex-wrap: wrap; }
  .nkq__foot .kh-btn {padding: 0 15px;}
  .nkq__foot .kh-btn--accent, .nkq__foot .kh-btn--brand { flex: 1; }
  .nkq__row { grid-template-columns: 1fr; }
  .nkq__cards { grid-template-columns: 1fr; }

   .lang-he {
   	.nkq__side {padding: 14px 16px 14px 72px; }
   }
}

@media (max-width: 900px) {
    .nkq__form-shell {
        min-height: 0;
    }

    .nkq__viewport {
        min-height: 0;
    }
}

@media (max-width: 900px) {
    .nkq__consult {
        order: 3;
        flex-basis: 100%;
        text-align: center;
        margin: 4px 0 0;
    }

    .nkq__row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {

    .nkq__success-head {
        padding: 20px 56px 4px 20px;
    }

    .nkq__success-body {
        padding: 24px 20px 32px;
    }

    .nkq__success-btn {
        width: 100%;
        min-width: 0;
    }
}

/* ============================================================
   Reduced motion
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
  .nkq__bg, .nkq__box, .nkq__panel, .nkq__head, .nkq__mood, .nkq__step, .nkq__art-icon, .nkq__card, .nkq__chip, .nkq__bar li i { transition: none; }
  .nkq__panel.is-out-next, .nkq__panel.is-out-prev, .nkq__panel.is-in-next, .nkq__panel.is-in-prev { transform: none; }
  .nkq__card:hover { transform: none; }
  .nkq__tick path { animation: none; stroke-dashoffset: 0; }
  .nkq__spin { animation: none; }
}

@media (prefers-reduced-motion: reduce) {
    .nkq__success-check path {
        animation: none;
        stroke-dashoffset: 0;
    }
}

/* Global typography on the standalone success title. */
.nkq__success-body h3 { margin: 0; }