/* --- Styles des boutons CTA --- */
.cta-container{
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important; /* Passé à 4 colonnes */
  gap: 10px !important;
  margin-bottom: 28px !important;
}

@media(max-width: 1100px){
  .cta-container{
    grid-template-columns: repeat(2, 1fr) !important; /* Sur tablette : 2x2 */
  }
}

@media(max-width: 700px){
  .cta-container{
    grid-template-columns: 1fr !important; /* Sur mobile : 1 seule colonne */
  }
}

.cta-fabriq{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  background: linear-gradient(135deg, var(--red) 0%, #9a0000 100%) !important;
  padding: 8px 16px !important;      
  border-radius: 999px !important; 
  text-decoration: none !important;
  color: #fff !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 8px 20px var(--red-glow) !important;
  transition: .3s !important;
}

.cta-left{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.cta-icon{
  width: 36px !important;           
  height: 36px !important;          
  border-radius: 50% !important;
  background: rgba(255,255,255,.18) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 1.15rem !important;    
  flex-shrink: 0 !important;
}

.cta-title{
  font-weight: 800 !important;
  font-size: 1.1rem !important;    
  letter-spacing: -.01em !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Badge avec animation de clignotement */
.cta-badge{
  background: #fff !important;
  color: var(--red) !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  font-size: 0.65rem !important;   
  font-weight: 900 !important;
  animation: clignoteNouveau 1.2s infinite ease-in-out !important;
}

@keyframes clignoteNouveau {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.3; transform: scale(0.95); }
}

.cta-arrow{
  width: 32px !important;           
  height: 32px !important;          
  border-radius: 50% !important;
  background: #fff !important;
  color: var(--red) !important;
  display: grid !important;
  place-items: center !important;
  flex-shrink: 0 !important;
  font-size: .9rem !important;      
}