.soffit-slider,
.soffit-slider * { box-sizing: border-box; }
.soffit-slider {
    --soffit-slider-primary: #2563eb;
    width: min(100%, 760px);
    margin-inline: auto;
    border: 1px solid #e2e7ef;
    border-radius: 16px;
    background: #fff;
    color: #202833;
    box-shadow: 0 16px 40px rgba(19, 33, 48, .1);
    font: inherit;
}
.soffit-slider__control { --soffit-slider-thumb-width: 4.8em; --soffit-slider-thumb-height: max(52px, 1.8em); position: relative; height: var(--soffit-slider-thumb-height); margin: 0; }
.soffit-slider__thumb { position: absolute; top: 0; left: var(--progress, 0%); transform: translateX(calc(0% - var(--progress, 0%))); display: flex; align-items: center; justify-content: center; width: min(100%, var(--soffit-slider-thumb-width)); height: var(--soffit-slider-thumb-height); margin: 0; border-radius: 999px; background: var(--soffit-slider-primary); color: #fff !important; font: inherit; font-variant-numeric: tabular-nums; white-space: nowrap; pointer-events: none; }
.soffit-slider__range { display: block; width: 100%; height: var(--soffit-slider-thumb-height); margin: 0; padding: 0; border: 0; background: transparent; font: inherit; cursor: pointer; appearance: none; -webkit-appearance: none; }
.soffit-slider__range::-webkit-slider-runnable-track { height: 6px; border-radius: 6px; background: linear-gradient(to right, var(--soffit-slider-primary) var(--progress, 0%), #dde4ed var(--progress, 0%)); }
.soffit-slider__range::-moz-range-track { height: 6px; border-radius: 6px; background: #dde4ed; }
.soffit-slider__range::-moz-range-progress { height: 6px; border-radius: 6px; background: var(--soffit-slider-primary); }
.soffit-slider__range::-webkit-slider-thumb { width: min(100%, var(--soffit-slider-thumb-width)); height: var(--soffit-slider-thumb-height); margin-top: calc((6px - var(--soffit-slider-thumb-height)) / 2); border: 0; background: transparent; box-shadow: none; -webkit-appearance: none; }
.soffit-slider__range::-moz-range-thumb { width: min(100%, var(--soffit-slider-thumb-width)); height: var(--soffit-slider-thumb-height); border: 0; background: transparent; box-shadow: none; }
.soffit-slider__columns { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin-top: 20px; }
.soffit-slider__prices { display: grid; align-content: start; gap: 4px; min-width: 0; }
.soffit-slider__row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; line-height: 1.35; }
.soffit-slider__row span { min-width: 0; overflow-wrap: anywhere; }
.soffit-slider__row strong { flex: none; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.soffit-slider__brand { display: flex; align-items: flex-start; gap: 9px; min-width: 0; cursor: pointer; }
.soffit-slider__brand-check { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--soffit-slider-primary); }
.soffit-slider__material { align-items: center; padding: 8px 10px; margin: 0; border-radius: 8px; cursor: pointer; }
.soffit-slider__material:hover { background: #f7f8fa; }
.soffit-slider__material.soffit-slider__row--selected { background: #eef0f3; }
.soffit-slider__row--excluded strong { color: #526173; font-weight: 400; }
.soffit-slider__additional { display: grid; align-content: start; gap: 8px; min-width: 0; padding-top: 16px; border-top: 1px solid #dce3ec; }
.soffit-slider__extra { align-items: center; }
.soffit-slider__extra-description { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.soffit-slider__stepper { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.soffit-slider__quantity { min-width: 54px; text-align: center; white-space: nowrap; font-variant-numeric: tabular-nums; font-size: .85rem; }
.soffit-slider__quantity-button { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 4px; background: var(--soffit-slider-primary); color: #fff; box-shadow: none; font: inherit; font-size: .8rem; line-height: 1; cursor: pointer; }
.soffit-slider__quantity-button:hover:not(:disabled) { background: var(--soffit-slider-primary); color: #fff; filter: brightness(.9); }
.soffit-slider__quantity-button:disabled { background: #edf0f4; color: #8993a0; cursor: default; }
.soffit-slider__total { margin-top: 18px; padding-top: 16px; border-top: 1px solid #dce3ec; font-weight: 600; }
.soffit-slider__total[hidden] { display: none !important; }
.soffit-slider__total strong { color: var(--soffit-slider-primary); font-size: 1.4rem; }
.soffit-slider__form { margin-top: 20px; }
.soffit-slider__phone input { width: 100%; min-height: 50px; padding: 10px 14px; border: 1px solid #cbd4df; border-radius: 7px; background: #f8fafd; color: inherit; font: inherit; font-size: 1rem; }
.soffit-slider__privacy { display: flex; align-items: flex-start; gap: 9px; margin: 14px 0; font-size: .9rem; line-height: 1.4; cursor: pointer; }
.soffit-slider__privacy input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--soffit-slider-primary); }
.soffit-slider__privacy a { color: var(--soffit-slider-primary); text-decoration: underline; text-underline-offset: 2px; }
.soffit-slider__form button[type="submit"] { width: 100%; min-height: 50px; padding: 12px 18px; border: 0; border-radius: 8px; background: var(--soffit-slider-primary); color: #fff; font: inherit; font-size: 1.05rem; font-weight: 700; cursor: pointer; }
.soffit-slider__form button[type="submit"]:hover { color: #fff; filter: brightness(.9); }
.soffit-slider__form button[type="submit"]:disabled { opacity: .65; cursor: wait; }
.soffit-slider__hp { position: absolute; left: -9999px; }
.soffit-slider :is(input, button, a):focus-visible,
.soffit-slider-modal__close:focus-visible { outline: 3px solid var(--soffit-slider-primary); outline-offset: 2px; }
.soffit-slider__phone.soffit-slider__invalid label,
.soffit-slider__privacy.soffit-slider__invalid,
.soffit-slider__privacy.soffit-slider__invalid a { color: #b42318; }
.soffit-slider__phone.soffit-slider__invalid input { border-color: #b42318; box-shadow: 0 0 0 1px #b42318; }
.soffit-slider__privacy.soffit-slider__invalid input { outline: 2px solid #b42318; outline-offset: 2px; }
.soffit-slider-modal { width: min(92vw, 560px); max-width: none; max-height: 94dvh; padding: 0; border: 0; border-radius: 16px; overflow: auto; box-shadow: 0 24px 70px rgba(15, 25, 37, .3); }
.soffit-slider-modal::backdrop { background: rgba(14, 23, 35, .58); }
.soffit-slider-modal .soffit-slider { width: 100%; border: 0; border-radius: 0; box-shadow: none; }
.soffit-slider-modal .soffit-slider { padding-top: 56px; }
.soffit-slider-modal__close { position: absolute; top: 10px; right: 12px; z-index: 1; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: #e8f0ff; color: #274268; font-size: 1.5rem; line-height: 1; cursor: pointer; }
@media (max-width: 420px) { .soffit-slider__row { gap: 8px; } }
