CrystalShop
Crystal Shop — كود كامل جاهز للنسخ واللصق مباشرة في صفحات YouCan
يصلح لجميع المنتجات + متجاوب مع الهاتف والحاسوب + صوت الهيبة الملكي
============================================================================ -->
.crystal-youcan-wrap {
background-color: #070707;
color: #ffffff;
font-family: 'Cairo', sans-serif;
direction: rtl;
text-align: right;
line-height: 1.6;
overflow-x: hidden;
}
.crystal-youcan-wrap * {
box-sizing: border-box;
}
.crystal-topbar {
background: linear-gradient(90deg, #14100b, #241c11, #14100b);
border-bottom: 1px solid rgba(197, 168, 128, 0.3);
padding: 10px 16px;
text-align: center;
font-size: 13px;
color: #e6c89c;
font-weight: 700;
}
.crystal-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 18px 28px;
background: rgba(10, 10, 10, 0.96);
border-bottom: 1px solid rgba(197, 168, 128, 0.25);
position: sticky;
top: 0;
z-index: 99;
flex-wrap: wrap;
gap: 12px;
}
.crystal-logo {
font-size: 24px;
font-weight: 900;
background: linear-gradient(135deg, #fff3d1 0%, #c5a880 50%, #9a7b4f 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: 1px;
}
.crystal-nav {
display: flex;
gap: 20px;
list-style: none;
margin: 0;
padding: 0;
}
.crystal-nav a {
color: #d1d5db;
text-decoration: none;
font-size: 14px;
font-weight: 700;
transition: color 0.25s;
}
.crystal-nav a:hover {
color: #c5a880;
}
.crystal-hero {
padding: 80px 20px;
text-align: center;
background: radial-gradient(circle at center, #1f1910 0%, #070707 75%);
border-bottom: 1px solid rgba(197, 168, 128, 0.2);
}
.crystal-hero h1 {
font-size: clamp(26px, 4.5vw, 46px);
font-weight: 900;
color: #c5a880;
margin: 0 auto 16px;
max-width: 820px;
}
.crystal-hero p {
color: #d1d5db;
font-size: 16px;
max-width: 660px;
margin: 0 auto 28px;
}
.crystal-btn {
display: inline-block;
padding: 13px 28px;
border-radius: 10px;
font-weight: 800;
font-size: 15px;
cursor: pointer;
text-decoration: none;
border: 1px solid #c5a880;
background: linear-gradient(135deg, #d8bc96 0%, #c5a880 50%, #a38458 100%);
color: #000000;
transition: all 0.3s ease;
}
.crystal-btn:hover {
transform: translateY(-3px);
box-shadow: 0 10px 25px rgba(197, 168, 128, 0.3);
}
.crystal-btn-outline {
background: transparent;
color: #e6c89c;
margin-right: 10px;
}
.crystal-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 24px;
padding: 50px 20px;
max-width: 1200px;
margin: 0 auto;
}
.crystal-card {
background: #111111;
border: 1px solid rgba(197, 168, 128, 0.28);
border-radius: 16px;
overflow: hidden;
transition: all 0.35s ease;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.crystal-card:hover {
border-color: #c5a880;
transform: translateY(-6px);
box-shadow: 0 16px 36px rgba(0, 0, 0, 0.9), 0 0 25px rgba(197, 168, 128, 0.2);
}
.crystal-card img {
width: 100%;
height: 250px;
object-fit: cover;
background: #181818;
}
.crystal-card-body {
padding: 18px;
}
.crystal-card-tag {
font-size: 12px;
color: #c5a880;
font-weight: 700;
}
.crystal-card-title {
font-size: 18px;
font-weight: 800;
color: #ffffff;
margin: 6px 0 10px;
}
.crystal-card-price {
font-size: 22px;
font-weight: 900;
color: #c5a880;
display: block;
margin-bottom: 14px;
}
.crystal-footer {
background: #040404;
border-top: 1px solid rgba(197, 168, 128, 0.2);
padding: 28px 20px;
text-align: center;
color: #9ca3af;
font-size: 13px;
}
.prestige-ripple {
position: fixed;
border-radius: 50%;
pointer-events: none;
border: 2px solid rgba(197, 168, 128, 0.78);
box-shadow: 0 0 20px rgba(197, 168, 128, 0.45);
transform: translate(-50%, -50%) scale(0);
animation: crystalRipple 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
z-index: 99999;
}
@keyframes crystalRipple {
0% { width: 0px; height: 0px; opacity: 0.95; }
100% { width: 110px; height: 110px; opacity: 0; }
}
👑 مرحباً بكم في Crystal Shop — توصيل سريع لجميع المدن + الدفع عند الاستلام مضمون 100%
- الرئيسية
- جميع المنتجات
- تواصل معنا
🛒 تسوق الآن
مرحباً بك في عالم Crystal Shop حيث تلتقي الفخامة بالهيبة
تشكيلة مختارة بعناية من الساعات الفاخرة، العطور الملكية، الإلكترونيات الذكية، والإكسسوارات الجلدية مع ضمان الجودة والدفع عند الاستلام.
🛍️ تصفح المنتجات
🔥 العروض الحصرية
ساعات وإكسسوارات
ساعة كرونوغراف ملكية — Black & Gold
699 DHS
⚡ اطلب الآن — الدفع عند الاستلام
عطور وجمال
عطر العود الملكي الفاخر — Royal Oud
450 DHS
⚡ اطلب الآن — الدفع عند الاستلام
إلكترونيات ذكية
سماعات لاسلكية احترافية عازلة للضجيج
549 DHS
⚡ اطلب الآن — الدفع عند الاستلام
موضة وجلديات
حقيبة جلدية طبيعية فاخرة بقفل ذهبي
620 DHS
⚡ اطلب الآن — الدفع عند الاستلام
© 2026 Crystal Shop — جميع الحقوق محفوظة | توصيل سريع لجميع المدن والدفع عند الاستلام
(function() {
let audioCtx = null;
function playPrestigeSound(isInteractive) {
try {
const AudioCtx = window.AudioContext || window.webkitAudioContext;
if (!AudioCtx) return;
if (!audioCtx) audioCtx = new AudioCtx();
if (audioCtx.state === 'suspended') audioCtx.resume();
const now = audioCtx.currentTime;
const sub = audioCtx.createOscillator();
const subGain = audioCtx.createGain();
sub.type = 'sine';
sub.frequency.setValueAtTime(115, now);
sub.frequency.exponentialRampToValueAtTime(38, now + 0.22);
subGain.gain.setValueAtTime(0.4, now);
subGain.gain.exponentialRampToValueAtTime(0.001, now + 0.26);
sub.connect(subGain);
subGain.connect(audioCtx.destination);
sub.start(now);
sub.stop(now + 0.27);
const notes = isInteractive ? [220.00, 329.63, 440.00, 659.25] : [293.66, 440.00, 587.33];
const filter = audioCtx.createBiquadFilter();
filter.type = 'lowpass';
filter.frequency.setValueAtTime(1850, now);
filter.frequency.exponentialRampToValueAtTime(320, now + 0.5);
filter.connect(audioCtx.destination);
notes.forEach(function(freq, idx) {
const osc = audioCtx.createOscillator();
const gain = audioCtx.createGain();
osc.type = idx % 2 === 0 ? 'triangle' : 'sine';
const st = now + (idx * 0.02);
osc.frequency.setValueAtTime(freq, st);
gain.gain.setValueAtTime(0.0001, st);
gain.gain.linearRampToValueAtTime(0.09, st + 0.015);
gain.gain.exponentialRampToValueAtTime(0.0008, st + 0.44);
osc.connect(gain);
gain.connect(filter);
osc.start(st);
osc.stop(st + 0.46);
});
} catch (err) {}
}
document.addEventListener('pointerdown', function(e) {
const ripple = document.createElement('div');
ripple.className = 'prestige-ripple';
ripple.style.left = e.clientX + 'px';
ripple.style.top = e.clientY + 'px';
document.body.appendChild(ripple);
setTimeout(function() { ripple.remove(); }, 650);
const interactive = e.target.closest('button, a, .crystal-card');
playPrestigeSound(Boolean(interactive));
});
})();