/* ===== Buttons: »Was sich bewegen lässt, ist rund« ===== */
.btn {
  display: inline-flex; align-items: center; gap: 12px;
  min-height: 56px; padding: 6px 24px 6px 6px; border-radius: 999px; border: 0;
  background: var(--tarjan); color: var(--gummi); text-decoration: none; cursor: pointer;
  font-weight: 650; font-stretch: 110%; font-size: 1.0625rem; line-height: 1.1;
  transition: background var(--t-ui) var(--roll), color var(--t-ui) var(--roll), transform var(--t-ui) var(--roll);
}
.btn__ventil {
  flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--gummi); color: var(--tarjan);
  transition: transform 400ms var(--roll), background var(--t-ui) var(--roll);
}
.btn__ventil svg { width: 20px; height: 20px; }
.btn:hover { background: var(--tarjan-hell); color: var(--gummi); }
.btn:hover .btn__ventil { transform: rotate(90deg); }
.btn--tel:hover .btn__ventil { transform: none; }
.btn--tel:hover .btn__ventil svg { animation: klingeln 500ms var(--roll); }
.btn:active { transform: scale(.98); }
.btn--schlicht { padding: 6px 26px; }
.btn--sek { background: transparent; color: inherit; box-shadow: inset 0 0 0 1.5px currentColor; }
.btn--sek .btn__ventil { background: var(--gummi-3); }
.btn--sek:hover { background: var(--kreide); color: var(--gummi); }
.hell .btn--sek .btn__ventil, .sek--beton .btn--sek .btn__ventil, .sek--kreide .btn--sek .btn__ventil { background: var(--gummi); }
.sek--beton .btn--sek:hover, .sek--kreide .btn--sek:hover { background: var(--gummi); color: var(--kreide); }

.tel-chip {
  display: inline-flex; align-items: center; gap: 12px;
  min-height: 56px; padding: 6px 22px 6px 8px; border-radius: 999px;
  color: inherit; text-decoration: none; font-weight: 500; font-size: 1.0625rem; font-variant-numeric: tabular-nums;
  box-shadow: inset 0 0 0 1.5px var(--stahl);
  transition: background var(--t-ui) var(--roll), color var(--t-ui) var(--roll);
}
.tel-chip__code {
  font-family: var(--mono); font-size: .75rem; font-weight: 500; letter-spacing: .06em;
  background: var(--gummi-3); color: var(--tarjan); border-radius: 999px; padding: 9px 12px; line-height: 1;
}
.tel-chip:hover { background: var(--kreide); color: var(--gummi); }
.tel-chip:hover .tel-chip__code { background: var(--gummi); }
.sek--beton .tel-chip, .sek--kreide .tel-chip { box-shadow: inset 0 0 0 1.5px var(--grafit); }
.sek--beton .tel-chip__code, .sek--kreide .tel-chip__code { background: var(--gummi); }

.header-tel {
  align-items: center; gap: 8px; min-height: 44px; padding: 0 18px 0 14px; border-radius: 999px;
  background: var(--tarjan); color: var(--gummi); text-decoration: none;
  font-weight: 650; font-stretch: 105%; font-size: .9375rem; font-variant-numeric: tabular-nums; white-space: nowrap;
  transition: background var(--t-ui) var(--roll);
}
.header-tel svg { width: 18px; height: 18px; }
.header-tel:hover { background: var(--tarjan-hell); color: var(--gummi); }
.header-tel:hover svg { animation: klingeln 500ms var(--roll); }

.link-pfeil {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
  font-weight: 650; font-stretch: 105%; color: inherit; text-decoration: none;
  border-bottom: 1.5px solid currentColor;
}
.link-pfeil svg { width: 20px; height: 20px; transition: transform var(--t-ui) var(--roll); }
.link-pfeil:hover { color: inherit; }
.link-pfeil:hover svg { transform: translateX(5px); }
.link-pfeil--runter:hover svg { transform: translateY(4px); }

/* ===== Status-Chip (Messwert) ===== */
.status {
  display: inline-flex; align-items: center; gap: 10px; min-height: 36px; padding: 6px 16px;
  border: 1px solid var(--gummi-3); border-radius: 999px; max-width: none; width: fit-content; justify-self: start;
  font-family: var(--mono); font-size: .75rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; line-height: 1.3;
}
.status__punkt { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--grafit); }
.status[data-zustand="offen"] .status__punkt { background: var(--tarjan); animation: puls 2.4s ease-out infinite; }
.status--hell { border-color: var(--linie); }

