:root {
    --primary: #1a73e8;
    --bg-muted: #f7f9fc;
    --text-dark: #202124;
	--bg-primary: #667eea;
	--bg-primary-grad: #764ba2;
	--bg-primary-rgb: 102, 126, 234;     
	--bg-primary-grad-rgb: 118,  75, 162; 
	--overlay-alpha: 0.6;
}

body{
	
	font-family: 'Noto Sans Arabic';
	background: linear-gradient(135deg, --bg-primary, --bg-primary-grad);
	color:#151515;
	min-height:100vh;
	margin: 0;
    color: var(--text-dark);
    scroll-behavior: smooth;
    transition: margin 0.3s ease;
}

.hero-section {
    background: linear-gradient(135deg, #6e8efb, #a777e3);
    color: white;
    padding: 100px 0;
} 

.feature-icon {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #6e8efb;
}

.testimonial-img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
}

footer {
    background-color: #343a40;
    color: white;
    padding: 50px 0 20px;
}

.login-box {
   max-width: 400px;
   margin: 5rem auto;
   background: #fff;
   border-radius: 12px;
   padding: 2rem;
   box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.btn-primary {
    background-image: linear-gradient(135deg, #4e54c8, #8f94fb);
    border: none;
    border-radius: 0.5rem;
    padding: 0.75rem;
}
.btn-primary:hover {
    background-image: linear-gradient(135deg, #3c3fa5, #7678e7);
}

footer { background:#202124; color:#e0e0e0; padding:2rem 1rem; text-align:center; }
footer a { color:#1a73e8; text-decoration:none; }
footer .contact-item { margin-bottom:0.5rem; }

.container{
	background-color:#f8f9fa;
}