/* ============================================================
   rs1/careers-cta — clôture de la page Carrière
   Fond, boutons, suréligne : .mp-section--sombre, .mp-btn,
   .mp-eyebrow (assets/css/mp-tokens.css)
   ============================================================ */

.mp-crc{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: var(--mp-section);
}
.mp-crc::after{
  content: "";
  position: absolute;
  z-index: -1;
  top: -35%;
  left: -12%;
  width: 48rem;
  height: 48rem;
  background: var(--mp-voile-turquoise);
  pointer-events: none;
}

.mp-crc__in{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(2.5rem, 5vw, 4.5rem);
  align-items: center;
}

.mp-crc__titre{
  margin: 0;
  font-size: var(--mp-t-h2);
  font-weight: 800;
  color: var(--mp-blanc);
}
.mp-crc__texte{
  margin: 1.1rem 0 0;
  max-width: 54ch;
  font-size: var(--mp-t-lg);
  color: var(--mp-texte-sombre);
}
.mp-crc__actions{
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 2rem;
}

/* Encart contact RH */
.mp-crc__encart{
  min-width: 0;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border: 1px solid var(--mp-trait-sombre);
  border-radius: var(--mp-r);
  background: var(--mp-voile-sombre);
}
.mp-crc__encart-titre{
  margin: 0 0 .6rem;
  font-size: var(--mp-t-h3);
  font-weight: 700;
  color: var(--mp-blanc);
}
.mp-crc__encart-texte{
  margin: 0;
  font-size: var(--mp-t-sm);
  color: var(--mp-texte-sombre);
}

.mp-crc__contact{
  display: grid;
  gap: .85rem;
  margin: 1.5rem 0 0;
  padding: 1.5rem 0 0;
  border-top: 1px solid var(--mp-trait-sombre);
}
.mp-crc__ligne{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .15rem .9rem;
}
.mp-crc__label{
  min-width: 4.75rem;
  font-size: var(--mp-t-xs);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mp-turquoise-pale);
}
.mp-crc__ligne dd{
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}
.mp-crc__ligne a{
  font-size: var(--mp-t-sm);
  font-weight: 600;
  color: var(--mp-blanc);
  text-decoration: none;
  transition: color var(--mp-dur) ease;
}
.mp-crc__ligne a:hover{ color: var(--mp-turquoise-vif) }

@media (min-width: 961px){
  .mp-crc__in{ grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) }
}

@media (prefers-reduced-motion: reduce){
  .mp-crc__ligne a{ transition: none }
}