/* Magistral calculation flow: progressive form, sticky estimate, mobile total. */

#step-form.section {
    max-width: 1440px;
    padding-top: 28px;
}

#step-form .form-layout {
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 24px;
}

#step-form .form-panel {
    padding: 0;
    background: transparent;
    border: 0;
    gap: 14px;
}

#step-form #form-title {
    margin: 2px 0 8px;
    font-size: clamp(26px, 3vw, 38px);
    letter-spacing: -0.025em;
    text-wrap: balance;
}

#step-form .btn-back {
    margin-bottom: 2px;
    background: transparent;
}

.calc-flow-section {
    overflow: hidden;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 14px;
}

.calc-flow-section__header {
    width: 100%;
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    color: var(--text);
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    font-family: var(--font-body);
}

.calc-flow-section__header:hover {
    background: var(--card-bg-soft);
}

.calc-flow-section__header:focus-visible {
    outline: 3px solid var(--ring);
    outline-offset: -3px;
}

.calc-flow-section__number {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--text-secondary);
    background: var(--card-bg-soft);
    font: 700 13px/1 var(--font-mono);
}

.calc-flow-section--primary .calc-flow-section__number,
.calc-flow-section.is-open .calc-flow-section__number {
    color: #fff;
    background: var(--accent);
}

.calc-flow-section__copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.calc-flow-section__copy strong {
    font-size: 16px;
    line-height: 1.25;
}

.calc-flow-section__copy small {
    color: var(--text-secondary);
    font-size: 12px;
    line-height: 1.35;
}

.calc-flow-section__chevron {
    width: 10px;
    height: 10px;
    margin-left: auto;
    border-right: 2px solid var(--text-muted);
    border-bottom: 2px solid var(--text-muted);
    transform: rotate(45deg);
    transition: transform 180ms cubic-bezier(.22, 1, .36, 1);
}

.calc-flow-section.is-open .calc-flow-section__chevron {
    transform: rotate(225deg);
}

.calc-flow-section__body {
    display: none;
    padding: 2px 18px 20px 64px;
    border-top: 1px solid var(--border);
}

.calc-flow-section.is-open .calc-flow-section__body {
    display: block;
}

.calc-flow-section .fields-container {
    padding-top: 18px;
}

.calc-flow-section .extras-section {
    margin: 0;
    padding-top: 14px;
}

.calc-flow-section .extras-header {
    margin-bottom: 6px;
}

#step-form .btn-calculate {
    width: min(100%, 420px);
    align-self: flex-end;
    margin-top: 4px;
    min-height: 50px;
    box-shadow: 0 4px 8px rgba(238, 95, 27, .16);
}

#step-form .form-layout.wideformat-batch-layout {
    grid-template-columns: 250px minmax(0, 1fr) 380px;
    gap: 16px;
}

.wideformat-batch-layout > .result-panel {
    width: auto;
}

.wideformat-sidebar {
    position: sticky;
    top: 88px;
    max-height: calc(100vh - 104px);
    overflow-y: auto;
    padding: 10px;
    color: var(--text);
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 14px;
    scrollbar-width: thin;
}

.wideformat-sidebar__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 6px 11px;
    border-bottom: 1px solid var(--border);
}

.wideformat-sidebar__head strong,
.wideformat-sidebar__head small {
    display: block;
}

.wideformat-sidebar__head strong {
    font-size: 14px;
}

.wideformat-sidebar__head small {
    margin-top: 2px;
    color: var(--text-secondary);
    font-size: 11px;
}

.wideformat-sidebar__hint {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--text-secondary);
    background: var(--card-bg-soft);
    border-radius: 50%;
    font: 700 12px/1 var(--font-mono);
}

.wideformat-sidebar__nav {
    display: grid;
    gap: 4px;
    padding-top: 8px;
}

.wideformat-sidebar__section {
    min-width: 0;
}

.wideformat-sidebar__section-button {
    width: 100%;
    min-height: 50px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 16px;
    align-items: center;
    gap: 9px;
    padding: 7px 8px;
    color: var(--text-secondary);
    background: transparent;
    border: 0;
    border-radius: 9px;
    text-align: left;
    transition: color 160ms, background-color 160ms;
}

