.hero{--gutter:clamp(20px, 4.4vw, 72px);--wc:max(100cqw, 150cqh);--cx:calc((100cqw - var(--wc)) / 2);--ch:calc(var(--wc) / 1.5);--cy-gap:calc(var(--gutter) * .55 + 20px);--cy:max(calc(100cqh - var(--ch)), min(calc((100cqh - var(--ch)) * .4), calc(100cqh - var(--cy-gap) - var(--ch) * .83)));--box-top:calc(var(--cy) + var(--ch) * .35);--box-left:calc(var(--cx) + var(--wc) * .31);--box-right:calc(var(--cx) + var(--wc) * .64);--zl:calc(var(--box-left) - var(--gutter) - 28px);--zr:calc(100cqw - var(--gutter) - var(--box-right) - 28px);--fs:min(calc(var(--zl) / 3.9), calc(var(--zr) / 4.5), 8.5cqw, 15cqh);--hero-mark:#e9cb86;--tt:calc(96px + 1.2cqw);background:var(--m-pitch);color:var(--m-pitch-ink);position:relative}[lang=en] .hero{--fs:min(calc(var(--zl) / 4.2), calc(var(--zr) / 5), 8.5cqw, 15cqh)}[lang=ar] .hero{--fs:min(calc(var(--zl) / 4.6), calc(var(--zr) / 5.6), 7cqw, 12cqh)}.hero-scene{height:100svh;min-height:620px;position:relative;overflow:hidden;container-type:size}.hero-photo{position:absolute;inset:0;overflow:hidden}.hero-canvas{left:var(--cx);top:var(--cy);width:var(--wc);aspect-ratio:3/2;position:absolute}.hero-img{object-fit:cover;filter:saturate(.6)contrast(1.05)brightness(.94)}.hero-canvas:after{content:"";background:rgba(var(--m-scene-rgb), .3);pointer-events:none;position:absolute;inset:0}.hero-select{z-index:2;width:33%;height:48%;position:absolute;top:35%;left:31%}.hero-select i{border:0 solid var(--hero-mark);filter:drop-shadow(0 0 2px #0000008c);width:32px;height:32px;position:absolute}.hero-select i:first-child{border-top-width:2px;border-left-width:2px;top:0;left:0}.hero-select i:nth-child(2){border-top-width:2px;border-right-width:2px;top:0;right:0}.hero-select i:nth-child(3){border-bottom-width:2px;border-left-width:2px;bottom:0;left:0}.hero-select i:nth-child(4){border-bottom-width:2px;border-right-width:2px;bottom:0;right:0}.hero-select-label{white-space:nowrap;background:rgba(var(--m-scene-rgb), .72);-webkit-backdrop-filter:blur(12px);font-family:var(--font-sans);color:var(--m-pitch-ink);direction:ltr;border:1px solid #e9cb868c;align-items:baseline;gap:10px;padding:8px 14px;font-size:14px;font-weight:500;display:inline-flex;position:absolute;bottom:calc(100% + 12px);left:0}.hero-select-label b{color:var(--hero-mark);font-variant-numeric:tabular-nums;font-weight:600}.hero-frame-line{z-index:1;pointer-events:none;top:min(calc(var(--tt) + var(--fs) * .56), calc(var(--box-top) - 64px));left:calc(var(--gutter) * .55);right:calc(var(--gutter) * .55);bottom:calc(var(--gutter) * .55);position:absolute}.hero-frame-line i{background:#f4efe642;position:absolute}.hero-frame-line i:first-child{transform-origin:0;height:1px;top:0;left:0;right:0}.hero-frame-line i:nth-child(2){transform-origin:top;width:1px;top:0;bottom:0;right:0}.hero-frame-line i:nth-child(3){transform-origin:100%;height:1px;bottom:0;left:0;right:0}.hero-frame-line i:nth-child(4){transform-origin:top;width:1px;top:0;bottom:0;left:0}.hero-title{z-index:2;pointer-events:none;font-family:var(--font-display);font-weight:360;font-size:var(--fs);letter-spacing:-.045em;color:var(--m-pitch-ink);text-shadow:0 2px 30px rgba(var(--m-scene-rgb), .45);margin:0;line-height:.98;position:absolute;inset:0}.hero-title-a,.hero-title-b{text-wrap:balance;display:block;position:absolute}.hero-title-a{top:var(--tt);left:var(--gutter);max-width:var(--zl)}.hero-title-b{top:calc(var(--tt) + var(--fs) * 1.2);right:var(--gutter);max-width:var(--zr);text-align:right}[dir=rtl] .hero-title-a{left:auto;right:var(--gutter);max-width:var(--zr);text-align:right}[dir=rtl] .hero-title-b{right:auto;left:var(--gutter);max-width:var(--zl);text-align:left}.hero-copy{--copy-w:min(380px, calc(max(100vw, 150svh) * .31 + (100vw - max(100vw, 150svh)) / 2 - var(--gutter) - 32px));z-index:3;left:var(--gutter);bottom:calc(var(--gutter) * .55 + clamp(28px, 4.4vh, 56px));width:var(--copy-w);text-shadow:0 1px 18px rgba(var(--m-scene-rgb), .6);position:absolute}.hero-eyebrow{font-family:var(--font-sans);color:var(--m-champagne);margin:0 0 14px;font-size:14px;font-weight:500}.hero-eyebrow:before{content:"";vertical-align:middle;background:var(--m-gold);width:24px;height:1px;margin-inline-end:12px;display:inline-block}.hero-body{font-family:var(--font-sans);color:#f4efe6e6;margin:0;font-size:17px;line-height:1.6}.hero-actions{text-shadow:none;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:28px;display:flex}.hero-btn-primary{--sweep:#fff;--sweep-fg:#15171b;background:var(--m-pitch-ink);color:var(--m-pitch);border:1px solid var(--m-pitch-ink)}.hero-link{font-family:var(--font-sans);color:var(--m-pitch-ink);padding-block:12px;font-size:14.5px;font-weight:500;text-decoration:none;position:relative}.hero-link:after{content:"";inset-inline:0;background:#f4efe673;height:1px;transition:background .22s;position:absolute;bottom:8px}.hero-link:hover:after{background:var(--m-gold)}.hero .m-btn:focus-visible,.hero-link:focus-visible{outline:2px solid var(--m-pitch-ink);outline-offset:4px}.hero-clip{z-index:3;right:var(--gutter);bottom:calc(var(--gutter) * .55 - 26px);background:rgba(var(--m-scene-rgb), .56);-webkit-backdrop-filter:blur(16px)saturate(1.1);width:min(320px,24vw);font-family:var(--font-sans);color:var(--m-pitch-ink);border:1px solid #f4efe629;gap:12px;margin:0;padding:16px 18px 14px;display:grid;position:absolute}.hero-clip-head{align-items:baseline;gap:8px;font-size:14px;font-weight:500;display:flex}.hero-clip-range{font-variant-numeric:tabular-nums;color:var(--m-champagne);margin-inline-start:auto;font-size:12.5px}.hero-track{direction:ltr;height:38px;display:block;position:relative;container-type:inline-size}.hero-track:before{content:"";inset-inline:0;background:#f4efe63d;height:1px;position:absolute;top:8px}.hero-track-range{background:var(--m-gold);width:34%;height:1px;position:absolute;top:8px;left:34%}.hero-mark{color:#f4efe6c2;white-space:nowrap;justify-items:start;gap:6px;font-size:12px;display:grid;position:absolute;top:2px}.hero-mark i{background:#f4efe6b3;width:1px;height:13px}.hero-mark-1{left:34%}.hero-mark-2{left:60%}.hero-clip-note{color:#f4efe69e;font-size:11.5px}.hero-track:after{content:"";background:var(--m-gold);border-radius:50%;width:7px;height:7px;margin-left:-3.5px;position:absolute;top:5px;left:34%}@keyframes heroPlayhead{0%,8%{translate:0}70%,78%{translate:33cqi}to{translate:0}}@media (max-width:1023px){.hero{--gutter:20px;--fs:10vw;--copy-w:auto;flex-direction:column;display:flex}.hero-scene{order:0;height:auto;min-height:0;padding-top:0;overflow:visible;container-type:normal}.hero-title-a,.hero-title-b{text-align:start;max-width:none;display:inline;position:static}.hero-title{top:92px;inset-inline:0;white-space:normal;max-width:none;padding-inline:var(--gutter);letter-spacing:-.035em;line-height:1.04;position:absolute;bottom:auto}.hero-photo{height:clamp(640px,100svh - 120px,900px);margin-top:0;position:relative;inset:auto;container-type:size}.hero-photo .hero-canvas{--cx:calc(100cqw * .5 - var(--wc) * .475);--cy-gap:64px}.hero-frame-line{display:none}.hero-clip{order:1;width:auto;margin:-40px 16px 0;position:relative;inset:auto}.hero-copy{width:auto;text-shadow:none;order:2;padding:28px 20px 44px;position:relative;inset:auto}[lang=ar] .hero{--fs:8.4vw}}@media (min-width:760px) and (max-width:1023px){.hero{--gutter:40px;--fs:8.2vw}.hero-title{top:116px}.hero-clip{width:min(440px,100% - 80px);margin:-56px 40px 0 auto}[dir=rtl] .hero-clip{margin:-56px auto 0 40px}.hero-copy{max-width:600px;padding:40px 40px 64px}.hero-body{font-size:18px}[lang=ar] .hero{--fs:7.4vw}}[lang=ar] .hero-title{letter-spacing:0;font-weight:400;line-height:1.3}.hero-scene:before,.hero-scene:after{content:"";z-index:4;background:rgb(var(--m-scene-rgb));pointer-events:none;height:13vh;display:none;position:absolute;inset-inline:0}.hero-scene:before{transform-origin:top;top:0}.hero-scene:after{transform-origin:bottom;bottom:0}.hero-canvas:before{content:"";z-index:1;background:rgb(var(--m-scene-rgb));opacity:0;pointer-events:none;position:absolute;inset:0}.motion-ok .hero-scene:before,.motion-ok .hero-scene:after{animation:heroBars 1.3s var(--e-io) .15s both;display:block}.motion-ok .hero-canvas:before{animation:heroDim 2.6s var(--e-out) both}.motion-ok .hero-img{animation:heroSettle 3s var(--e-out) both}.motion-ok .hero-title .hw>span{animation:heroRise 1.25s var(--e-out) calc(.5s + var(--i) * 70ms) both}.motion-ok .hero-frame-line i:first-child{animation:heroDrawX 1s var(--e-io) 1.05s both}.motion-ok .hero-frame-line i:nth-child(2),.motion-ok .hero-frame-line i:nth-child(4){animation:heroDrawY .9s var(--e-io) 1.45s both}.motion-ok .hero-frame-line i:nth-child(3){animation:heroDrawX .9s var(--e-io) 1.9s both}.motion-ok .hero-eyebrow:before{transform-origin:0;animation:heroDrawX .8s var(--e-io) 1.5s both}.motion-ok .hero-eyebrow{animation:heroUp 1s var(--e-out) 1.55s both}.motion-ok .hero-body{animation:heroUp 1s var(--e-out) 1.68s both}.motion-ok .hero-actions{animation:heroUp 1s var(--e-out) 1.82s both}.motion-ok .hero-select i{animation:heroLock .75s var(--e-out) both}.motion-ok .hero-select i:first-child{--from:-22px -22px;animation-delay:1.9s}.motion-ok .hero-select i:nth-child(2){--from:22px -22px;animation-delay:1.95s}.motion-ok .hero-select i:nth-child(3){--from:-22px 22px;animation-delay:2s}.motion-ok .hero-select i:nth-child(4){--from:22px 22px;animation-delay:2.05s}.motion-ok .hero-select-label{animation:.6s 2s both heroFade}.motion-ok .hero-clip{animation:heroCut 1s var(--e-io) 2.25s both}.motion-ok .hero-track-range{transform-origin:0;animation:heroDrawX .8s var(--e-io) 2.9s both}.motion-ok .hero-track:after{animation:.4s 3.4s both heroFade,7s cubic-bezier(.45,0,.55,1) 3.6s infinite heroPlayhead}[dir=rtl] .motion-ok .hero-frame-line i:first-child,[dir=rtl] .motion-ok .hero-eyebrow:before{transform-origin:100%}@keyframes heroBars{0%{transform:scaleY(1)}to{transform:scaleY(0)}}@keyframes heroDim{0%{opacity:.7}to{opacity:0}}@keyframes heroSettle{0%{transform:scale(1.14)}to{transform:none}}@keyframes heroRise{0%{translate:0 108%}to{translate:0}}@keyframes heroDrawX{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes heroDrawY{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes heroUp{0%{opacity:0;translate:0 18px}to{opacity:1;translate:0}}@keyframes heroLock{0%{opacity:0;translate:var(--from)}to{opacity:1;translate:0}}@keyframes heroFade{0%{opacity:0}to{opacity:1}}@keyframes heroCut{0%{clip-path:inset(100% 0 0)}to{clip-path:inset(0)}}
