/* ====== БАЗА ====== */
:root{
  --ff-heading:"DrukWideCyr","Druk Wide Cyr",Impact,system-ui,sans-serif;
  --ff-body:"Manrope",Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --c-bg:#0e0e0e; --c-text:#cfcfcf; --c-white:#fff; --c-accent:#DAAD38;
}

footer.footer{
  background:var(--c-bg);
  color:var(--c-text);
  font-family:var(--ff-body);
  border-top:1px solid rgba(255,255,255,.10);
}
footer.footer .f-wrap{
  max-width:1200px;
  margin:0 auto;
  padding:48px 20px;
}

/* ====== СЕТКА ====== */
footer.footer .f-grid{
  display:grid;
  grid-template-columns: 5fr 2.5fr 4fr 2.5fr; /* как просил */
  column-gap:60px;
  align-items:start;
}
@media (max-width:960px){
  footer.footer .f-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:24px; row-gap:24px; }
}
@media (max-width:640px){
  footer.footer .f-grid{ grid-template-columns:1fr; row-gap:18px; }
}

/* ====== ТИПОГРАФИКА ====== */
footer.footer .f-col{ display:flex; flex-direction:column; gap:12px; }
footer.footer h4{
  margin:0 0 12px;
  font:700 16px/1.2 var(--ff-heading);
  letter-spacing:.2px;
  color:var(--c-white);
}
footer.footer a{ color:var(--c-text); text-decoration:none; }
footer.footer a:hover{ color:var(--c-white); }

/* ====== БРЕНД ====== */
footer.footer .logo{ display:flex; align-items:center; gap:10px; }
footer.footer .logo img{
  width:36px; height:36px; border-radius:50%;
  background:#111; border:1px solid rgba(255,255,255,.08);
}
footer.footer .accent{ color:var(--c-accent); }

/* Таблетки под логотипом */
footer.footer .tags{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
footer.footer .tag{
  font-size:12px; line-height:1;
  padding:6px 10px;
  color:var(--c-text);
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:transparent;
  white-space:nowrap;
}

/* ====== СПИСКИ ====== */
footer.footer .f-list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:16px; /* крупнее межстрочные */
}
footer.footer .f-list a{ font-size:15px; line-height:1.7; }

/* ====== КОНТАКТЫ: иконка с рамкой, фон прозрачный, глиф залит ====== */
footer.footer .with-ico{
  display:inline-flex; align-items:center; gap:10px;
}
footer.footer .with-ico svg{
  width:22px; height:22px; display:block;
}

/* рамка */
footer.footer .with-ico svg .badge{
  fill:transparent;                    /* фон прозрачный */
  stroke: currentColor;                /* рамка цветом текста */
  stroke-width:1.4;
  rx:6; ry:6;                          /* скругление */
}

/* символ (play/конверт/самолёт/VK) */
footer.footer .with-ico svg .glyph{
  fill: currentColor;                  /* сам значок залит */
  stroke: none;
}

