/* Le Vieux Four de Laval - styles communs (inc/header.php) */

:root{
  --fumee:#241c16;        /* charbon du four */
  --fumee-2:#332720;
  --braise:#e1762f;       /* braise vive */
  --braise-douce:#f0a35e;
  --brique:#8a3120;       /* brique cuite */
  --platre:#f5ede1;       /* plâtre chaud */
  --platre-2:#ece1cf;
  --encre:#2a211b;
  --bordeaux:#6f2230;     /* bordeaux du cellier */
  --or:#c6a15b;           /* or vieilli */
  --olive:#5c6b3c;
  --arch:52% 52% 0 0;     /* arche du four */
  --maxw:1120px;
}

*{margin:0;padding:0;box-sizing:border-box}

[hidden]{display:none!important}

html{scroll-behavior:smooth}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

body{
  font-family:'Archivo',sans-serif;
  background:var(--platre);
  color:var(--encre);
  line-height:1.6;
}

h1,h2,h3{font-family:'Marcellus',serif;line-height:1.14;font-weight:400;letter-spacing:.01em}

img{max-width:100%;display:block}

a{color:inherit}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

.eyebrow{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brique);font-weight:600;margin-bottom:14px;
}

.btn{
  display:inline-block;padding:14px 28px;border-radius:6px;
  font-weight:500;font-size:.95rem;text-decoration:none;letter-spacing:.02em;
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
  border:1.5px solid transparent;
}

.btn:hover{transform:translateY(-1px)}

.btn:focus-visible{outline:3px solid var(--or);outline-offset:3px}

.btn-bordeaux{background:var(--bordeaux);color:#fff}

.btn-bordeaux:hover{background:#571a26}

.btn-or{border-color:var(--or);color:var(--platre)}

.btn-or:hover{border-color:#e2c489;color:#fff}

/* ---------- TOPBAR & NAV ---------- */
.topbar{background:#faf5ec;border-bottom:1px solid var(--platre-2);font-size:.8rem}

.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:9px;padding-bottom:9px}

.topbar .mid{opacity:.7}

.topbar a{text-decoration:none}

.topbar a:hover{color:var(--bordeaux)}

header{
  position:sticky;top:0;z-index:50;
  background:rgba(250,245,236,.96);backdrop-filter:blur(8px);
  color:var(--encre);border-bottom:1px solid var(--platre-2);
}

.nav{display:flex;align-items:center;gap:28px;height:80px}

.logo{
  font-family:'Marcellus',serif;text-decoration:none;color:var(--bordeaux);
  text-transform:uppercase;line-height:1.2;display:flex;flex-direction:column;min-width:170px;
}

.logo .l1{font-size:1.3rem;letter-spacing:.1em}

.logo .l2{
  font-size:.6rem;letter-spacing:.4em;color:var(--or);
  display:flex;align-items:center;gap:8px;
}

.logo .l2::before,.logo .l2::after{content:"";flex:1;height:1px;background:var(--or)}

.nav-links{display:flex;gap:22px;margin-left:auto;list-style:none}

.nav-links a{text-decoration:none;font-size:.9rem;white-space:nowrap}

.nav-links a:hover{color:var(--bordeaux)}

.nav-links a.on{color:var(--bordeaux);border-bottom:2px solid var(--or);padding-bottom:3px}

.lang-toggle{
  display:inline-block;text-decoration:none;line-height:1.2;
  background:none;border:1px solid rgba(42,33,27,.3);color:var(--encre);
  border-radius:6px;padding:6px 14px;font-size:.8rem;font-weight:600;cursor:pointer;
}

.lang-toggle:hover{border-color:var(--bordeaux);color:var(--bordeaux)}

.nav .btn{padding:11px 22px;font-size:.85rem}

/* ---------- FOOTER ---------- */
footer{background:var(--fumee);color:var(--platre);padding:48px 0;font-size:.85rem}

.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}

.foot .fam{opacity:.7}

.foot .fam a{color:var(--braise-douce);text-decoration:none}

.foot .fam a:hover{text-decoration:underline}

/* ---------- ESPACEMENT MOBILE ---------- */
/* 5 px de respiration supplementaire de chaque cote sur telephone,
   et prise en compte des ecrans a bords incurves ou a encoche. */
@media (max-width:640px){
  .wrap{
    padding-left:max(29px, env(safe-area-inset-left, 0px));
    padding-right:max(29px, env(safe-area-inset-right, 0px));
  }
  .cats-inner{
    padding-left:max(29px, env(safe-area-inset-left, 0px));
    padding-right:max(29px, env(safe-area-inset-right, 0px));
  }
  /* garde-fou : empeche un element trop large de creer un defilement
     horizontal, ce qui ecraserait visuellement la marge ci-dessus. */
  html,body{overflow-x:hidden;max-width:100%}
}

/* ---------- RESPONSIVE, elements communs ---------- */
/* ---------- MENU MOBILE ---------- */
.nav-cta{display:none}

.nav-burger{
  display:none;background:none;border:1px solid rgba(42,33,27,.3);border-radius:6px;
  width:40px;height:36px;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;padding:0 9px;
}

.nav-burger span{display:block;height:2px;background:var(--encre);border-radius:2px;transition:transform .2s ease,opacity .2s ease}

.nav-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}

.nav-burger[aria-expanded="true"] span:nth-child(2){opacity:0}

.nav-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:900px){
  .topbar .mid{display:none}
  .topbar .wrap{font-size:.72rem}
  .nav{height:66px;gap:12px}
  .nav .btn{display:none}
  .nav-burger{display:flex;margin-left:auto}
  .nav-links{
    display:none;position:absolute;left:0;right:0;top:100%;
    flex-direction:column;gap:0;margin:0;padding:8px 0 12px;
    background:#faf5ec;border-bottom:1px solid var(--platre-2);box-shadow:0 12px 24px rgba(36,28,22,.12);
  }
  .nav-links.open{display:flex}
  .nav-links li a{display:block;padding:12px 24px;font-size:1rem}
  .nav-links a.on{border:none;padding-bottom:12px;background:rgba(198,161,91,.15)}
  .nav-links .nav-cta{display:block;padding:12px 24px 4px}
  .nav-links .nav-cta .btn{display:inline-block}
}