.wideformat-sidebar__section-button:hover {
    color: var(--text);
    background: var(--card-bg-soft);
}

.wideformat-sidebar__section.is-open > .wideformat-sidebar__section-button {
    color: #fff;
    background: #252a30;
}

.wideformat-sidebar__section-button > span:nth-child(2) {
    min-width: 0;
}

.wideformat-sidebar__section-button strong,
.wideformat-sidebar__section-button small {
    display: block;
}

.wideformat-sidebar__section-button strong {
    font-size: 12px;
    line-height: 1.3;
}

.wideformat-sidebar__section-button small {
    margin-top: 2px;
    color: var(--text-muted);
    font-size: 10px;
}

.wideformat-sidebar__section.is-open .wideformat-sidebar__section-button small {
    color: #c4cbd2;
}

.wideformat-sidebar__section-button > i {
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.wideformat-sidebar__section.is-open .wideformat-sidebar__section-button > i {
    transform: rotate(225deg);
}

.wideformat-sidebar__icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: var(--accent);
    background: var(--accent-light);
    border-radius: 8px;
}

.wideformat-sidebar__section.is-open .wideformat-sidebar__icon {
    color: #fff;
    background: var(--accent);
}

.wideformat-sidebar__icon svg {
    width: 21px;
    height: 21px;
}

.wideformat-sidebar__materials {
    display: grid;
    gap: 4px;
    padding: 5px 0 8px 18px;
}

.wideformat-sidebar__material {
    width: 100%;
    min-height: 46px;
    display: grid;
    grid-template-columns: 17px minmax(0, 1fr) 26px;
    align-items: center;
    gap: 7px;
    padding: 6px 7px;
    color: var(--text);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 9px;
    text-align: left;
    transition: border-color 170ms, background-color 170ms, transform 150ms cubic-bezier(.22, 1, .36, 1);
}

.wideformat-sidebar__material:hover {
    background: var(--card-bg-soft);
}

.wideformat-sidebar__material:active {
    transform: scale(.985);
}

.wideformat-sidebar__material.is-active {
    background: var(--accent-light);
    border-color: var(--accent);
}

.wideformat-sidebar__state {
    width: 16px;
    height: 16px;
    display: grid;
    place-items: center;
    color: transparent;
    background: var(--card-bg);
    border: 1px solid var(--border-strong, var(--border));
    border-radius: 50%;
}

.wideformat-sidebar__material.is-added .wideformat-sidebar__state {
    color: #fff;
    background: #23814a;
    border-color: #23814a;
}

.wideformat-sidebar__state svg {
    width: 10px;
    height: 10px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.wideformat-sidebar__material > span:nth-child(2) {
    min-width: 0;
}

.wideformat-sidebar__material strong,
.wideformat-sidebar__material small {
    display: block;
}

.wideformat-sidebar__material strong {
    font-size: 11px;
    line-height: 1.3;
}

.wideformat-sidebar__material small {
    margin-top: 2px;
    color: var(--text-secondary);
    font: 650 9px/1.3 var(--font-mono);
}

.wideformat-sidebar__material > b {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    color: var(--text-secondary);
    background: var(--card-bg-soft);
    border-radius: 7px;
    font: 700 10px/1 var(--font-mono);
}

.wideformat-sidebar__material.is-active > b {
    color: #fff;
    background: var(--accent);
}

.wideformat-sidebar__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-top: 6px;
    padding: 10px 7px 3px;
    color: var(--text-secondary);
    border-top: 1px solid var(--border);
    font-size: 10px;
}

.wideformat-sidebar__legend span {
    display: flex;
    align-items: center;
    gap: 5px;
}

.wideformat-sidebar__legend i {
    width: 8px;
    height: 8px;
    background: #fff;
    border: 1px solid var(--text-muted);
    border-radius: 50%;
}

.wideformat-sidebar__legend span:first-child i {
    background: #23814a;
    border-color: #23814a;
}

.wideformat-batch__material-field {
    display: none !important;
}

