.sos-calculator {
    --sos-green: #315c38;
    --sos-light: #eef5ea;
    --sos-border: #c9d5c6;
    max-width: 720px;
    margin: 24px auto;
    padding: 28px;
    border: 1px solid var(--sos-border);
    border-radius: 14px;
    background: #fff;
    color: #202820;
    box-shadow: 0 8px 24px rgba(22, 48, 27, 0.10);
    font-family: inherit;
}

.sos-calculator * { box-sizing: border-box; }
.sos-calculator h2 { margin: 0 0 22px; color: var(--sos-green); }
.sos-calculator h3 { margin: 0 0 12px; }
.sos-brand { margin-bottom: 3px; font-weight: 700; letter-spacing: .03em; }

.sos-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.sos-field { display: flex; flex-direction: column; gap: 7px; font-weight: 700; }
.sos-field-wide { grid-column: 1 / -1; }
.sos-field small { color: #596359; font-size: .88rem; font-weight: 400; }
.sos-input-row { display: flex; align-items: stretch; }

.sos-calculator input,
.sos-calculator select {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid #9eaa9c;
    border-radius: 7px;
    background: #fff;
    color: #202820;
    font: inherit;
}

.sos-input-row input { border-radius: 7px 0 0 7px; }
.sos-input-row select { width: 82px; border-left: 0; border-radius: 0 7px 7px 0; }
.sos-suffix { min-width: 46px; padding: 11px; border: 1px solid #9eaa9c; border-left: 0; border-radius: 0 7px 7px 0; text-align: center; }

.sos-comparison { margin-top: 24px; padding: 18px; border-radius: 10px; background: var(--sos-light); font-size: 1rem; }
.sos-comparison > div { display: flex; justify-content: space-between; gap: 16px; padding: 7px 0; font-size: 1rem; line-height: 1.5; }
.sos-comparison > div span,
.sos-comparison > div strong { font-size: 1rem; }

.sos-result { margin-top: 22px; text-align: center; }
.sos-score { color: var(--sos-green); font-size: 2rem; }
.sos-score strong { font-size: 3.2rem; line-height: 1; }
.sos-result h3 { margin-top: 8px; }
.sos-solar-result { margin: 14px 0 0; padding: 12px; border-left: 4px solid var(--sos-green); background: var(--sos-light); text-align: left; }
.sos-method { margin: 20px 0 0; color: #596359; font-size: .92rem; font-style: italic; }

@media (max-width: 600px) {
    .sos-calculator { padding: 20px; }
    .sos-fields { grid-template-columns: 1fr; }
    .sos-field-wide { grid-column: auto; }
}