/* Correctif ciblé — page orthopedagogie-comment.html uniquement. */
.ortho-info-page .ortho-step-grid {
  gap: clamp(18px, 2vw, 26px);
}

.ortho-info-page .ortho-step-card {
  min-height: 0;
  padding: clamp(24px, 2.4vw, 34px);
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: clamp(20px, 2vw, 28px);
  align-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 93% 9%, rgba(232,170,32,.10), transparent 8rem),
    #fff;
}

.ortho-info-page .ortho-step-card::before {
  display: none !important;
  content: none !important;
}

.ortho-info-page .ortho-step-icon {
  width: 92px;
  height: 92px;
  display: grid;
  place-items: center;
  align-self: start;
  border-radius: 50%;
  background: #f7f2e9;
  box-shadow: 0 10px 24px rgba(0,47,58,.09);
  overflow: hidden;
}

.ortho-info-page .ortho-step-icon img {
  width: 92px;
  height: 92px;
  display: block;
  object-fit: contain;
}

.ortho-info-page .ortho-step-icon--exchange img {
  width: 86px;
  height: 86px;
}

.ortho-info-page .ortho-step-copy {
  min-width: 0;
}

.ortho-info-page .ortho-step-number {
  display: inline-block;
  margin-bottom: 8px;
  color: #e8aa20;
  font: 900 14px/1 Arial, sans-serif;
  letter-spacing: .12em;
}

.ortho-info-page .ortho-step-card h3 {
  margin: 0 0 10px;
  font-size: clamp(27px, 2.2vw, 36px);
  line-height: 1.08;
}

.ortho-info-page .ortho-step-card p {
  max-width: 44ch;
  font-size: clamp(16px, 1.25vw, 18px);
  line-height: 1.58;
}

@media (max-width: 760px) {
  .ortho-info-page .ortho-step-card {
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 18px;
    padding: 22px;
  }

  .ortho-info-page .ortho-step-icon,
  .ortho-info-page .ortho-step-icon img {
    width: 74px;
    height: 74px;
  }

  .ortho-info-page .ortho-step-icon--exchange img {
    width: 70px;
    height: 70px;
  }
}

@media (max-width: 460px) {
  .ortho-info-page .ortho-step-card {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .ortho-info-page .ortho-step-icon {
    margin-bottom: 2px;
  }
}


/* Harmonisation des pictogrammes de la page Comment ? — v44 */
.ortho-info-page .ortho-step-icon{background:transparent;box-shadow:none;overflow:visible}
.ortho-info-page .ortho-step-icon svg{width:42px;height:42px;display:block;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.ortho-info-page .ortho-step-icon.ortho-icon-badge{width:84px;height:84px;box-shadow:0 10px 24px rgba(0,47,58,.10);overflow:hidden}
.ortho-info-page .ortho-step-icon.ortho-icon-badge.is-teal{background:#0b5a6d;color:#fff}
.ortho-info-page .ortho-step-icon.ortho-icon-badge.is-gold{background:#e3aa1d;color:#fff}
.ortho-info-page .ortho-step-icon .accent{stroke:#f8d57b}
.ortho-info-page .ortho-step-icon .fill-accent{fill:#f8d57b;stroke:none}
@media (max-width:760px){.ortho-info-page .ortho-step-icon.ortho-icon-badge{width:74px;height:74px}.ortho-info-page .ortho-step-icon svg{width:36px;height:36px}}


/* Typographie harmonisée : la page Comment conserve sa structure. */
.ortho-info-hero h1 { font-size: clamp(38px, 4.2vw, 60px) !important; line-height: 1.04 !important; }
.ortho-info-heading h2 { font-size: clamp(30px, 3vw, 44px) !important; line-height: 1.12 !important; }
@media (max-width:680px){
  .ortho-info-hero h1 { font-size: clamp(34px, 10vw, 46px) !important; }
  .ortho-info-heading h2 { font-size: clamp(28px, 8.5vw, 38px) !important; }
}
