:root{
--bg: #ffffff;
--bg2: #f8fafc;
--ink: #0f172a;
--text: #fff;
--muted: #64748b;
--card: #ffffff;
--brand-red: #d2272a;
--border: #e2e8f0;
--shadow: 0 20px 50px -20px rgba(2,6,23,.35);
}

@media (prefers-color-scheme: dark){
  :root{
    --bg: #0b1220;
    --bg2: #111827;
    --ink: #e5e7eb;
    --text: #ffffff;
    --muted: #94a3b8;
    --card: #151f38;
    --brand-red: #e23a3d;
    --border: #1e293b;
    --shadow: 0 20px 50px -20px rgba(0,0,0,.65);
  }
}

*{box-sizing:border-box}
html,body{height:100%}
body{
margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
color:var(--ink); background:var(--bg); line-height:1.5;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


/* Layout helpers */
.hh-container{max-width:1100px;margin:0 auto;padding:0 16px}
.hh-section{padding:72px 0}
.hh-section.alt{background:var(--bg2);border-top:1px solid var(--border)}
.grid2{display:grid;grid-template-columns:1fr;gap:32px}
@media(min-width:860px){.grid2{grid-template-columns:1.1fr .9fr}}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 8px 24px rgba(2,6,23,.06)}


/* Header Start */
.hh-header{
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid transparent;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.hh-header.is-scrolled{
  background: rgba(255,255,255,.38);
  border-bottom-color: rgba(226,232,240,.70);
  box-shadow: 0 6px 16px rgba(2,6,23,.10);
}

.headerInner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px;}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.brandMark{
  height: 40px;
  width: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  overflow: hidden;
  flex:0 0 auto;
}

.brandMark img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.brandText{
  line-height:1.1;
}

.brandTitle{
  font-weight:600;
  font-size:16px;
}

.brandSub{font-size:12px;color:var(--muted)}

.hhNav{
  display:flex;
  align-items:center;
  gap:20px;
}

.hhNav a{
  color:var(--muted);
  text-decoration:none;
  padding:6px 4px;
}
.hhNav a:hover{color: var(--ink);}

@media (max-width: 1024px){
  .headerInner{
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    gap: 8px 12px;
    padding: 10px 0;
  }

  .brand{
    width: 100%;
    justify-content: center;
  }

  .hhNav{
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 16px;
  }

  .hhNav a{
    margin-left: 0;
  }
}

/* Header Ende */

/* Slider Start */
.slider{
  position:relative;
  height:70vh;
  min-height:560px;
  overflow:hidden;
  border-bottom:1px solid var(--border);
}

.slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .45s ease;
}

.slide.is-active{
  opacity:1;
}

.slide .bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}

.gradient{
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,.25), transparent);
  z-index:1;
  pointer-events:none;
}

.slide-content{
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:0 16px;
}

.hero-title{
  margin:0;
  font-size:clamp(28px,4vw,56px);
  font-weight:700;
  color:var(--text);
  text-shadow:0 2px 8px rgba(0,0,0,.3);
}

.hero-sub{
  margin:.5rem 0 0;
  color:var(--text);
  opacity:.92;
  font-size:clamp(14px,2vw,20px);
}

.ctrl{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  height:44px;
  width:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.6);
  background:rgba(255,255,255,.85);
  box-shadow:0 6px 20px rgba(0,0,0,.15);
  cursor:pointer;
  z-index:10;
}

.ctrl:hover{ background:var(--bg); }
.ctrl.prev{ left:8px; }
.ctrl.next{ right:8px; }

.dots{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:16px;
  display:flex;
  gap:8px;
  z-index:10;
}

.dot{
  height:10px;
  width:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.7);
  background:rgba(255,255,255,.4);
  cursor:pointer;
}

.dot.is-active{
  background:var(--bg);
}

/* Slide 2 */
.brandSlide{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  height:100%;
}

.brandSlice{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  color:var(--text);
  text-decoration:none;
  border-right:1px solid var(--border);
  background:var(--card);
}

.brandSlice:last-child{
  border-right:none;
}

.brandSliceImg{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
  padding:40px;
  transition:transform .25s ease, filter .25s ease;
}

.brandSliceOverlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:24px;
  background:linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0));
}

