/* ------------------------------------------------ /medat-aufbau (Präfix ma-)
   Gewichtungsbalken, Untertest-Tabelle, Testteil-Karten, Rechenbeispiel. */

.r-band .ma-mitte { text-align: center; max-width: 700px; margin-left: auto; margin-right: auto; }
.ma-schmal { max-width: 712px; margin: 0 auto; }

/* Kennzeichen „nur H“ / „nur Z“ */
.ma-nur { display: inline-block; padding: 3px 8px; border-radius: 999px; background: var(--akzent-hauch); color: var(--akzent-tief); font: 700 10.5px/1.2 "Work Sans", sans-serif; letter-spacing: 0.08em; text-transform: uppercase; vertical-align: 2px; white-space: nowrap; }

/* Gewichtung: zwei gestapelte Balken */
.ma-gewicht { display: grid; gap: 22px; margin: 34px 0 34px; }
.ma-zeile { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 18px; align-items: center; }
.r-band .ma-zeile-kopf { margin: 0; display: grid; gap: 2px; line-height: 1.2; }
.r-band .ma-zeile-kopf strong { font: 800 20px/1.2 "Manrope", sans-serif; letter-spacing: -0.02em; }
.ma-zeile-kopf span { font: 400 14px/1.3 "Work Sans", sans-serif; color: var(--r-leise); }
.ma-balken { display: flex; gap: 4px; height: 78px; }
.ma-balken a { flex: var(--w) 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border-radius: 14px; background: var(--akzent); color: #fff; text-decoration: none; transition: filter 0.15s; }
.ma-balken a:hover { filter: brightness(1.08); }
.r-band .ma-balken b { font: 800 18px/1 "Manrope", sans-serif; letter-spacing: -0.01em; color: inherit; }
.ma-balken span { font: 600 14px/1 "Work Sans", sans-serif; opacity: 0.92; white-space: nowrap; }

/* Tabelle aller Untertests */
.ma-tabelle table { min-width: 560px; }
.ma-tabelle .zahl { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ma-tabelle td.mitte { vertical-align: middle; }
.ma-tabelle td.leer { color: var(--r-leise); }
.ma-tabelle small { display: block; font-size: 12.5px; color: var(--r-leise); font-weight: 400; }
.ma-tabelle td:first-child .ma-nur { margin-left: 4px; }
.ma-kurz { display: none; }
.r-tabelle .ma-gruppe th { padding: 18px 18px 10px; background: transparent; border-bottom: 0; border-top: 1px solid var(--r-linie); color: var(--akzent-tief); font: 700 12px/1.3 "Work Sans", sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.r-tabelle tbody:first-of-type .ma-gruppe th { border-top: 0; }
.r-tabelle .ma-gruppe + tr td { border-top: 0; }
.r-band .ma-tabelle td a { color: var(--r-kopf); font-weight: 600; text-decoration-color: var(--akzent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.r-band .ma-tabelle td a:hover { color: var(--akzent-tief); }
.ma-tabelle tbody tr:not(.ma-gruppe) td:first-child { border-left: 4px solid var(--akzent); }

/* Testteil-Karten */
.ma-teile { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 12px; align-items: start; }
.ma-stapel { display: grid; gap: 18px; }
.ma-teil { padding: 26px 26px 14px; border-radius: 22px; background: var(--r-weiss); box-shadow: inset 0 5px 0 var(--akzent); }
.r-band .ma-teil-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 4px 0 4px; }
.r-band .ma-teil-kopf strong { font: 800 21px/1.25 "Manrope", sans-serif; letter-spacing: -0.02em; }
.r-band .ma-teil-kopf b { font: 800 34px/1 "Manrope", sans-serif; letter-spacing: -0.04em; color: var(--akzent); white-space: nowrap; }
.r-band .ma-teil-unter { margin: 0 0 12px; font-size: 15.5px; line-height: 1.55; color: var(--r-leise); }
.ma-teil ul { list-style: none; margin: 0; padding: 0; }
.r-band .ma-teil li { padding: 12px 0; border-top: 1px solid var(--r-linie); font-size: 16px; line-height: 1.55; }
.r-band .ma-link { display: block; margin-bottom: 2px; font: 800 16.5px/1.35 "Manrope", sans-serif; letter-spacing: -0.01em; color: var(--r-kopf); text-decoration: none; }
.r-band .ma-link::after { content: " →"; color: var(--akzent); }
.r-band .ma-link:hover { color: var(--akzent-tief); text-decoration: underline; text-decoration-color: var(--akzent); }

/* Rechenbeispiel */
.ma-rechnung { margin: 40px 0 34px; padding: 26px 28px 24px; border-radius: 22px; background: var(--r-hell); }
.ma-rechnung figcaption { margin-bottom: 12px; text-align: center; font: 700 12.5px/1.2 "Work Sans", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; color: var(--akzent); }
.ma-r-zeile { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto 52px; gap: 6px 14px; align-items: center; padding: 12px 0; border-top: 1px solid var(--r-linie); font: 300 16px/1.45 "Work Sans", sans-serif; color: var(--r-text); }
.ma-r-teil { justify-self: start; padding: 4px 9px; border-radius: 8px; background: var(--akzent); color: #fff; font: 800 13px/1 "Manrope", sans-serif; letter-spacing: 0.02em; }
.ma-r-mal { color: var(--r-leise); white-space: nowrap; font-variant-numeric: tabular-nums; }
.r-band .ma-r-zeile b { text-align: right; font: 700 18px/1 "Manrope", sans-serif; color: var(--r-kopf); font-variant-numeric: tabular-nums; }
.ma-r-summe { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-top: 16px; border-top: 2px solid var(--r-kopf); }
.r-band .ma-r-summe strong { font: 800 19px/1.2 "Manrope", sans-serif; }
.r-band .ma-r-summe b { font: 800 44px/1 "Manrope", sans-serif; letter-spacing: -0.04em; color: var(--akzent); font-variant-numeric: tabular-nums; }

@media (prefers-color-scheme: dark) {
  .ma-balken a, .ma-r-teil { color: #1b1815; }
}

@media (max-width: 760px) {
  .ma-zeile { grid-template-columns: 1fr; gap: 8px; }
  .r-band .ma-zeile-kopf { display: flex; align-items: baseline; gap: 10px; }
  .r-band .ma-zeile-kopf strong { font-size: 18px; }
  .ma-balken { height: 64px; gap: 3px; }
  .ma-balken a { border-radius: 10px; gap: 4px; }
  .r-band .ma-balken b { font-size: 13px; }
  .ma-balken span { font-size: 11.5px; }
  .ma-tabelle table { min-width: 0; font-size: 14px; }
  .ma-tabelle th, .ma-tabelle td { padding: 10px 5px !important; }
  .ma-tabelle td:first-child, .ma-tabelle th:first-child { padding-left: 10px !important; }
  .ma-tabelle thead th:first-child { width: 40%; }
  .ma-tabelle td:last-child, .ma-tabelle th:last-child { padding-right: 10px !important; }
  .ma-tabelle th { font-size: 11px !important; letter-spacing: 0.04em !important; }
  .ma-tabelle .ma-lang { display: none; }
  .ma-tabelle .ma-kurz { display: inline; }
  .ma-tabelle .zahl { white-space: normal; }
  .r-band .ma-tabelle td a { text-underline-offset: 3px; }
  .r-tabelle .ma-gruppe th { padding: 16px 12px 8px !important; font-size: 11px; }
  .ma-tabelle .ma-nur { display: table; margin: 4px 0 0 !important; }
  .ma-tabelle small { font-size: 11.5px; }
  .ma-teile { grid-template-columns: 1fr; gap: 14px; }
  .ma-stapel { gap: 14px; }
  .ma-teil { padding: 22px 18px 10px; }
  .r-band .ma-teil-kopf b { font-size: 28px; }
  .ma-rechnung { padding: 22px 16px 18px; }
  .ma-r-zeile { grid-template-columns: 50px minmax(0, 1fr) 42px; font-size: 14.5px; }
  .ma-r-mal { grid-column: 2; grid-row: 2; font-size: 13.5px; }
  .ma-r-zeile b { grid-column: 3; grid-row: 1 / span 2; }
  .r-band .ma-r-summe b { font-size: 36px; }
}