h3, h1 {color:white}
.lh-winter{
--lh-blue:#123b63;
--lh-blue-dark:#0a2946;
--lh-blue-soft:#eaf1f7;
--lh-ink:#17212b;
--lh-muted:#66717d;
--lh-line:#d9e1e8;
--lh-bg:#f5f7f9;
--lh-white:#fff;
--lh-radius:24px;
--lh-max:1240px;
}
.lh-winter, .lh-winter *{box-sizing:border-box}
.lh-winter{font-family:Arial,Helvetica,sans-serif;color:var(--lh-ink);background:#fff;line-height:1.45}
.lh-winter a{text-decoration:none;color:inherit}
.lh-winter img{display:block;width:100%;height:100%;object-fit:cover}
.lh-wrap{width:min(calc(100% - 40px),var(--lh-max));margin:0 auto}
.lh-kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;line-height:1;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:var(--lh-blue)}
.lh-kicker:before{content:"";width:34px;height:2px;background:currentColor}
.lh-h1{font-size:clamp(42px,6.5vw,88px);line-height:.95;letter-spacing:-.045em;margin:18px 0 24px;max-width:950px}
.lh-h2{font-size:clamp(32px,4vw,58px);line-height:1.02;letter-spacing:-.035em;margin:0 0 18px; color: #0000006e}
.lh-lead{font-size:clamp(19px,2vw,28px);line-height:1.25;max-width:820px;margin:0;color:#334352}
.lh-btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 28px;background:var(--lh-blue);color:#fff!important;border:1px solid var(--lh-blue);border-radius:999px;font-weight:700;transition:.2s;cursor:pointer;font-size:16px}
.lh-btn:hover{background:var(--lh-blue-dark);border-color:var(--lh-blue-dark);transform:translateY(-1px)}
.lh-btn--light{background:#fff;color:var(--lh-blue)!important;border-color:#fff}
.lh-btn--ghost{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.55)}

.lh-hero{position:relative;min-height:760px;display:grid;align-items:end;color:#fff;overflow:hidden;background:var(--lh-blue-dark)}
.lh-hero__media{position:absolute;inset:0}
.lh-hero__media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,24,43,.86) 0%,rgba(5,24,43,.58) 46%,rgba(5,24,43,.18) 100%),linear-gradient(0deg,rgba(5,24,43,.5),transparent 48%)}
.lh-hero__content{position:relative;z-index:1;padding:90px 0 80px}
.lh-hero .lh-kicker{color:#fff;opacity:.9}
.lh-hero .lh-lead{color:rgba(255,255,255,.9);max-width:740px}
.lh-hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.lh-offer{display:grid;grid-template-columns:1fr auto;align-items:end;gap:28px;margin-top:60px;padding-top:26px;border-top:1px solid rgba(255,255,255,.32)}
.lh-offer__big{font-size:clamp(40px,6vw,76px);font-weight:800;line-height:.9;letter-spacing:-.04em}
.lh-offer__txt{max-width:390px;color:rgba(255,255,255,.84);font-size:16px}

.lh-section{padding:104px 0}
.lh-section--soft{background:var(--lh-bg)}
.lh-section__head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:50px}
.lh-section__head p{margin:0;max-width:520px;color:var(--lh-muted);font-size:17px}

.lh-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.lh-step{position:relative;overflow:hidden;min-height:420px;border-radius:var(--lh-radius);background:#fff;border:1px solid var(--lh-line);padding:34px;display:flex;flex-direction:column;justify-content:space-between}
.lh-step--photo{color:#fff;border:0}
.lh-step--photo .lh-step__photo{position:absolute;inset:0}
.lh-step--photo .lh-step__photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,35,59,.88),rgba(7,35,59,.18) 70%)}
.lh-step__content{position:relative;z-index:2}
.lh-step__content h2{
    color:#555; 
    text-align:center;
    margin-top: 20%;    
}

