.main-page-image{--main-page-image-accent: var(--main-blue, var(--color-heading));--main-page-image-gap: 3.2rem;--main-page-image-intro-gap: 1.6rem;--main-page-image-intro-max-width: 56rem;--main-page-image-panel-padding: 2.4rem 1.6rem;--main-page-image-panel-radius: 1.6rem;--main-page-image-panel-tint: 8%;--main-page-image-sheet-max-width: 72rem;--main-page-image-sheet-radius: .4rem;--main-page-image-sheet-tilt: 0deg;--main-page-image-sticky-top: 12rem;--main-page-image-ease: cubic-bezier(.16, 1, .3, 1);display:grid;gap:var(--main-page-image-gap)}.main-page-image__intro{display:grid;gap:var(--main-page-image-intro-gap);justify-items:start;max-width:var(--main-page-image-intro-max-width)}.main-page-image__title{font-weight:600;color:var(--main-page-image-accent);text-wrap:balance}.main-page-image__lead>:first-child{margin-block-start:0}.main-page-image__lead>:last-child{margin-block-end:0}.main-page-image__document{position:relative;margin:0;padding:var(--main-page-image-panel-padding);border-radius:var(--main-page-image-panel-radius);background:color-mix(in srgb,var(--main-page-image-accent) var(--main-page-image-panel-tint),transparent)}.main-page-image__sheet{max-width:var(--main-page-image-sheet-max-width);margin-inline:auto;transform:rotate(var(--main-page-image-sheet-tilt))}.main-page-image__sheet img{border-radius:var(--main-page-image-sheet-radius);background:rgb(var(--color-background));box-shadow:0 .2rem .6rem rgba(var(--color-foreground),.08),0 2.4rem 4.8rem -2.4rem rgba(var(--color-foreground),.35)}@media(prefers-reduced-motion:no-preference){.main-page-image__sheet{transition:transform .8s var(--main-page-image-ease)}}@media(min-width:768px){.main-page-image{--main-page-image-panel-padding: 4.8rem}}@media(min-width:1024px){.main-page-image{--main-page-image-gap: 8rem;--main-page-image-panel-padding: 6.4rem 4.8rem;--main-page-image-sheet-tilt: 1.5deg;grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:start}.main-page-image__intro{position:sticky;top:var(--main-page-image-sticky-top);padding-block-start:var(--main-page-image-intro-gap)}}@media(min-width:1024px)and (hover:hover)and (pointer:fine){.main-page-image__document:hover{--main-page-image-sheet-tilt: 0deg}}
/*# sourceMappingURL=/cdn/shop/t/13/assets/section-main-page-image.css.map */