:root {
    --step-0: clamp(1.125rem, 1.0815rem + 0.2174vi, 1.25rem);
    --step-1: clamp(1.35rem, 1.2761rem + 0.3696vi, 1.5625rem);
    --step-2: clamp(1.62rem, 1.5041rem + 0.5793vi, 1.9531rem);
    --step-3: clamp(1.944rem, 1.771rem + 0.8651vi, 2.4414rem);
    --step-4: clamp(2.3328rem, 2.0827rem + 1.2504vi, 3.0518rem);
    --step-5: clamp(2.7994rem, 2.4462rem + 1.7658vi, 3.8147rem);  
    --step-6: clamp(3.3592rem, 2.8691rem + 2.4507vi, 4.7684rem);
    --step-7: clamp(4.0311rem, 3.36rem + 3.3555vi, 5.9605rem);
    --step-8: clamp(4.8373rem, 3.9283rem + 4.5448vi, 7.4506rem);
    --step-9: clamp(5.8048rem, 4.5844rem + 6.1017vi, 9.3132rem);
    --step-10: clamp(6.9657rem, 5.3393rem + 8.1319vi, 11.6415rem);    
    --bs-btn-hover-bg: #19547e;
    --bs-btn-hover-border-color: #19547e;
}

.btn-primary {
    --bs-btn-bg: #156AA5;
    --bs-btn-border-color: #156AA5;
}

.btn:hover, .btn:first-child:active {
    background-color: #19547e;
    border-color: #19547e;
}

body {
    margin: 0;
    font-family: "IBM Plex Sans", sans-serif;
    font-size: var(--step--1);
}

main {
    margin-top: 50px;
}

h1 {
    font-size: var(--step-8);
    line-height: 0.75;
    margin-bottom: 5rem;
}

h2 {
    font-size: var(--step-3);
    margin-bottom: 2rem;
}

h3 {
    font-size: var(--step-2);
    margin-bottom: 2rem;
    font-weight: bold;
}

h4 {
    font-size: var(--step-2);
    margin-bottom: 2rem;
    font-weight: bold;
}

p, ul > li {
    font-size: var(--step-2);
    margin-bottom: 2rem;
}

footer {
    background-color: #e8e8e8;
}

.footer-logo {
    width: 100%;
}

small {
    font-size: var(--step-1);
}

a {
    color: #156AA5;
}

a:hover {
    text-decoration: none;
}

.title {
    font-size: var(--step-4);
}

.back {

    font-size: var(--step-1);
}

.imprint p {
    font-size: var(--step-1);
}

.number {
    font-size: var(--step-5);
    font-weight: bold;
}

.marker {
    padding-left: 2rem;
    font-size: var(--step-2);
    font-weight: 600;
    font-style: italic;
}