/* تيرا ستور — نسخة أنيقة V2 */
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}
:root{
  --bg:#0b1020;
  --card:rgba(255,255,255,.08);
  --stroke:rgba(255,255,255,.12);
  --text:#eef2ff;
  --muted:#c7cbe1;
  --brand:#f59e0b;
  --brand-ink:#0b0f1a;
  --ring:rgba(245,158,11,.35);
  --shadow:0 15px 50px rgba(0,0,0,.35);
  --telegram:#0088cc;
}

body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Noto Kufi Arabic, Noto Naskh Arabic, Arial, sans-serif;
  background: var(--bg);
  color:var(--text);
  min-height:100svh;
  overflow-x:hidden;
}

/* الخلفية */
.bg{position:fixed; inset:0; z-index:-2; overflow:hidden}
.blob{position:absolute; filter:blur(60px); opacity:.55; border-radius:50%; transform:translate(-50%,-50%); animation: float 16s ease-in-out infinite; mix-blend-mode:screen;}
.b1{ top:10%; left:80%; width:420px; height:420px; background: radial-gradient(closest-side, #22d3ee, transparent 70%); animation-delay: -4s;}
.b2{ top:70%; left:20%; width:520px; height:520px; background: radial-gradient(closest-side, #f59e0b, transparent 70%);}
@keyframes float{ 0%,100%{transform:translate(-50%,-52%)} 50%{transform:translate(-50%,-48%)} }

.container{width:min(96%, 980px); margin-inline:auto; padding:clamp(18px, 2vw, 26px);}
.card{background: var(--card); backdrop-filter: blur(14px); border:1px solid var(--stroke); border-radius: 22px; box-shadow: var(--shadow);}
.hero{margin-top: clamp(36px, 7vh, 80px); padding: clamp(22px, 5.2vw, 48px); text-align:center; position: relative; isolation:isolate;}
.logo{width:132px; height:132px; object-fit:contain; border-radius:18px; background:rgba(255,255,255,.08); border:1px solid var(--stroke); display:block; margin:0 auto 14px; box-shadow: 0 8px 30px rgba(0,0,0,.25); transition: transform .25s ease;}
.logo:hover{ transform: translateY(-2px) scale(1.02); }
.brand{font-size: clamp(30px, 5vw, 46px); letter-spacing:.2px; margin:0 0 6px; line-height:1.15;}
.highlights{list-style:none; padding:0; margin:16px auto 20px; width:min(90%,740px); display:grid; gap:10px;}
.highlights li{display:flex; align-items:center; gap:10px; justify-content:center; color:var(--muted); font-size:clamp(15px, 2.9vw, 17px);}
.highlights b{ color:var(--text); font-weight:800; }
.ico{display:inline-grid; place-items:center; width:30px; height:30px; border-radius:10px; background:linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.04)); border:1px solid var(--stroke); box-shadow: 0 6px 16px rgba(0,0,0,.18) inset, 0 2px 10px rgba(0,0,0,.08); color:var(--text);}
.telegram-ico svg{width:20px;height:20px;}

/* الأزرار */
.cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:18px;}
.btn{position:relative; display:inline-block; padding:14px 20px; border-radius:14px; text-decoration:none; font-weight:800; border:1px solid transparent; transition: transform .08s ease, box-shadow .25s ease, background .25s ease; will-change:transform;}
.btn:focus{outline:none; box-shadow:0 0 0 7px var(--ring);}
.btn .btn-ink{position:relative; z-index:1;}
.btn-primary{background: linear-gradient(180deg, #ffd466, #f59e0b); color: var(--brand-ink); border-color: rgba(0,0,0,.15); box-shadow: 0 10px 22px rgba(245,158,11,.35), inset 0 1px 0 rgba(255,255,255,.45);}
.btn-primary:hover{ transform: translateY(-1px); }
.btn-telegram{background: var(--telegram); color:#fff; box-shadow: 0 10px 22px rgba(0,136,204,.35), inset 0 1px 0 rgba(255,255,255,.25);}
.btn-telegram:hover{ transform: translateY(-1px); }
.foot{text-align:center; color:var(--muted); margin:16px 0 10px; font-size:14px;}
.text-fallback{display:grid;place-items:center;font-weight:900;letter-spacing:.5px}
