/*!
 * DS Hero Banner
 *
 * sections/ds-hero-banner.liquid. Mobile first:
 * - below 768px the stack of Figma node 2123:18148 — text, then the photo;
 * - from 768px text and photo side by side, Figma node 2123:16253.
 *
 * The photo clips its own corner instead of its wrapper, so the icon on the
 * seam can reach past the photo onto the card.
 */.ds-hero{display:flex;flex-direction:column;overflow:hidden;border-radius:.875rem;background-color:var(--ds-hero-background, #ffdfe5)}.ds-hero__text{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.625rem;padding:1.5rem 1.25rem 1.25rem}.ds-hero__heading{margin:0;line-height:1.155}.ds-hero__heading>*{margin:0}.ds-hero__body{margin:0;font-size:.9375rem;line-height:1.533}.ds-hero__media{position:relative;height:10.4375rem}.ds-hero__image{display:block;width:100%;height:100%;object-fit:cover;border-start-start-radius:3.125rem}.ds-hero__sticker{position:absolute;inset-block-start:1rem;inset-inline-start:63%;padding:.625rem .875rem;border-radius:var(--rounded-full);font-size:var(--text-sm);font-weight:600;line-height:1.125rem;white-space:nowrap;color:var(--ds-hero-sticker-text, #221c35);background-color:var(--ds-hero-sticker-background, #f9e547);transform:rotate(7deg)}.ds-hero__icon{display:none}@media screen and (min-width:768px){.ds-hero{flex-direction:row;border-radius:1.25rem}.ds-hero__text{flex:1 1 0;gap:.75rem;padding:1.5rem 2.25rem}.ds-hero__body{font-size:var(--text-base);line-height:1.5}.ds-hero__media{flex:0 0 min(36.6%,31.125rem);height:14.75rem}.ds-hero__image{border-start-start-radius:4.375rem}.ds-hero__sticker{inset-block-start:1.75rem}.ds-hero__icon{display:block;position:absolute;inset-block-start:50%;inset-inline-start:0;width:3rem;height:auto;transform:translate(-50%,-50%)}}
/*# sourceMappingURL=/cdn/shop/t/23/assets/ds-hero-banner.css.map */