:root{
  --bg1:#0b1220;
  --bg2:#0f172a;
  --card:#111c33;
  --border:#1f2a44;
  --txt:#f8fafc;
  --muted:#cbd5e1;
  --a1:#ef4444;
  --a2:#f97316;
}
html,body{background:linear-gradient(180deg,var(--bg1),var(--bg2)); color:var(--txt); overflow-x:hidden}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial}
[lang="ar"] body, [lang="ar"]{font-family:Tajawal,Inter,system-ui}
.gradient-text{
  background:linear-gradient(135deg,var(--a1),var(--a2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.floating-shapes{position:fixed; inset:0; pointer-events:none; z-index:0; overflow:hidden}
.shape{position:absolute;border-radius:999px;filter:blur(90px);opacity:.9; animation:float 18s ease-in-out infinite}
.shape-1{width:420px;height:420px;background:rgba(239,68,68,.18);top:-120px;right:-120px}
.shape-2{width:320px;height:320px;background:rgba(249,115,22,.14);bottom:-90px;left:-90px;animation-delay:-5s}
.shape-3{width:280px;height:280px;background:rgba(16,185,129,.12);top:45%;left:55%;animation-delay:-10s}
@keyframes float{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(28px,22px) rotate(4deg)}}

.tool-card{
  display:flex; flex-direction:column; gap:6px;
  padding:16px; border-radius:18px;
  background:rgba(17,28,51,.6);
  border:1px solid rgba(31,42,68,.9);
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.tool-card span{font-weight:800; font-size:16px}
.tool-card small{color:var(--muted); font-size:12px}
.tool-card:hover{transform:translateY(-4px); border-color:rgba(239,68,68,.8); box-shadow:0 18px 40px rgba(239,68,68,.12)}

.quick-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px; border-radius:14px;
  background:linear-gradient(135deg,var(--a1),var(--a2));
  color:white; font-weight:800; font-size:13px;
  transition:transform .15s ease, box-shadow .15s ease;
  text-decoration:none;
}
.quick-btn:hover{transform:translateY(-1px); box-shadow:0 12px 26px rgba(239,68,68,.25)}

.ad-box{
  border:1px solid rgba(31,42,68,.9);
  background:rgba(255,255,255,.02);
  border-radius:18px;
  padding:12px;
}

.seo-box{
  border:1px solid rgba(31,42,68,.9);
  background:rgba(17,28,51,.35);
  border-radius:18px;
  padding:18px;
}
a{color:inherit}
