.bb-bento{--space-bento-gap: clamp(12px, .8vw + 8px, 20px);--space-bento-tile: clamp(20px, 1.2vw + 14px, 32px);--space-bento-media-inset: 8px;--size-bento-icon-chip: 44px;--size-bento-image-min: 240px;--ratio-bento-media-top: 4 / 1;--ratio-bento-image-stacked: 4 / 3;--width-bento-side-media: 44%;--font-size-bento-title: var(--font-size-20);--font-size-bento-text: var(--font-size-15);padding:var(--space-section-block-lg) var(--space-page-inline);background:var(--color-surface-raised);color:var(--color-text-primary);font-family:var(--font-family-body)}.bb-bento__grid{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-flow:row dense;gap:var(--space-bento-gap)}.bb-bento__intro{display:flex;flex-direction:column;gap:4px;padding-block-end:var(--space-bento-gap)}.bb-bento__intro-text{margin:12px 0 0;color:var(--color-text-secondary);font-size:var(--font-size-bento-text);line-height:1.6}.bb-bento__tile{--color-bento-surface: var(--color-surface-page);--color-bento-icon: var(--color-text-accent);position:relative;display:flex;flex-direction:column;min-width:0;margin:0;overflow:hidden;border-radius:var(--radius-card);background:var(--color-bento-surface);color:var(--color-text-primary)}.bb-bento__tile--amber{--color-bento-surface: var(--color-surface-tint-amber-mid)}.bb-bento__tile--moss{--color-bento-surface: var(--color-surface-tint-moss-mid);--color-bento-icon: var(--color-status-success)}.bb-bento__tile--slate{--color-bento-surface: var(--color-surface-tint-slate-mid);--color-bento-icon: var(--color-status-info)}.bb-bento__tile.bb-scheme-dark{--color-bento-icon: var(--color-icon)}.bb-bento__body{display:flex;flex:1;flex-direction:column;gap:12px;padding:var(--space-bento-tile)}.bb-bento__icon{display:inline-grid;place-items:center;width:var(--size-bento-icon-chip);height:var(--size-bento-icon-chip);margin-block-end:8px;border-radius:var(--radius-pill);background:var(--color-surface-raised);color:var(--color-bento-icon)}.bb-bento__title{margin:0;color:var(--color-text-primary);font-family:var(--font-family-body);font-size:var(--font-size-bento-title);font-weight:500;line-height:1.3;letter-spacing:0;text-transform:none}.bb-bento__text{display:flex;flex-direction:column;gap:12px;color:var(--color-text-secondary);font-size:var(--font-size-bento-text);line-height:1.65}.bb-bento__text>*{margin:0}.bb-bento__text ul{display:flex;flex-direction:column;gap:8px;padding:0;list-style:none}.bb-bento__text li{position:relative;padding-inline-start:18px}.bb-bento__text li:before{content:"";position:absolute;inset-block-start:.7em;inset-inline-start:2px;width:6px;height:6px;border-radius:var(--radius-pill);background:var(--color-bento-icon)}.bb-bento__link{display:inline-flex;align-items:center;gap:8px;margin-block-start:auto;padding-block-start:8px;color:var(--color-text-primary);font-size:var(--font-size-bento-text);font-weight:500;text-decoration:underline;text-underline-offset:4px;transition:color var(--motion-duration-fast) var(--motion-ease-out)}.bb-bento__arrow{transition:transform var(--motion-duration-fast) var(--motion-ease-out)}.bb-bento__link:hover,.bb-bento__link:focus-visible{color:var(--color-text-hover)}.bb-bento__link:hover .bb-bento__arrow,.bb-bento__link:focus-visible .bb-bento__arrow{transform:translate(var(--distance-nudge))}.bb-bento__media{position:relative;margin:var(--space-bento-media-inset) var(--space-bento-media-inset) 0;overflow:hidden;border-radius:var(--radius-image);aspect-ratio:var(--ratio-bento-image-stacked)}.bb-bento__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.bb-bento__tile--media-top .bb-bento__media{aspect-ratio:var(--ratio-bento-media-top)}.bb-bento__tile--media-top .bb-bento__image{object-fit:contain}.bb-bento__tile--picture{aspect-ratio:var(--ratio-bento-image-stacked)}@media screen and (min-width:700px){.bb-bento__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bb-bento__intro,.bb-bento__tile--two-thirds,.bb-bento__tile--full{grid-column:span 2}.bb-bento__tile--media-side:is(.bb-bento__tile--two-thirds,.bb-bento__tile--full){flex-direction:row}.bb-bento__tile--media-side:is(.bb-bento__tile--two-thirds,.bb-bento__tile--full) .bb-bento__media{flex:0 0 var(--width-bento-side-media);min-height:var(--size-bento-image-min);margin:var(--space-bento-media-inset) 0 var(--space-bento-media-inset) var(--space-bento-media-inset);aspect-ratio:auto}}@media screen and (min-width:1150px){.bb-bento__grid{grid-template-columns:repeat(12,minmax(0,1fr))}.bb-bento__intro,.bb-bento__tile--third{grid-column:span 4}.bb-bento__tile--half{grid-column:span 6}.bb-bento__tile--two-thirds{grid-column:span 8}.bb-bento__tile--full{grid-column:span 12}.bb-bento__tile--tall{grid-row:span 2}.bb-bento__intro{padding-block-end:0;padding-inline-end:var(--space-bento-tile)}.bb-bento__tile--picture{min-height:var(--size-bento-image-min);aspect-ratio:auto}}.bb-bento--auto{--width-bento-auto-card: 300px;--ratio-bento-auto-media: 3 / 2}.bb-bento--auto .bb-bento__grid{display:flex;flex-wrap:wrap}.bb-bento--auto .bb-bento__intro{flex:1 0 100%;padding-block-end:calc(var(--space-bento-gap) * 2)}.bb-bento--auto .bb-bento__tile{flex:1 1 var(--width-bento-auto-card)}.bb-bento--auto .bb-bento__media{aspect-ratio:var(--ratio-bento-auto-media)}.bb-bento--auto .bb-bento__tile--media-top .bb-bento__image{object-fit:cover}@media screen and (min-width:1000px){.bb-bento--auto .bb-bento__intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"eyebrow text" "heading text";align-items:end;column-gap:var(--space-stack-lg);padding-inline-end:0}.bb-bento--auto .bb-bento__intro .bb-eyebrow{grid-area:eyebrow}.bb-bento--auto .bb-bento__intro .bb-heading-2{grid-area:heading}.bb-bento--auto .bb-bento__intro-text{grid-area:text;margin:0}}.bb-bento__example{margin:auto 0 0;padding-block-start:12px;border-block-start:var(--border-width-hairline) solid var(--color-border-default);color:var(--color-text-secondary);font-size:var(--font-size-14);line-height:1.5}.bb-bento__example-label{margin-inline-end:6px;color:var(--color-text-eyebrow);font-size:var(--font-size-12);font-weight:600;letter-spacing:var(--letter-spacing-section-eyebrow);text-transform:uppercase}
/*# sourceMappingURL=/cdn/shop/t/117/assets/section-bb-bento.css.map */