/* YoLab component: header/branding */
.yr-header-branding{
	--yr-component-gap:22px;
	--yr-component-columns:4;
	--yr-component-ratio:3/2;
	--yr-component-radius:calc(var(--yr-radius, 6px) + 2px);
	position:relative;
	min-width:0;
	container-type:inline-size;
}
.yr-header-branding .yr-component__header{display:flex;align-items:center;gap:14px;margin:0 0 20px;padding:0 0 10px;border-bottom:1px solid var(--yr-border,#e7e7e7)}
.yr-header-branding .yr-component__title{margin:0;font-family:var(--yr-heading-font,inherit);font-size:clamp(1.15rem,2.2vw,1.55rem);line-height:1.15;letter-spacing:-.02em}
.yr-header-branding .yr-component__rule{display:block;width:44px;height:3px;background:var(--yr-accent,#0088cc);border-radius:2px}
.yr-header-branding .yr-component__items{display:grid;grid-template-columns:repeat(var(--yr-component-columns),minmax(0,1fr));gap:var(--yr-component-gap);align-items:start}
.yr-header-branding .yr-component__item{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--yr-card-bg,#fff);border:1px solid var(--yr-border,#e8e8e8);border-radius:var(--yr-component-radius);overflow:hidden;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.yr-header-branding .yr-component__item:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--yr-accent,#0088cc) 32%,var(--yr-border,#e8e8e8));box-shadow:0 12px 30px rgb(0 0 0/.08)}
.yr-header-branding .yr-component__item.is-lead{grid-column:span 1;}
.yr-header-branding .yr-component__media{display:block;position:relative;aspect-ratio:var(--yr-component-ratio);overflow:hidden;background:#ececec}
.yr-header-branding .yr-component__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.yr-header-branding .yr-component__item:hover .yr-component__media img{transform:scale(1.035)}
.yr-header-branding .yr-component__body{display:flex;flex-direction:column;gap:8px;padding:15px 16px 17px;min-width:0}
.yr-header-branding .yr-component__category{align-self:flex-start;color:var(--yr-accent,#0088cc);font-size:.72rem;line-height:1;font-weight:800;text-transform:uppercase;letter-spacing:.07em;text-decoration:none}
.yr-header-branding .yr-component__category:hover{text-decoration:underline;text-underline-offset:3px}
.yr-header-branding .yr-component__headline{margin:0;font-family:var(--yr-heading-font,inherit);font-size:clamp(1rem,1.7vw,1.25rem);line-height:1.25;letter-spacing:-.015em}
.yr-header-branding .yr-component__headline a{color:inherit;text-decoration:none}
.yr-header-branding .yr-component__headline a:hover{color:var(--yr-accent,#0088cc)}
.yr-header-branding .yr-component__meta{display:flex;flex-wrap:wrap;gap:6px 12px;color:var(--yr-muted,#777);font-size:.76rem;line-height:1.35}
.yr-header-branding .yr-component__meta span+span::before{content:"•";margin-inline-end:8px;color:var(--yr-border-strong,#aaa)}
.yr-header-branding .yr-component__excerpt{color:var(--yr-text-soft,#555);font-size:.9rem;line-height:1.6}
.yr-header-branding .yr-component__item.is-lead .yr-component__headline{font-size:clamp(1.2rem,2.5vw,1.75rem)}
.yr-header-branding .yr-component__item.is-lead .yr-component__body{padding:18px 19px 20px}
.yr-header-branding .yr-component__item.is-lead .yr-component__excerpt{font-size:.96rem}
.yr-header-branding .yr-component__item:nth-child(2n){--yr-component-accent-shift:1}
.yr-header-branding .yr-component__item:nth-child(3n){--yr-component-accent-shift:2}
.yr-header-branding .yr-component__item:focus-within{outline:2px solid var(--yr-accent,#0088cc);outline-offset:3px}
.yr-header-branding .yr-component__headline a:focus-visible,
.yr-header-branding .yr-component__category:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:2px}
body.yr-dark-skin .yr-header-branding{--yr-card-bg:#17191d;--yr-border:#2b2f36;--yr-text-soft:#c4c7cc;--yr-muted:#9398a1}
body.yr-dark-skin .yr-header-branding .yr-component__media{background:#22262b}
body.yr-dark-skin .yr-header-branding .yr-component__item:hover{box-shadow:0 14px 34px rgb(0 0 0/.28)}
[dir="rtl"] .yr-header-branding .yr-component__header{text-align:right}
[dir="rtl"] .yr-header-branding .yr-component__category{letter-spacing:.03em}
@container (max-width:900px){
	.yr-header-branding .yr-component__items{grid-template-columns:repeat(2,minmax(0,1fr))}
	.yr-header-branding .yr-component__item.is-lead{grid-column:span 2}
}
@container (max-width:620px){
	.yr-header-branding .yr-component__items{grid-template-columns:1fr;gap:14px}
	.yr-header-branding .yr-component__item.is-lead{grid-column:auto}
	.yr-header-branding .yr-component__body{padding:13px 14px 15px}
	.yr-header-branding .yr-component__headline{font-size:1rem}
	.yr-header-branding .yr-component__item.is-lead .yr-component__headline{font-size:1.25rem}
}
@media (max-width:640px){
	.yr-header-branding{--yr-component-gap:14px}
	.yr-header-branding .yr-component__header{margin-bottom:15px}
}
@media (prefers-reduced-motion:reduce){
	.yr-header-branding .yr-component__item,
	.yr-header-branding .yr-component__media img{transition:none}
	.yr-header-branding .yr-component__item:hover{transform:none}
	.yr-header-branding .yr-component__item:hover .yr-component__media img{transform:none}
}
@media (forced-colors:active){
	.yr-header-branding .yr-component__item{border:1px solid CanvasText}
	.yr-header-branding .yr-component__rule{background:Highlight}
}
/* density variants */
.yr-density-compact .yr-header-branding .yr-component__items{gap:calc(var(--yr-component-gap) * .75)}
.yr-density-compact .yr-header-branding .yr-component__body{padding:11px 12px 13px;gap:6px}
.yr-density-spacious .yr-header-branding .yr-component__items{gap:calc(var(--yr-component-gap) * 1.35)}
.yr-density-spacious .yr-header-branding .yr-component__body{padding:20px 22px 23px;gap:11px}
/* surface variants */
.yr-card-flat .yr-header-branding .yr-component__item{border-color:transparent;border-radius:0;box-shadow:none}
.yr-card-bordered .yr-header-branding .yr-component__item{border-width:1px;box-shadow:none}
.yr-card-shadow .yr-header-branding .yr-component__item{border-color:transparent;box-shadow:0 8px 24px rgb(0 0 0/.075)}
/* no-thumbnail resilience */
.yr-header-branding .yr-component__item:not(:has(.yr-component__media)) .yr-component__body{min-height:145px;justify-content:center}
.yr-header-branding .yr-component__item:not(:has(.yr-component__media)).is-lead .yr-component__body{min-height:210px}
