/* ============================================
   IAF Anchor Points — liste de liens d'ancres Services
   Grille 6 colonnes identique au reste du site.
   Liste positionnée en col 3-6 (comme iaf-listing__items).
   Filets horizontaux pleine largeur de la zone contenu.
   ============================================ */

:root {
  --iaf-anchor-points-padding-block: 80px;
  --iaf-anchor-points-padding-inline: 64px;
  --iaf-anchor-points-max-width: 1440px;
  --iaf-anchor-points-grid-gap: 32px;
  --iaf-anchor-points-item-padding-y: 24px;
  --iaf-anchor-points-line-color: var(--iaf-canvas-border-strong);
  --iaf-anchor-points-arrow-gap: 10px;
}

.iaf-anchor-points {
  width: 100%;
  box-sizing: border-box;
  padding: var(--iaf-anchor-points-padding-block) var(--iaf-anchor-points-padding-inline);
  background-color: transparent;
  display: flex;
  justify-content: center;
}

.iaf-anchor-points__inner {
  width: 100%;
  max-width: calc(var(--iaf-anchor-points-max-width) - (var(--iaf-anchor-points-padding-inline) * 2));
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  column-gap: var(--iaf-anchor-points-grid-gap);
}

/* -------- Titre de section — col 1-2 -------- */

.iaf-anchor-points__title-wrap {
  grid-column: 1 / span 2;
  align-self: start;
}

.iaf-anchor-points__title {
  margin: 0;
  color: var(--iaf-canvas-heading);
  text-wrap: balance;
}

/* -------- Liste — col 3-6 -------- */

.iaf-anchor-points__list {
  grid-column: 3 / span 4;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* -------- Items -------- */

/* Dividers between items only (cf. iaf-slides v1.0.57 — no top on first, no bottom on last). */
.iaf-anchor-points__item:not(:last-child) {
  border-bottom: 1px solid var(--iaf-anchor-points-line-color);
}

/* -------- Lien -------- */

.iaf-anchor-points__link {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: var(--iaf-anchor-points-item-padding-y) 0;
  text-decoration: none;
  color: var(--iaf-canvas-accent);
  transition: color 200ms ease;
}

.iaf-anchor-points__link:hover {
  color: var(--iaf-canvas-heading);
}

.iaf-anchor-points__link:hover .iaf-anchor-points__arrow {
  transform: translateX(5px);
}

/* -------- Picto -------- */

.iaf-anchor-points__picto-wrap {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

/* -------- Groupe label + flèche (inline) -------- */

.iaf-anchor-points__label-group {
  display: inline-flex;
  align-items: center;
  gap: var(--iaf-anchor-points-arrow-gap);
}

/* -------- Label -------- */

.iaf-anchor-points__label {
  /* gt-copy appliqué via la classe HTML */
}

/* -------- Flèche -------- */

.iaf-anchor-points__arrow {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  transition: transform 250ms cubic-bezier(0.25, 0.8, 0.25, 1);
}

.iaf-anchor-points__arrow svg {
  display: block;
  width: 20px;
  height: 10px;
}

/* --- Responsive ≤ 1024px : grille collapse --- */
@media (max-width: 1023px) {
  :root {
    --iaf-anchor-points-padding-block: var(--iaf-layout-padding-block-tablet, 64px);
    --iaf-anchor-points-padding-inline: var(--iaf-layout-padding-inline-tablet, 24px);
  }

  .iaf-anchor-points__title-wrap,
  .iaf-anchor-points__list {
    grid-column: 1 / -1;
  }

  .iaf-anchor-points__title-wrap {
    margin-bottom: 32px;
  }
}

@media (max-width: 768px) {
  :root {
    --iaf-anchor-points-padding-block: 56px;
    --iaf-anchor-points-padding-inline: var(--iaf-layout-padding-inline-phone, 20px);
    --iaf-anchor-points-item-padding-y: 18px;
  }

  .iaf-anchor-points__link {
    gap: 14px;
  }
}