/* =============================================================
   css/site.css — ebmco.sk

   Вне бандла, подключается после includes/inline-css.php с ?v=filemtime.
   Правила темы объявлены с большей специфичностью — перебиваем через body.

   Чистка первого экрана денежной страницы: на мобильной первая карточка
   рейтинга должна помещаться целиком, вторая — начинаться в пределах
   экрана (ТЗ §6.2).

   Что срезаем и почему: у темы .section{padding:60px 0} сверху и снизу,
   h1 с margin-top 48px, лид в шесть строк и h2 над таблицей в три
   строки — до карточки набегало 570px из 812. Шапка тут в потоке
   (position:relative), поэтому отступы режем свободно: наехать
   на заголовок она не может.
   ============================================================= */

@media (max-width:767.98px){

  body section.section{padding-top:0 !important;padding-bottom:10px !important}
  body section.bg-primary.section{padding-top:14px !important;padding-bottom:26px !important}

  body section.section h1{
    font-size:23px !important;
    line-height:1.2 !important;
    margin-top:14px !important;
    margin-bottom:6px !important;
  }

  /* лид остаётся в разметке и в индексе, в вид отдаём три строки */
  body section.section > .container p.fs-16{
    font-size:14px !important;
    line-height:1.45 !important;
    margin-bottom:6px !important;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  body section.bg-primary h2{
    font-size:20px !important;
    line-height:1.22 !important;
    margin-bottom:6px !important;
  }

  /* карточка: собираем по мелочи, чтобы первая влезала целиком */
  body .ebm-card .ebm-brand{padding:10px 14px;gap:8px 12px}
  body .ebm-card .ebm-logo{height:36px;max-width:88px}
  body .ebm-card .ebm-rank b{width:34px;height:34px;font-size:15px}
  body .ebm-card .ebm-rate{gap:4px}
  body .ebm-card .ebm-stat{padding:7px 9px}
  body .ebm-card .ebm-stat__ic svg{width:20px;height:20px}
  body .ebm-card .ebm-stat__txt b{font-size:13.5px}
  body .ebm-card .ebm-foot{padding:7px 14px;gap:5px 10px}
  body .ebm-card .ebm-pay li{font-size:11px}
  body .ebm-card .ebm-pay svg{width:15px;height:15px}
  body .ebm-card .ebm-rg{font-size:10.5px}
  body .ebm-card .ebm-act{padding:0 14px 10px}

  /* зазор между карточками: на 360×800 вторая должна начинаться
     в пределах экрана, а не ровно на его кромке */
  body .ebm-list{gap:10px}
}

/* ---------- первый экран, десктоп ----------
   Срезаем только воздух: шапка в потоке, заголовки остаются на месте. */
@media (min-width:768px){
  body section.section{padding-top:14px !important;padding-bottom:14px !important}
  body section.bg-primary.section{padding-top:20px !important}
  body section.section h1{margin-top:8px !important;margin-bottom:10px !important}
  body section.bg-primary h2{margin-bottom:10px !important}
}
