/*
 * SITE FARM — AUTO PROFILE v1
 * Первый безопасный этап: стабильные визуальные профили без перестановки HTML.
 * Классы выводятся на сервере модулем domain_theme_profile.php.
 */

/* Палитры: меняют акцент и связанные элементы, не ломая светлую/тёмную тему. */
.sf-auto-profile.sf-palette-1 {--accent:#79c142;--ui-bg-btn:#79c142;--ui-bg-btn-hover:#66aa32;--ui-bdc-inp-focus:#79c142;}
.sf-auto-profile.sf-palette-2 {--accent:#e15361;--ui-bg-btn:#e15361;--ui-bg-btn-hover:#c94250;--ui-bdc-inp-focus:#e15361;}
.sf-auto-profile.sf-palette-3 {--accent:#4b83e6;--ui-bg-btn:#4b83e6;--ui-bg-btn-hover:#376dcc;--ui-bdc-inp-focus:#4b83e6;}
.sf-auto-profile.sf-palette-4 {--accent:#8c64d8;--ui-bg-btn:#8c64d8;--ui-bg-btn-hover:#734bc1;--ui-bdc-inp-focus:#8c64d8;}
.sf-auto-profile.sf-palette-5 {--accent:#e28a2f;--ui-bg-btn:#e28a2f;--ui-bg-btn-hover:#c9721d;--ui-bdc-inp-focus:#e28a2f;}
.sf-auto-profile.sf-palette-6 {--accent:#149f91;--ui-bg-btn:#149f91;--ui-bg-btn-hover:#0d8277;--ui-bdc-inp-focus:#149f91;}
.sf-auto-profile.sf-palette-7 {--accent:#d45b9a;--ui-bg-btn:#d45b9a;--ui-bg-btn-hover:#b94480;--ui-bdc-inp-focus:#d45b9a;}
.sf-auto-profile.sf-palette-8 {--accent:#58707f;--ui-bg-btn:#58707f;--ui-bg-btn-hover:#405865;--ui-bdc-inp-focus:#58707f;}

/* Шрифтовые профили используют только уже имеющиеся или системные шрифты. */
.sf-auto-profile.sf-font-1 {font-family:'inter',sans-serif;}
.sf-auto-profile.sf-font-1 h1,.sf-auto-profile.sf-font-1 h2,.sf-auto-profile.sf-font-1 h3,.sf-auto-profile.sf-font-1 .sect__title,.sf-auto-profile.sf-font-1 .logo {font-family:'inter',sans-serif;}

.sf-auto-profile.sf-font-2 {font-family:system-ui,-apple-system,'Segoe UI',sans-serif;}
.sf-auto-profile.sf-font-2 h1,.sf-auto-profile.sf-font-2 h2,.sf-auto-profile.sf-font-2 h3,.sf-auto-profile.sf-font-2 .sect__title {font-family:'Oswald',sans-serif;letter-spacing:.015em;}

.sf-auto-profile.sf-font-3 {font-family:'inter',Arial,sans-serif;}
.sf-auto-profile.sf-font-3 h1,.sf-auto-profile.sf-font-3 h2,.sf-auto-profile.sf-font-3 h3,.sf-auto-profile.sf-font-3 .sect__title,.sf-auto-profile.sf-font-3 .logo {font-family:'Righteous-Regular','inter',sans-serif;font-weight:400;}

.sf-auto-profile.sf-font-4 {font-family:Arial,'Helvetica Neue',sans-serif;}
.sf-auto-profile.sf-font-4 h1,.sf-auto-profile.sf-font-4 h2,.sf-auto-profile.sf-font-4 h3,.sf-auto-profile.sf-font-4 .sect__title {font-family:Georgia,'Times New Roman',serif;font-weight:700;letter-spacing:-.015em;}

/* Ширина основного контейнера. */
.sf-auto-profile.sf-width-1 {--max-width:1080px;}
.sf-auto-profile.sf-width-2 {--max-width:1140px;}
.sf-auto-profile.sf-width-3 {--max-width:1220px;}
.sf-auto-profile.sf-width-4 {--max-width:1320px;}

/* Скругления. Применяются к реальным видимым блокам, а не ко всему подряд. */
.sf-auto-profile.sf-radius-1 {--ui-elem-bdrs:0px;--ui-bdrs:0px;--sf-card-radius:0px;}
.sf-auto-profile.sf-radius-2 {--ui-elem-bdrs:4px;--ui-bdrs:4px;--sf-card-radius:4px;}
.sf-auto-profile.sf-radius-3 {--ui-elem-bdrs:8px;--ui-bdrs:8px;--sf-card-radius:10px;}
.sf-auto-profile.sf-radius-4 {--ui-elem-bdrs:14px;--ui-bdrs:14px;--sf-card-radius:16px;}
.sf-auto-profile .item__img,
.sf-auto-profile .page__poster,
.sf-auto-profile .page__img,
.sf-auto-profile .search-block__input,
.sf-auto-profile .header__menu-hidden,
.sf-auto-profile .page__cols,
.sf-auto-profile .comm {border-radius:var(--sf-card-radius);}

/* Плотность интерфейса. */
.sf-auto-profile.sf-density-1 {--indent:16px;--indent-negative:-16px;--sf-grid-gap:8px;--sf-section-gap:20px;}
.sf-auto-profile.sf-density-2 {--indent:20px;--indent-negative:-20px;--sf-grid-gap:12px;--sf-section-gap:28px;}
.sf-auto-profile.sf-density-3 {--indent:26px;--indent-negative:-26px;--sf-grid-gap:18px;--sf-section-gap:36px;}
.sf-auto-profile .grid-items {gap:var(--sf-grid-gap);}
.sf-auto-profile .sect + .sect {margin-top:var(--sf-section-gap);}

/* Тени. */
.sf-auto-profile.sf-shadow-1 {--bsh-block:none;--bsh:0 0 0 1px var(--bdc);}
.sf-auto-profile.sf-shadow-2 {--bsh-block:0 4px 16px rgba(0,0,0,.10);--bsh:0 2px 8px rgba(0,0,0,.12);}
.sf-auto-profile.sf-shadow-3 {--bsh-block:0 12px 34px rgba(0,0,0,.16);--bsh:0 5px 18px rgba(0,0,0,.16);}
.sf-auto-profile .item__img,
.sf-auto-profile .page__poster {box-shadow:var(--bsh-block);}

/* На мобильных сохраняем штатные размеры шаблона и только мягко уменьшаем отступ. */
@media screen and (max-width:760px) {
    .sf-auto-profile.sf-density-3 {--indent:20px;--indent-negative:-20px;--sf-grid-gap:12px;--sf-section-gap:26px;}
}

/* ============================================================
 * ЭТАП 2 — ПЯТЬ СТАБИЛЬНЫХ ВАРИАНТОВ КАРТОЧКИ
 * Вариант выбирается на сервере по постоянному ID автопрофиля.
 * Неиспользуемые карточки не дублируются и не прячутся через display:none.
 * ============================================================ */

/* Общая подготовка новой семантической разметки shortstory.tpl. */
.sf-auto-profile .item {
    min-width: 0;
}
.sf-auto-profile .item__head,
.sf-auto-profile .item__title {
    min-width: 0;
}
.sf-auto-profile .item__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
}
.sf-auto-profile .item__rates-item {
    white-space: nowrap;
}

/* ВАРИАНТ 1 — классическая карточка: полный градиент поверх постера. */
.sf-auto-profile.sf-card-1 .item__desc {
    justify-content: flex-end;
}
.sf-auto-profile.sf-card-1 .item__head {
    margin-top: auto;
}

/* ВАРИАНТ 2 — постер сверху, самостоятельная информационная панель снизу. */
.sf-auto-profile.sf-card-2 .item {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--bg);
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    box-shadow: var(--bsh-block);
}
.sf-auto-profile.sf-card-2 .item__img {
    flex: 0 0 auto;
    border-radius: 0;
    box-shadow: none;
}
.sf-auto-profile.sf-card-2 .item__img.img-mask::after {
    height: 32%;
    opacity: .42;
}
.sf-auto-profile.sf-card-2 .item__desc {
    position: relative;
    inset: auto;
    flex: 1 1 auto;
    justify-content: space-between;
    min-height: 112px;
    padding: 12px;
    text-align: left;
    color: #444;
    background: var(--bg);
    --tt: #444;
    --bdc: rgba(0,0,0,.12);
}
.dt.sf-auto-profile.sf-card-2 .item__desc {
    color: #ccc;
    --tt: #ccc;
    --bdc: rgba(255,255,255,.18);
}
.sf-auto-profile.sf-card-2 .item__desc::before {
    display: none;
}
.sf-auto-profile.sf-card-2 .item__title {
    font-size: 14px;
    line-height: 1.35;
    margin-bottom: 3px;
}
.sf-auto-profile.sf-card-2 .item__year {
    color: var(--tt-fade);
    opacity: 1;
}
.sf-auto-profile.sf-card-2 .item__rates {
    margin-top: 9px;
    padding-top: 9px;
}
.sf-auto-profile.sf-card-2 .item__rates-item::before {
    font-size: 10px;
}

/* ВАРИАНТ 3 — компактная стеклянная панель только внизу постера. */
.sf-auto-profile.sf-card-3 .item__img.img-mask::after {
    height: 48%;
    background: linear-gradient(to top, rgba(0,0,0,.94) 0%, rgba(0,0,0,.55) 58%, transparent 100%);
}
.sf-auto-profile.sf-card-3 .item__desc {
    top: auto;
    min-height: 44%;
    padding: 13px 12px 11px;
    justify-content: flex-end;
    text-align: left;
    background: linear-gradient(to top, rgba(0,0,0,.68), rgba(0,0,0,.08));
    backdrop-filter: blur(2px);
}
.sf-auto-profile.sf-card-3 .item__desc::before {
    inset: auto 10px 10px auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    font-size: 16px;
    background: var(--accent);
    opacity: .92;
}
.sf-auto-profile.sf-card-3 .item:hover .item__desc::before {
    opacity: 1;
    transform: scale(1.06);
}
.sf-auto-profile.sf-card-3 .item__head {
    padding-right: 42px;
}
.sf-auto-profile.sf-card-3 .item__title {
    font-size: 14px;
    line-height: 1.32;
}
.sf-auto-profile.sf-card-3 .item__rates {
    justify-content: flex-start;
    gap: 10px;
    border-top: 0;
    margin-top: 7px;
    padding-top: 0;
    padding-right: 44px;
    font-size: 11px;
}
.sf-auto-profile.sf-card-3 .item__rates-item {
    padding: 4px 7px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    background: rgba(0,0,0,.28);
}

/* ВАРИАНТ 4 — заголовок сверху, год и рейтинги разнесены по углам. */
.sf-auto-profile.sf-card-4 .item__img.img-mask::after {
    height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,.76) 0%, transparent 34%, transparent 58%, rgba(0,0,0,.76) 100%);
    opacity: 1;
}
.sf-auto-profile.sf-card-4 .item__desc {
    justify-content: space-between;
    align-items: stretch;
    padding: 11px;
    text-align: left;
}
.sf-auto-profile.sf-card-4 .item__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.sf-auto-profile.sf-card-4 .item__title {
    order: 1;
    max-width: calc(100% - 8px);
    padding: 6px 8px;
    margin: 0;
    border-left: 3px solid var(--accent);
    background: rgba(0,0,0,.42);
    backdrop-filter: blur(3px);
    font-size: 14px;
    line-height: 1.28;
}
.sf-auto-profile.sf-card-4 .item__year {
    order: 2;
    display: inline-flex;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(0,0,0,.42);
    opacity: .9;
}
.sf-auto-profile.sf-card-4 .item__rates {
    align-self: flex-end;
    justify-content: flex-end;
    gap: 6px;
    width: auto;
    margin: auto 0 0 auto;
    padding: 0;
    border: 0;
}
.sf-auto-profile.sf-card-4 .item__rates-item {
    padding: 5px 7px;
    border-radius: 4px;
    background: rgba(0,0,0,.66);
    box-shadow: 0 1px 5px rgba(0,0,0,.24);
    font-size: 11px;
}
.sf-auto-profile.sf-card-4 .item__rates-item::before {
    display: block;
    margin: 0 0 3px;
    font-size: 8px;
    line-height: 1;
}
.sf-auto-profile.sf-card-4 .item__desc::before {
    width: 44px;
    height: 44px;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: rgba(0,0,0,.58);
    border: 1px solid rgba(255,255,255,.35);
    font-size: 18px;
}

/* ВАРИАНТ 5 — постер в рамке и нижняя панель с акцентной линией. */
.sf-auto-profile.sf-card-5 .item {
    display: flex;
    flex-direction: column;
    padding: 7px;
    overflow: hidden;
    background: var(--bg-darker);
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    box-shadow: var(--bsh-block);
}
.sf-auto-profile.sf-card-5 .item__img {
    border-radius: max(0px, calc(var(--sf-card-radius) - 5px));
    box-shadow: none;
}
.sf-auto-profile.sf-card-5 .item__img.img-mask::after {
    height: 25%;
    opacity: .3;
}
.sf-auto-profile.sf-card-5 .item__label {
    left: 7px;
    top: 7px;
    border-radius: 999px;
}
.sf-auto-profile.sf-card-5 .item__desc {
    position: relative;
    inset: auto;
    flex: 1 1 auto;
    min-height: 105px;
    justify-content: space-between;
    padding: 11px 6px 5px 10px;
    text-align: left;
    color: #444;
    background: transparent;
    border-left: 3px solid var(--accent);
    --tt: #444;
    --bdc: rgba(0,0,0,.12);
}
.dt.sf-auto-profile.sf-card-5 .item__desc {
    color: #ccc;
    --tt: #ccc;
    --bdc: rgba(255,255,255,.18);
}
.sf-auto-profile.sf-card-5 .item__desc::before {
    display: none;
}
.sf-auto-profile.sf-card-5 .item__title {
    font-size: 14px;
    line-height: 1.32;
    margin-bottom: 4px;
}
.sf-auto-profile.sf-card-5 .item__year {
    color: var(--tt-fade);
    opacity: 1;
}
.sf-auto-profile.sf-card-5 .item__rates {
    justify-content: flex-start;
    gap: 9px;
    margin-top: 8px;
    padding-top: 8px;
    font-size: 11px;
}
.sf-auto-profile.sf-card-5 .item__rates-item::before {
    font-size: 9px;
}

/* На небольших экранах карточки с нижней панелью остаются компактными. */
@media screen and (max-width:760px) {
    .sf-auto-profile.sf-card-2 .item__desc,
    .sf-auto-profile.sf-card-5 .item__desc {
        min-height: 96px;
        padding-top: 9px;
        padding-bottom: 8px;
    }
    .sf-auto-profile.sf-card-3 .item__desc {
        min-height: 48%;
        padding: 10px;
    }
    .sf-auto-profile.sf-card-3 .item__head,
    .sf-auto-profile.sf-card-3 .item__rates {
        padding-right: 35px;
    }
    .sf-auto-profile.sf-card-3 .item__desc::before {
        right: 7px;
        bottom: 8px;
        width: 32px;
        height: 32px;
        font-size: 14px;
    }
}

/* ============================================================
 * ЭТАП 3 — ПЯТЬ СТАБИЛЬНЫХ ВАРИАНТОВ ШАПКИ
 * Вариант выбирается на сервере по постоянному ID автопрофиля.
 * На планшетах и телефонах используется штатная мобильная шапка,
 * поэтому меню, поиск и авторизация продолжают работать как раньше.
 * ============================================================ */

@media screen and (min-width:1221px) {
    /* Общая нормализация для всех автопрофилей шапки. */
    .sf-auto-profile .header {
        isolation: isolate;
    }
    .sf-auto-profile .header__logo,
    .sf-auto-profile .header__menu,
    .sf-auto-profile .header__search,
    .sf-auto-profile .header__theme-select,
    .sf-auto-profile .header__btn-login {
        min-width: 0;
    }

    /* ВАРИАНТ 1 — классическая линия с тонким акцентом снизу. */
    .sf-auto-profile.sf-header-1 .header {
        border-bottom: 3px solid var(--accent);
    }
    .sf-auto-profile.sf-header-1 .header__menu > li > a {
        height: 67px;
    }
    .sf-auto-profile.sf-header-1 .header__search {
        max-width: 330px;
    }

    /* ВАРИАНТ 2 — двухэтажная шапка: управление сверху, меню отдельной полосой. */
    .sf-auto-profile.sf-header-2 .header {
        flex-wrap: wrap;
        row-gap: 0;
        padding-top: 14px;
        padding-bottom: 0;
        border-bottom: 1px solid var(--bdc);
    }
    .sf-auto-profile.sf-header-2 .header__logo {
        order: 1;
    }
    .sf-auto-profile.sf-header-2 .header__search {
        order: 2;
        min-width: 260px;
        margin-left: 24px;
    }
    .sf-auto-profile.sf-header-2 .header__theme-select {
        order: 3;
    }
    .sf-auto-profile.sf-header-2 .header__btn-login {
        order: 4;
    }
    .sf-auto-profile.sf-header-2 .header__menu {
        order: 20;
        justify-content: center;
        width: calc(100% + (var(--indent) * 2));
        margin: 14px var(--indent-negative) 0;
        padding: 0 var(--indent);
        border-top: 1px solid var(--bdc);
        background: var(--bg-darker-1);
    }
    .sf-auto-profile.sf-header-2 .header__menu > li > a {
        height: 48px;
        font-size: 14px;
        opacity: .8;
    }
    .sf-auto-profile.sf-header-2 .header__menu-hidden {
        top: 100%;
    }
    .sf-auto-profile.sf-header-2 .header .header__menu li:has(.header__menu-hidden)::before {
        bottom: 0;
    }

    /* ВАРИАНТ 3 — компактная навигационная панель с заметным поиском. */
    .sf-auto-profile.sf-header-3 .header {
        min-height: 62px;
        padding-top: 8px;
        padding-bottom: 8px;
        border-bottom: 4px solid var(--accent);
        box-shadow: 0 7px 22px rgba(0,0,0,.08);
    }
    .sf-auto-profile.sf-header-3 .header__logo {
        padding-left: 40px;
        font-size: 20px;
        letter-spacing: .03em;
    }
    .sf-auto-profile.sf-header-3 .header__logo::before {
        width: 32px;
        height: 32px;
    }
    .sf-auto-profile.sf-header-3 .header__menu {
        flex: 1 1 auto;
        justify-content: flex-start;
        margin: 0 12px;
        gap: 4px;
    }
    .sf-auto-profile.sf-header-3 .header__menu > li > a {
        height: 40px;
        padding: 0 10px;
        border-radius: max(4px, calc(var(--sf-card-radius) / 2));
        font-size: 13px;
        opacity: .78;
    }
    .sf-auto-profile.sf-header-3 .header__menu > li:hover > a {
        color: #fff;
        background: var(--accent);
        opacity: 1;
    }
    .sf-auto-profile.sf-header-3 .header__search {
        flex: 0 1 260px;
        max-width: 260px;
    }
    .sf-auto-profile.sf-header-3 .search-block__input,
    .sf-auto-profile.sf-header-3 .search-block__input:focus {
        height: 40px;
        padding-left: 16px;
        border-radius: 999px;
        background: var(--bg-darker-1);
        box-shadow: inset 0 0 0 1px var(--bdc);
    }
    .sf-auto-profile.sf-header-3 .search-block__btn {
        height: 40px;
    }
    .sf-auto-profile.sf-header-3 .header__btn-login {
        height: 40px;
        border-radius: 999px;
    }

    /* ВАРИАНТ 4 — логотип по центру сверху, навигация второй строкой. */
    .sf-auto-profile.sf-header-4 .header {
        flex-wrap: wrap;
        justify-content: center;
        row-gap: 12px;
        padding-top: 16px;
        padding-bottom: 14px;
        background: var(--bg);
        box-shadow: inset 0 4px 0 var(--accent), var(--bsh-block);
    }
    .sf-auto-profile.sf-header-4 .header__logo {
        order: 1;
        flex: 0 0 100%;
        justify-content: center;
        height: 44px;
        padding-left: 0;
        font-size: 26px;
    }
    .sf-auto-profile.sf-header-4 .header__logo::before {
        position: relative;
        left: auto;
        top: auto;
        flex: 0 0 40px;
        margin-right: 10px;
        translate: none;
    }
    .sf-auto-profile.sf-header-4 .header__menu {
        order: 2;
        justify-content: center;
        margin: 0 8px 0 0;
    }
    .sf-auto-profile.sf-header-4 .header__menu > li > a {
        height: 42px;
        padding: 0 8px;
        font-size: 14px;
    }
    .sf-auto-profile.sf-header-4 .header__search {
        order: 3;
        flex: 1 1 260px;
        max-width: 360px;
    }
    .sf-auto-profile.sf-header-4 .header__theme-select {
        order: 4;
    }
    .sf-auto-profile.sf-header-4 .header__btn-login {
        order: 5;
    }
    .sf-auto-profile.sf-header-4 .search-block__input,
    .sf-auto-profile.sf-header-4 .search-block__input:focus {
        border-radius: max(6px, calc(var(--sf-card-radius) / 2));
        background: var(--bg-darker-1);
    }
    .sf-auto-profile.sf-header-4 .header__menu-hidden {
        top: 100%;
    }

    /* ВАРИАНТ 5 — плавающая карточка с округлёнными элементами. */
    .sf-auto-profile.sf-header-5 .header {
        top: 12px;
        margin: 12px;
        padding: 12px 14px;
        border: 1px solid var(--bdc);
        border-radius: max(10px, var(--sf-card-radius));
        background: var(--bg);
        box-shadow: var(--bsh-block);
        backdrop-filter: blur(12px);
    }
    .sf-auto-profile.sf-header-5 .header__logo {
        padding-left: 42px;
        font-size: 20px;
    }
    .sf-auto-profile.sf-header-5 .header__logo::before {
        width: 34px;
        height: 34px;
    }
    .sf-auto-profile.sf-header-5 .header__menu {
        margin: 0 16px;
        gap: 4px;
    }
    .sf-auto-profile.sf-header-5 .header__menu > li > a {
        height: 40px;
        padding: 0 9px;
        border-radius: 999px;
        font-size: 13px;
        opacity: .72;
    }
    .sf-auto-profile.sf-header-5 .header__menu > li:hover > a {
        color: var(--accent);
        background: var(--bg-darker-1);
        opacity: 1;
    }
    .sf-auto-profile.sf-header-5 .header__search {
        flex: 1 1 220px;
        max-width: 290px;
    }
    .sf-auto-profile.sf-header-5 .search-block__input,
    .sf-auto-profile.sf-header-5 .search-block__input:focus {
        height: 40px;
        padding-left: 15px;
        border-radius: 999px;
        background: var(--bg-darker-1);
        box-shadow: inset 0 0 0 1px var(--bdc);
    }
    .sf-auto-profile.sf-header-5 .search-block__btn {
        height: 40px;
    }
    .sf-auto-profile.sf-header-5 .header__theme-select {
        border-radius: 50%;
        background: var(--bg-darker-1);
    }
    .sf-auto-profile.sf-header-5 .header__btn-login {
        height: 40px;
        border-radius: 999px;
    }
    .sf-auto-profile.sf-header-5 .header__menu-hidden {
        top: 100%;
        border-radius: max(6px, calc(var(--sf-card-radius) / 2));
    }
}

/* Штатный адаптив остаётся главным: на узких экранах варианты не вмешиваются. */
@media screen and (max-width:1220px) {
    .sf-auto-profile[class*="sf-header-"] .header {
        top: 0;
        margin: 0;
        border-radius: 0;
        border-left: 0;
        border-right: 0;
        backdrop-filter: none;
    }
}


/* ============================================================
 * ЭТАП 3.1 — ПРЯМЫЕ ССЫЛКИ С ПОСТЕРОВ
 * Постер ведёт на ту же новость, что и название.
 * ============================================================ */
.item__img-link,
.fr__img-link {
    color: inherit;
    text-decoration: none;
}

.item__img-link:focus-visible,
.fr__img-link:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 3px;
}


/* ============================================================
 * ЭТАП 4 — ПЯТЬ СЕРВЕРНЫХ КОМПОНОВОК ГЛАВНОЙ СТРАНИЦЫ
 * В HTML присутствует только один назначенный вариант.
 * ============================================================ */

.sf-home-layout {min-width: 0;}
.sf-home-layout > .sf-home-popular:first-child {margin-top: -20px;}
.sf-home-layout .sf-home-popular {margin-bottom: 20px;}
.sf-home-layout .sf-home-section:last-child,
.sf-home-layout .sf-home-popular:last-child {margin-bottom: 0;}

.sf-home-heading {
    position: relative;
    overflow: hidden;
    margin: 0 0 20px;
    padding: 22px 24px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background:
        linear-gradient(120deg, color-mix(in srgb, var(--accent) 14%, transparent), transparent 55%),
        var(--bg);
    box-shadow: var(--sf-shadow);
}
.sf-home-heading::after {
    content: "";
    position: absolute;
    right: -42px;
    top: -72px;
    width: 190px;
    height: 190px;
    border: 34px solid color-mix(in srgb, var(--accent) 16%, transparent);
    border-radius: 50%;
    pointer-events: none;
}
.sf-home-heading__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.sf-home-heading__title {
    position: relative;
    z-index: 1;
    color: var(--tt);
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 500;
    line-height: 1.15;
}

.sf-home-layout--2 .sf-home-popular--last {
    margin-top: 28px;
    margin-bottom: -20px;
}
.sf-home-layout--3 .sf-home-popular--middle {
    margin-top: 26px;
    margin-bottom: 26px;
}

.sf-home-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}
.sf-home-columns > .sect {
    min-width: 0;
    margin-bottom: 0;
    padding: 18px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}
.sf-home-columns .sect__header {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
}
.sf-home-columns .sect__tabs {
    width: 100%;
    overflow-x: auto;
}
.sf-home-columns .sect__tabs button {
    flex: 1 0 auto;
    min-width: 86px;
    padding-inline: 9px;
}
.sf-home-columns .grid-items {
    grid-template-columns: repeat(auto-fill, minmax(min(35vw, 145px), 1fr));
}

.sf-home-editorial {
    display: grid;
    grid-template-columns: minmax(170px, .28fr) minmax(0, 1fr);
    gap: 24px;
    margin-bottom: 28px;
    padding: 20px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}
.sf-home-editorial--reverse {
    grid-template-columns: minmax(0, 1fr) minmax(170px, .28fr);
}
.sf-home-editorial--reverse .sf-home-editorial__intro {order: 2;}
.sf-home-editorial--reverse .sf-home-editorial__content {order: 1;}

.sf-home-editorial__intro {
    position: sticky;
    top: 20px;
    align-self: start;
    min-width: 0;
    padding: 22px;
    border-radius: max(8px, calc(var(--sf-card-radius) * .75));
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--accent) 88%, #000), var(--accent));
    color: #fff;
}
.sf-home-editorial__intro span,
.sf-home-editorial__intro small {
    display: block;
    opacity: .8;
}
.sf-home-editorial__intro span {
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.sf-home-editorial__intro strong {
    display: block;
    margin-bottom: 10px;
    font-size: clamp(25px, 3vw, 38px);
    line-height: 1;
}
.sf-home-editorial__intro small {
    font-size: 13px;
    line-height: 1.45;
}
.sf-home-editorial__content {min-width: 0;}
.sf-home-editorial__content > .sect {margin-bottom: 0;}
.sf-home-editorial__content .sect__title {display: none;}

.sf-home-layout--5 .sf-home-popular--last {
    margin-top: 8px;
    margin-bottom: -20px;
}

@media screen and (max-width: 1220px) {
    .sf-home-columns {grid-template-columns: 1fr;}
    .sf-home-columns .grid-items {
        grid-template-columns: repeat(auto-fill, minmax(min(40vw, 170px), 1fr));
    }
    .sf-home-editorial,
    .sf-home-editorial--reverse {grid-template-columns: 1fr;}
    .sf-home-editorial--reverse .sf-home-editorial__intro,
    .sf-home-editorial--reverse .sf-home-editorial__content {order: initial;}
    .sf-home-editorial__intro {
        position: static;
        padding: 18px 20px;
    }
}

@media screen and (max-width: 760px) {
    .sf-home-heading {padding: 18px;}
    .sf-home-columns {gap: 18px;}
    .sf-home-columns > .sect,
    .sf-home-editorial {padding: 14px;}
    .sf-home-editorial {gap: 16px;}
    .sf-home-editorial__content .sect__tabs {overflow-x: auto;}
    .sf-home-layout--2 .sf-home-popular--last,
    .sf-home-layout--5 .sf-home-popular--last {margin-bottom: -20px;}
}


/* ============================================================
 * ЭТАП 4.1 — ВЫРАВНИВАНИЕ ДВУХКОЛОНОЧНОЙ ГЛАВНОЙ
 *
 * Базовое правило автопрофиля:
 * .sf-auto-profile .sect + .sect
 * добавляло верхний отступ второй колонке.
 * Внутри sf-home-columns обе секции должны начинаться на одной линии.
 * ============================================================ */
.sf-auto-profile .sf-home-columns > .sect + .sect {
    margin-top: 0;
}


/* ============================================================
 * ЭТАП 5 — ПЯТЬ ВАРИАНТОВ ПОЛНОЙ СТРАНИЦЫ
 *
 * Варианты назначаются постоянным классом sf-full-1..sf-full-5.
 * Разметка и логика плеера не меняются.
 * ============================================================ */

.sf-auto-profile .sf-fullstory .page__header h1 {
    line-height: 1.2;
}

.sf-auto-profile .sf-fullstory .page__main,
.sf-auto-profile .sf-fullstory .page__player,
.sf-auto-profile .sf-fullstory .page__fr,
.sf-auto-profile .sf-fullstory .page__comments {
    min-width: 0;
}

/* ВАРИАНТ 1 — классическая страница с акцентной линией. */
.sf-auto-profile.sf-full-1 .page__cols--details {
    border-top: 4px solid var(--accent);
}

.sf-auto-profile.sf-full-1 .page__header h1 {
    font-size: clamp(20px, 2vw, 28px);
}

/* ВАРИАНТ 2 — постер справа, описание и характеристики слева. */
.sf-auto-profile.sf-full-2 .page__main {
    grid-template-columns: minmax(0, 1fr) 220px;
    grid-template-areas:
        "header poster"
        "info poster";
}

.sf-auto-profile.sf-full-2 .page__poster {
    justify-self: end;
    width: 220px;
}

.sf-auto-profile.sf-full-2 .page__header {
    padding-bottom: 12px;
    border-bottom: 2px solid var(--accent);
}

.sf-auto-profile.sf-full-2 .page__header h1 {
    font-size: clamp(22px, 2.4vw, 32px);
}

.sf-auto-profile.sf-full-2 .page__list {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

/* ВАРИАНТ 3 — большая редакционная карточка с усиленным заголовком. */
.sf-auto-profile.sf-full-3 .page__cols-left--details {
    padding: 28px;
}

.sf-auto-profile.sf-full-3 .page__main {
    grid-template-columns: 245px minmax(0, 1fr);
    gap: 20px 28px;
    margin-bottom: 20px;
    padding: 24px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 13%, transparent), transparent 48%),
        var(--bg);
    box-shadow: var(--bsh-block);
}

.sf-auto-profile.sf-full-3 .page__poster {
    width: 245px;
    border: 4px solid var(--bg);
}

.sf-auto-profile.sf-full-3 .page__header {
    align-self: end;
}

.sf-auto-profile.sf-full-3 .page__header h1 {
    font-size: clamp(26px, 3vw, 38px);
    letter-spacing: -.025em;
}

.sf-auto-profile.sf-full-3 .page__text {
    padding: 16px 18px;
    border-left: 4px solid var(--accent);
    background: color-mix(in srgb, var(--bg-darker-1) 72%, transparent);
}

.sf-auto-profile.sf-full-3 .page__subtitle {
    margin-inline: 0;
    border: 0;
    border-radius: var(--sf-card-radius);
    background: var(--bg-darker-1);
}

/* ВАРИАНТ 4 — широкий плеер, список популярного под ним. */
.sf-auto-profile.sf-full-4 .page__cols--details .page__main {
    grid-template-columns: 230px minmax(0, 1fr);
}

.sf-auto-profile.sf-full-4 .page__cols--player {
    display: block;
}

.sf-auto-profile.sf-full-4 .page__cols--player > .page__cols-left--player {
    padding: 0;
}

.sf-auto-profile.sf-full-4 .page__cols--player > .page__cols-right--franchise {
    position: static;
    padding: 0;
    background: var(--bg-blackest);
}

.sf-auto-profile.sf-full-4 .page__fr {
    position: static;
}

.sf-auto-profile.sf-full-4 .page__fr-caption {
    height: auto;
    min-height: 48px;
    padding: 12px 20px;
    border-top: 1px solid rgba(255,255,255,.16);
}

.sf-auto-profile.sf-full-4 .page__fr .sect__content {
    height: auto;
    max-height: none;
    overflow: visible;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.sf-auto-profile.sf-full-4 .page__fr .fr {
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: max(4px, calc(var(--sf-card-radius) * .65));
    background: rgba(255,255,255,.05);
}

.sf-auto-profile.sf-full-4 .page__fr .fr__img {
    flex: 0 0 46px;
}

/* ВАРИАНТ 5 — кинотеатр: плеер визуально идёт первым, информация ниже. */
.sf-auto-profile.sf-full-5 .sf-fullstory__bg {
    display: flex;
    flex-direction: column;
}

.sf-auto-profile.sf-full-5 .page__cols--player {
    order: 1;
    grid-template-columns: minmax(0, 1fr) 240px;
}

.sf-auto-profile.sf-full-5 .page__cols--details {
    order: 2;
    border-top: 1px solid var(--bdc);
}

.sf-auto-profile.sf-full-5 .page__cols--details .page__main {
    grid-template-columns: 170px minmax(0, 1fr);
    grid-template-areas:
        "poster header"
        "poster info";
    margin-bottom: 18px;
}

.sf-auto-profile.sf-full-5 .page__cols--details .page__poster {
    width: 170px;
}

.sf-auto-profile.sf-full-5 .page__cols--details .page__header h1 {
    font-size: clamp(22px, 2.4vw, 32px);
}

.sf-auto-profile.sf-full-5 .page__cols--details .page__text {
    max-width: 920px;
}

.sf-auto-profile.sf-full-5 .page__subtitle {
    text-align: left;
    border-top: 0;
    border-left: 4px solid var(--accent);
}

/* Планшеты: горизонтальные варианты мягко переходят в одну колонку. */
@media screen and (max-width: 1220px) {
    .sf-auto-profile.sf-full-4 .page__fr .sect__content {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sf-auto-profile.sf-full-5 .page__cols--player {
        grid-template-columns: minmax(0, 1fr) 220px;
    }
}

/* Телефоны: сохраняем штатную мобильную компоновку Film. */
@media screen and (max-width: 760px) {
    .sf-auto-profile.sf-full-2 .page__main,
    .sf-auto-profile.sf-full-3 .page__main,
    .sf-auto-profile.sf-full-4 .page__cols--details .page__main,
    .sf-auto-profile.sf-full-5 .page__cols--details .page__main {
        display: block;
    }

    .sf-auto-profile.sf-full-2 .page__poster,
    .sf-auto-profile.sf-full-3 .page__poster,
    .sf-auto-profile.sf-full-5 .page__cols--details .page__poster {
        width: 200px;
        margin-inline: auto;
    }

    .sf-auto-profile.sf-full-3 .page__cols-left--details {
        padding: 20px;
    }

    .sf-auto-profile.sf-full-3 .page__main {
        padding: 16px;
    }

    .sf-auto-profile.sf-full-4 .page__fr .sect__content {
        grid-template-columns: 1fr;
        max-height: 180px;
        overflow-y: auto;
    }

    .sf-auto-profile.sf-full-5 .sf-fullstory__bg {
        display: block;
    }

    .sf-auto-profile.sf-full-5 .page__cols--player,
    .sf-auto-profile.sf-full-5 .page__cols--details {
        display: block;
    }

    .sf-auto-profile.sf-full-5 .page__subtitle {
        text-align: center;
        border-left: 0;
        border-top: 1px solid var(--bdc);
    }
}


/* ============================================================
 * ЭТАП 6 — ПЯТЬ ВАРИАНТОВ КАТАЛОГА, ИЗБРАННОГО И ПОИСКА
 *
 * Вариант назначается постоянным классом sf-catalog-1..5.
 * URL, H1, canonical, фильтры, сортировка и пагинация DLE
 * не меняются.
 * ============================================================ */

.sf-auto-profile .sf-catalog {
    min-width: 0;
}

.sf-auto-profile .sf-catalog__layout,
.sf-auto-profile .sf-catalog__grid,
.sf-auto-profile .sf-search-catalog {
    min-width: 0;
}

.sf-auto-profile .sf-catalog__header {
    min-width: 0;
}

.sf-auto-profile .sf-catalog__kicker {
    margin-bottom: 7px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.sf-auto-profile .sf-catalog__title {
    margin: 0;
    color: var(--tt);
    font-size: clamp(22px, 2.3vw, 32px);
    line-height: 1.18;
}

.sf-auto-profile .sf-catalog__description {
    max-width: 920px;
    margin-top: 10px;
    color: var(--tt-fade);
    font-size: 14px;
    line-height: 1.6;
}

.sf-auto-profile .sf-catalog__description:empty {
    display: none;
}

.sf-auto-profile .sf-catalog__grid > #dle-content,
.sf-auto-profile .sf-search-catalog > #dle-content {
    min-width: 0;
}

.sf-auto-profile .sf-pagination {
    grid-column: 1 / -1;
}

/* Базовые короткие результаты поиска перенесены из searchresult.tpl. */
.sf-auto-profile .sf-search-row {
    grid-column: 1 / -1;
    min-width: 0;
    margin-bottom: 10px;
    border: 1px solid var(--ui-bdc);
    border-radius: max(0px, calc(var(--sf-card-radius) * .55));
    background: var(--bg);
    color: var(--tt);
    font-size: 14px;
    overflow: hidden;
}

.sf-auto-profile .sf-search-row__title,
.sf-auto-profile .sres__title {
    min-width: 0;
    padding: 11px 14px;
}

.sf-auto-profile .sf-search-row .sres__btn {
    align-self: stretch;
    border-radius: 0;
    padding: 0 16px;
    font-size: 12px;
    text-transform: uppercase;
}

.sf-auto-profile .sf-search-row:hover .sres__title {
    text-decoration: underline;
}

.sf-auto-profile .sf-search-page {
    grid-column: 1 / -1;
    min-width: 0;
}

.sf-auto-profile .sf-search-page__title {
    margin-bottom: 18px;
}

.sf-auto-profile .sf-search-page__form {
    min-width: 0;
}

/* ------------------------------------------------------------
 * ВАРИАНТ 1 — чистый классический каталог.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-catalog-1 .sf-catalog__header {
    padding-bottom: 16px;
    border-bottom: 3px solid var(--accent);
}

.sf-auto-profile.sf-catalog-1 .sf-catalog__grid,
.sf-auto-profile.sf-catalog-1 .sf-search-catalog {
    grid-template-columns: repeat(auto-fill, minmax(min(40vw, 170px), 1fr));
}

.sf-auto-profile.sf-catalog-1 .sf-pagination {
    padding-top: 18px;
}

/* ------------------------------------------------------------
 * ВАРИАНТ 2 — крупная приветственная панель и каталог-карточка.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-catalog-2 .sf-catalog__layout {
    padding: 20px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-catalog-2 .sf-catalog__header {
    position: relative;
    overflow: hidden;
    margin-bottom: 22px;
    padding: 26px 28px;
    border-radius: max(6px, calc(var(--sf-card-radius) * .78));
    background:
        radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--accent) 25%, transparent), transparent 28%),
        linear-gradient(125deg, color-mix(in srgb, var(--accent) 15%, transparent), transparent 54%),
        var(--bg-darker-1);
}

.sf-auto-profile.sf-catalog-2 .sf-catalog__header::after {
    content: "";
    position: absolute;
    right: -35px;
    bottom: -62px;
    width: 180px;
    aspect-ratio: 1;
    border: 30px solid color-mix(in srgb, var(--accent) 14%, transparent);
    border-radius: 50%;
    pointer-events: none;
}

.sf-auto-profile.sf-catalog-2 .sf-catalog__header > * {
    position: relative;
    z-index: 1;
}

.sf-auto-profile.sf-catalog-2 .sf-catalog__grid,
.sf-auto-profile.sf-catalog-2 .sf-search-catalog {
    grid-template-columns: repeat(auto-fill, minmax(min(42vw, 180px), 1fr));
}

.sf-auto-profile.sf-catalog-2 .sf-search-page {
    padding: 24px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background:
        linear-gradient(130deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 55%),
        var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-catalog-2 .sf-pagination {
    margin-top: 8px;
    padding: 16px;
    border-radius: max(4px, calc(var(--sf-card-radius) * .7));
    background: var(--bg-darker-1);
}

/* ------------------------------------------------------------
 * ВАРИАНТ 3 — плотный медиакаталог.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-catalog-3 .sf-catalog__header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 14px;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--bdc);
}

.sf-auto-profile.sf-catalog-3 .sf-catalog__kicker {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    margin: 0;
    padding-left: 8px;
    border-left: 3px solid var(--accent);
}

.sf-auto-profile.sf-catalog-3 .sf-catalog__title {
    flex: 1;
    font-size: clamp(20px, 2vw, 27px);
}

.sf-auto-profile.sf-catalog-3 .sf-catalog__description {
    max-width: 520px;
    margin: 0;
    font-size: 13px;
}

.sf-auto-profile.sf-catalog-3 .sf-catalog__grid,
.sf-auto-profile.sf-catalog-3 .sf-search-catalog {
    gap: max(7px, calc(var(--sf-grid-gap) * .72));
    grid-template-columns: repeat(auto-fill, minmax(min(31vw, 145px), 1fr));
}

.sf-auto-profile.sf-catalog-3 .sf-catalog__grid .item__title,
.sf-auto-profile.sf-catalog-3 .sf-search-catalog .item__title {
    font-size: 13px;
}

.sf-auto-profile.sf-catalog-3 .sf-catalog__grid .item__label,
.sf-auto-profile.sf-catalog-3 .sf-search-catalog .item__label {
    padding: 3px 8px;
    font-size: 10px;
}

.sf-auto-profile.sf-catalog-3 .sf-pagination {
    justify-content: flex-end;
    padding-top: 14px;
}

.sf-auto-profile.sf-catalog-3 .sf-search-page__form {
    padding: 18px;
    border-left: 4px solid var(--accent);
    background: var(--bg);
}

/* ------------------------------------------------------------
 * ВАРИАНТ 4 — заголовок в отдельной боковой колонке.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-catalog-4 .sf-catalog__layout {
    display: grid;
    grid-template-columns: minmax(205px, .24fr) minmax(0, 1fr);
    gap: 26px;
    align-items: start;
}

.sf-auto-profile.sf-catalog-4 .sf-catalog__header {
    position: sticky;
    top: 20px;
    margin: 0;
    padding: 26px 22px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background:
        linear-gradient(155deg, color-mix(in srgb, var(--accent) 17%, transparent), transparent 55%),
        var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-catalog-4 .sf-catalog__header::before {
    content: "";
    display: block;
    width: 52px;
    height: 5px;
    margin-bottom: 20px;
    border-radius: 10px;
    background: var(--accent);
}

.sf-auto-profile.sf-catalog-4 .sf-catalog__title {
    font-size: clamp(24px, 2.6vw, 36px);
}

.sf-auto-profile.sf-catalog-4 .sf-catalog__description {
    font-size: 13px;
}

.sf-auto-profile.sf-catalog-4 .sf-catalog__grid,
.sf-auto-profile.sf-catalog-4 .sf-search-catalog {
    grid-template-columns: repeat(auto-fill, minmax(min(37vw, 165px), 1fr));
}

.sf-auto-profile.sf-catalog-4 .sf-search-page {
    padding: 24px;
    border-left: 5px solid var(--accent);
    border-radius: 0 var(--sf-card-radius) var(--sf-card-radius) 0;
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-catalog-4 .sf-pagination {
    justify-content: flex-start;
    padding-top: 18px;
}

/* ------------------------------------------------------------
 * ВАРИАНТ 5 — журнальная сетка с крупной первой карточкой.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-catalog-5 .sf-catalog__header {
    margin-bottom: 24px;
    padding: 22px 24px;
    border-left: 7px solid var(--accent);
    border-radius: 0 var(--sf-card-radius) var(--sf-card-radius) 0;
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-catalog-5 .sf-catalog__title {
    font-size: clamp(25px, 3vw, 40px);
    letter-spacing: -.025em;
}

.sf-auto-profile.sf-catalog-5 .sf-catalog__grid,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog {
    grid-template-columns: repeat(auto-fill, minmax(min(38vw, 165px), 1fr));
    grid-auto-flow: dense;
}

.sf-auto-profile.sf-catalog-5 .sf-catalog__grid > .item:first-child,
.sf-auto-profile.sf-catalog-5 .sf-catalog__grid > #dle-content > .item:first-child,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog > .item:first-of-type,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog > #dle-content > .item:first-of-type {
    grid-column: span 2;
}

.sf-auto-profile.sf-catalog-5 .sf-catalog__grid > .item:first-child .item__img,
.sf-auto-profile.sf-catalog-5 .sf-catalog__grid > #dle-content > .item:first-child .item__img,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog > .item:first-of-type .item__img,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog > #dle-content > .item:first-of-type .item__img {
    aspect-ratio: 4 / 5;
}

.sf-auto-profile.sf-catalog-5 .sf-catalog__grid > .item:first-child .item__title,
.sf-auto-profile.sf-catalog-5 .sf-catalog__grid > #dle-content > .item:first-child .item__title,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog > .item:first-of-type .item__title,
.sf-auto-profile.sf-catalog-5 .sf-search-catalog > #dle-content > .item:first-of-type .item__title {
    font-size: clamp(17px, 1.8vw, 24px);
}

.sf-auto-profile.sf-catalog-5 .sf-search-page {
    padding: 26px;
    border: 1px solid var(--bdc);
    border-top: 6px solid var(--accent);
    border-radius: var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-catalog-5 .sf-pagination {
    justify-content: flex-end;
    margin-top: 10px;
    padding-top: 18px;
    border-top: 1px solid var(--bdc);
}

/* ------------------------------------------------------------
 * Адаптивность каталога.
 * ------------------------------------------------------------ */
@media screen and (max-width: 1220px) {
    .sf-auto-profile.sf-catalog-4 .sf-catalog__layout {
        grid-template-columns: 190px minmax(0, 1fr);
        gap: 20px;
    }

    .sf-auto-profile.sf-catalog-4 .sf-catalog__header {
        padding: 22px 18px;
    }

    .sf-auto-profile.sf-catalog-5 .sf-catalog__grid > .item:first-child,
    .sf-auto-profile.sf-catalog-5 .sf-catalog__grid > #dle-content > .item:first-child,
    .sf-auto-profile.sf-catalog-5 .sf-search-catalog > .item:first-of-type,
    .sf-auto-profile.sf-catalog-5 .sf-search-catalog > #dle-content > .item:first-of-type {
        grid-column: span 2;
    }
}

@media screen and (max-width: 760px) {
    .sf-auto-profile .sf-catalog__description {
        font-size: 13px;
    }

    .sf-auto-profile.sf-catalog-2 .sf-catalog__layout,
    .sf-auto-profile.sf-catalog-2 .sf-search-page,
    .sf-auto-profile.sf-catalog-5 .sf-search-page {
        padding: 14px;
    }

    .sf-auto-profile.sf-catalog-2 .sf-catalog__header {
        padding: 20px 18px;
    }

    .sf-auto-profile.sf-catalog-3 .sf-catalog__header {
        display: block;
    }

    .sf-auto-profile.sf-catalog-3 .sf-catalog__kicker {
        writing-mode: initial;
        transform: none;
        margin-bottom: 7px;
        padding: 0;
        border: 0;
    }

    .sf-auto-profile.sf-catalog-3 .sf-catalog__description {
        margin-top: 8px;
    }

    .sf-auto-profile.sf-catalog-4 .sf-catalog__layout {
        display: block;
    }

    .sf-auto-profile.sf-catalog-4 .sf-catalog__header {
        position: static;
        margin-bottom: 18px;
        padding: 20px 18px;
    }

    .sf-auto-profile.sf-catalog-4 .sf-search-page {
        padding: 16px;
    }

    .sf-auto-profile.sf-catalog-5 .sf-catalog__header {
        padding: 18px;
    }

    .sf-auto-profile.sf-catalog-5 .sf-catalog__grid > .item:first-child,
    .sf-auto-profile.sf-catalog-5 .sf-catalog__grid > #dle-content > .item:first-child,
    .sf-auto-profile.sf-catalog-5 .sf-search-catalog > .item:first-of-type,
    .sf-auto-profile.sf-catalog-5 .sf-search-catalog > #dle-content > .item:first-of-type {
        grid-column: auto;
    }

    .sf-auto-profile.sf-catalog-5 .sf-catalog__grid > .item:first-child .item__img,
    .sf-auto-profile.sf-catalog-5 .sf-catalog__grid > #dle-content > .item:first-child .item__img,
    .sf-auto-profile.sf-catalog-5 .sf-search-catalog > .item:first-of-type .item__img,
    .sf-auto-profile.sf-catalog-5 .sf-search-catalog > #dle-content > .item:first-of-type .item__img {
        aspect-ratio: 2 / 3;
    }

    .sf-auto-profile .sf-search-page__simple-form {
        flex-wrap: wrap;
    }

    .sf-auto-profile .sf-search-row {
        align-items: stretch;
    }
}


