/* ============================================================
   Basmach Theme — main.css
   ============================================================ */

/* ── Переменные ─────────────────────────────────────────────── */

:root {
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-size-base: 17px;

    --orange:        #f47c20;
    --orange-dim:    rgba(244, 124, 32, 0.15);
    --orange-border: rgba(244, 124, 32, 0.30);

    --radius-sm:  4px;
    --radius-md:  8px;
    --radius-lg:  12px;

    --header-h: 64px;
    --content-w: 900px;
    --site-px: 24px;

    --trans: 0.18s ease;
    --trans-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Тёмная тема (по умолчанию) */
[data-theme="dark"], :root {
    --bg:          #141414;
    --bg-2:        #1c1c1c;
    --bg-3:        #242424;
    --border:      rgba(255, 255, 255, 0.08);
    --border-mid:  rgba(255, 255, 255, 0.14);

    --text:        #e0e0e0;
    --text-2:      #909090;
    --text-3:      #555;

    --link:        #e0e0e0;
    --link-hover:  #ffffff;

    /* Бейджи рубрик */
    --cat-kino-bg:     rgba(83,  74,  183, 0.18);
    --cat-kino-c:      #9f96e8;
    --cat-kino-b:      rgba(83,  74,  183, 0.28);

    --cat-review-bg:   rgba(29,  158, 117, 0.18);
    --cat-review-c:    #5dcaa5;
    --cat-review-b:    rgba(29,  158, 117, 0.28);

    --cat-thoughts-bg: rgba(244, 124,  32, 0.14);
    --cat-thoughts-c:  #f5a35a;
    --cat-thoughts-b:  rgba(244, 124,  32, 0.25);

    --cat-days-bg:     rgba(212,  83, 126, 0.15);
    --cat-days-c:      #e8839f;
    --cat-days-b:      rgba(212,  83, 126, 0.25);

    --cat-food-bg:     rgba(186, 117,  23, 0.18);
    --cat-food-c:      #f5ae50;
    --cat-food-b:      rgba(186, 117,  23, 0.28);

    --cat-myself-bg:   rgba(55,  138, 221, 0.15);
    --cat-myself-c:    #85b7eb;
    --cat-myself-b:    rgba(55,  138, 221, 0.25);

    --cat-apple-bg:    rgba(55,  138, 221, 0.15);
    --cat-apple-c:     #85b7eb;
    --cat-apple-b:     rgba(55,  138, 221, 0.25);

    --cat-travel-bg:   rgba(29,  158, 117, 0.15);
    --cat-travel-c:    #5dcaa5;
    --cat-travel-b:    rgba(29,  158, 117, 0.25);

    --cat-default-bg:  rgba(255, 255, 255, 0.07);
    --cat-default-c:   #909090;
    --cat-default-b:   rgba(255, 255, 255, 0.12);

    /* Переключатель темы */
    --toggle-bg: rgba(255,255,255,0.08);
    --toggle-b:  rgba(255,255,255,0.14);
}

/* Светлая тема */
[data-theme="light"] {
    --bg:          #f5f4f0;
    --bg-2:        #ffffff;
    --bg-3:        #eceae4;
    --border:      rgba(0, 0, 0, 0.08);
    --border-mid:  rgba(0, 0, 0, 0.14);

    --text:        #1a1a1a;
    --text-2:      #666;
    --text-3:      #aaa;

    --link:        #1a1a1a;
    --link-hover:  #000;

    --cat-kino-bg:     rgba(83,  74,  183, 0.10);
    --cat-kino-c:      #534AB7;
    --cat-kino-b:      rgba(83,  74,  183, 0.20);

    --cat-review-bg:   rgba(15, 110,  86, 0.10);
    --cat-review-c:    #0F6E56;
    --cat-review-b:    rgba(15, 110,  86, 0.20);

    --cat-thoughts-bg: rgba(133,  79,  11, 0.10);
    --cat-thoughts-c:  #854F0B;
    --cat-thoughts-b:  rgba(133,  79,  11, 0.20);

    --cat-days-bg:     rgba(153,  53,  86, 0.10);
    --cat-days-c:      #993556;
    --cat-days-b:      rgba(153,  53,  86, 0.20);

    --cat-food-bg:     rgba(133,  79,  11, 0.10);
    --cat-food-c:      #854F0B;
    --cat-food-b:      rgba(133,  79,  11, 0.20);

    --cat-myself-bg:   rgba(24,  95, 165, 0.10);
    --cat-myself-c:    #185FA5;
    --cat-myself-b:    rgba(24,  95, 165, 0.20);

    --cat-apple-bg:    rgba(24,  95, 165, 0.10);
    --cat-apple-c:     #185FA5;
    --cat-apple-b:     rgba(24,  95, 165, 0.20);

    --cat-travel-bg:   rgba(15, 110,  86, 0.10);
    --cat-travel-c:    #0F6E56;
    --cat-travel-b:    rgba(15, 110,  86, 0.20);

    --cat-default-bg:  rgba(0, 0, 0, 0.06);
    --cat-default-c:   #666;
    --cat-default-b:   rgba(0, 0, 0, 0.10);

    --toggle-bg: rgba(0,0,0,0.06);
    --toggle-b:  rgba(0,0,0,0.12);
}

/* ── Сброс и базовые стили ──────────────────────────────────── */

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

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-sans);
    font-size: var(--font-size-base, 17px);
    line-height: 1.7;
    color: var(--text);
    background: var(--bg);
    transition: background var(--trans), color var(--trans);
    -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }

