/* ============== HEADER ============== */
.header{
  position:sticky; top:0;
  z-index:var(--z-header);
  background:rgba(244,240,228,.92);
  backdrop-filter:saturate(120%) blur(8px);
  -webkit-backdrop-filter:saturate(120%) blur(8px);
  border-bottom:1px solid var(--border);
}
.header__inner{
  height:var(--header-h-mobile);
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem;
}
@media (min-width:768px){.header__inner{height:var(--header-h)}}

.brand{display:flex; align-items:center; gap:.7rem; color:var(--text);}
.brand__mark{
  width:42px; height:42px; flex-shrink:0;
  display:grid; place-items:center;
}
.brand__name{
  font-family:var(--ff-display);
  font-size:1.2rem;
  font-weight:500;
  letter-spacing:.005em;
  line-height:1;
}
.brand__tag{
  display:block;
  font-family:var(--ff-ui);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
  margin-top:4px;
  font-weight:600;
}

.nav-desktop{display:none}
@media (min-width:900px){
  .nav-desktop{
    display:flex; align-items:center; gap:2rem;
  }
  .nav-desktop a{
    font-family:var(--ff-ui); font-size:.95rem; color:var(--text);
    position:relative; padding:.4rem 0;
    transition:color .2s var(--ease);
  }
  .nav-desktop a::after{
    content:""; position:absolute; left:0; bottom:0;
    width:0; height:1px; background:var(--accent);
    transition:width .25s var(--ease);
  }
  .nav-desktop a:hover{color:var(--accent)}
  .nav-desktop a:hover::after{width:100%}
}

.header__cta{display:none}
@media (min-width:900px){
  .header__cta{
    display:inline-flex; align-items:center; gap:.5rem;
    background:var(--accent); color:#fff;
    padding:.7rem 1.2rem; border-radius:var(--r-md);
    font-family:var(--ff-ui); font-weight:600; font-size:.92rem;
    transition:background .2s var(--ease), transform .2s var(--ease);
  }
  .header__cta:hover{background:var(--accent-dark); transform:translateY(-1px)}
}

/* ============== BURGER (mobile) ============== */
.burger{
  position:fixed;
  top:calc((var(--header-h-mobile) - 44px) / 2);
  right:14px;
  width:44px; height:44px;
  display:grid; place-items:center;
  background:transparent;
  z-index:var(--z-burger);
}
.burger span,
.burger span::before,
.burger span::after{
  content:""; display:block;
  width:24px; height:2px; background:var(--text);
  position:relative; border-radius:2px;
  transition:transform .3s var(--ease), opacity .2s var(--ease), top .3s var(--ease), bottom .3s var(--ease);
}
.burger span::before{position:absolute; top:-7px; left:0}
.burger span::after{position:absolute; bottom:-7px; left:0}
.burger.is-open span{background:transparent}
.burger.is-open span::before{top:0; transform:rotate(45deg)}
.burger.is-open span::after{bottom:0; transform:rotate(-45deg)}
@media (min-width:900px){.burger{display:none}}

/* ============== MENU MOBILE (enfant direct du body) ============== */
.menu-mobile{
  position:fixed;
  top:0; left:0;
  width:100%;
  height:100dvh;
  background:var(--bg);
  z-index:var(--z-menu);
  padding:calc(var(--header-h-mobile) + 28px) 28px 40px;
  display:flex; flex-direction:column; gap:1.2rem;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  transform:translateY(-100%); opacity:0; visibility:hidden;
  transition:transform .35s var(--ease), opacity .35s var(--ease), visibility 0s linear .35s;
}
.menu-mobile.is-open{
  transform:translateY(0); opacity:1; visibility:visible;
  transition:transform .35s var(--ease), opacity .35s var(--ease);
}
.menu-mobile a{
  font-family:var(--ff-display);
  font-size:1.65rem;
  color:var(--text);
  padding:.4rem 0;
  border-bottom:1px solid var(--border);
}
.menu-mobile a.menu-cta{
  margin-top:1rem;
  background:var(--wa-green); color:#fff;
  font-family:var(--ff-ui); font-size:1rem; font-weight:700;
  border:0; border-radius:var(--r-md);
  padding:1rem 1.2rem;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
}
.menu-mobile a.menu-tel{
  background:var(--accent); color:#fff;
  font-family:var(--ff-ui); font-size:1rem; font-weight:700;
  border:0; border-radius:var(--r-md);
  padding:1rem 1.2rem;
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
}
@media (min-width:900px){.menu-mobile{display:none}}

/* ============== SECTIONS ============== */
section{padding:90px 0; position:relative}
@media (max-width:767px){section{padding:64px 0}}
.section-tight{padding:64px 0}
.bg-alt{background:var(--bg-alt)}

/* ============== FOOTER ============== */
.footer{
  background:#1F1D16; color:var(--text-inverse-2);
  padding:60px 0 28px;
}
.footer h4{color:#fff; font-size:1.15rem; margin-bottom:1rem}
.footer a{color:var(--text-inverse-2); transition:color .2s var(--ease)}
.footer a:hover{color:#fff}
.footer__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
  margin-bottom:2.4rem;
}
@media (min-width:768px){.footer__grid{grid-template-columns:1.4fr 1fr 1fr 1.1fr}}
.footer__brand p{color:var(--text-inverse-2); max-width:300px}
.footer__bottom{
  border-top:1px solid rgba(244,240,228,.12);
  padding-top:22px;
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between;
  font-size:.85rem;
}
.footer__bottom button{color:var(--text-inverse-2); text-decoration:underline; padding:0; background:none}
.footer__bottom button:hover{color:#fff}
.footer ul{list-style:none; padding:0; margin:0}
.footer li{margin-bottom:.5rem}