/*.things {
  
}*/

.things ul {
  list-style-type: none;
  padding-left: 0;
}

.things li {
  display: flex;
  flex-direction: row;
  align-items: flex-start; /* <— forces top alignment */
  position: relative;

  gap: clamp(0.324rem, 0.21px + 1.25vw, 1.25rem); /*PROPORTIONS: m-sm */
  margin: clamp(0.524rem, 0.38px + 2.002vw, 2rem); /*PROPORTIONS: m-sm */
  padding: clamp(0.2rem, 0.22px + 0.744vw, 0.75rem); /*PROPORTIONS: p-xs */
  background-color: var(--_colours---grey-vv-light);
}

.things li::after {
  content: '';
  position: absolute;
  bottom: calc(-1 * clamp(0.524rem, 0.38px + 2.002vw, 2rem) / 2);
  left: 0;
  right: 0;
  height: 1px;
  border-bottom: 1px dashed var(--_colours---grey-dark);
}


.things li:last-child {
  border-bottom: none;
}

.things img {
  max-width: clamp(6rem, 30%, 12rem); /* ideally 12rem, but never more than 30% of container width */
  height: auto;
  display: block;
}

.header-container { /* p-sm m-md */
  padding: clamp(0.324rem, 0.21px + 1.253vw, 1.25rem);    /* 4.21px → 16.25px */
  margin: clamp(0.524rem, 0.38px + 2.002vw, 2rem);       /* 6.81px → 26px */
  margin-bottom: 0;
}

@media (max-width: 480px) {
  .things li {
    flex-direction: column;
    align-items: center; /* <— centers items in column layout */
  }

  .things img {
    order: -1; /* move image above text */
    max-width: clamp(6rem, 100%, 24rem); /* scale with container but never smaller than 6rem or larger than 24rem */
    height: auto;
  }
}


