/* BebendCo — Mobile fixes (2026-05-11)
   Fix 1: Prevent horizontal scroll caused by drawer-push transform
   Fix 2: Hide Header-actions on mobile, show inside drawer
*/

html {
  overflow-x: hidden;
}

body.mm-pushed {
  /* Disable body transform on mobile — overlay-only, no push effect */
  transform: none !important;
}

/* Hide desktop Header-actions on mobile */
@media (max-width: 767px) {
  .Header-actions {
    display: none !important;
  }

  /* Drawer actions block */
  .Header-drawerActions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  .Header-drawerActions .Button {
    width: 100%;
    justify-content: center;
  }
}

@media (min-width: 768px) {
  .Header-drawerActions {
    display: none !important;
  }
}

/* Fix 3: Hero-tag / Hero-episodeBadge overlap on small screens
   On narrow viewports the badge (top-right absolute) overlaps the
   Hero-tag (first element inside Hero-content at the bottom).
   Move badge to bottom-right on ≤480px so both elements are visible. */
@media (max-width: 480px) {
  .Hero-episodeBadge {
    top: auto;
    bottom: var(--space-3);
    right: var(--space-2);
    font-size: var(--fs-12);
    padding: 6px 10px;
  }
}