.hsplit{overflow:hidden;padding-block:32px}.hsplit--paper{background:var(--paper);color:var(--ink)}.hsplit--indigo{color:#fff;background:radial-gradient(80% 60% at 12% 10%,rgba(144,32,128,.42) 0%,transparent 62%),linear-gradient(160deg,var(--indigo) 0%,var(--indigo-deep) 100%)}.hsplit--ink{color:#fff;background:linear-gradient(160deg,#16152c,#0c0b1c)}.hsplit__inner{display:grid;gap:22px;align-items:center}.hsplit__media{position:relative;border-radius:var(--radius-card);overflow:hidden;background:var(--surface-alt);aspect-ratio:4 / 3}.hsplit__image,.hsplit__video{display:block;width:100%;height:100%;object-fit:cover}.hsplit__image--empty{background:var(--surface-alt)}.hsplit__eyebrow{margin:0 0 10px;font-size:var(--text-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--magenta)}.hsplit--indigo .hsplit__eyebrow,.hsplit--ink .hsplit__eyebrow{color:var(--yellow)}.hsplit__title{margin:0;font-family:var(--font-display);font-size:clamp(30px,7vw,44px);font-weight:500;line-height:1.04;letter-spacing:-.03em;color:var(--indigo)}.hsplit--indigo .hsplit__title,.hsplit--ink .hsplit__title{color:#fff}.hsplit__body{margin:14px 0 0;max-width:46ch;font-size:var(--text-md);line-height:1.55;color:var(--ink-soft)}.hsplit--indigo .hsplit__body,.hsplit--ink .hsplit__body{color:#ffffffd1}.hsplit__note{margin:12px 0 0;font-size:var(--text-sm);color:var(--ink-mute)}.hsplit--indigo .hsplit__note,.hsplit--ink .hsplit__note{color:#fff9}.hsplit__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:24px}.hsplit__link{font-size:var(--text-base);font-weight:500;color:var(--indigo);text-underline-offset:4px}.hsplit--indigo .hsplit__link,.hsplit--ink .hsplit__link{color:var(--yellow)}@media(min-width:900px){.hsplit{padding-block:56px}.hsplit__inner{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:46px}.hsplit__media{aspect-ratio:5 / 6}.hsplit--flip .hsplit__media{order:2}.hsplit__title{font-size:clamp(40px,3.6vw,60px)}}@media(prefers-reduced-motion:no-preference){.hsplit__media,.hsplit__copy>*{animation:hsplit-in .6s cubic-bezier(.16,1,.3,1) both}.hsplit__copy>*:nth-child(1){animation-delay:60ms}.hsplit__copy>*:nth-child(2){animation-delay:.11s}.hsplit__copy>*:nth-child(3){animation-delay:.16s}.hsplit__copy>*:nth-child(n+4){animation-delay:.21s}@keyframes hsplit-in{0%{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:none}}}
/*# sourceMappingURL=/cdn/shop/t/56/assets/stlukes-hero-split.css.map */