.hero{position:relative;z-index:2;display:flex;align-items:center;min-height:var(--hero-min-h, 702px);background:var(--color-ink);color:var(--color-primary-ink);overflow:visible}.hero__bg-wrap{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;background:var(--color-ink)}.hero--placeholder .hero__bg-wrap{background:linear-gradient(160deg,var(--color-ink-card) 0%,var(--color-ink) 60%,#000 100%)}.hero__bg-wrap picture{display:contents}.hero__bg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.hero--placeholder .hero__bg{opacity:.18;fill:var(--color-ground)}.hero__scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--hero-scrim, linear-gradient(to bottom, rgba(26, 26, 26, .55) 0%, rgba(26, 26, 26, .35) 40%, rgba(26, 26, 26, .75) 100%))}.hero__logo{position:absolute;z-index:1;inset-block-end:5%;inset-inline-end:2%;display:block;width:200px;max-width:calc(100% - 2 * var(--gutter, 20px));height:auto;aspect-ratio:1395 / 694;object-fit:contain;background:none;pointer-events:none;-webkit-user-select:none;user-select:none}@media(min-width:768px){.hero__logo{width:280px}}@media(min-width:1280px){.hero__logo{width:360px}}@media(max-width:1023px){body.has-dock .hero__logo{inset-block-end:110px}}@keyframes hero-logo-wipe{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}html.motion-ok sf-hero[data-write-on=true] .hero__logo:not(.is-writing):not(.is-done){clip-path:inset(0 100% 0 0)}html.motion-ok .hero__logo.is-writing{animation:hero-logo-wipe 1.2s cubic-bezier(.65,0,.35,1) .42s both}.hero__content{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:center;gap:0;padding:0 var(--gutter) 44px;text-align:center}.hero--start .hero__content{align-items:flex-start;text-align:start}.hero__content>.hero__copy{margin-block-start:14px}.hero__eyebrow{font-family:var(--font-body);font-size:var(--sh-eyebrow-fs-m, 11px);line-height:1.35;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#9aa4a6;margin:0}html[lang^=ar] .hero__eyebrow{letter-spacing:0;text-transform:none;font-family:var(--font-arabic)}.hero__slogan{margin:0;font-family:var(--font-display);font-weight:900;font-size:var(--hero-fs, 40px);line-height:1.1;letter-spacing:0;color:var(--color-primary-ink);text-transform:none}html[lang^=ar] .hero__slogan{font-family:var(--font-arabic);font-weight:700;font-size:calc(var(--hero-fs, 40px) * .8)}.hero__slogan-line{display:block;overflow:hidden;padding-inline:.06em;margin-inline:-.06em}.hero__slogan-line>span{display:block;will-change:transform}.hero__copy{align-self:stretch;display:flex;flex-direction:column;align-items:center;gap:14px}.hero--start .hero__copy{align-items:flex-start}.hero__ctas{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:8px}.hero--start .hero__ctas{justify-content:flex-start}.hero__ctas .btn{flex:0 0 auto;min-width:160px}.hero__ctas .btn:only-child{margin-inline:auto}.hero--start .hero__ctas .btn:only-child{margin-inline:0}@media(min-width:768px){.hero__eyebrow{font-size:var(--sh-eyebrow-fs-d, 13px);margin-block-end:8px}.hero__slogan{line-height:1.05}html[lang^=ar] .hero__slogan{line-height:1.32}}@media(min-width:1024px){.hero__content{max-width:760px;margin-inline:auto;padding-block-end:0}.hero--start .hero__content{margin-inline:0;max-width:none}.hero__content>.hero__copy{margin-block-start:53px}.hero__eyebrow{color:#b8bfc2}.hero__ctas{align-self:center;justify-content:center;gap:20px}.hero--start .hero__ctas{align-self:flex-start;justify-content:flex-start}.hero__ctas .btn{flex:0 0 auto;width:190px;min-width:0;min-height:46px;border-radius:var(--btn-radius)}}@media(hover:hover)and (pointer:fine){.hero__ctas .btn--primary:hover{background:var(--color-primary-hover)}}html:not(.motion-ok) .hero__slogan-line>span{transform:none}html.motion-ok sf-hero:not(.is-in) .hero__eyebrow{opacity:0;transform:translateY(-16px)}html.motion-ok sf-hero:not(.is-in) .hero__slogan-line>span{transform:translateY(100%)}html.motion-ok .hero__eyebrow{transition:opacity .4s var(--ease-out),transform .4s var(--ease-out)}html.motion-ok .hero__slogan-line>span{transition:transform .75s cubic-bezier(.19,1,.22,1)}
/*# sourceMappingURL=/cdn/shop/t/10/assets/section-hero.css.map */