.textlink {
  color: currentColor;
  letter-spacing: -.0352rem;
  align-items: center;
  gap: .5rem;
  font: 400 1.6rem/150% Inter, sans-serif;
  text-decoration: none;
  display: flex;
}
.pfeil { font-size: 1.5rem; display: inline; position: relative; }

.zeigefigur { white-space: nowrap; position: relative; }
.zeigefigur__bild {
  height: .92em;
  width: auto;
  max-width: none;
  display: block;
  position: absolute;
  left: -.46em;
  bottom: -.1em;
  pointer-events: none;
}

.unzerbrechlich { white-space: nowrap; }
.aufkleber { display: inline-block; line-height: 0; }
.aufkleber__bild {
  height: 1.5em;
  width: auto;
  max-width: 100%;
  display: inline-block;
  vertical-align: -.36em;
}

.knopf {
  -webkit-user-select: none;
  user-select: none;
  white-space: nowrap;
  appearance: none;
  text-transform: uppercase;
  letter-spacing: .08rem;
  background: none;
  border: none;
  font: 600 1.8rem/1 Inter, sans-serif;
  text-decoration: none;
  position: relative;
}
.knopf__innen {
  will-change: transform;
  pointer-events: none;
  width: 100%;
  transition: transform var(--dauer-3) var(--kurve-ueberschwung),
              color var(--dauer-3) var(--kurve-weich),
              border-color var(--dauer-3) var(--kurve-weich);
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}
.knopf:not(:disabled):not([aria-disabled="true"]) { cursor: pointer; }
@media (hover: hover) {
  .knopf:not(:disabled):not([aria-disabled="true"]):hover .knopf__innen {
    transition: transform var(--dauer-6) var(--kurve-ueberschwung),
                color var(--dauer-3) var(--kurve-weich);
    transform: scale(1.05);
  }
}
.knopf:not(:disabled):not([aria-disabled="true"]):active .knopf__innen {
  transition: transform var(--dauer-blitz) linear,
              color var(--dauer-3) var(--kurve-weich);
  transform: scale(.9) !important;
}
.knopf svg { fill: currentColor; margin-left: 16px; }

.knopf--akzent            { color: var(--farbe-tinte); }
.knopf--akzent .knopf__innen { background-color: var(--farbe-akzent); }
.knopf--schwarz            { color: var(--farbe-weiss); }
.knopf--schwarz .knopf__innen { background-color: var(--farbe-tinte); }
.knopf--weiss              { color: var(--farbe-tinte); }
.knopf--weiss .knopf__innen   { background-color: var(--farbe-weiss); }
.knopf--grau               { color: var(--farbe-tinte); }
.knopf--grau .knopf__innen    { background-color: var(--farbe-flaeche); }
.knopf--gelb               { color: var(--farbe-tinte); }
.knopf--gelb .knopf__innen    { background-color: var(--farbe-gelb); }
.knopf--blau               { color: var(--farbe-weiss); }
.knopf--blau .knopf__innen    { background-color: var(--farbe-akzent-tief); background-image: var(--verlauf-cta); }
.knopf--dunkelgrau         { color: var(--farbe-weiss); }
.knopf--dunkelgrau .knopf__innen { background-color: var(--farbe-grau-dunkel); }
.knopf--orange             { color: var(--farbe-tinte); }
.knopf--orange .knopf__innen  { background-color: var(--farbe-orange); }

.knopf--umriss.knopf--akzent  { color: var(--farbe-akzent); }
.knopf--umriss.knopf--akzent .knopf__innen { background-color: var(--farbe-klar); border: 2px solid var(--farbe-akzent); }
.knopf--umriss.knopf--schwarz  { color: var(--farbe-tinte); }
.knopf--umriss.knopf--schwarz .knopf__innen { background-color: var(--farbe-klar); border: 2px solid var(--farbe-tinte); }
.knopf--umriss.knopf--weiss    { color: var(--farbe-weiss); }
.knopf--umriss.knopf--weiss .knopf__innen   { border: 2px solid var(--farbe-weiss); background-color: var(--farbe-klar) !important; }

.knopf--klein .knopf__innen {
  border-radius: 0;
  height: 5.2rem;
  padding: .8rem 5rem;
}
.knopf--mittel {
  letter-spacing: .09rem;
  font: 600 2rem/138% Inter, sans-serif;
}
.knopf--mittel .knopf__innen {
  border-radius: 0;
  height: 6rem;
  padding: .8rem 5rem;
}
.knopf--gross {
  text-align: center;
  letter-spacing: .1rem;
  width: 100%;
  max-width: 35rem;
  height: auto;
  font-size: 2rem;
  font-weight: 600;
  line-height: 100%;
  display: inline-flex;
}
.knopf--gross .knopf__innen { border-radius: 0; }
@media screen and (width <= 1024px) { .knopf--gross .knopf__innen { height: 6rem; padding: .8rem 5rem; } }
@media screen and (width >= 1025px) {
  .knopf--gross { width: auto; max-width: none; font-size: 2.4rem; }
  .knopf--gross .knopf__innen { border-radius: 0; padding: 4rem 7rem; }
}
@media screen and (width >= 1441px) {
  .knopf--gross { letter-spacing: .1rem; font-size: 2.18rem; }
  .knopf--gross .knopf__innen { padding: 4.4rem 8rem; }
}
@media screen and (width >= 1729px) {
  .knopf--gross { letter-spacing: .11rem; font-size: 2.52rem; }
  .knopf--gross .knopf__innen { padding: 5rem 9rem; }
}