a {
    color: var(--link);
    text-decoration: none;
    transition: color var(--trans), opacity var(--trans);
}
a:hover { color: var(--link-hover); }
a:focus-visible {
    outline: 2px solid var(--orange);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

img, video { max-width: 100%; height: auto; display: block; }

button {
    font-family: var(--font-sans);
    cursor: pointer;
    border: none;
    background: none;
    color: inherit;
}
button:focus-visible {
    outline: 2px solid var(--orange);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

ul, ol { list-style: none; }

/* ── Обёртка сайта ──────────────────────────────────────────── */

.site-wrap {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.site-main {
    flex: 1;
    width: 100%;
    max-width: var(--content-w);
    margin: 0 auto;
    padding: 40px var(--site-px) 60px;
}

/* ── Шапка ──────────────────────────────────────────────────── */

.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: var(--bg);
    border-bottom: 0.5px solid var(--border);
    transition: background var(--trans), border-color var(--trans);
}

.site-header__inner {
    max-width: calc(var(--content-w) + var(--site-px) * 2);
    margin: 0 auto;
    padding: 20px var(--site-px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    transition: padding var(--trans-slow);
}

.site-header.is-compact .site-header__inner {
    padding: 10px var(--site-px);
}

/* Логотип-ссылка */
.site-logo {
    display: flex;
    align-items: center;
    gap: 16px;
    text-decoration: none;
    flex-shrink: 1;
    min-width: 0;
}

/* Апельсин */
.site-logo__avatar {
    flex-shrink: 0;
    width: 260px;
    height: 260px;
    transition: width var(--trans-slow), height var(--trans-slow);
    position: relative;
}
.site-header.is-compact .site-logo__avatar {
    width: 75px;
    height: 75px;
}

/* Картинки апельсина */
.site-logo__avatar img {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: opacity var(--trans);
}

/* Надпись */
.site-logo__name {
    flex-shrink: 1;
    min-width: 0;
    position: relative;
    width: 367px;
    height: 150px;
    transition: width var(--trans-slow), height var(--trans-slow);
}
.site-header.is-compact .site-logo__name {
    width: 184px;
    height: 75px;
}

/* Картинки надписи */
.site-logo__name img {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
    transition: opacity var(--trans);
}

/* Переключение по теме */
[data-theme="dark"]  .logo-img--dark  { opacity: 1; }
[data-theme="dark"]  .logo-img--light { opacity: 0; }
[data-theme="light"] .logo-img--dark  { opacity: 0; }
[data-theme="light"] .logo-img--light { opacity: 1; }

/* Правая часть шапки */
.site-header__right {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    align-self: flex-start;
}
.site-header.is-compact .site-header__right {
    align-self: center;
}

/* ── Дропдаун рубрик ────────────────────────────────────────── */

.cat-dropdown { position: relative; }

.cat-dropdown__trigger {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--radius-md);
    background: var(--toggle-bg);
    border: 0.5px solid var(--toggle-b);
    font-size: 13px;
    color: var(--text);
    transition: background var(--trans), border-color var(--trans);
    white-space: nowrap;
}

.cat-dropdown__trigger:hover {
    background: var(--bg-3);
    border-color: var(--border-mid);
}

.cat-dropdown__trigger .ti { font-size: 15px; }

.cat-dropdown__chevron {
    font-size: 13px !important;
    color: var(--text-3);
    transition: transform var(--trans);
}

.cat-dropdown.is-open .cat-dropdown__chevron {
    transform: rotate(180deg);
}

.cat-dropdown__menu {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 210px;
    background: var(--bg-2);
    border: 0.5px solid var(--border-mid);
    border-radius: var(--radius-lg);
    padding: 4px;
    z-index: 200;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
}

.cat-dropdown.is-open .cat-dropdown__menu { display: block; }

.cat-dropdown__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    border-radius: var(--radius-md);
    font-size: 13px;
    color: var(--text);
    text-decoration: none;
    transition: background var(--trans);
    gap: 8px;
}

.cat-dropdown__item:hover { background: var(--bg-3); color: var(--text); }
.cat-dropdown__item.is-active { color: var(--orange); }

.cat-dropdown__item-left {
    display: flex;
    align-items: center;
    gap: 8px;
}
.cat-dropdown__item-left .ti { font-size: 15px; opacity: 0.7; }

.cat-dropdown__count {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 10px;
    background: var(--border);
    color: var(--text-3);
    font-weight: 500;
    flex-shrink: 0;
}

.cat-dropdown__sep {
    height: 0.5px;
    background: var(--border);
    margin: 4px 0;
}

/* ── Переключатель темы ─────────────────────────────────────── */

.theme-toggle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--toggle-bg);
    border: 0.5px solid var(--toggle-b);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--trans), border-color var(--trans);
    flex-shrink: 0;
    position: relative;
}
.theme-toggle:hover { background: var(--bg-3); }

