@use "hugo:vars" as v;

.full-section {
  padding: 48px 95px;
  display: flex;
  justify-content: center;

  &>div {
    flex: 0 0 100%;
    box-sizing: border-box;
    max-width: v.$max_content_width;
  }
}

.full-section__content {
  font-family: "Assistant";
  font-size: 17px;
  font-weight: 400;
  color: v.$color_panel_text;
  background: v.$color_panel_background;
  padding: 34px;

  &>h2 {
    text-align: center;
    margin-top: 0;
  }

  ul li {
    float: left;
    flex: 0 0 33%;

    @media (max-width: v.$bp_mobile) {
      flex: 0 0 100%;
    }

    color: v.$color_secondary;
    font-size: 1rem;
    margin-bottom: 16px;

    .li__icon {
      width: 20.75px;
      height: 20.75px;
      position: relative;
      top: 4px;
      margin-right: 2px;
      padding: 4px;
      border-radius: 50%;
      background-color: rgba(v.$color_secondary, 0.1);
      box-sizing: border-box;
    }
  }

  ul {
    display: flex;
    flex-direction: row;
    list-style-type: none;
    flex-wrap: wrap;
  }
}