/* ===== Leistungszeilen 01–04 ===== */
.zeilen { list-style: none; padding: 0; border-top: 1px solid var(--linie); }
.zeile {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--s-8) clamp(16px, 3vw, 40px); align-items: center;
  padding: clamp(20px, 3vw, 32px) clamp(8px, 2vw, 24px);
  border-bottom: 1px solid var(--linie); color: var(--gummi); text-decoration: none;
  transition: background var(--t-ui) var(--roll), color var(--t-ui) var(--roll);
}
.zeile__nr {
  font-size: clamp(2.4rem, 6vw, 4.6rem); font-weight: 800; font-stretch: 125%; line-height: .85; min-width: 1.35em;
  color: transparent; -webkit-text-stroke: 1.5px var(--grafit); font-variant-numeric: tabular-nums;
  transition: color var(--t-ui) var(--roll), -webkit-text-stroke-color var(--t-ui) var(--roll);
}
.zeile__titel { display: flex; align-items: center; gap: 12px; font-size: var(--fs-h3); }
.zeile__icon { flex: 0 0 auto; width: 28px; height: 28px; color: var(--tarjan-tief); transition: transform 400ms var(--roll), color var(--t-ui) var(--roll); }
.zeile__info { display: block; margin-top: 6px; color: var(--grafit); font-size: var(--fs-klein); max-width: 60ch; transition: color var(--t-ui) var(--roll); }
.zeile__pfeil svg { width: 28px; height: 28px; transition: transform var(--t-ui) var(--roll); }
.zeile:hover, .zeile:focus-visible { background: var(--gummi); color: var(--kreide); }
.zeile:hover .zeile__nr, .zeile:focus-visible .zeile__nr { color: var(--tarjan); -webkit-text-stroke-color: var(--tarjan); }
.zeile:hover .zeile__info, .zeile:focus-visible .zeile__info { color: var(--stahl); }
.zeile:hover .zeile__icon, .zeile:focus-visible .zeile__icon { color: var(--tarjan); transform: rotate(90deg); }
.zeile:hover .zeile__pfeil svg, .zeile:focus-visible .zeile__pfeil svg { transform: translateX(6px); }
.dunkel .zeilen, .sek--gummi .zeilen { border-color: var(--gummi-3); }
.dunkel .zeile, .sek--gummi .zeile { color: var(--kreide); border-color: var(--gummi-3); }
.dunkel .zeile__info, .sek--gummi .zeile__info { color: var(--stahl); }
.dunkel .zeile__icon, .sek--gummi .zeile__icon { color: var(--tarjan); }
.dunkel .zeile:hover, .sek--gummi .zeile:hover { background: var(--gummi-2); }
@media (max-width: 639px) {
  .zeile { grid-template-columns: auto minmax(0, 1fr); }
  .zeile__pfeil { display: none; }
}