.theme-toggle .ti { font-size: 16px; position: absolute; transition: opacity var(--trans), transform var(--trans); }

/* Тёмная тема — показываем солнце (для переключения на светлую) */
[data-theme="dark"] .theme-toggle__sun  { opacity: 1; transform: scale(1); }
[data-theme="dark"] .theme-toggle__moon { opacity: 0; transform: scale(0.5); }

/* Светлая тема — показываем луну */
[data-theme="light"] .theme-toggle__sun  { opacity: 0; transform: scale(0.5); }
[data-theme="light"] .theme-toggle__moon { opacity: 1; transform: scale(1); }

/* ── Бургер ─────────────────────────────────────────────────── */

.burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-md);
    background: var(--toggle-bg);
    border: 0.5px solid var(--toggle-b);
    padding: 8px;
    flex-shrink: 0;
}

.burger__line {
    display: block;
    width: 100%;
    height: 1.5px;
    background: var(--text);
    border-radius: 2px;
    transition: transform var(--trans), opacity var(--trans);
}

.burger.is-open .burger__line:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.burger.is-open .burger__line:nth-child(2) { opacity: 0; transform: scaleX(0); }
.burger.is-open .burger__line:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── Мобильное меню ─────────────────────────────────────────── */

.mobile-menu {
    display: none;
    background: var(--bg-2);
    border-top: 0.5px solid var(--border);
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.mobile-menu.is-open {
    max-height: 80vh;
    overflow-y: auto;
}

.mobile-menu__inner {
    padding: 12px var(--site-px) 20px;
}

.mobile-menu__label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-3);
    margin-bottom: 8px;
    padding: 0 4px;
}

.mobile-menu__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--radius-md);
    font-size: 14px;
    color: var(--text);
    text-decoration: none;
    transition: background var(--trans);
}
.mobile-menu__item:hover { background: var(--bg-3); color: var(--text); }
.mobile-menu__item.is-active { color: var(--orange); }
.mobile-menu__item .ti { font-size: 17px; opacity: 0.7; }

.mobile-menu__count {
    margin-left: auto;
    font-size: 11px;
    color: var(--text-3);
    background: var(--border);
    padding: 2px 7px;
    border-radius: 10px;
}

