/* =====================================================================
   SINGLE POST VX - blog post (single.php). Loaded only on is_singular( 'post' )
   ===================================================================== */

/* ---------- SINGLE POST ROOT: BREADCRUMB + HERO ---------- */
/* Figma 2165:1589 (breadcrumb 18 -3%, Blog #B0B0B0, title white, caret 24, gap 10) + 2165:1590 (hero 1380×595, radius 9, bg rgba(18,18,18,.6), bottom fade black 56% blur 25 → gradient, pad 30 | title 53/60 SemiBold -3% | meta 18 -3%, icon 24, gap 15, items ~45 apart) | crumbs spacing: estimate */
:root{--vx-crumbs-color:#B0B0B0;--vx-crumbs-fs:var(--vx-fs-body);--vx-crumbs-gap:10px;--vx-crumbs-pt:clamp(1rem,.8333rem + .7407vw,1.5rem);--vx-crumbs-pb:20px;--vx-post-hero-h:clamp(23.75rem,17.875rem + 26.1111vw,37.1875rem);--vx-post-hero-bg:rgba(18,18,18,.6);--vx-post-hero-radius:9px;--vx-post-hero-fade:linear-gradient(0deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.45) 30%,rgba(0,0,0,0) 58%);--vx-post-hero-pad:clamp(1.25rem,1.0417rem + .9259vw,1.875rem);--vx-post-title-fs:clamp(1.75rem,1.2292rem + 2.3148vw,3.3125rem);--vx-post-title-w:900px;--vx-post-meta-gap:15px;--vx-post-meta-items-gap:clamp(1.25rem,.9583rem + 1.2963vw,2.8125rem)}

/* ---------- BREADCRUMB ---------- */
.vx-crumbs{padding:var(--vx-crumbs-pt) 0 var(--vx-crumbs-pb)}
.vx-crumbs__list{display:flex;align-items:center;gap:var(--vx-crumbs-gap);margin:0;padding:0;list-style:none;font-size:var(--vx-crumbs-fs);letter-spacing:-0.03em;line-height:1.36;min-width:0}
.vx-crumbs__item{display:flex;align-items:center;gap:var(--vx-crumbs-gap);min-width:0}
.vx-crumbs__link{flex:none;color:var(--vx-crumbs-color);text-decoration:none;transition:color var(--vx-dur) var(--vx-ease)}
.vx-crumbs__sep{display:block;flex:none;width:24px;height:24px}
.vx-crumbs__current{overflow:hidden;color:var(--vx-white);white-space:nowrap;text-overflow:ellipsis}

/* ---------- HERO ---------- */
.vx-post-hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:var(--vx-post-hero-h);overflow:hidden;background:var(--vx-post-hero-bg);border-radius:var(--vx-post-hero-radius)}
.vx-post-hero__img{position:absolute;inset:0;z-index:-2;display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
.vx-post-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--vx-post-hero-fade);pointer-events:none}
.vx-post-hero--no-img::after{display:none}
.vx-post-hero__content{width:100%;padding:var(--vx-post-hero-pad)}
.vx .vx-post-hero__title{max-width:var(--vx-post-title-w);margin:0;font-size:var(--vx-post-title-fs);font-weight:var(--vx-fw-semibold);line-height:1.132;letter-spacing:-0.03em;color:var(--vx-white);text-wrap:wrap}
.vx-post-hero__meta{display:flex;flex-wrap:wrap;gap:var(--vx-space-12) var(--vx-post-meta-items-gap);margin:var(--vx-space-24) 0 0;padding:0;list-style:none}
.vx-post-hero__meta-item{display:flex;align-items:center;gap:var(--vx-post-meta-gap);font-size:var(--vx-fs-body);letter-spacing:-0.03em;color:var(--vx-white)}
.vx-post-hero__meta-item img{display:block;flex:none;width:24px;height:24px}

/* BREADCRUMB: hover (mouse only) */
@media (hover:hover){
.vx-crumbs__link:hover{color:var(--vx-white)}
}