.c-pro-staff-feature{position:relative;isolation:isolate;padding-block:var(--3xl-spacing);padding-inline:var(--md-gutter);overflow:clip;background:var(--c-pro-staff-feature-bg, var(--color-primary))}.c-pro-staff-feature__backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background-image:var(--c-pro-staff-feature-backdrop-image);background-position:center;background-repeat:no-repeat;background-size:cover;opacity:var(--c-pro-staff-feature-backdrop-opacity, .18)}.c-pro-staff-feature__inner{position:relative;z-index:1;max-width:var(--page-width, 120rem);margin-inline:auto;display:grid;grid-template-columns:1fr;gap:var(--2xl-spacing);align-items:center}.c-pro-staff-feature__content{display:flex;flex-direction:column;gap:var(--lg-spacing)}.c-pro-staff-feature__title{margin:0;font-family:var(--font-body);font-weight:var(--bold-font-weight);text-transform:uppercase;letter-spacing:.04em;line-height:1.1;font-size:var(--3xl-font-size);color:var(--c-pro-staff-feature-title-fg, var(--color-white))}.c-pro-staff-feature__body{border-inline-start:.25rem solid var(--color-accent);padding-inline-start:var(--lg-spacing);font-size:var(--md-font-size);line-height:1.65;color:var(--c-pro-staff-feature-body-fg, color-mix(in srgb, var(--color-white) 85%, transparent))}.c-pro-staff-feature__body p{margin:0 0 1em}.c-pro-staff-feature__body p:last-child{margin-bottom:0}.c-pro-staff-feature__media{position:relative;width:100%;max-width:30rem;margin-inline:auto}.c-pro-staff-feature__media:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;border:.75rem solid color-mix(in srgb,var(--color-white) 12%,transparent);pointer-events:none}.c-pro-staff-feature__image{display:block;width:100%;aspect-ratio:4 / 5;object-fit:cover;box-shadow:0 1.5rem 3rem color-mix(in srgb,var(--color-shadow) 35%,transparent)}.c-pro-staff-feature__media[data-badge=true]:after{content:"";position:absolute;inset-block-start:-1.5rem;inset-inline-end:-1.5rem;z-index:2;width:var(--c-pro-staff-feature-badge-size, 5rem);height:var(--c-pro-staff-feature-badge-size, 5rem);background-color:var(--color-accent);background-image:var(--c-pro-staff-feature-badge-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230A2240'%3E%3Cpath d='M12 1 3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm-2 16-4-4 1.41-1.41L10 14.17l6.59-6.59L18 9l-8 8z'/%3E%3C/svg%3E"));background-repeat:no-repeat;background-position:center;background-size:calc(var(--c-pro-staff-feature-badge-size, 5rem) * .5);box-shadow:0 .75rem 1.5rem color-mix(in srgb,var(--color-shadow) 30%,transparent)}.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__media{animation:u-animation-pop-in 1.2s ease-in-out forwards}.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__title{animation:u-animation-fade-in 1.2s ease-in-out .25s forwards}.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__body{animation:u-animation-slide-up 1.2s ease-in-out .45s forwards}html[data-js] .c-pro-staff-feature__media[data-badge=true]:after{opacity:0;transform:scale(.6)}.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__media[data-badge=true]:after{animation:u-animation-pop-in .6s ease-in-out .75s forwards}html:not([data-js]) .c-pro-staff-feature__media,html:not([data-js]) .c-pro-staff-feature__title,html:not([data-js]) .c-pro-staff-feature__body{opacity:1;transform:none}@media(min-width:900px){.c-pro-staff-feature__inner{grid-template-columns:1fr 1fr;gap:var(--3xl-spacing)}.c-pro-staff-feature[data-image-side=left] .c-pro-staff-feature__media{order:-1}.c-pro-staff-feature__backdrop{background-attachment:fixed}}@media(prefers-reduced-motion:reduce){.c-pro-staff-feature__backdrop{background-attachment:scroll}.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__media,.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__title,.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__body,.c-pro-staff-feature[data-revealed=true] .c-pro-staff-feature__media[data-badge=true]:after{animation:none}html[data-js] .c-pro-staff-feature__media[data-badge=true]:after{opacity:1;transform:none}}@media(min-width:1600px){.c-pro-staff-feature{padding-inline:var(--xl-gutter)}}
/*# sourceMappingURL=/cdn/shop/t/20/assets/component-pro-staff-feature.css.map */