.layali-intro{position:fixed;inset:0;z-index:60;isolation:isolate;display:grid;place-items:center;overflow:hidden;background:#100e0b;color:#f5efe4}
.layali-intro picture,.intro-shade{position:absolute;inset:0;z-index:-1}.layali-intro picture{left:45%;opacity:.6}.layali-intro picture img{width:100%;height:100%;object-fit:cover;object-position:center 48%}.layali-intro .intro-shade{background:linear-gradient(90deg,#100e0b 5%,#100e0bf0 32%,#100e0b88 70%,#100e0b99)}
.intro-content{width:calc(100% - var(--space)*2);max-width:1328px;margin-inline:auto;text-align:center;padding-bottom:2vh}.intro-kicker{font:400 10px/1.5 Manrope,sans-serif;letter-spacing:.38em;color:#d6b879;margin-bottom:30px}.intro-wordmark{font-family:'Cormorant Garamond',serif;font-size:clamp(50px,7.9vw,120px);font-weight:400;line-height:1.2;color:#efdab0;letter-spacing:.055em}.intro-letters{display:flex;justify-content:center;gap:.28em}.intro-word{white-space:nowrap;display:inline-flex}.intro-letter{display:inline-block;will-change:transform,opacity}.intro-rule{display:block;width:100px;height:1px;background:#d6b879;margin:30px auto 24px;transform-origin:center}.intro-tagline{font-family:'Cormorant Garamond',serif;font-size:clamp(23px,2.5vw,35px);font-weight:400;line-height:1.5;color:#f5efe4;margin:0}[lang=ar] .intro-tagline{font-family:'Noto Sans Arabic',sans-serif;font-size:clamp(19px,2vw,28px);line-height:1.9}
.intro-skip{position:absolute;inset-inline-end:var(--space);top:max(25px,env(safe-area-inset-top));display:flex;gap:18px;align-items:center;min-height:48px;padding:12px 18px;border:1px solid #8d7854;background:#100e0b8c;color:#efdab0;font:500 12px/1.5 Manrope,sans-serif;cursor:pointer}[lang=ar] .intro-skip{font-family:'Noto Sans Arabic',sans-serif}.intro-skip:hover{background:#d6b879;color:#12110f}.intro-skip:focus-visible{outline:2px solid #efdab0;outline-offset:5px}.intro-progress{position:absolute;bottom:0;inset-inline:0;height:2px;background:#443825}.intro-progress::after{content:'';display:block;width:100%;height:100%;background:#d6b879;transform:scaleX(0);transform-origin:left center}
.is-playing{animation:intro-exit 4s ease both}.is-playing .intro-letter{animation:letters-gather 1.55s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--delay)}
.letter-0{--x:-110vw;--y:-65vh;--r:-55deg;--delay:0s}.letter-1{--x:20vw;--y:-110vh;--r:42deg;--delay:.12s}.letter-2{--x:-100vw;--y:65vh;--r:70deg;--delay:.05s}.letter-3{--x:70vw;--y:-100vh;--r:-60deg;--delay:.2s}.letter-4{--x:-75vw;--y:110vh;--r:30deg;--delay:.08s}.letter-5{--x:95vw;--y:80vh;--r:80deg;--delay:.15s}.letter-6{--x:0vw;--y:-115vh;--r:-32deg;--delay:.25s}.letter-7{--x:-120vw;--y:25vh;--r:65deg;--delay:.18s}.letter-8{--x:110vw;--y:-40vh;--r:-75deg;--delay:.07s}.letter-9{--x:-25vw;--y:110vh;--r:40deg;--delay:.24s}.letter-10{--x:115vw;--y:65vh;--r:-25deg;--delay:.13s}.letter-11{--x:75vw;--y:-110vh;--r:55deg;--delay:.3s}.letter-12{--x:110vw;--y:5vh;--r:-70deg;--delay:.21s}
.is-playing .intro-kicker{animation:intro-reveal .7s .85s ease both}.is-playing .intro-rule{animation:intro-line .75s 1.6s ease both}.is-playing .intro-tagline{animation:intro-reveal .7s 1.95s ease both}.is-playing .intro-progress::after{animation:intro-line 4s linear both}
@keyframes letters-gather{from{opacity:0;transform:translate3d(var(--x),var(--y),0) rotate(var(--r)) scale(.4)}15%{opacity:1}to{opacity:1;transform:translate3d(0,0,0) rotate(0) scale(1)}}@keyframes intro-reveal{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}@keyframes intro-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes intro-exit{0%,87%{opacity:1}100%{opacity:0}}
@media(max-width:700px){.layali-intro picture{left:0;top:35%;opacity:.45}.layali-intro .intro-shade{background:linear-gradient(180deg,#100e0bf9 5%,#100e0bd9 35%,#100e0b33 90%)}.intro-content{padding-bottom:20vh}.intro-letters{flex-wrap:wrap;column-gap:.3em;row-gap:0;max-width:460px;margin:auto}.intro-word:first-child{flex-basis:100%;justify-content:center}.intro-wordmark{font-size:clamp(42px,12vw,78px)}.intro-kicker{font-size:8px;letter-spacing:.24em}.intro-rule{width:70px;margin-block:24px 20px}.intro-tagline{font-size:23px;max-width:310px;margin-inline:auto}.intro-skip{top:24px;min-height:44px;font-size:11px;padding:10px 14px}[lang=ar] .intro-tagline{font-size:19px}}
@media(prefers-reduced-motion:reduce){.layali-intro{display:none!important}}