.lh-step__num{font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--lh-blue);margin-bottom:18px}
.lh-step--photo .lh-step__num{color:#fff;opacity:.8}
.lh-step h3{ 
    font-size:31px; 
    line-height:1.04;
    letter-spacing:-.025em;
    margin:0 0 14px;
}
.lh-step p{font-size:16px;margin:0;color:var(--lh-muted);max-width:520px}
.lh-step--photo p{color:rgba(255,255,255,.86); background-color: #00000082;
    padding: 5px;}
.lh-step__result{position:relative;z-index:2;font-size:14px;font-weight:700;display:flex;gap:10px;align-items:center;margin-top:30px}
.lh-step__result:before{content:"✓";display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--lh-blue-soft);color:var(--lh-blue)}
.lh-step--photo .lh-step__result:before{background:rgba(255,255,255,.16);color:#fff}

.lh-timeline{background:var(--lh-blue-dark);color:#fff;border-radius:34px;padding:54px;display:grid;grid-template-columns:1.1fr 1fr;gap:72px;align-items:center}
.lh-timeline h2{margin:0;font-size:clamp(36px,4vw,60px);line-height:1.02;letter-spacing:-.035em}
.lh-timeline p{color:rgba(255,255,255,.75);font-size:17px;max-width:530px}
.lh-months{display:grid;gap:18px}
.lh-month{display:grid;grid-template-columns:105px 1fr;gap:18px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.18)}
.lh-month:last-child{border-bottom:0;padding-bottom:0}
.lh-month strong{font-size:15px}
.lh-month span{color:rgba(255,255,255,.72)}

.lh-benefit{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
.lh-benefit__main{border-radius:34px;background:var(--lh-blue);color:#fff;padding:54px;min-height:430px;display:flex;flex-direction:column;justify-content:space-between}
.lh-benefit__main .lh-kicker{color:#fff}
.lh-benefit__percent{font-size:clamp(88px,13vw,170px);font-weight:800;line-height:.75;letter-spacing:-.08em;margin-top:54px}
.lh-benefit__main p{font-size:21px;max-width:590px;color:rgba(255,255,255,.88)}
.lh-benefit__photo{min-height:430px;border-radius:34px;overflow:hidden}

.lh-why{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.lh-why__item{border-top:1px solid var(--lh-line);padding:26px 0 0}
.lh-why__item strong{display:block;font-size:22px;margin-bottom:10px}
.lh-why__item p{margin:0;color:var(--lh-muted)}

.lh-formbox{border-radius:34px;overflow:hidden;background:var(--lh-bg);display:grid;grid-template-columns:1fr 1fr}
.lh-formbox__media{min-height:610px}
.lh-formbox__body{padding:58px;display:flex;flex-direction:column;justify-content:center}
.lh-formbox__body h2{font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:-.035em;margin:16px 0 18px; color:#0000006e}
.lh-formbox__body>p{margin:0 0 30px;color:var(--lh-muted);font-size:17px}
.lh-form{display:grid;gap:12px}
.lh-field{width:100%;height:58px;border:1px solid #cfd7df;border-radius:12px;background:#fff;padding:0 16px;font:inherit;color:var(--lh-ink);outline:none}
.lh-field:focus{border-color:var(--lh-blue)}
.lh-consent{font-size:12px;color:#7b8791;line-height:1.4;margin:4px 0 4px}
.lh-consent a{text-decoration:underline}
.lh-form__status{font-size:14px;min-height:20px;color:var(--lh-blue)}

.lh-sticky{position:fixed;right:22px;bottom:22px;z-index:50;box-shadow:0 14px 40px rgba(0,0,0,.16)}

@media(max-width:900px){
.lh-hero{min-height:700px}
.lh-hero__content{padding:70px 0 54px}
.lh-offer{grid-template-columns:1fr}
.lh-section{padding:72px 0}
.lh-section__head{display:block}
.lh-section__head p{margin-top:18px}
.lh-steps,.lh-benefit,.lh-formbox,.lh-timeline{grid-template-columns:1fr}
.lh-timeline{gap:42px;padding:34px}
.lh-why{grid-template-columns:1fr}
.lh-formbox__media{min-height:380px}
.lh-formbox__body{padding:36px}
.lh-benefit__main{padding:36px}
.lh-sticky{display:none}
}

@media(max-width:620px){
.lh-wrap{width:min(calc(100% - 24px),var(--lh-max))}
.lh-hero{min-height:740px}
.lh-steps{grid-template-columns:1fr}
.lh-step{min-height:360px;padding:26px}
.lh-month{grid-template-columns:1fr}
.lh-benefit__percent{font-size:100px}
.lh-formbox__media{min-height:300px}
}


/* =========================================================
   LAHTI HOUSE — КАЛЬКУЛЯТОР СТОИМОСТИ ПРОЕКТИРОВАНИЯ
   ========================================================= */

#lh-project-calculator {
    --lh-blue: #173b63;
    --lh-blue-dark: #102d4b;
    --lh-blue-light: #edf4fa;
    --lh-text: #1d2935;
    --lh-muted: #6d7884;
    --lh-border: #dce3e9;
    --lh-white: #ffffff;
    --lh-green: #2e7d5b;
    --lh-red: #b94a48;

    width: 100%;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--lh-text);
}

#lh-project-calculator *,
#lh-project-calculator *::before,
#lh-project-calculator *::after {
    box-sizing: border-box;
}

/* Контейнер */

.lh-calc-wrapper {
    max-width: 1180px;
    margin: 0 auto;
    padding: 50px 20px;
}

/* Заголовок */

.lh-calc-title {
    margin: 0 0 12px;
    font-size: 36px;
    line-height: 1.15;
    font-weight: 600;
    color: var(--lh-blue-dark);
}

.lh-calc-subtitle {
    max-width: 760px;
    margin: 0 0 35px;
    color: var(--lh-muted);
    font-size: 17px;
    line-height: 1.55;
}

/* Основная сетка */

.lh-calc-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 30px;
    align-items: start;
}

/* Карточки */

.lh-calc-card {
    background: var(--lh-white);
    border: 1px solid var(--lh-border);
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 8px 30px rgba(16, 45, 75, 0.06);
}

.lh-calc-card + .lh-calc-card {
    margin-top: 20px;
}

.lh-calc-card-title {
    margin: 0 0 22px;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 600;
    color: var(--lh-blue-dark);
}

/* Площадь */

.lh-area-row {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
}

.lh-area-input {
    width: 160px;
    height: 54px;
    padding: 0 16px;
    border: 1px solid var(--lh-border);
    border-radius: 10px;
    outline: none;
    font-size: 22px;
    font-weight: 600;
    color: var(--lh-blue-dark);
    transition: .2s;
}

.lh-area-input:focus {
    border-color: var(--lh-blue);
    box-shadow: 0 0 0 3px rgba(23, 59, 99, .08);
}

.lh-area-unit {
    font-size: 17px;
    color: var(--lh-muted);
}

/* Range */

.lh-area-range {
    width: 100%;
    margin: 0;
    accent-color: var(--lh-blue);
    cursor: pointer;
}

.lh-range-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    font-size: 12px;
    color: var(--lh-muted);
}

/* Этапы */

.lh-stage-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lh-stage {
    position: relative;
}

.lh-stage-label {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 70px;
    padding: 14px 16px;
    border: 1px solid var(--lh-border);
    border-radius: 12px;
    cursor: pointer;
    transition: .2s;
}

.lh-stage-label:hover {
    border-color: #b8c7d5;
    background: #fafcfe;
}

.lh-stage-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.lh-stage-check {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    border: 1px solid #b7c1ca;
    border-radius: 5px;
    position: relative;
    transition: .2s;
}

.lh-stage-checkbox:checked + .lh-stage-label .lh-stage-check {
    background: var(--lh-blue);
    border-color: var(--lh-blue);
}

.lh-stage-checkbox:checked + .lh-stage-label .lh-stage-check::after {
    content: "";
    position: absolute;
    width: 6px;
    height: 11px;
    left: 7px;
    top: 3px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.lh-stage-checkbox:checked + .lh-stage-label {
    border-color: var(--lh-blue);
    background: var(--lh-blue-light);
}

.lh-stage-content {
    flex: 1;
}

.lh-stage-name {
    display: block;
    margin-bottom: 4px;
    font-size: 16px;
    font-weight: 600;
    color: var(--lh-text);
}

.lh-stage-description {
    display: block;
    font-size: 13px;
    line-height: 1.4;
    color: var(--lh-muted);
}

.lh-stage-price {
    white-space: nowrap;
    font-size: 15px;
    font-weight: 600;
    color: var(--lh-blue);
}

/* Информационная плашка КЖ */

.lh-kj-info {
    margin-top: 14px;
    padding: 18px;
    border-radius: 12px;
    background: #f5f8fb;
    border: 1px solid #dbe5ed;
}

.lh-kj-info-title {
    margin-bottom: 7px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lh-blue-dark);
}

.lh-kj-info-text {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lh-muted);
}

.lh-kj-skip {
    margin-top: 12px;
    border: 0;
    background: transparent;
    padding: 0;
    color: var(--lh-blue);
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

.lh-kj-skip:hover {
    text-decoration: none;
}

/* Итог */

.lh-total-card {
    position: sticky;
    top: 20px;
    background: var(--lh-blue-dark);
    border-radius: 18px;
    padding: 30px;
    color: #fff;
    box-shadow: 0 15px 40px rgba(16, 45, 75, .18);
}

.lh-total-title {
    margin: 0 0 25px;
    font-size: 22px;
    font-weight: 600;
}

.lh-total-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 22px;
    border-bottom: 1px solid rgba(255,255,255,.16);
}

.lh-total-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    font-size: 14px;
    line-height: 1.4;
}

.lh-total-row span:first-child {
    color: rgba(255,255,255,.72);
}

.lh-total-row span:last-child {
    white-space: nowrap;
    font-weight: 600;
}

.lh-total-before {
    margin-top: 22px;
}

.lh-total-before-label {
    font-size: 13px;
    color: rgba(255,255,255,.62);
}

.lh-total-before-price {
    margin-top: 5px;
    font-size: 20px;
    font-weight: 600;
    text-decoration: line-through;
    color: rgba(255,255,255,.6);
}

/* Скидка */

.lh-discount {
    margin-top: 20px;
    padding: 14px 16px;
    border-radius: 10px;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.12);
}

