/* ==========================================================================
   ПЕРЕОПРЕДЕЛЕНИЯ — специфичные стили компонентов
   ========================================================================== */

/* Липкое изображение (wp-image-480) — остаётся на месте при прокрутке */
@media (prefers-reduced-motion: no-preference) {
    .wp-image-480 {
        transition: var(--trds-transition);
    }
}

/* Отступ от шапки до первого блока контента (герои/обложки) */
.site-container > .site-main > :first-child,
.single-page-container > .row > .trds-content-wrap > :first-child {
    margin-top: var(--trds-space-2xl);
}

@media (max-width: 768px) {
    .site-container > .site-main > :first-child,
    .single-page-container > .row > .trds-content-wrap > :first-child {
        margin-top: var(--trds-space-xl);
    }
}

@media (min-width: 960px) {
    figure.alignright:has(.wp-image-480) {
        position: sticky;
        top: 120px;
        align-self: start;
    }

    body.admin-bar figure.alignright:has(.wp-image-480) {
        top: 152px;
    }
}

/* ==========================================================================
   АДАПТИВНЫЕ КОЛОНКИ
   ========================================================================== */

@media (max-width: 769px) {
    .wp-container-core-columns-is-layout-9d6595d7 {
        flex-direction: column-reverse;
    }
}

/* ==========================================================================
   BYZANTINE FRAME — декоративная рамка
   ========================================================================== */

.wp-image-411.size-full.byzantine-frame,
.wp-image-393 {
    border: 10px solid;
    border-image: linear-gradient(45deg, #8b4513, #daa520, #8b4513, #daa520) 1;
    position: relative;
    box-shadow:
        inset 0 0 0 2px #ffd700,
        inset 0 0 0 4px #8b4513,
        0 0 20px rgba(139, 69, 19, 0.3);
}

.wp-image-411.size-full.byzantine-frame::before,
.wp-image-411.size-full.byzantine-frame::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background: radial-gradient(circle, #ffd700 40%, #8b4513 41%, #8b4513 60%, transparent 61%);
    z-index: 1;
}

.wp-image-411.size-full.byzantine-frame::before {
    top: -10px;
    left: -10px;
}

.wp-image-411.size-full.byzantine-frame::after {
    bottom: -10px;
    right: -10px;
}

/* ==========================================================================
   ЗАПИСИ — посты и обёртки
   ========================================================================== */

/*
   Отключаем flex-обёртку Neve для posts-wrapper,
   чтобы не конфликтовала с нашим grid-шаблоном.
   */
.posts-wrapper {
    display: block;
    margin-bottom: 0;
    container-type: inline-size;
    container-name: post-list;
}

@container post-list (min-width: 600px) {
    .posts-wrapper > article.has-post-thumbnail .trds-ft-wrap {
        grid-template-columns: var(--postcoltemplate, 30fr 70fr);
        width: 80%;
    }
}

/* ==========================================================================
   POSTS SHOWCASE — центрирование блока новостей
   ========================================================================== */

.trds-posts-showcase__wrapper {
    display: flex;
    justify-content: center;
    container-type: inline-size;
}

.trds-posts-showcase__wrapper .trds-posts-showcase__grid {
    width: 100%;
    max-width: var(--trds-container-max);
}

.trds-posts-showcase__wrapper .trds-posts-showcase__grid--grid {
    grid-auto-flow: row;
    grid-auto-columns: unset;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    justify-content: center;
}

.trds-posts-showcase__image {
    text-align: center;
}

/* ==========================================================================
   ПРЕДСТОЯЩИЕ СОБЫТИЯ
   ========================================================================== */

.upcoming-events .trds-posts-showcase__img {
    transform: scale(0.95);
    height: auto;
    object-fit: cover;
    transition: var(--trds-transition);
}

.upcoming-events .trds-posts-showcase__content {
    padding-top: 0;
}


/*
   Кнопка постера курса — hover/focus в фирменной палитре.
   */
.trds-poster__btn {
    transition:
        background-color var(--trds-duration-fast, 0.2s) var(--trds-ease, ease),
        color var(--trds-duration-fast, 0.2s) var(--trds-ease, ease),
        box-shadow var(--trds-duration-fast, 0.2s) var(--trds-ease, ease);
}

@media (hover: hover) {
    .trds-poster__btn:hover {
        background-color: var(--trds-primary-dark);
        color: var(--trds-text-inverse);
        box-shadow: 0 6px 14px rgba(var(--trds-primary-rgb), 0.25);
    }
}

.trds-poster__btn:focus-visible {
    background-color: var(--trds-primary-dark);
    color: var(--trds-text-inverse);
    outline: 2px solid var(--trds-secondary);
    outline-offset: 2px;
}