.wideformat-active-material {
    min-height: 66px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 11px 13px;
    margin-bottom: 14px;
    color: var(--text);
    background: var(--card-bg-soft);
    border-radius: 10px;
}

.wideformat-active-material span small,
.wideformat-active-material strong {
    display: block;
}

.wideformat-active-material span small {
    color: var(--text-secondary);
    font-size: 10px;
}

.wideformat-active-material strong {
    margin-top: 2px;
    font-size: 14px;
}

.wideformat-active-material > small {
    max-width: 190px;
    color: var(--text-secondary);
    font-size: 11px;
    line-height: 1.4;
    text-align: right;
}

.wideformat-batch {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

.wideformat-batch__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.wideformat-batch__head div {
    display: grid;
    gap: 3px;
}

.wideformat-batch__head strong {
    font-size: 14px;
}

.wideformat-batch__head small,
.wideformat-batch > p {
    color: var(--text-secondary);
    font-size: 12px;
}

.wideformat-batch__head b {
    color: var(--accent);
    font: 700 15px/1.35 var(--font-mono);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.wideformat-batch__head-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

.wideformat-batch__head-actions .wideformat-batch__group-remove {
    width: 34px;
    height: 34px;
}

.wideformat-batch__list {
    display: grid;
    gap: 6px;
}

.wideformat-batch__groups {
    display: grid;
    gap: 8px;
}

.wideformat-batch__group {
    overflow: hidden;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 11px;
    transition: border-color 180ms cubic-bezier(.22, 1, .36, 1),
        background-color 180ms cubic-bezier(.22, 1, .36, 1);
}

.wideformat-batch__group.is-active {
    border-color: var(--accent);
    background: var(--accent-light);
}

.wideformat-batch__group-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    min-height: 58px;
}

.wideformat-batch__group-head > button:first-child {
    min-width: 0;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    color: var(--text);
    background: transparent;
    border: 0;
    text-align: left;
}

.wideformat-batch__group-head > button:first-child > span:first-child {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    color: var(--text-secondary);
    background: var(--card-bg-soft);
    border-radius: 8px;
    font: 700 11px/1 var(--font-mono);
}

.wideformat-batch__group.is-active .wideformat-batch__group-head > button:first-child > span:first-child {
    color: #fff;
    background: var(--accent);
}

.wideformat-batch__group-head strong,
.wideformat-batch__group-head small {
    display: block;
}

.wideformat-batch__group-head strong {
    font-size: 13px;
}

.wideformat-batch__group-head small {
    margin-top: 2px;
    color: var(--text-secondary);
    font-size: 11px;
}

.wideformat-batch__group-head b {
    color: var(--text);
    font: 700 12px/1 var(--font-mono);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.wideformat-batch__group > .wideformat-batch__list,
.wideformat-batch__group > .wideformat-batch__add {
    display: none;
}

.wideformat-batch__group.is-active > .wideformat-batch__list {
    display: grid;
    padding: 0 8px 8px 48px;
}

.wideformat-batch__group.is-active > .wideformat-batch__add {
    display: block;
    width: calc(100% - 56px);
    margin: 0 8px 8px 48px;
}

.wideformat-batch__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px;
    min-height: 48px;
    background: var(--card-bg-soft);
    border-radius: 9px;
}

.wideformat-batch__row.is-active {
    box-shadow: inset 0 0 0 2px var(--accent);
    background: var(--accent-light);
}

.wideformat-batch__row > button:first-child {
    min-width: 0;
    display: grid;
    grid-template-columns: 24px minmax(110px, .8fr) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    color: var(--text);
    background: transparent;
    border: 0;
    text-align: left;
}

.wideformat-batch__row > button:first-child > span {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    color: var(--text-secondary);
    background: var(--card-bg);
    border-radius: 7px;
    font: 700 11px/1 var(--font-mono);
}

.wideformat-batch__row strong {
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.wideformat-batch__row small {
    color: var(--text-secondary);
    font-size: 12px;
}

.wideformat-batch__row em {
    grid-column: 2 / -1;
    overflow: hidden;
    color: var(--text-muted);
    font-size: 10px;
    font-style: normal;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wideformat-batch__remove {
    width: 36px;
    color: var(--text-secondary);
    background: transparent;
    border: 0;
    border-radius: 8px;
    font-size: 20px;
}

.wideformat-batch__group-remove {
    width: 36px;
    color: var(--text-secondary);
    background: transparent;
    border: 0;
    border-radius: 8px;
    font-size: 20px;
}

.wideformat-batch__group-remove:hover:not(:disabled) {
    color: #b42318;
    background: #fff1f0;
}

.wideformat-batch__group-remove:disabled {
    opacity: .3;
    cursor: not-allowed;
}

.wideformat-batch__remove:hover:not(:disabled) {
    color: #b42318;
    background: #fff1f0;
}

.wideformat-batch__remove:disabled {
    opacity: .3;
    cursor: not-allowed;
}

.wideformat-batch__add {
    width: 100%;
    min-height: 42px;
    margin-top: 8px;
    color: var(--text-secondary);
    background: transparent;
    border: 1px dashed var(--border-strong, var(--border));
    border-radius: 9px;
    font-weight: 700;
}

.wideformat-batch__add:hover {
    color: var(--accent);
    border-color: var(--accent);
    background: var(--accent-light);
}

.wideformat-batch__new-material {
    width: 100%;
    min-height: 42px;
    margin-top: 8px;
    color: var(--text-secondary);
    background: transparent;
    border: 1px dashed var(--border-strong, var(--border));
    border-radius: 9px;
    font-weight: 700;
}

.wideformat-batch__new-material:hover {
    color: var(--accent);
    border-color: var(--accent);
    background: var(--accent-light);
}

.wideformat-batch > p {
    margin: 8px 0 0;
    line-height: 1.45;
}

@media (max-width: 1180px) and (min-width: 768px) {
    #step-form .form-layout.wideformat-batch-layout {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .wideformat-batch-layout > .result-panel {
        grid-column: 1 / -1;
        position: static;
        max-height: none;
        overflow: visible;
    }
}

@media (max-width: 640px) {
    .wideformat-batch__group-head > button:first-child {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .wideformat-batch__group-head b {
        grid-column: 2;
    }

    .wideformat-batch__group.is-active > .wideformat-batch__list {
        padding-left: 8px;
    }

    .wideformat-batch__group.is-active > .wideformat-batch__add {
        width: calc(100% - 16px);
        margin-left: 8px;
    }

    .wideformat-batch__row > button:first-child {
        grid-template-columns: 24px minmax(0, 1fr);
    }

    .wideformat-batch__row small {
        grid-column: 2;
    }

    .wideformat-batch__row em {
        grid-column: 2;
    }
}

@media (max-width: 767px) {
    #step-form .form-layout.wideformat-batch-layout {
        grid-template-columns: 1fr;
    }

    .wideformat-sidebar {
        position: static;
        max-height: none;
        overflow: visible;
    }

    .wideformat-sidebar__nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wideformat-sidebar__section.is-open {
        grid-column: 1 / -1;
    }

    .wideformat-sidebar__materials {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding-left: 0;
    }

    .wideformat-active-material {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .wideformat-active-material > small {
        max-width: none;
        text-align: left;
    }
}

@media (max-width: 430px) {
    .wideformat-sidebar__nav,
    .wideformat-sidebar__materials {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wideformat-batch__row,
    .wideformat-batch__group,
    .wideformat-batch__add,
    .wideformat-batch__new-material,
    .wideformat-batch__group-remove,
    .wideformat-batch__remove,
    .wideformat-sidebar__section-button,
    .wideformat-sidebar__material {
        transition: none !important;
    }
}

#step-form .result-panel {
    top: 88px;
    width: auto;
    min-width: 0;
    padding: 22px;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(15, 23, 30, .08);
}

#step-form .result-title {
    margin-bottom: 14px;
    font-size: 18px;
    letter-spacing: -0.015em;
    text-transform: none;
}

#step-form .result-placeholder {
    min-height: 220px;
    display: grid;
    place-items: center;
    padding: 24px;
    color: var(--text-secondary);
    text-align: center;
    line-height: 1.55;
    background: var(--card-bg-soft);
    border-radius: 12px;
}

#step-form .result-placeholder::before {
    content: '₽';
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    color: var(--accent);
    background: var(--accent-light);
    border-radius: 50%;
    font: 700 21px/1 var(--font-display);
}

