/* ==================================================================
   Seite: Angebot
   ================================================================== */

.cards{max-width:1240px;margin:36px auto 0;padding:0 44px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px}
.card{display:flex;flex-direction:column;scroll-margin-top:90px}
.card .imw{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--g100)}
.card .im{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.card:hover .im{transform:scale(1.05)}
.card .imw::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(to top,rgba(10,10,11,.45),transparent);z-index:1;pointer-events:none}
.card h3{font-weight:900;font-size:23px;letter-spacing:-.01em;line-height:1.1;margin-top:16px}
.card p{font-size:15px;line-height:1.5;color:var(--g500);margin-top:9px}
/* margin-top:auto schiebt die Zeile ans Kartenende — dadurch schliessen
   alle Karten einer Reihe bündig ab, auch bei ungleich langen Texten. */
.card .co{margin-top:auto;padding-top:11px;border-top:1px solid var(--g200);font-size:13px;color:var(--g500)}
.card p{margin-bottom:12px}
.card .co b{color:var(--red);font-weight:700}

.contact{margin-top:84px}

@media(max-width:900px){.cards{padding-left:24px;padding-right:24px}}
@media(max-width:600px){.cards{grid-template-columns:1fr}}