/* ===========================================
Адаптация от 1440px (FullHD / Большие экраны + 4K / Ультраширокие экраны)
=========================================== */
@media screen and (min-width: 1440px) {

  /* :: Подблок: Шапка карточек для shortstory и fullstory */

  /* ::: Мини-блок: общая рамка шапки (управляет раскладкой строк/колонок) */
  .scard__title-wrap {
    row-gap: 5px; /* вертикальный зазор */
  }
  /* ::: Мини-блок: заголовок + иконка редактирования (Ряд 1) */
  .scard__title-fullstory-wrap,
  .scard__title-shortstory-wrap {
    min-height: calc(2 * 1.15em); /* резерв под 2 строки */
  }

  /* ::: Мини-блок: сам текст заголовка */
  .scard__title-shortstory,
  .scard__title-fullstory {
    font-size: 26px; /* размер шрифта заголовка */
    line-height: 1.15; /* межстрочный интервал */
  }

  /* ::: Мини-блок: сам текст оригинального названия */
  .scard__subtitle-shortstory,
  .scard__subtitle-fullstory {
    font-size: 14px; /* размер шрифта подзаголовка */
    margin-top: 2px; /* отступ сверху */
  }

  /* :: Подблок: Описание карточек */
  /* ::: Мини-блок: контейнер описания карточки */
  .scard__descr-shortstory,
  .scard__descr-fullstory {
    gap: 4px; /* шаг между элементами */
    font-size: 15px; /* размер шрифта текста описания */
    line-height: 1.45; /* межстрочный интервал */
  }

  /* ::: Мини-блок: сетка строки и типографика блока описания карточки */
  .scard__list-shortstory,
  .scard__list-fullstory {
    grid-template-columns: 115px minmax(0, 1fr); /* ключ / значение */
    column-gap: 16px; /* горизонтальный зазор */
    padding: 5px 6px; /* паддинг строки */
  }

  /* : Блок: Карточка ShortStory */
  /* ::: Мини-блок: сами категории (текст/ссылки) */
  .scard__category-shortstory {
    font-size: 15px; /* размер шрифта категории */
    line-height: 1.35; /* межстрочный интервал */
    gap: 5px; /* отступ между вложенными элементами */
    margin-top: 8px; /* отступ сверху */
  }
}

/* ===========================================
Адаптация от 1280px до 1439px (Ноутбуки / Средние экраны)
=========================================== */
@media screen and (max-width: 1439px) {

  /* :: Подблок: Шапка карточек для shortstory и fullstory */
  /* ::: Мини-блок: общая рамка шапки (управляет раскладкой строк/колонок) */
  .scard__title-wrap {
    row-gap: 3px; /* вертикальный зазор */
  }

  /* ::: Мини-блок: сам текст заголовка */
  .scard__title-shortstory,
  .scard__title-fullstory {
    font-size: 24.5px; /* размер шрифта заголовка */
    line-height: 1.10; /* межстрочный интервал */
  }

  /* ::: Мини-блок: сам текст оригинального названия */
  .scard__subtitle-shortstory,
  .scard__subtitle-fullstory {
    font-size: 13.2px; /* размер шрифта подзаголовка */
    line-height: 1.16; /* межстрочный интервал */
    margin-top: 0;     /* отступ сверху */
  }

  /* :: Подблок: Описание карточек */
  /* ::: Мини-блок: контейнер описания карточки */
  .scard__descr-shortstory,
  .scard__descr-fullstory {
    gap: 3px;        /* шаг между элементами */
    font-size: 14.4px; /* размер шрифта текста описания */
    line-height: 1.40; /* межстрочный интервал */
  }

  /* ::: Мини-блок: сетка строки и типографика блока описания карточки */
  .scard__list-shortstory,
  .scard__list-fullstory {
    grid-template-columns: 108px minmax(0, 1fr); /* ключ / значение */
    column-gap: 15px;                             /* горизонтальный зазор */
    padding: 4px 6px;                             /* паддинг строки */
  }

  /* : Блок: Карточка ShortStory */
  /* ::: Мини-блок: сами категории (текст/ссылки) */
  .scard__category-shortstory {
    font-size: 14px;  /* размер шрифта категории */
    line-height: 1.30; /* межстрочный интервал */
    gap: 4px;          /* отступ между вложенными элементами */
    margin-top: 7px;   /* отступ сверху */
  }

  /* :: Подблок: Футер карточек */
  /* ::: Мини-блок: базовая структура футера */
  .scard__footer {
    font-size: 13.4px; /* базовый размер шрифта */
  }

  /* ::: Мини-блок: контейнер рейтингов и комментариев */
  .scard__footer-meta {
    gap: 10px; /* интервал между «плашками» */
  }

  /* ::: Мини-блок: базовые стили рейтинга и комментариев */
  .scard__footer-rating,
  .scard__footer-comments {
    gap: 4px; /* зазор между частями */
  }

  /* ::: Мини-блок: стили самой кнопки */
  .scard__btn {
    max-width: 220px; /* максимальная ширина кнопки */
    height: 40px;     /* высота кнопки */
    font-size: 14.8px; /* размер шрифта */
    padding: 0 16px;   /* внутренние отступы */
  }
}

