/* v4.5: Dienstleistungen zweispaltig (Karten: Symbol + Titel + Liste), schmal einspaltig */
.service-wrapper{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:.25rem 1.5rem;margin:0}
.service-wrapper .service{width:auto;min-width:0;padding:.5rem 0;display:flex;gap:.75rem;align-items:flex-start}
.service-wrapper .service .service-image{margin:0;flex:0 0 64px}
.service-wrapper .service .service-image img{width:64px;height:64px;display:block;image-rendering:pixelated}
.service-wrapper .service .service-copy{min-width:0;flex:1}
.service-wrapper .service .service-copy h2,.service-wrapper .service .service-copy h3{margin-top:.15em}
.service-wrapper .service .service-copy ul{margin-top:.25em}
@media (max-width:600px){.service-wrapper{grid-template-columns:1fr}}

/* v4.11 – Dienstleistungs-Kästen: Titel pro Reihe gleich hoch (subgrid), damit die Aufzählungen nebeneinander auf gleicher Höhe beginnen.
   Jeder Kasten belegt 2 Zeilen des Rasters (Titel / Liste); einspaltig (Mobil) hat jede Zeile nur ihren eigenen Kasten → keine Leerfläche.
   Abstände wie bisher: Grid-Elemente lassen Ränder nicht mehr zusammenfallen, darum ul/erstes li ohne oberen und letztes li ohne unteren Rand
   (vorher fielen diese Ränder mit dem Rand des Titels bzw. dem unteren Rand der Liste zusammen). */
@supports (grid-template-rows:subgrid){
.service-wrapper .service{display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:subgrid;grid-row:span 2;column-gap:.75rem;row-gap:0;align-items:start}
.service-wrapper .service .service-image{grid-column:1;grid-row:1/span 2}
.service-wrapper .service .service-copy{grid-column:2;grid-row:1/span 2;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;row-gap:0;align-items:start}
.service-wrapper .service .service-copy>*{min-width:0}
.service-wrapper .service .service-copy ul{margin-top:0}
.service-wrapper .service .service-copy ul>li:first-child{margin-top:0}
.service-wrapper .service .service-copy ul>li:last-child{margin-bottom:0}
}
