:root{--mwd-panel:#274a6b;--mwd-ov:rgba(0,0,0,.3);--mwd-icon-size:18px;--mwd-icon-offset-y:0px;--mwd-logo-w:200px;--mwd-tile-h:360px;--mwd-logo-top:60px;--mwd-logo-right:60px;--mwd-title-right:60px;--mwd-title-bottom:60px}
.mwd-marken-kacheln{width:100%}
.mwd-brand-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:40px}
.mwd-bt{position:relative;overflow:hidden;border-radius:0;height:var(--mwd-tile-h)}
.mwd-bt-media{position:absolute;inset:0}
.mwd-bt-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mwd-bt-media-ov{position:absolute;inset:0;background:var(--mwd-ov)}

/* Logo oben rechts, Titel unten rechts (per Variablen steuerbar) */
.mwd-bt-logo-wrap{position:absolute;top:var(--mwd-logo-top,60px);right:var(--mwd-logo-right,60px);left:auto;z-index:3}
.mwd-bt .mwd-bt-logo{display:block;max-width:var(--mwd-logo-w) !important;height:auto}
.mwd-bt-title{position:absolute;right:var(--mwd-title-right,60px);bottom:var(--mwd-title-bottom,60px);left:auto;margin:0;color:#fff;text-align:right;z-index:1}

/* Rechte Fläche: fährt von rechts ein */
.mwd-bt-panel{position:absolute;top:0;right:0;height:100%;width:var(--mwd-panel-w, min(55%, 520px));background:var(--mwd-panel);transform:translateX(calc(100% - 24px));transition:transform .35s ease;z-index:2;color:#fff;display:flex;align-items:stretch}
.mwd-bt:hover .mwd-bt-panel,.mwd-bt:focus-within .mwd-bt-panel,.mwd-bt.is-open .mwd-bt-panel{transform:translateX(0)}
.mwd-bt-panel-inner{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:space-between;width:100%;padding:24px 28px}

.mwd-bt-desc{margin:0 0 12px 0;text-align:left}
.mwd-bt-cta{display:block;text-align:right}
.mwd-bt-cta .mwd-bt-cta-link{color:#fff;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:8px}
/* Button-Underline wie Leistung/Sor­ti­ment: Pseudoelement-Animation */
.mwd-bt-cta .mwd-bt-cta-text{position:relative;display:inline-block}
.mwd-bt-cta .mwd-bt-cta-text::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background-color:currentColor;transform:scaleX(0);transform-origin:left center;transition:transform .25s ease}
.mwd-bt-cta .mwd-bt-cta-link:hover .mwd-bt-cta-text::after,
.mwd-bt-cta .mwd-bt-cta-link:focus-visible .mwd-bt-cta-text::after{transform:scaleX(1)}
.mwd-bt-cta .mwd-bt-cta-icon{display:inline-flex;transform:translateY(var(--mwd-icon-offset-y))}
.mwd-bt-cta .mwd-bt-cta-icon svg{width:var(--mwd-icon-size);height:var(--mwd-icon-size)}

/* Z-Index: Logo über Panel, Titel darunter */
.mwd-bt-logo-wrap{z-index:3}
.mwd-bt-title{z-index:1}

/* Responsive tweaks */
@media (max-width: 1024px){
  /* Panelbreite nutzt weiterhin die Variable; Fallback für Tablet minimal anders */
  .mwd-bt-panel{width:var(--mwd-panel-w, min(65%,560px))}
}
@media (max-width: 767px){
  .mwd-brand-grid{grid-template-columns:1fr}
}

/* Default Panel width variable for Marken-Kacheln */
.mwd-marken-kacheln{--mwd-panel-w:min(55%, 520px)}