* { margin: 0; padding: 0; box-sizing: border-box; }
       html,
body{
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
}

/* Prevent overscroll bounce only on desktop (mouse/trackpad) */
@media (hover: hover) and (pointer: fine) {
    html, body {
        overscroll-behavior: none;
    }
}

body{
    font-family:'Inter',sans-serif;
    background:#fff;
    color:#1A1A1A;
}
        /* Preloader */
        .preloader {
            position: fixed; inset: 0; z-index: 9999;
            background: #fff;
            display: flex; align-items: center; justify-content: center;
            flex-direction: column;
        }
        .loader-bar-track {
            width: 200px; height: 2px; background: #E5E5E5; border-radius: 2px; overflow: hidden;
        }
        .loader-bar {
            width: 0%; height: 100%; background: linear-gradient(90deg, #D4A574, #C9A961); border-radius: 2px;
        }
        .loader-text {
            font-size: 11px; font-weight: 600; letter-spacing: 0.3em;
            text-transform: uppercase; color: #D4A574; margin-bottom: 16px;
            font-family: 'Playfair Display', serif;
        }

        /* Search overlay */
        .search-overlay {
            position: fixed; inset: 0; z-index: 100;
            background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
            opacity: 0; pointer-events: none; transition: opacity 0.3s ease;
        }
        .search-overlay.active { opacity: 1; pointer-events: all; }

        /* Custom scrollbar */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #f1f1f1; }
        ::-webkit-scrollbar-thumb { background: #ccc; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: #D4A574; }

        /* Hero search */
        .hero-search-input:focus { outline: none; }
        
        /* Category card hover */
        .category-card img {
            transition: transform 0.7s cubic-bezier(0.25, 1, 0.5, 1);
        }
        .category-card:hover img {
            transform: scale(1.08);
        }

        /* Product card hover */
        .product-card {
            transition: box-shadow 0.3s ease, transform 0.3s ease;
        }
        .product-card:hover {
            box-shadow: 0 8px 30px rgba(212,165,116,0.15);
            transform: translateY(-4px);
        }

        /* Nav dropdown */
        .nav-dropdown{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(12px);
    transition:all 0.3s ease;
}

        .nav-item.group:hover .nav-dropdown {
            opacity: 1;
            pointer-events: all;
            transform: translateY(0);
        }

        /* Fade up animation class */
        .fade-up{
            opacity:1;
            transform:translateY(0);
        }
        /* Mobile menu */
        .mobile-menu {
            transform: translateX(100%);
            transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
        }
        .mobile-menu.open {
            transform: translateX(0);
        }

        /* Toast */
        .toast {
            position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%) translateY(100px);
            z-index: 200; background: #2C3E50; color: #fff; padding: 14px 28px;
            border-radius: 8px; font-size: 14px; font-weight: 500;
            transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
        }
        .toast.show { transform: translateX(-50%) translateY(0); }

        /* Photo grid masonry-like */
       .photo-grid-item{
            height:320px;
        }

        /* Smooth image loading */
        img { opacity: 0; transition: opacity 0.5s ease; }
        img.loaded { opacity: 1; }

        /* Gold gradient text */
        .gold-gradient {
            background: linear-gradient(135deg, #D4A574 0%, #C9A961 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        /* ==================== IDEAS GALLERY ==================== */

.ideas-gallery{
    padding:100px 5%;
    background:#fafafa;
}

.ideas-gallery .section-title{
    text-align:center;
    margin-bottom:50px;
}

.ideas-gallery .section-title h2{
    font-size:52px;
    font-family:'Playfair Display', serif;
    margin-bottom:12px;
    color:#1A1A1A;
}

.ideas-gallery .section-title p{
    color:#777;
    font-size:16px;
}

.gallery-filters{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:14px;
    margin-bottom:50px;
}

.gallery-filters button{
    padding:12px 22px;
    border:none;
    border-radius:50px;
    background:white;
    color:#1A1A1A;
    cursor:pointer;
    font-weight:600;
    transition:0.3s ease;
    box-shadow:0 2px 14px rgba(0,0,0,0.06);
}

.gallery-filters button.active,
.gallery-filters button:hover{
    background:#D4A574;
    color:white;
}

.gallery-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:25px;
}

.gallery-item{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    height:380px;
    cursor:pointer;
}

.gallery-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:1 !important;
    transition:transform 0.7s cubic-bezier(0.25,1,0.5,1);
}

.gallery-item:hover img{
    transform:scale(1.08);
}

.gallery-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(to top, rgba(0,0,0,0.78), rgba(0,0,0,0.05));
    display:flex;
    align-items:flex-end;
    padding:28px;
}

.gallery-overlay h3{
    color:white;
    font-size:28px;
    margin-bottom:6px;
    font-family:'Playfair Display', serif;
}

.gallery-overlay p{
    color:rgba(255,255,255,0.85);
    font-size:14px;
}

@media(max-width:768px){

    .ideas-gallery .section-title h2{
        font-size:36px;
    }

    .gallery-item{
        height:300px;
    }

}
/* ================= ABOUT SECTION ================= */

