body{
  overflow-x: hidden;
}

:root{
  /* layout */
  --footer-pt: 150px;

  --footer-container-pl: 215px;
  --footer-container-pr: 0px;

  --footer-links-pl: 120px;
  --footer-links-pt: 60px;

  --footer-items-gap: 30px;   /* gap между 3 блоками футера */
  --footer-cols-gap: 120px;   /* gap между колонками в footer-links ul */

  /* typography */
  --footer-text: 20px;
  --footer-h3: 24px;
  --footer-h4: 20px;

  /* brand / meta */
  --footer-logo-w: 215px;
  --footer-logo-mt: 50px;

  --footer-meta-mt: 88px;
  --footer-meta-gap: 60px;

  /* lines */
  --footer-glow-h: 60px;
}

/* ===================== */
/* Footer base styles     */
/* ===================== */

.footer{
  padding-top: var(--footer-pt);
  position: relative;
}

/* Верхняя линия + свечение */
.footer-border {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: #6E23BA;
}

.footer-border::before {
  content: "";
  position: absolute;
  bottom: 2px;
  left: 0;
  width: 100%;
  height: var(--footer-glow-h);
  background: linear-gradient(
    to top,
    rgba(110, 35, 186, 0.6),
    rgba(110, 35, 186, 0)
  );
  pointer-events: none;
}

/* Вертикальный разделитель */
.footer-border-v{
  background-color: #6E23BA;
  width: 5px;
  height: 100%;
}

/* Контейнер футера */
.footer-container{
  padding-left: var(--footer-container-pl);
  padding-right: var(--footer-container-pr);
  box-sizing: border-box;
}

.footer-container ul{
  list-style: none;
  display: flex;
  gap: var(--footer-items-gap);
  margin: 0;
  padding: 0;
}

/* Бренд */
.footer-brand img{
  margin-top: var(--footer-logo-mt);
  max-width: var(--footer-logo-w);
  max-height: 46px;
}

.footer-text{
  margin-top: 20px;
  font-family: 'Nunito', sans-serif;
  font-size: var(--footer-text);
}

.footer-meta {
  margin-top: var(--footer-meta-mt);
  margin-bottom: 30px;
  display: flex;
  gap: var(--footer-meta-gap);
  opacity: 0.5;
}

/* Ссылки */
.footer-links{
  padding-left: var(--footer-links-pl);
  padding-top: var(--footer-links-pt);
  padding-right: 10px;
  box-sizing: border-box;
}

.footer-links h3{
  font-family: 'Nunito', sans-serif;
  font-size: var(--footer-h3);
  font-weight: 600;
  margin-bottom: 20px;
}

.footer-links a{
  text-decoration: none;
  color: white;
}

.footer-links a:hover{
  color: #a259ff;
  transition: .1s;
}

.footer-links h4{
  font-family: 'Nunito', sans-serif;
  font-size: var(--footer-h4);
  font-weight: 100;
  margin-top: 15px;
}

/* Колонки ссылок */
.footer-links ul{
  display: flex;
  gap: var(--footer-cols-gap);
  margin: 0;
  padding: 0;
}

/* Соц.иконки — фиксируем 20px на ВСЕХ */
.social-links ul{
  margin-top: 15px;
  display: flex;
  gap: 20px;       /* << фикс */
  padding: 0;
}

.social-links ul img{
  max-width: 23px;
  transition: 0.3s;
}

.social-links ul img:hover{
  transform: scale(1.2);
  transition: 0.3s;
}

/* ========================================================= */
/*  STEP SCALE EVERY 30px (1920 -> 1024)                     */
/*  Меняем ТОЛЬКО переменные                                 */
/* ========================================================= */
/* 1890 */
@media (max-width: 1890px){
  :root{
    --footer-container-pl: 205px;
    --footer-links-pl: 115px;
    --footer-cols-gap: 115px;
    --footer-text: 20px;
    --footer-h3: 24px;
    --footer-h4: 20px;
    --footer-logo-w: 212px;
    --footer-meta-gap: 58px;
  }
}

