/* ── Scroll reveal ── */
.anim-hidden {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.55s cubic-bezier(0.16,1,0.3,1), transform 0.55s cubic-bezier(0.16,1,0.3,1);
}
.anim-hidden.anim-visible {
  opacity: 1;
  transform: none;
}

/* ── Header scroll shadow ── */
.site-header {
  transition: box-shadow 0.3s ease, background 0.3s ease;
}
.site-header.header-scrolled {
  box-shadow: 0 4px 24px rgba(254,140,227,0.13), 0 2px 8px rgba(0,0,0,0.07);
}
body.dark-mode .site-header.header-scrolled {
  box-shadow: 0 4px 24px rgba(254,140,227,0.18), 0 2px 8px rgba(0,0,0,0.22);
}

/* ── Nav link underline slide ── */
.nav-link {
  position: relative;
}
.nav-link::after {
  content: '';
  position: absolute;
  left: 0; bottom: -3px;
  width: 0; height: 2px;
  background: #fe8ce3;
  border-radius: 2px;
  transition: width 0.22s cubic-bezier(0.16,1,0.3,1);
}
.nav-link:hover::after {
  width: 100%;
}

/* ── Commencer button shimmer ── */
.btn-commencer,
.mobile-commencer {
  position: relative;
  overflow: hidden;
}
.btn-commencer::before,
.mobile-commencer::before {
  content: '';
  position: absolute;
  top: 0; left: -75%;
  width: 50%; height: 100%;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.35) 50%, transparent 100%);
  transform: skewX(-20deg);
  transition: left 0s;
  pointer-events: none;
}
.btn-commencer:hover::before,
.mobile-commencer:hover::before {
  left: 125%;
  transition: left 0.45s cubic-bezier(0.16,1,0.3,1);
}

/* ── Button press scale ── */
button:active,
.btn:active,
.btn-commencer:active,
.mobile-commencer:active,
.mobile-link:active {
  transform: scale(0.96);
  transition: transform 0.08s ease;
}

/* ── Ripple ── */
.ripple-host {
  position: relative;
  overflow: hidden;
}
.ripple-wave {
  position: absolute;
  border-radius: 50%;
  background: rgba(254,140,227,0.35);
  transform: scale(0);
  animation: ripple-expand 0.5s cubic-bezier(0.16,1,0.3,1) forwards;
  pointer-events: none;
}
@keyframes ripple-expand {
  to { transform: scale(4); opacity: 0; }
}

/* ── Card hover lift ── */
.commu-card,
.carrier-card,
.tarifs-card,
.card {
  transition: transform 0.25s cubic-bezier(0.16,1,0.3,1), box-shadow 0.25s cubic-bezier(0.16,1,0.3,1);
}
.commu-card:hover,
.carrier-card:hover,
.tarifs-card:hover {
  transform: translateY(-5px) scale(1.015);
  box-shadow: 0 12px 36px rgba(254,140,227,0.18), 0 4px 16px rgba(0,0,0,0.08);
}

/* ── Mobile menu item stagger ── */
.mobile-menu .mobile-link,
.mobile-menu .mobile-commencer {
  opacity: 0;
  transform: translateX(-12px);
  transition: opacity 0.22s ease, transform 0.22s cubic-bezier(0.16,1,0.3,1);
}
.mobile-menu.open .mobile-link:nth-child(1),
.mobile-menu.open .mobile-commencer:nth-child(1) { opacity: 1; transform: none; transition-delay: 0.04s; }
.mobile-menu.open .mobile-link:nth-child(2),
.mobile-menu.open .mobile-commencer:nth-child(2) { opacity: 1; transform: none; transition-delay: 0.08s; }
.mobile-menu.open .mobile-link:nth-child(3),
.mobile-menu.open .mobile-commencer:nth-child(3) { opacity: 1; transform: none; transition-delay: 0.12s; }
.mobile-menu.open .mobile-link:nth-child(4),
.mobile-menu.open .mobile-commencer:nth-child(4) { opacity: 1; transform: none; transition-delay: 0.16s; }

/* ── Brand glow on hover ── */
.brand:hover .brand-pink {
  text-shadow: 0 0 18px rgba(254,140,227,0.6);
  transition: text-shadow 0.3s ease;
}
.brand-pink {
  transition: text-shadow 0.3s ease;
}

/* ── Burger button hover ── */
.btn-burger {
  transition: transform 0.18s cubic-bezier(0.16,1,0.3,1), background 0.18s ease;
}
.btn-burger:hover {
  transform: scale(1.12);
  background: rgba(254,140,227,0.1);
}
.btn-burger:active {
  transform: scale(0.94);
}

/* ── Focus ring (accessibility) ── */
:focus-visible {
  outline: 2px solid #fe8ce3;
  outline-offset: 3px;
  border-radius: 4px;
}