/* ===== TWI-Liste ===== */
.twi { list-style: none; padding: 0; display: grid; gap: 8px; }
.twi li { position: relative; padding-left: 22px; }
.twi li::before {
  content: ""; position: absolute; left: 0; top: .5em; width: 10px; height: 9px;
  background: var(--tarjan-tief); clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.dunkel .twi li::before, .sek--gummi .twi li::before, .preis--hervor .twi li::before { background: var(--tarjan); }

/* ===== Preistafel (Werkstatt-Aushang statt Pricing-Karten) ===== */
.preistafel { background: var(--gummi); color: var(--kreide); align-self: start; }
.preistafel__spur { height: 20px; background-color: var(--gummi); background-image: var(--spur-gruen); background-repeat: repeat-x; background-size: 26px 20px; }
.preistafel__kopf { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; padding: 18px clamp(20px, 3vw, 32px); border-bottom: 1px solid var(--gummi-3); color: var(--stahl); }
.preistafel .preistafel__liste { list-style: none; margin: 0; padding: 0 clamp(20px, 3vw, 32px); }
.preiszeile { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 24px; align-items: end; padding: 22px 0; border-bottom: 1px solid var(--gummi-3); }
.preiszeile:last-child { border-bottom: 0; }
.preiszeile h3 { font-size: clamp(1.1rem, 1.6vw, 1.3rem); }
.preiszeile p { margin-top: 4px; font-size: var(--fs-klein); color: var(--stahl); }
.preiszeile__preis { display: grid; justify-items: end; gap: 4px; margin: 0; text-align: right; }
.preiszeile__betrag { font-size: clamp(2rem, 3.4vw, 2.9rem); font-weight: 800; font-stretch: 125%; line-height: 1; color: var(--tarjan); font-variant-numeric: tabular-nums; white-space: nowrap; }
.preiszeile__einheit { color: var(--stahl); white-space: nowrap; }

/* ===== Aktion ===== */
.aktionen { display: grid; gap: var(--s-16); }
.aktion { display: grid; gap: 6px; background: var(--kreide); border: 1px solid var(--linie); border-top: 4px solid var(--tarjan); padding: var(--s-24); }
.aktion__dim { font-size: 2rem; font-weight: 800; font-stretch: 125%; line-height: 1; font-variant-numeric: tabular-nums; }
.aktion__preis { margin-top: var(--s-12); font-size: 2.6rem; font-weight: 800; font-stretch: 125%; line-height: 1; color: var(--tarjan-tief); }
.aktion__preis small { font-family: var(--mono); font-size: .75rem; font-weight: 500; font-stretch: 100%; letter-spacing: .05em; text-transform: uppercase; color: var(--grafit); margin-left: 8px; }
@media (min-width: 640px) { .aktionen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ===== Fakten ===== */
.fakten { display: grid; gap: var(--s-32) var(--s-24); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fakt { display: grid; gap: 10px; align-content: start; border-top: 1px solid var(--gummi-3); padding-top: var(--s-24); }
.fakt__zahl { display: block; overflow: hidden; padding-bottom: .06em; white-space: nowrap; font-size: clamp(2rem, 3.6vw, 3.2rem); font-weight: 800; font-stretch: 125%; line-height: 1; color: var(--tarjan); font-variant-numeric: tabular-nums; }
.fakt__zahl > span { display: inline-block; }
.fakt__einheit { color: var(--stahl); }
.fakt p { font-size: var(--fs-klein); color: var(--kreide); }
.fakten--hell .fakt { border-top-color: var(--linie); }
.fakten--hell .fakt__zahl { color: var(--gummi); }
.fakten--hell .fakt__einheit { color: var(--tarjan-tief); }
.fakten--hell .fakt p { color: var(--grafit); }
.partnerliste { margin: clamp(var(--s-48), 6vw, var(--s-96)) 0 0; display: grid; gap: var(--s-24); grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--linie); padding-top: var(--s-24); }
.partnerliste div { display: grid; gap: 6px; align-content: start; }
.partnerliste dt { color: var(--tarjan-tief); }
.partnerliste dd { margin: 0; font-size: var(--fs-klein); color: var(--grafit); }
@media (min-width: 960px) { .partnerliste { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 960px) { .fakten { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ===== Bild im Flankenring ===== */
.bildring { position: relative; width: min(100%, 540px); aspect-ratio: 1; margin-inline: auto; }
.bildring__ring { position: absolute; inset: 0; }
.bildring__ring svg { width: 100%; height: 100%; }
.bildring__bild { position: absolute; inset: 13.5%; border-radius: 50%; overflow: hidden; background: var(--gummi-2); }
.bildring__bild img { width: 100%; height: 100%; object-fit: cover; }

/* ===== FAQ ===== */
.faq { display: grid; gap: var(--s-12); max-width: 920px; align-content: start; }
.faq details { background: var(--kreide); border: 1px solid var(--linie); transition: border-color var(--t-ui) var(--roll); }
.sek--kreide .faq details { background: var(--weiss); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--s-16);
  min-height: 60px; padding: 16px 22px; font-size: var(--fs-h3); font-weight: 650; line-height: 1.3;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; flex: 0 0 auto; width: 16px; height: 16px;
  background: linear-gradient(var(--tarjan-tief), var(--tarjan-tief)) center / 100% 2px no-repeat,
              linear-gradient(var(--tarjan-tief), var(--tarjan-tief)) center / 2px 100% no-repeat;
  transition: transform 300ms var(--roll);
}
.faq details[open] { border-color: var(--grafit); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq__antwort { padding: 0 22px 22px; color: var(--grafit); }
.faq__antwort p + p { margin-top: 10px; }

/* ===== Formular ===== */
.formular { display: grid; gap: var(--s-24); max-width: 780px; }
.feld { display: grid; gap: 8px; }
.feld > label, .feld__label { font-family: var(--mono); font-size: .75rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.feld .optional { font-family: var(--font); letter-spacing: 0; text-transform: none; color: var(--grafit); font-weight: 400; }
.feld input, .feld select, .feld textarea {
  width: 100%; min-height: 54px; padding: 12px 14px; border: 0; border-bottom: 2px solid var(--gummi); border-radius: 0;
  background: var(--weiss); font-family: var(--font); font-size: 1.0625rem; color: var(--gummi);
  transition: box-shadow var(--t-ui) var(--roll), border-color var(--t-ui) var(--roll);
}
.feld input::placeholder, .feld textarea::placeholder { color: #8A8C8E; }
.feld select {
  appearance: none; -webkit-appearance: none; padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23121415' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center;
}
.feld textarea { min-height: 150px; resize: vertical; }
.feld input:focus, .feld select:focus, .feld textarea:focus { outline: none; box-shadow: inset 0 0 0 2px var(--tarjan-tief); border-bottom-color: var(--tarjan-tief); }
.feld__hinweis { font-size: .875rem; color: var(--grafit); }
.feld__fehler { display: none; align-items: center; gap: 8px; color: var(--signal); font-size: .9375rem; }
.feld__fehler svg { width: 16px; height: 16px; flex: 0 0 auto; }
.feld.hat-fehler input, .feld.hat-fehler select, .feld.hat-fehler textarea { border-bottom-color: var(--signal); }
.feld.hat-fehler .feld__fehler { display: flex; }
.feld--check { grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 12px; }
.feld--check input { width: 24px; height: 24px; min-height: 0; margin-top: 1px; accent-color: var(--tarjan-tief); }
.feld--check label { font-family: var(--font); font-size: .9375rem; font-weight: 400; letter-spacing: 0; text-transform: none; }
.feld--check .feld__fehler { grid-column: 2; }
.feld-reihe { display: grid; gap: var(--s-24); }
@media (min-width: 640px) { .feld-reihe { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.formular-erfolg { display: grid; gap: 12px; padding: var(--s-32); background: var(--weiss); border: 1px solid var(--linie); border-top: 4px solid var(--tarjan); max-width: 780px; }
.formular-erfolg h3 { font-size: 1.6rem; }

/* ===== Kontaktkarten ===== */
.karten { display: grid; gap: var(--s-16); }
.karte { display: grid; gap: 10px; align-content: start; background: var(--kreide); border: 1px solid var(--linie); padding: var(--s-24); }
.karte__titel { display: flex; align-items: center; gap: 10px; font-size: 1.125rem; }
.karte__titel svg { width: 22px; height: 22px; color: var(--tarjan-tief); flex: 0 0 auto; }
.karte a { font-weight: 650; }
.karte address { font-style: normal; }
@media (min-width: 640px) { .karten { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .karten { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ===== Vergleichstabelle ===== */
.vergleich-wrap { overflow-x: auto; }
.vergleich { width: 100%; min-width: 520px; border-top: 2px solid var(--gummi); font-size: var(--fs-klein); }
.vergleich th, .vergleich td { padding: 14px 12px; border-bottom: 1px solid var(--linie); text-align: left; vertical-align: top; }
.vergleich thead th { font-family: var(--mono); font-size: .75rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--grafit); }
.vergleich thead th:not(:first-child) { font-family: var(--font); font-size: 1.25rem; font-weight: 800; font-stretch: 118%; letter-spacing: 0; color: var(--gummi); }
.vergleich tbody th { font-weight: 650; width: 26%; }

/* ===== Ablauf-Schritte ===== */
.schritte { list-style: none; padding: 0; display: grid; gap: var(--s-24); counter-reset: schritt; }
.schritt { display: grid; gap: 8px; align-content: start; border-top: 2px solid currentColor; padding-top: var(--s-16); }
.schritt::before { counter-increment: schritt; content: counter(schritt, decimal-leading-zero); font-size: 2.6rem; font-weight: 800; font-stretch: 125%; line-height: 1; color: var(--tarjan-tief); }
.dunkel .schritt::before, .sek--gummi .schritt::before { color: var(--tarjan); }
.schritt p { color: var(--grafit); }
.dunkel .schritt p, .sek--gummi .schritt p { color: var(--stahl); }
@media (min-width: 960px) { .schritte { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ===== Galerie & Fotorahmen ===== */
.galerie { display: grid; gap: var(--s-16); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.galerie figure { margin: 0; display: grid; gap: 8px; }
.galerie__bild { overflow: hidden; aspect-ratio: 4 / 3; background: var(--gummi-2); }
.galerie__bild img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--roll); }
.galerie figure:hover .galerie__bild img { transform: scale(1.04); }
.galerie figcaption { color: var(--grafit); }
.fotorahmen { position: relative; aspect-ratio: 4 / 3; background: var(--gummi-2); color: var(--stahl); display: grid; place-items: center; overflow: hidden; }
.fotorahmen svg { width: 38%; height: auto; opacity: .5; }
.fotorahmen .code { position: absolute; left: 14px; bottom: 12px; right: 14px; }
@media (min-width: 960px) { .galerie { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ===== Hinweis-Chip ===== */
.chip {
  display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 14px; border-radius: 999px;
  background: var(--gummi); color: var(--kreide); font-family: var(--mono); font-size: .75rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase;
}
.chip b { color: var(--tarjan); font-weight: 500; }

/* ===== Termin-Block ===== */
.termin { position: relative; overflow: hidden; background: var(--gummi); color: var(--kreide); }
.termin__inner { position: relative; z-index: 1; display: grid; gap: var(--s-48); }
.termin__titel { font-size: clamp(2.3rem, 6.5vw, 5.2rem); font-weight: 800; font-stretch: 125%; line-height: 1; }
.termin__text { display: grid; gap: var(--s-24); align-content: start; }
.termin__text p { color: var(--stahl); font-size: var(--fs-lead); }
.termin__ctas { display: flex; flex-wrap: wrap; gap: var(--s-12); }
.termin__box { display: grid; gap: var(--s-16); align-content: start; padding: var(--s-32); border: 1px solid var(--gummi-3); background: var(--gummi-2); }
.termin__box h3 { font-size: 1.5rem; }
.termin__box p { color: var(--stahl); }
.termin__rad { position: absolute; z-index: 0; right: -14%; bottom: -30%; width: min(70vw, 820px); aspect-ratio: 1; color: var(--gummi-3); pointer-events: none; }
.termin__rad svg { width: 100%; height: 100%; }
@media (min-width: 960px) { .termin__inner { grid-template-columns: 7fr 5fr; align-items: center; } }

/* ===== Rechtstexte ===== */
.prosa { max-width: 780px; display: grid; gap: var(--s-16); }
.prosa h2 { font-size: 1.5rem; font-stretch: 112%; margin-top: var(--s-32); }
.prosa h3 { margin-top: var(--s-16); }
.prosa ul { padding-left: 1.2em; display: grid; gap: 6px; }
.prosa dl { display: grid; grid-template-columns: minmax(0, 12rem) minmax(0, 1fr); gap: 8px 24px; }
.prosa dt { font-weight: 650; }
@media (max-width: 639px) { .prosa dl { grid-template-columns: 1fr; } .prosa dd { margin-bottom: 8px; } }

/* ===== Leistungsraster (Reifen, Firmenkunden, Partner) ===== */
.leistungen { display: grid; column-gap: var(--s-48); border-top: 1px solid var(--linie); }
.leist { display: grid; gap: 8px; align-content: start; padding: var(--s-24) 0; border-bottom: 1px solid var(--linie); }
.leist h3 { display: flex; align-items: baseline; gap: 12px; }
.leist h3::before { content: ""; flex: 0 0 auto; width: 11px; height: 10px; background: var(--tarjan-tief); clip-path: polygon(50% 0, 100% 100%, 0 100%); transform: translateY(-2px); }
.leist p { color: var(--grafit); }
.sek--gummi .leistungen, .sek--gummi .leist { border-color: var(--gummi-3); }
.sek--gummi .leist p { color: var(--stahl); }
.sek--gummi .leist h3::before { background: var(--tarjan); }
@media (min-width: 960px) { .leistungen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ===== Fahrzeugtypen (LKW & Agro) ===== */
.typen { display: grid; gap: var(--s-16); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.typ { display: grid; align-content: space-between; gap: var(--s-32); min-height: 200px; padding: var(--s-32) var(--s-24); background: var(--beton); }
.typ__icon { width: 52px; height: 52px; color: var(--tarjan-tief); transition: transform 600ms var(--roll); }
.typ:hover .typ__icon { transform: rotate(90deg); }
.typ h3 { font-size: clamp(1.05rem, 1.7vw, 1.4rem); font-weight: 780; font-stretch: 108%; text-transform: uppercase; line-height: 1.1; hyphens: manual; }
@media (min-width: 960px) { .typen { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ===== Varianten ===== */
.twi--spalten { display: block; columns: 2 15rem; column-gap: var(--s-48); }
.twi--spalten li { break-inside: avoid; margin-bottom: 10px; }
.sek--kompakt { padding-block: clamp(40px, 5vw, 72px); }
.kopf--eng { margin-bottom: 0; }
[data-kontakt] .feld__hinweis, [data-kontakt] .feld__fehler { grid-column: 1 / -1; }
[data-kontakt].hat-fehler .feld__fehler { display: flex; }
[data-kontakt].hat-fehler input { border-bottom-color: var(--signal); }
.hero__titel-gross--lang { font-size: clamp(2rem, 5vw, 4.4rem); }

.galerie__bild picture, .bildring__bild picture { height: 100%; }