@layer components{.grid{--_cols:var(--_cols-xs);--_cols-xs:1;--_cols-sm:var(--_cols-xs);--_cols-md:var(--_cols-sm);--_cols-lg:var(--_cols-md);--_gap-size:var(--site-gutter);grid-column-gap:var(--_gap-size);grid-row-gap:var(--_gap-size);grid-template-columns:repeat(var(--_cols), minmax(0, 1fr));width:100%;display:grid;@media (width>=30rem){--_cols:var(--_cols-sm)}@media (width>=48rem){--_cols:var(--_cols-md)}@media (width>=64rem){--_cols:var(--_cols-lg)}&:is(.autofit,.autofill){--_max-cols:12;--_min-col-width:12;--_fit:(100% - (var(--_max-cols) - 1) * var(--_gap-size)) / var(--_max-cols);--_track:min(max(calc(var(--_min-col-width) * 1rem), var(--_fit)), 100%)}&.autofit{grid-template-columns:repeat(auto-fit, minmax(var(--_track), 1fr))}&.autofill{grid-template-columns:repeat(auto-fill, minmax(var(--_track), 1fr))}}.eyebrow_wrap{align-items:center;justify-content:var(--_alignment,start);gap:var(--space-2);display:inline-flex;&.tag{background-color:var(--text);color:var(--background);padding:var(--space-1) var(--space-2);border-radius:var(--radius-small)}& .eyebrow_marker{width:var(--border-width);background-color:currentColor;flex:none;height:.75rem}}.icon{--_size:1.5em;width:var(--_size);aspect-ratio:1;flex:none;max-width:100%;height:auto;display:block;&.small{--_size:1em}&.large{--_size:2em}&.full-width{width:100%;aspect-ratio:unset}}.button_wrap{background-color:var(--button-background);color:var(--button-text);border:var(--border-width) solid var(--button-border);text-align:center;transition:background-color var(--hover-duration) var(--hover-ease), color var(--hover-duration) var(--hover-ease), border-color var(--hover-duration) var(--hover-ease);border-radius:.5em;justify-content:center;align-items:center;gap:.5em;padding:.75em 1.5em;line-height:1.2;text-decoration:none;display:inline-flex;@media (hover:hover){&:hover:not(:disabled){background-color:var(--button-background-hover);color:var(--button-text-hover);border-color:var(--button-border-hover)}}&.secondary{--button-background:var(--button-2-background);--button-text:var(--button-2-text);--button-border:var(--button-2-border);--button-background-hover:var(--button-2-background-hover);--button-text-hover:var(--button-2-text-hover);--button-border-hover:var(--button-2-border-hover)}&.link{--button-background:transparent;--button-text:var(--link-text);--button-border:var(--link-border);--button-background-hover:transparent;--button-text-hover:var(--link-text-hover);--button-border-hover:var(--link-border);border:0;border-bottom:var(--border-width) solid var(--button-border);background-image:linear-gradient(var(--link-border-hover), var(--link-border-hover));background-position:100% 100%;background-repeat:no-repeat;background-origin:border-box;background-size:0 var(--border-width);transition:background-size calc(var(--hover-duration) * 2) var(--hover-ease), color var(--hover-duration) var(--hover-ease), border-color var(--hover-duration) var(--hover-ease);border-radius:0;padding:.4em 0;@media (hover:hover){&:hover:not(:disabled){background-position:0 100%;background-size:100% var(--border-width)}}}&:is(.play,.close,.arrow){border-radius:var(--radius-round);gap:0;padding:.75em}&.back .button_mark{rotate:180deg}&.play .button_pause{display:none}&.play[aria-pressed=true]{& .button_play{display:none}& .button_pause{display:block}}&:disabled{cursor:not-allowed;opacity:.5}}.overlay{background-color:color-mix(in srgb, black calc(var(--_strength,50) / 100 * 80%), transparent);width:100%;height:100%;position:absolute;inset:0;&.gradient{background-color:color-mix(in srgb, black calc(var(--_strength,50) / 100 * 60%), transparent);background-image:linear-gradient(to bottom, transparent, color-mix(in srgb, black calc(var(--_strength,50) / 100 * 62%), transparent) 84%)}}.card_wrap{--_padding:var(--space-6);--_min-height:20rem;--_visual-ratio:3 / 2;gap:var(--_padding);background-color:var(--background-2);border-radius:var(--radius-main);flex-direction:column;width:100%;display:flex;position:relative;overflow:clip;&.cover{min-height:var(--_min-height)}&.stacked{background-color:#0000;overflow:visible}}.card_visual{border-radius:inherit;flex:none;width:100%;position:relative;overflow:clip;.stacked>&{aspect-ratio:var(--_visual-ratio)}.cover>&{pointer-events:none;height:100%;position:absolute;inset:0}&>:is(.image,.video){width:100%;height:100%}}.card_visual>:is(.image,.video){width:100%;height:100%}.card_content>.button-wrapper:last-child{padding-top:var(--space-6);margin-top:auto}.card_content{align-items:var(--_alignment,start);text-align:var(--_alignment,start);width:100%;max-width:100%;padding:var(--_padding);flex-direction:column;flex-grow:1;display:flex;.cover>&{z-index:1}.stacked>&{padding-inline:0;padding-top:0}}.card_wrap:has(.button_wrap){& .button_wrap:after{content:"";position:absolute;inset:0}& .card_content a:not(.button_wrap){z-index:1;position:relative}& .image{transition:scale calc(var(--hover-duration) * 2) var(--hover-ease)}@media (hover:hover){&:hover .image{scale:1.04}}}}
