body.page {
    margin: 0;
    background: linear-gradient(135deg, #3a3a3a 0%, #6e7f80 100%);
    min-height: 100vh;
    font-family: 'Montserrat', 'Roboto', Arial, sans-serif;
    color: #e0e0e0;
}

.page {
    min-width: 320px;
}

.title,
.description {
    margin: 0;
}

.container {
    margin: 0 auto;
    padding: 0 50px;
    max-width: 1200px;
}

.hero {
    padding: 60px 0;
}

.hero__title {
    margin-bottom: 20px;
    font-family: 'Roboto', Arial, sans-serif;
    font-weight: 700;
    font-size: 2.5rem;
    color: #b0b0b0;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.hero__description {
    font-family: 'Montserrat', Arial, sans-serif;
    font-weight: 300;
    font-size: 1.2rem;
    color: #d0d0d0;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.hero__link {
    padding: 2px 4px;
    border-radius: 2px;
    outline: none;
    color: #7fa4c6;
    text-decoration: underline;
    transition: color 0.2s ease-in-out;
}

.link:focus-visible {
    outline: 2px solid #b3c6e0;
}

.link:hover:not(:focus-visible),
.link:active {
    color: #b3c6e0;
}