.about-section{
    padding:100px 5%;
    background:#fff;
    overflow:hidden;
}

.about-container{
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center;
}

.about-image{
    position:relative;
}

.about-image img{
    width:100%;
    height:650px;
    object-fit:cover;
    border-radius:30px;
    display:block;
    opacity:1 !important;
}

.about-card{
    position:absolute;
    left:-40px;
    bottom:-40px;
    background:#D4A574;
    color:#fff;
    padding:28px;
    max-width:320px;
    border-radius:24px;
    box-shadow:0 20px 50px rgba(0,0,0,0.18);
}

.about-card p{
    font-size:15px;
    line-height:1.7;
    margin-bottom:10px;
}

.about-card span{
    font-size:12px;
    opacity:0.8;
}

.about-content small{
    display:block;
    margin-bottom:18px;
    text-transform:uppercase;
    letter-spacing:4px;
    font-size:11px;
    font-weight:700;
    color:#D4A574;
}

.about-content h2{
    font-size:64px;
    line-height:1.05;
    margin-bottom:24px;
    font-family:'Playfair Display', serif;
    color:#1A1A1A;
}

.about-content h2 span{
    color:#D4A574;
}

.about-content p{
    font-size:17px;
    line-height:1.9;
    color:#666;
    max-width:600px;
}

/* MOBILE */

@media(max-width:992px){

    .about-container{
        grid-template-columns:1fr;
        gap:50px;
    }

    .about-image{
        order:1;
    }

    .about-content{
        order:2;
    }

    .about-image img{
        height:420px;
    }

    .about-card{
        position:relative;
        left:0;
        bottom:0;
        margin-top:20px;
        max-width:100%;
    }

    .about-content h2{
        font-size:42px;
    }

}

@media(max-width:576px){

    .about-section{
        padding:70px 20px;
    }

    .about-image img{
        height:320px;
        border-radius:22px;
    }

    .about-content h2{
        font-size:34px;
    }

    .about-content p{
        font-size:15px;
        line-height:1.8;
    }

    .about-card{
        padding:22px;
        border-radius:18px;
    }

}

/* ==================== BRANDS SECTION ==================== */

.brands-section{
    padding:110px 5%;
    background:#FAF8F5;
    overflow:hidden;
}

.brands-container{
    max-width:1400px;
    margin:auto;
    display:grid;
    grid-template-columns:0.9fr 1.1fr;
    gap:70px;
    align-items:center;
}

.brands-content small{
    display:block;
    margin-bottom:18px;
    text-transform:uppercase;
    letter-spacing:4px;
    font-size:11px;
    font-weight:700;
    color:#D4A574;
}

.brands-content h2{
    font-size:60px;
    line-height:1.05;
    margin-bottom:24px;
    font-family:'Playfair Display', serif;
    color:#1A1A1A;
}

.brands-content h2 span{
    color:#D4A574;
}

.brands-content p{
    font-size:17px;
    line-height:1.9;
    color:#666;
    margin-bottom:40px;
    max-width:560px;
}

.brands-stats{
    display:flex;
    gap:22px;
    flex-wrap:wrap;
}

.brand-stat{
    background:white;
    padding:22px 28px;
    border-radius:22px;
    min-width:140px;
    box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

.brand-stat h3{
    font-size:34px;
    color:#D4A574;
    margin-bottom:8px;
    font-family:'Playfair Display', serif;
}

.brand-stat p{
    margin:0;
    font-size:13px;
    color:#777;
    line-height:1.5;
}

.brands-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px;
}

.brand-card{
    background:white;
    border-radius:26px;
    padding:40px;
    height:170px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:0.4s ease;
    box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

.brand-card:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 45px rgba(212,165,116,0.18);
}

.brand-card img{
    width:100%;
    max-width:150px;
    max-height:70px;
    object-fit:contain;
    opacity:1 !important;
    /* filter:grayscale(100%); */
    transition:0.4s ease;
}

.brand-card:hover img{
    filter:grayscale(0%);
    transform:scale(1.05);
}

/* MOBILE */

@media(max-width:992px){

    .brands-container{
        grid-template-columns:1fr;
    }

    .brands-content h2{
        font-size:42px;
    }

}

@media(max-width:576px){

    .brands-section{
        padding:70px 20px;
    }

    .brands-grid{
        grid-template-columns:1fr 1fr;
        gap:16px;
    }

    .brand-card{
        padding:24px;
        height:120px;
        border-radius:18px;
    }

    .brand-card img{
        max-width:100px;
        max-height:50px;
    }

    .brands-content h2{
        font-size:34px;
    }

}
#heroSub{
    text-shadow:
        0 2px 8px rgba(0,0,0,0.6),
        0 4px 20px rgba(0,0,0,0.45);

    backdrop-filter: blur(4px);
    background: rgba(0,0,0,0.15);
    padding: 14px 24px;
    border-radius: 14px;
    display: inline-block;
}