/* prise-en-charge.css — gabarit commun aux 5 pages de soins + mentions
   légales (même structure, même feuille de style). Le bandeau réduit/gris
   du haut (nouveaufondheader.png) est géré par les règles communes
   .hero-bg / .hero-bg.reduit de css/style.css — ce fichier ne concerne que
   le contenu sous le bandeau. */

.section-soin {
  max-width: 1320px;
  margin: 0 auto;
  padding: 56px 24px 72px;
}

/* En-tête : icône dent (96×96px) + titre + sous-titre */
.soin-entete {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 40px;
}

.icone-soin {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  box-shadow: var(--ombre-douce);
  flex-shrink: 0;
}

.soin-entete-texte h1 {
  margin-bottom: 12px;
}

.soin-sous-titre {
  font-size: 1.15rem;
  color: var(--bleu-fonce);
  font-weight: 700;
  line-height: 1.6;
}

/* Corps : texte à gauche, grande image à droite */
.soin-corps {
  display: grid;
  grid-template-columns: 1fr 580px;
  gap: 48px;
  align-items: start;
}

/* Variante utilisée par les pages sans grande image (ex. mentions légales) */
.soin-corps--pleine-largeur {
  grid-template-columns: 1fr;
}

.soin-texte p {
  margin-bottom: 18px;
  font-size: 1.05rem;
  line-height: 1.7;
}

.soin-texte p:last-child {
  margin-bottom: 0;
}

/* Sous-titres internes au texte (ex. sections des mentions légales) */
.soin-texte h2 {
  margin-top: 32px;
  margin-bottom: 12px;
}

.soin-texte h2:first-child {
  margin-top: 0;
}

.soin-image .placeholder-photo {
  min-height: 340px;
}

.soin-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-l);
  box-shadow: var(--ombre-douce);
  display: block;
}

@media (max-width: 1024px) {
  .soin-corps {
    grid-template-columns: 1fr;
  }

  .soin-image {
    order: 2;
  }
}

@media (max-width: 640px) {
  .section-soin {
    padding: 40px 20px 56px;
  }

  .soin-entete {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .icone-soin {
    width: 72px;
    height: 72px;
  }

  .soin-entete-texte h1 {
    font-size: 1.6rem;
  }

  .soin-sous-titre {
    font-size: 1rem;
  }
}