.blog-card{--tint: var(--color-surface-container-high);--ink: var(--color-primary);display:flex;flex-direction:column;background-color:var(--color-surface-container-lowest);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-ambient);color:inherit;font-family:var(--font-hebrew);transition:box-shadow .3s ease;&:hover{box-shadow:var(--shadow-elevated);color:inherit}@media(prefers-reduced-motion:no-preference){transition:transform .3s ease,box-shadow .3s ease;&:hover{transform:translateY(-.25rem)}}&:focus-visible{outline:3px solid var(--color-primary-container);outline-offset:2px}&.explain{--tint: var(--color-primary-fixed);--ink: var(--color-on-primary-fixed-variant)}&.recipe{--tint: var(--color-secondary-fixed);--ink: var(--color-on-secondary-fixed-variant)}&.story{--tint: var(--color-tertiary-fixed);--ink: var(--color-on-tertiary-fixed-variant)}.visual{position:relative;height:12.5rem;background-color:var(--tint);display:flex;align-items:center;justify-content:center;overflow:hidden}.photo{width:100%;height:100%;object-fit:cover}.mascot{height:72%;width:auto;filter:drop-shadow(0 8px 24px color-mix(in srgb,var(--color-primary) 15%,transparent))}.icon{font-size:5.5rem;color:var(--ink)}.media-badge{position:absolute;top:var(--space-3);inset-inline-start:var(--space-3);display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);background-color:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);font-size:var(--text-body-sm);font-weight:var(--weight-bold);color:var(--color-on-surface);.material-symbols-outlined{font-size:1rem}}.body{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);flex:1}.labels{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);font-size:var(--text-body-sm);.category-label{font-weight:var(--weight-bold);color:var(--ink)}.media-inline{display:none}}.featured-badge{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);background-color:var(--color-primary);color:var(--color-on-primary);font-size:var(--text-body-sm);font-weight:var(--weight-bold)}.title{font-family:var(--font-hebrew);font-size:var(--text-title-lg);font-weight:var(--weight-extrabold);line-height:1.3;letter-spacing:0;color:var(--color-on-surface);text-wrap:pretty}.summary{font-size:var(--text-body-lg);line-height:1.6;color:var(--color-on-surface-variant);text-wrap:pretty}.byline{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);margin-top:auto;padding-top:var(--space-2);font-size:var(--text-body-sm);color:var(--color-on-surface-variant);.avatar,.author,.reviewed{display:none}.who{display:flex;align-items:center;gap:var(--space-2)}}}.blog-index[data-layout=magazine] .blog-card.featured{display:grid;grid-template-columns:1.25fr 1fr;border-radius:var(--radius-lg);&:hover{transform:none}.visual{height:auto;min-height:26.25rem}.mascot{height:60%}.icon{font-size:10rem}.body{padding:var(--space-9);justify-content:center;gap:var(--space-3)}.labels{gap:var(--space-2);.category-label{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);background-color:var(--tint);font-size:var(--text-body-sm)}}.title{font-size:clamp(1.75rem,1.25rem + 1.8vw,2.5rem);line-height:1.15;letter-spacing:-.01em}.summary{font-size:var(--text-body-lg);line-height:1.7}.byline{margin-top:var(--space-2);gap:var(--space-3);.avatar{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-full);background-color:var(--color-primary-fixed);color:var(--color-primary);font-weight:var(--weight-extrabold);object-fit:cover}.who{flex-direction:column;align-items:flex-start;gap:var(--space-1)}.author{display:inline;font-size:var(--text-body-md);font-weight:var(--weight-bold);color:var(--color-on-surface)}}@media(max-width:1023px){grid-template-columns:1fr;.visual{min-height:14rem}.icon{font-size:7rem}.body{padding:var(--space-5)}}}.blog-index[data-layout=list] .blog-card{display:grid;grid-template-columns:13.75rem minmax(0,1fr);gap:var(--space-4);padding:var(--space-4) var(--space-3);margin:0 calc(-1 * var(--space-3));background-color:transparent;box-shadow:none;transition:background-color .2s ease;&:hover{transform:none;box-shadow:none;background-color:var(--color-surface-container-low)}.visual{height:9.25rem;border-radius:1.25rem}.icon{font-size:4rem}.mascot{height:76%}.media-badge,.featured-badge{display:none}.body{padding:0;justify-content:center;gap:var(--space-2)}.labels{.media-inline{display:inline-flex}.media-inline{align-items:center;gap:var(--space-1);color:var(--color-secondary);font-weight:var(--weight-bold);.material-symbols-outlined{font-size:1rem}}>*+*:before{content:"·";margin-inline-end:var(--space-2);color:var(--color-outline);font-weight:var(--weight-regular)}}.title{font-size:var(--text-headline-sm)}.byline{margin-top:var(--space-1);padding-top:0;.author{display:inline;font-weight:var(--weight-bold);color:var(--color-on-surface);&:after{content:" · ";font-weight:var(--weight-regular);color:var(--color-on-surface-variant)}}.who{gap:0}.reviewed{display:inline-flex;align-items:center;gap:var(--space-1);color:var(--color-secondary);font-weight:var(--weight-semibold);.material-symbols-outlined{font-size:1rem}}}@media(max-width:767px){grid-template-columns:1fr;margin:0;padding:var(--space-3) 0;.visual{height:10rem}}}
