/* ==========================================================================
   Stilkur – Runde 2 (29.09.2026)
   K2: Karten weiß mit Haarlinie, Label im schrägen Farbkeil oben links (statt Farbbalken + Weichschatten).
   C1: persönlicher Kontaktblock auf Markenblau statt zentriertem "Noch Fragen?"-Band.
   Rollback: zsh _snapshot-stilkur-2026-09-29/restore-stilkur.sh
   ========================================================================== */

:root {
  --sk-line: #DCE7EC;
  --sk-cut: 12px;
}

/* --- K2 Karten ------------------------------------------------------------ */
.sms-level-card,
.sms-review-card,
.sms-offer-card {
  border: 1px solid var(--sk-line);
  border-top-width: 1px;
  border-radius: 0;
  box-shadow: none;
}
.sms-level-card.sms-lv-green,
.sms-review-card.sms-rv-green,
.sms-offer-card.sms-of-green {
  border-top-color: var(--sk-line);
}
.sms-level-card { display: flex; flex-direction: column; padding: 0 22px 24px; }
.sms-review-card { padding: 0 22px 24px; }
.sms-offer-card { padding: 0 26px 28px; }

/* der Keil */
.sms-level-card .sms-lv-age,
.sms-review-card .sms-review-stars,
.sms-offer-card .sms-offer-lab {
  order: -1;
  align-self: flex-start;
  display: inline-block;
  margin: 0 0 18px -22px;
  padding: 7px calc(20px + var(--sk-cut)) 7px 22px;
  background: var(--wp--preset--color--primary);
  color: #fff;
  opacity: 1;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  clip-path: polygon(0 0, 100% 0, calc(100% - var(--sk-cut)) 100%, 0 100%);
  flex: none;
}
.sms-offer-card .sms-offer-lab { margin-left: -26px; padding-left: 26px; }
.sms-review-card .sms-review-stars { font-size: 0.85rem; letter-spacing: 3px; }
.sms-level-card.sms-lv-green .sms-lv-age,
.sms-review-card.sms-rv-green .sms-review-stars,
.sms-offer-card.sms-of-green .sms-offer-lab {
  background: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--contrast);
}
.sms-level-card h3 { margin: 0 0 10px; font-size: 1.35rem; }
.sms-offer-card h3 { margin-top: 0; }

/* --- C1 Kontaktblock ------------------------------------------------------ */
.sms-contact-cta { text-align: left; }
.sms-contact-cta > * { margin-block: 0; }
.sms-contact-cta .sms-cc-label {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.88;
  margin: 0 0 12px;
}
.sms-contact-cta .sms-cc-head {
  font-family: var(--wp--preset--font-family--big-shoulders);
  font-weight: 900;
  text-transform: uppercase;
  font-size: clamp(2.4rem, 5vw, 4rem);
  line-height: 0.92;
  letter-spacing: 0.005em;
  margin: 0;
  color: inherit;
  text-wrap: balance;
}
.sms-contact-cta .sms-cc-tel {
  font-family: var(--wp--preset--font-family--big-shoulders);
  font-weight: 800;
  font-size: clamp(2.2rem, 4.6vw, 3.4rem);
  line-height: 1;
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
  margin: 22px 0 10px;
}
.sms-contact-cta .sms-cc-tel a {
  color: inherit;
  text-decoration: none;
  border-bottom: 4px solid transparent;
  transition: border-color 0.18s ease;
}
.sms-contact-cta .sms-cc-tel a:hover,
.sms-contact-cta .sms-cc-tel a:focus-visible { border-bottom-color: var(--wp--preset--color--secondary); outline: none; }
.sms-contact-cta .sms-cc-when,
.sms-contact-cta .sms-cc-mail { font-size: 1.02rem; line-height: 1.5; margin: 0; opacity: 0.92; }
.sms-contact-cta .sms-cc-mail a { color: inherit; text-decoration-color: var(--wp--preset--color--secondary); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.sms-contact-cta .sms-cc-actions { margin-top: 28px; justify-content: flex-start; }

@media (prefers-reduced-motion: reduce) {
  .sms-contact-cta .sms-cc-tel a { transition: none; }
}

/* --- Logo-Band über dem Footer (und im Startseiten-Hero) ------------------ */
/* Kein automatischer Blockabstand über dem Footer: sonst sitzt das Band ~10 px zu tief im weißen Streifen. */
.wp-site-blocks > footer.wp-block-template-part { margin-block-start: 0; }
/* Farbwechsel Blau → Grün genau hinter dem Logo statt schräg links daneben. */
.sms-hero5-band .sms-hero5-line {
  background: linear-gradient(90deg,
    var(--wp--preset--color--primary) 0,
    var(--wp--preset--color--primary) calc(50% - 22px),
    var(--wp--preset--color--secondary) calc(50% + 22px),
    var(--wp--preset--color--secondary) 100%);
}
