/* ============================================================
   phone.css — мобильная главная по макету «Главная-телефон».
   Подключается ПОСЛЕ sp-responsive и sp-mobnav, поэтому
   переопределяет их. Десктоп не затрагивается.
   ============================================================ */

.sp-hero-chips{display:none}

@media (max-width:620px){
  /* ---------- HERO: кадр на весь экран, контент внизу слева ---------- */
  #top{min-height:calc(100svh - 132px)!important;padding-top:0!important;
       align-items:stretch!important;flex-direction:column!important;
       justify-content:flex-end!important;text-align:left!important}
  #top>div[style*="z-index:4"]:not(.sp-herostats){
       flex:1 1 auto!important;justify-content:flex-end!important;align-items:flex-start!important;
       text-align:left!important;padding:0 22px 28px!important}

  /* надзаголовок «Москва · Санкт-Петербург» с красным усиком */
  #top>div[style*="z-index:4"]>div:first-child{display:inline-flex!important;align-items:center;gap:8px}
  #top>div[style*="z-index:4"]>div:first-child::before{content:"";width:18px;height:1px;
       background:#e10600;box-shadow:0 0 10px rgba(225,6,0,.8);display:inline-block;flex-shrink:0}

  /* заголовок + красная черта под ним */
  #top h1{font-size:44px!important;line-height:.92!important;margin:12px 0 0!important;text-align:left!important}
  #top h1::after{content:"";display:block;width:40px;height:2px;background:#e10600;
       margin-top:12px;box-shadow:0 0 14px rgba(225,6,0,.6)}

  #top>div[style*="z-index:4"] p{margin:14px 0 20px!important;max-width:320px!important;
       font-size:14px!important;line-height:1.5!important;text-align:left!important}

  /* кнопки: в ряд, компактные, со свечением при нажатии */
  .sp-hero-actions{flex-direction:row!important;width:auto!important;
       justify-content:flex-start!important;gap:10px!important;flex-wrap:wrap!important}
  .sp-hero-actions a.sp-btn-blood,.sp-hero-actions a.sp-btn-ghost{
       padding:13px 26px!important;font-size:12px!important;letter-spacing:.1em!important;
       border-radius:6px!important;transform:none!important}
  .sp-hero-actions a.sp-btn-blood{box-shadow:0 8px 22px rgba(225,6,0,.35)!important;
       transition:filter .18s ease,box-shadow .18s ease!important}
  .sp-hero-actions a.sp-btn-ghost{background:transparent!important;
       border:1px solid rgba(255,255,255,.28)!important;color:#efeaea!important;box-shadow:none!important}
  .sp-hero-actions a.sp-btn-blood:active{transform:none!important;filter:brightness(1.08)!important;
       box-shadow:0 0 30px rgba(225,6,0,.85),0 8px 22px rgba(225,6,0,.55)!important}
  .sp-hero-actions a.sp-btn-ghost:active{transform:none!important;color:#fff!important;
       border-color:rgba(225,6,0,.7)!important;box-shadow:0 0 22px rgba(225,6,0,.4)!important}

  /* ---------- Полоса статистики → чипы-пилюли ---------- */
  .sp-herostats{display:none!important}
  .sp-hero-chips{display:flex!important;flex-wrap:wrap;gap:8px;padding:16px 20px 4px;background:#08080a}
  .sp-chip{display:inline-flex;align-items:center;gap:9px;background:#151519;
       border:1px solid rgba(255,255,255,.08);border-radius:30px;padding:9px 15px;
       font-family:'Oswald',sans-serif;letter-spacing:.1em;text-transform:uppercase;font-size:11px;color:#cfc4c6}
  .sp-chip b{color:#efeaea;font-weight:600}
  .sp-chip .sp-chip-d{width:6px;height:6px;background:#e10600;transform:rotate(45deg);
       box-shadow:0 0 8px rgba(225,6,0,.6);flex-shrink:0}
}

/* Узкие телефоны */
@media (max-width:380px){
  #top h1{font-size:38px!important}
  .sp-chip{padding:8px 12px;font-size:10.5px}
}