/* ===================================== */
/* NAUDET 1860 — VERSION PREMIUM 2026 */
/* ===================================== */

/* RESET */

*{
box-sizing:border-box;
}

html,body{
margin:0;
padding:0;
background:#f3efe8;
font-family:'Playfair Display',serif;
overflow-x:hidden;
}

/* ===================================== */
/* STRUCTURE CENTRALE */
/* ===================================== */

#maincontainer,
#bodycontainer{
width:100%;
max-width:1280px;
margin:0 auto;
background:#ffffff;
position:relative;
}

/* ===================================== */
/* TOP BAR (COMPTE + PANIER) */
/* ===================================== */

#topbar{
position:fixed;
top:0;
left:50%;
transform:translateX(-50%);
width:100%;
max-width:1280px;
height:42px;
background:#ffffff;
border-bottom:1px solid #e5e5e5;
z-index:100000;

display:flex;
align-items:center;
justify-content:space-between;

padding:0 20px;
font-size:13px;
letter-spacing:0.5px;
}

#topbar-logo img{
height:28px;
}

#topbar-links{
display:flex;
gap:22px;
}

#topbar-links a{
text-decoration:none;
color:#000;
}

#topbar-links a:hover{
color:#8c6f4e;
}

/* ===================================== */
/* HEADER FIXE */
/* ===================================== */

#headercontainer{
position:fixed;
top:42px;
left:50%;
transform:translateX(-50%);
width:100%;
max-width:1280px;
z-index:99999;

background:rgba(255,255,255,0.92);
backdrop-filter:blur(10px);

transition:all 0.4s ease;
}

/* Ombre au scroll */

#headercontainer.scrolled{
box-shadow:0 6px 24px rgba(0,0,0,0.08);
}

/* ===================================== */
/* COMPENSATION CONTENU */
/* ===================================== */

#bodycontainer{
padding-top:230px;
}

/* ===================================== */
/* LOGO */
/* ===================================== */

#headerarea{
padding:45px 20px 20px 20px;
text-align:center;
transition:all 0.4s ease;
}

#headerlogo img{
max-width:230px;
transition:all 0.4s ease;
}

/* Réduction scroll */

#headercontainer.scrolled #headerarea{
padding:15px 20px 10px 20px;
}

#headercontainer.scrolled #headerlogo img{
max-width:160px;
}

/* ===================================== */
/* MENU PRINCIPAL */
/* ===================================== */

#headermenu{
margin-top:20px;
transition:all 0.4s ease;
}

#hmenu{
text-align:center;
}

#hmenu>li{
display:inline-block;
margin:0 28px;
}

#hmenu>li>a.menu{
text-decoration:none;
color:#000;
font-size:15px;
letter-spacing:1px;
text-transform:uppercase;
transition:color 0.3s ease;
}

#hmenu>li>a.menu:hover{
color:#8c6f4e;
}

/* menu compact scroll */

#headercontainer.scrolled #headermenu{
margin-top:8px;
}

/* ===================================== */
/* CONTENU */
/* ===================================== */

#bodyarea{
padding:40px 20px;
}

img{
max-width:100%;
height:auto;
}

/* ===================================== */
/* TITRES PRODUITS */
/* ===================================== */

.productname a,
.viewtbl a,
.sectiontbarea a,
h2 a,
h3 a{

color:#000!important;
text-decoration:none!important;
font-weight:normal!important;

font-family:'Playfair Display',serif;
font-size:18px;

letter-spacing:0.5px;

transition:color 0.3s ease;
}

.productname a:hover,
h2 a:hover,
h3 a:hover{
color:#8c6f4e!important;
}

/* ===================================== */
/* BOUTONS PREMIUM MADE IN FRANCE */
/* ===================================== */

.btnmain,
.btn-savoir-plus {

display:inline-block;

font-family:'Playfair Display',serif;
font-size:14px;

letter-spacing:0.6px;
text-transform:uppercase;

padding:12px 32px;

/* couleurs */

background:#1c3f95;
color:#ffffff;

border:none;

/* arrondi */

border-radius:30px;

/* style */

text-decoration:none;

transition:all 0.35s ease;

}

/* Hover */

.btnmain:hover,
.btn-savoir-plus:hover{

background:#b11226; /* rouge profond */

color:#ffffff;

}

/* effet clic */

.btnmain:active,
.btn-savoir-plus:active{

background:#8f0e1e;

transform:scale(0.96);

}

/* ===================================== */
/* FOOTER */
/* ===================================== */

#footercontainer{
background:#e8dfd3;
width:100%;
}

#footercontainer>div{
max-width:1280px;
margin:0 auto;
padding:40px 20px;
}

/* grille équilibrée */

#fmenu{

display:grid;
grid-template-columns:repeat(4,1fr);

gap:40px;
}

#fmenu li{
margin:0;
}

#fmenu a{
text-decoration:none;
color:#000;
font-size:14px;
display:block;
margin-bottom:10px;
transition:color 0.3s ease;
}

#fmenu a:hover{
color:#8c6f4e;
}

/* ===================================== */
/* RESPONSIVE */
/* ===================================== */

@media screen and (max-width:1024px){

#bodycontainer{
padding-top:200px;
}

#hmenu>li{
display:block;
margin:12px 0;
text-align:center;
}

#fmenu{
grid-template-columns:1fr;
text-align:center;
}

}

/* ===================================== */
/* SUPPRESSION ÉLÉMENTS OXATIS */
/* ===================================== */

.epv,
#ctl00_lblEpv,
ul:empty,
li:empty{
display:none!important;
}

ul{
list-style:none;
padding-left:0;
margin:0;
}