.brandSlice:hover .brandSliceImg{
  transform:scale(1.03);
  filter:brightness(1.08) saturate(1.05);
}

.brandSlice:hover .brandSliceOverlay{
  opacity:1;
}

.brandSliceOver{
  display:block;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.95;
}

.brandSliceTitle{
  display:block;
  font-size:28px;
  font-weight:600;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
}

.brandSliceDesc{
  display:block;
  font-size:12px;
  opacity:.95;
  max-width:520px;
}

.ctrl,
.dots{
  z-index:10;
  pointer-events:auto;
}

[inert]{
  pointer-events:none;
}

@media (max-width: 1024px){
  .slider{
    min-height: 520px;
    height: 70vh;
  }

  .brandSlide{
    grid-template-columns: 1fr;
  }

  .brandSlice{
    height: 220px;
    min-height: 220px;
    border-right: none;
    border-bottom: 1px solid var(--border);
  }

  .brandSlice:last-child{
    border-bottom: none;
  }

  .brandSliceImg{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  .brandSliceOverlay{
    opacity: 1;
    padding: 20px;
  }

  .brandSliceTitle{
    font-size: 22px;
  }

  .ctrl{
    height: 40px;
    width: 40px;
  }
}
/* Slider Ende */

/* AboutUs Start */

.aboutUsSection{
  padding: 88px 0;
}

.aboutUsSection h2{
  margin: 0 0 14px 0;
  font-size: clamp(26px, 3vw, 36px);
  line-height: 1.2;
  color: var(--ink);
}

.aboutUsSection h3{
  margin: 18px 0 10px 0;
  font-size: clamp(18px, 2.2vw, 20px);
  line-height: 1.35;
  color: var(--ink);
}

.aboutUsSection p{
  margin: 0 0 14px 0;
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--muted);
}

.aboutUsGrid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}

.aboutUsContent{
  background-color: var(--card);
  padding: 24px;
  border-radius: 16px;
  border: 1px solid var(--border);
  box-shadow: 0 8px 24px rgba(2,6,23,.06);
}
.aboutUsCard{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 8px 24px rgba(2,6,23,.06);
}

.aboutUsCard h3:first-child{
  margin-top: 0;
}

.aboutUsSection ul{
  margin: 8px 0 0 18px;
  padding: 0;
  color: #475569;
  line-height: 1.7;
}

.aboutUsSection li{
  margin: 6px 0;
}

.aboutUsSection li::marker{
  color: var(--brand-red);
}

.aboutUsSection a,
.aboutUsContact a{
  color: var(--brand-red);
  text-decoration: underline;
}

.aboutUsSection a:hover,
.aboutUsContact a:hover{
  text-decoration: none;
}

.aboutUsContact{
  padding-top: 0;
}

.aboutUsContactCard{
  max-width: 780px;
  margin: 0 auto;
  padding: 28px;
}

.aboutUsContact h2{
  margin: 0 0 10px 0;
  font-size: clamp(22px, 2.6vw, 28px);
  line-height: 1.2;
}

@media (min-width: 900px){
  .aboutUsGrid{
    grid-template-columns: 1.2fr 1fr;
  }

  .aboutUsContent{
    padding-right: 16px;
    border-right: 1px solid var(--border);
  }

  .aboutUsCard{
    margin-left: 16px;
  }
}

/* AboutUs Ende */

/* Footer Start */
.hhFooter{
  border-top: 1px solid var(--border);
}

.footInner{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  padding: 16px 0;
  color: var(--muted);
  font-size: 12px;
}

.footBrand,
.footLinks{
  flex: 1 1 260px;
  display: flex;
  align-items: center;
  min-height: 24px;
}

.footBrand{
  justify-content: flex-start;
  gap: 5px;
}

.footLinks{
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.footLinks a{
  color: inherit;
  text-decoration: none;
}

.footLinks a:hover{
  color: var(--ink);
}

@media (max-width: 1024px){
  .footInner{
    justify-content:center;
    text-align:center;
  }

  .footBrand,
  .footLinks{
    flex:0 0 auto;
    justify-content:center;
  }
}
/* Footer Ende */

/* Contact Start */

/* Contact Hero */
.contactHero{
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(210,39,42,.06), transparent);
}

