/* Florska V2 — hub Services (page-services.php). Maquette Services. */

.hub-intro { padding-top: clamp(56px, 7vw, 104px); padding-bottom: clamp(48px, 6vw, 80px); }
.hub-lead { margin-top: 28px; }
.hub-discs { padding-bottom: clamp(56px, 7vw, 104px); }
.hub-discs > .disc:last-child { border-bottom: 1px solid var(--fl-line); }

/* Une discipline : image verticale à gauche ou à droite, horizontale pour l'institutionnel */
.disc { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(16px, 2.2vw, 32px); padding: 56px 0; border-top: 1px solid var(--fl-line); align-items: center; }
.disc-media { overflow: hidden; background: var(--fl-surface); }
.disc-media > img, .disc-media > .ph { width: 100%; }
.disc-body { grid-row: 1; }
.disc--vl .disc-media { grid-column: 1 / span 4; grid-row: 1; }
.disc--vl .disc-body { grid-column: 6 / span 7; }
.disc--vr .disc-media { grid-column: 9 / span 4; grid-row: 1; }
.disc--vr .disc-body { grid-column: 1 / span 7; }
.disc--hr .disc-media { grid-column: 6 / span 7; grid-row: 1; }
.disc--hr .disc-body { grid-column: 1 / span 5; }
.disc-name { font-size: clamp(28px, 4.4vw, 68px); margin: 8px 0 16px; }

.lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 24px 0; }
.lists__t { margin: 0 0 8px; font-weight: 400; }
.lists ul { margin: 0; padding: 0; list-style: none; }
.lists li { padding: 8px 0; border-top: 1px solid var(--fl-line-soft); color: var(--fl-text-2); font-size: 16px; line-height: 1.45; }

/* Déroulé commun */
.hub-process-t { margin-bottom: 16px; }
.hub-process-lead { margin-bottom: 48px; }
.hub-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.hub-step { border-top: 2px solid var(--fl-accent); padding-top: 20px; }
.hub-step > p.mono { margin: 0 0 12px; }
.hub-step .h3 { margin-bottom: 12px; }
.hub-step__p { margin: 0; color: var(--fl-text-2); font-size: 16px; }

/* Fin de page */
.hub-end { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 32px; }
.hub-end__t { max-width: 18ch; }
.hub-end__p { margin: 20px 0 12px; }

@media (max-width: 900px) {
  .disc { display: block; }
  .disc-media { margin-bottom: 24px; max-width: 480px; }
  .disc--hr .disc-media { max-width: none; }
  .lists { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 601px) and (max-width: 900px) {
  .hub-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .hub-steps { grid-template-columns: minmax(0, 1fr); }
}

/* 320 px : le mot le plus long tient dans la colonne */
@media (max-width: 379px) { .disc-name { font-size: 24px; } }