/* ============================================================
 * ЭТАП 7 — ПЯТЬ ПОДВАЛОВ И ПЯТЬ СЛУЖЕБНЫХ КОМПОНОВОК
 * ============================================================ */

/* Общая безопасная основа подвала. */
.sf-auto-profile .sf-footer {
    position: relative;
    overflow: hidden;
    padding: 34px var(--indent) 20px;
}

.sf-auto-profile .sf-footer__main {
    display: grid;
    grid-template-columns: minmax(210px, .9fr) minmax(320px, 1.4fr) minmax(220px, .9fr);
    gap: 26px;
    align-items: center;
}

.sf-auto-profile .sf-footer__brand,
.sf-auto-profile .sf-footer__nav,
.sf-auto-profile .sf-footer__notice,
.sf-auto-profile .sf-footer__bottom {
    min-width: 0;
}

.sf-auto-profile .sf-footer__tagline {
    margin-top: 10px;
    color: var(--tt-fade);
    font-size: 12px;
    line-height: 1.5;
}

.sf-auto-profile .sf-footer__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 20px;
}

.sf-auto-profile .sf-footer__nav a {
    position: relative;
    color: var(--tt-fade);
    font-size: 13px;
    transition: color .2s ease, opacity .2s ease;
}

.sf-auto-profile .sf-footer__nav a:hover {
    color: #fff;
}

