.line {
  width: 100%;
  height: 3px;
  background-color: #921235;
}

/* France en vecteurs */
.france-vector {
  display: block;
  aspect-ratio: 903 / 1044;
  width: 100%;
  height: auto;
  max-width: 650px;
  margin: 0 auto;
}

.city-marker {
  cursor: pointer;
}

.city-marker:focus { outline: none; }
.city-marker:focus-visible {
  outline: 2px solid #921235;
  outline-offset: 3px;
}

.line.full-bleed {
  margin-left: -1.5rem;
  margin-right: -1.5rem;
  width: calc(100% + 3rem);
}

/* Partie Nos valeurs */
.valeurs-content {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: auto;
}

.valeur-card.encadrement { grid-area: 1 / 1 / 2 / 3; }
.valeur-card.peda { grid-area: 1 / 3 / 2 / 5; }
.valeur-card.effort { grid-area: 1 / 5 / 2 / 7; }
.valeur-card.innov { grid-area: 2 / 1 / 3 / 4; }
.valeur-card.dialogue { grid-area: 2 / 4 / 3 / 7; }

.valeur-card {
  display: flex;
  flex-direction: column;
  gap: 7px;
  border-radius: 26px;
  box-shadow: 0px 10px 40px 0px rgba(196, 30, 58, 0.08);
}

.valeur-card .body-1 {
  font-weight: bolder;
  margin-bottom: 0 !important;
}

.valeur-icon {
  background: linear-gradient(135.84deg, #921235 7.13%, #F6CFDA 96.13%);
  width: 75px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}

.valeur-icon svg {
  width: 32px;
  height: 32px;
  color: white;
}

/* Partie Nos objectifs */
.objectifs-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: auto;
}

.objectif-card.histoire { grid-area: 1 / 1 / 2 / 3; }
.objectif-card.edtech { grid-area: 2 / 1 / 3 / 2; }
.objectif-card.reseau { grid-area: 2 / 2 / 3 / 3; }

/* Partie découvez nos formations */
.formation-img {
  aspect-ratio: 1376 / 724;
  overflow: hidden;
  object-fit: cover;
  object-position: center;
  opacity: 0.7;
}

.card-primary.formation {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  text-align: center;
  width: 80%;
  max-width: 600px;
}

/* Responsive - 992px */
@media screen and (max-width: 992px) {
  .valeur-card.encadrement { grid-area: auto / span 3; }
  .valeur-card.peda        { grid-area: auto / span 3; }
  .valeur-card.effort      { grid-area: auto / span 6; }
  .valeur-card.innov       { grid-area: auto / span 3; }
  .valeur-card.dialogue    { grid-area: auto / span 3; }
}

/* Responsive - 768px */
@media screen and (max-width: 768px) {
  /* valeurs */
  .valeur-card {
    border: 1px solid rgb(var(--bs-primary-rgb), 0.25);
  }
  .valeur-card.encadrement { grid-area: auto / span 6; }
  .valeur-card.peda        { grid-area: auto / span 6; }
  .valeur-card.effort      { grid-area: auto / span 6; }
  .valeur-card.innov       { grid-area: auto / span 6; }
  .valeur-card.dialogue    { grid-area: auto / span 6; }

  /* objectifs */
  .objectif-card.histoire { grid-area: auto / span 2; }
  .objectif-card.edtech { grid-area: auto / span 2; }
  .objectif-card.reseau { grid-area: auto / span 2; }

  /* découvrez nos formations */
  .formation-img {
    aspect-ratio: 344 / 446;
  }
}

/* Responsive - 576px */
@media screen and (max-width: 576px) {
  /* Global */
  h4 { font-size: 23px !important; }
  p.body-1 { font-size: 16px !important; }

  /* france en vecteurs */
  .france-vector {
    width: 155%;
    max-width: 155%;
    float: right;
  }

  /* valeurs */
  .valeur-icon {
    width: 63px;
    height: 50px;
  }
  .valeur-icon svg {
    width: 28px;
    height: 28px;
    color: white;
  }
}