/* =========================================
   css/feed.css v.5 (Final Polish)
   ========================================= */

/* --- 1. СЕТКА (LAYOUT) --- */
.header-wrapper { margin-bottom: var(--spacing-top) !important; }

.page-layout {
    display: flex;
    justify-content: space-between;
    gap: 60px;
    border-top: 1px solid #efefef;
    width: 100%;
    padding-top: var(--spacing-top);
    padding-bottom: 60px;
    align-items: flex-start;
}

.page-main { flex: 1; min-width: 0; }
.page-sidebar { width: 336px; flex-shrink: 0; }
.sidebar-sticky { position: sticky; top: calc(var(--menu-height) + 20px); }


/* --- 2. ЗАГОЛОВОК РАЗДЕЛА --- */
.feed-main-heading {
    font-family: var(--font-cond);
    font-weight: 700;
    line-height: 1.15;
    color: var(--color-text-head);
    font-size: clamp(28px, 4.5vw, 46px);
    margin-top: 0;
    margin-bottom: 40px;
    letter-spacing: -0.02em;
    max-width: 100%;
}

.category-intro {
    margin-bottom: 50px;
    color: #555;
    font-size: 1.1rem;
    line-height: 1.6;
    font-family: var(--font-main);
    border-left: 4px solid var(--color-gold);
    padding: 15px 20px;
    background: linear-gradient(90deg, #fffaf0 0%, rgba(255,255,255,0) 100%);
    max-width: 70ch;
}

.visually-hidden {
    border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px;
    overflow: hidden; padding: 0; position: absolute; width: 1px;
}


/* --- 3. КАРТОЧКА НОВОСТИ --- */
.feed-item {
    margin-bottom: 60px;
    position: relative;
    width: 100%;
}

/* Заголовок H2 */
.feed-item h2 {
    font-family: var(--font-cond);
    font-weight: 700;
    font-size: clamp(26px, 4.5vw, 40px);
    line-height: 1.15;
    color: var(--color-text-head);
    margin: 0 0 15px 0;
    max-width: 100%;
    letter-spacing: -0.02em;
}

.h1-a {
    color: #000;
    text-decoration: none;
    transition: color 0.2s ease;
    border: none;
}
.h1-a:hover { color: var(--color-gold-hover); }


/* --- 4. МЕТА-ДАННЫЕ --- */
.post-meta {
    display: flex; 
    flex-wrap: wrap; 
    gap: 20px;
    font-size: 14px; 
    color: #777; 
    font-family: var(--font-cond); 
    align-items: center;
    margin-bottom: 0;
}

.meta-category a {
    color: #fff; 
    background-color: var(--color-gold); 
    padding: 3px 8px; 
    border-radius: 2px;
    text-transform: uppercase; 
    font-size: 12px; 
    font-weight: 700; 
    letter-spacing: 0.5px; 
    transition: background 0.2s;
}
.meta-category a:hover { 
    background-color: var(--color-gold-hover); 
    color: #fff !important; 
}


/* --- 5. ИЗОБРАЖЕНИЕ --- */
.feed-image-link {
    display: block;
    margin-top: clamp(24px, 4vw, 40px); 
    margin-bottom: 30px;
    margin-left: 0;
    overflow: hidden;
    border-radius: 8px;
    width: fit-content;
    max-width: 100%;
}

.img-responsive-inner {
    display: block;
    width: auto;
    max-width: 100%;
	width:77ch;
	position:relative;
	left:20px;
    height: auto;
    max-height: 550px;
    object-fit: cover;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 8px;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
}

.feed-image-link:hover .img-responsive-inner {
    opacity: 0.95;
}


/* --- 6. ТЕКСТ АНОНСА --- */
.feed-desc {
    font-family: var(--font-main), 'PT-Root-UI', sans-serif;
    color: #222;
    font-size: clamp(18px, 1.1vw + 14px, 20px); 
    line-height: 1.6;
    font-weight: 400;
    max-width: 63ch; 
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
    margin-left: 0;
}


/* --- 7. ЧИТАТЬ ПОЛНОСТЬЮ (FIXED LEFT) --- */
.readmore {
    /* Отступ сверху */
    margin-top: 20px;
    margin-bottom: 0;
    
    font-family: var(--font-cond);
    font-size: 16px;
    
    /* ЖЕСТКОЕ ВЫРАВНИВАНИЕ */
    text-align: left; 
    margin-left: 0;
    width: 100%;
    display: block;
    float: none; /* На случай, если где-то был float */
    clear: both;
}

.readmore a {
    color: var(--color-gold-hover);
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid rgba(192, 150, 75, 0.2);
    transition: border-color 0.2s;
}
.readmore a:hover {
    border-bottom-color: var(--color-gold-hover);
    color: #000;
}


/* --- 8. РАЗДЕЛИТЕЛИ --- */
.feed-divider {
    height: 1px; 
    background: #efefef; 
    margin-top: 40px;
    margin-bottom: 40px;
    width: 100%;
    border: none;
}

.paginator { margin: 60px 0; text-align: left; }
.sss-inner { margin-top: 40px; padding-top: 20px; border-top: 1px solid #eee; font-size: 12px; color: #999; }

/* --- PHP PAGINATION (Gold Style) --- */
.pagination-php {
    margin-top: 60px;
    margin-bottom: 60px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-start; /* Влево */
    font-family: var(--font-cond);
}

.pg-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    color: #333;
    
    background: #fff;
    border: 1px solid #eee;
    border-radius: 4px;
    transition: all 0.2s;
}

.pg-link:hover {
    border-color: var(--color-gold);
    color: var(--color-gold-hover);
    background: #fffbf2;
}

.pg-current {
    background: var(--color-gold);
    border-color: var(--color-gold);
    color: #fff !important;
    cursor: default;
}

.pg-dots {
    color: #999;
    font-size: 14px;
    padding: 0 5px;
}

.pg-prev, .pg-next {
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
    padding: 0 15px;
}

/* --- 9. АДАПТИВ (MOBILE) --- */
@media (max-width: 900px) {
    .header-wrapper { margin-bottom: 20px !important; }
    
    .page-layout { 
        flex-direction: column; 
        gap: 40px; 
        padding: 20px;
        box-sizing: border-box;
    }
    .page-sidebar { width: 100%; order: 1; }
    
    .feed-main-heading { font-size: 32px; margin-bottom: 20px; }
    .feed-item h2 { font-size: 24px; margin-bottom: 10px; }
    
    .feed-image-link { margin-top: 20px; margin-bottom: 20px; width: 100%; }
    
    .img-responsive-inner { 
        width: 100%; 
        height: auto; 
        max-height: 350px;
        object-fit: cover;
    }
    
    .feed-desc { 
        font-size: 18px; 
        max-width: 100%; 
    }
    
    .category-intro { padding: 15px; max-width: 100%; }
}