:root {
  --bg: #121212;
  --muted: #bdbdbd;
  --accent: #ff7a18;
  --container-f: 1200px;
}

footer {
  background-color: var(--bg);
}

.ft-scope .footer {
  padding: 48px 20px;
  color: var(--muted);
  max-width: var(--containerf);
  margin: 0 auto;
}

.ft-scope .top1 {
  display: grid;
  grid-template-columns: repeat(3, 1fr) 320px;
  gap: 32px;
}

.ft-scope .mc h4 {
  color: #fff;
  margin: 0 0 16px;
  font-size: 15px;
  margin-top:6px
}

.ft-scope .mc ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ft-scope .mc li {
  margin: 8px 0;
  color: var(--muted);
}

.ft-scope .mc li a {
  margin: 8px 0;
  color: var(--muted);
  font-size: 14px;
}

.ft-scope .right-pane {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ft-scope .promo {
  background: linear-gradient(90deg, #262626, #1b1b1b);
  border-radius: 8px;
  padding: 12px;
  display: flex;
  gap: 12px;
  align-items: center;
}

app-links{margin-top:10px;}

.ft-scope .promo img {
  width: 64px;
  height: 64px;
  border-radius: 6px;
  object-fit: cover;
}

.instagram {
  background-color: #dd27bd;
  padding: 10px;
  color: #fff;
  border-radius: 50%;
}

.facebook {
  background-color: #1877f2;
  padding: 10px;
  color: #fff;
  border-radius: 50%;
}

.whatsapp {
  background-color: #25d366;
  padding: 10px;
  color: #fff;
  border-radius: 50%;
}

.youtube {
  background-color: #ff0000;
  padding: 10px;
  color: #fff;
  border-radius: 50%;
}

.tiktok {
  background-color: #010101;
  padding: 10px;
  color: #fff;
  border-radius: 50%;
}

.ft-scope .promo {
  background-image: url("./imgs/baniereBs.png");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  height: 100px;
  width: 250px;
}

.ft-scope .promo .ft-scope .cta {
  display: flex;
  flex-direction: column;
}

.ft-scope .promo .ft-scope .cta button {
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 8px 12px;
  border-radius: 6px;
  cursor: pointer;
}

.ft-scope .app-links {
  display: flex;
  gap: 12px;
  align-items: center;
}

.ft-scope .app-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: transparent;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
}

.ft-scope .app-btn svg {
  width: 22px;
  height: 22px;
}

.ft-scope .factures {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  font-size: 13px;
  margin-top: 8px;
}

.ft-scope .socials {
  display: flex;
  margin-top: 10px;
  gap: 10px;
  align-items: center;
}

.ft-scope .socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.ft-scope .bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  padding-top: 20px;
  margin-top: 30px;
}

.ft-scope .certs {
  display: flex;
  gap: 10px;
  align-items: center;
}

.ft-scope .certs img {
  height: 24px;
  display: block;
}
.payments .text-mc{
	color:var(--muted);
	font-size:13px;
	margin-right:8px;
}
.certs .cert{
	font-size:13px;
	color:var(--muted);
	margin-right:10px;
}
.ft-scope 
.ft-scope .payments {
  display: flex;
  gap: 8px;
  align-items: center;
}

.ft-scope .payment {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  font-size: 12px;
}
@media (max-width: 900px) {
  .ft-scope .top1 {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

  .ft-scope .right-pane {
    grid-column: 1 / -1; /* Prend toute la largeur */
    order: 3;
    margin-top: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
   .fa-apple
 {	font-size: 30px;
	background: linear-gradient(135deg, #0A84FF,#5AC8FA); 
	padding: 10px; 
	border-radius: 50%;
}
.fa-google-play{
	font-size: 30px;
	background: linear-gradient(135deg, #4285F4,#34A853,#FBBC05,#EA4335); 
	padding: 8px; border-radius: 50%; 
	color: #f9f9f9;}

  .ft-scope .promo {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 560px) {
  .ft-scope .top1 {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .ft-scope .right-pane {
    grid-column: 1 / -1;
    order: 0;
    margin-top: 0;
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .ft-scope .bottom {
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    text-align: left;
  }

  .ft-scope .certs,
  .ft-scope .payments {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
  }

  .ft-scope .app-links {
    flex-direction: column;
    align-items: flex-start;
  }

  .ft-scope .factures {
    grid-template-columns: 1fr;
  }

  .ft-scope .promo {
    height: 80px;
    width: 100%;
    background-size: cover;
  }
}/* ==========================
   FOOTER MOBILE SIMPLIFIÉ
========================== */
@media (max-width: 768px) {

  /* 1️⃣ Tout cacher */
  .footer * {
    display: none !important;
  }

  /* 2️⃣ Réafficher le footer lui-même */
  .footer {
    display: block !important;
    text-align: center;
    padding: 25px 15px;
  }

  /* 3️⃣ Réafficher les liens précis */
  .footer a[href*="service_client_mc"],
  .footer a[href*="cont"],
  .footer a[href*="vendeur_mc"],
  .footer a[href*="LIVREUR1"],
  .footer a[href*="livreur"] {
    display: block !important;
    font-size: 15px;
    margin: 10px 0;
    color: #fff;
  }

  /* 4️⃣ Réafficher les titres nécessaires */
  .footer h4 {
    display: block !important;
    margin-top: 20px;
    font-size: 16px;
  }

  /* 5️⃣ Réafficher la zone réseaux sociaux */
  .footer .socials,
  .footer .socials a,
  .footer .socials i {
    display: inline-flex !important;
  }

  .footer .socials {
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
  }

  /* 6️⃣ Icônes réseaux */
  .footer .socials i {
    font-size: 22px;
  }
}


  .footer .socials {
    justify-content: center;
    margin-top: 10px;
  }

  /* 7️⃣ Style mobile */
  .footer h4 {
    font-size: 15px;
    margin-bottom: 10px;
  }

  .footer a {
    font-size: 14px;
  }
}