/* 1860 */
@media (max-width: 1860px){
  :root{
    --footer-container-pl: 200px;
    --footer-links-pl: 112px;
    --footer-cols-gap: 112px;
    --footer-text: 19.9px;
    --footer-h3: 23.9px;
    --footer-h4: 19.9px;
    --footer-logo-w: 211px;
    --footer-meta-gap: 57px;
  }
}

/* 1830 */
@media (max-width: 1830px){
  :root{
    --footer-container-pl: 195px;
    --footer-links-pl: 108px;
    --footer-cols-gap: 108px;
    --footer-text: 19.8px;
    --footer-h3: 23.8px;
    --footer-h4: 19.8px;
    --footer-logo-w: 210px;
    --footer-meta-gap: 56px;
  }
}

/* 1800 */
@media (max-width: 1800px){
  :root{
    --footer-container-pl: 190px;
    --footer-links-pl: 104px;
    --footer-cols-gap: 104px;
    --footer-text: 19.7px;
    --footer-h3: 23.7px;
    --footer-h4: 19.7px;
    --footer-logo-w: 209px;
    --footer-meta-gap: 55px;
  }
}

/* 1770 */
@media (max-width: 1770px){
  :root{
    --footer-container-pl: 185px;
    --footer-links-pl: 100px;
    --footer-cols-gap: 100px;
    --footer-text: 19.6px;
    --footer-h3: 23.6px;
    --footer-h4: 19.6px;
    --footer-logo-w: 208px;
    --footer-meta-gap: 54px;
  }
}

/* 1740 */
@media (max-width: 1740px){
  :root{
    --footer-container-pl: 178px;
    --footer-links-pl: 96px;
    --footer-cols-gap: 96px;
    --footer-text: 19.4px;
    --footer-h3: 23.4px;
    --footer-h4: 19.4px;
    --footer-logo-w: 207px;
    --footer-meta-gap: 52px;
  }
}

/* 1710 */
@media (max-width: 1710px){
  :root{
    --footer-container-pl: 170px;
    --footer-links-pl: 92px;
    --footer-cols-gap: 92px;
    --footer-text: 19.2px;
    --footer-h3: 23.2px;
    --footer-h4: 19.2px;
    --footer-logo-w: 206px;
    --footer-meta-gap: 50px;
  }
}

/* 1680 */
@media (max-width: 1680px){
  :root{
    --footer-container-pl: 162px;
    --footer-links-pl: 90px;
    --footer-cols-gap: 90px;
    --footer-text: 19px;
    --footer-h3: 23px;
    --footer-h4: 19px;
    --footer-logo-w: 204px;
    --footer-meta-gap: 48px;
  }
}

/* 1650 */
@media (max-width: 1650px){
  :root{
    --footer-container-pl: 154px;
    --footer-links-pl: 88px;
    --footer-cols-gap: 88px;
    --footer-text: 18.8px;
    --footer-h3: 22.8px;
    --footer-h4: 18.8px;
    --footer-logo-w: 202px;
    --footer-meta-gap: 46px;
  }
}

/* 1620 */
@media (max-width: 1620px){
  :root{
    --footer-container-pl: 146px;
    --footer-links-pl: 86px;
    --footer-cols-gap: 86px;
    --footer-text: 18.6px;
    --footer-h3: 22.6px;
    --footer-h4: 18.6px;
    --footer-logo-w: 200px;
    --footer-meta-gap: 44px;
  }
}

/* 1590 */
@media (max-width: 1590px){
  :root{
    --footer-container-pl: 140px;
    --footer-links-pl: 84px;
    --footer-cols-gap: 84px;
    --footer-text: 18.4px;
    --footer-h3: 22.4px;
    --footer-h4: 18.4px;
    --footer-logo-w: 198px;
    --footer-meta-gap: 42px;
  }
}

/* 1560 */
@media (max-width: 1560px){
  :root{
    --footer-container-pl: 134px;
    --footer-links-pl: 82px;
    --footer-cols-gap: 82px;
    --footer-text: 18.2px;
    --footer-h3: 22.2px;
    --footer-h4: 18.2px;
    --footer-logo-w: 196px;
    --footer-meta-gap: 40px;
  }
}