/* ── Список постов ──────────────────────────────────────────── */

.posts-feed {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Карточка поста ─────────────────────────────────────────── */

.post-card {
    display: grid;
    grid-template-columns: 1fr 30%;
    gap: 20px;
    padding: 24px 0;
    align-items: start;
    transition: opacity var(--trans);
}

.post-card:first-child { padding-top: 0; }

/* Граница снизу — вешаем на body чтобы на мобиле не съезжала */
.post-card--no-thumb {
    grid-template-columns: 1fr;
}

/* Пост без картинки — серая линия слева, занимает всю ширину */
.post-card--no-thumb .post-card__body {
    border-left: 2px solid var(--border-mid);
    padding-left: 16px;
}

/* Короткая заметка — оранжевая линия, перебивает серую */
.post-card--short .post-card__body {
    border-left: 2px solid var(--orange-border);
    padding-left: 16px;
}

.post-card:hover { opacity: 0.78; }

.post-card__body {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

/* Мета */
.post-card__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Бейдж рубрики */
.post-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: var(--radius-sm);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none;
    transition: opacity var(--trans);
    white-space: nowrap;
}
.post-card__badge:hover { opacity: 0.8; }
.post-card__badge .ti { font-size: 12px; }

.cat-kino     { background: var(--cat-kino-bg);     color: var(--cat-kino-c);     border: 0.5px solid var(--cat-kino-b); }
.cat-review   { background: var(--cat-review-bg);   color: var(--cat-review-c);   border: 0.5px solid var(--cat-review-b); }
.cat-thoughts { background: var(--cat-thoughts-bg); color: var(--cat-thoughts-c); border: 0.5px solid var(--cat-thoughts-b); }
.cat-days     { background: var(--cat-days-bg);     color: var(--cat-days-c);     border: 0.5px solid var(--cat-days-b); }
.cat-food     { background: var(--cat-food-bg);     color: var(--cat-food-c);     border: 0.5px solid var(--cat-food-b); }
.cat-myself   { background: var(--cat-myself-bg);   color: var(--cat-myself-c);   border: 0.5px solid var(--cat-myself-b); }
.cat-apple    { background: var(--cat-apple-bg);    color: var(--cat-apple-c);    border: 0.5px solid var(--cat-apple-b); }
.cat-travel   { background: var(--cat-travel-bg);   color: var(--cat-travel-c);   border: 0.5px solid var(--cat-travel-b); }
.cat-default  { background: var(--cat-default-bg);  color: var(--cat-default-c);  border: 0.5px solid var(--cat-default-b); }

.post-card__date {
    font-size: 11px;
    color: var(--text-3);
}

/* Заголовок */
.post-card__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.35;
}
.post-card__title a {
    color: var(--text);
    text-decoration: none;
}
.post-card__title a:hover { color: var(--link-hover); }

/* Анонс */
.post-card__excerpt {
    font-size: 13px;
    line-height: 1.65;
    color: var(--text-2);
}

/* Футер карточки */
.post-card__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-top: 2px;
}

.post-card__reading-time,
.post-card__views,
.post-card__comments,
.post-card__reaction {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--text-3);
    text-decoration: none;
}
.post-card__comments:hover { color: var(--orange); }
.post-card__reading-time .ti,
.post-card__views .ti,
.post-card__comments .ti,
.post-card__reaction .ti { font-size: 13px; }

/* Миниатюра */
.post-card__thumb {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-md);
    overflow: hidden;
    flex-shrink: 0;
    display: block;
    background: var(--bg-3);
    border: 0.5px solid var(--border);
    align-self: center;
}
.post-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.3s ease;
}
.post-card:hover .post-card__thumb img { transform: scale(1.03); }

/* Скрываем сломанные картинки */
.post-card__thumb img[src=""],
.post-card__thumb img:not([src]) { display: none; }

.post-card__thumb--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 4 / 3;
}
.post-card__thumb--placeholder .ti {
    font-size: 28px;
    color: var(--text-3);
    opacity: 0.4;
}

/* ── Пагинация ──────────────────────────────────────────────── */

.pagination {
    margin-top: 48px;
    display: flex;
    justify-content: center;
}

