/* WGRCMS-Step-0048 Quickcards 1:1 Polish */
:root{
  --wgr-blue:#015da8;
  --wgr-text:#16324a;
  --wgr-muted:#40556a;
  --wgr-line:#dbe8f0;
  --wgr-box:1180px;
}

/* Quickcards unter Hero wie Mockup */
.quick-wrap{
  max-width:1180px!important;
  margin:-46px auto 0!important;
  padding:0!important;
  position:relative!important;
  z-index:20!important;
}

.quick-grid{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(219,232,240,.92)!important;
  border-radius:7px!important;
  box-shadow:0 18px 45px rgba(9,35,59,.13)!important;
  overflow:hidden!important;
  backdrop-filter:blur(8px)!important;
}

.quick-card{
  display:grid!important;
  grid-template-columns:56px 1fr!important;
  align-items:start!important;
  gap:18px!important;
  min-height:150px!important;
  padding:28px 28px!important;
  background:transparent!important;
  border-right:1px solid var(--wgr-line)!important;
  color:var(--wgr-text)!important;
  text-decoration:none!important;
  transition:background-color .16s ease!important;
}

.quick-card:last-child{
  border-right:0!important;
}

.quick-card:hover{
  background:#f7fbfe!important;
  transform:none!important;
}

.quick-icon{
  width:50px!important;
  height:50px!important;
  border-radius:10px!important;
  display:grid!important;
  place-items:center!important;
  background:#eef8fd!important;
  color:var(--wgr-blue)!important;
  font-size:0!important;
  line-height:1!important;
  flex:0 0 auto!important;
}

/* Die alten Emoji/Zeichen ersetzen durch saubere CSS-Icons */
.quick-icon::before{
  content:""!important;
  display:block!important;
  width:30px!important;
  height:30px!important;
  background:var(--wgr-blue)!important;
  mask-size:contain!important;
  mask-position:center!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-size:contain!important;
  -webkit-mask-position:center!important;
  -webkit-mask-repeat:no-repeat!important;
}

/* 1 Haus */
.quick-card:nth-child(1) .quick-icon::before{
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.5 12 4l9 7.5v8a1 1 0 0 1-1 1h-5.5v-6h-5v6H4a1 1 0 0 1-1-1v-8Z' fill='black'/%3E%3C/svg%3E")!important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.5 12 4l9 7.5v8a1 1 0 0 1-1 1h-5.5v-6h-5v6H4a1 1 0 0 1-1-1v-8Z' fill='black'/%3E%3C/svg%3E")!important;
}

/* 2 Gruppe */
.quick-card:nth-child(2) .quick-icon::before{
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm8 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM2 20a6 6 0 0 1 12 0H2Zm8.5-2.8A6 6 0 0 1 22 20h-6.5a7.9 7.9 0 0 0-5-2.8Z' fill='black'/%3E%3C/svg%3E")!important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm8 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM2 20a6 6 0 0 1 12 0H2Zm8.5-2.8A6 6 0 0 1 22 20h-6.5a7.9 7.9 0 0 0-5-2.8Z' fill='black'/%3E%3C/svg%3E")!important;
}

/* 3 Chat/Service */
.quick-card:nth-child(3) .quick-icon::before{
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3C6.48 3 2 6.78 2 11.45c0 2.77 1.58 5.23 4.02 6.77L5 22l4.35-2.05c.84.18 1.73.28 2.65.28 5.52 0 10-3.78 10-8.45S17.52 3 12 3Z' fill='black'/%3E%3C/svg%3E")!important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3C6.48 3 2 6.78 2 11.45c0 2.77 1.58 5.23 4.02 6.77L5 22l4.35-2.05c.84.18 1.73.28 2.65.28 5.52 0 10-3.78 10-8.45S17.52 3 12 3Z' fill='black'/%3E%3C/svg%3E")!important;
}

/* 4 Telefon */
.quick-card:nth-child(4) .quick-icon::before{
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.6 3.1 3.5 5 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.2 1.3.4 2.6.7 4 .7.7 0 1.2.5 1.2 1.2v3.5c0 .7-.5 1.2-1.2 1.2C10.3 21.6 2.4 13.7 2.4 3.4c0-.7.5-1.2 1.2-1.2h3.5c.7 0 1.2.5 1.2 1.2 0 1.4.2 2.8.7 4 .1.4 0 .8-.3 1.1l-2.1 2.3Z' fill='black'/%3E%3C/svg%3E")!important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.6 3.1 3.5 5 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.2 1.3.4 2.6.7 4 .7.7 0 1.2.5 1.2 1.2v3.5c0 .7-.5 1.2-1.2 1.2C10.3 21.6 2.4 13.7 2.4 3.4c0-.7.5-1.2 1.2-1.2h3.5c.7 0 1.2.5 1.2 1.2 0 1.4.2 2.8.7 4 .1.4 0 .8-.3 1.1l-2.1 2.3Z' fill='black'/%3E%3C/svg%3E")!important;
}

.quick-card h3{
  margin:0 0 8px!important;
  color:var(--wgr-blue)!important;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:900!important;
}

.quick-card p,
.quick-card .card-text{
  margin:0 0 13px!important;
  color:var(--wgr-muted)!important;
  font-size:14px!important;
  line-height:1.45!important;
}

.quick-card strong{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  color:var(--wgr-blue)!important;
  font-size:13px!important;
  font-weight:900!important;
}

.quick-card strong::after{
  content:"→"!important;
  font-weight:900!important;
}

/* Keine doppelten Pfeile, falls Text schon Pfeil enthält */
.quick-card strong{
  white-space:nowrap!important;
}

/* Hero Buttons nicht von Quickcards überdecken */
.hero-actions{
  position:relative!important;
  z-index:30!important;
}

/* Mobile */
@media(max-width:980px){
  .quick-wrap{
    margin:-44px 22px 0!important;
    max-width:none!important;
  }

  .quick-grid{
    grid-template-columns:1fr!important;
  }

  .quick-card{
    min-height:auto!important;
    grid-template-columns:52px 1fr!important;
    padding:24px!important;
    border-right:0!important;
    border-bottom:1px solid var(--wgr-line)!important;
  }

  .quick-card:last-child{
    border-bottom:0!important;
  }
}