.contactHeroWrap{
  display:flex;
  align-items:center;
  gap:16px;
  padding:28px 0;
}

.contactHeroLogo{
  width:64px;
  height:64px;
  object-fit:contain;
  display:block;
  border-radius:16px;
  background:#fff;
  border:1px solid var(--border);
  padding:6px;
  flex:0 0 auto;
}

.contactHeroHead h1{
  margin:0;
  font-size:28px;
  line-height:1.2;
  color:var(--ink);
}

.contactHeroSub{
  margin:.35rem 0 0;
  color:var(--muted);
  font-size:14px;
  max-width:60ch;
}

.contactLayout{
  display:grid;
  gap:16px;
  margin:16px auto;
  max-width:960px;
  grid-template-columns:1fr;
}

.contactCol.card{
  border-radius:18px;
}

.contactH2{
  margin:0 0 8px 0;
  font-size:18px;
  font-weight:700;
}

.contactAddress{
  font-style:normal;
  line-height:1.65;
  margin:6px 0 0;
}

.contactMail{
  margin:6px 0 0;
}

.contactNote{
  margin:4px 0 0;
  color:var(--muted);
  font-size:14px;
}

.contactActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:10px 0 6px;
}

.contactList{
  margin:8px 0 0 18px;
}

.cfHead{
  padding:16px 18px;
  background:var(--brand-red);
  color:var(--text);
  border-radius:12px;
  margin:8px 8px 0;
}

.cfTitle{
  font-weight:700;
  font-size:16px;
}

.cfSub{
  opacity:.9;
  font-size:13px;
  margin-top:2px;
}

.contactDivider{
  border:0;
  height:1px;
  background:var(--border);
  margin:14px 0 16px;
}

.contactH3{
  margin:0 0 8px 0;
  font-size:15px;
  color:var(--ink);
}

.contactHours ul{
  list-style:none;
  padding:0;
  margin:0 0 6px 0;
  display:grid;
  gap:6px;
}

.contactHours li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid var(--border);
  border-radius:10px;
  padding:8px 10px;
  background:var(--bg);
}

.contactHours li span{
  color:var(--muted);
}

.contactHours li strong{
  color:var(--ink);
  font-weight:600;
}

.contactSmall{
  margin:4px 0 0;
  font-size:12px;
  color:var(--muted);
}

.contactMap{
  margin:14px 0 8px;
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  aspect-ratio:16 / 9;
  background:var(--bg);
}

.contactMap iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}

.contactExtras{
  display:grid;
  gap:10px;
  margin-top:8px;
}

.contactBadges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.contactBadge{
  display:inline-block;
  font-size:12px;
  color:var(--muted);
  background:linear-gradient(180deg, rgba(210,39,42,.06), #fff);
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 10px;
}

.contactChips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.chip{
  display:inline-block;
  font-size:12px;
  text-decoration:none;
  border:1px solid var(--border);
  background:var(--bg);
  color:var(--brand-red);
  padding:6px 10px;
  border-radius:999px;
  transition:transform .08s, background .15s;
}

.chip:hover{
  transform:translateY(-1px);
  background:var(--bg2);
}

.chip[aria-disabled="true"]{
  opacity:.45;
  pointer-events:none;
}

.contactForm{
  display:grid;
  gap:12px;
}

.cfGrid,
.consent,
.cfActions{
  padding-left:8px;
  padding-right:8px;
}

.cfGrid{
  display:grid;
  gap:14px;
  padding:0 8px;
  grid-template-columns:1fr;
  min-width:0;
}

.field{
  display:grid;
  gap:6px;
}

.field label{
  font-size:13px;
  color:#334155;
}

.field input,
.field textarea{
  width:100%;
  min-width:0;
  border:1px solid var(--border);
  border-radius:12px;
  padding:11px 12px;
  font:inherit;
  background:var(--bg);
  color:var(--ink);
  transition:border-color .15s, box-shadow .15s, background .15s;
}

.field input:focus,
.field textarea:focus{
  outline:none;
  border-color:var(--border);
  box-shadow:0 0 0 3px rgba(148,163,184,.28);
}

.field textarea{
  resize:vertical;
}

.full{
  grid-column:1 / -1;
}

.consent{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:14px;
  line-height:1.5;
  color:var(--muted);
}

.consent input{
  margin:2px 0 0;
  flex:0 0 auto;
}

.consentText{
  display:block;
}

.cfActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding-bottom:8px;
}

