body {
    height: 100dvh;
}

.main {
    width: 100%;
    max-width: 1440px;
    height: 100%;
}

.hero-section {
    padding: var(--spacing-40);
    height: 80%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px;
}

.hero-section__title {
    font-size: clamp(40px, 16vw, 96px);
    color: var(--color-primary);
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
}

.hero-section__subtitle {
    font-size: 40px;
    font-size: clamp(24px, 8vw, 40px);
    color: var(--color-primary);
    font-weight: 400;
    text-transform: uppercase;
    text-align: center;
}