/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 10, but if you do -- maybe just use a custom class  :)  */
#sec-intro {
  padding-top: 80px;
  padding-bottom: 60px; }
  #sec-intro p {
    color: #6D6E71; }
  #sec-intro h2 {
    max-width: 1085px; }
  #sec-intro h5 {
    margin-top: 36px;
    font-weight: 700; }
  #sec-intro .card {
    height: 100%; }
    #sec-intro .card h5 {
      margin-bottom: 16px;
      margin-top: 0; }
    #sec-intro .card p {
      border-bottom: 1px solid #84BD00;
      padding-bottom: 16px; }
  @media screen and (min-width: 1025px) {
    #sec-intro {
      padding-top: 120px;
      padding-bottom: 70px; } }

#companies {
  padding: 80px 0; }
  #companies .content {
    margin-bottom: 64px; }
    #companies .content p {
      color: #BCBEC0; }
  #companies .card {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    background: rgba(32, 32, 32, 0.6);
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.15);
    color: #FFFFFF;
    border-radius: 10px;
    padding: 120px 26px 88px 30px; }
    #companies .card .bg-img {
      border-radius: 10px;
      z-index: 0; }
      #companies .card .bg-img picture,
      #companies .card .bg-img img {
        border-radius: 10px; }
    #companies .card:after {
      content: '';
      position: absolute;
      right: 2rem;
      bottom: 2rem;
      width: 59px;
      height: 53px;
      border-right: 2px solid #FFFFFF;
      border-bottom: 2px solid #FFFFFF; }
    #companies .card h5 {
      margin-bottom: 2rem;
      font-weight: 700;
      position: relative;
      z-index: 2; }
    #companies .card p {
      font-size: 18px;
      color: #FFFFFF;
      position: relative;
      z-index: 2; }
  @media screen and (min-width: 1025px) {
    #companies {
      padding: 120px 0; }
      #companies .card {
        padding: 144px 26px 142px 30px; } }

#interested {
  padding: 80px 0;
  background-color: #F5F5F5; }
  #interested h2 {
    max-width: 1376px; }
  #interested p {
    color: #6D6E71; }
  #interested ul {
    column-count: 3; }
    #interested ul li {
      color: #5C5C5C;
      font-weight: 500; }
  #interested a {
    color: #212121; }
    #interested a:hover {
      color: #FFFFFF; }
  @media screen and (max-width: 1025px) {
    #interested ul {
      column-count: 2; } }
  @media screen and (max-width: 641px) {
    #interested ul {
      column-count: 1; } }
  @media screen and (min-width: 1025px) {
    #interested {
      padding: 128px 0; }
      #interested .cta-container {
        column-gap: 96px; } }