/* Style de base pour tous les boutons */
.btn, .btncont, .btnfb, .btninst, .btnyout, .btnsite {
    display: inline-block;
    padding: 0.5rem 3rem;
    font-size: 1rem;
    font-weight: 600;
    color: white;
    border-radius: 20px;
    cursor: pointer;
    overflow: hidden;
    transition: all 0.3s ease;
    font-family: "Inter", sans-serif;
    text-align: center;
    margin: 15px;
    text-decoration: none;
    width: 250px;
    border: 2px solid;
}

/* Couleurs spécifiques et styles pour l'état normal (inversé) */
.btn { background-color: #646cff;  }
.btncont { background-color: #2DB200;  }
.btnfb { background-color: #316CB1;  }
.btninst { background-color: #F60683; }
.btnyout { background-color: #F70100;  }
.btnsite { background-color: #722784; }

/* Effets au survol (hover) - inversés */
.btn:hover, .btncont:hover, .btnfb:hover, .btninst:hover, .btnyout:hover, .btnsite:hover {
    background: #ffffff;
    color: #000000;
}

/* Couleurs de bordure spécifiques au survol */
.btn:hover { border-color: #646cff; }
.btncont:hover { border-color: #2DB200; }
.btnfb:hover { border-color: #316CB1; }
.btninst:hover { border-color: #F60683; }
.btnyout:hover { border-color: #F70100; }
.btnsite:hover { border-color: #722784; }

.rwc{
    border-radius: 20px; /* Coins arrondis */
    overflow: hidden; /* Assure que l'image ne déborde pas des coins arrondis */
    width: 800px; /* Largeur fixe de 800px */
    max-width: 100%; /* Assure que l'image est responsive sur les petits écrans */
    height: auto; /* Maintient le ratio d'aspect de l'image */
    display: block; /* Permet le centrage */
    margin-left: auto; /* Centre l'image horizontalement */
    margin-right: auto; /* Centre l'image horizontalement */
}