#step-form .result-breakdown {
    margin-top: 18px;
}

#step-form .result-breakdown::before {
    content: 'Состав стоимости';
    display: block;
    margin-bottom: 8px;
    color: var(--text);
    font-size: 13px;
    font-weight: 700;
}

#step-form .breakdown-row {
    min-height: 42px;
    padding: 9px 0;
}

#step-form .breakdown-group {
    margin: 2px 0 8px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface);
    overflow: hidden;
    animation: breakdownRowIn 0.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}

#step-form .breakdown-group__summary {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 10px 12px;
    cursor: pointer;
    list-style: none;
    transition: background-color 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

#step-form .breakdown-group__summary::-webkit-details-marker {
    display: none;
}

#step-form .breakdown-group__summary:hover {
    background: var(--muted);
}

#step-form .breakdown-group__summary:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
}

#step-form .breakdown-group__number {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--accent);
    background: var(--accent-light);
    border-radius: 50%;
    font: 700 12px/1 var(--font-mono);
}

#step-form .breakdown-group__title {
    min-width: 0;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 2px;
}

#step-form .breakdown-group__title strong {
    color: var(--text);
    font-size: 13px;
    line-height: 1.25;
    text-wrap: pretty;
}

#step-form .breakdown-group__title small {
    color: var(--text-muted);
    font-size: 11px;
    line-height: 1.25;
}