.pagination .page-numbers {
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.pagination .page-numbers li { display: block; }

.pagination a,
.pagination span {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 42px;
    padding: 10px 14px;
    border-radius: var(--radius-md);
    font-size: 14px;
    color: var(--text-2);
    background: var(--bg-2);
    border: 0.5px solid var(--border);
    text-decoration: none;
    transition: background var(--trans), color var(--trans), border-color var(--trans);
}

.pagination a:hover {
    background: var(--bg-3);
    color: var(--text);
    border-color: var(--border-mid);
}

.pagination .current {
    background: var(--orange-dim);
    color: var(--orange);
    border-color: var(--orange-border);
}

.pagination .dots {
    background: none;
    border-color: transparent;
    color: var(--text-3);
}

/* ── Пустой список ──────────────────────────────────────────── */

.posts-empty {
    text-align: center;
    padding: 80px 20px;
    color: var(--text-3);
}
.posts-empty .ti { font-size: 48px; display: block; margin-bottom: 16px; }

/* ── Страница поста (single.php) ────────────────────────────── */

.single-post { max-width: 100%; }

.single-post__header { margin-bottom: 32px; }

.single-post__meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.single-post__date,
.single-post__reading-time,
.single-post__views {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-3);
}
.single-post__date .ti,
.single-post__reading-time .ti,
.single-post__views .ti { font-size: 14px; }

.single-post__title {
    font-size: clamp(24px, 5vw, 36px);
    font-weight: 600;
    line-height: 1.25;
    color: var(--text);
    margin-bottom: 16px;
}

.single-post__excerpt {
    font-size: 16px;
    line-height: 1.6;
    color: var(--text-2);
    border-left: 3px solid var(--orange-border);
    padding-left: 16px;
    margin-bottom: 24px;
}

.single-post__hero {
    width: 100%;
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin-bottom: 40px;
    background: var(--bg-3);
}
.single-post__hero img {
    width: 100%;
    height: auto;
    max-height: 480px;
    object-fit: cover;
}

/* ── Контент поста ──────────────────────────────────────────── */

.post-content {
    font-size: 16px;
    line-height: 1.8;
    color: var(--text);
}

.post-content p { margin-bottom: 1.4em; }

.post-content h2 {
    font-size: 22px;
    font-weight: 600;
    margin: 2em 0 0.6em;
    color: var(--text);
}
.post-content h3 {
    font-size: 18px;
    font-weight: 600;
    margin: 1.8em 0 0.5em;
    color: var(--text);
}
.post-content h4 {
    font-size: 16px;
    font-weight: 600;
    margin: 1.6em 0 0.4em;
}

.post-content a {
    color: var(--orange);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.post-content a:hover { opacity: 0.8; }

.post-content ul,
.post-content ol {
    margin: 0 0 1.4em 1.5em;
    list-style: revert;
}
.post-content li { margin-bottom: 0.4em; }

.post-content blockquote {
    border-left: 3px solid var(--orange-border);
    padding: 4px 0 4px 20px;
    margin: 1.6em 0;
    color: var(--text-2);
    font-style: italic;
}

.post-content code {
    font-family: 'SF Mono', 'Fira Code', monospace;
    font-size: 0.88em;
    background: var(--bg-3);
    border: 0.5px solid var(--border);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

.post-content pre {
    background: var(--bg-2);
    border: 0.5px solid var(--border);
    border-radius: var(--radius-md);
    padding: 20px;
    overflow-x: auto;
    margin-bottom: 1.4em;
}
.post-content pre code {
    background: none;
    border: none;
    padding: 0;
    font-size: 14px;
}

.post-content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md);
    margin: 8px auto;
    display: block;
}

/* Картинки рядом друг с другом — разделяем */
.post-content img + img {
    margin-top: 16px;
}

/* Убираем лишние отступы у картинок в div.separator (старые посты) */
.post-content .separator {
    text-align: center !important;
    margin: 16px 0;
}
.post-content .separator img {
    display: inline-block;
    margin: 0 auto;
}

.post-content figure { margin: 1.6em 0; }
.post-content figcaption {
    font-size: 12px;
    color: var(--text-3);
    text-align: center;
    margin-top: 8px;
}