.btn{
  color:var(--brand-red);
  text-decoration:none;
  border:1px solid var(--border);
  padding:10px 14px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:transform .08s, background .15s, border-color .15s;
}

.btn:hover{
  transform:translateY(-1px);
  background:var(--bg2);
}

.btn.submit{
  background:var(--brand-red);
  color:var(--text);
  cursor:pointer;
}

.btn.submit:hover{
  background:var(--ink);
}

.btn.ghost{
  background:var(--muted);
  color:var(--text);
}

.honeypot{
  position:absolute;
  left:-9999px;
  opacity:0;
}

/* Modal */
.modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.5);
}

.modal[aria-hidden="false"],
.modal.is-open{
  display:flex;
}

.modalContent{
  background:var(--card);
  color:var(--ink);
  width:min(92vw, 480px);
  border-radius:16px;
  padding:24px;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  text-align:center;
  border:1px solid var(--border);
}

.modalLogo{
  width:140px;
  height:auto;
  margin-bottom:10px;
}

.modalContent h2{
  margin:6px 0 6px;
  font-size:22px;
  color:var(--ink);
}

.modalContent p{
  margin:0 0 12px;
  color:var(--muted);
}

#closeModal{
  background:var(--brand-red);
  color:#fff;
  border:0;
  border-radius:999px;
  padding:10px 16px;
  font-weight:800;
  cursor:pointer;
}

#closeModal:hover{
  background:#b81e20;
}
/* Modal Ende */

@media (max-width: 768px){
  .contactHeroWrap{
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:12px;
    padding:22px 0;
  }

  .contactHeroHead h1{
    font-size:24px;
  }

  .contactHeroSub{
    max-width:none;
  }
}
@media (min-width: 900px){
  .contactLayout{
    grid-template-columns:1fr 1fr;
  }

  .cfGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

/* Contact Ende */

/* Company Start */
.coHero{
  border-bottom:1px solid var(--border);
  background: linear-gradient(180deg, rgba(210,39,42,.06), transparent);
}

.coWrap{
  display:flex;
  align-items:center;
  gap:16px;
  padding:28px 0;
}

.coLogo{
  width:64px;
  height:64px;
  object-fit:contain;
  display:block;
  border-radius:16px;
  background:var(--bg);
  border:1px solid var(--border);
  padding:6px;
  flex:0 0 auto;
}

.coHead h1{
  margin:0;
  font-size:28px;
  color:var(--ink);
}

.coSub{
  margin:.4rem 0 0;
  color:var(--muted);
  max-width:60ch;
}

.coPills{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.coPill{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--card);
}

.coSection{
  padding:44px 0;
}

.coAlt{
  background:var(--bg2);
  border-top:1px solid var(--border);
}

.coGrid{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
}

.coCard{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:18px;
  box-shadow:0 8px 24px rgba(2,6,23,.06);
}

.coCard h2,
.coCard h3{
  margin:0 0 6px 0;
}

.coCard p{
  margin:0;
  color:var(--muted);
}

.coAbout .coText{
  padding:22px;
}

.coFigure{
  padding:0;
  overflow:hidden;
  margin:0;
}

.coFigure img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:16px;
  background:var(--card);
}

.coStatsSection{
  padding:24px 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:var(--bg);
}

.coStats{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  gap:12px;
}

.coStat{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  text-align:center;
}

.coStat span{
  display:block;
  font-size:24px;
  font-weight:700;
  color:var(--ink);
}

.coStat small{
  color:var(--muted);
}

.coBrand{
  display:block;
  padding:0;
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  transition:transform .12s ease, box-shadow .15s ease;
}

.coBrandMedia{
  height:200px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:#fff;
  border-bottom:1px solid var(--border);
}

.coBrand img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
}

.coBrandBody{
  padding:14px 16px;
}

.coBrand h3{
  margin:0 0 4px 0;
}

.coBrand:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 40px rgba(2,6,23,.10);
}

.coValues .coCard{
  padding:20px;
}

.coTimeline{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:14px;
}

