:root{

    --primary:#499bbb;
    --dark:#2e2e2e;
    --light:#f6fbfc;
    --text:#303030;

}

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    background:var(--light);
    color:var(--text);

    display:flex;
    flex-direction:column;

    min-height:100vh;

}

.container{

    flex:1;

    width:min(90%,900px);

    margin:auto;

    padding:4rem 1rem;

    text-align:center;

}

.logo{

    width:min(340px,90%);
    height:auto;

    margin-bottom:2.5rem;

}

h1{

    color:var(--dark);

    font-size:clamp(2rem,5vw,3rem);

    font-weight:700;

    margin-bottom:1rem;

}

.intro{

    max-width:700px;

    margin:0 auto 3rem;

    font-size:1.15rem;

    line-height:1.7;

}

.mail{

    display:inline-flex;

    align-items:center;

    gap:.6rem;

    padding:1rem 1.8rem;

    color:white;

    background:var(--primary);

    border-radius:.5rem;

    text-decoration:none;

    font-weight:600;

    transition:.2s;

}

.mail:hover{

    background:var(--dark);

}

footer{

    padding:2rem 1rem;

    border-top:1px solid #dfe8ea;

}

footer nav{

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:1.5rem;

}

footer a{

    color:var(--dark);

    text-decoration:none;

    font-size:.95rem;

}

footer a:hover{

    color:var(--primary);

}

/* --------------------------------------------------
   Rechtliche Seiten
-------------------------------------------------- */

.legal{

    max-width:900px;
    text-align:left;

}

.logo-link{

    display:block;
    text-align:center;
    margin-bottom:2rem;

}

.legal h1{

    text-align:center;
    margin-bottom:3rem;

}

.legal h2{

    margin:2.5rem 0 1rem;
    color:var(--primary);
    font-size:1.4rem;

}

.legal p{

    margin-bottom:1.25rem;
    line-height:1.8;

}

.legal a{

    color:var(--primary);
    text-decoration:none;

}

.legal a:hover{

    text-decoration:underline;

}