/* ===========================================
Адаптация 1024px – 1279px (Малые ноутбуки / Малые экраны)
=========================================== */

/* 1221–1279: почти десктоп — минимум изменений */
@media screen and (min-width: 1221px) and (max-width: 1279px) {

  /* :: Подблок: Капсула рейтинга */
  .scard__rating-wrap {
    --h: 46px; /* высота капсулы */
  }
  .scard__rating {
    font-size: 13.5px; /* кегль лайков/дизлайков */
  }
  .scard__rating-percent {
    font-size: 12.5px; /* кегль процента */
  }

  /* :: Подблок: Футер карточек */
  .scard__footer {
    font-size: 13.3px; /* базовый размер шрифта */
    gap: 8px 12px;     /* интервал между блоками */
  }
  .scard__footer-meta {
    gap: 9px;          /* интервал между «плашками» */
  }

  /* ::: Мини-блок: кнопка */
  .scard__btn {
    max-width: 215px;  /* максимальная ширина кнопки */
    height: 40px;      /* высота кнопки */
    font-size: 14.6px; /* размер шрифта */
    padding: 0 16px;   /* внутренние отступы */
  }
}

/* 1024–1220: планшет — типографика и сетка компактнее */
@media screen and (min-width: 1024px) and (max-width: 1220px) {

  /* :: Подблок: Сайдбар */
  .genre-sidebar {
    display: none !important; /* скрытие сайдбара жанров */
  }

  /* :: Подблок: Дополнительные блоки меню */
  .mobile-menu__extras {
    display: block; /* показ мобильных блоков (вход / язык / тема) */
  }

  /* :: Подблок: Шапка карточек */
  .scard__title-shortstory,
  .scard__title-fullstory {
    font-size: 24px;  /* размер шрифта заголовка */
    line-height: 1.10; /* межстрочный интервал */
  }
  .scard__subtitle-shortstory,
  .scard__subtitle-fullstory {
    font-size: 13px;  /* размер шрифта подзаголовка */
    line-height: 1.16; /* межстрочный интервал */
    margin-top: 0;     /* отступ сверху */
  }

  /* :: Подблок: Описание карточек */
  .scard__descr-shortstory,
  .scard__descr-fullstory {
    gap: 3px;          /* шаг между элементами */
    font-size: 14.2px; /* размер шрифта текста описания */
    line-height: 1.40; /* межстрочный интервал */
  }
  .scard__list-shortstory,
  .scard__list-fullstory {
    grid-template-columns: 104px minmax(0, 1fr); /* ключ / значение */
    column-gap: 14px;                             /* горизонтальный зазор */
    padding: 4px 6px;                             /* паддинг строки */
  }

  /* :: Подблок: Капсула рейтинга */
  .scard__rating-wrap {
    --h: 46px; /* высота капсулы */
  }
  .scard__rating {
    font-size: 13.5px; /* кегль лайков/дизлайков */
  }
  .scard__rating-percent {
    font-size: 12.5px; /* кегль процента */
  }

  /* :: Подблок: Футер карточек */
  .scard__footer {
    font-size: 13.3px; /* базовый размер шрифта */
    gap: 8px 12px;     /* интервал между блоками */
  }
  .scard__footer-meta {
    gap: 9px;          /* интервал между «плашками» */
  }

  /* ::: Мини-блок: кнопка */
  .scard__btn {
    max-width: 215px;  /* максимальная ширина кнопки */
    height: 40px;      /* высота кнопки */
    font-size: 14.6px; /* размер шрифта */
    padding: 0 16px;   /* внутренние отступы */
  }
}


