.tariff-section { margin-block: 1rem 2rem; }
.tariff-calculator { border-block: 1px solid var(--line, #ccd8d2); scroll-margin-top: 6rem; }
.tariff-calculator > summary { cursor: pointer; padding: 1rem .25rem; font-weight: 700; font-size: 1.1rem; }
.tariff-body { padding: .5rem 0 1.5rem; }
.tariff-body > p { max-width: 78ch; line-height: 1.65; }
.tariff-body label { display: grid; gap: .35rem; font-size: .93rem; line-height: 1.4; }
.tariff-period { max-width: 23rem; margin-block: 1.25rem; }
.tariff-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin-block: 1.5rem; }
.tariff-plans fieldset { display: grid; gap: .9rem; margin: 0; min-width: 0; padding: 1rem; border: 1px solid var(--line, #ccd8d2); border-radius: .5rem; }
.tariff-plans legend { padding-inline: .4rem; font-size: 1.2rem; font-weight: 700; }
.tariff-body input { box-sizing: border-box; width: 100%; min-width: 0; min-height: 44px; padding: .65rem; border: 1px solid #647a6e; border-radius: .3rem; background: #fff; color: #14261e; font: inherit; }
.tariff-controls { display: flex; flex-wrap: wrap; gap: .75rem; }
.tariff-controls button { padding: .75rem 1rem; min-height: 48px; border: 1px solid #145443; border-radius: .35rem; background: #145443; color: #fff; font: inherit; font-weight: 650; cursor: pointer; }
.tariff-controls button + button { background: transparent; color: #145443; }
.tariff-result { margin-top: 1rem; padding: .5rem 1rem; border-inline-start: 4px solid #145443; background: #edf5f0; color: #14261e; }
.tariff-result p { line-height: 1.65; }
.tariff-calculator :is(summary, input, button):focus-visible { outline: 3px solid #145443; outline-offset: 3px; }
.tariff-calculator [hidden] { display: none !important; }
@media (max-width: 650px) { .tariff-plans { grid-template-columns: minmax(0, 1fr); gap: 1rem; } .tariff-controls button { flex: 1 1 15rem; } }
.tariff-calculator :is(summary, input, button) { scroll-margin-block: 10rem 3rem; }