:root{--bg:#efefef;--ink:#1c1c1c;--mut:#777;--ar:'Amiri',serif;--disp:'Bodoni Moda',serif;--scr:'Pinyon Script',cursive;--body:'Newsreader',serif}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--body);overflow-x:hidden}
.ar{font-family:var(--ar);direction:rtl}
#intro{position:fixed;inset:0;background:#1c1c1c;color:#fff;display:grid;place-items:center;z-index:99;transition:clip-path 1s .4s cubic-bezier(.7,0,.2,1);clip-path:inset(0)}
#intro.go{clip-path:inset(0 0 100% 0)}#intro .ar{font-size:clamp(3rem,10vw,7rem);letter-spacing:.1em;animation:fade 1.2s both}
@keyframes fade{from{opacity:0;transform:translateY(20px)}}
nav{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:18px 5vw;z-index:50;font:11px var(--body);letter-spacing:.15em;text-transform:uppercase;background:linear-gradient(var(--bg),transparent)}
nav .lg{font:italic 1.3rem var(--scr);text-transform:none}nav a{color:inherit;text-decoration:none;margin-left:22px;opacity:.7}nav a:hover{opacity:1}
.hero{min-height:100vh;margin:3vw;border:2px solid var(--ink);position:relative;display:grid;place-items:center;overflow:hidden}
.hero h1{font:400 clamp(5rem,24vw,22rem)/.9 var(--disp);letter-spacing:-.02em;animation:fade 1.4s 1.2s both}
.hero .sc{position:absolute;font:clamp(2rem,6vw,5rem) var(--scr);right:12%;bottom:34%}
.hero .arb{position:absolute;left:5%;top:25%;font-size:clamp(1.5rem,4vw,3rem)}
.hero img{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:90%;object-fit:contain;animation:rise 1.4s 1.3s both}
@keyframes rise{from{opacity:0;transform:translate(-50%,60px)}}
.hero .t{position:absolute;font-size:.8rem;max-width:230px}.hero .tl{left:5%;bottom:8%}.hero .tr{right:5%;bottom:8%;text-align:right}.hero .tt{left:5%;top:6%}.hero .tb{right:5%;top:6%;text-align:right;font-style:italic}
.t b{font:italic 700 1.1rem var(--body);display:block}
.mq{background:var(--ink);color:#fff;overflow:hidden;white-space:nowrap;padding:18px 0;transform:rotate(-1.5deg);margin:50px -2vw}
.mq div{display:inline-block;animation:mq 25s linear infinite;font:italic 2rem var(--disp)}.mq span{margin:0 30px}
@keyframes mq{to{transform:translateX(-50%)}}
section{padding:12vh 5vw}.lab{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-bottom:30px}
h2{font:400 clamp(2.5rem,7vw,6rem)/1.05 var(--disp)}h2 i{font:clamp(3rem,8vw,7rem) var(--scr)}
.pf{display:grid;grid-template-columns:1fr 1.2fr;gap:5vw;align-items:center}.pf img,.ph{width:100%;aspect-ratio:3/4;object-fit:cover;background:#ddd}
.pf p{margin:30px 0;line-height:1.7;max-width:520px}.fa{display:grid;grid-template-columns:1fr 1fr;gap:20px 30px}.fa div{border-top:1px solid var(--ink);padding-top:8px}.fa small{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}.fa b{font:600 1.1rem var(--disp)}
.ak{border-top:1px solid var(--ink);margin-top:50px}.ak div{display:grid;grid-template-columns:50px 1fr 1fr 40px;align-items:center;border-bottom:1px solid var(--ink);padding:26px 0;gap:15px;transition:padding .4s}.ak div:hover{padding-left:20px}.ak h3{font:400 clamp(2rem,5vw,4rem) var(--disp)}
.q{background:var(--ink);color:#fff;min-height:100vh;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden}
.q .bg{position:absolute;font-size:30vw;opacity:.07}.q blockquote{font:italic clamp(2rem,6vw,5rem)/1.2 var(--disp);max-width:900px;position:relative}
.q cite{display:block;font:2rem var(--scr);margin-top:30px}
.gl{display:flex;gap:20px;overflow-x:auto;padding:40px 0;scroll-snap-type:x mandatory}.gl figure{flex:0 0 min(70vw,300px);scroll-snap-align:start}.gl img,.gl .ph{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .5s}.gl figure:hover img{transform:scale(1.04)}
.gl figcaption{font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin-top:8px;color:var(--mut)}
.ct{background:var(--ink);color:#fff}.ct h2 i{font-size:clamp(4rem,10vw,9rem)}
.lk{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border-top:1px solid #444;border-bottom:1px solid #444;margin:50px 0}.lk a{color:#fff;text-decoration:none;font:600 1.2rem var(--disp);padding:20px;transition:.3s}.lk a:hover{background:#fff;color:var(--ink)}
.ft{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.1em;flex-wrap:wrap;gap:10px}.big{font:400 22vw/1 var(--disp);text-align:center;margin-top:30px}
.rv{opacity:0;transform:translateY(40px);transition:1s}.rv.in{opacity:1;transform:none}
@media(max-width:700px){.pf{grid-template-columns:1fr}.ak div{grid-template-columns:30px 1fr}.ak div p,.ak div span:last-child{display:none}nav a{margin-left:10px}.hero .t{display:none}}
