#main.activities {
  grid-template-rows: auto 120px auto;
  grid-template-columns: 1fr;
  grid-template-areas:
    "activity-grid"
    "terre-di-siena"
    "useful-links";
  grid-gap: 2vw;

  & #activity-grid {
    width:80vw;
    margin:2vw auto 0;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:1vw;

    & .activity-link {
      display:block;
      min-width:0;
      color:inherit;
      text-decoration:none;
    }

    & article {
      box-sizing:border-box;
      width:100%;

      & .activity-image {
        width:100%;
        aspect-ratio:1;
        background-size:cover;
        background-repeat:no-repeat;
        background-position:center;
      }

      & .activity-caption {
        box-sizing:border-box;
        width:100%;
        min-height:4vw;
        margin:0;
        padding:.5vw;
        display:flex;
        align-items:center;
        justify-content:center;
        background:#627141;
        color:white;
        text-align:center;
        font-size:clamp(13px, 1.1vw, 16px);
      }
    }
  }

  & #terre-di-siena {
    display: flex;
    justify-content: center;
    align-items: center;

    & a:any-link {
      border: 1px solid #4b4b4d;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 250px;
      height: 100px;
    }

    & a:is(:hover, :active) {
      border: 2px solid #d8b141;
    }
  }

  & #useful-links {
    position: relative;

    & #links {
      column-count: 2;
      width: 80vw;
      margin: 0 auto 2vw;
      padding: 2vw;
      padding-top: 6vw;
      background: linear-gradient(0deg, #93a28ad4, #93a28ad4), url(/assets/flowers_bg-d410438c3c9c10319082bd11d64df52762931e90fceb1ab4f6bda2eea1f81dc7.jpg) no-repeat;
      background-size: cover;
      box-sizing: border-box;

      & a:any-link {
        text-decoration: none;
        color: white;
        display: block;
        height: 2vw;
        font-size: 18px;
      }

      & a:is(:hover, :active) {
        color: black;
      }
    }

    & h1 {
      text-align: center;
      position: absolute;
      background: #d8b141;
      color: white;
      width: 100%;
      font-variant: petite-caps;
      font-family: "Bodoni Book", serif;
      height: 4vw;
      line-height: 4vw;
      font-size: 2vw;
    }
  }
}

@media screen and (min-width: 1025px) and (max-width: 1450px) {
  #main.activities {
    & #useful-links h1 {
      width: 80vw;
      left: 50%;
      transform: translateX(-50%);
    }
  }
}

@media screen and (max-width: 1024px) {
  #main.activities {
    & #activity-grid {
      width:80vw;
      margin-top:4vw;
      display:grid;
      grid-template-columns:1fr;
      gap:1vw;

      & article {
        width:100%;

        & .activity-caption {
          min-height:12vw;
          padding:2vw;
          font-size:clamp(13px, 3.5vw, 16px);
        }
      }
    }

    & #useful-links {
      & h1 {
        height: 6vw;
        line-height: 6vw;
        font-size: 4vw;
      }

      & #links {
        column-count: 1;
        width: 96vw;
        padding-top: 10vw;
        text-align: center;

        & a:any-link {
          height: 8vw;
          font-size: 3.75vw;
        }
      }
    }
  }
}