*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Tajawal','Inter',sans-serif;background:#1C1C1C;color:#FDFCF8;overflow-x:hidden}
.font-serif{font-family:'Playfair Display',serif}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#1C1C1C}
::-webkit-scrollbar-thumb{background:#C5A67C;border-radius:3px}
@keyframes fadeInUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes whatsappPulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}50%{box-shadow:0 0 0 14px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes waBounce{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.animate-fadeInUp{animation:fadeInUp 1s cubic-bezier(.16,1,.3,1) forwards}
.animate-fadeIn{animation:fadeIn 1s ease forwards}
.text-shine{background:linear-gradient(to right,#FDFCF8,#C5A67C,#FDFCF8);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 4s linear infinite}
.reveal{opacity:0;filter:blur(6px);transform:translateY(24px);transition:all 1s cubic-bezier(.16,1,.3,1)}
.reveal.active{opacity:1;filter:blur(0);transform:translateY(0)}
.d1{transition-delay:100ms}.d2{transition-delay:200ms}.d3{transition-delay:300ms}.d4{transition-delay:400ms}
.glass-card{background:rgba(255,255,255,.03);backdrop-filter:blur(12px);border:1px solid rgba(197,166,124,.1);transition:all .5s cubic-bezier(.16,1,.3,1)}
.glass-card:hover{background:rgba(255,255,255,.06);border-color:rgba(197,166,124,.3);transform:translateY(-8px);box-shadow:0 25px 60px -12px rgba(197,166,124,.12)}
.product-img-wrap{overflow:hidden;position:relative}
.product-img-wrap img{transition:transform .8s cubic-bezier(.16,1,.3,1)}
.glass-card:hover .product-img-wrap img{transform:scale(1.08)}
.product-img-wrap .img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(28,28,28,.8) 0%,transparent 50%);opacity:0;transition:opacity .5s ease}
.glass-card:hover .img-overlay{opacity:1}
.product-img-wrap .qv{position:absolute;bottom:20px;left:50%;transform:translateX(-50%) translateY(20px);opacity:0;transition:all .5s cubic-bezier(.16,1,.3,1)}
.glass-card:hover .qv{opacity:1;transform:translateX(-50%) translateY(0)}
.thumb-dots{position:absolute;bottom:12px;right:12px;display:flex;gap:5px;z-index:5}
.thumb-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3);cursor:pointer;transition:all .3s ease}
.thumb-dot.active,.thumb-dot:hover{background:#C5A67C;width:22px;border-radius:4px}
.gold-line{width:80px;height:1px;background:linear-gradient(to left,#C5A67C,transparent)}
.gold-line-c{width:80px;height:1px;background:linear-gradient(to right,transparent,#C5A67C,transparent);margin:0 auto}
.nav-glass{background:rgba(28,28,28,.85);backdrop-filter:blur(24px);border-bottom:1px solid rgba(197,166,124,.08)}
.nav-link{position:relative;transition:color .3s ease;cursor:pointer}
.nav-link::after{content:'';position:absolute;bottom:-4px;right:0;width:0;height:1px;background:#C5A67C;transition:width .4s cubic-bezier(.16,1,.3,1)}
.nav-link:hover{color:#C5A67C}
.nav-link:hover::after{width:100%}
.nav-link.active-nav{color:#C5A67C}
.nav-link.active-nav::after{width:100%}
.hero-bg{background-size:cover;background-position:center;background-attachment:fixed}
.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(100px);background:rgba(197,166,124,.95);color:#1C1C1C;padding:14px 32px;border-radius:60px;font-weight:600;font-size:.95rem;z-index:300;opacity:0;transition:all .5s cubic-bezier(.16,1,.3,1);backdrop-filter:blur(10px)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.gallery-thumb{width:90px;height:90px;border:2px solid transparent;border-radius:12px;overflow:hidden;cursor:pointer;transition:all .3s ease;opacity:.45}
.gallery-thumb.active,.gallery-thumb:hover{border-color:#C5A67C;opacity:1}
.gallery-thumb img{width:100%;height:100%;object-fit:cover}
.qty-btn{width:40px;height:40px;border:1px solid rgba(197,166,124,.2);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;background:transparent;color:#FDFCF8}
.qty-btn:hover{background:#C5A67C;color:#1C1C1C;border-color:#C5A67C}
.cat-card{position:relative;overflow:hidden;border-radius:1.5rem;cursor:pointer;transition:all .6s cubic-bezier(.16,1,.3,1)}
.cat-card:hover{transform:scale(1.02)}
.cat-card img{transition:transform 1s cubic-bezier(.16,1,.3,1)}
.cat-card:hover img{transform:scale(1.12)}
.cat-card .cat-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(28,28,28,.9) 0%,rgba(28,28,28,.2) 60%,transparent);transition:background .5s ease}
.cat-card:hover .cat-overlay{background:linear-gradient(to top,rgba(28,28,28,.95) 0%,rgba(28,28,28,.3) 60%,rgba(28,28,28,.1))}
.input-field{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(197,166,124,.12);border-radius:12px;padding:14px 20px;color:#FDFCF8;font-family:'Tajawal',sans-serif;font-size:.95rem;transition:all .3s ease;outline:none}
.input-field:focus{border-color:#C5A67C;background:rgba(255,255,255,.06);box-shadow:0 0 0 3px rgba(197,166,124,.1)}
.input-field::placeholder{color:#555}
.select-field{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(197,166,124,.12);border-radius:12px;padding:14px 20px;color:#FDFCF8;font-family:'Tajawal',sans-serif;font-size:.95rem;transition:all .3s ease;outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23C5A67C' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 16px center;cursor:pointer}
.select-field:focus{border-color:#C5A67C;background-color:rgba(255,255,255,.06);box-shadow:0 0 0 3px rgba(197,166,124,.1)}
.select-field option{background:#2A2A2A;color:#FDFCF8;padding:8px}
.order-section{background:linear-gradient(135deg,rgba(197,166,124,.03) 0%,rgba(28,28,28,.8) 50%,rgba(197,166,124,.03) 100%);border:1px solid rgba(197,166,124,.08);border-radius:1.5rem;position:relative;overflow:hidden}
.order-section::before{content:'';position:absolute;top:0;right:0;width:200px;height:200px;background:radial-gradient(circle,rgba(197,166,124,.06) 0%,transparent 70%);pointer-events:none}
.order-section::after{content:'';position:absolute;bottom:0;left:0;width:200px;height:200px;background:radial-gradient(circle,rgba(197,166,124,.04) 0%,transparent 70%);pointer-events:none}
.wa-float{position:fixed;bottom:28px;left:28px;z-index:250;display:flex;align-items:flex-end;gap:12px;direction:rtl;animation:slideUp .8s cubic-bezier(.16,1,.3,1) forwards;animation-delay:2s;opacity:0}
.wa-float.visible{opacity:1}
.wa-bubble{background:rgba(28,28,28,.92);backdrop-filter:blur(16px);border:1px solid rgba(37,211,102,.2);border-radius:16px;padding:14px 20px;max-width:260px;cursor:pointer;transition:all .4s ease;box-shadow:0 8px 32px rgba(0,0,0,.4)}
.wa-bubble:hover{border-color:rgba(37,211,102,.4);box-shadow:0 8px 32px rgba(37,211,102,.15);transform:translateY(-2px)}
.wa-btn{width:60px;height:60px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;animation:whatsappPulse 2.5s infinite;flex-shrink:0;box-shadow:0 4px 20px rgba(37,211,102,.35)}
.wa-btn:hover{transform:scale(1.1);box-shadow:0 6px 28px rgba(37,211,102,.5);animation:waBounce .6s ease}
.noise::before{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:0}
@media(max-width:640px){.wa-float{bottom:16px;left:16px;right:16px;justify-content:flex-end}.wa-bubble{display:none}.wa-btn{width:54px;height:54px}}
@media(max-width:768px){.hero-bg{background-attachment:scroll}}