/* 1530 */
@media (max-width: 1530px){
  :root{
    --footer-container-pl: 128px;
    --footer-links-pl: 80px;
    --footer-cols-gap: 80px;
    --footer-text: 18px;
    --footer-h3: 22px;
    --footer-h4: 18px;
    --footer-logo-w: 194px;
    --footer-meta-gap: 38px;
  }
}

/* 1500 */
@media (max-width: 1500px){
  :root{
    --footer-container-pl: 124px;
    --footer-links-pl: 80px;
    --footer-cols-gap: 80px;
    --footer-text: 17.8px;
    --footer-h3: 21.8px;
    --footer-h4: 17.8px;
    --footer-logo-w: 192px;
    --footer-meta-gap: 36px;
  }
}

/* 1470 */
@media (max-width: 1470px){
  :root{
    --footer-container-pl: 122px;
    --footer-links-pl: 80px;
    --footer-cols-gap: 80px;
    --footer-text: 17.6px;
    --footer-h3: 21.6px;
    --footer-h4: 17.6px;
    --footer-logo-w: 190px;
    --footer-meta-gap: 34px;
  }
}

/* 1440 */
@media (max-width: 1440px){
  :root{
    --footer-container-pl: 120px; /* ключ: не опускаем до 55 */
    --footer-links-pl: 80px;      /* ключ: держим шире */
    --footer-cols-gap: 80px;      /* ключ: не ужимаем до 40 */
    --footer-text: 17.4px;
    --footer-h3: 21.4px;
    --footer-h4: 17.4px;
    --footer-logo-w: 188px;
    --footer-meta-gap: 32px;
    --footer-meta-mt: 76px;
  }
}

/* 1410 */
@media (max-width: 1410px){
  :root{
    --footer-container-pl: 115px;
    --footer-links-pl: 78px;
    --footer-cols-gap: 76px;

    --footer-text: 17.2px;
    --footer-h3: 21.2px;
    --footer-h4: 17.2px;

    --footer-logo-w: 186px;
    --footer-meta-gap: 30px;
    --footer-meta-mt: 74px;
  }
}

/* 1380 */
@media (max-width: 1380px){
  :root{
    --footer-container-pl: 108px;
    --footer-links-pl: 74px;
    --footer-cols-gap: 72px;

    --footer-text: 17px;
    --footer-h3: 21px;
    --footer-h4: 17px;

    --footer-logo-w: 184px;
    --footer-meta-gap: 28px;
    --footer-meta-mt: 72px;
  }
}

/* 1350 */
@media (max-width: 1350px){
  :root{
    --footer-container-pl: 100px;
    --footer-links-pl: 70px;
    --footer-cols-gap: 66px;

    --footer-text: 16.8px;
    --footer-h3: 20.8px;
    --footer-h4: 16.8px;

    --footer-logo-w: 182px;
    --footer-meta-gap: 26px;
    --footer-meta-mt: 70px;
  }
}

/* 1320 */
@media (max-width: 1320px){
  :root{
    --footer-container-pl: 92px;
    --footer-links-pl: 64px;
    --footer-cols-gap: 60px;

    --footer-text: 16.6px;
    --footer-h3: 20.6px;
    --footer-h4: 16.6px;

    --footer-logo-w: 180px;
    --footer-meta-gap: 24px;
    --footer-meta-mt: 68px;
  }
}

/* 1290 */
@media (max-width: 1290px){
  :root{
    --footer-container-pl: 82px;
    --footer-links-pl: 58px;
    --footer-cols-gap: 52px;

    --footer-text: 16.4px;
    --footer-h3: 20.4px;
    --footer-h4: 16.4px;

    --footer-logo-w: 178px;
    --footer-meta-gap: 22px;
    --footer-meta-mt: 66px;
  }
}

/* 1260 */
@media (max-width: 1260px){
  :root{
    --footer-container-pl: 70px;
    --footer-links-pl: 50px;
    --footer-cols-gap: 44px;

    --footer-text: 16.2px;
    --footer-h3: 20.2px;
    --footer-h4: 16.2px;

    --footer-logo-w: 176px;
    --footer-meta-gap: 20px;
    --footer-meta-mt: 64px;
  }
}

