/* Base */
:root{--bg:#0e0f13;--text:#f6f7fb;--muted:#c9cbd4;--accent:#ffcc33;--accent2:#ffd95e}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:'Tajawal',sans-serif;color:var(--text);background:
  radial-gradient(1200px 600px at 120% -20%, rgba(255,217,94,.10), transparent 60%),
  radial-gradient(900px 480px at -20% -10%, rgba(255,204,51,.08), transparent 60%),
  repeating-linear-gradient(135deg, rgba(255,255,255,.03) 0 2px, transparent 2px 16px),
  var(--bg);display:grid;place-items:center}
.wrap{width:min(980px,92vw);padding:32px 0}
.brand{display:flex;align-items:center;gap:24px;justify-content:center;padding:18px 22px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid #242835;position:relative;overflow:hidden}
.logo{position:relative}
.logo-img{width:130px;height:auto;display:block;filter:contrast(1.05)}
/* Big angled lightning bolt */
.bolt{position:absolute;right:-8px;top:-18px;width:64px;height:64px;fill:var(--accent);opacity:.0;transform:rotate(-25deg) scale(.8);filter:drop-shadow(0 0 6px rgba(255,204,51,.7))}
.bolt.flash{animation:bolt .9s ease-out forwards}
@keyframes bolt{0%{opacity:0;transform:rotate(-35deg) scale(.6)}40%{opacity:1;transform:rotate(-20deg) scale(1)}100%{opacity:0;transform:rotate(-10deg) scale(1.05)}}

/* Light that washes half the logo (top-right) */
.glow-light{position:absolute;inset:-30% -30% 40% 40%;pointer-events:none;background:radial-gradient(60% 60% at 85% 15%, rgba(255,214,76,.80) 0%, rgba(255,214,76,.35) 30%, rgba(255,214,76,.10) 55%, transparent 70%);mix-blend-mode:screen;opacity:0;filter:blur(8px)}
.glow-light.on{animation:glow .9s ease-out forwards}
@keyframes glow{0%{opacity:.0}40%{opacity:1}100%{opacity:.0}}

.names{line-height:1}
.names .en{margin:0;font-size:42px;font-weight:800;letter-spacing:1px}
.names .ar{margin:0;font-size:30px;font-weight:800}
.names .tag{margin:6px 0 0;font-size:16px;color:var(--muted)}

.hero{text-align:center;margin:30px 0 10px}
.hero .soon{font-size:36px;margin:0 0 6px}
.hero .sub{color:var(--muted);margin:0 0 18px}

.contact-buttons{display:flex;justify-content:center;gap:16px;margin:16px 0 6px}
.contact-buttons .btn{padding:12px 20px;border-radius:10px;font-weight:800;text-decoration:none;display:flex;align-items:center;gap:8px;transition:.3s}
.contact-buttons .btn.email{background:linear-gradient(180deg,var(--accent2),var(--accent));color:#000}
.contact-buttons .btn.whatsapp{background:#25D366;color:#fff}
.contact-buttons .btn:hover{opacity:.92;transform:translateY(-3px)}

.countdown{text-align:center;margin:18px 0}
.timer{font-size:20px;font-weight:800;color:var(--accent)}

.socials-icons{display:flex;gap:18px;justify-content:center;margin:20px 0}
.socials-icons a{font-size:26px;transition:.3s}
.socials-icons a:hover{transform:translateY(-3px)}
.ig{color:#E1306C}.x{color:#fff}.tt{color:#fff}.fb{color:#1877F2}.sc{color:#FFFC00}.yt{color:#FF0000}.em{color:#fff}

.footer{text-align:center;margin-top:10px;color:#8a8f99}
