/* ============================================================
   RETOV – Regelwerk
   Die Seite ist ein Register: links die Kapitel als Aktenreiter, rechts die
   Regeln als Einträge mit vier festen Feldern. Nichts hier ist Dekoration:
   die Nummer ist die Nummer, auf die Bewerbung und Team sich beziehen.
   ============================================================ */
.regeln-kopf{padding-bottom:clamp(40px,6vh,64px)}
.regeln-kopf .h2{font-size:clamp(34px,5vw,58px)}
.regeln-zahlen{display:flex;gap:0;margin-top:34px;border:1px solid var(--edge);border-radius:4px;
  width:max-content;max-width:100%;overflow:hidden}
.regeln-zahlen>div{display:flex;flex-direction:column;padding:16px 26px;border-right:1px solid var(--edge)}
.regeln-zahlen>div:last-child{border-right:0}
.regeln-zahlen b{font-family:var(--display);font-weight:900;font-size:30px;line-height:1;color:var(--bone)}
.regeln-zahlen span{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mute);margin-top:6px}

.regeln-raster{display:grid;grid-template-columns:230px 1fr;gap:clamp(28px,4vw,64px);
  align-items:start;padding-left:calc(var(--rail) + var(--gutter) / 2)}
@media(max-width:820px){ .regeln-raster{grid-template-columns:1fr;padding-left:var(--gutter)} }

/* ---------- Kapitelreiter ---------- */
.kapitel-nav{position:sticky;top:84px;display:flex;flex-direction:column;gap:2px;
  padding-top:6px}
.kapitel-nav-h{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--mute);margin-bottom:10px;padding-left:14px}
.kapitel-nav a{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:baseline;
  padding:8px 12px 8px 14px;border-left:2px solid transparent;border-radius:0 6px 6px 0;
  color:var(--mute);font-size:14px;line-height:1.3;transition:color .18s,border-color .18s,background .18s}
.kapitel-nav a b{font-family:var(--mono);font-weight:500;font-size:12px;color:var(--seal)}
.kapitel-nav a:hover{color:var(--bone);background:var(--paper)}
.kapitel-nav a.jetzt{color:var(--bone);border-left-color:var(--seal);background:var(--paper)}
@media(max-width:820px){
  .kapitel-nav{position:static;flex-direction:row;flex-wrap:wrap;gap:6px;padding:0 0 20px}
  .kapitel-nav-h{width:100%}
  .kapitel-nav a{grid-template-columns:auto;border:1px solid var(--edge);border-radius:20px;padding:6px 12px}
  .kapitel-nav a span{display:none}
  .kapitel-nav a.jetzt{border-color:var(--seal)}
}

/* ---------- Kapitel und Regeln ---------- */
.regeln-inhalt{min-width:0}
.kapitel{padding:clamp(40px,7vh,80px) 0 clamp(30px,5vh,50px);border-top:1px solid var(--edge);
  scroll-margin-top:80px}
.kapitel:first-child{border-top:0;padding-top:10px}
.kapitel .h2{font-size:clamp(28px,3.4vw,40px);margin-bottom:14px}
.kapitel-intro{max-width:64ch;color:#B9BDCA;margin-bottom:34px}

.regel{position:relative;padding:26px 0 26px 22px;border-top:1px solid var(--edge);scroll-margin-top:80px}
.regel::before{content:"";position:absolute;left:0;top:32px;bottom:26px;width:2px;
  background:var(--edge);border-radius:2px;transition:background .3s}
.regel:target::before,.regel:hover::before{background:var(--seal)}
.regel h3{font-family:var(--display);font-weight:700;font-size:clamp(18px,2.1vw,22px);
  letter-spacing:-.01em;line-height:1.2;margin-bottom:12px;display:flex;gap:14px;align-items:baseline;
  text-wrap:balance}
.regel-nr{font-family:var(--mono);font-weight:500;font-size:13px;color:var(--seal);letter-spacing:.08em;
  flex:none;min-width:34px}
.regel-satz{font-size:clamp(17px,1.5vw,19px);color:var(--bone);font-weight:500;max-width:62ch;
  margin-bottom:18px;line-height:1.5}
.regel-felder{display:grid;grid-template-columns:118px 1fr;gap:10px 22px;max-width:76ch}
.regel-felder dt{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mute);padding-top:4px}
.regel-felder dd{color:#C3C6D2;font-size:16px;line-height:1.6}
.regel-felder dd.beispiel{padding-left:14px;border-left:2px solid var(--seal);color:#B9BDCA;font-style:normal}
.regel-felder dd.folge{color:#E9E7E0}
.regel-felder dd.folge::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;
  background:#F2624F;margin-right:10px;vertical-align:1px}
@media(max-width:600px){ .regel-felder{grid-template-columns:1fr;gap:4px 0} .regel-felder dd{margin-bottom:10px} }
.regel code{font-family:var(--mono);font-size:.92em;color:var(--seal)}
.regel em{font-style:normal;color:var(--bone);font-weight:600}

/* ---------- Der Kern ---------- */
.kern{margin-top:28px;padding:22px 26px;border:1px solid var(--edge);border-radius:4px;background:var(--paper);
  position:relative;max-width:76ch}
.kern::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--seal)}
.kern-h{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--seal);
  margin-bottom:12px}
.kern ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px;color:var(--bone);font-size:16px}
.kern li::marker{font-family:var(--mono);color:var(--mute);font-size:13px}

.regeln-schluss{padding-left:0;border-top:1px solid var(--edge)}
.regeln-schluss .join{display:flex;gap:14px;flex-wrap:wrap}
