/* Nettoyage complet */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'Segoe UI', sans-serif;
    background-color: #e8f5e9; /* Vert nature très léger */
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Header qui occupe toute la largeur et espace les éléments */
.header-main {
    width: 100%;
    max-width: 800px;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Centrage du contenu principal */
.content-wrapper {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 20px;
}

.contact-card {
    background: white;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    text-align: center;
    max-width: 500px;
    width: 100%;
}

/* Styles des boutons et suggestions */
.home-btn { text-decoration: none; color: #2d5a27; font-weight: bold; border: 2px solid #2d5a27; padding: 8px 15px; border-radius: 20px; }
.lang-btn { cursor: pointer; padding: 8px 15px; border: 1px solid #2d5a27; background: white; color: #2d5a27; border-radius: 5px; font-weight: bold; }

.suggestion-box { background: #f9f9f9; padding: 20px; border-radius: 10px; margin: 25px 0; border-left: 5px solid #2d5a27; }

/* Les 4 boutons dégradés centrés */
.social-links { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 20px; }
.btn-grad { color: white; padding: 15px; border-radius: 10px; text-decoration: none; font-weight: bold; transition: 0.3s; }
.btn-grad:hover { transform: translateY(-3px); box-shadow: 0 5px 10px rgba(0,0,0,0.2); }

.btn-1 { background: linear-gradient(135deg, #2d5a27, #4e8c46); }
.btn-2 { background: linear-gradient(135deg, #1e3d1a, #3a6d34); }
.btn-3 { background: linear-gradient(135deg, #4caf50, #81c784); }
.btn-4 { background: linear-gradient(135deg, #004d40, #00796b); }