/* ===========================================
Адаптация от 768px до 1023px (Планшеты / Малые ноутбуки)
=========================================== */
@media screen and (max-width: 1023px) {

  /* : Блок: Карточка FullStory и ShortStory */

  /* :: Подблок: Сайдбар */
  .genre-sidebar {
    display: none !important; /* скрытие сайдбара жанров */
  }

  /* :: Подблок: Дополнительные блоки меню */
  .mobile-menu__extras {
    display: block; /* показ мобильных блоков (вход / язык / тема) */
  }

  /* :: Подблок: Шапка карточек */
  .scard__title-shortstory,
  .scard__title-fullstory {
    font-size: 23px; /* размер шрифта заголовка */
    line-height: 1.10; /* межстрочный интервал */
  }
  .scard__subtitle-shortstory,
  .scard__subtitle-fullstory {
    font-size: 12.9px; /* размер шрифта подзаголовка */
    line-height: 1.14; /* межстрочный интервал */
    margin-top: 0;     /* отступ сверху */
  }

  /* :: Подблок: Описание карточек */
  .scard__descr-shortstory,
  .scard__descr-fullstory {
    gap: 3px;        /* шаг между элементами */
    font-size: 14px; /* размер шрифта текста описания */
    line-height: 1.38; /* межстрочный интервал */
  }
  .scard__list-shortstory,
  .scard__list-fullstory {
    grid-template-columns: 96px minmax(0, 1fr); /* ключ / значение */
    column-gap: 12px;                            /* горизонтальный зазор */
    padding: 4px 6px;                            /* паддинг строки */
  }

  /* :: Подблок: Капсула рейтинга */
  .scard__rating-wrap {
    --h: 44px; /* высота капсулы */
  }
  .scard__rating {
    font-size: 13px; /* кегль лайков/дизлайков */
  }
  .scard__rating-percent {
    font-size: 12px; /* кегль процента */
  }

  /* :: Подблок: Футер карточек */
  .scard__footer {
    font-size: 13.2px; /* базовый размер шрифта */
    gap: 8px 10px;     /* интервал между блоками */
    flex-wrap: nowrap; /* запрет переноса на вторую строку */
    align-items: center; /* выравнивание по центру */
    width: 100%;           /* ширина на всю область контента */
  }
  .scard__footer-meta {
    gap: 8px;         /* интервал между «плашками» */
    flex: 1 1 auto;   /* занимает доступную ширину */
    min-width: 0;     /* разрешает сжатие контейнера */
    white-space: nowrap; /* запрет переноса метаданных */
  }
  .scard__footer-rating,
  .scard__footer-comments {
    gap: 4px;             /* зазор между частями */
    white-space: nowrap;  /* запрет переноса внутри плашек */
  }
  .scard__footer-btn-wrap {
    flex: 0 0 auto; /* фиксированная зона для кнопки */
  }
  .scard__btn {
    max-width: 205px;  /* максимальная ширина кнопки */
    height: 38px;      /* высота кнопки */
    font-size: 14.4px; /* размер шрифта */
    padding: 0 16px;   /* внутренние отступы */
    white-space: nowrap; /* запрет переноса текста кнопки */
  }
}

