/* Boutons */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--ff-ui);
  font-size:.94rem;
  font-weight:500;
  padding:14px 22px;
  border-radius:var(--r-md);
  transition:transform .25s var(--ease), background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
  white-space:nowrap;
  border:1px solid transparent;
  cursor:pointer;
}
.btn svg{width:18px;height:18px;flex:none}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

.btn-primary{
  background:var(--accent);
  color:var(--on-dark);
  box-shadow:0 6px 18px rgba(41,64,47,.22);
}
.btn-primary:hover{background:var(--accent-deep);box-shadow:0 10px 24px rgba(41,64,47,.32)}

.btn-wa{
  background:var(--wa-green);
  color:#fff;
  box-shadow:0 6px 18px rgba(37,211,102,.28);
}
.btn-wa:hover{background:#1FB955;box-shadow:0 10px 24px rgba(37,211,102,.36)}

.btn-ghost{
  background:transparent;
  color:var(--text);
  border-color:var(--border);
}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}

.btn-ghost-light{
  background:transparent;
  color:var(--on-dark);
  border-color:rgba(246,244,235,.4);
}
.btn-ghost-light:hover{border-color:var(--on-dark);background:rgba(246,244,235,.06)}

.btn-link{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--ff-ui);
  font-size:.94rem;font-weight:500;
  color:var(--accent);
  border-bottom:1px solid var(--accent);
  padding:2px 0;
  transition:gap .3s var(--ease);
}
.btn-link:hover{gap:14px}

.btn-sm{padding:10px 16px;font-size:.85rem}

/* 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;
  z-index:var(--z-burger);
  color:var(--on-dark);
  transition:color .4s var(--ease);
}
.site-header.is-light ~ .burger,
.site-header.is-scrolled ~ .burger,
.burger.is-open{color:var(--text)}
.burger span,
.burger span::before,
.burger span::after{
  content:"";
  display:block;
  width:24px;height:1.5px;
  background:currentColor;
  border-radius:1px;
  transition:transform .35s var(--ease), top .35s var(--ease), opacity .25s 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{top:0;transform:rotate(45deg)}
.burger.is-open span::after{top:0;transform:rotate(-45deg)}

/* Menu mobile - ENFANT DIRECT DE 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) + 24px) 28px 40px;
  display:flex;
  flex-direction:column;
  gap:6px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  transform:translateY(-100%);
  opacity:0;
  visibility:hidden;
  transition:transform .4s var(--ease), opacity .35s var(--ease), visibility 0s linear .4s;
}
.menu-mobile.is-open{
  transform:translateY(0);
  opacity:1;
  visibility:visible;
  transition:transform .4s var(--ease), opacity .35s var(--ease);
}
.menu-mobile a{
  font-family:var(--ff-display);
  font-size:2rem;
  color:var(--text);
  padding:14px 0;
  border-bottom:1px solid var(--border-soft);
}
.menu-mobile a.btn{
  margin-top:24px;
  border:0;
  border-radius:var(--r-md);
  font-family:var(--ff-ui);
  font-size:1rem;
  justify-content:center;
}
.menu-mobile a.btn-wa{border:0}
.menu-mobile .menu-foot{
  margin-top:auto;
  padding-top:32px;
  font-size:.88rem;
  color:var(--text-mute);
  display:flex;flex-direction:column;gap:6px;
}

@media (min-width:900px){
  .burger{display:none}
  .menu-mobile{display:none}
}

/* Cards */
.card{
  background:var(--surface);
  border-radius:var(--r-lg);
  border:1px solid var(--border-soft);
  padding:32px;
  box-shadow:var(--sh-1);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--border)}

/* Pictograms (style trace fin, Neo-Editorial) */
.picto{
  width:42px;height:42px;
  color:var(--accent);
  stroke:currentColor;
  fill:none;
  stroke-width:1.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Star rating */
.stars{display:inline-flex;gap:2px;color:#D9A441}
.stars svg{width:16px;height:16px;fill:currentColor}

/* Badge */
.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px;
  border-radius:999px;
  background:var(--bg-alt);
  color:var(--accent);
  font-family:var(--ff-ui);
  font-size:.82rem;font-weight:500;
  border:1px solid var(--border-soft);
}
.pill-dark{
  background:rgba(246,244,235,.1);
  color:var(--on-dark);
  border-color:rgba(246,244,235,.18);
  backdrop-filter:blur(6px);
}

/* Sticky mobile CTA (footer flottant) */
.sticky-cta{
  position:fixed;
  inset:auto 0 0 0;
  display:flex;
  gap:10px;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:var(--bg);
  border-top:1px solid var(--border);
  z-index:850;
  box-shadow:0 -8px 24px rgba(34,42,36,.08);
  transform:translateY(110%);
  transition:transform .4s var(--ease);
}
.sticky-cta.is-visible{transform:translateY(0)}
.sticky-cta .btn{flex:1;justify-content:center;padding:14px 12px;font-size:.9rem}
@media (min-width:900px){.sticky-cta{display:none}}