/* 1230 */
@media (max-width: 1230px){
  :root{
    --footer-container-pl: 58px;
    --footer-links-pl: 42px;
    --footer-cols-gap: 36px;

    --footer-text: 16px;
    --footer-h3: 20px;
    --footer-h4: 16px;

    --footer-logo-w: 174px;
    --footer-meta-gap: 20px;
    --footer-meta-mt: 60px;
  }
}

/* 1200 */
@media (max-width: 1200px){
  :root{
    --footer-container-pl: 46px;
    --footer-links-pl: 34px;
    --footer-cols-gap: 30px;

    --footer-text: 15.8px;
    --footer-h3: 19.8px;
    --footer-h4: 15.8px;

    --footer-logo-w: 172px;
    --footer-meta-gap: 18px;
    --footer-meta-mt: 58px;
  }
}

/* 1170 */
@media (max-width: 1170px){
  :root{
    --footer-container-pl: 38px;
    --footer-links-pl: 28px;
    --footer-cols-gap: 26px;

    --footer-text: 15.6px;
    --footer-h3: 19.6px;
    --footer-h4: 15.6px;

    --footer-logo-w: 170px;
    --footer-meta-mt: 56px;
  }
}

/* 1140 */
@media (max-width: 1140px){
  :root{
    --footer-container-pl: 32px;
    --footer-links-pl: 24px;
    --footer-cols-gap: 22px;

    --footer-text: 15.4px;
    --footer-h3: 19.4px;
    --footer-h4: 15.4px;

    --footer-logo-w: 168px;
    --footer-meta-mt: 54px;
  }
}

/* 1110 */
@media (max-width: 1110px){
  :root{
    --footer-container-pl: 28px;
    --footer-links-pl: 22px;
    --footer-cols-gap: 20px;

    --footer-text: 15.2px;
    --footer-h3: 19.2px;
    --footer-h4: 15.2px;

    --footer-logo-w: 166px;
    --footer-meta-mt: 52px;
  }
}

/* 1080 */
@media (max-width: 1080px){
  :root{
    --footer-container-pl: 24px;
    --footer-links-pl: 20px;
    --footer-cols-gap: 18px;

    --footer-text: 15px;
    --footer-h3: 19px;
    --footer-h4: 15px;

    --footer-logo-w: 164px;
    --footer-meta-mt: 50px;
  }
}

/* 1050 */
@media (max-width: 1050px){
  :root{
    --footer-container-pl: 20px;
    --footer-links-pl: 18px;
    --footer-cols-gap: 16px;

    --footer-text: 14.8px;
    --footer-h3: 18.8px;
    --footer-h4: 14.8px;

    --footer-logo-w: 162px;
    --footer-meta-mt: 48px;
  }
}

/* ===================================== */
/* FOOTER ADAPTIVE CLEAN                 */
/* add this at the very end of footer.css */
/* ===================================== */

/* ===================================== */
/* TABLET (keep desktop layout)          */
/* ===================================== */

