/* Section 1 */
.c-calculator-small {
    background:var(--powder);
    padding-block:var(--space-l-2xl);
}
.c-calculator-small__heading {
    margin-inline:auto;
    text-align: center;
    color:var(--pine);
}
.calculator {
  margin-block:var(--space-l);
  display:grid;
}
.c-calculator-small__inputs {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding:var(--space-l-xl);
}

@media(min-width:992px) {
  .calculator {
    grid-template-columns:50% 50%;
  }
}

.c-calculator-small__results {
  width:100%;
  display:flex;
  flex-direction: column;
  align-items: center;
}

.c-calculator-small__input-connected {
  display:grid;
  grid-template-columns:2fr 1fr;
  grid-gap:var(--space-2xs);
}
.c-calculator-small__inputs label {
  padding-block:var(--space-2xs) var(--space-3xs);
  font-weight:600;
  color:var(--black);
}
.c-calculator-small__inputs select {
  width:100%
}
.c-calculator-small__inputs input[type=range] {
  grid-column: span 2;
  filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
  cursor:pointer;
  accent-color:var(--corporategreen);
}
.c-calculator-small__inputs input[type=tel],
.c-calculator-small__inputs input[type=text],
.c-calculator-small__inputs input[type=range] {
  width:100%
}
.c-calculator-small__inputs input[type=tel],
.c-calculator-small__inputs input[type=text],
.c-calculator-small__inputs select {
  background:var(--white);
  color:var(--pine);
  height:45px;
  max-width:100%;
  border:2px solid var(--corporategreen);
  margin-block-end:var(--space-2xs);
  border-radius: .5em;
  padding-inline:var(--space-2xs);
  filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
}

.c-calculator-small__disclaimer {
  font-style: italic;
  font-weight:500;
  font-size:var(--step--2);
  width:100%;
}

/* Small styling */
.c-calculator-small__monthly {
  width:100%;
  background:var(--white);
  text-align:center;
  border:2px solid var(--corporategreen);
  border-radius:1.5em;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-grow:1;
}
.c-calculator-small-monthly__inner {
  text-align: center;
  align-self: center;
  padding:var(--space-m);
}

.c-calculator-small__heading, .c-calculator-small__description {
  text-align: center;
  max-width: min(var(--wrapper-max-width-xs), 100%);
  margin-inline:auto;
}