:root{
/* نفس لوحة ألوان صفحة تسجيل الدخول */
--brand:#6C5CE7;      /* بنفسجي */
--accent:#00E5A8;     /* تركواز */
--ink:#0f172a;        /* نص داكن */
--muted:#64748b;      /* نص ثانوي */
--bg:#f5f7fb;         /* خلفية ناعمة */
--card:#ffffff;       /* كارت أبيض */
--ring:rgba(108,92,231,.25);
}
*{box-sizing:border-box}
body{
font-family:'Tajawal', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
background:
radial-gradient(1200px 600px at 120% -10%, rgba(108,92,231,.12), transparent 60%),
radial-gradient(800px 500px at -10% 110%, rgba(0,229,168,.12), transparent 60%),
var(--bg);
min-height:100vh; display:flex; flex-direction:column; color:var(--ink);
}
/* Navbar نفس شكل صفحة الدخول */
.navbar{
backdrop-filter:saturate(140%) blur(10px);
background:rgba(255,255,255,.6)!important;
border-bottom:1px solid var(--border);
}
.navbar-brand{
font-weight:800; display:flex; align-items:center; gap:.5rem;
background: linear-gradient(45deg, var(--brand), var(--accent));
-webkit-background-clip:text; background-clip:text; color:transparent;
}
.nav-link{ font-weight:700 }
.nav-link.active{
background: linear-gradient(45deg, var(--brand), var(--accent));
-webkit-background-clip:text; background-clip:text; color:transparent !important;
}

/* Hero */
.hero{padding:84px 0 24px}
.hero h1{
font-size:clamp(2.1rem, 3.5vw, 3.2rem); font-weight:900; margin-bottom:12px;
background:linear-gradient(90deg,var(--brand),var(--accent));
-webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p{color:var(--muted); font-size:1.1rem; max-width:820px; margin:0 auto 22px}

.btn-brand{
background:linear-gradient(90deg,var(--brand),var(--accent));
border:0; color:#fff; border-radius:14px; padding:12px 20px; font-weight:800;
box-shadow:0 12px 30px rgba(108,92,231,.25);
}
.btn-brand:hover{color:#fff; filter:saturate(1.1) brightness(1.02)}
.btn-ghost{
border:2px solid var(--brand); color:var(--brand); border-radius:14px; padding:10px 18px; font-weight:800; background:transparent;
}
.btn-ghost:hover{background:var(--brand); color:#fff}

/* Cards */
.card-glass{
background:var(--card); border:1px solid #e9eef5; border-radius:20px; padding:22px;
box-shadow:0 20px 60px rgba(31,41,55,.06); transition:.25s; height:100%;
}
.card-glass:hover{transform:translateY(-4px); box-shadow:0 26px 70px rgba(31,41,55,.10)}

.feature-icon{
width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center;
background:linear-gradient(90deg,var(--brand),var(--accent)); color:#fff; font-size:1.3rem; margin-bottom:12px;
}
.section-title{
font-weight:900; text-align:center; margin:40px 0 28px;
background:linear-gradient(90deg,var(--brand),var(--accent));
-webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Stats */
.stats{background:#ffffffaa; border:1px solid #e9eef5; border-radius:22px; padding:26px}
.stat{ text-align:center }
.stat .num{
font-weight:900; font-size:2rem;
background:linear-gradient(90deg,var(--brand),var(--accent)); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat .lbl{ color:var(--muted); font-weight:700 }

/* Contact pills */
.contact-item{display:flex; gap:12px; align-items:center; margin-bottom:12px}
.contact-icon{
width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
background:linear-gradient(90deg,var(--brand),var(--accent)); color:#fff
}

/* Footer */
footer{border-top:1px solid #e9eef5; background:#fff8; backdrop-filter: blur(6px); padding:22px 0; margin-top:auto}
.social a{
width:40px; height:40px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center;
background:#f3f6fb; color:var(--ink); margin:0 6px; border:1px solid #e9eef5; transition:all .2s ease;
}
.social a:hover{ transform:translateY(-2px); background:linear-gradient(90deg,var(--brand),var(--accent)); color:#fff; border-color:transparent; }

/* fade-in */
.fade-in{opacity:0; transform:translateY(16px); transition:opacity .6s, transform .6s}
.fade-in.visible{opacity:1; transform:translateY(0)}