*{box-sizing:border-box;margin:0;padding:0}body{font-family:Cairo,sans-serif;background:#0f0f0f;color:#eee;line-height:1.8}
a{color:inherit;text-decoration:none}
.nav{position:fixed;top:0;inset-inline:0;display:flex;justify-content:space-between;align-items:center;padding:18px 5%;background:rgba(15,15,15,.75);backdrop-filter:blur(8px);z-index:10}
.logo img{height:64px;display:block}
.nav nav{display:flex;gap:22px;align-items:center}.nav nav a{opacity:.8}.nav nav a:hover{opacity:1;color:#CEA111}
#lang{background:none;border:1px solid #CEA111;color:#CEA111;padding:3px 12px;border-radius:20px;cursor:pointer;font-family:inherit}
.hero{height:100vh;max-height:820px;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden;perspective:900px;--mx:0;--my:0}
.hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(#0005,#0f0f0f)}
.hero-in{position:relative;z-index:2}.hero h1{font-size:clamp(2rem,6vw,4.5rem);font-weight:700}.hero p{font-size:1.2rem;opacity:.85;margin:8px 0 28px}
.btn{border:1px solid #CEA111;color:#CEA111;padding:10px 30px;border-radius:30px}.btn:hover{background:#CEA111;color:#111}
.sec{padding:90px 5% 60px;max-width:1300px;margin:auto}h2{text-align:center;font-size:2rem;margin-bottom:30px}
.filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:30px}
.filters button{background:#1c1c1c;border:1px solid #333;color:#ccc;padding:6px 20px;border-radius:20px;cursor:pointer;font-family:inherit}
.filters button.on{background:#CEA111;color:#111;border-color:#CEA111}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.grid figure{margin:0;position:relative;overflow:hidden;border-radius:8px;cursor:zoom-in;aspect-ratio:4/5;background:#1a1a1a}.grid figure img{height:100%;object-fit:cover}.grid.reels figure{aspect-ratio:9/16}@media(max-width:1000px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}
.grid img{width:100%;display:block;transition:transform .5s}.grid figure:hover img{transform:scale(1.05)}
.grid figcaption{position:absolute;bottom:0;inset-inline:0;padding:10px 14px;background:linear-gradient(transparent,#000c);opacity:0;transition:.3s}.grid figure:hover figcaption{opacity:1}
.about{display:grid;grid-template-columns:1fr 1.4fr;gap:50px;align-items:center}.about img{width:100%;border-radius:8px}.about h2{text-align:start}.about p{font-size:1.1rem;opacity:.9}
.contact{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}.contact a{background:#1c1c1c;border:1px solid #333;padding:14px 24px;border-radius:10px;min-width:200px;text-align:center}.contact a:hover{border-color:#CEA111}
.contact small{display:block;color:#CEA111}
footer{text-align:center;padding:30px;opacity:.5;border-top:1px solid #222}
.lb{position:fixed;inset:0;background:#000e;display:none;align-items:center;justify-content:center;flex-direction:column;z-index:20}.lb.show{display:flex}
.lb img{max-width:90vw;max-height:82vh}.lb p{margin-top:10px}.lb button{position:absolute;background:none;border:0;color:#fff;font-size:3rem;cursor:pointer}
.x{top:10px;inset-inline-end:24px}.ar.p{left:20px}.ar.n{right:20px}
@media(max-width:700px){.hero{max-height:640px}.about{grid-template-columns:1fr}.nav nav{gap:12px;font-size:.9rem}.logo img{height:46px;display:block}}
.hero-logo img{width:clamp(200px,24vw,320px);height:auto;display:block;margin:0 auto 10px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.card{position:relative;border-radius:10px;overflow:hidden;cursor:pointer;aspect-ratio:4/3;background:#1c1c1c}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.card:hover img{transform:scale(1.06)}
.card div{position:absolute;inset:auto 0 0 0;padding:14px 18px;background:linear-gradient(transparent,#000d)}
.card b{display:block;font-size:1.15rem}.card span{color:#CEA111;font-size:.9rem}
.back{background:none;border:1px solid #CEA111;color:#CEA111;padding:6px 18px;border-radius:20px;cursor:pointer;font-family:inherit;margin-bottom:20px}
@media(max-width:700px){.logo img{height:48px}.cards{grid-template-columns:1fr 1fr;gap:10px}.card b{font-size:.95rem}}

#grid figure{position:relative}#lbv{height:86vh;aspect-ratio:9/16;max-width:92vw}#lbv iframe{width:100%;height:100%;border:0}

.hero-bg{position:absolute;inset:-6%;background-size:cover;background-position:center;z-index:0;transform:translate3d(calc(var(--mx)*-14px),calc(var(--my)*-10px),0) scale(calc(1.04 + var(--z,0)*.04));will-change:transform}
.hero-in{transform-style:preserve-3d;transform:rotateY(calc(var(--mx)*7deg)) rotateX(calc(var(--my)*-6deg)) translate3d(calc(var(--mx)*16px),calc(var(--my)*12px),0);will-change:transform}
.hero-in>*{transform-style:preserve-3d}.hero-logo{transform:translateZ(70px)}#tagline{transform:translateZ(35px)}.hero-in .btn{display:inline-block;transform:translateZ(50px)}
.hero-logo img{filter:drop-shadow(calc(var(--mx)*-10px) calc(var(--my)*-8px + 10px) 18px #000a)}
@media(prefers-reduced-motion:reduce){.hero-bg,.hero-in,.hero-in>*{transform:none!important}}

.gsub{grid-column:1/-1;margin:18px 0 4px;font-size:15px;letter-spacing:4px;color:#CEA111;font-weight:600;border-bottom:1px solid #CEA11155;padding-bottom:8px}.gsub:first-child{margin-top:0}.grid figure.vid{aspect-ratio:9/16}.grid.reels figure:not(.vid){aspect-ratio:4/5}
.grid figure video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s;background:#1a1a1a}.grid figure:hover video{transform:scale(1.05)}
.grid hr.gdiv{grid-column:1/-1;height:1px;border:0;background:linear-gradient(90deg,transparent,#CEA111aa,transparent);margin:14px 0;padding:0}