/*
 * Общие правила секций лендинга. Лежат отдельным файлом, а не утилитами Tailwind:
 * неслоёные правила Unify перебивают любую утилиту из @layer utilities, а здесь
 * нужна гарантия — вертикальный ритм и появление блоков одинаковы во всех секциях.
 * Размеры в пикселях: Unify держит html { font-size: 14px }.
 */
.nb-landing-section {
    padding: 56px 0;
    color: var(--nb-foreground);
    font-size: 16px;
    line-height: 1.6;
}

@media (min-width: 992px) {
    .nb-landing-section { padding: 88px 0; }
}

/* Якорь секции не должен уходить под липкую шапку сайта */
.nb-landing-section,
.nb-landing-section [id] { scroll-margin-top: 110px; }

.nb-landing-section--muted { background: var(--nb-background-1); }

.nb-landing-eyebrow {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--nb-primary-700);
}

.nb-landing-title {
    margin: 0;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.01em;
    color: var(--nb-foreground);
}

@media (min-width: 992px) {
    .nb-landing-title { font-size: 40px; }
}

.nb-landing-title-accent {
    display: block;
    color: var(--nb-primary-700);
}

/* Отступ с !important: секции сбрасывают поля абзацев правилом по #id, и подзаголовок
   прилипал к заголовку */
.nb-landing-lead {
    margin: 16px 0 0 !important;
    font-size: 17px;
    line-height: 1.6;
    color: var(--nb-muted-foreground-1);
}

@media (min-width: 992px) {
    .nb-landing-lead { font-size: 18px; }
}

.nb-landing-head { max-width: 760px; }
.nb-landing-head--center { margin-left: auto; margin-right: auto; text-align: center; }

.nb-reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .6s cubic-bezier(.16, 1, .3, 1), transform .6s cubic-bezier(.16, 1, .3, 1);
}

.nb-reveal.is-visible {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .nb-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}