/* =========================
   ABOUT - INTRODUCTION
   ========================= */

.about-intro {
  width: 100%;

  display: flex;
  align-items: flex-start;

  gap: 22px;

  margin-bottom: 1.2rem;
}


/* Introduction photo */
.about-photo {
  flex: 0 0 180px;
}

.about-photo img {
  display: block;

  width: 300px;
  height: auto;

  margin: 0;
  padding: 0;

  border: 1px solid #ccc;
  border-radius: 6px;

  box-sizing: border-box;
}


/* Introduction text */
.intro-text {
  flex: 1 1 0;
  min-width: 0;

  margin: 0;
  padding-right: 10px;

  font-size: .80rem;
  line-height: 1.55;
  text-align: justify;

  overflow-wrap: break-word;
}

.intro-text p {
  margin: 0;
}


/* =========================
   SECTIONS
   ========================= */

.section {
  width: 100%;
  max-width: 100%;

  margin: 1rem 0;
}

.section__title {
  margin-bottom: .2rem;
  padding: .2rem 0;

  border-bottom: 1px solid #000;

  font-size: .80rem;
  font-weight: bold;
}


/* =========================
   KEY-VALUE LAYOUT
   ========================= */

.kv {
  width: 100%;

  display: flex;
  flex-direction: column;

  gap: .5rem;
}

.kv__row {
  width: 100%;

  display: flex;
  align-items: flex-start;

  gap: .6rem;

  padding: .1rem 0;
}

.kv__key {
  flex: 0 0 145px;

  display: flex;
  justify-content: space-between;

  font-size: .80rem;
  font-weight: bold;

  white-space: nowrap;
}

.kv__key::after {
  content: ":";
}

.kv__val {
  flex: 1 1 0;
  min-width: 0;

  font-size: .80rem;
  line-height: 1.35;
  text-align: justify;

  overflow-wrap: break-word;
}


/* =========================
   LISTS
   ========================= */

.bullets {
  width: 100%;
  max-width: 100%;

  margin: .4rem 0 0;
  padding-left: 1.2rem;

  font-size: .8rem;
  line-height: 1.4;
}

.bullets li {
  margin-bottom: .2rem;
}