#step-form .breakdown-group__total {
    color: var(--text);
    font: 700 13px/1 var(--font-mono);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

#step-form .breakdown-group__chevron {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-right: 1.5px solid var(--text-muted);
    border-bottom: 1.5px solid var(--text-muted);
    transform: rotate(45deg);
    transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

#step-form .breakdown-group:not([open]) .breakdown-group__chevron {
    transform: rotate(-45deg);
}

#step-form .breakdown-group__content {
    border-top: 1px solid var(--border);
}

#step-form .breakdown-position {
    padding: 10px 12px 10px 48px;
}

#step-form .breakdown-position + .breakdown-position {
    border-top: 1px dashed var(--border);
}

#step-form .breakdown-position__head,
#step-form .breakdown-position__details > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

#step-form .breakdown-position__head {
    color: var(--text);
    font-size: 12px;
    line-height: 1.4;
}

#step-form .breakdown-position__head > span {
    min-width: 0;
}

#step-form .breakdown-position__head > strong,
#step-form .breakdown-position__details b {
    flex: 0 0 auto;
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

#step-form .breakdown-position__details {
    margin-top: 6px;
    color: var(--text-muted);
    font-size: 10px;
}

#step-form .breakdown-position__details > div {
    padding: 2px 0;
}

#step-form .breakdown-position__details b {
    color: var(--text-secondary);
    font-weight: 600;
}

#step-form .result-total-section {
    margin-top: 10px;
    padding: 16px 0 4px;
    background: transparent;
    border-top: 1px solid var(--border);
    border-radius: 0;
}

#step-form .result-total {
    align-items: baseline;
}

#step-form #result-total span:first-child {
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 700;
}

#step-form #result-total span:last-child {
    color: var(--accent);
    font: 700 28px/1 var(--font-display);
    font-variant-numeric: tabular-nums;
}

#step-form .result-days {
    padding: 10px 12px;
    color: #245f35;
    background: #eef8f1;
    border-radius: 8px;
    font-weight: 600;
}

body.client-mode #result-waste,
body.client-mode #manual-discount-row,
body.client-mode #manager-markup-row {
    display: none !important;
}

@media (max-width: 640px) {
    #step-form .breakdown-group__summary {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    #step-form .breakdown-group__title {
        width: calc(100% - 46px);
        flex-basis: calc(100% - 46px);
    }

    #step-form .breakdown-group__total {
        margin-left: 36px;
    }

    #step-form .breakdown-position {
        padding-left: 12px;
    }

    #step-form .breakdown-position__head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #step-form .breakdown-group,
    #step-form .breakdown-group__summary,
    #step-form .breakdown-group__chevron {
        animation: none;
        transition: none;
    }
}

