/*
 * Единая структура страниц AISUNO: контейнер, отступы и шкала заголовков.
 * Цвета здесь не задаются — они остаются из tw.css и классов страниц.
 * Подключается после tw.css через templates/partials/head-css.php.
 * tw.css собран заранее и не пересобирается, поэтому новые общие правила
 * пишем здесь, а не новыми Tailwind-классами.
 */

:root {
    --ui-nav-h: 64px;
}

/* ---------- Контейнер страницы ---------- */

.ui-page {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: calc(var(--ui-nav-h) + 32px) 24px 64px;
}
.ui-page--mid { max-width: 960px; }
.ui-page--narrow { max-width: 720px; }

@media (max-width: 640px) {
    .ui-page { padding: calc(var(--ui-nav-h) + 20px) 16px 48px; }
}

/* ---------- Заголовки ---------- */

.ui-page-head { margin-bottom: 28px; }
.ui-page-head--center { text-align: center; }

.ui-title {
    font-size: 32px;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.ui-subtitle {
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.5;
}
.ui-section-title {
    font-size: 24px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-bottom: 16px;
}
.ui-card-title {
    font-size: 18px;
    line-height: 1.35;
    font-weight: 600;
}

@media (max-width: 640px) {
    .ui-title { font-size: 26px; }
    .ui-section-title { font-size: 20px; }
}