/* elator drive – Design-System: 38 benannte Klassen
   1:1 aus dem ausgelieferten CSS übernommen. Der Vorfahre `.elementor `
   wurde durchgängig entfernt; die relative Spezifität bleibt unverändert. */

/* ---------- Desktop ---------- */

.abstand-klein {
  padding-block-start:60px;
  padding-block-end:160px;
  justify-content:center;
}
.abstand-oben {
  padding-block-start:160px;
}
.abstand-standard {
  padding-block-end:240px;
  justify-content:center;
}
.bild-abgerundet {
  border-radius:30px;
}
.bild-feature {
  width:100%;
  object-fit:fill;
  border-radius:30px;
}
.bild-rund-portrait {
  width:200px;
  height:200px;
  border-radius:500px;
}
.bild-schieber {
  width:100%;
  height:30vw;
  aspect-ratio:auto;
  object-fit:cover;
  border-radius:30px;
}
.box-rot {
  padding-block-start:30px;
  padding-block-end:30px;
  padding-inline-start:30px;
  padding-inline-end:20px;
  border-radius:30px;
  background-color:var(--Erdbeer);
  display:flex;
  flex-direction:column;
  gap:30px;
  justify-content:space-between;
}
.box-rubrik {
  gap:20px;
  align-items:center;
}
.box-sticky {
  position:sticky;
  inset-block-start:240px;
  padding:0px;
  flex-direction:column;
  gap:0px;
  align-items:center;
}
.box-system {
  padding:0px;
  gap:80px;
}
.box-weiss-spezis {
  max-width:1000px;
  padding-block-start:40px;
  padding-block-end:30px;
  padding-inline-start:60px;
  padding-inline-end:50px;
  border-radius:30px;
  background-color:var(--Weiss);
  flex-direction:column;
  gap:20px;
}
.button-1 {
  font-family:Atkinson Hyperlegible Next;
  font-size:1.6rem;
  color:var(--Brombeer);
  padding-block-start:0.5em;
  padding-block-end:0.5em;
  padding-inline-start:1.2em;
  padding-inline-end:1.2em;
  margin-block-start:20px;
  border-radius:100px;
  background-color:var(--Erdbeer);
  transition:all 200ms;
}
.button-himbeer {
  color:var(--Weiss);
  padding-block-start:0.6em;
  padding-block-end:0.6em;
  padding-inline-start:1.2em;
  padding-inline-end:1.2em;
  border-radius:50px;
  background-color:var(--Himbeer);
  transition:all 200ms;
  display:block;
}
.button-scroll {
  width:60px;
  height:60px;
  color:var(--Himbeer);
  margin-block-start:240px;
  transition:all 200ms;
}
.div-schmal {
  max-width:1000px;
  padding:0px;
  flex-direction:column;
  gap:20px;
  align-items:start;
}
.head-atk-2 {
  font-family:Atkinson Hyperlegible Next;
  font-weight:400;
  font-size:3.6rem;
}
.head-atk-4 {
  font-family:Atkinson Hyperlegible Next;
  font-size:3rem;
}
.head-box-rot {
  font-family:var(--font-display);
  font-weight:700;
  font-size:2.4rem;
  color:var(--Brombeer);
}
.head-button-weiss {
  font-family:Atkinson Hyperlegible Next;
  font-size:1.2rem;
  color:var(--Weiss);
  text-align:center;
  text-transform:uppercase;
}
.head-detail {
  font-family:Atkinson Hyperlegible Next;
  font-weight:600;
  font-size:2rem;
  color:var(--Himbeer);
  line-height:1.5em;
}
.head-kontaktperson {
  font-size:2rem;
  color:var(--Erdbeer);
  margin-block-start:0px;
  margin-block-end:0px;
}
.head-please-L {
  font-family:var(--head-please-black);
  font-weight:900;
  font-size:8rem;
  line-height:1em;
  padding-block-end:2px;
}
.head-please-M {
  font-family:var(--font-display);
  font-weight:900;
  font-size:6rem;
  line-height:1em;
}
.head-please-XL {
  font-family:var(--font-display);
  font-weight:900;
  font-size:11rem;
  line-height:0.9em;
  padding-block-end:20px;
}
.kein-rand {
  padding:0px;
}
.pikto-1 {
  transform:translate3d(0px, 0px, 0px);
}
.rand-boxen-1 {
  padding-inline-start:8%;
  padding-inline-end:8%;
  display:flex;
}
.rand-breit {
  padding-inline-start:8%;
  padding-inline-end:8%;
  display:flex;
}
.rand-schmal {
  padding-inline-start:4%;
  padding-inline-end:4%;
  margin:0px;
}
.rand-standard {
  padding-inline-start:8%;
  padding-inline-end:8%;
}
.raster-features {
  max-width:1600px;
  padding:0px;
  flex-direction:column;
  gap:240px;
}
.text-feature {
  font-family:Atkinson Hyperlegible Next;
  font-weight:400;
  font-size:2rem;
  color:var(--Himbeer);
}
.text-plus {
  width:100%;
  font-family:Atkinson Hyperlegible Next;
  font-weight:600;
  font-size:1.6rem;
}
.text-standard {
  font-family:Atkinson Hyperlegible Next;
  font-size:1.2rem;
  color:var(--Himbeer);
}
.titelkachel {
  width:25%;
  min-width:25%;
  color:var(--Himbeer);
  padding:0px;
  transition:width 800ms, all 600ms;
  flex-direction:column;
  flex:0 1 auto;
}
.trenner-1 {
  height:4px;
}

/* ---------- Tablet (<= 1024px) ---------- */