body.client-mode #btn-add-to-cart,
body.client-mode #btn-send-lead {
    display: inline-flex !important;
}

#btn-add-to-cart {
    order: 1;
}

#btn-send-lead {
    order: 2;
    background: #3f9c59 !important;
}

#btn-download,
#btn-share {
    min-height: 42px;
}

.mobile-result-bar {
    display: none;
}

@media (min-width: 1025px) {
    body:has(#step-form .result-panel.has-result) #ai-chat-fab {
        display: none;
    }
}

@media (max-width: 1024px) {
    #step-form .form-layout {
        grid-template-columns: 1fr;
    }

    #step-form .result-panel {
        position: static;
        max-height: none;
    }
}

@media (max-width: 767px) {
    .header__inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 6px 10px;
        padding: 8px 12px;
    }

    .header__brand {
        grid-column: 1;
        grid-row: 1;
    }

    .header__actions {
        grid-column: 2;
        grid-row: 1;
    }

    .header__actions .header-role-btn {
        width: 34px;
        height: 34px;
    }

    .gp-tabs {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        margin: 0;
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .gp-tabs::-webkit-scrollbar {
        display: none;
    }

    .gp-tabs button {
        flex: 0 0 auto;
    }

    #step-form.section {
        padding: 18px 12px 104px;
    }

    #step-form #form-title {
        font-size: 27px;
    }

    .calc-flow-section__header {
        min-height: 66px;
        padding: 12px 14px;
    }

    .calc-flow-section__body {
        padding: 0 14px 16px;
    }

    .calc-flow-section .fields-container {
        padding-top: 14px;
    }

    #step-form .btn-calculate {
        width: 100%;
    }

    #step-form .result-panel.has-result {
        position: fixed;
        inset: auto 0 0;
        z-index: 120;
        max-height: 82vh;
        padding: 20px 16px calc(18px + env(safe-area-inset-bottom, 0px));
        border-radius: 14px 14px 0 0;
        overflow-y: auto;
        transform: translateY(110%);
        visibility: hidden;
        transition: transform 240ms cubic-bezier(.22, 1, .36, 1), visibility 0s linear 240ms;
    }

    #step-form .result-panel.has-result.preview-expanded {
        transform: translateY(0);
        visibility: visible;
        transition-delay: 0s;
    }

    #step-form .result-panel.has-result.collapsed {
        max-height: 82vh;
        padding: 20px 16px calc(18px + env(safe-area-inset-bottom, 0px));
    }

    #step-form .result-placeholder {
        min-height: 130px;
    }

    .mobile-result-bar:not([hidden]) {
        position: fixed;
        z-index: 110;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: stretch;
        gap: 10px;
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
        background: #fff;
        border-top: 1px solid var(--border);
        box-shadow: 0 -4px 8px rgba(15, 23, 30, .08);
    }

    .mobile-result-bar__summary {
        min-width: 0;
        flex: 1;
        display: grid;
        gap: 2px;
        padding: 3px 2px;
        text-align: left;
        color: var(--text);
        background: transparent;
        border: 0;
        font-family: var(--font-body);
    }

    .mobile-result-bar__summary span {
        color: var(--text-secondary);
        font-size: 11px;
    }

    .mobile-result-bar__summary strong {
        color: var(--accent);
        font: 700 21px/1.15 var(--font-display);
        font-variant-numeric: tabular-nums;
    }

    .mobile-result-bar__action {
        min-height: 48px;
        padding: 0 16px;
        color: #fff;
        background: var(--accent);
        border: 0;
        border-radius: 8px;
        font: 700 13px/1.2 var(--font-body);
    }

    .btn-reopen-result {
        display: none !important;
    }

    body:has(#mobile-result-bar:not([hidden])) #ai-chat-fab {
        display: none;
    }

    body:has(#mobile-result-bar:not([hidden])) #ai-chat-window {
        bottom: 152px;
    }

}

@media (prefers-reduced-motion: reduce) {
    .calc-flow-section__chevron,
    #step-form .result-panel.has-result {
        transition: none;
    }
}