/* S-Redaktion 1.5.35 – kompakte, lebendige Servicekacheln.
   Greift ausschließlich innerhalb der Startseiten-Serviceübersicht. */
.srt-site .srp-services-grid .svc {
  --svc-accent:#4667ad;
  --svc-soft:#eaf0ff;
  --svc-line:#becde8;
  position:relative;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  min-height:85px;
  padding:13px 14px 13px 18px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:12px;
  background:linear-gradient(115deg,var(--card) 69%,var(--svc-soft) 195%);
  color:var(--ink);
  box-shadow:0 1px 0 rgba(22,42,68,.025);
  text-decoration:none;
  isolation:isolate;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .24s ease;
}
.srt-site .srp-services-grid .svc::before {
  content:"";
  position:absolute;
  left:0;top:19%;bottom:19%;width:3px;
  background:var(--svc-accent);
  border-radius:0 3px 3px 0;
  opacity:.73;
  transform:scaleY(.68);
  transition:transform .25s ease,opacity .25s ease;
}
/* Kleines rotes Markenzeichen erscheint beim Berühren der Kachel. */
.srt-site .srp-services-grid .svc::after {
  content:"";
  position:absolute;
  right:11px;top:10px;
  width:5px;height:5px;
  border-radius:1px;
  background:#f04d43;
  opacity:0;
  transform:scale(.5) rotate(-22deg);
  transition:opacity .25s ease,transform .25s ease;
}
.srt-site .srp-services-grid .svc .ico {
  flex:0 0 42px;
  width:42px;height:42px;
  margin:0;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:var(--svc-soft);
  color:var(--svc-accent);
  line-height:1;
  transition:transform .26s cubic-bezier(.2,.7,.2,1.3),background .22s ease;
}
.srt-site .srp-services-grid .srt-svc-icon {
  width:21px;height:21px;display:block;overflow:visible;
  transform-origin:50% 50%;
}
.srt-site .srp-services-grid .svc-copy {flex:1 1 auto;min-width:0;line-height:1.32}
.srt-site .srp-services-grid .svc strong {display:block;font-size:14px;letter-spacing:-.18px;font-weight:750;color:var(--ink)}
.srt-site .srp-services-grid .svc small {display:block;font-size:11px;line-height:1.4;margin-top:5px;color:var(--muted)}
.srt-site .srp-services-grid .svc-end {
  width:20px;height:20px;flex:0 0 20px;
  align-self:center;
  display:grid;place-items:center;
  color:var(--svc-accent);
  opacity:0;
  transform:translate(-6px,6px);
  transition:opacity .24s ease,transform .24s ease;
}
.srt-site .srp-services-grid .svc-end svg{width:16px;height:16px;display:block}
.srt-site .srp-services-grid .svc[data-srp-service="damals"]{--svc-accent:#a87627;--svc-soft:#fff1d8;--svc-line:#e7bf81}
.srt-site .srp-services-grid .svc[data-srp-service="verkehr"]{--svc-accent:#ba5a2d;--svc-soft:#fff0e7;--svc-line:#e9ad8b}
.srt-site .srp-services-grid .svc[data-srp-service="blaulicht"]{--svc-accent:#2765c5;--svc-soft:#e6eeff;--svc-line:#9cbdf1}
.srt-site .srp-services-grid .svc[data-srp-service="kino"]{--svc-accent:#6b59bc;--svc-soft:#f0edff;--svc-line:#c5b8eb}
.srt-site .srp-services-grid .svc[data-srp-service="weekend"]{--svc-accent:#bd811d;--svc-soft:#fff3dc;--svc-line:#f1c78d}
.srt-site .srp-services-grid .svc[data-srp-service="touren"]{--svc-accent:#227f69;--svc-soft:#e5f6ee;--svc-line:#a1d9c6}
.srt-site .srp-services-grid .svc[data-srp-service="veranstaltungen"]{--svc-accent:#326ed3;--svc-soft:#e8f0ff;--svc-line:#abc6f5}
.srt-site .srp-services-grid .svc[data-srp-service="gewinnen"]{--svc-accent:#bb518a;--svc-soft:#fceaf3;--svc-line:#edb2ce}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .srt-site .srp-services-grid .svc:hover {
    transform:translateY(-3px);
    border-color:var(--svc-line);
    background:linear-gradient(115deg,var(--card) 34%,var(--svc-soft) 160%);
    box-shadow:0 10px 23px rgba(24,45,72,.09),0 2px 7px rgba(24,45,72,.04);
  }
  .srt-site .srp-services-grid .svc:hover .ico{transform:scale(1.07)}
  .srt-site .srp-services-grid .svc:hover .svc-end{opacity:1;transform:translate(0,0)}
  .srt-site .srp-services-grid .svc:hover::after{opacity:1;transform:scale(1) rotate(0)}
  .srt-site .srp-services-grid .svc[data-srp-service="damals"]:hover .srt-svc-icon{animation:srt-service-tick .7s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="verkehr"]:hover .srt-svc-icon{animation:srt-service-shift .55s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="blaulicht"]:hover .srt-svc-icon{animation:srt-service-flash .65s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="kino"]:hover .srt-svc-icon{animation:srt-service-tilt .6s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="weekend"]:hover .srt-svc-icon{animation:srt-service-turn .9s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="touren"]:hover .srt-svc-icon{animation:srt-service-shift .55s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="veranstaltungen"]:hover .srt-svc-icon{animation:srt-service-tilt .6s ease-out}
  .srt-site .srp-services-grid .svc[data-srp-service="gewinnen"]:hover .srt-svc-icon{animation:srt-service-twinkle .65s ease-out}
}
.srt-site .srp-services-grid .svc:focus-visible {
  border-color:var(--svc-accent);
  box-shadow:0 0 0 3px var(--svc-soft);
  outline:2px solid var(--svc-accent);
  outline-offset:2px;
}
.srt-site .srp-services-grid .svc:is(:hover,:focus-visible)::before{transform:scaleY(1);opacity:1}
.srt-site .srp-services-grid .svc:focus-visible .svc-end{opacity:1;transform:translate(0,0)}
.srt-site .srp-services-grid .svc:focus-visible::after{opacity:1;transform:none}
.srt-site .srp-services-grid .srp-service-missing {border-style:dashed;opacity:.85}
/* Kontrast im bestehenden Dunkelmodus; die Farbzuordnung bleibt erkennbar. */
.srt-site.dark .srp-services-grid .svc,
.dark .srt-site .srp-services-grid .svc {
  background:linear-gradient(115deg,var(--card) 70%,#263c55 160%);
  border-color:var(--line);
}
.srt-site.dark .srp-services-grid .svc .ico,
.dark .srt-site .srp-services-grid .svc .ico{background:#2c4057;color:#d9e7ff}
.srt-site.dark .srp-services-grid .svc:hover,
.dark .srt-site .srp-services-grid .svc:hover{background:linear-gradient(115deg,var(--card) 40%,#2c4662 160%);border-color:#657f9d}
@keyframes srt-service-tick{0%,100%{transform:rotate(0)}35%{transform:rotate(16deg)}70%{transform:rotate(-7deg)}}
@keyframes srt-service-shift{0%,100%{transform:translateX(0)}40%{transform:translateX(2px)}70%{transform:translateX(-1px)}}
@keyframes srt-service-flash{0%,100%{opacity:1}25%,75%{opacity:.45}50%{opacity:1}}
@keyframes srt-service-tilt{0%,100%{transform:rotate(0)}45%{transform:rotate(-11deg)}}
@keyframes srt-service-turn{from{transform:rotate(0)}to{transform:rotate(90deg)}}
@keyframes srt-service-twinkle{0%,100%{transform:scale(1)}50%{transform:scale(1.16)}}
@keyframes srt-service-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:no-preference){
  .srt-site .srp-services-grid .svc{animation:srt-service-enter .43s cubic-bezier(.2,.75,.25,1) backwards}
  .srt-site .srp-services-grid .svc:nth-child(2){animation-delay:35ms}
  .srt-site .srp-services-grid .svc:nth-child(3){animation-delay:70ms}
  .srt-site .srp-services-grid .svc:nth-child(4){animation-delay:105ms}
  .srt-site .srp-services-grid .svc:nth-child(5){animation-delay:140ms}
  .srt-site .srp-services-grid .svc:nth-child(6){animation-delay:175ms}
  .srt-site .srp-services-grid .svc:nth-child(7){animation-delay:210ms}
  .srt-site .srp-services-grid .svc:nth-child(8){animation-delay:245ms}
}
@media (max-width:1100px){
  .srt-site .srp-services-grid .svc{gap:9px;padding:12px 11px 12px 15px}
  .srt-site .srp-services-grid .svc .ico{width:38px;height:38px;flex-basis:38px}
  .srt-site .srp-services-grid .svc strong{font-size:13px}
  .srt-site .srp-services-grid .svc-end{width:15px;flex-basis:15px}
}
@media (max-width:700px){
  .srt-site .srp-services-grid .svc{display:flex;align-items:center;min-height:73px;gap:9px;padding:10px 9px 10px 13px}
  .srt-site .srp-services-grid .svc .ico{width:32px;height:32px;flex-basis:32px;margin:0;border-radius:8px}
  .srt-site .srp-services-grid .srt-svc-icon{width:18px;height:18px}
  .srt-site .srp-services-grid .svc strong{font-size:12px}
  .srt-site .srp-services-grid .svc small{font-size:10px;line-height:1.3;margin-top:3px}
  .srt-site .srp-services-grid .svc-end{display:none}
}
@media (max-width:360px){
  .srt-site .srp-services-grid .svc{display:flex;gap:7px;padding:8px}
  .srt-site .srp-services-grid .svc .ico{width:29px;height:29px;flex-basis:29px;margin:0}
  .srt-site .srp-services-grid .svc strong{font-size:11px}
  .srt-site .srp-services-grid .svc small{font-size:9px}
}
@media (prefers-reduced-motion:reduce){
  .srt-site .srp-services-grid .svc,
  .srt-site .srp-services-grid .svc::before,
  .srt-site .srp-services-grid .svc::after,
  .srt-site .srp-services-grid .ico,
  .srt-site .srp-services-grid .svc-end,
  .srt-site .srp-services-grid .srt-svc-icon{animation:none!important;transition:none!important;transform:none!important}
}
