/* Citiview Studios — hero refinements (loads last) */

/* Let the reel breathe: natural colour, light shading only where text sits */
.hero__media video, .hero__media img { filter: none; }
.hero__shade {
  background:
    linear-gradient(90deg, rgba(10,10,13,.55) 0%, rgba(10,10,13,.18) 42%, rgba(10,10,13,0) 70%),
    linear-gradient(180deg, rgba(10,10,13,.38) 0%, rgba(10,10,13,0) 22%, rgba(10,10,13,0) 52%, rgba(10,10,13,.78) 88%, var(--ink) 100%);
}
.hero__title { text-shadow: 0 6px 40px rgba(0,0,0,.35); }
.hero .lede { color: rgba(247,245,240,.86); text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.now__bars { gap: 3px; }

/* Game pages for titles whose key art carries the logo: the title is set in type */
.ghero__title { margin: 0 0 22px; max-width: 18ch; text-shadow: 0 8px 40px rgba(0,0,0,.5); }

/* Phones: the reel is a 4:3 panel on top with the headline below it, so no subject ever sits behind text */
@media (max-width: 640px) {
  .hero { height: auto; min-height: 0; display: flex; flex-direction: column; background: var(--ink); }
  .hero__media { position: relative; inset: auto; width: 100%; aspect-ratio: 4 / 3; margin-top: var(--header-h); overflow: hidden; }
  .hero__media video, .hero__media img { transform: none; object-position: 50% 50%; }
  .hero__shade { inset: auto; top: var(--header-h); left: 0; right: 0; aspect-ratio: 4 / 3; background: linear-gradient(180deg, rgba(10,10,13,0) 62%, var(--ink) 100%); }
  .hero__in { height: auto; padding-top: 18px; padding-bottom: 8px; }
  .hero__title { margin: 12px 0 14px; }
}