@media (max-width: 1024px) {
  .abstand-klein {
    padding-block-start:40px;
    padding-block-end:120px;
  }
  .abstand-oben {
    padding-block-start:80px;
  }
  .abstand-standard {
    padding-block-end:160px;
  }
  .bild-feature {
    border-radius:25px;
    display:block;
  }
  .bild-modell {
    width:55%;
  }
  .bild-rund-portrait {
    width:160px;
    height:160px;
  }
  .bild-schieber {
    border-radius:25px;
  }
  .box-rot {
    width:48%;
    padding-inline-start:20px;
    padding-inline-end:20px;
  }
  .box-sticky {
    position:sticky;
    inset-block-start:160px;
    flex-direction:column;
    gap:40px;
  }
  .box-system {
    flex-direction:column;
    gap:40px;
  }
  .box-weiss-spezis {
    padding-inline-start:30px;
    padding-inline-end:20px;
    border-radius:25px;
  }
  .button-1 {
    font-size:1.4rem;
  }
  .button-scroll {
    width:50px;
    height:50px;
    margin-block-start:120px;
  }
  .div-schmal {
    width:80%;
  }
  .head-atk-2 {
    font-size:2.8rem;
  }
  .head-atk-4 {
    font-size:2.4rem;
  }
  .head-box-rot {
    font-size:2.1rem;
  }
  .head-button-weiss {
    font-size:1.1rem;
  }
  .head-detail {
    font-size:1.6rem;
  }
  .head-kontaktperson {
    font-size:1.8rem;
  }
  .head-please-L {
    font-family:var(--font-display);
    font-weight:900;
    font-size:6rem;
  }
  .head-please-M {
    font-size:4.8rem;
  }
  .head-please-XL {
    font-size:8.5rem;
  }
  .rand-boxen-1 {
    padding-inline-start:0px;
    padding-inline-end:0px;
  }
  .rand-breit {
    padding-inline-start:4%;
    padding-inline-end:4%;
  }
  .rand-schmal {
    padding-inline-start:4%;
    padding-inline-end:4%;
  }
  .raster-features {
    gap:160px;
  }
  .text-feature {
    font-size:1.6rem;
  }
  .text-plus {
    width:240px;
    font-size:1.4rem;
  }
  .text-standard {
    font-size:1.1rem;
  }
}

/* ---------- Mobil (<= 767px) ---------- */

@media (max-width: 767px) {
  .abstand-klein {
    padding-block-start:20px;
    padding-block-end:80px;
  }
  .abstand-oben {
    padding-block-start:20px;
  }
  .abstand-standard {
    padding-block-end:80px;
  }
  .bild-abgerundet {
    border-radius:15px;
  }
  .bild-feature {
    border-radius:20px;
  }
  .bild-modell {
    width:100%;
  }
  .bild-rund-portrait {
    width:120px;
    height:120px;
  }
  .bild-schieber {
    border-radius:20px;
  }
  .box-rot {
    width:100%;
    border-radius:20px;
  }
  .box-sticky {
    position:sticky;
    inset-block-start:80px;
  }
  .box-weiss-spezis {
    padding-block-start:30px;
    padding-block-end:20px;
    padding-inline-start:20px;
    padding-inline-end:15px;
    border-radius:20px;
    flex-direction:column;
  }
  .button-1 {
    font-size:1.2rem;
  }
  .button-scroll {
    width:40px;
    height:40px;
    margin-block-start:20px;
    display:none;
  }
  .div-schmal {
    width:100%;
  }
  .head-atk-2 {
    font-size:2rem;
  }
  .head-atk-4 {
    font-size:1.8rem;
  }
  .head-box-rot {
    font-size:1.8rem;
  }
  .head-button-weiss {
    font-size:1rem;
  }
  .head-detail {
    font-size:1.2rem;
  }
  .head-kontaktperson {
    font-size:1.6rem;
  }
  .head-please-L {
    font-size:3.2rem;
  }
  .head-please-M {
    font-size:2.4rem;
  }
  .head-please-XL {
    font-size:6rem;
  }
  .rand-boxen-1 {
    padding-inline-start:0px;
    padding-inline-end:0px;
  }
  .rand-breit {
    padding-inline-start:4%;
    padding-inline-end:4%;
  }
  .rand-schmal {
    padding-inline-start:4%;
    padding-inline-end:4%;
  }
  .rand-standard {
    padding-inline-start:4%;
    padding-inline-end:4%;
  }
  .raster-features {
    gap:80px;
  }
  .text-feature {
    font-size:1.2rem;
  }
  .text-plus {
    font-size:1.2rem;
  }
  .text-standard {
    font-size:0.9rem;
  }
  .titelkachel {
    width:100%;
  }
}

/* ---------- Zustaende: hover, focus, focus-visible ----------
   Muessen nach den Grundregeln stehen, sonst greifen sie nicht. */

.button-1:hover,.button-1:focus-visible {
  color:var(--Weiss);
  background-color:var(--Himbeer);
}
.button-himbeer:focus {
  border-radius:50px;
}
.button-himbeer:hover,.button-himbeer:focus-visible {
  background-color:var(--Brombeer);
}
.button-scroll:hover,.button-scroll:focus-visible {
  color:var(--Erdbeer);
}
.titelkachel:focus {
  width:50%;
  object-fit:fill;
}
.titelkachel:hover,.titelkachel:focus-visible {
  width:100%;
  color:var(--Erdbeer);
}

/* ---------- Handgeschriebenes CSS aus dem Bestand ---------- */

.liste ul {padding-left: 1em; padding-bottom: 1rem;}

