/* NIKdesign · Impressum und Datenschutz (Register-Layout)
   Gehört zu nikdesign.de, Stand 04.10.2026 (übernommen aus Entwurf A »Register«). Siehe dokumentation/TECHNIK.md */
/* leichte Bewegung wie auf der Startseite: Titel setzt sich, Abschnitte treten beim Hereinscrollen auf */
.rt-setzen{animation:auftreten 1s var(--uebergang) .1s both,rt-setzen 1.5s var(--uebergang) .1s both}
@keyframes auftreten{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes rt-setzen{from{font-variation-settings:"wdth" 78,"wght" 520}}
.rt-auf{opacity:0;transform:translateY(22px);transition:opacity .9s var(--uebergang),transform .9s var(--uebergang)}
.rt-auf.sichtbar{opacity:1;transform:none}
.rt-auf.v1{transition-delay:.08s}.rt-auf.v2{transition-delay:.16s}
@media(prefers-reduced-motion:reduce){.rt-setzen{animation:none}.rt-auf{opacity:1;transform:none;transition:none}}
.rt-hinweis{margin-top:3rem;background:#FEF6E4;border:1px solid #F2DDA9;border-left:4px solid var(--orange);border-radius:12px;padding:1.2rem 1.4rem;font-size:.9rem}
.rt-hinweis strong{font-variation-settings:"wdth" 96,"wght" 700;font-weight:normal}
.rt-hinweis ul{margin:.6rem 0 0 1.1rem}.rt-hinweis li{margin-top:.35rem}
.rt-stand{margin-top:2.5rem;font-size:.85rem;color:var(--matt)}

/* leichte Bewegung wie auf der Startseite: Titel setzt sich, Abschnitte treten beim Hereinscrollen auf */
.rt-setzen{animation:auftreten 1s var(--uebergang) .1s both,rt-setzen 1.5s var(--uebergang) .1s both}
@keyframes auftreten{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes rt-setzen{from{font-variation-settings:"wdth" 78,"wght" 520}}
.rt-auf{opacity:0;transform:translateY(22px);transition:opacity .9s var(--uebergang),transform .9s var(--uebergang)}
.rt-auf.sichtbar{opacity:1;transform:none}
.rt-auf.v1{transition-delay:.08s}.rt-auf.v2{transition-delay:.16s}
@media(prefers-reduced-motion:reduce){.rt-setzen{animation:none}.rt-auf{opacity:1;transform:none;transition:none}}
.rt-hinweis{margin-top:3rem;background:#FEF6E4;border:1px solid #F2DDA9;border-left:4px solid var(--orange);border-radius:12px;padding:1.2rem 1.4rem;font-size:.9rem}
.rt-hinweis strong{font-variation-settings:"wdth" 96,"wght" 700;font-weight:normal}
.rt-hinweis ul{margin:.6rem 0 0 1.1rem}.rt-hinweis li{margin-top:.35rem}
.rt-stand{margin-top:2.5rem;font-size:.85rem;color:var(--matt)}

.ra{padding-top:50px}
.ra-rand{max-width:1080px;margin-inline:auto;padding-inline:clamp(1.2rem,4vw,2.4rem)}
.ra-kopf{padding-block:clamp(3rem,6vw,4.5rem) clamp(1.5rem,3vw,2.5rem);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:end;border-bottom:1px solid var(--linie)}
.ra-kopf h1{font-size:clamp(2.1rem,5.6vw,4rem);overflow-wrap:anywhere;line-height:1.02;letter-spacing:-.035em;color:var(--grau);font-variation-settings:"wdth" 86,"wght" 300;margin-top:.6rem}
/* Titel in zwei Zügen wie bei Entwurf C: erster Teil setzt sich, der zweite (petrol) folgt einen Moment später */
.ra-kopf h1 span{display:inline-block;animation:auftreten 1s var(--uebergang) .1s both,rt-setzen 1.5s var(--uebergang) .1s both}
.ra-kopf h1 span.ra-t2{color:var(--petrol);font-variation-settings:"wdth" 86,"wght" 500;letter-spacing:-.02em;animation-delay:.4s,.4s}
@media(prefers-reduced-motion:reduce){.ra-kopf h1 span{animation:none}}
.ra-kurz{animation:auftreten 1s var(--uebergang) .35s both;margin-top:1.2rem;max-width:60ch;color:var(--grau);font-size:1.05rem;line-height:1.55}
.ra-kurz::before{content:"Kurz gesagt";display:block;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--petrol);font-variation-settings:"wdth" 88,"wght" 600;margin-bottom:.4rem}
.ra-raster{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:clamp(2rem,6vw,5rem);padding-block:clamp(2rem,4vw,3rem) clamp(3rem,6vw,5rem)}
.ra-register{animation:auftreten 1s var(--uebergang) .5s both;position:sticky;top:5rem;align-self:start;font-size:.86rem}
.ra-register ol{list-style:none;counter-reset:r}
.ra-register li{counter-increment:r;border-left:2px solid var(--linie);transition:border-color .3s}
.ra-register li.aktiv{border-color:var(--orange)}
.ra-register a{display:block;padding:.4rem 0 .4rem 1rem;color:var(--matt);transition:color .3s,font-variation-settings .35s var(--uebergang)}
.ra-register a::before{content:counter(r,decimal-leading-zero) "  ";color:var(--petrol);font-variation-settings:"wdth" 88,"wght" 600;font-size:.72rem;letter-spacing:.05em}
.ra-register li.aktiv a{color:var(--grau);font-variation-settings:"wdth" 100,"wght" 600}
.ra-register a:hover{text-decoration:none;color:var(--grau)}
.ra-inhalt section{padding-block:1.6rem;border-bottom:1px solid var(--linie);scroll-margin-top:5rem}
.ra-inhalt section:first-child{padding-top:0}
.ra-inhalt h2{font-size:1.15rem;color:var(--grau);font-variation-settings:"wdth" 94,"wght" 600;display:grid;grid-template-columns:2.6rem 1fr;align-items:baseline}
.ra-inhalt h2 span{font-size:.72rem;letter-spacing:.06em;color:var(--petrol);font-variation-settings:"wdth" 88,"wght" 600}
.ra-inhalt h3{margin-top:1.1rem;font-size:.98rem;color:var(--grau);font-variation-settings:"wdth" 96,"wght" 600;padding-left:2.6rem}
.ra-inhalt p,.ra-inhalt ul,.ra-inhalt ol,.ra-inhalt table{margin-top:.7rem;padding-left:2.6rem;color:var(--grau);font-size:.98rem;max-width:66ch}
.ra-inhalt ul,.ra-inhalt ol{padding-left:3.8rem}
.ra-inhalt p:first-of-type{margin-top:.6rem}
@media(max-width:820px){.ra-raster{grid-template-columns:1fr;gap:1.5rem}.ra-register{position:static}.ra-register ol{display:flex;flex-wrap:wrap;gap:.3rem}.ra-register li{border:1px solid var(--linie);border-radius:99px}.ra-register a{padding:.3rem .7rem}.ra-register a::before{content:none}.ra-kopf{grid-template-columns:1fr}
  .ra-inhalt h2{grid-template-columns:2rem 1fr}.ra-inhalt p,.ra-inhalt h3,.ra-inhalt table{padding-left:0}.ra-inhalt ul,.ra-inhalt ol{padding-left:1.2rem}}