/* ==========================================================================
   MFM Premium 2610 – Modul „tools“
   Rechner, Werkzeuge, Service-Widgets (Fahrtkosten, LED, Telefon, Zähler-Check, Toolbox …)
   Die Plugins bringen ihr eigenes Premium-CSS mit (Tokens --mx-* mit Fallback).
   Diese Datei richtet nur das ein, was im Seiteninhalt (Inline-<style>-Blöcke in der DB)
   steht und deshalb nicht im Plugin geändert werden kann, und die Einbettung der Widgets.
   ========================================================================== */

/* ---------- 1) Seiteninhalt-Blöcke der Seite „Fahrtkosten“ (mfmfair, mfmbadges, mfmrules) ---- */
.entry-content .mfmfair,
.entry-content .mfmrules,
.entry-content .mfmftease {
  --mf-ink: var(--mx-ink, #0f1b2d);
  --mf-body: var(--mx-text-2, #55606f);
  --mf-line: var(--mx-line, #dcdfe4);
  --mf-teal: var(--mx-ink, #0f1b2d);
  --mf-teal-dark: var(--mx-ink, #0f1b2d);
  --mf-tint: var(--mx-bg-alt, #f4f4f1);
  --mf-chip: transparent;
  --mf-grey: var(--mx-bg-alt, #f4f4f1);
  --mr-teal: var(--mx-ink, #0f1b2d);
  --mr-teal-dark: var(--mx-ink, #0f1b2d);
  --mr-tint: var(--mx-bg-alt, #f4f4f1);
  --mr-chip: transparent;
  --mr-ink: var(--mx-ink, #0f1b2d);
  --mr-body: var(--mx-text-2, #55606f);
  --mr-line: var(--mx-line, #dcdfe4);
  font-family: var(--mx-font, "Inter Variable", system-ui, sans-serif);
}

/* Faire Anfahrt – großer Block */
.entry-content .mfmfair {
  background: var(--mx-bg-alt, #f4f4f1);
  border: 0;
  border-radius: var(--mx-radius-lg, 4px);
  padding: clamp(1.5rem, 4vw, 3rem);
  margin: 2.5rem 0;
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmfair-kicker,
.entry-content .mfmrules-kicker {
  display: block;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  font: 600 .75rem/1.3 var(--mx-font, "Inter Variable", system-ui, sans-serif);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--mx-accent-strong, #0a4a8f);
}
.entry-content .mfmfair-kicker svg,
.entry-content .mfmrules-kicker svg {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: .5rem;
  vertical-align: -2px;
  stroke-width: 1.8;
}
.entry-content .mfmfair h2,
.entry-content .mfmrules h2 {
  font-family: var(--mx-font, "Inter Variable", system-ui, sans-serif);
  font-weight: 300;
  letter-spacing: -.022em;
  font-size: clamp(1.6rem, 3vw, 2.35rem);
  line-height: 1.15;
  max-width: 28ch;
  margin: 1rem 0 .9rem;
  color: var(--mx-ink, #0f1b2d);
}
.entry-content .mfmfair-lead,
.entry-content .mfmrules-lead {
  max-width: 66ch;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmfair-lead strong,
.entry-content .mfmrules-lead strong,
.entry-content .mfmfair strong {
  color: var(--mx-ink, #0f1b2d);
  font-weight: 600;
}

/* Vergleich: andere / wir */
.entry-content .mfmfair-vs {
  gap: 1.25rem;
  margin-top: 2rem;
}
.entry-content .mfmfair-col {
  background: #fff;
  border: 1px solid var(--mx-line, #dcdfe4);
  border-radius: var(--mx-radius, 3px);
}
.entry-content .mfmfair-col.-mfm {
  border: 1px solid var(--mx-ink, #0f1b2d);
}
.entry-content .mfmfair-colhead {
  padding: 1rem 1.25rem;
  background: none;
  border-bottom: 1px solid var(--mx-line, #dcdfe4);
  font: 600 .75rem/1.3 var(--mx-font, "Inter Variable", system-ui, sans-serif);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmfair-col.-mfm .mfmfair-colhead {
  background: var(--mx-ink, #0f1b2d);
  border-bottom: 0;
  color: #fff;
}
.entry-content .mfmfair-col ul {
  padding: .5rem 0;
  margin: 0;
  max-width: none;
}
.entry-content .mfmfair-col li {
  margin: 0;
  padding: .8rem 1.25rem;
  font-size: .9688rem;
  line-height: 1.5;
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmfair-col li + li {
  border-top: 1px solid var(--mx-line, #dcdfe4);
}
.entry-content .mfmfair-col li svg {
  stroke-width: 1.8;
}
.entry-content .mfmfair-col.-andere li svg {
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmfair-col.-mfm li svg {
  color: var(--mx-ink, #0f1b2d);
}
.entry-content .mfmfair-note,
.entry-content .mfmrules-note {
  margin-top: 1rem;
  max-width: 70ch;
  font-size: .875rem;
  line-height: 1.6;
  color: var(--mx-text-2, #55606f);
}

/* Garantie-Karten */
.entry-content .mfmfair-grid {
  gap: 1.25rem;
  margin-top: 2rem;
}
.entry-content .mfmfair-card {
  background: #fff;
  border: 1px solid var(--mx-line, #dcdfe4);
  border-radius: var(--mx-radius, 3px);
  padding: 1.5rem 1.5rem 1.4rem;
}
.entry-content .mfmfair-ico,
.entry-content .mfmrules-ico {
  width: auto;
  height: auto;
  margin: 0 0 1rem;
  background: none;
  border-radius: 0;
  color: var(--mx-ink, #0f1b2d);
  justify-content: flex-start;
}
.entry-content .mfmfair-ico svg,
.entry-content .mfmrules-ico svg {
  width: 28px;
  height: 28px;
  stroke-width: 1.4;
}
.entry-content .mfmfair-card h3,
.entry-content .mfmrules-card h3,
.entry-content .mfmrules-example h3 {
  font-family: var(--mx-font, "Inter Variable", system-ui, sans-serif);
  font-weight: 500;
  font-size: 1.125rem;
  letter-spacing: -.01em;
  margin: 0 0 .4rem;
  color: var(--mx-ink, #0f1b2d);
}
.entry-content .mfmfair-card p,
.entry-content .mfmrules-card p,
.entry-content .mfmrules-example p {
  max-width: none;
  font-size: .9688rem;
  line-height: 1.6;
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmfair-card strong,
.entry-content .mfmrules-card strong {
  color: var(--mx-ink, #0f1b2d);
  font-weight: 600;
}
.entry-content .mfmfair-seal {
  margin-top: 1.25rem;
  gap: 1rem;
  padding: 1.1rem 1.4rem;
  background: var(--mx-stage, #0b1220);
  border-radius: var(--mx-radius, 3px);
  color: #fff;
}
.entry-content .mfmfair-seal svg {
  stroke-width: 1.5;
  color: var(--mx-warm, #f2b84b);
}
.entry-content .mfmfair-seal p {
  max-width: none;
  margin: 0;
  color: var(--mx-on-stage-2, #c3cbd7);
}
.entry-content .mfmfair-seal strong {
  font-family: var(--mx-font, "Inter Variable", system-ui, sans-serif);
  font-weight: 600;
  color: #fff;
}

/* „Im Festpreis enthalten“ */
.entry-content .mfmbadges {
  gap: .5rem;
  margin: 1.5rem 0 .5rem;
  font-family: var(--mx-font, "Inter Variable", system-ui, sans-serif);
}
.entry-content .mfmbadges-label {
  font: 600 .75rem/1.3 var(--mx-font, "Inter Variable", system-ui, sans-serif);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mx-text-2, #55606f);
  margin-right: .5rem;
}
.entry-content .mfmbadge {
  gap: .5rem;
  background: #fff;
  color: var(--mx-ink, #0f1b2d);
  border: 1px solid var(--mx-line, #dcdfe4);
  border-radius: var(--mx-radius, 3px);
  padding: .5rem .8rem;
  font-size: .8438rem;
  font-weight: 500;
  line-height: 1.2;
}
.entry-content .mfmbadge svg {
  stroke-width: 1.8;
}

/* Wie oft die Pauschale berechnet wird */
.entry-content .mfmrules {
  background: #fff;
  border: 0;
  border-top: 1px solid var(--mx-ink, #0f1b2d);
  border-radius: 0;
  padding: clamp(1.5rem, 3vw, 2.5rem) 0 0;
  margin: 3rem 0;
}
.entry-content .mfmrules-grid {
  gap: 1.25rem;
  margin-top: 2rem;
}
.entry-content .mfmrules-card {
  background: #fff;
  border: 1px solid var(--mx-line, #dcdfe4);
  border-radius: var(--mx-radius, 3px);
  padding: 1.5rem;
}
.entry-content .mfmrules-head {
  display: block;
  margin-bottom: .4rem;
}
.entry-content .mfmrules-example {
  margin-top: 1.25rem;
  background: var(--mx-bg-alt, #f4f4f1);
  border: 0;
  border-radius: var(--mx-radius, 3px);
  padding: 1.5rem;
}
.entry-content .mfmrules-calc {
  max-width: 56ch;
  margin: 0 0 1rem;
}
.entry-content .mfmrules-calc li {
  margin: 0;
  padding: .65rem 0;
  font-size: .9688rem;
  border-bottom: 1px solid var(--mx-line, #dcdfe4);
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmrules-calc li:last-child {
  margin-top: 0;
  border-top: 0;
  border-bottom: 0;
  font-weight: 500;
  color: var(--mx-ink, #0f1b2d);
}
.entry-content .mfmrules-calc span:last-child {
  color: var(--mx-ink, #0f1b2d);
  font-weight: 500;
}

/* Teaser auf der Kundendienst-Seite */
.entry-content .mfmftease {
  gap: 1.25rem 1.5rem;
  padding: 1.25rem 1.5rem;
  margin: 2rem 0;
  background: var(--mx-bg-alt, #f4f4f1);
  border: 0;
  border-left: 3px solid var(--mx-ink, #0f1b2d);
  border-radius: var(--mx-radius, 3px);
}
.entry-content .mfmftease-ico {
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
  color: var(--mx-ink, #0f1b2d);
}
.entry-content .mfmftease-ico svg {
  width: 30px;
  height: 30px;
  stroke-width: 1.4;
}
.entry-content .mfmftease-txt h3 {
  font-family: var(--mx-font, "Inter Variable", system-ui, sans-serif);
  font-weight: 500;
  font-size: 1.125rem;
  letter-spacing: -.01em;
  margin: 0 0 .25rem;
  color: var(--mx-ink, #0f1b2d);
}
.entry-content .mfmftease-txt p {
  max-width: 60ch;
  margin: 0;
  font-size: .9688rem;
  line-height: 1.55;
  color: var(--mx-text-2, #55606f);
}
.entry-content .mfmftease-txt strong {
  color: var(--mx-ink, #0f1b2d);
  font-weight: 600;
}
.entry-content .mfmftease-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 1.75rem;
  background: var(--mx-ink, #0f1b2d);
  border: 1px solid var(--mx-ink, #0f1b2d);
  border-radius: var(--mx-radius, 3px);
  font: 500 .9375rem/1 var(--mx-font, "Inter Variable", system-ui, sans-serif);
  color: #fff !important;
  text-decoration: none !important;
  transition: background .3s, border-color .3s;
}
.entry-content .mfmftease-cta:hover {
  background: #25334a;
  border-color: #25334a;
}

@media (max-width: 760px) {
  .entry-content .mfmfair-vs,
  .entry-content .mfmfair-grid,
  .entry-content .mfmrules-grid { grid-template-columns: 1fr; }
  .entry-content .mfmftease-cta { width: 100%; }
}