/* ===== KFZ-Bartels Kachel-System (V389) =====
   Gemeinsames Aussehen aller Kacheln: Metall-Verlauf, 3D-Neigung, Glanz, Klick-Effekt.
   Gesteuert von /js/kacheln.js. Respektiert "weniger Bewegung" und den Barrierefrei-Modus. */
@property --gl{syntax:"<percentage>";inherits:false;initial-value:-150%;}
:root{
  --kx-kupfer:linear-gradient(150deg,#a2622a 0%,#7a4414 58%,#4b290c 100%);
  --kx-graphit:linear-gradient(150deg,#59646f 0%,#38414a 58%,#1f252b 100%);
  --kx-petrol:linear-gradient(150deg,#23808a 0%,#17575f 58%,#0b3238 100%);
  --kx-gruen-wa:linear-gradient(150deg,#15874a 0%,#0e6a38 58%,#073f21 100%);
  --kx-gruen-mail:linear-gradient(150deg,#3a8062 0%,#2f6b4f 58%,#173a2a 100%);
  --kx-glow-kupfer:rgba(150,86,30,.55);--kx-glow-graphit:rgba(40,50,60,.55);--kx-glow-petrol:rgba(23,87,95,.55);--kx-glow-gruen:rgba(14,106,56,.55);
  --kx-key:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg transform='rotate(-18 32 32)' fill='none' stroke='white' stroke-opacity='.15' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='17' cy='32' r='11'/%3E%3Cpath d='M28 32h31M47 32v11M56 32v8'/%3E%3C/g%3E%3C/svg%3E");
}
:where(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big){--px:0;--py:0;--mx:50%;--my:28%;--gl:-150%;--kx-t:1;--kx-bg:var(--kx-kupfer);--kx-glow:var(--kx-glow-kupfer);}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big){
  position:relative !important;isolation:isolate;overflow:hidden !important;color:#fff !important;
  border:0 !important;border-radius:18px !important;
  background:
    linear-gradient(105deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 58%) var(--gl) 0 / 250% 100% no-repeat,
    radial-gradient(240px circle at var(--mx) var(--my),rgba(255,255,255,.28),rgba(255,255,255,0) 62%),
    repeating-linear-gradient(100deg,rgba(255,255,255,.06) 0 1px,rgba(255,255,255,0) 1px 4px),
    var(--kx-key) right -10px bottom -14px / 84px 84px no-repeat,
    var(--kx-bg) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34),inset 0 -22px 34px -20px rgba(0,0,0,.5),0 22px 30px -18px var(--kx-glow),0 4px 10px -4px rgba(0,0,0,.35) !important;
  transform:perspective(900px) rotateX(calc(var(--py) * var(--kx-t) * -5deg)) rotateY(calc(var(--px) * var(--kx-t) * 6deg)) !important;
  transform-style:flat !important;will-change:auto !important;
  transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,opacity .55s ease !important;
  -webkit-tap-highlight-color:transparent;
}
/* breite Kacheln neigen sich weniger */
.kb-home .kb-review-card,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home .kb-sv-hint{--kx-t:.3;}
/* Farbwechsel innerhalb einer Gruppe */
:is(.kb-trust-card,.kb-quality-card,.kb-dl-card,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step):nth-child(3n+2){--kx-bg:var(--kx-graphit);--kx-glow:var(--kx-glow-graphit);}
:is(.kb-trust-card,.kb-quality-card,.kb-dl-card,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step):nth-child(3n){--kx-bg:var(--kx-petrol);--kx-glow:var(--kx-glow-petrol);}
html .kb-verified-card.kb-verified-card{--kx-bg:var(--kx-graphit);--kx-glow:var(--kx-glow-graphit);}
html .kb-verified-card.kb-verified-card:nth-child(even){--kx-bg:var(--kx-petrol);--kx-glow:var(--kx-glow-petrol);}
/* Schwerpunkt-Marken immer Kupfer */
html .kb-home .kb-slide.kb-slide:has(.badge){--kx-bg:var(--kx-kupfer);--kx-glow:var(--kx-glow-kupfer);}
/* einzelne Startseiten-Kacheln */
html .kb-home .kb-review-card{--kx-bg:var(--kx-graphit);--kx-glow:var(--kx-glow-graphit);}
html .kb-home .kb-note-box,html .kb-home .kb-rate-box{--kx-bg:var(--kx-graphit);--kx-glow:var(--kx-glow-graphit);}
html .kb-home .kb-sv-hint{--kx-bg:var(--kx-petrol);--kx-glow:var(--kx-glow-petrol);}
html .kb-home a.kb-cta-big.kb-cta-phone{--kx-bg:var(--kx-kupfer);--kx-glow:var(--kx-glow-kupfer);}
html .kb-home a.kb-cta-big.kb-cta-wa{--kx-bg:var(--kx-gruen-wa);--kx-glow:var(--kx-glow-gruen);}
html .kb-home a.kb-cta-big.kb-cta-mail{--kx-bg:var(--kx-gruen-mail);--kx-glow:var(--kx-glow-petrol);}
/* Schrift in den Kacheln: weiß, bessere Lesbarkeit */
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) :is(h1,h2,h3,h4,h5,h6,p,li,small,strong,b,em,i,div,dt,dd,label,span:not([style*="background"]):not(.badge)){color:inherit !important;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) a:not(.btn):not(.kb-btn):not(.kb-cta-big){color:#fff !important;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) a:not(.btn):not(.kb-btn):not(.kb-cta-big):hover{text-decoration-thickness:2px;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) a.kb-btn.secondary{color:#fff !important;background:rgba(255,255,255,.16) !important;border:1px solid rgba(255,255,255,.4) !important;text-decoration:none;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) a.kb-btn.primary{text-decoration:none;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) .num{color:#fff !important;text-shadow:0 2px 0 rgba(0,0,0,.28);}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) .ico{background:rgba(255,255,255,.18) !important;border:1px solid rgba(255,255,255,.34) !important;color:#fff !important;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) .ico svg{color:#fff;stroke:currentColor;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) .badge{background:rgba(255,255,255,.2) !important;color:#fff !important;border:1px solid rgba(255,255,255,.4) !important;}
.kb-verified-card .stars.stars.stars,.kb-home .kb-review-card .stars.stars.stars{color:#ffd791 !important;}
.kb-verified-card::before,.kb-home .kb-review-card::before{color:#fff !important;opacity:.14 !important;}
.kb-trust-card::before{display:none !important;}
a.kb-blog-card{cursor:pointer;text-decoration:none !important;}
/* Hover (nur Maus) */
@media (hover:hover) and (pointer:fine){
  :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big):hover{transition:transform .12s ease-out,box-shadow .35s ease,opacity .55s ease !important;will-change:transform !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -22px 34px -20px rgba(0,0,0,.5),0 30px 38px -18px var(--kx-glow),0 6px 14px -4px rgba(0,0,0,.4) !important;}
}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big):active{transform:perspective(900px) scale(.975) !important;transition:transform .08s ease-out !important;}
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big):focus-within{outline:3px solid var(--yellow);outline-offset:3px;}
a.kb-blog-card:focus-visible,.kb-home a.kb-cta-big:focus-visible{outline:3px solid #fff;outline-offset:-7px;box-shadow:0 0 0 3px var(--yellow) !important;}
/* Glanz, einmal beim Einblenden */
:is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big).kx-in{animation:kxGlint 1.15s cubic-bezier(.3,.6,.3,1) calc(var(--kxi,0) * 90ms) 1 both;}
@keyframes kxGlint{from{--gl:-150%;}to{--gl:150%;}}
/* Klick-Ring */
.kx-ring{position:absolute;z-index:5;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:rgba(255,255,255,.6);pointer-events:none;animation:kxRing .62s ease-out forwards;}
@keyframes kxRing{from{transform:scale(0);opacity:.7;}to{transform:scale(13);opacity:0;}}
/* Rücksicht: weniger Bewegung, Barrierefrei-Modus, Druck */
@media (prefers-reduced-motion:reduce){
  :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big){transition:none !important;transform:none !important;}
  :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big).kx-in{animation:none !important;}
  .kx-ring{display:none !important;}
}
html.kb-a11y-mode :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big){transform:none !important;transition:none !important;}
html.kb-a11y-mode :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big).kx-in{animation:none !important;}
@media print{
  :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big){background:#fff !important;color:#000 !important;box-shadow:none !important;border:1px solid #999 !important;transform:none !important;}
  :is(.kb-trust-card,.kb-quality-card,.kb-verified-card,.kb-dl-card,.kacheln>div,a.kb-blog-card,.kb-home .kb-slide,.kb-home .kb-protocol-strip .step,.kb-home .kb-review-card,.kb-home .kb-sv-hint,.kb-home .kb-note-box,.kb-home .kb-rate-box,.kb-home .kb-hilfe-banner,.kb-home a.kb-cta-big) *{color:#000 !important;}
}

/* V397: ganze Kachel anklickbar, wenn sie genau ein Ziel hat */
.kx-klick{cursor:pointer;}