/* ====== НИЖНИЙ СЛОЙ (копирайт) ====== */
.mf-divider{ height:1px; background:rgba(255,255,255,.12); margin:28px 0; }
.ment-footer-bottom{ background:var(--c-bg); }
.ment-footer-bottom .mf-row{
  max-width:1200px; margin:0 auto; padding:16px 20px;
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.mf-copy{ color:#aaa; font-size:13px; line-height:1.6; }
.mf-links{ display:flex; gap:8px; flex-wrap:wrap; }
.mf-links .dot{ color:#777; }

/* нижние цветные соц-иконки — оставляем как есть (картинки/свои svg) */
.mf-social{ display:flex; gap:10px; }
.mf-social a{ display:inline-flex; }

/* --- FOOTER: гасим тильдовский красный только внутри футера --- */
footer.footer a,
footer.footer .f-list a,
footer.footer .contact .with-ico{
  color:#cfcfcf !important;
  text-decoration:none !important;
}
footer.footer a:hover,
footer.footer .f-list a:hover,
footer.footer .contact .with-ico:hover{
  color:#ffffff !important;
}
footer.footer a:visited{ color:#cfcfcf !important; }
footer.footer a:active { color:#ffffff !important; }

/* Двигаем колонку целиком (а не h4/список по отдельности) */
@media (min-width:961px){
  footer.footer .nav,
  footer.footer .edu,
  footer.footer .contact{
    padding-left: 8px;        /* подправь число под вкус: 6–12px */
  }
}

/* На всякий случай убираем «скрытые» левые отступы у самих заголовков/списков */
footer.footer .f-col h4{ margin-left:0 !important; }
footer.footer .f-list{ margin-left:0 !important; padding-left:0 !important; }


/* Контейнер справа */
.ment-footer-bottom .mf-right{ text-align:right !important; }

/* Ряд иконок прижат вправо */
.ment-footer-bottom .mf-social{
  display:flex !important;
  justify-content:flex-end !important;
  gap:10px;
}

/* На мобилке — по умолчанию слева (если нужно) */
@media (max-width:720px){
  .ment-footer-bottom .mf-right{ text-align:left !important; }
  .ment-footer-bottom .mf-social{ justify-content:flex-start !important; }
}


/* ====== МОБИЛЬНЫЕ ПРАВКИ ====== */
@media (max-width:640px){
  footer.footer .f-wrap{ padding:32px 16px; }
  footer.footer .f-list{ gap:12px; }
  footer.footer h4{ margin:16px 0 10px; }
}

/* --- визуальная иерархия в футере --- */
footer.footer .f-col h4{
  color:#fff !important;
  font-weight:700;
  letter-spacing:.2px;
}

footer.footer .f-list a{
  color:#cfcfcf !important;       /* спокойный базовый */
}
footer.footer .f-list a:hover{
  color:#ffffff !important;       /* акцент на hover */
}

/* Бейджи под логотипом — контраст помягче */
footer.footer .tag{
  color:#cfcfcf;
  border-color:rgba(255,255,255,.18);
  background:transparent;
}

/* Копирайт и «оферта/политика» — тише, но читаемо */
.mf-copy{ color:#a6a6a6 !important; }
.mf-links a{ color:#c6c6c6 !important; }
.mf-links a:hover{ color:#fff !important; }

/* Иконки контактов (рамка + символ), поддержка «штрихового» глифа */
.footer .with-ico svg{ width:22px; height:22px; display:block; }
.footer .with-ico svg .badge{
  fill:transparent !important;
  stroke:currentColor !important;
  stroke-width:1.4;
  rx:6; ry:6;                     /* скругления рамки */
}
/* заливочный глиф (например YouTube) */
.footer .with-ico svg .glyph{
  fill:currentColor !important;
  stroke:none !important;
}
/* штриховой глиф (для конверта и т.п.) */
.footer.footer .with-ico svg .glyph-stroke{
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

footer.footer .f-col h4{
  color:#e0e0e0 !important;   /* вместо белого — мягкий серый */
  font-size:18px !important;
  font-weight:600;
}
footer.footer .f-list a{
  color:#d0d0d0 !important;
}
footer.footer .f-list a:hover{
  color:#fff !important;
}

.footer .contact .f-list a:hover{ color:#daad38 !important; }
.footer .contact .with-ico:hover svg .badge{ stroke:#daad38 !important; }
.footer .contact .with-ico:hover svg .glyph,
.footer .contact .with-ico:hover svg .glyph-stroke{ fill:#daad38 !important; stroke:#daad38 !important; }

/* ↑ Чуть крупнее логотип и плотнее связка с текстом */
footer.footer .brand .logo img{
  width: 44px;           /* было 36px → +~22% (можно поставить 40px, если хочется скромнее) */
  height: 44px;
}

footer.footer .brand .logo{
  gap: 12px;             /* было 10px — немного больше воздуха между иконкой и текстом */
}

/* Логотип в футере — +17% размера, без сдвигов сетки */
.footer .logo img{
  width: 56px !important;   /* было ~36px */
  height: 56px !important;
}


/* Чуть усилить иерархию текста справа от логотипа */
footer.footer .brand .logo strong{
  font-size: 24px;       /* было 16px — станет заметнее, но не кричит */
  line-height: 1.1;
}

footer.footer .brand .logo small{
  font-size: 13px;       /* оставляем компактно */
  opacity: .9;
}


footer.footer .brand p{
  font-size: 15px;
  line-height: 1.55;
  color: #bfbfbf; /* чуть мягче белого */
  max-width: 360px; /* чтобы текст не расползался вширь */
}

footer.footer .brand .slogan{
  font-size: 15px;
  line-height: 1.5;
  color: #ddd;       /* светлее основного текста */
  margin: 4px 0 10px;
}


/* На мобильных — поменьше, чтобы не «спихивало» строки */
@media (max-width: 640px){
  footer.footer .brand .logo img{ width: 40px; height: 40px; }
  footer.footer .brand .logo strong{ font-size: 17px; }
}

/* ===== Плашки-бейджи в первом столбце футера ===== */
footer.footer .tags{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
  z-index: 0;                   /* для ореола ниже */
}

/* === Pills (бейджи) в бренде футера с мягким glow === */
footer.footer .brand .tags{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:8px;
}

/* базовая таблетка */
footer.footer .brand .tag{
  --glow: rgba(218,173,56,.55);        /* дефолтный — золотистый */
  position:relative; isolation:isolate; /* чтобы свечения не «выползали» */
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(255,255,255,.03);    /* лёгкая подложка */
  color:#cfcfcf;
  font-size:12.5px; line-height:1;
  letter-spacing:.2px;
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}

/* мягкое центральное свечение */
footer.footer .brand .tag::before{
  content:"";
  position:absolute; inset:-2px; z-index:0;
  border-radius:inherit;
  background:
    radial-gradient( circle at 50% 50%, var(--glow) 0%, rgba(0,0,0,0) 60% );
  filter:blur(12px);
  opacity:.35;
  pointer-events:none;
}

/* текст всегда поверх свечения */
footer.footer .brand .tag > * { position:relative; z-index:1; }

/* ховер — чуть ярче, но без агрессии */
footer.footer .brand .tag:hover{
  color:#fff;
  border-color:#fff;
  background:rgba(255,255,255,.05);
}
footer.footer .brand .tag:hover::before{
  opacity:.55; filter:blur(16px);
}

/* Варианты цвета glow (по желанию — добавь классы к нужным плашкам) */
footer.footer .brand .tag--yt    { --glow: rgba(43,214,123,.55); } /* зелёный YouTube? оставь золотой, если не нужно */
footer.footer .brand .tag--years { --glow: rgba(178,138,255,.55); } /* фиолетовый для «лет» */
footer.footer .brand .tag--flag  { --glow: rgba(255,122,122,.55); } /* тёпло-красный для «флагманов» */

/* Тёмные темы / мобильная плотность — чуть компактнее на очень узких */
@media (max-width:420px){
  footer.footer .brand .tag{ padding:7px 10px; font-size:12px; }
}


/* Базовая таблетка */
footer.footer .pill{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  color:#d8d8d8;
  font:500 13px/1.1 var(--ff-body, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  letter-spacing:.1px;
  box-shadow:
    inset 0 0 0 0 rgba(0,0,0,0),
    0 1px 2px rgba(0,0,0,.35);
  transition:transform .2s ease, color .2s ease, border-color .2s ease, box-shadow .25s ease;
}

/* Иконка внутри */
footer.footer .pill__ico{
  width:14px; height:14px; display:block; opacity:.95;
  flex:0 0 14px;
  fill:currentColor;
}

/* Ховер — лёгкое освещение и подъём */
footer.footer .pill:hover{
  color:#fff;
  border-color:rgba(255,255,255,.35);
  transform:translateY(-1px);
  box-shadow:
    0 0 0 3px rgba(218,173,56,.06),      /* едва заметный «аур» вокруг */
    0 6px 16px rgba(0,0,0,.35);
}

/* Варианты оттенков (необязательно — для акцентов) */
footer.footer .pill--mint{
  border-color:rgba(110,255,170,.28);
}
footer.footer .pill--mint:hover{
  box-shadow:
    0 0 16px rgba(110,255,170,.18),
    0 6px 16px rgba(0,0,0,.35);
}

footer.footer .pill--gold{
  border-color:rgba(218,173,56,.28);
}
footer.footer .pill--gold:hover{
  box-shadow:
    0 0 16px rgba(218,173,56,.18),
    0 6px 16px rgba(0,0,0,.35);
}

/* Контейнер таблеток */
footer.footer .f-col.brand .tags{
  display:flex !important; gap:8px !important; flex-wrap:wrap !important;
  margin-top:8px !important;
}

/* Таблетка */
footer.footer .f-col.brand .tag{
  position:relative !important; z-index:1 !important;
  display:inline-flex !important; align-items:center !important;
  padding:6px 12px !important; line-height:1 !important; white-space:nowrap !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:rgba(255,255,255,.03) !important;
  color:#cfcfcf !important;
  transition:transform .18s ease, border-color .18s ease, color .18s ease !important;
  overflow:hidden !important;
}

/* Glow под таблеткой */
footer.footer .f-col.brand .tag::before{
  content:"" !important; position:absolute !important; z-index:0 !important;
  inset:-20% -30% !important;
  background: radial-gradient(60% 60% at 50% 50%, var(--pill-glow, rgba(218,173,56,.2)) 0%, transparent 60%) !important;
  filter: blur(8px) !important; opacity:.75 !important;
}

/* Hover */
footer.footer .f-col.brand .tag:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,255,255,.28) !important;
  color:#fff !important;
}

/* Оттенки по порядку (1-й, 2-й, 3-й бейдж) */
footer.footer .f-col.brand .tags .tag:nth-child(1){ --pill-glow: rgba(218,173,56,.22) !important; } /* «22 000+ YouTube» */
footer.footer .f-col.brand .tags .tag:nth-child(2){ --pill-glow: rgba(143,101,255,.22) !important; } /* «15+ лет…» */
footer.footer .f-col.brand .tags .tag:nth-child(3){ --pill-glow: rgba(86,189,255,.22) !important; }  /* «Авторская система» */

.hero-title span:last-child {
    display: block;
    margin-left: 40px; /* регулируешь отступ */
}