.post-content hr {
    border: none;
    border-top: 0.5px solid var(--border-mid);
    margin: 2em 0;
}

.post-content del { opacity: 0.5; }

/* Центрирование картинок WordPress */
.post-content .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.post-content .alignleft  { float: left; margin: 0 20px 16px 0; }
.post-content .alignright { float: right; margin: 0 0 16px 20px; }
.post-content .wp-caption  { max-width: 100%; }

/* ── Поделиться ─────────────────────────────────────────────── */

.post-share {
    margin-top: 40px;
    padding-top: 32px;
    border-top: 0.5px solid var(--border);
}

.post-share__label {
    font-size: 12px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 12px;
}

.post-share__buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.post-share__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: var(--radius-md);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: opacity var(--trans), transform var(--trans);
    border: 0.5px solid transparent;
}
.post-share__btn:hover { opacity: 0.85; transform: translateY(-1px); }
.post-share__btn .ti { font-size: 16px; }

.post-share__btn--tg {
    background: rgba(39, 174, 235, 0.15);
    color: #29b6f6;
    border-color: rgba(39, 174, 235, 0.25);
}
.post-share__btn--vk {
    background: rgba(66, 99, 163, 0.15);
    color: #7b9dd3;
    border-color: rgba(66, 99, 163, 0.25);
}
.post-share__btn--copy {
    background: var(--bg-3);
    color: var(--text-2);
    border-color: var(--border);
}

/* ── Теги поста ─────────────────────────────────────────────── */

.post-tags {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 32px;
}

.post-tags__item {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 20px;
    background: var(--bg-3);
    border: 0.5px solid var(--border);
    color: var(--text-2);
    text-decoration: none;
    transition: border-color var(--trans), color var(--trans);
}
.post-tags__item:hover {
    border-color: var(--orange-border);
    color: var(--orange);
}

/* ── Навигация пост/пост ────────────────────────────────────── */

.post-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 48px;
    padding-top: 32px;
    border-top: 0.5px solid var(--border);
}

.post-nav__item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px;
    border-radius: var(--radius-lg);
    background: var(--bg-2);
    border: 0.5px solid var(--border);
    text-decoration: none;
    transition: border-color var(--trans), background var(--trans);
}
.post-nav__item:hover {
    border-color: var(--orange-border);
    background: var(--bg-3);
    color: var(--text);
}
.post-nav__item--next { text-align: right; }

.post-nav__label {
    font-size: 10px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: flex;
    align-items: center;
    gap: 4px;
}
.post-nav__item--next .post-nav__label { justify-content: flex-end; }

.post-nav__title {
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Комментарии ────────────────────────────────────────────── */

.comments-section {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 0.5px solid var(--border);
}

.comments-section__title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 32px;
    color: var(--text);
}

/* Вложенные комментарии */
.comment-list .children {
    list-style: none;
    padding: 0;
    margin: 0;
    border-left: 2px solid var(--border-mid);
    margin-left: 20px;
    margin-top: 0;
}

.comment-list .children .comment {
    padding: 16px 0 16px 16px;
}

.comment-reply-link {
    font-size: 12px;
    color: var(--text-3);
    text-decoration: none;
    transition: color var(--trans);
}
.comment-reply-link:hover { color: var(--orange); }

/* Список комментариев */
.comment-list { list-style: none; padding: 0; margin: 0 0 40px; }

.comment {
    padding: 20px 0;
    border-bottom: 0.5px solid var(--border);
}
.comment:last-child { border-bottom: none; }

.comment__header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.comment__avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--bg-3);
}
.comment__avatar img { width: 100%; height: 100%; object-fit: cover; }

.comment__author-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
}

.comment__date {
    font-size: 11px;
    color: var(--text-3);
    margin-top: 1px;
}

.comment__text {
    font-size: 14px;
    line-height: 1.65;
    color: var(--text-2);
}
.comment__text p { margin-bottom: 0.6em; }
.comment__text p:last-child { margin-bottom: 0; }

.comments-order {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}

.comments-order__label {
    font-size: 12px;
    color: var(--text-3);
}