.sf-auto-profile .sf-footer__notice {
    color: var(--tt-fade);
    font-size: 12px;
    line-height: 1.55;
}

.sf-auto-profile .sf-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 20px;
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid var(--bdc);
}

.sf-auto-profile .sf-footer__age {
    display: grid;
    place-items: center;
    min-width: 38px;
    height: 28px;
    padding: 0 8px;
    border: 1px solid var(--bdc);
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
}

.sf-auto-profile .sf-footer .footer__copyright {
    margin-right: auto;
    font-size: 12px;
}

.sf-auto-profile .sf-footer .footer__counter {
    min-width: 1px;
}

/* ------------------------------------------------------------
 * ПОДВАЛ 1 — классический горизонтальный.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-footer-1 .sf-footer {
    border-top: 4px solid var(--accent);
}

.sf-auto-profile.sf-footer-1 .sf-footer__nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: -4px;
    height: 2px;
    background: var(--accent);
    transition: right .2s ease;
}

.sf-auto-profile.sf-footer-1 .sf-footer__nav a:hover::after {
    right: 0;
}

/* ------------------------------------------------------------
 * ПОДВАЛ 2 — три отдельные карточки.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-footer-2 .sf-footer {
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 42%),
        var(--bg-black);
}

.sf-auto-profile.sf-footer-2 .sf-footer__brand,
.sf-auto-profile.sf-footer-2 .sf-footer__nav,
.sf-auto-profile.sf-footer-2 .sf-footer__notice {
    align-self: stretch;
    padding: 20px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: rgba(255,255,255,.035);
}

.sf-auto-profile.sf-footer-2 .sf-footer__nav {
    align-content: center;
}

.sf-auto-profile.sf-footer-2 .sf-footer__notice {
    display: flex;
    align-items: center;
}

/* ------------------------------------------------------------
 * ПОДВАЛ 3 — центрированный компактный.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-footer-3 .sf-footer__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 820px;
    margin-inline: auto;
    text-align: center;
}

.sf-auto-profile.sf-footer-3 .sf-footer__brand {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sf-auto-profile.sf-footer-3 .sf-footer__nav {
    padding: 12px 20px;
    border-block: 1px solid var(--bdc);
}

.sf-auto-profile.sf-footer-3 .sf-footer__notice {
    max-width: 620px;
}

.sf-auto-profile.sf-footer-3 .sf-footer__bottom {
    justify-content: center;
    text-align: center;
}

.sf-auto-profile.sf-footer-3 .sf-footer .footer__copyright {
    margin-right: 0;
}

/* ------------------------------------------------------------
 * ПОДВАЛ 4 — крупная акцентная панель бренда.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-footer-4 .sf-footer {
    padding-top: 24px;
}

.sf-auto-profile.sf-footer-4 .sf-footer__main {
    grid-template-columns: minmax(280px, 1.1fr) minmax(0, 1.5fr);
    grid-template-areas:
        "brand nav"
        "brand notice";
}

.sf-auto-profile.sf-footer-4 .sf-footer__brand {
    grid-area: brand;
    align-self: stretch;
    padding: 28px;
    border-radius: var(--sf-card-radius);
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--accent) 88%, #000), var(--accent));
    color: #fff;
}

.sf-auto-profile.sf-footer-4 .sf-footer__brand .logo {
    --tt: #fff;
}

.sf-auto-profile.sf-footer-4 .sf-footer__brand .sf-footer__tagline {
    color: rgba(255,255,255,.78);
}

.sf-auto-profile.sf-footer-4 .sf-footer__nav {
    grid-area: nav;
    justify-content: flex-start;
    align-self: end;
}

.sf-auto-profile.sf-footer-4 .sf-footer__notice {
    grid-area: notice;
    align-self: start;
}

/* ------------------------------------------------------------
 * ПОДВАЛ 5 — раздельная навигационная полоса.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-footer-5 .sf-footer {
    padding-inline: 0;
}

.sf-auto-profile.sf-footer-5 .sf-footer__main {
    grid-template-columns: minmax(230px, .8fr) minmax(0, 1.2fr);
    padding-inline: var(--indent);
}

.sf-auto-profile.sf-footer-5 .sf-footer__brand {
    grid-row: span 2;
}

.sf-auto-profile.sf-footer-5 .sf-footer__nav {
    justify-content: flex-end;
    padding: 14px 18px;
    border-radius: 999px;
    background: rgba(255,255,255,.055);
}

.sf-auto-profile.sf-footer-5 .sf-footer__notice {
    text-align: right;
}

.sf-auto-profile.sf-footer-5 .sf-footer__bottom {
    padding-inline: var(--indent);
}

/* Общая основа служебных страниц. */
.sf-auto-profile .sf-service-page {
    min-width: 0;
}

