/* HEADER */
.site-header{
  position:sticky;top:0;
  z-index:var(--z-header);
  background:rgba(246,240,230,.93);
  backdrop-filter:saturate(1.05) blur(8px);
  -webkit-backdrop-filter:saturate(1.05) blur(8px);
  border-bottom:1px solid transparent;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.site-header.is-scrolled{
  border-bottom-color:var(--border);
  box-shadow:0 6px 20px -16px rgba(46,40,32,.25);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;
  height:var(--header-h-mobile);
  max-width:var(--container);
  margin:0 auto;
  padding:0 20px;
}
@media (min-width:768px){.header-inner{height:var(--header-h);padding:0 40px;}}

/* Brand */
.brand{
  display:inline-flex;align-items:center;gap:10px;
  color:var(--text);text-decoration:none;
}
.brand-mark{
  width:38px;height:38px;flex-shrink:0;
  display:grid;place-items:center;
  background:var(--accent-soft);
  border-radius:50%;color:var(--accent-deep);
  padding:7px;
}
.brand-mark svg{width:100%;height:100%;}
.brand-name{
  font-family:var(--ff-display);
  font-size:1.35rem;font-weight:600;line-height:1;
  letter-spacing:-.01em;
}
.brand-name em{color:var(--accent);font-style:italic;}
.brand-tag{
  display:none;
  font-family:var(--ff-ui);font-size:.66rem;
  text-transform:uppercase;letter-spacing:.18em;
  color:var(--text-mute);margin-top:4px;
}
@media (min-width:1024px){.brand-tag{display:block;}}
.brand-text{display:flex;flex-direction:column;justify-content:center;}

/* Nav desktop */
.nav-desktop{display:none;align-items:center;gap:28px;}
@media (min-width:900px){.nav-desktop{display:inline-flex;}}
.nav-desktop a{
  font-family:var(--ff-ui);font-size:.92rem;font-weight:500;
  color:var(--text);text-decoration:none;letter-spacing:.01em;
  position:relative;padding:6px 0;
}
.nav-desktop a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;
  height:1px;background:var(--accent);transform:scaleX(0);
  transform-origin:left;transition:transform var(--dur) var(--ease);
}
.nav-desktop a:hover::after{transform:scaleX(1);}

/* Header CTA desktop */
.header-cta{
  display:none;align-items:center;gap:14px;
}
.header-cta .btn{padding:11px 16px;font-size:.86rem;white-space:nowrap;}
@media (min-width:900px){.header-cta{display:inline-flex;}}
.header-cta .open-now{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--ff-ui);font-size:.82rem;color:var(--text-2);
}
.header-cta .open-now .dot{
  width:8px;height:8px;border-radius:50%;
  background:#888;flex-shrink:0;
}
.header-cta .open-now.is-open .dot{background:#34a853;box-shadow:0 0 0 3px rgba(52,168,83,.18);}
.header-cta .open-now.is-closed .dot{background:#c33;}

/* Burger */
.burger{
  position:fixed;
  top:calc((var(--header-h-mobile) - 44px) / 2);
  right:16px;
  width:44px;height:44px;
  display:grid;place-items:center;
  background:transparent;border:0;cursor:pointer;
  z-index:1101;
}
.burger span,.burger span::before,.burger span::after{
  content:"";display:block;
  width:22px;height:2px;background:var(--text);
  border-radius:1px;transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease);
}
.burger span{position:relative;}
.burger span::before{position:absolute;top:-7px;left:0;}
.burger span::after{position:absolute;top:7px;left:0;}
.burger.is-open span{background:transparent;}
.burger.is-open span::before{transform:translateY(7px) rotate(45deg);}
.burger.is-open span::after{transform:translateY(-7px) 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:6px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  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.7rem;color:var(--text);
  padding:14px 0;text-decoration:none;
  border-bottom:1px solid var(--border);
}
.menu-mobile a.btn{
  font-family:var(--ff-ui);font-size:1rem;
  margin-top:18px;border-bottom:0;
}
.menu-mobile a.btn--primary{color:#fff;}
.menu-mobile a.btn--wa{color:#fff;}
.menu-mobile a.btn--ghost{color:var(--text);}
@media (min-width:900px){.menu-mobile{display:none;}}

/* FOOTER */
.site-footer{
  background:var(--accent-deep);
  color:#EFE9DA;
  padding:56px 0 28px;
}
.site-footer :where(h2,h3,h4,p,li,a,span){color:#EFE9DA;}
.footer-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:36px;
}
@media (min-width:768px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;}}
.footer-col h4{
  font-family:var(--ff-display);font-size:1.25rem;
  color:#fff;margin-bottom:14px;font-weight:500;
}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.footer-brand .brand-mark{background:rgba(255,255,255,.12);color:#fff;}
.footer-brand .brand-name{color:#fff;}
.footer-col p,.footer-col li,.footer-col a{
  font-size:.94rem;color:rgba(239,233,218,.82);
  text-decoration:none;
}
.footer-col li{padding:4px 0;}
.footer-col a:hover{color:#fff;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:40px;padding-top:24px;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;
  font-size:.84rem;color:rgba(239,233,218,.7);
}
.footer-bottom button.ml-trigger{
  background:transparent;border:0;color:rgba(239,233,218,.85);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer;
  font-size:.84rem;
}
.footer-bottom button.ml-trigger:hover{color:#fff;}

/* FAB mobile */
.fab{
  position:fixed;right:18px;bottom:18px;
  width:58px;height:58px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:grid;place-items:center;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.35);
  z-index:1050;text-decoration:none;
}
.fab svg{width:26px;height:26px;}
.fab:hover{background:var(--accent-deep);color:#fff;}
@media (min-width:900px){.fab{display:none;}}
