body.sober-home #projets .project-directory__card {
  display: grid;
  grid-template-rows: 1fr auto;
  min-inline-size: 0;
  border: 1px solid #dce3ed;
  border-radius: 14px;
  background: #fff;
}

body.sober-home #projets .project-directory .project-directory__card > a {
  margin: 0;
  /* The previous mobile rail applied its border directly to every link. */
  border: 0 !important;
  background: transparent;
  scroll-snap-align: none;
}

body.sober-home #projets .project-directory .project-directory__study {
  grid-template-columns: 26px minmax(0, 1fr);
  grid-template-rows: auto 1fr auto;
  grid-template-areas: 'mark name' 'mark topic' '. study';
  align-items: start;
  gap: .3rem .65rem;
  padding: .85rem .8rem .75rem;
  border-radius: 13px 13px 0 0;
}

.project-directory__study img {
  margin-block-start: .13rem;
}

body.sober-home #projets .project-directory .project-directory__topic {
  font-size: .875rem;
  line-height: 1.38;
}

.project-directory__study-label {
  grid-area: study;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin-block-start: .45rem;
  color: #214497;
  font-size: .875rem;
  font-weight: 650;
}

body.sober-home #projets .project-directory .project-directory__demo {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: .45rem;
  min-block-size: 44px;
  padding: .55rem .8rem;
  border-radius: 0 0 13px 13px;
  box-shadow: inset 0 1px 0 #e6ebf4;
  color: #43536a;
  font-size: .875rem;
  font-weight: 550;
}

body.sober-home #projets .project-directory .project-directory__card > a:hover {
  background: #f1f5ff;
  color: #214497;
}

body.sober-home #projets .project-directory .project-directory__card > a:focus-visible {
  outline: 2px solid #284fc7;
  outline-offset: -3px;
}

@media (max-width: 800px) {
  body.sober-home #projets .project-directory__card {
    scroll-snap-align: start;
  }

  body.sober-home #projets .project-directory__card:last-child {
    scroll-snap-align: end;
  }
}