/* ---------- FORMULAIRES ---------- */
.form-card{
  background:#faf5ec;border:1px solid var(--platre-2);border-radius:14px;
  padding:32px;display:grid;gap:14px;position:relative;
}

.form-card h2{font-size:1.35rem;color:var(--bordeaux);margin-bottom:2px}

.form-card .intro{font-size:.92rem;opacity:.75;margin-bottom:6px}

.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.form-card label,.resa-form label{
  display:block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:600;margin-bottom:5px;
}

.form-card label{color:var(--bordeaux)}

.form-card input,.form-card select,.form-card textarea,.resa-form input,.resa-form select{
  width:100%;padding:11px 12px;font-family:'Archivo',sans-serif;font-size:.92rem;
  background:#fff;color:var(--encre);border:1.5px solid var(--platre-2);border-radius:8px;
}

.form-card textarea{min-height:120px;resize:vertical}

.form-card input:focus-visible,.form-card select:focus-visible,.form-card textarea:focus-visible{outline:none;border-color:var(--or)}

.form-card input.err,.form-card select.err,.form-card textarea.err{border-color:#c0392b;background:#fdf3f1}

.form-card button,.resa-form button{border:none;cursor:pointer;font-family:'Archivo',sans-serif;width:100%}

.form-card .note{font-size:.75rem;opacity:.65;text-align:center}

button[disabled]{opacity:.65;cursor:progress}

.gotcha{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.form-error{
  display:none;font-size:.8rem;background:#fdf3f1;color:#8a2020;
  border-radius:8px;padding:10px 12px;line-height:1.45;
}

.form-confirm{text-align:center;padding:24px 4px}

.form-confirm .check{
  width:52px;height:56px;margin:0 auto 14px;border-radius:var(--arch);
  background:var(--bordeaux);display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;color:#fff;
}

.form-confirm strong{display:block;font-family:'Marcellus',serif;font-size:1.2rem;margin-bottom:8px}

.form-confirm p{font-size:.9rem;opacity:.8}

@media (max-width:900px){
  .form-card{padding:24px}
}

/* ---------- POLITIQUE DE CONFIDENTIALITÉ ---------- */
.policy{padding:64px 24px 96px;max-width:820px}

.policy h1{font-size:clamp(1.8rem,3.4vw,2.4rem);color:var(--bordeaux);margin-bottom:16px}

.policy h3{font-size:1.15rem;color:var(--bordeaux);margin:32px 0 10px}

.policy p,.policy li{font-size:.95rem;margin-bottom:12px}

.policy ul{padding-left:22px}

.policy hr{border:0;border-top:1px solid var(--platre-2);margin:20px 0}

/* ---------- CONSENTEMENT AUX TÉMOINS ---------- */
.cookie-consent{
  position:fixed;left:0;right:0;bottom:0;z-index:100;
  background:var(--fumee);color:var(--platre);font-size:.85rem;
  padding:16px 0;box-shadow:0 -8px 24px rgba(36,28,22,.25);
}

.cookie-consent .wrap{display:flex;align-items:center;gap:20px;flex-wrap:wrap}

.cookie-consent p{margin:0;flex:1 1 260px;opacity:.9}

.cookie-consent a{color:var(--braise-douce)}

.cookie-consent .btn{padding:10px 20px;font-size:.85rem;white-space:nowrap}

/* ---------- PAGE 404 ---------- */
.notfound{text-align:center;padding:96px 24px 120px}

.notfound h1{font-size:clamp(1.8rem,3.4vw,2.4rem);color:var(--bordeaux);margin-bottom:12px}

.notfound p{margin-bottom:24px;opacity:.8}