@font-face {
    font-family: "WoW";
    src:
        url("/wowfont1.woff2") format("woff2"),
        url("/wowfont1.woff") format("woff"),
        url("/wowfont1.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    width: 100%;
    min-height: 100vh; /* занимаем всю высоту */
    /* overflow: hidden убрали – теперь скроллы появляются при зуме */
}

body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly; /* равномерное распределение */
    background-image: url("/back.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    padding: 20px 0;
}

body::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 0;
}

.logo-wrapper {
    flex-shrink: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 0 20px;
}

.logo {
    width: min(500px, 80vw);
    height: auto;
    filter: drop-shadow(0 0 25px rgba(0, 0, 0, 0.9));
    display: block;
}

.content {
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.8rem;
    padding: 0 20px;
}

.title {
    font-family: "WoW", serif;
    font-size: clamp(1.2rem, 4vw, 3.2rem);
    font-weight: normal;
    line-height: 1;
    color: #e9a100;
    text-shadow:
        0 0 2px #000,
        0 0 8px #000,
        2px 2px 0 #5a2800,
        4px 4px 0 #000;
}

.subtitle {
    font-family: "WoW", serif;
    font-size: clamp(0.72rem, 1.6vw, 1.2rem);
    font-weight: normal;
    line-height: 1;
    color: #e0e0e0;
    text-shadow:
        1px 1px 3px #000,
        0 0 8px #000;
}

.discord-link {
    flex-shrink: 0;
    display: inline-block;
    line-height: 0;
    transition: transform 0.3s ease, filter 0.3s ease;
    cursor: pointer;
    background: none;
    padding: 0;
    border-radius: 0;
    z-index: 1;
    pointer-events: auto;
}

.discord-link:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 0 30px rgba(0, 0, 0, 0.9)) brightness(0.8);
}

.discord-icon {
    width: 320px;
    height: auto;
    display: block;
    max-width: 90vw;
}