@layer component {
  .popin-place {
    display: grid;
    padding-block-end: var(--spacing-80);
    gap: var(--spacing-xl);
    .popin-place__galery {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--spacing-s);
    }
    .popin-place__content {
      display: grid;
      gap: var(--spacing-s);
      .content-infos {
        color: var(--Grey-A-700);
        .type-score {
          display: flex;
          align-items: center;
          gap: var(--spacing-xs);
        }
      }
    }
    .popin-place__strong-point {
      display: grid;
      gap: var(--spacing-s);
      .container-strong-point {
        display: grid;
        gap: var(--spacing-l);

        .strong-point {
          display: grid;
          grid-template: auto / auto 1fr;
          gap: var(--spacing-s);

          .strong-point__picto {
            display: grid;
            width: var(--48);
            height: var(--48);
            background: var(--Beige-A-100);
            border-radius: var(--Border-Radius-XS);
            img {
              justify-self: center;
              align-self: center;
              width: var(--24);
              height: var(--24);
            }
          }
          .strong-point__description {
            align-self: center;
          }
        }
      }
    }
  }
}
@layer variants {
  .place-galery__image.v-first {
    grid-column: 1/-1;
    img {
      aspect-ratio: 390/164;
      object-fit: cover;
    }
  }
}