.sf-auto-profile .sf-service-page > .serv__title:first-child,
.sf-auto-profile .sf-service-page > .page__title:first-child,
.sf-auto-profile .sf-service-page > .us__one:first-child {
    position: relative;
}

.sf-auto-profile .sf-service-page .form__row {
    min-width: 0;
}

/* ------------------------------------------------------------
 * СЛУЖЕБНЫЙ ВАРИАНТ 1 — аккуратная классическая карточка.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-service-1 .sf-service-page {
    padding: 24px;
    border-top: 4px solid var(--accent);
    border-radius: 0 0 var(--sf-card-radius) var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-service-1 .sf-service-page .serv__title,
.sf-auto-profile.sf-service-1 .sf-service-page .page__title {
    margin-bottom: 22px;
}

/* ------------------------------------------------------------
 * СЛУЖЕБНЫЙ ВАРИАНТ 2 — узкая центрированная форма.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-service-2 .sf-service-page {
    max-width: 880px;
    margin-inline: auto;
    padding: 28px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--accent) 11%, transparent), transparent 55%),
        var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-service-2 .sf-service-page .serv__title,
.sf-auto-profile.sf-service-2 .sf-service-page .page__title {
    text-align: center;
}

.sf-auto-profile.sf-service-2 .sf-service-page .form__row--submit {
    justify-content: center;
}

/* ------------------------------------------------------------
 * СЛУЖЕБНЫЙ ВАРИАНТ 3 — секционная панель.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-service-3 .sf-service-page {
    padding: 20px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: var(--bg-darker-1);
}

.sf-auto-profile.sf-service-3 .sf-service-page .serv__section,
.sf-auto-profile.sf-service-3 .sf-service-page .form__row,
.sf-auto-profile.sf-service-3 .sf-service-page .message-info__content {
    border-radius: max(4px, calc(var(--sf-card-radius) * .7));
}

.sf-auto-profile.sf-service-3 .sf-service-page .serv__section {
    padding: 18px;
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-service-3 .sf-service-page .serv__subtitle {
    padding-left: 12px;
    border-left: 4px solid var(--accent);
}

/* ------------------------------------------------------------
 * СЛУЖЕБНЫЙ ВАРИАНТ 4 — боковая акцентная полоса.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-service-4 .sf-service-page {
    position: relative;
    padding: 26px 26px 26px 34px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-service-4 .sf-service-page::before {
    content: "";
    position: absolute;
    left: 0;
    top: 18px;
    bottom: 18px;
    width: 7px;
    border-radius: 0 7px 7px 0;
    background: var(--accent);
}

.sf-auto-profile.sf-service-4 .sf-service-page .serv__title,
.sf-auto-profile.sf-service-4 .sf-service-page .page__title {
    font-size: clamp(25px, 3vw, 38px);
    letter-spacing: -.02em;
}

/* ------------------------------------------------------------
 * СЛУЖЕБНЫЙ ВАРИАНТ 5 — контрастный заголовок и светлое тело.
 * ------------------------------------------------------------ */
