@font-face{font-family:'Big Shoulders Display';font-style:normal;font-weight:100 900;font-display:swap;src:url('../assets/fonts/big-shoulders-display-latin.woff2') format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-display:swap;src:url('../assets/fonts/archivo-latin.woff2') format('woff2')}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:0ms!important;animation-duration:0ms!important}}
body{margin:0;font-family:var(--font-body);font-size:var(--text-body-md);line-height:var(--leading-body);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
img,svg{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--text-body);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{text-decoration-color:var(--ww-yellow)}
::selection{background:var(--ww-yellow);color:var(--ww-ink)}
:focus-visible{outline:none;box-shadow:var(--focus-shadow)}
.skip-link{position:absolute;left:-999px;top:0;background:var(--ww-yellow);color:var(--ww-ink);padding:12px 16px;font-weight:700;z-index:100}
.skip-link:focus{left:16px;top:16px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Typo-Helfer */
.display-1,.display-2,.h3-display{font-family:var(--font-display);font-weight:900;text-transform:uppercase;line-height:var(--leading-display);letter-spacing:var(--tracking-caps);text-wrap:balance}
.display-1{font-size:var(--text-display-1)}
.display-2{font-size:var(--text-display-2)}
.h3-display{font-size:var(--text-h3);line-height:.95}
.lead{font-size:var(--text-body-lg);line-height:var(--leading-body);max-width:52ch}
.soft{color:var(--text-soft)}
.muted{color:var(--text-muted)}
.small{font-size:var(--text-body-sm)}

/* Balken-Headline: Betonung im schwarzen Balken, nie Textmarker-Gelb */
.balken{display:inline-block;line-height:1;padding:.04em .15em 0;margin-top:.06em;background:var(--ww-ink);color:var(--ww-white);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.inverse .balken{background:var(--ww-white);color:var(--ww-ink)}

/* Große Nummern */
.num{font-family:var(--font-display);font-weight:900;font-size:clamp(72px,10vw,120px);line-height:.85;color:var(--ww-ink)}
.inverse .num{color:var(--ww-yellow)}

/* Maßband-Leiste */
.ruler{height:12px;background-image:var(--ruler);background-size:40px 12px,8px 6px;background-position:0 0,0 6px;background-repeat:repeat-x,repeat-x}
.ruler--inverse{background-color:var(--ww-ink);background-image:var(--ruler-inverse)}
