:root {
  --u-h2-gross: clamp(48px, 8.4vw, 150px);     
  --u-h2-mittel: clamp(44px, 7.2vw, 128px);    
  --u-h2-klein: clamp(40px, 4.8vw, 84px);      
  --u-h3: clamp(28px, 3vw, 48px);              
  --u-satz: clamp(20px, 1.9vw, 30px);          
  --u-abstand-oben: clamp(100px, 12vw, 200px); 
  --u-abstand-unten: clamp(100px, 12vw, 180px);
  --u-text-leise: #3b4843;                     
  --u-radius-buehne: 28px;                     
  --u-radius-karte: 18px;                      
}
html.unterseite .vorlader { display: none; }
.u-kopf { display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: clamp(48px, 8vh, 96px); }
.u-kennung { font-size: 13px; font-weight: 500; letter-spacing: .01em; color: rgba(246,248,245,.66); margin-bottom: 22px; } 
.u-kennung .nr { color: var(--akzent-hell); margin-right: 4px; }                                                             
.u-titel { font-size: var(--u-h2-klein); font-weight: 600; letter-spacing: -.045em; line-height: .98; max-width: 1100px; }    
.u-titel em { font-style: italic; font-weight: 300; letter-spacing: -.02em; }                                               
.u-unter { margin-top: 22px; max-width: 560px; font-size: clamp(16px, 1.25vw, 19px); opacity: .86; }                        
.u-abschnitt { background: var(--schnee); padding: var(--u-abstand-oben) var(--rand) var(--u-abstand-unten); }
.u-gross { font-size: var(--u-h2-gross); font-weight: 600; letter-spacing: -.05em; line-height: .9; margin-bottom: clamp(40px, 5vw, 72px); } 
.u-text { font-size: var(--u-satz); font-weight: 500; letter-spacing: -.02em; line-height: 1.25; max-width: 760px; color: var(--graphit); margin-bottom: 40px; } 
@media (max-width: 767px) {
  .u-kopf { padding-bottom: 40px; }
}
:root {
  --u-kopf-h: max(calc(100vw / 2.35), 500px);
  --u-kopf-unten: clamp(36px, 4vw, 64px);
  --u-kopf-titel: var(--u-h2-klein);   
}
html.unterseite .kopf-platz { height: var(--u-kopf-h); }
html.unterseite .kopf-inhalt.u-kopf { bottom: auto; height: var(--u-kopf-h); padding-bottom: var(--u-kopf-unten); }
html.unterseite .kopf-inhalt.u-kopf .u-titel { font-size: var(--u-kopf-titel); }
@media (max-width: 767px) {
  :root { --u-kopf-h: 66svh; --u-kopf-unten: 30px; --u-kopf-titel: clamp(32px, 9vw, 40px); }
}
:root {
  --u-kopf-h: clamp(380px, calc(100vw / 3.5), 60vh);
  --u-kopf-unten: clamp(26px, 2.4vw, 48px);
  --u-kopf-titel: clamp(38px, 4.4vw, 78px);
}
html.unterseite .u-kopf .u-pfad { margin-bottom: 8px; }
html.unterseite .u-kopf .u-kennung { margin-bottom: 12px; }
html.unterseite .u-kopf .u-titel + .u-unter { margin-top: 14px; max-width: 680px; }
html.unterseite .u-kopf .ma-unter + .ma-beschr { margin-top: 8px; }
html.unterseite .u-kopf .ki-kopf-aufruf,
html.unterseite .u-kopf .ma-kopf-cta,
html.unterseite .u-kopf .u-handlung,
html.unterseite .u-kopf .uw-aufruf { margin-top: 20px; }
html.unterseite .u-kopf .ki-kopf-fuer { margin-bottom: 12px; }
html.unterseite .u-kopf .ki-kopf-systeme li,
html.unterseite .u-kopf .u-kopf-strecke li { padding: 8px 0 9px; }
@media (max-width: 767px) {
  :root { --u-kopf-h: 44svh; --u-kopf-unten: 22px; --u-kopf-titel: clamp(30px, 8.4vw, 38px); }
  html.unterseite .u-kopf .u-kennung { margin-bottom: 10px; }
  html.unterseite .u-kopf .u-titel + .u-unter { margin-top: 12px; }
  html.unterseite .u-kopf .ki-kopf-aufruf,
  html.unterseite .u-kopf .ma-kopf-cta,
  html.unterseite .u-kopf .u-handlung,
  html.unterseite .u-kopf .uw-aufruf { margin-top: 16px; }
}
@media (min-width: 768px) {
  html.unterseite .u-kopf .u-titel + .u-unter { max-width: 820px; }
  html.unterseite .u-kopf .knopf-gross { font-size: 17px; padding: 14px 26px; }   
}
@media (min-width: 1100px) {
  html.unterseite .u-kopf:has(> .u-kopf-strecke) > :not(.u-kopf-strecke) { max-width: calc(100% - clamp(260px, 23vw, 350px) - 60px); }
}
@media (max-width: 767px) {
  html.unterseite .u-kopf .u-pfad { margin-bottom: 6px; }
  html.unterseite .u-kopf .u-titel + .u-unter { font-size: 15.5px; line-height: 1.42; }
  html.unterseite .u-kopf .knopf-gross { font-size: 16px; padding: 13px 22px; }
}
html.unterseite .u-kopf .u-pfad { display: block; width: fit-content; max-width: 100%; font-size: 13px; font-weight: 500; letter-spacing: .01em; line-height: 1.5; color: rgba(246,248,245,.6); margin-bottom: 12px; }
html.unterseite .u-kopf .u-pfad ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; }
html.unterseite .u-kopf .u-pfad li { margin: 0; }
html.unterseite .u-kopf .u-pfad li + li::before { content: "›"; margin-right: 8px; color: rgba(246,248,245,.45); }
html.unterseite .u-kopf .u-pfad a { color: rgba(246,248,245,.6); text-decoration: none; }
html.unterseite .u-kopf .u-pfad a:hover { color: var(--schnee); text-decoration: underline; text-underline-offset: 3px; }
html.unterseite .u-kopf .u-pfad [aria-current] { color: rgba(246,248,245,.92); }
html.unterseite .u-kopf .u-pfad .nr { color: var(--akzent-hell); margin-right: 4px; }
@media (max-width: 767px) {
  html.unterseite .u-kopf .u-pfad { margin-bottom: 10px; }
}
:root {
  --u-kopf-faktor: 1.17;
  --u-kopf-h: calc(clamp(380px, calc(100vw / 3.5), 60vh) * var(--u-kopf-faktor));
}
@media (max-width: 767px) {
  :root { --u-kopf-h: calc(44svh * var(--u-kopf-faktor)); }
}
html.kopf-wartet .kopf-inhalt.u-kopf { visibility: hidden; }