/* ===========================================
Адаптация от 576px до 767px (Большие смартфоны / Маленькие планшеты)
=========================================== */
@media screen and (max-width: 767px) {

  /* : Блок: Карточка FullStory и ShortStory */
  /* Шапка — короче по высоте */
  .scard__title-shortstory,
  .scard__title-fullstory{
    font-size:20.5px;     /* было 22.5 */
    line-height:1.08;     /* было 1.10–1.15 */
  }
  .scard__subtitle-shortstory,
  .scard__subtitle-fullstory{
    font-size:12.2px;     /* было 12.5–12.7 */
    line-height:1.10;     /* было 1.14–1.22 */
  }

  /* Описание — плотнее строки */
  .scard__descr{ 
    align-self:center;     /* центрируем по вертикали внутри своей grid-строки */
    margin-top:0;          /* убираем лишний отступ */
    margin-bottom:0;
  }

  .scard__descr-shortstory,
  .scard__descr-fullstory{
    font-size:13px;       /* было 13.2–13.6 */
    line-height:1.28;     /* было 1.36–1.42 */
    gap:1px;              /* было 2–3px */
  }
  .scard__list-shortstory,
  .scard__list-fullstory{
    grid-template-columns:88px minmax(0,1fr); /* было 90–92px */
    column-gap:8px;        /* было 10–12px */
    padding:2px 4px;       /* было 3–4px 6px */
  }

  /* Капсула рейтинга — компактнее */
  .scard__rating-wrap{ --h:40px; }  /* было 38–40 */
  .scard__rating{        font-size:12.2px; }  /* было 12.2–12.6 */
  .scard__rating-percent{font-size:11.6px; }  /* было 11.2–11.6 */

  /* Футер/кнопка — ниже по профилю */
  .scard__footer{ font-size:12.4px; gap:4px 6px; }
  .scard__btn{
    height:32px;          /* было 34–36 */
    font-size:12.8px;     /* было 13.2–14 */
    max-width:178px;      /* было 188–196 */
    padding:0 12px;
  }
    
  /* :: Подблок: Сайдбар */
  .genre-sidebar {
    display: none !important; /* скрытие сайдбара жанров */
  }

  /* :: Подблок: Дополнительные блоки меню */
  .mobile-menu__extras {
    display: block; /* показ мобильных блоков (вход / язык / тема) */
  }

  /* :: Подблок: Кнопка редактирования */
  .scard__edit-icon {
    display: none; /* скрытие иконки редактирования */
  }
}

/* ===========================================
Адаптация до 575px (Средние смартфоны / Малые смартфоны / Сверхмалые смартфоны)
=========================================== */
@media screen and (max-width: 575px) {
    
/* :: Подблок: Шапка карточки shortstory */
/* ::: мини-блок: рамка шапки (1 колонка, 2 строки) */
  .scard__title-wrap-shortstory{
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;   /* было: auto auto auto */
    justify-items: center;            /* выравниваем по центру */
  }
  /* ::: мини-блок: выравнивание текстов в шапке */
  .scard__title-shortstory,
  .scard__subtitle-shortstory{
    text-align:center;
  } 
  /* ::: мини-блок: коробка категории */
  .scard__category-shortstory-wrap{ 
    display:none;                     /* категорию из хедера убираем */
  }
    
  /* :: Подблок: Футер карточек (общий для shortstory и fullstory) */
  /* ::: мини-блок: контейнер футера колонкой */
  .scard__footer {
    display:flex; 
    flex-direction:column; 
    align-items:stretch;
    gap:8px 0;
    max-width:470px;      
    width:100%;
    margin:0 auto;        /* центрируем контейнер футера */
  }
  /* ::: мини-блок: футер (рейтинги/кнопки) */
  .scard__footer-item {
    justify-content: flex-start;
    font-size: 12px;
  }
  /* ::: мини-блок: мета (IMDb/КП) — над кнопкой */
  .scard__footer-meta {
    order:1; 
    justify-content:center; 
    flex-wrap:wrap;
    gap:6px 10px; 
    min-width:0; 
    white-space:normal;
  }   
  /* ::: мини-блок: обёртка кнопки «Смотреть онлайн» */
  .scard__footer-btn-wrap{
    order:2; 
    width:100%;   
  }
  /* ::: мини-блок: кнопка «Смотреть онлайн» на всю ширину */
  .scard__btn {
    width: 100%;
    height: 44px;             
    font-size: 14px;
    max-width: none;
    padding: 0 14px;
  }
 
  /* :: Подблок: Кнопка редактирования */
  .scard__edit-icon {
    display: none; /* скрытие иконки редактирования */
  }
}

/* ===========================================
Адаптация до 360px (Средние смартфоны)
=========================================== */
@media screen and (max-width: 360px) {

  /* :: Подблок: Оформление футера карточки */
  /* ::: Мини-блок: прячется количество голосов метаданных IMDB и КП */
  .scard__footer-meta .votes { 
    display: none;
  }
}