img { image-orientation: from-image; }

:root {
    --primary: #3a4f43;      /* Vert Sauge Foncé */
    --primary-light: #4f6a5b;
    --secondary: #b05b45;    /* Terracotta Foncé */
    --secondary-light: #c97a63;
    --bg: #e6d9c9;           /* Beige Sable */
    --surface: #f2e8dc;      /* Beige clair */
    --text: #1e2421;         
    --text-muted: #545d59;
    --border: #d1c4b5;
    --shadow: 0 10px 30px rgba(58, 79, 67, 0.1); 
    --radius: 24px;
}

body { 
    font-family: 'Lora', serif; 
    margin: 0; 
    padding-top: 150px; /* Espace pour le header agrandi */
    background-color: var(--bg); 
    color: var(--text); 
    line-height: 1.7;
}

main { max-width: 1100px; margin: 0 auto; padding: 20px; }

h1, h2, h3, h4 { font-family: 'Poppins', sans-serif; font-weight: 700; color: var(--primary); letter-spacing: -0.5px; }

header { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 10px 40px; 
    background-color: var(--bg); 
    position: fixed; 
    top: 0; 
    width: 100%; 
    box-sizing: border-box; 
    z-index: 1000; 
    height: 140px; /* Header plus haut */
    border-bottom: 1px solid var(--border);
}

#main-logo {
    height: 130px; /* Logo agrandi */
    width: auto;
}

.main-nav ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 30px; }
.main-nav a { font-family: 'Poppins', sans-serif; font-size: 0.95rem; font-weight: 600; color: var(--primary); text-decoration: none; padding: 5px 0; border-bottom: 2px solid transparent; transition: 0.3s; }
.main-nav a:hover { color: var(--secondary); }
.main-nav a.active { color: var(--secondary); border-bottom-color: var(--secondary); }

#cart-link { background: var(--primary); color: white !important; padding: 10px 22px; border-radius: 50px; font-weight: 600; font-size: 0.85rem; text-decoration: none; transition: 0.3s; box-shadow: 0 4px 12px rgba(79, 106, 91, 0.2); white-space: nowrap; display: inline-block; }
#cart-link:hover { background: var(--secondary); transform: translateY(-2px); }

@media (max-width: 768px) {
    header { padding: 0 10px; height: 110px; }
    #main-logo { height: 90px !important; }
    body { padding-top: 120px; font-size: 16px; }
    .main-nav ul { gap: 10px; }
    .main-nav a { font-size: 0.85rem; }
    #cart-link { padding: 8px 12px; font-size: 0.75rem; }
}

a { color: inherit; text-decoration: none; }