/* Hallmark · inherited HELPER industrial editorial tokens · three-route video index
 * Audience: food-factory buyers · Action: watch a relevant process and review equipment
 * pre-emit critique: P4 H4 E4 S5 R5 V4 */
html,body{overflow-x:clip}
.vcr-eyebrow{font-size:var(--text-sm);font-weight:700;letter-spacing:.12em;color:var(--color-accent-dark)}
.vcr-gateways{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg);margin-block:var(--space-lg)}
.vcr-gateways article{border:1px solid var(--color-rule);background:var(--color-paper)}
.vcr-gateways img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:var(--color-navy-deep);display:block}
.vcr-gateways article>div{padding:var(--space-md)}
.vcr-gateways h3{font-size:var(--text-lg);line-height:1.2;margin-block:var(--space-xs);font-family:var(--font-display);font-style:normal;overflow-wrap:anywhere}
.vcr-gateways p{font-size:var(--text-sm);line-height:1.6}
.vcr-screen{width:100%;aspect-ratio:16/9;background:var(--color-navy-deep);position:relative;overflow:clip}
.vc .vcr-play{display:block;width:100%;height:100%;padding:0;border:0;background:var(--color-navy-deep);position:relative;white-space:normal}
.vcr-play img{display:block;width:100%;height:100%;object-fit:contain;transition:filter .2s ease}
.vcr-play span{position:absolute;bottom:var(--space-sm);left:var(--space-sm);display:inline-flex;align-items:center;gap:var(--space-md);padding:var(--space-xs) var(--space-sm);color:var(--color-paper);background:var(--color-navy);white-space:nowrap;line-height:1}
.vcr-play:hover span{background:var(--color-accent-dark)}
.vcr-play:active span{background:var(--color-ink)}
.vcr-play:focus-visible{outline:3px solid var(--color-focus);outline-offset:-3px}
.vcr-play:disabled{cursor:progress;opacity:.7}
.vcr-screen iframe{display:block;border:0;width:100%;height:100%}
.vcr-native{display:flex;justify-content:center;align-items:center}
.vcr-native video{display:block;width:100%;height:100%;object-fit:contain}
.vcr-source{font-size:var(--text-sm);margin-block:var(--space-2xs)!important}
.vcr-source a{display:inline-flex;min-height:36px;align-items:center;white-space:nowrap}
.vcr-film-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl) var(--space-lg)}
.vcr-film{border-bottom:1px solid var(--color-rule);padding-bottom:var(--space-md);min-width:0;scroll-margin-top:var(--space-3xl)}
.vcr-film-copy{padding-top:var(--space-sm)}
.vcr-film-copy h3{font-size:var(--text-lg);line-height:1.2}
.vcr-film-copy>p:not(.vc-card-meta){font-size:var(--text-sm);color:var(--color-muted)}
.vcr-film-links{display:flex;flex-wrap:wrap;column-gap:var(--space-md)}
.vcr-film-links .vc-link{font-size:var(--text-sm)}
.vcr-all{padding-block:var(--space-xl);scroll-margin-top:var(--space-3xl);border-top:1px solid var(--color-rule)}
.vcr-other{padding-top:var(--space-xl);margin-top:var(--space-xl);border-top:1px solid var(--color-rule)}
.vcr [hidden]{display:none!important}
.vcr .vc-hero h1{font-size:clamp(2.1rem,4vw,3.8rem)}
.vc-home .vcr-gateways .vc-link{white-space:nowrap}
@media(min-width:48rem){.vcr-gateways{grid-template-columns:repeat(3,minmax(0,1fr))}.vcr-film-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.vcr-play img{transition:none}}

/* Separate native video formats: two landscape / four portrait cards on desktop. */
.vcr-format-section{margin-top:var(--space-xl)}
.vcr-format-heading{font-family:var(--font-display);font-size:var(--text-xl);font-style:normal;margin-bottom:var(--space-lg)}
.vcr-film-grid--vertical{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-xl) var(--space-md)}
.vcr-film-grid--vertical .vcr-screen{aspect-ratio:9/16}
.vcr-film-grid--vertical .vcr-film-copy h3{font-size:var(--text-base);line-height:1.3}
.vcr-film-grid--vertical .vcr-play span{left:var(--space-xs);bottom:var(--space-xs);font-size:var(--text-sm);gap:var(--space-xs);padding:var(--space-xs)}
.vcr-film-grid--vertical .vcr-film-links{flex-direction:column;align-items:flex-start}
.vcr-film-grid--vertical .vcr-source a{font-size:var(--text-xs)}
@media(min-width:48rem){.vcr-film-grid--landscape{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:64rem){.vcr-film-grid--vertical{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-xl) var(--space-lg)}}