/* RP Bot: große, gut lesbare Hero-Vorteilskarten */
.hero .metrics {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px !important;
  width:min(100%,900px);
  margin-top:52px !important;
  align-items:stretch;
}
.hero .metrics > div {
  min-width:0 !important;
  min-height:148px;
  box-sizing:border-box;
  padding:24px 24px 22px 82px !important;
  border:1px solid rgba(101,193,255,.33) !important;
  border-radius:18px;
  background:linear-gradient(130deg,rgba(30,55,102,.95),rgba(20,21,58,.93)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 36px rgba(2,7,24,.36);
  position:relative;
  overflow:visible !important;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease !important;
}
.hero .metrics > div::before {
  content:'✦'; position:absolute;left:22px;top:25px;
  width:43px;height:43px;border-radius:12px;display:grid;place-items:center;
  font-size:25px;color:#9cefff;background:rgba(48,142,221,.15);
  border:1px solid rgba(119,219,255,.28);
}
.hero .metrics > div:nth-child(1)::before{content:'🧩'}
.hero .metrics > div:nth-child(2)::before{content:'🎛️'}
.hero .metrics > div:nth-child(3)::before{content:'🎮'}
.hero .metrics strong {
  display:block;font-size:20px;line-height:1.3;font-weight:800;color:#f7fbff;
  white-space:normal;overflow-wrap:break-word;
}
.hero .metrics small {
  display:block;margin-top:9px;color:#bfd5ed;font-size:14px;line-height:1.5;
  white-space:normal;overflow-wrap:anywhere;
}
.hero .metrics > div:hover {
  transform:translateY(-5px) !important;
  border-color:rgba(107,224,255,.9) !important;
  box-shadow:0 20px 43px rgba(4,14,41,.55),0 0 25px rgba(46,188,255,.14) !important;
}
@media(max-width:880px){.hero .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.hero .metrics{grid-template-columns:1fr;gap:12px!important}.hero .metrics>div{min-height:112px;padding:19px 18px 18px 77px!important}.hero .metrics>div::before{left:18px;top:19px}}
@media(prefers-reduced-motion:reduce){.hero .metrics>div{transition:none!important}.hero .metrics>div:hover{transform:none!important}}