/*
Theme Name: Atelier Noir
Author: Roger Betin
Version: 2.0
Description: Galerie d'art sombre, compatible WooCommerce.
*/
:root{--bg:#0d0d0d;--bg2:#171717;--card:#202020;--text:#f2f2f2;--accent:#c67c3e;}
body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,Arial,sans-serif;}

.hero{
    min-height:350px;

    background-image:
        linear-gradient(
            rgba(0,0,0,0.50),
            rgba(0,0,0,0.50)
        ),
        url("http://rbetin.fr/wp-content/uploads/2026/06/Background1.png");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;

    position:relative;
}
.hero > div{
    position:relative;
    z-index:2;

    margin-left:50px;
    padding-top:00px;
}
.hero::before{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,0.45);
}

.hero > *{
    position:relative;
    z-index:2;
}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;padding:24px;}

.art-card{background:var(--card);padding:16px;border-radius:12px;transition:.3s;}
.art-card:hover{transform:scale(1.03);}

/* ==========================
   MENU HORIZONTAL 2026-06-02  
   ========================== */
/* ==========================
   HEADER
   ========================== */

.site-header{
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:60px;
    padding:20px 40px;
    background:#111;
}

.site-logo{
    flex:0 0 auto;
}

.site-logo h1{
    margin:0;
    color:#fff;
}

.main-nav{
    flex:0 0 auto;
    margin:0;
}

.main-nav ul{
    display:flex;
    flex-direction:row;
    list-style:none;
    margin:0;
    padding:0;
    gap:30px;
}

.main-nav li{
    list-style:none;
}

.main-nav a{
    color:#f2f2f2;
    text-decoration:none;
    font-size:18px;
    font-weight:600;
}

.main-nav a:hover{
    color:#c67c3e;
}