*{margin:0;padding:0;box-sizing:border-box}body{font-family:Cairo,sans-serif;background:#f8f9fa;color:#333;line-height:1.6}.top-info-bar{background:linear-gradient(135deg,#f8f9fa,#e9ecef);padding:.6rem 2rem;border-bottom:1px solid #dee2e6;position:sticky;top:0;z-index:1001}.info-bar-content{max-width:1400px;margin:0 auto;display:flex;justify-content:center;align-items:center;gap:2rem;flex-wrap:wrap}.info-item{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#495057;font-weight:700}.info-item i{font-size:1rem;color:#875cbf}.info-item .fa-cloud-sun{background:linear-gradient(180deg,#fbbf24 0% 50%,#3b82f6 50% 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.info-item .value{color:#875cbf;font-weight:800}@media (max-width: 768px){.top-info-bar{padding:.5rem 1rem}.info-bar-content{gap:.5rem;font-size:.7rem;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start}.info-item{font-weight:800;white-space:nowrap}}.top-nav{background:#fff;box-shadow:0 2px 10px #0000001a;padding:1rem 2rem;position:sticky;top:0;z-index:1000;display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.8rem;font-weight:800;color:#875cbf;text-decoration:none;display:flex;align-items:center;gap:.5rem}.logo i{font-size:2rem;color:#a78bca}.search-box{background:#f8f9fa;border:2px solid #e9ecef;border-radius:25px;padding:.75rem 1.5rem;display:flex;align-items:center;gap:.75rem;text-decoration:none;color:#6c757d;font-weight:500;transition:all .3s ease;flex:1;max-width:400px;margin:0 2rem}.search-box:hover{background:#fff;border-color:#875cbf;color:#875cbf;box-shadow:0 2px 8px #875cbf1a}.search-box i{font-size:1.1rem;color:#875cbf}.nav-buttons{display:flex;gap:1rem;justify-content:space-between;width:auto}.nav-btn{padding:12px 24px;border-radius:30px;text-decoration:none;font-weight:700;transition:all .3s ease;display:inline-flex;align-items:center;gap:10px;font-size:1rem;position:relative;overflow:hidden}.nav-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.nav-btn:hover:before{left:100%}.login-btn{background:#fff;color:#875cbf;border:2px solid #875CBF;box-shadow:0 4px 15px #875cbf33}.login-btn:hover{background:#f8f5fc;color:#6d3fa8;border-color:#6d3fa8;transform:translateY(-3px);box-shadow:0 8px 25px #875cbf59}.add-btn{background:linear-gradient(135deg,#875cbf,#a78bca);color:#fff;border:2px solid #875CBF;box-shadow:0 4px 15px #875cbf4d}.add-btn:hover{background:linear-gradient(135deg,#6d3fa8,#875cbf);border-color:#6d3fa8;transform:translateY(-3px);box-shadow:0 8px 30px #875cbf80}.dashboard-btn{background:#875cbf;color:#fff;border:2px solid #875CBF}.dashboard-btn:hover{background:#7c4cb8;border-color:#7c4cb8;transform:translateY(-2px)}.logout-btn{background:#fff;color:#dc2626;border:2px solid #dc2626}.logout-btn:hover{background:#dc2626;color:#fff}.hero-section{background:#875cbf;padding:3rem 2rem 2rem;text-align:center;color:#fff;position:relative;overflow:hidden}.hero-section:before{content:"";position:absolute;inset:0;background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600"><g opacity="0.08" stroke="%23ffffff" stroke-width="1.5" fill="none"><path d="M400,100 L450,150 L420,200 L380,180 L360,220 L400,250 L450,230 L480,270 L440,300 L400,280 L360,300 L380,340 L420,360 L460,340 L480,380 L440,420 L400,400 L360,420 L340,380 L380,360 L340,320 L300,340 L280,300 M200,150 L250,180 L220,220 L180,200 L200,240 L240,260 L280,240 M500,180 L540,200 L560,240 L520,260 L500,220 M300,450 L340,470 L360,510 L320,530 L280,510 L300,470 M500,450 L540,470 L560,510 L520,530 L480,510 L500,470"/><circle cx="400" cy="200" r="8"/><circle cx="400" cy="350" r="6"/><circle cx="300" cy="250" r="5"/><circle cx="500" cy="250" r="5"/><circle cx="350" cy="450" r="4"/><circle cx="450" cy="450" r="4"/><rect x="380" y="190" width="40" height="20" rx="2"/><rect x="380" y="340" width="40" height="20" rx="2"/></g></svg>'),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120"><path fill="%23ffffff" fill-opacity="0.1" d="M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z"></path></svg>');background-position:center center,bottom;background-repeat:no-repeat,no-repeat;background-size:contain,cover;opacity:.3}.hero-content{position:relative;z-index:1;max-width:900px;margin:0 auto}.hero-section h1{font-size:2.5rem;font-weight:800;margin-bottom:1rem;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.hero-section p{font-size:1.3rem;margin-bottom:2rem;opacity:.95}.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.hero-btn{padding:15px 40px;border-radius:30px;text-decoration:none;font-weight:700;font-size:1.1rem;transition:all .3s ease;display:inline-flex;align-items:center;gap:10px}.hero-btn-primary{background:#fff;color:#875cbf}.hero-btn-primary:hover{transform:translateY(-3px);box-shadow:0 10px 25px #0000004d}.hero-btn-secondary{background:transparent;color:#fff;border:2px solid white}.hero-btn-secondary:hover{background:#fff;color:#875cbf;transform:translateY(-3px)}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.section{padding:3rem 1rem}.section-title{text-align:center;font-size:2rem;font-weight:800;color:#1f2937;margin-bottom:1rem}.section-subtitle{text-align:center;color:#6b7280;font-size:1.1rem;margin-bottom:2.5rem}.regions-section{background:#fff;padding:2rem 1rem 3rem}.areas{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-width:1200px;margin:0 auto}.area-card{background:linear-gradient(135deg,#f8f9fa,#fff);border:2px solid transparent;border-radius:16px;padding:2rem 1rem;text-align:center;text-decoration:none;color:#333;transition:all .4s cubic-bezier(.68,-.55,.265,1.55);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;min-height:140px;position:relative;overflow:hidden;box-shadow:0 4px 15px #00000014}.area-card:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(135,92,191,.1),transparent);transform:rotate(45deg);transition:all .6s ease}.area-card:hover:before{left:100%}.area-card i{font-size:3rem;background:linear-gradient(135deg,#875cbf,#a78bca);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transition:all .4s ease;filter:drop-shadow(0 2px 4px rgba(135,92,191,.3))}.area-card p{font-weight:700;font-size:1.15rem;margin:0;position:relative;z-index:1}.area-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 12px 35px #875cbf40;border-color:#875cbf}.area-card:hover i{transform:scale(1.15) rotate(5deg);filter:drop-shadow(0 4px 8px rgba(135,92,191,.5))}.area-card.mall-card{grid-column:1 / -1;background:linear-gradient(135deg,gold,orange);border:3px solid #FFD700;min-height:160px;box-shadow:0 6px 25px #ffa5004d}.area-card.mall-card:before{background:linear-gradient(45deg,transparent,rgba(255,255,255,.3),transparent)}.area-card.mall-card i{font-size:3.5rem;background:linear-gradient(135deg,#fff,#fff8dc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 3px 6px rgba(0,0,0,.3))}.area-card.mall-card p{color:#fff;font-size:1.3rem;text-shadow:0 2px 4px rgba(0,0,0,.2)}.area-card.mall-card:hover{transform:translateY(-10px) scale(1.03);box-shadow:0 15px 45px #ffa50066;border-color:orange}.area-card.mall-card:hover i{transform:scale(1.2) rotate(-5deg)}.area-card:nth-child(1) i{background:linear-gradient(135deg,#3b82f6,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(2) i{background:linear-gradient(135deg,#10b981,#34d399);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(3) i{background:linear-gradient(135deg,#f59e0b,#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(4) i{background:linear-gradient(135deg,#ef4444,#f87171);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(5) i{background:linear-gradient(135deg,#8b5cf6,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(6) i{background:linear-gradient(135deg,#ec4899,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(7) i{background:linear-gradient(135deg,#06b6d4,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.area-card:nth-child(8) i{background:linear-gradient(135deg,#14b8a6,#2dd4bf);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.categories-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;max-width:1200px;margin:0 auto}.category-card{background:#fff;border-radius:16px;padding:2rem 1rem;text-align:center;text-decoration:none;color:#333;transition:all .3s ease;box-shadow:0 2px 8px #00000014;display:flex;flex-direction:column;align-items:center;gap:.8rem}.category-icon{width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#fff;transition:all .3s ease}.category-card h3{font-size:1.1rem;font-weight:700;margin:0}.category-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px #00000026}.category-card:hover .category-icon{transform:scale(1.15) rotate(5deg)}.products-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem;max-width:1200px;margin:0 auto}.product-card{background:#fff;border-radius:12px;overflow:hidden;text-decoration:none;color:#333;transition:all .3s ease;box-shadow:0 2px 8px #00000014;position:relative}.product-discount{position:absolute;top:10px;right:10px;background:#ef4444;color:#fff;padding:5px 12px;border-radius:20px;font-weight:700;font-size:.85rem;z-index:1}.product-image{width:100%;height:200px;object-fit:cover}.product-info{padding:1rem}.product-name{font-weight:700;font-size:1rem;margin-bottom:.5rem}.product-rating{color:#fbbf24;font-size:.9rem;margin-bottom:.5rem}.product-prices{display:flex;align-items:center;gap:.5rem}.product-price{font-size:1.2rem;font-weight:800;color:#875cbf}.product-old-price{font-size:.9rem;text-decoration:line-through;color:#9ca3af}.product-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px #00000026}.trust-section{background:#f8f9fa;padding:3rem 1rem}.trust-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;max-width:1000px;margin:0 auto}.trust-badge{text-align:center;padding:1.5rem 1rem;background:#fff;border-radius:10px;box-shadow:0 2px 6px #0000000f;transition:all .3s ease}.trust-badge:hover{transform:translateY(-3px);box-shadow:0 4px 12px #875cbf26}.trust-badge i{font-size:2rem;color:#875cbf;margin-bottom:.8rem;display:block}.trust-badge h3{font-size:1rem;font-weight:700;margin-bottom:.4rem;color:#333}.trust-badge p{color:#6b7280;font-size:.85rem;line-height:1.4;margin:0}.newsletter-section{background:linear-gradient(135deg,#875cbf,#6d48a8);padding:3rem 1rem;text-align:center;color:#fff}.newsletter-section h2{font-size:2rem;font-weight:800;margin-bottom:.5rem}.newsletter-section p{font-size:1.1rem;margin-bottom:2rem;opacity:.9}.newsletter-form{display:flex;flex-direction:column;gap:1rem;max-width:500px;margin:0 auto}.newsletter-input{padding:15px 20px;border-radius:30px;border:none;font-size:1rem;font-family:Cairo,sans-serif;text-align:center}.newsletter-btn{padding:15px 40px;border-radius:30px;border:2px solid white;background:#fff;color:#875cbf;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s ease;font-family:Cairo,sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:10px}.newsletter-btn:hover{background:transparent;color:#fff;transform:translateY(-2px)}.quick-services-section{background:#f8f9fa;padding:3rem 1rem}.quick-services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;max-width:1200px;margin:0 auto}.service-card{background:#fff;border-radius:16px;padding:1.2rem;text-align:center;box-shadow:0 4px 15px #00000014;transition:all .3s ease;border:2px solid transparent}.service-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #875cbf26;border-color:#875cbf}.service-card i{font-size:2rem;color:#875cbf;margin-bottom:1rem}.service-card h3{font-size:1rem;font-weight:700;color:#1f2937;margin-bottom:1rem}.service-card.emergency{background:linear-gradient(135deg,#fee,#fdd);border-color:#ef4444}.service-card.emergency i{color:#ef4444}.prayer-times,.gold-prices,.emergency-numbers,.currency-rates{display:flex;flex-direction:column;gap:.5rem}.prayer-item,.emergency-item{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:#495057;padding:.5rem;background:#f8f9fa;border-radius:8px}.gold-item,.currency-item{font-size:.85rem;color:#495057;padding:.5rem;background:#f8f9fa;border-radius:8px}.prayer-name,.emergency-name{font-weight:600;color:#495057}.service-card .value{font-weight:700;color:#875cbf}.service-card.emergency .value{color:#ef4444}.install-app-section{background:linear-gradient(135deg,#f8f9fa,#e9ecef);padding:3rem 1rem}.install-content{max-width:800px;margin:2rem auto;text-align:center}.install-icon{font-size:6rem;color:#875cbf;margin-bottom:2rem;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.install-benefits{display:grid;grid-template-columns:1fr;gap:1rem;margin:2rem 0;text-align:right}.benefit-item{background:#fff;padding:1rem 1.5rem;border-radius:12px;display:flex;align-items:center;gap:1rem;box-shadow:0 2px 8px #00000014;transition:all .3s ease}.benefit-item:hover{transform:translate(-5px);box-shadow:0 4px 15px #875cbf26}.benefit-item i{font-size:1.5rem;color:#875cbf;min-width:30px}.benefit-item span{font-size:1rem;font-weight:600;color:#333}.install-btn{background:linear-gradient(135deg,#875cbf,#6d48a8);color:#fff;border:none;padding:1rem 3rem;border-radius:30px;font-size:1.2rem;font-weight:700;cursor:pointer;margin:2rem 0;display:inline-flex;align-items:center;gap:.5rem;transition:all .3s ease;box-shadow:0 4px 15px #875cbf4d}.install-btn:hover{transform:translateY(-3px);box-shadow:0 6px 25px #875cbf66}.install-buttons-wrapper{display:flex;gap:1rem;justify-content:center;align-items:center;margin-top:2rem;flex-wrap:wrap}.install-device-btn{background:#fff;color:#333;border:2px solid #ddd;padding:1rem 2rem;border-radius:15px;font-size:1.1rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.75rem;transition:all .3s ease;text-decoration:none;min-width:200px;justify-content:center}.install-device-btn i{font-size:1.5rem}.android-btn{border-color:#3ddc84;color:#3ddc84}.android-btn:hover{background:#3ddc84;color:#fff;transform:translateY(-3px);box-shadow:0 6px 20px #3ddc844d}.ios-btn{border-color:#555;color:#555}.ios-btn:hover{background:#555;color:#fff;transform:translateY(-3px);box-shadow:0 6px 20px #5555554d}@media (max-width: 768px){.install-buttons-wrapper{flex-direction:column;width:100%}.install-device-btn{width:100%;max-width:300px}}footer{background:#1f2937;color:#fff;padding:3rem 2rem 1rem}.footer-content{display:grid;grid-template-columns:1fr;gap:2rem;max-width:1200px;margin:0 auto 2rem}.footer-section h3{font-size:1.3rem;font-weight:700;margin-bottom:1rem;color:#fff}.footer-links{list-style:none}.footer-links li{margin-bottom:.5rem}.footer-links a{color:#d1d5db;text-decoration:none;transition:color .3s ease}.footer-links a:hover{color:#fff}.social-icons{display:flex;gap:1.5rem;margin-top:1.5rem;flex-wrap:wrap;background:transparent!important;padding:0!important}.social-icon-wrapper{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none}.social-icon{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.68,-.55,.265,1.55);font-size:1.5rem;position:relative;background:#1f2937;box-shadow:0 2px 8px #ffffff26}.social-label{font-size:.75rem;color:#9ca3af;text-shadow:0 2px 4px rgba(0,0,0,.3);transition:all .3s ease}.social-icon-wrapper:hover .social-label{color:#d1d5db;text-shadow:0 3px 6px rgba(0,0,0,.5)}.social-icon:before{content:"";position:absolute;inset:-3px;border-radius:50%;opacity:0;transition:all .4s ease;z-index:-1}.social-icon-wrapper:hover .social-icon{transform:translateY(-8px) scale(1.15) rotate(5deg)}.social-icon-wrapper:hover .social-icon:before{opacity:1;inset:-8px;filter:blur(15px)}.social-icon.phone{color:#d1d5db}.social-icon.phone:before{background:#4a4a4a}.social-icon.whatsapp{color:#25d366}.social-icon.whatsapp:before{background:#25d366}.social-icon.facebook{color:#1877f2}.social-icon.facebook:before{background:#1877f2}.social-icon.youtube{color:red}.social-icon.youtube:before{background:red}.social-icon.telegram{color:#08c}.social-icon.telegram:before{background:#08c}.social-icon.tiktok{color:#d1d5db}.social-icon.tiktok:before{background:#000}.social-icon.instagram{color:#e6683c}.social-icon.instagram:before{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}.social-icon.snapchat{color:#fffc00}.social-icon.snapchat:before{background:#fffc00}.footer-bottom{text-align:center;padding-top:2rem;border-top:1px solid #374151;color:#9ca3af}.error-message{background:#fee;color:#c33;padding:1rem;border-radius:8px;margin:2rem auto;max-width:600px;text-align:center;border:1px solid #fcc}@media (min-width: 768px){.areas{grid-template-columns:repeat(3,1fr)}.categories-grid{grid-template-columns:repeat(4,1fr)}.products-grid{grid-template-columns:repeat(3,1fr)}.trust-badges,.quick-services-grid{grid-template-columns:repeat(4,1fr)}.newsletter-form{flex-direction:row}.newsletter-input{flex:1}.footer-content{grid-template-columns:repeat(3,1fr)}}@media (min-width: 1024px){.areas,.products-grid{grid-template-columns:repeat(4,1fr)}}@media (max-width: 768px){.top-nav{padding:1rem}.logo{font-size:1.3rem}.logo i{font-size:1.5rem}.search-box{display:flex!important;width:100%;max-width:100%;margin:0;padding:.9rem 1.2rem;font-size:1rem}.top-nav{flex-wrap:wrap;gap:.5rem}.nav-buttons{width:100%;display:flex;justify-content:space-between;gap:.75rem}.nav-btn{flex:1;padding:10px 16px;font-size:.9rem;justify-content:center}.hero-section h1{font-size:1.8rem}.hero-section p{font-size:1rem}.section-title{font-size:1.5rem}}@media (max-width: 768px){.trust-badges{grid-template-columns:repeat(2,1fr);gap:1rem}.trust-badge{padding:1.2rem .8rem}.trust-badge i{font-size:1.8rem}.trust-badge h3{font-size:.95rem}.trust-badge p{font-size:.8rem}}@media (max-width: 480px){.trust-badges{grid-template-columns:repeat(2,1fr)}}