.coTimeline li{
  position:relative;
  padding-left:28px;
}

.coTlDot{
  position:absolute;
  left:0;
  top:4px;
  width:14px;
  height:14px;
  border-radius:999px;
  background:var(--brand-red);
  box-shadow:0 0 0 3px rgba(210,39,42,.15);
}

.coTlBody{
  color:var(--muted);
}

.coCTA{
  padding:40px 0;
  background:linear-gradient(180deg, transparent, rgba(210,39,42,.06));
  border-top:1px solid var(--border);
}

.coCTAWrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--card);
  padding:20px 22px;
}

.coCTA h2{
  margin:0 0 4px 0;
  color:var(--ink);
}

@media (max-width: 768px){
  .coWrap{
    flex-direction:column;
    text-align:center;
  }

  .coSub{
    max-width:none;
  }

  .coCTAWrap{
    flex-direction:column;
    text-align:center;
  }
}
/* Company Ende */

/* Impressum Start */

.impressumHero{
  border-bottom:1px solid var(--border);
  background:linear-gradient(180deg, rgba(210,39,42,.06), transparent);
}

.impWrap{
  display:flex;
  align-items:center;
  gap:16px;
  padding:28px 0;
}

.impLogo{
  width:64px;
  height:64px;
  object-fit:contain;
  display:block;
  border-radius:16px;
  background:var(--bg);
  border:1px solid var(--border);
  padding:6px;
  flex:0 0 auto;
}

.impHead h1{
  margin:0;
  font-size:28px;
  line-height:1.2;
  color:var(--ink);
}

.impressumSection{
  padding:40px 0 72px;
}

.impLayout{
  max-width:900px;
  margin:0 auto;
}

.impCard{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:22px 20px;
  box-shadow:0 8px 24px rgba(2,6,23,.06);
  color: var(--ink);
  overflow-wrap:anywhere;
  word-break:break-word;
}

.impCard p{
  margin:0 0 14px 0;
}

.impCard strong{
  overflow-wrap:anywhere;
  word-break:break-word;
}

.impCard a{
  color:var(--brand-red);
  text-decoration:underline;
}

.impCard a:hover{
  text-decoration:none;
}

@media (max-width: 768px){
  .impWrap{
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 22px 0;
  }

  .impHead h1{
    font-size: 24px;
  }

  .impCard{
    padding: 18px 16px;
  }
}

/* Impressum Ende */

/* Datenschutz Start */

.dsHero{
  border-bottom:1px solid var(--border);
  background: linear-gradient(180deg, rgba(210,39,42,.06), transparent);
}
.dsWrap{ display:flex; align-items:center; gap:16px; padding:28px 0; }
.dsLogo{
  width:64px; height:64px; object-fit:contain; display:block;
  border-radius:16px; background:var(--bg); border:1px solid var(--border); padding:6px;
}
.dsHead h1{ margin:0; font-size:28px; color:var(--ink); }
.dsSection{ padding:40px 0 72px; }
.dsCard{
  background:var(--card); border:1px solid var(--border); border-radius:16px;
  padding:22px 20px; box-shadow:0 8px 24px rgba(2,6,23,.06); color:var(--ink);
}
.dsCard h2{ margin:18px 0 8px; color:var(--ink); }
.dsCard h3{ margin:14px 0 6px; color:var(--ink); font-size:16px; }
.dsCard p{ margin:0 0 12px; }
.dsCard a{ color:var(--brand-red); text-decoration:underline; }
.dsCard a:hover{ text-decoration:none; }
.dsCard ul{ margin:8px 0 12px 18px; }

@media (max-width: 768px){
  .dsWrap{
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 22px 0;
  }

  .dsHead h1{
    font-size: 24px;
  }
}

/* Datenschutz Ende */

@media (max-width: 1024px){
  .contactHeroWrap,
  .impWrap,
  .dsWrap,
  .coPills,
  .coWrap{
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 12px;
    padding: 22px 0;
  }

  .contactHeroHead,
  .impHead,
  .dsHead,
  .coHead{
    width: 100%;
  }

  .contactHeroSub,
  .impNote,
  .dsNote,
  .coSub{
    max-width: 60ch;
    margin-left: auto;
    margin-right: auto;
  }
}