.ftr.v5 {

  /* -- 4-column grid layout ----------------- */

  .ftr-v5-cols {
    display: grid;
    gap: var(--grd-sp-dyn);
    grid-template-columns: 1fr;

    @media screen and (min-width: 700px) {
      grid-template-columns: 1fr 1fr;
    }

    @media screen and (min-width: 1280px) {
      grid-template-columns: 1.4fr 2fr 1fr;
      align-items: start;
    }
  }

  /* -- Col 1 info block --------------------- */

  .ftr-ttl {
    font-family: var(--fnt-t-2-ff);
    font-size: var(--fnt-t-2-s);
    letter-spacing: 0.02em;
    line-height: var(--fnt-t-2-lh);
    font-weight: 700;
    text-transform: uppercase;
    color: var(--fnt-t-2);
    text-wrap: balance;

    @media screen and (min-width: 1280px) {
      font-size: var(--fnt-t-2-s-d);
    }
  }

  .fnt_t-6.alt {
    --fnt-t-6-tt: uppercase;
    --fnt-t-6-ls: 0.1em;

    @media screen and (min-width: 1280px) {
      --fnt-t-6-s: 0.78rem;
    }
  }

  .fnt_t-6.sm {
    @media screen and (min-width: 1280px) {
      --fnt-t-6-s: 0.78rem;
    }
  }

  /* -- Nav lists in cols 2 & 3 -------------- */


  /* -- Phone value — brand accent color ----- */

  .ftr-phn a {
    color: var(--buttons);
    font-size: 1.2rem;

    @media screen and (min-width: 1280px) {
      font-size: 1.35rem;
    }
  }

  /* -- CTA banner --------------------------- */

  .cta-bnr {
    .fnt_t-2 {
      font-size: 1.2rem;

      @media screen and (min-width: 1280px) {
        font-size: 1.5rem;
      }
    }
  }

  /* -- Social icon circles ------------------ */

  .so-lk {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid hsl(from var(--bdr-clr) h s l / var(--bdr-clr-o));

    svg {
      font-size: 1rem;
    }
  }

  @media screen and (min-width:700px) {
    & {
      .ftr-nv-lst {
        --itm-val: 50;
        --itm-w: calc( var(--itm-val) * 1% - ( var(--grd-sp-dyn) * ( (100 - var(--itm-val)) * .01 ) ) );
        --itm-grw: 1;
      }
    }
  }

}