/* ===== landscape phone only: compact page layout ===== */
/* Desktop and portrait are not affected. */

@media (max-width: 940px) and (orientation: landscape) and (max-height: 520px) {
  body {
    overflow-x: hidden !important;
  }

  .page {
    padding-top: 8px !important;
    padding-bottom: 18px !important;
  }

  .page-shell {
    max-width: calc(100vw - 74px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* Шапку делаем низкой и компактной */
  .page-header {
    min-height: auto !important;
    padding: 8px 12px !important;
    margin-bottom: 8px !important;
    border-radius: 18px !important;
  }

  .brand-link,
  .brand-link--wordmark {
    gap: 8px !important;
  }

  .brand-wordmark {
    max-width: 230px !important;
    max-height: 58px !important;
    width: auto !important;
    height: auto !important;
  }

  .brand-subtitle,
  .brand-subtitle--standalone {
    font-size: 12px !important;
    line-height: 1.1 !important;
    margin-top: 2px !important;
  }

  .header-actions {
    gap: 6px !important;
  }

  .site-link {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
    border-radius: 999px !important;
  }

  /* Hero делаем компактным, но не скрываем */
  .hero {
    padding: 10px 12px !important;
    margin-bottom: 8px !important;
    border-radius: 18px !important;
  }

  .hero-kicker {
    font-size: 11px !important;
    margin-bottom: 4px !important;
  }

  .hero-title {
    font-size: clamp(22px, 4.2vw, 32px) !important;
    line-height: 1.05 !important;
    margin-bottom: 4px !important;
  }

  .hero-note {
    font-size: 13px !important;
    line-height: 1.25 !important;
    margin: 0 !important;
  }

  /* Плеер — главный блок */
  .player-card {
    padding: 5px !important;
    margin-top: 8px !important;
    margin-bottom: 10px !important;
    border-radius: 18px !important;
  }

  .player-frame,
  live-video-player,
  video-skin {
    border-radius: 14px !important;
    overflow: hidden !important;
  }

  /* Инфо не скрываем, только делаем компактнее */
  .info-grid {
    gap: 10px !important;
    margin-top: 10px !important;
  }

  .info-card {
    padding: 12px 14px !important;
    border-radius: 18px !important;
  }

  .info-label {
    font-size: 10px !important;
    margin-bottom: 4px !important;
  }

  .info-title {
    font-size: 18px !important;
    line-height: 1.12 !important;
    margin-bottom: 5px !important;
  }

  .info-description {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }

  .footer-note {
    margin-top: 10px !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
  }
}


/* ===== landscape phone only: desktop-like header tune ===== */

@media (max-width: 940px) and (orientation: landscape) and (max-height: 520px) {
  .page-header {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 14px !important;
    padding: 10px 14px !important;
    margin-bottom: 8px !important;

    min-height: 74px !important;
  }

  .brand-link,
  .brand-link--wordmark {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 14px !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;

    text-align: left !important;
  }

  .brand-wordmark {
    width: auto !important;
    max-width: 295px !important;
    max-height: 72px !important;
    height: auto !important;

    margin: 0 !important;
    flex: 0 0 auto !important;
  }

  .brand-subtitle,
  .brand-subtitle--standalone {
    display: inline-flex !important;
    align-items: center !important;

    font-size: clamp(14px, 2.3vw, 17px) !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;

    margin: 0 !important;
    padding-left: 14px !important;

    border-left: 1px solid rgba(255, 255, 255, .34) !important;

    white-space: nowrap !important;
    text-align: left !important;
  }

  .header-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    flex: 0 0 auto !important;
  }

  .site-link {
    min-height: 34px !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }
}