من نحن
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>من نحن</title>
<style>
@font-face {
font-family:'GE_SS_Two_Light';
src: url(./fonts/GE_SS_Two_Light.otf) format('opentype');
}
body {
font-family: 'GE_SS_Two_Light';
background-color: #f3f3f3;
margin: 0;
padding: 20px;
}
.about-container {
background-color: #ffffff;
padding: 40px 30px;
border-radius: 16px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
max-width: 800px;
margin: 40px auto;
}
h1 {
color: #b79655;
text-align: center;
font-size: 32px;
margin-bottom: 10px;
}
h2 {
color: #b79655;
margin-top: 30px;
text-align: center;
font-size: 22px;
}
p {
color: #555;
line-height: 2;
text-align: center;
font-size: 18px;
}
.divider {
width: 60px;
height: 3px;
background-color: #b79655;
margin: 10px auto 20px;
border-radius: 2px;
transition: width 0.4s ease;
}
/* === انيميشن الظهور === */
.fade-in {
opacity: 0;
transform: translateY(30px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.fade-in.visible {
opacity: 1;
transform: translateY(0);
}
/* === بطاقات رؤيتنا ورسالتنا === */
.section-card {
background-color: #fdf8ef;
border-right: 4px solid #b79655;
border-radius: 12px;
padding: 20px 25px;
margin: 20px 0;
cursor: pointer;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.section-card:hover {
transform: translateY(-4px);
box-shadow: 0 8px 20px rgba(183, 150, 85, 0.15);
}
.section-card h2 {
margin-top: 0;
}
.section-card p {
margin: 0;
}
/* === عداد الأرقام === */
.stats {
display: flex;
justify-content: center;
gap: 40px;
margin: 30px 0;
flex-wrap: wrap;
}
.stat-item {
text-align: center;
}
.stat-number {
font-size: 36px;
color: #b79655;
font-weight: bold;
display: block;
}
.stat-label {
font-size: 14px;
color: #888;
}
/* === زر التواصل === */
.contact-btn {
display: block;
width: fit-content;
margin: 30px auto 0;
padding: 12px 35px;
background-color: #b79655;
color: white;
border: none;
border-radius: 30px;
font-family: 'GE_SS_Two_Light';
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease, transform 0.2s ease;
text-decoration: none;
}
.contact-btn:hover {
background-color: #9a7d42;
transform: scale(1.05);
}
</style>
</head>
<body>
<!-- بطاقة رؤيتنا -->
<!-- بطاقة رسالتنا -->
تواصل معنا
{
entries.forEach((entry, i) => {
if (entry.isIntersecting) {
setTimeout(() => {
entry.target.classList.add('visible');
}, i * 120);
observer.unobserve(entry.target);
}
});
}, { threshold: 0.15 });
document.querySelectorAll('.fade-in').forEach(el => observer.observe(el));
// === 2. عداد الأرقام ===
function animateCounter(el) {
const target = parseInt(el.getAttribute('data-target'));
const duration = 1800;
const step = target / (duration / 16);
let current = 0;
const timer = setInterval(() => {
current += step;
if (current >= target) {
el.textContent = target.toLocaleString('ar-SA') + '+';
clearInterval(timer);
} else {
el.textContent = Math.floor(current).toLocaleString('ar-SA');
}
}, 16);
}
const statsObserver = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
document.querySelectorAll('.stat-number').forEach(animateCounter);
statsObserver.disconnect();
}
});
}, { threshold: 0.5 });
const statsSection = document.querySelector('.stats');
if (statsSection) statsObserver.observe(statsSection);
// === 3. توسيع الخط الذهبي عند التمرير للبطاقات ===
document.querySelectorAll('.section-card').forEach(card => {
card.addEventListener('mouseenter', () => {
card.querySelector('.divider').style.width = '120px';
});
card.addEventListener('mouseleave', () => {
card.querySelector('.divider').style.width = '60px';
});
});
</body>
</html>
من نحن
أهلاً وسهلاً بك في متجر جامعة أم القرى!
يسعدنا أن تكون معنا — هنا ستجد كل ما يعبّر عن انتمائك وفخرك بجامعتك في كل لحظة.
اخترنا بعناية واهتمام منتجات تناسبك سواء كنت طالباً، طالبة، أو عضواً في هيئة التدريس — لأن كل واحد منكم يستحق الأفضل دائماً.
<!-- عداد الأرقام -->
0
منتج متاح
0
عميل سعيد
0
سنوات خبرة
رؤيتنا
نحلم أن نكون الخيار الأول والأقرب إلى قلبك لكل منتجات الجامعة في المملكة، وأن نكون جزءاً حقيقياً من ذكرياتك الجامعية الجميلة.
رسالتنا
نسعى كل يوم لنكون أقرب إليك — بأفكار مبتكرة وخدمة من القلب، لأن هدفنا الأول هو أن تشعر بالفخر والانتماء في كل منتج تحمله معك.
