@font-face {
    font-family: "Grizzly_Font";
    src: url("Grizzly_Font.ttf") format("truetype");
}

body {
    background-color: #181818;
    color: #D6D6D6;
    margin: 0;
    padding: 0;
}


/* Gesamter Seiteninhalt */
.content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 180px 50px 80px 50px;
    box-sizing: border-box;
}

.logo {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.content-row {
    display: flex;
    align-items: center;
    gap: 60px;
}

.content-text {
    flex: 1;
}

.Icon {
    width: 400px;
	max-width: 400px;
	min-width:300px;
    height: auto;
    flex-shrink: 0;
	max-width: none;
	margin: 0 auto;
	display: block;
}

/* Kopfbereich */
header {
    text-align: center;
    margin-bottom: 200px;
}

header h1 {
    color: #E2E2E2;
    font-family: 'Grizzly_Font', sans-serif;
    font-size: clamp(12rem, 15vw, 15rem);
    font-weight: 600;
    letter-spacing: 2px;
    text-align: center;
    line-height: 1.1;
    margin: 0 0 50px 0;
}

header p {
    color: #E2E2E2;
    font-family: sans-serif;
    font-size: clamp(2rem, 3vw, 3rem);
    font-weight: 600;
    letter-spacing: 2px;
    text-align: center;
    line-height: 1.1;
    margin: 0 0 50px 0;
}

header img {
    max-width: 300px;
    height: auto;
}


/* Überschriften */
h2 {
    color: #90eb86;
     font-family: 'Grizzly_Font', sans-serif;
    font-size: clamp(2rem, 8vw, 8rem);
    font-weight: 600;
    line-height: 1.2;

    margin-top: 120px;
    margin-bottom: 40px;
}


/* Fließtext */
p {
    color: #D0D0D0;
    font-family: sans-serif;
    font-size: clamp(2rem, 2.2vw, 2.2rem);
    line-height: 1.8;

    margin: 0 0 32px 0;
}


/* Textblock */
.text-block {
    width: 100%;
    margin: 0 auto;
    padding: 0;
	display: block;
    text-align: left;
	margin-bottom: 200;
}




/* Listen */
ul,
ol {
    color: #D0D0D0;
    font-family: sans-serif;
    font-size: clamp(2rem, 2.2vw, 2.2rem);
    line-height: 1.8;

    margin-top: 20px;
    margin-bottom: 35px;
    padding-left: 2.5rem;
}

li {
	font-family: sans-serif;
    margin-bottom: 10px;
}


/* Verschachtelte Listen */
li ul,
li ol {

    margin-top: 10px;
    margin-bottom: 10px;
}


/* Links */
a {
    color: #D0D0D0;
}

a:hover {
    color: #FFFFFF;
}
/*Fade in Animation*/
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.reveal {
    opacity: 0;
}

.reveal.visible {
    animation: fadeUp 0.7s ease-out forwards;
}