/* ================== ОБЩИЕ ТОКЕНЫ И UI-СТРУКТУРА ================== */
:root {
    --ui-container-max: 1180px;
    --ui-container-pad: clamp(14px, 2.2vw, 30px);
    --ui-radius-md: 14px;
    --ui-radius-lg: 20px;
    --ui-border-soft: rgba(255, 255, 255, 0.10);
    --ui-surface-soft: rgba(255, 255, 255, 0.04);
    --ui-text-main: rgba(255, 255, 255, 0.90);
    --ui-text-muted: rgba(255, 255, 255, 0.65);
    --ui-focus: rgba(212, 175, 55, 0.55);
    --ui-header-height: 64px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    color: var(--ui-text-main);
}

.container,
.navbar-container,
.header-container,
.main-container {
    width: min(100%, var(--ui-container-max));
    margin-inline: auto;
    padding-inline: var(--ui-container-pad);
}

header,
.header,
.navbar {
    min-height: var(--ui-header-height);
}

.nav-links,
.nav-menu {
    display: flex;
    align-items: center;
    gap: clamp(8px, 1.4vw, 18px);
    flex-wrap: wrap;
}

.nav-links a,
.nav-menu a {
    color: var(--ui-text-main);
    text-decoration: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.nav-links a:hover,
.nav-menu a:hover {
    opacity: 0.92;
}

a:focus-visible,
button:focus-visible,
.user-button:focus-visible {
    outline: 2px solid var(--ui-focus);
    outline-offset: 2px;
    border-radius: 6px;
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.35);
}

@media (max-width: 992px) {
    :root {
        --ui-header-height: 56px;
    }

    .container,
    .navbar-container,
    .header-container,
    .main-container {
        padding-inline: clamp(12px, 3vw, 20px);
    }
}

main section,
main .section {
    margin-block: clamp(28px, 4vw, 64px);
}

main h1,
main h2,
main h3 {
    line-height: 1.15;
    letter-spacing: -0.01em;
    margin-top: 0;
}

main p {
    line-height: 1.6;
    color: var(--ui-text-main);
}

main .section-title,
main .block-title {
    margin-bottom: clamp(10px, 1.4vw, 18px);
}

/* ================== USER MENU ================== */
.user-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Глобальная сетка шапки: лого слева, навигация по центру, профиль справа */
.header:not(.profile-header) {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.header:not(.profile-header) .logo-text {
    justify-self: start;
}

.header:not(.profile-header) nav {
    justify-self: center;
}

.header:not(.profile-header) .nav {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
}

.header:not(.profile-header) .user-menu {
    justify-self: end;
}

@media (max-width: 900px) {
    .header:not(.profile-header) {
        grid-template-columns: auto 1fr auto;
        column-gap: 8px;
    }

    .header:not(.profile-header) nav {
        display: none;
    }
}

/* Anchor offset for fixed header */
#hero,
#news,
#gallery {
    scroll-margin-top: calc(var(--ui-header-height) + 32px);
}