.pille {
  letter-spacing: .09rem;
  text-transform: uppercase;
  z-index: 1;
  border-radius: 0;
  align-items: center;
  padding: .6rem 2.1rem .4rem;
  font: 600 1.8rem/133.333% Inter, sans-serif;
  display: inline-flex;
  position: relative;
}
.pille::before {
  content: "";
  border-radius: inherit;
  z-index: -1;
  background-color: var(--farbe-flaeche);
  width: 100%; height: 100%;
  transition: all var(--dauer-3) var(--kurve-weich);
  position: absolute;
  top: 0; left: 0;
}
@media screen and (width >= 1025px) { .pille { letter-spacing: -.04rem; font: 600 2rem/120% Inter, sans-serif; padding: .5rem 2rem; } }
@media screen and (width >= 1441px) { .pille { padding: .6rem 2.1rem; } }

.pille--grau::before    { background-color: var(--farbe-flaeche); }
.pille--weiss::before   { background-color: var(--farbe-weiss); }
.pille--akzent::before { background-color: var(--farbe-akzent-pille); }
.pille--gelb::before    { background-color: var(--farbe-gelb); }

.pille--m { letter-spacing: -.036rem; font: 600 1.8rem/133.333% Inter, sans-serif; }
@media screen and (width >= 1025px) { .pille--m { letter-spacing: -.04rem; font: 600 2rem/120% Inter, sans-serif; } }

.pille--s {
  letter-spacing: -.032rem;
  min-height: 3.5rem;
  padding: .55rem 2.1rem;
  font: 400 1.5rem/1.2 Inter, sans-serif;
}
.pille--s b, .pille--s strong { font-weight: 600; }

.mobilbild {
  margin: 0 0 4rem;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--farbe-flaeche);
  box-shadow: var(--schatten-leicht);
}
.mobilbild img { width: 100%; height: 100%; object-fit: cover; object-position: var(--fokus, 50% 40%); display: block; }
.mobilbild--oben  { --fokus: 50% 28%; }
.mobilbild--mitte { --fokus: 50% 45%; }
.mobilbild--unten { --fokus: 50% 62%; }

.medium,
.teamkarte__medium,
.personblock__bild,
.schuldblock__bild,
.galerie__bild { box-shadow: var(--schatten-leicht); }

.siegel-google {
  display: inline-flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.2rem 2.2rem 1.2rem 1.8rem;
  background: var(--farbe-weiss);
  box-shadow: var(--schatten-leicht);
  color: var(--farbe-tinte);
}
.siegel-google__g { flex: none; width: 4.4rem; height: 4.4rem; }
.siegel-google__g svg { width: 100%; height: 100%; display: block; }
.siegel-google__text { display: flex; flex-direction: column; gap: .3rem; }
.siegel-google__titel { letter-spacing: -.02rem; font: 500 1.5rem/1.2 Inter, sans-serif; }
.siegel-google__wert { display: flex; align-items: center; gap: .8rem; color: var(--farbe-stern); font: 700 2.2rem/1 Inter, sans-serif; }
.siegel-google__sterne { display: inline-flex; gap: .2rem; }
.siegel-google__sterne svg { width: 1.8rem; height: 1.8rem; fill: currentColor; display: block; }
.pille--s a, .pille--s .schein-link {
  color: var(--farbe-akzent-tief);
  margin-left: .5rem;
  font-weight: 600;
  transition: color var(--dauer-3) var(--kurve-weich);
  display: inline-block;
}
@media screen and (width >= 1025px) { .pille--s { padding: .7rem 2rem; } }
@media screen and (width >= 1441px) { .pille--s { padding: 1rem 2.1rem; } }
@media screen and (width >= 1729px) { .pille--s { padding: .9rem 2.1rem; } }
@media (hover: hover) { a.pille:hover::before { opacity: .7; } }

.medium          { background-color: var(--farbe-flaeche); display: block; }
.medium--klar    { background-color: var(--farbe-klar); }
.medium__flaeche { width: 100%; height: 100%; display: block; position: relative; }
.bildflaeche  { width: 100%; height: 100%; display: block; position: relative;
                background-color: var(--farbe-linie); }
.videoflaeche { height: 100%; line-height: 0; display: block;
                background-color: var(--farbe-linie); }
.videoflaeche--gefuellt { background-color: var(--farbe-weiss); overflow: hidden; }
.videoflaeche--gefuellt picture { display: block; width: 100%; height: 100%; }
.videoflaeche--gefuellt img { width: 100%; height: 100%; object-fit: cover; display: block; }
.portalbild--popup { object-position: 50% 0; transform: scale(1.14); transform-origin: 50% 81%; }
.videoflaeche--gefuellt video { width: 100%; height: 100%; object-fit: cover;
                                display: block; background-color: var(--farbe-weiss); }
.videoflaeche--spot { aspect-ratio: 16 / 9; }

.wortgrafik { display: inline-block; position: relative; }
.wortgrafik > span:first-of-type { opacity: 0; }
.wortgrafik > span:nth-of-type(2) {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--wortgrafik-breite, 116%);
  transform: translate(-50%, -50%);
  justify-content: center;
  align-items: center;
  display: flex;
}
.wortgrafik__bild { width: 100%; height: auto; display: block; }
.wortgrafik--breit > span:nth-of-type(2) { width: 104%; }
@media screen and (width <= 430px) {
  .wortgrafik--breit { max-width: calc(100% - .32em); overflow: hidden; }
  .wortgrafik--breit > span:nth-of-type(2) { width: 100%; }
}