/* 
font-family: "dharma-gothic-e", sans-serif;
font-weight: 400;
font-style: normal;

font-family: "dharma-gothic-e", sans-serif;
font-weight: 400;
font-style: italic;

font-family: "dharma-gothic-e", sans-serif;
font-weight: 700;
font-style: normal;

font-family: "dharma-gothic-e", sans-serif;
font-weight: 700;
font-style: italic;

font-family: "dharma-gothic-e", sans-serif;
font-weight: 800;
font-style: normal;

font-family: "dharma-gothic-e", sans-serif;
font-weight: 800;
font-style: italic;
*/

/* 
font-family: "poppins", sans-serif;
font-weight: 700;
font-style: normal;

font-family: "poppins", sans-serif;
font-weight: 700;
font-style: italic;
 */

/* Reset minimal */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #0A2621;
  font-family: sans-serif;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-height: 100vh;
}

/* Conteneur principal */
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 32px;
}

/* GIF */
.profile-gif {
  width: 200px;
  height: 200px;
  object-fit: cover;
  margin-bottom: 32px;
}

/* Bloc contenant les liens */
.links-box {
  width: 362px;
  padding: 48px;
  border-radius: 71px;
  background: linear-gradient(to bottom left, rgba(11, 64, 54, 1) 0%, rgba(11, 64, 54, 0) 100%);
  box-shadow: -4px 4px 20px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.intro-text {
  text-align: center;
  font-family: "dharma-gothic-e", sans-serif;
  font-weight: 700;
  font-style: italic;
  color: #14DE6F;
  font-size: 28px;}

.intro-text .flash-info {
  color: #FFFFFF;
}

/* Boutons de lien */
.link-item {
  width: 276px;
  height: 58px;
  border-radius: 29px;
  background: #0B4036;
  /* Drop shadow au lieu de inner shadow */
  box-shadow: 0px 0px 10px #0A2621;
  font-family: "poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #FFFFFF;
  font-size: 16px;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}

.link-item:hover {
  transform: scale(1.05);
  box-shadow: 0px 0px 10px rgba(20, 222, 111, 1);
}

/* Version desktop */
@media screen and (min-width: 1024px) {
  .container {
    flex-direction: row;         /* Passe en ligne */
    align-items: center;         /* Centre verticalement */
    justify-content: center;     /* Centre horizontalement */
    gap: 64px;                   /* Espace entre GIF et liens */
    padding-top: 0;
    min-height: 100vh;
  }

  .profile-gif {
    margin-bottom: 0;            /* Plus d'espace en bas */
    width: 400px;
    height: 400px;
  }
}