/* Colors
-------------------------------------------------- */
/* Components
-------------------------------------------------- */
/* Mixins 
-------------------------------------------------- */
/* Font
-------------------------------------------------- */
/* Grid
-------------------------------------------------- */
/* Responsive
-------------------------------------------------- */
/* DONATE
-------------------------------------------------- */
section.donate {
  scroll-margin-top: 5em;
}
section.donate .donate__story h3.gamma {
  margin-top: 1.2em;
}
section.donate .donate__side {
  margin-top: 2.5em;
}
section.donate .beta {
  margin-bottom: 0.5em;
}
section.donate .fund-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 0.6em;
  margin: 0.6em 0 1.6em;
}
section.donate .fund {
  display: flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.7em 0.85em;
  background: #ffffff;
  border: 1px solid #c2bfb2;
  border-radius: 12px;
  font-size: 0.9em;
  font-weight: 400;
}
section.donate .fund__e {
  font-size: 1.3em;
  line-height: 1;
  flex: none;
}
section.donate .rechner {
  background: #b4e0e3;
  color: #25253f;
  border-radius: 24px 24px 24px 6px;
  padding: 1.1em 1.3em;
}
section.donate .rechner .rechner__big {
  font-family: "Pompiere", sans-serif;
  font-size: 2em;
  line-height: 1;
  color: #25253f;
}
section.donate .rechner p {
  margin: 0.4em 0 0;
  font-size: 0.9em;
}
section.donate .steps {
  display: flex;
  justify-content: center;
  margin-bottom: 1.4em;
}
section.donate .step {
  width: 148px;
  height: 148px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0.7em;
  margin: 0 -10px;
  box-shadow: 0 6px 16px rgba(37, 37, 63, 0.12);
  color: #25253f;
}
section.donate .step--1 {
  background: rgba(233, 91, 48, 0.8);
  z-index: 1;
}
section.donate .step--2 {
  background: rgba(194, 206, 42, 0.8);
  z-index: 3;
  transform: translateY(-8px);
}
section.donate .step--3 {
  background: rgba(13, 140, 140, 0.8);
  z-index: 2;
}
section.donate .step .step__n {
  font-family: "Pompiere", sans-serif;
  font-size: 2.4em;
  color: #ffffff;
  line-height: 0.8;
}
section.donate .step .step__t {
  font-weight: 700;
  font-size: 0.8em;
  margin-top: 0.2em;
}
section.donate .step .step__s {
  font-size: 0.8em;
  opacity: 1;
  font-weight: 400;
  margin-top: 0.1em;
  line-height: 1.3;
}
section.donate .donate-card {
  scroll-margin-top: 6em;
  max-width: 560px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 10px 34px rgba(37, 37, 63, 0.12);
  padding: 1.5em 1.4em;
}
section.donate .donate-card__pill {
  display: inline-block;
  background: #b4e0e3;
  color: #066974;
  font-family: "Pompiere", sans-serif;
  font-size: 1.1em;
  padding: 0.25em 0.9em;
  border-radius: 100px;
  margin-bottom: 0.6em;
}
section.donate .donate-card h2.gamma {
  padding-bottom: 0;
  margin-bottom: 0.15em;
}
section.donate .donate-card__sub {
  font-size: 0.85em;
  color: #066974;
  margin-bottom: 1.2em;
}
section.donate .freq {
  display: flex;
  gap: 0.5em;
  margin-bottom: 0.9em;
}
section.donate .freq__btn {
  flex: 1;
  border: 2px solid #c2bfb2;
  background: #ffffff;
  border-radius: 12px;
  padding: 0.7em;
  font-family: "Arvo", serif;
  font-weight: 700;
  font-size: 0.85em;
  color: #066974;
  cursor: pointer;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
section.donate .freq__btn.is-active {
  border-color: #0d8c8c;
  background: #e8f09a;
}
section.donate .amounts {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.55em;
  margin-bottom: 0.9em;
}
section.donate .amount {
  position: relative;
  border: 2px solid #c2bfb2;
  background: #ffffff;
  border-radius: 14px;
  padding: 0.9em 0.3em;
  text-align: center;
  cursor: pointer;
  font-weight: 700;
  font-size: 1.1em;
  color: #25253f;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
section.donate .amount small {
  display: block;
  font-size: 0.5em;
  font-weight: 400;
  color: #066974;
  margin-top: 0.3em;
}
section.donate .amount:hover {
  border-color: #0d8c8c;
}
section.donate .amount.is-active {
  border-color: #0d8c8c;
  background: #e8f09a;
}
section.donate .amount--pop::after {
  content: "beliebt";
  position: absolute;
  top: -9px;
  left: 50%;
  transform: translateX(-50%);
  background: #e95b30;
  color: #ffffff;
  font-size: 0.5em;
  font-weight: 700;
  padding: 0.25em 0.7em;
  border-radius: 100px;
}
section.donate .donate-form__label {
  display: block;
  font-size: 0.7em;
  font-weight: 700;
  color: #066974;
  margin: 0.9em 0 0.3em;
}
section.donate .donate-form__in {
  width: 100%;
  border: 1.5px solid #c2bfb2;
  border-radius: 12px;
  padding: 0.7em 0.8em;
  font-family: "Arvo", serif;
  font-size: 0.85em;
  color: #25253f;
  background: #ffffff;
  -webkit-transition: border 0.5s ease-out;
  -moz-transition: border 0.5s ease-out;
  -o-transition: border 0.5s ease-out;
  transition: border 0.5s ease-out;
}
section.donate .donate-form__in:focus {
  outline: none;
  border-color: #0d8c8c;
}
section.donate .donate-form__consent {
  display: flex;
  gap: 0.5em;
  align-items: flex-start;
  margin: 1em 0 0.2em;
  font-size: 0.65em;
  color: #066974;
  line-height: 1.4;
}
section.donate .donate-form__consent input {
  margin-top: 0.2em;
}
section.donate .donate-form__cta {
  display: block;
  width: 100%;
  margin-top: 1em;
  padding: 0.9em;
  background-color: #e95b30;
  font-size: 1em;
  text-align: center;
  cursor: pointer;
}
section.donate .donate-form__cta:hover {
  background-color: #0d8c8c;
}
section.donate .donate-form__secure {
  text-align: center;
  font-size: 0.6em;
  color: #066974;
  margin-top: 0.8em;
}

section.donate-alt > .grid {
  overflow: visible;
  padding-bottom: 1em;
}
section.donate-alt .donate-alt__head {
  margin-bottom: 1.5em;
}
section.donate-alt .donate-alt__head .beta {
  margin-bottom: 0.4em;
}
section.donate-alt .donate-alt__head .text {
  font-size: 1.1em;
}
.alt-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}
.alt-card {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 10px 34px rgba(37, 37, 63, 0.12);
  padding: 1.6em 1.5em;
}
.alt-card h3.gamma {
  margin-bottom: 0.3em;
}
.alt-card .alt-card__text {
  font-size: 0.95em;
  margin-bottom: 1.2em;
}
.alt-card .alt-card__text p {
  margin: 0;
}
.alt-card .button {
  align-self: flex-start;
  margin-top: auto;
}
.iban-details {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.4em 1.2em;
  margin-top: auto;
  font-size: 0.95em;
}
.iban-details dt {
  font-family: "Arvo", serif;
  font-weight: 700;
  color: #066974;
}
.iban-details dd {
  margin: 0;
  color: #25253f;
}
.iban-details .iban-details__num {
  font-weight: 700;
  letter-spacing: 0.03em;
}

@media (max-width: 750px) {
  section.donate .fund-grid {
    grid-template-columns: 1fr;
  }
  section.donate .donate__side {
    margin-top: 2em;
  }
  .alt-grid {
    grid-template-columns: 1fr;
  }
}
.intro__actions .donate-qr {
  margin: 1.4em 0 0;
  display: flex;
  align-items: center;
  gap: 1em;
}
.intro__actions .donate-qr img {
  display: block;
  width: 150px;
  height: auto;
  border-radius: 14px;
  flex-shrink: 0;
}
.intro__actions .donate-qr figcaption {
  margin: 0;
  max-width: 12em;
  font-size: 1.05em;
  color: #066974;
}
.alt-card__qr {
  margin: 1.1em 0 0;
}
.alt-card__qr img {
  display: block;
  width: 150px;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
.alt-card__qr figcaption {
  margin-top: 0.5em;
  font-size: 0.9em;
  color: #066974;
}