.comments-order__btn {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 20px;
    border: 0.5px solid var(--border-mid);
    color: var(--text-2);
    background: transparent;
    cursor: pointer;
    transition: all var(--trans);
}

.comments-order__btn:hover {
    border-color: var(--orange-border);
    color: var(--orange);
}

.comments-order__btn.is-active {
    background: var(--orange-dim);
    border-color: var(--orange-border);
    color: var(--orange);
}

.comments-closed {
    font-size: 13px;
    color: var(--text-3);
    margin-top: 16px;
    font-style: italic;
}

/* Форма комментария */
.comment-form-wrap { margin-top: 8px; }

.comment-form-wrap h3 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    color: var(--text);
}

.comment-form { display: flex; flex-direction: column; gap: 14px; }

.comment-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.comment-form label {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: var(--text-2);
    margin-bottom: 6px;
    white-space: nowrap;
}

.comment-form .required {
    color: var(--orange);
    font-size: 13px;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 10px 14px;
    background: var(--bg-2);
    border: 0.5px solid var(--border-mid);
    border-radius: var(--radius-md);
    color: var(--text);
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.5;
    transition: border-color var(--trans), background var(--trans);
    -webkit-appearance: none;
}

.comment-form input:focus,
.comment-form textarea:focus {
    outline: none;
    border-color: var(--orange-border);
    background: var(--bg-3);
}

.comment-form textarea {
    resize: vertical;
    min-height: 120px;
}

.comment-form__submit {
    padding: 10px 24px;
    background: var(--orange);
    color: #fff;
    border: none;
    border-radius: var(--radius-md);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    align-self: flex-start;
    transition: opacity var(--trans), transform var(--trans);
}
.comment-form__submit:hover {
    opacity: 0.88;
    transform: translateY(-1px);
}

/* ── Поиск — заголовок страницы результатов ─────────────────── */

.search-header {
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 0.5px solid var(--border);
}

.search-header__title {
    font-size: 24px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 6px;
}

.search-header__query { color: var(--orange); }

.search-header__count {
    font-size: 13px;
    color: var(--text-3);
    margin-bottom: 20px;
}

.search-form--page .search-form__wrap {
    max-width: 480px;
}

/* ── Подвал ─────────────────────────────────────────────────── */

.site-footer {
    border-top: 0.5px solid var(--border);
    margin-top: auto;
    background: var(--bg);
}

.site-footer__inner {
    max-width: calc(var(--content-w) + var(--site-px) * 2);
    margin: 0 auto;
    padding: 40px var(--site-px) 24px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 32px;
    align-items: center;
}

.site-footer__logo {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 0;
}

.footer-orange-wrap {
    flex-shrink: 0;
    display: block;
    text-decoration: none;
}

.footer-orange {
    width: auto;
    height: 100px;
    display: block;
}

[data-theme="dark"]  .footer-orange--dark  { display: block; }
[data-theme="dark"]  .footer-orange--light { display: none; }
[data-theme="light"] .footer-orange--dark  { display: none; }
[data-theme="light"] .footer-orange--light { display: block; }

.footer-logo-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-logo-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--orange);
    text-decoration: none;
    line-height: 1.2;
}
.footer-logo-name:hover { opacity: 0.8; }

.site-footer__desc {
    font-size: 12px;
    color: var(--text-3);
    line-height: 1.5;
}

/* Поиск в подвале */
.search-form__wrap {
    display: flex;
    align-items: center;
    gap: 0;
    background: var(--bg-2);
    border: 0.5px solid var(--border-mid);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: border-color var(--trans);
}
.search-form__wrap:focus-within {
    border-color: var(--orange-border);
}

.search-form__input {
    flex: 1;
    padding: 10px 14px;
    background: transparent;
    border: none;
    color: var(--text);
    font-family: var(--font-sans);
    font-size: 14px;
    outline: none;
    min-width: 220px;
}
.search-form__input::placeholder { color: var(--text-3); }

.search-form__btn {
    padding: 10px 14px;
    background: transparent;
    border: none;
    color: var(--text-3);
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: color var(--trans);
}
.search-form__btn:hover { color: var(--orange); }
.search-form__btn .ti { font-size: 17px; }