@media (max-width: 1024px){

  .footer{
    padding-top: 100px;
  }

  .footer-container{
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  .footer-container ul{
    display: flex;
    gap: 24px;
  }

  /* вертикальная линия сохраняется */
  .footer-border-v{
    width: 4px;
  }

  /* бренд */
  .footer-brand img{
    margin-top: 32px;
    max-width: 170px;
    max-height: none;
  }

  .footer-text{
    margin-top: 16px;
    font-size: 15px;
  }

  .footer-meta{
    margin-top: 36px;
    gap: 18px;
    font-size: 13px;
  }

  /* ссылки */
  .footer-links{
    padding-left: 26px !important;
    padding-top: 32px !important;
    padding-right: 0 !important;
  }

  .footer-links ul{
    display: flex;
    gap: 36px;
  }

  .footer-links h3{
    font-size: 18px;
    margin-bottom: 14px;
  }

  .footer-links h4{
    font-size: 15px;
    margin-top: 10px;
  }

  .btn-footer{
    width: 200px;
    max-width: 100%;
  }

  /* соцсети */
  .social-links ul{
    margin-top: 14px;
    gap: 16px;
  }

  .social-links ul img{
    max-width: 21px;
  }

  .social-links ul img:hover{
    max-width: 23px;
  }

}

/* ===================================== */
/* 900px — desktop layout smaller        */
/* ===================================== */

@media (max-width: 900px){

  .footer{
    padding-top: 90px;
  }

  .footer-container{
    padding-left: 26px !important;
    padding-right: 26px !important;
  }

  .footer-container ul{
    gap: 20px;
  }

  .footer-border-v{
    width: 3px;
  }

  /* brand */

  .footer-brand img{
    margin-top: 28px;
    max-width: 150px;
  }

  .footer-text{
    margin-top: 14px;
    font-size: 14px;
  }

  .footer-meta{
    margin-top: 28px;
    gap: 14px;
    font-size: 12px;
  }

  /* links */

  .footer-links{
    padding-left: 20px !important;
    padding-top: 28px !important;
  }

  .footer-links ul{
    gap: 26px;
  }

  .footer-links h3{
    font-size: 17px;
    margin-bottom: 12px;
  }

  .footer-links h4{
    font-size: 14px;
    margin-top: 8px;
  }

  .btn-footer{
    width: 180px;
  }

  .social-links ul{
    margin-top: 12px;
    gap: 14px;
  }

  .social-links ul img{
    max-width: 20px;
  }

}



/* ===================================== */
/* 768px — desktop layout tighter        */
/* ===================================== */

@media (max-width: 768px){

  .footer{
    padding-top: 80px;
  }

  .footer-container{
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .footer-container ul{
    gap: 16px;
  }

  .footer-border-v{
    width: 3px;
  }

  /* brand */

  .footer-brand img{
    margin-top: 24px;
    max-width: 135px;
  }

  .footer-text{
    margin-top: 12px;
    font-size: 13px;
  }

  .footer-meta{
    margin-top: 22px;
    gap: 10px;
    font-size: 11px;
  }

  /* links */

  .footer-links{
    padding-left: 16px !important;
    padding-top: 24px !important;
  }

  .footer-links ul{
    gap: 20px;
  }

  .footer-links h3{
    font-size: 16px;
    margin-bottom: 10px;
  }

  .footer-links h4{
    font-size: 13px;
    margin-top: 7px;
  }

  .btn-footer{
    width: 160px;
  }

  .social-links ul{
    margin-top: 10px;
    gap: 12px;
  }

  .social-links ul img{
    max-width: 18px;
  }

}

/* ===================================== */
/* TABLET / LARGE MOBILE (<=710px)       */
/* ===================================== */
@media (max-width: 710px){

  .footer{
    padding-top: 60px;
    padding-bottom: 28px;
  }

  .footer-container{
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .footer-container > ul{
    display: flex;
    flex-direction: column-reverse;
    gap: 24px;
  }

  .footer-border-v{
    display: none;
  }

  /* ========================= */
  /* LINKS AREA                */
  /* ========================= */
  .footer-links{
    width: 100%;
    padding: 0 !important;
  }

  .footer-links ul{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "company services"
      "work contact";
    column-gap: 44px;
    row-gap: 24px;
    align-items: start;
  }

  .footer-links li{
    min-width: 0;
    margin: 0;
    padding: 0;
  }

  .footer-links li:nth-child(1){
    grid-area: company;
    padding-top: 14px;
  }

  .footer-links li:nth-child(2){
    grid-area: services;
    padding-top: 14px;
  }

  .footer-links li:nth-child(3){
    grid-area: work;
  }

  .footer-links li:nth-child(4){
    grid-area: contact;
    padding: 16px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.06);
    background: rgba(255,255,255,0.02);
    box-sizing: border-box;
  }

  .footer-links h3{
    font-size: 16px;
    line-height: 1.2;
    margin-bottom: 12px;
    display: inline-block;
    position: relative;
  }

  /* линии под заголовками */
  .footer-links h3::after{
    content: "";
    display: block;
    width: 28px;
    height: 2px;
    margin-top: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, #8b3dff 0%, #c78bff 100%);
  }

  .footer-links h4{
    font-size: 13px;
    line-height: 1.45;
    margin-top: 8px;
    opacity: 0.9;
  }

  .btn-footer{
    width: 100%;
    max-width: 100%;
    margin-top: 6px;
  }

  .social-links ul{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding: 0;
  }

  .social-links ul li,
  .social-links ul a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .social-links ul img,
  .social-links ul img:hover{
    width: 18px;
    height: 18px;
    max-width: 18px;
    max-height: 18px;
    min-width: 18px;
    min-height: 18px;
    object-fit: contain;
    transform: none;
  }

  /* убираем возможный лишний фон/обводку у тиктока */
  .social-links ul li:nth-child(4),
  .social-links ul li:nth-child(4) a,
  .social-links ul li:nth-child(4) img{
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }

  /* ========================= */
  /* BRAND AREA                */
  /* ========================= */
  .footer-brand{
    padding-top: 18px;
    padding-bottom: 18px;
    border-top: 1px solid rgba(255,255,255,0.08);
  }

  .footer-brand img{
    margin-top: 0;
    max-width: 138px;
    max-height: none;
  }

  .footer-text{
    margin-top: 12px;
    max-width: 300px;
    font-size: 13px;
    line-height: 1.5;
  }

  .footer-meta{
    margin-top: 12px;
    margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    font-size: 11px;
    opacity: 0.52;
  }
}

/* ===================================== */
/* SMALL MOBILE (<=560px)                */
/* 2x2 grid mobile                       */
/* ===================================== */
@media (max-width: 560px){

  .footer{
    padding-top: 52px;
    padding-bottom: 24px;
  }

  .footer-container{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .footer-container > ul{
    gap: 22px;
  }

  /* ========================= */
  /* LINKS AREA                */
  /* ========================= */
  .footer-links{
    margin-top: 18px;
    width: 100%;
    padding: 0 !important;
  }

  .footer-links > ul{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-areas:
      "company services"
      "work contact" !important;
    column-gap: 20px;
    row-gap: 22px;
    align-items: start;
    justify-items: start;
    width: 100%;
  }

  /* ВАЖНО: только прямые li верхнего списка, не соцсети */
  .footer-links > ul > li{
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .footer-links > ul > li:nth-child(1){ grid-area: company !important; }
  .footer-links > ul > li:nth-child(2){ grid-area: services !important; }
  .footer-links > ul > li:nth-child(3){ grid-area: work !important; }
  .footer-links > ul > li:nth-child(4){ grid-area: contact !important; }

  .footer-links h3{
    font-size: 15px;
    margin-bottom: 10px;
    line-height: 1.2;
  }

  .footer-links h3::after{
    width: 24px;
    height: 2px;
    margin-top: 7px;
  }

  .footer-links h4{
    font-size: 12px;
    line-height: 1.42;
    margin-top: 6px;
  }

  .footer-links > ul > li:nth-child(4){
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  /* ========================= */
  /* BUTTON + SOCIAL           */
  /* ========================= */
  .btn-footer{
    width: 170px;
    max-width: 170px;
    min-width: 170px;
    height: 36px;
    min-height: 36px;
    margin-top: 8px;
  }

  .social-links{
    width: 100%;
  }

  .social-links ul{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    padding: 0;
    list-style: none;
  }

  .social-links ul li{
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
  }

  .social-links ul a{
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    height: auto !important;
  }

  .social-links ul img,
  .social-links ul img:hover{
    display: block;
    width: 17px;
    height: 17px;
    max-width: 17px;
    max-height: 17px;
    min-width: 17px;
    min-height: 17px;
    object-fit: contain;
    transform: none;
  }

  /* ========================= */
  /* BRAND AREA                */
  /* ========================= */
  .footer-brand{
    text-align: center;
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .footer-brand img{
    max-width: 128px;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
  }

  .footer-text{
    max-width: 260px;
    margin: 12px auto 0;
    font-size: 12px;
    line-height: 1.5;
  }

  .footer-meta{
    margin-top: 14px;
    margin-bottom: 0;
    justify-content: center;
    gap: 6px 10px;
    font-size: 10px;
  }
}

/* ===================================== */
/* EXTRA SMALL MOBILE (<=360px)          */
/* ===================================== */
@media (max-width: 360px){

  .social-links ul{
    gap: 8px;
    margin-top: 10px;
  }

  .social-links ul img,
  .social-links ul img:hover{
    width: 15px;
    height: 15px;
    max-width: 15px;
    max-height: 15px;
    min-width: 15px;
    min-height: 15px;
  }

}