/* ==========================================================================
   Hero страницы статьи (раздел «Статьи»).
   Разметку .hhero берёт из hero-home.css, здесь — только поправки под статью.

   ВАЖНО про HONDA CLUB. Надпись несёт ДВА класса: hhero-brand и arhero-brand.
     hhero-brand  — поведение: position/top/cursor и hover
                    (.hhero-title:hover .hhero-brand поднимает и осветляет
                    контур). Живёт в hero-home.css.
     arhero-brand — только размеры и толщина контура, мельче чем на главной.
   Если убрать hhero-brand, наведение перестаёт работать: правило в
   hero-home.css ищет именно его. Проверено — так и было в первой версии.
   ========================================================================== */

.arhero{ min-height: min(520px, 76vh); }

/* статья — не главная: бренд занимает меньше места */
.arhero .arhero-brand{
    font-family: 'Proxima Nova', 'Grandis Extended', system-ui, sans-serif;
    font-size: clamp(26px, 4.4vw, 46px);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -.02em;
    line-height: 1;
    color: transparent;
    -webkit-text-stroke: 1.4px #e6e6e4;
}

.arhero .arhero-sub{
    display: block;
    font-size: clamp(20px, 3.2vw, 34px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -.03em;
    margin-top: 8px;
    max-width: 760px;
}

.arhero-title{ margin: 10px 0 14px; }

.arhero-text{
    max-width: 620px;
    margin: 0 0 16px;
    font-size: 16px;
    line-height: 1.55;
    color: rgba(255,255,255,.80);
}

/* мета-плашки */
.arhero-meta{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}
.arhero-pill{
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
    color: #fff;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.20);
}

.arhero-actions{ gap: 10px; }

.arhero-lines{
    margin-top: 14px;
    font-size: 13px;
    color: rgba(255,255,255,.62);
}

@media (max-width: 899px){
    .arhero{ min-height: min(440px, 82vh); }
    .arhero .arhero-brand{ font-size: clamp(24px, 7vw, 34px); -webkit-text-stroke-width: 1.1px; }
    .arhero .arhero-sub{ font-size: clamp(19px, 5.4vw, 26px); }
    .arhero-text{ font-size: 15px; }
    .arhero-meta{ gap: 6px; margin-bottom: 16px; }
    .arhero-pill{ padding: 5px 10px; font-size: 11px; }
}
