/*
Theme Name: Haddad Mozallat
Theme URI: https://example.com/
Author: Custom Conversion
Description: Arabic RTL WordPress theme converted from the original Haddad Mozallat frontend.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: haddad-mozallat
*/

html { scroll-behavior: smooth; }
body { margin: 0; font-family: 'Cairo', 'Tajawal', sans-serif; }
img { max-width: 100%; }

        * { scroll-behavior: smooth; -webkit-tap-highlight-color: transparent; }
        body { font-family: 'Cairo', sans-serif; overflow-x: hidden; }
        .gold-gradient { background: linear-gradient(135deg, #D4AF37 0%, #F4D03F 50%, #D4AF37 100%); }
        .gold-text {
            background: linear-gradient(135deg, #D4AF37, #F4D03F, #D4AF37);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        .hero-overlay {
            background: linear-gradient(to bottom, rgba(15,15,15,0.6) 0%, rgba(15,15,15,0.92) 100%);
        }
        .card-hover { transition: all 0.4s ease; }
        .card-hover:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(212,175,55,0.2); }
        .gallery-img { transition: all 0.5s ease; }
        .gallery-item:hover .gallery-img { transform: scale(1.08); }
        .gallery-item:hover .gallery-overlay { opacity: 1; }
        .gallery-overlay { opacity: 0; transition: all 0.4s ease; }
        .floating-btn { animation: float 3s ease-in-out infinite; }
        @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
        .pulse-ring { animation: pulse-ring 2s ease-out infinite; }
        @keyframes pulse-ring { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.5); opacity: 0; } }
        .lightbox {
            display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0,0,0,0.95); z-index: 9999; justify-content: center; align-items: center;
        }
        .lightbox.active { display: flex; }
        .lightbox img { max-width: 92%; max-height: 88%; object-fit: contain; border-radius: 8px; }
        .nav-link { position: relative; }
        .nav-link::after {
            content: ''; position: absolute; bottom: -4px; right: 0; width: 0; height: 2px;
            background: linear-gradient(90deg, #D4AF37, #F4D03F); transition: width 0.3s ease;
        }
        .nav-link:hover::after { width: 100%; }
        .stat-number {
            background: linear-gradient(135deg, #D4AF37, #F4D03F);
            -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
        }
        .top-bar { background: linear-gradient(135deg, #D4AF37 0%, #F4D03F 50%, #D4AF37 100%); }

        /* Gallery masonry fix - no empty gaps */
        .gallery-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 8px;
        }
        @media (min-width: 640px) {
            .gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; }
        }
        @media (min-width: 1024px) {
            .gallery-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; }
        }
        .gallery-item {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            cursor: pointer;
            aspect-ratio: 4/3;
        }
        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        /* Mobile optimizations */
        @media (max-width: 640px) {
            .hero-title { font-size: 1.75rem !important; line-height: 1.3 !important; }
            .hero-subtitle { font-size: 0.95rem !important; }
            .section-title { font-size: 1.5rem !important; }
            .stat-number { font-size: 2rem !important; }
            .process-num { width: 3rem !important; height: 3rem !important; font-size: 1.1rem !important; }
            .top-phone { font-size: 0.9rem !important; padding: 0.4rem 0.8rem !important; }
            .top-whatsapp { font-size: 0.9rem !important; padding: 0.4rem 0.8rem !important; }
            .service-img { height: 11rem !important; }
            .about-img { height: 16rem !important; }
            .cta-box { padding: 1.25rem !important; }
            .cta-num { font-size: 1.25rem !important; }
            .footer-grid { grid-template-columns: 1fr !important; text-align: center !important; }
        }