/* Нижняя строка подвала */
.site-footer__bottom {
    max-width: calc(var(--content-w) + var(--site-px) * 2);
    margin: 0 auto;
    padding: 16px var(--site-px);
    border-top: 0.5px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
    color: var(--text-3);
}

.site-footer__nav {
    display: flex;
    align-items: center;
    gap: 20px;
}

.site-footer__nav-link {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--text-3);
    text-decoration: none;
    font-size: 12px;
    transition: color var(--trans);
}
.site-footer__nav-link:hover { color: var(--orange); }
.site-footer__nav-link .ti { font-size: 13px; }

/* ── Адаптив ────────────────────────────────────────────────── */

/* Планшет */
@media (max-width: 720px) {
    :root {
        --site-px: 16px;
        --header-h: 56px;
    }

    .site-header__inner {
        padding: 16px var(--site-px);
        align-items: center;
    }

    .site-header.is-compact .site-header__inner {
        padding: 10px var(--site-px);
    }

    /* Широкая шапка на мобиле — апельсин и надпись побольше */
    .site-logo__avatar {
        width: 80px;
        height: 80px;
    }
    .site-header.is-compact .site-logo__avatar {
        width: 40px;
        height: 40px;
    }

    .site-logo__name {
        width: 200px;
        height: 82px;
    }
    .site-header.is-compact .site-logo__name {
        width: 120px;
        height: 49px;
    }

    /* Прячем дропдаун, показываем бургер */
    .cat-dropdown { display: none; }
    .burger { display: flex; }
    .mobile-menu { display: block; }

    .post-card {
        grid-template-columns: 1fr 100px;
        gap: 14px;
        padding: 18px 0;
    }

    .post-card__thumb,
    .post-card__thumb--placeholder {
        width: 100px;
        height: 70px;
    }

    .post-card__title { font-size: 16px; }

    .site-footer__inner {
        grid-template-columns: 1fr;
        gap: 20px;
        padding-bottom: 16px;
    }

    .site-footer__search .search-form__wrap {
        width: 100%;
    }

    .search-form__input { min-width: 0; width: 100%; }

    .site-footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 12px var(--site-px);
    }

    .site-footer__nav {
        flex-wrap: wrap;
        gap: 12px;
    }
        gap: 12px;
    }

@media (max-width: 480px) {
    .post-card__thumb {
        border: none;
    }
    .site-logo__avatar {
        width: 70px;
        height: 70px;
    }
    .site-header.is-compact .site-logo__avatar {
        width: 36px;
        height: 36px;
    }

    .site-logo__name {
        width: 170px;
        height: 70px;
    }
    .site-header.is-compact .site-logo__name {
        width: 100px;
        height: 41px;
    }

    .post-card {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 0 0 20px;
        border-bottom: 0.5px solid var(--border-mid) !important;
        margin-bottom: 20px;
    }

    .post-card:last-child {
        border-bottom: none !important;
    }

    .post-card__thumb {
        grid-column: auto;
        grid-row: auto;
    }

    .post-card__body {
        grid-column: auto;
        grid-row: auto;
        padding-bottom: 16px;
    }

    .post-card__thumb {
        width: 100%;
        height: 180px;
        border: none;
        border-radius: var(--radius-md);
        margin-bottom: 12px;
        aspect-ratio: unset;
        align-self: auto;
    }

    .post-card__thumb--placeholder { display: none; }

    .post-card--short .post-card__body {
        border-left: none;
        padding-left: 0;
        border-top: none;
        padding-top: 0;
    }

    .single-post__title { font-size: 22px; }

    .post-share__buttons { gap: 6px; }
    .post-share__btn { padding: 7px 12px; font-size: 12px; }
}

/* ── Утилиты ────────────────────────────────────────────────── */

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ── Подзаголовок в заголовке ──────────────────────────────────────────────
   Ставится двойным слешем в названии записи или работы:
   «oz-city.ru // второе рождение». Вторая часть уходит на свою строку
   и печатается на 90% от размера основной. Стили общие для всех разделов,
   поэтому лежат здесь, а не в works.css или front.css. */

.post-card__title__sub,
.single-post__title__sub,
.works-head__title__sub,
.work-card__title__sub,
.fp-item__title__sub {
    display: block;
    font-size: 90%;
}