.sf-auto-profile.sf-service-5 .sf-service-page {
    overflow: hidden;
    padding: 0 24px 24px;
    border: 1px solid var(--bdc);
    border-radius: var(--sf-card-radius);
    background: var(--bg);
    box-shadow: var(--sf-shadow);
}

.sf-auto-profile.sf-service-5 .sf-service-page > .serv__title:first-child,
.sf-auto-profile.sf-service-5 .sf-service-page > .page__title:first-child {
    margin-inline: -24px;
    margin-bottom: 24px;
    padding: 22px 24px;
    background:
        linear-gradient(120deg, color-mix(in srgb, var(--accent) 82%, #000), var(--accent));
    color: #fff;
}

.sf-auto-profile.sf-service-5 .sf-service-page .form__row--submit {
    padding-top: 18px;
    border-top: 1px solid var(--bdc);
}

/* Адаптивность этапа 7. */
@media screen and (max-width: 950px) {
    .sf-auto-profile .sf-footer__main,
    .sf-auto-profile.sf-footer-4 .sf-footer__main,
    .sf-auto-profile.sf-footer-5 .sf-footer__main {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: none;
    }

    .sf-auto-profile .sf-footer__brand {
        grid-column: 1;
        grid-row: 1;
    }

    .sf-auto-profile .sf-footer__nav {
        grid-column: 2;
        grid-row: 1;
    }

    .sf-auto-profile .sf-footer__notice {
        grid-column: 1 / -1;
        grid-row: 2;
        text-align: left;
    }

    .sf-auto-profile.sf-footer-4 .sf-footer__brand,
    .sf-auto-profile.sf-footer-4 .sf-footer__nav,
    .sf-auto-profile.sf-footer-4 .sf-footer__notice {
        grid-area: auto;
    }

    .sf-auto-profile.sf-footer-5 .sf-footer__notice {
        text-align: left;
    }
}

@media screen and (max-width: 590px) {
    .sf-auto-profile .sf-footer {
        padding-top: 28px;
    }

    .sf-auto-profile .sf-footer__main,
    .sf-auto-profile.sf-footer-4 .sf-footer__main,
    .sf-auto-profile.sf-footer-5 .sf-footer__main {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .sf-auto-profile .sf-footer__brand {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .sf-auto-profile .sf-footer__nav {
        justify-content: center;
    }

    .sf-auto-profile .sf-footer__notice {
        text-align: center;
    }

    .sf-auto-profile .sf-footer__bottom {
        justify-content: center;
        text-align: center;
    }

    .sf-auto-profile .sf-footer .footer__copyright {
        width: 100%;
        margin-right: 0;
    }

    .sf-auto-profile.sf-footer-5 .sf-footer__nav {
        border-radius: var(--sf-card-radius);
    }

    .sf-auto-profile.sf-service-1 .sf-service-page,
    .sf-auto-profile.sf-service-2 .sf-service-page,
    .sf-auto-profile.sf-service-3 .sf-service-page,
    .sf-auto-profile.sf-service-4 .sf-service-page,
    .sf-auto-profile.sf-service-5 .sf-service-page {
        padding: 18px;
    }

    .sf-auto-profile.sf-service-5 .sf-service-page > .serv__title:first-child,
    .sf-auto-profile.sf-service-5 .sf-service-page > .page__title:first-child {
        margin-inline: -18px;
        padding-inline: 18px;
    }
}


/* ============================================================
 * ЭТАП 8.1 — НАДЁЖНЫЙ КЛИК ПО ВСЕЙ КАРТОЧКЕ
 *
 * Отдельная ссылка лежит над декоративными слоями карточки.
 * Название и кнопка информации остаются выше неё.
 * ============================================================ */
.sf-auto-profile .item,
.sf-auto-profile .fr {
    position: relative;
}

.sf-auto-profile .sf-card-hit {
    position: absolute;
    inset: 0;
    z-index: 8;
    display: block;
    border-radius: inherit;
    cursor: pointer;
}

.sf-auto-profile .item__title,
.sf-auto-profile .fr__title {
    position: relative;
    z-index: 11;
}

.sf-auto-profile .item__title::after,
.sf-auto-profile .fr__title::after {
    z-index: 11;
}

.sf-auto-profile .item__btn-info {
    z-index: 12;
}

.sf-auto-profile .sf-card-hit:focus {
    outline: none;
}