.lh-discount-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.lh-discount-label {
    font-size: 14px;
    color: rgba(255,255,255,.78);
}

.lh-discount-value {
    padding: 5px 9px;
    border-radius: 6px;
    background: #fff;
    color: var(--lh-blue-dark);
    font-size: 13px;
    font-weight: 700;
}

/* Финальная цена */

.lh-final {
    margin-top: 25px;
}

.lh-final-label {
    margin-bottom: 5px;
    font-size: 13px;
    color: rgba(255,255,255,.68);
}

.lh-final-price {
    font-size: 36px;
    line-height: 1.1;
    font-weight: 700;
    color: #fff;
}

.lh-final-note {
    margin-top: 8px;
    font-size: 12px;
    line-height: 1.45;
    color: rgba(255,255,255,.6);
}

/* Кнопка */

.lh-calc-button {
    width: 100%;
    min-height: 56px;
    margin-top: 25px;
    border: 0;
    border-radius: 10px;
    background: #fff;
    color: var(--lh-blue-dark);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

.lh-calc-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(0,0,0,.15);
}

.lh-calc-button:active {
    transform: translateY(0);
}

/* Подпись */

.lh-calc-under-button {
    margin: 13px 0 0;
    text-align: center;
    font-size: 11px;
    line-height: 1.4;
    color: rgba(255,255,255,.55);
}

/* Сообщение */

.lh-calc-message {
    display: none;
    margin-top: 18px;
    padding: 13px 15px;
    border-radius: 9px;
    font-size: 13px;
    line-height: 1.45;
}

.lh-calc-message.is-visible {
    display: block;
}

.lh-calc-message.success {
    background: rgba(255,255,255,.1);
    color: #fff;
}

/* Адаптив */

@media (max-width: 900px) {
    .lh-calc-grid {
        grid-template-columns: 1fr;
    }

    .lh-total-card {
        position: static;
    }
}

@media (max-width: 620px) {
    .lh-calc-wrapper {
        padding: 35px 15px;
    }

    .lh-calc-title {
        font-size: 28px;
    }

    .lh-calc-subtitle {
        font-size: 15px;
    }

    .lh-calc-card,
    .lh-total-card {
        padding: 22px;
        border-radius: 14px;
    }

    .lh-area-row {
        gap: 12px;
    }

    .lh-area-input {
        width: 130px;
    }

    .lh-stage-label {
        align-items: flex-start;
    }

    .lh-stage-price {
        font-size: 13px;
    }

    .lh-final-price {
        font-size: 30px;
    }
}