.nw-breadcrumbs-wrap{background:#fff;border-bottom:1px solid var(--color-border)}
.nw-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;min-height:54px;padding-block:12px;color:var(--color-muted);font-size:14px;line-height:1.5}
.nw-breadcrumbs a{color:var(--color-primary);text-decoration:none;transition:color .15s ease}
.nw-breadcrumbs a:hover{color:var(--color-accent);text-decoration:underline}
.nw-breadcrumbs [aria-current="page"]{color:var(--color-muted)}
.nw-page-hero{position:relative;min-height:420px;display:flex;overflow:hidden;border-block:1px solid #e4edf6;background:#eaf6ff var(--nw-page-hero-image) var(--nw-page-hero-position)/cover no-repeat}
.nw-page-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(246,251,255,.99) 0%,rgba(246,251,255,.96) 31%,rgba(246,251,255,.76) 51%,rgba(246,251,255,.12) 78%,rgba(246,251,255,0) 100%)}
.nw-page-hero__inner{position:relative;z-index:1;display:flex;align-items:center;min-height:420px;padding-block:52px}
.nw-page-hero__content{width:min(720px,58%)}
.nw-page-hero h1{margin:0;color:var(--color-primary);font-size:var(--font-size-page);font-weight:800;line-height:1.03;letter-spacing:-.045em}
.nw-page-hero .nw-page-hero__eyebrow{margin:0 0 var(--space-2)} /* тот же приём: надпись над заголовком — тоже <p> */
.nw-page-hero h1 span{display:block;color:var(--color-accent)}
/* .nw-page-hero + класс: сильнее сбросов «.раздел p { margin: 0 }» (Услуги, Курсы) — иначе описание прилипает к заголовку */
.nw-page-hero .nw-page-hero__description{max-width:650px;margin:var(--space-5) 0 0;color:var(--color-text-secondary);font-size:var(--font-size-lg);line-height:var(--line-height-base)}
.nw-page-hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-8)}
.nw-page-hero__actions .button{padding-inline:var(--space-6)}
.nw-info-page h1{max-width:950px;margin:12px 0 20px;font-size:clamp(32px,4vw,52px);line-height:1.15;color:var(--color-primary)}
.nw-lead{max-width:900px;color:var(--color-muted);font-size:19px;line-height:1.7}
.nw-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:32px 0}
.nw-info-card{padding:30px;background:linear-gradient(145deg,#f6fbff,#fff);border:1px solid var(--color-border);border-radius:var(--radius-medium)}
.nw-info-card h2{font-size:25px;margin:0 0 20px;color:var(--color-primary)}
.nw-info-card h3{font-size:19px;margin:28px 0 12px;color:var(--color-primary)}
.nw-info-card p{line-height:1.7;margin:12px 0;color:var(--color-muted)}
.nw-step-list{list-style:decimal;padding-left:24px;line-height:1.7;color:var(--color-text)}
.nw-step-list li{padding-left:6px;margin-bottom:10px}
.nw-note{padding:16px;border-left:3px solid var(--color-accent);background:#edf6ff;border-radius:0 8px 8px 0;font-size:14px}
.nw-help-details{margin:24px 0;border-top:1px solid var(--color-border);padding-top:20px}
.nw-help-details summary{cursor:pointer;font-weight:600;color:var(--color-primary)}
.nw-schedule-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--color-border)}
.nw-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5)}
/* Одна-две новости на главной: карточки занимают всю ширину, без пустого места справа */
.nw-news-grid--count-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.nw-news-grid--count-1{grid-template-columns:1fr}
.nw-news-grid--count-1 .nw-news-card__link{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.nw-news-grid--count-1 .nw-news-card__media{height:100%;min-height:240px;aspect-ratio:auto}
.nw-news-grid--count-1 .nw-news-card__body{padding:var(--space-8)}
/* Карточка новости (components/news-card): главная и лента новостей. Родственна .nw-card — те же рамка, радиус и подъём. */
.nw-news-card{position:relative;min-width:0;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-background);box-shadow:0 1px 2px rgba(11,47,85,.04);transition:transform 240ms ease,box-shadow 240ms ease,border-color 240ms ease}
.nw-news-card:hover,.nw-news-card:focus-within{transform:translateY(-4px);border-color:var(--color-border-strong);box-shadow:var(--shadow-card-hover)}
.nw-news-card:has(.nw-news-card__link:focus-visible){outline:3px solid var(--color-accent);outline-offset:3px}
.nw-news-card__link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.nw-news-card__link:focus-visible{outline:none}
.nw-news-card__media{aspect-ratio:5/2;overflow:hidden;background:var(--color-accent-soft)}
.nw-news-card__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
.nw-news-card:hover .nw-news-card__media img{transform:scale(1.03)}
.nw-news-card__placeholder{display:grid;place-items:center;color:var(--color-accent);background:linear-gradient(160deg,var(--color-accent-soft) 0%,#ffffff 100%)}
.nw-news-card__placeholder svg{width:48px;height:48px;opacity:.7}
.nw-news-card__body{display:flex;flex:1;flex-direction:column;padding:var(--space-6)}
.nw-news-card__date{display:inline-flex;align-items:center;gap:6px;color:var(--color-text-secondary);font-size:var(--font-size-xs);font-weight:700}
.nw-news-card__date svg{width:16px;height:16px;flex:0 0 16px;color:var(--color-accent)}
.nw-news-card h2,.nw-news-card h3{margin:var(--space-3) 0 var(--space-2)} /* размер — общий заголовок карточки в main.css */
.nw-news-card p{margin:0 0 var(--space-5);color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:var(--line-height-base);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.nw-news-card__more{display:inline-flex;align-items:center;gap:var(--space-2);margin-top:auto;color:var(--color-accent);font-size:var(--font-size-sm);font-weight:700}
/* Сетка новостей: брейкпоинты сайта 1100 / 640 */
@media(max-width:1100px){.nw-news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nw-news-grid--count-1{grid-template-columns:1fr}}
@media(max-width:640px){.nw-news-grid{grid-template-columns:1fr}.nw-news-grid--count-1 .nw-news-card__link{display:flex}.nw-news-grid--count-1 .nw-news-card__media{min-height:0;aspect-ratio:5/2}.nw-news-grid--count-1 .nw-news-card__body{padding:var(--space-6)}}
.nw-empty{border:1px dashed var(--color-border-strong);border-radius:var(--radius-md);padding:32px;text-align:center;color:var(--color-muted)}
.nw-pager{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center;margin:28px 0}
.nw-pager a,.nw-pager [aria-current],.nw-pager [aria-disabled]{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:0 12px;border:1px solid var(--color-border);border-radius:8px;text-decoration:none;background:#fff;color:var(--color-primary)}
.nw-pager [aria-current]{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}
.nw-pager [aria-disabled]{opacity:.5}
:focus-visible{outline:3px solid #78b8f7;outline-offset:3px}
@media(max-width:850px){.nw-page-hero{background-position:68% center}.nw-page-hero__content{width:70%}.nw-info-grid{grid-template-columns:1fr}}
/* Телефон: картинка почти не видна под градиентом — убираем её, экран компактнее */
@media(max-width:640px){.nw-page-hero{min-height:0;background-image:none;background-color:var(--color-surface)}.nw-page-hero::before{display:none}.nw-page-hero__inner{min-height:0;padding-block:var(--space-8);align-items:flex-start}.nw-page-hero__content{width:100%}.nw-page-hero h1{max-width:95%;font-size:clamp(36px,11vw,48px)}.nw-page-hero .nw-page-hero__description{max-width:100%;font-size:var(--font-size-md)}.nw-page-hero__actions{display:grid;grid-template-columns:1fr;width:100%}.nw-page-hero__actions .button{width:100%}}
@media(max-width:560px){.nw-info-card{padding:22px}.nw-lead{font-size:17px}}
@media(max-width:760px){.nw-breadcrumbs{min-height:50px;gap:8px;padding-block:10px;font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.nw-list-search{margin:0 0 20px}
.nw-list-search__controls{display:flex;align-items:center;gap:10px}
.nw-list-search__field{position:relative;min-width:220px;flex:1}
.nw-list-search__field input{width:100%;min-width:0;min-height:44px;border:1px solid #cbd6e3;border-radius:10px;padding:11px 44px 11px 16px;font:inherit;background:#fff;appearance:none}
.nw-list-search__field input:focus,.nw-list-search__filters select:focus{border-color:#78b8f4;outline:0;box-shadow:0 0 0 3px rgba(13,126,244,.08)}
.nw-list-search__field input::-webkit-search-cancel-button{appearance:none}
.nw-list-search__clear{position:absolute;top:50%;right:6px;display:grid;width:32px;height:32px;padding:0;transform:translateY(-50%);place-items:center;border:0;border-radius:8px;color:#6e809b;background:transparent;font:24px/1 Arial,sans-serif;cursor:pointer;opacity:.72;transition:opacity .15s,color .15s,background .15s}
.nw-list-search__clear:hover{color:#0d3156;background:#edf4fb;opacity:1}
.nw-list-search__clear[hidden]{display:none}
.nw-list-search__filters{display:flex;align-items:center;gap:10px}
.nw-list-search__filters select{min-width:180px;min-height:44px;border:1px solid #cbd6e3;border-radius:10px;padding:10px 36px 10px 13px;color:#0d2344;background:#fff;font:inherit}
@media(max-width:700px){.nw-list-search__controls,.nw-list-search__filters{align-items:stretch;flex-direction:column}.nw-list-search__field,.nw-list-search__filters select{width:100%;min-width:0}}
[data-list-status] { color: #536479; margin: 12px 0; min-height: 24px; }
[data-list-results].is-loading { opacity: .65; }
.nw-invitation-form { display: grid; gap: 18px; max-width: 480px; margin-top: 24px; }
.nw-invitation-form label { display: grid; gap: 8px; }
.nw-invitation-form input { border: 1px solid #cbd6e3; border-radius: 10px; padding: 12px; font: inherit; }

/* =========================================================
   КАРТОЧКА КАТАЛОГА (.nw-card) — услуги, электронные сервисы, курсы
   Сверху: иконка + название и описание. Снизу: цена / метка / чип и стрелка.
   Голубой градиент из угла — как у «Популярных услуг» на главной.
   Разметка: pages/services/index, pages/education/index.
========================================================= */

/* Контейнер и секция страниц-каталогов: та же ширина, что у .container */
.nw-container {
    width: min(calc(100% - 64px), var(--container-width));
    margin-inline: auto;
}

.nw-section {
    padding-block: var(--section-padding);
}

.nw-grid > .nw-empty {
    grid-column: 1 / -1;
}

.nw-card h3,
.nw-card p,
.nw-card ul {
    margin: 0;
}

.nw-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
}

/* Две карточки в ряд (например, «Работодателю / Соискателю») */
.nw-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.nw-card {
    position: relative;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: var(--space-5);
    padding: var(--space-6);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: linear-gradient(160deg, var(--color-accent-soft) 0%, rgba(230, 242, 255, 0.4) 35%, #ffffff 70%);
    box-shadow: 0 1px 2px rgba(11, 47, 85, 0.04);
    transition:
        transform 240ms ease,
        box-shadow 240ms ease,
        border-color 240ms ease;
}

.nw-card:hover,
.nw-card:focus-within {
    transform: translateY(-4px);
    border-color: var(--color-border-strong);
    box-shadow: var(--shadow-card-hover);
}

.nw-card:has(.nw-card__link:focus-visible) {
    outline: 3px solid var(--color-accent);
    outline-offset: 3px;
}

.nw-card__head {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    column-gap: var(--space-4);
    align-items: start;
}

/* Иконка: белая плашка со скруглением; при наведении — заливка accent */
.nw-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: var(--color-background);
    color: var(--color-accent);
    box-shadow: 0 0 0 1px var(--color-border);
    transition:
        background 240ms ease,
        color 240ms ease,
        box-shadow 240ms ease;
}

.nw-icon svg {
    width: 24px;
    height: 24px;
}

.nw-card:hover .nw-icon,
.nw-card:focus-within .nw-icon {
    background: var(--color-accent);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(0, 127, 255, 0.28);
}

.nw-card__body {
    min-width: 0;
    align-self: center;
}

.nw-card__title {
    color: var(--color-primary);
    font-size: var(--font-size-lg);
    line-height: var(--line-height-tight);
    letter-spacing: -0.01em;
    overflow-wrap: break-word; /* «медосвидетельствование» не вылезает за карточку */
}

/* Ссылка в названии растянута на всю карточку */
.nw-card__link {
    color: inherit;
    text-decoration: none;
}

.nw-card__link::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}

.nw-card__link:focus-visible {
    outline: none;
}

.nw-card .nw-card__text { /* .nw-card + класс: сильнее сбросов «.раздел p { margin: 0 }» */
    margin-top: 6px;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-base);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.nw-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

/* Цена — белая плашка */
.nw-price {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    background: var(--color-background);
    box-shadow: 0 0 0 1px var(--color-border);
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.nw-price strong {
    color: var(--color-primary);
    font-size: var(--font-size-md);
}

/* Стрелка: тонкое кольцо → заливка primary при наведении */
.nw-go {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background: var(--color-background);
    color: var(--color-primary);
    box-shadow: inset 0 0 0 1px rgba(11, 47, 85, 0.14);
    transition:
        background 240ms ease,
        color 240ms ease,
        box-shadow 240ms ease;
}

.nw-go svg {
    width: 18px;
    height: 18px;
}

.nw-card:hover .nw-go,
.nw-card:focus-within .nw-go {
    background: var(--color-primary);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(11, 47, 85, 0.25);
}

/* Метки состояния сервиса: цвет + текст (не только цвет) */
.nw-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: 700;
    line-height: 1.4;
}

.nw-status::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: var(--radius-full);
    background: currentColor;
}

.nw-status svg {
    width: 12px;
    height: 12px;
}

.nw-status--auth::before {
    content: none; /* у метки «После входа» вместо точки — замок */
}

.nw-status--on {
    background: var(--color-success-soft);
    color: var(--color-success);
}

.nw-status--on::before {
    box-shadow: 0 0 0 3px rgba(24, 113, 59, 0.15); /* «живая» точка */
}

.nw-status--auth {
    background: var(--color-accent-soft);
    color: var(--color-primary);
}

.nw-status--off {
    background: #eef2f6;
    color: var(--color-text-secondary);
}

/* Недоступный сервис: без градиента, тени и подъёма, пунктирная рамка */
.nw-card.is-unavailable {
    border-style: dashed;
    border-color: var(--color-border-strong);
    background: #fafbfd;
    box-shadow: none;
}

.nw-card.is-unavailable:hover {
    transform: none;
    box-shadow: none;
}

.nw-card.is-unavailable .nw-icon {
    background: #eef2f6;
    color: var(--color-text-secondary);
    box-shadow: none;
}

.nw-card.is-unavailable .nw-card__title {
    color: var(--color-text-secondary);
}

/* Чип в подвале карточки (например, «3 модуля») */
.nw-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    background: var(--color-background);
    box-shadow: 0 0 0 1px var(--color-border);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 700;
    white-space: nowrap;
}

.nw-chip svg {
    width: 16px;
    height: 16px;
    color: var(--color-accent);
}

@media (max-width: 1100px) {

    .nw-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {

    .nw-container {
        width: calc(100% - 32px);
    }

    .nw-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--space-3);
    }

    /* Телефон: та же карточка, компактнее */
    .nw-card {
        gap: var(--space-4);
        padding: var(--space-5);
        border-radius: var(--radius-md);
    }

    .nw-card__head {
        grid-template-columns: 44px minmax(0, 1fr);
        column-gap: var(--space-3);
    }

    .nw-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
    }

    .nw-icon svg {
        width: 22px;
        height: 22px;
    }

    .nw-card__title {
        font-size: var(--font-size-md);
    }
}


/* =========================================================
   ДОСТУПНОСТЬ — ссылка «Перейти к содержанию», видимый фокус, [hidden]
   ========================================================= */
[hidden] {
    display: none !important;
}

.skip-link {
    position: absolute;
    top: -100px;
    left: 16px;
    z-index: 10001;
    padding: 12px 18px;
    border-radius: 0 0 8px 8px;
    background: var(--color-primary, #0b2f55);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.skip-link:focus {
    top: 0;
}

main:focus {
    outline: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--color-accent, #087be6);
    outline-offset: 2px;
}

form[aria-busy="true"] button[disabled] {
    cursor: progress;
    opacity: 0.7;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
