
/* ==========================================================
   Mobile adaptation for the tvo.lviv.ua page
   Keep this file separate so later manual edits are easy.
   ========================================================== */

@media (max-width: 1180px) {
  .tvo-games__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tvo-nav { display: none; }
  .tvo-hero { min-height: 540px; }
  .tvo-copy__p { font-size: 16px; }
}

@media (max-width: 760px) {
  .tvo-shell,
  .tvo-header__inner { width: min(100% - 28px, var(--tvo-shell)); }

  .tvo-header__inner {
    min-height: 72px;
    grid-template-columns: 1fr auto;
    gap: 14px;
  }

  .tvo-logo img { width: 126px; }
  .tvo-actions { gap: 8px; }
  .tvo-actions .tvo-btn { min-height: 42px; padding: 0 13px; font-size: 11px; border-radius: 7px; }

  .tvo-hero {
    width: min(100% - 28px, var(--tvo-shell));
    min-height: 560px;
    margin-top: 16px;
    border-radius: 14px;
  }
  .tvo-hero__slide { background-position: center right; }
  .tvo-hero__slide::after {
    background:
      linear-gradient(90deg, rgba(5, 6, 14, .97), rgba(5, 6, 14, .78) 62%, rgba(5, 6, 14, .56)),
      linear-gradient(0deg, rgba(5, 6, 14, .82), transparent 48%);
  }
  .tvo-hero__content {
    width: 100%;
    margin-inline: 0;
    padding: 82px 18px 72px;
  }
  .tvo-hero__line {
    font-size: 11px;
    letter-spacing: .14em;
    gap: 8px;
  }
  .tvo-hero__line::before,
  .tvo-hero__line::after { width: 28px; }
  .tvo-hero h1 {
    margin-top: 28px;
    font-size: clamp(26px, 8.5vw, 36px);
    line-height: 1.12;
  }
  .tvo-hero p {
    font-size: 14px;
    line-height: 1.62;
  }
  .tvo-hero__buttons { flex-direction: column; align-items: stretch; }
  .tvo-hero__buttons .tvo-btn { width: 100%; min-height: 52px; }
  .tvo-hero__arrow { display: none; }
  .tvo-hero__dots { bottom: 22px; }

  .tvo-ticker__track { gap: 28px; padding: 14px 0; animation-duration: 18s; }
  .tvo-ticker span { font-size: 12px; }

  .tvo-providers__rail { gap: 10px; }
  .tvo-provider { width: 92px; height: 38px; }

  .tvo-section-head { align-items: flex-start; flex-direction: column; }
  .tvo-section-head h2 { font-size: 22px; }
  .tvo-section-head a { width: 100%; text-align: center; }

  .tvo-games { padding: 38px 0 58px; }
  .tvo-games__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .tvo-game { border-radius: 10px; }
  .tvo-game__badge { top: 10px; left: 10px; padding: 7px 10px; font-size: 10px; }
  .tvo-game__shade { opacity: 1; align-items: end; padding-bottom: 18px; background: linear-gradient(180deg, transparent 42%, rgba(5, 6, 14, .78)); }
  .tvo-game__play { min-width: auto; padding: 11px 18px; font-size: 12px; }
  .tvo-game__name { min-height: 54px; padding: 0 12px; font-size: 14px; }

  .tvo-copy { padding: 54px 0 42px; }
  .tvo-copy__h2 { margin-top: 38px; font-size: 21px; }
  .tvo-copy__h3 { margin-top: 28px; font-size: 17px; }
  .tvo-copy__p { font-size: 15px; line-height: 1.7; }

  .tvo-faq { padding: 48px 0 72px; }
  .tvo-faq h2 { font-size: 22px; }
  .tvo-faq__item summary { padding: 18px 52px 18px 42px; font-size: 15px; }
  .tvo-faq__item summary::before { left: 16px; }
  .tvo-faq__item summary::after { right: 16px; }
  .tvo-faq__item p { padding: 0 18px 20px 42px; font-size: 14px; }

  .tvo-footer { padding-top: 54px; }
  .tvo-footer p { font-size: 14px; }
  .tvo-footer__strip { flex-direction: column; gap: 16px; }
  .tvo-footer__bottom { flex-direction: column; gap: 10px; }
}

@media (max-width: 420px) {
  .tvo-actions .tvo-btn--ghost { display: none; }
  .tvo-games__grid { grid-template-columns: 1fr; }
  .tvo-game__media { aspect-ratio: 1.15 / 1; }
}
