/* Pro Stylez Cinema seasonal band.
   The hero reuses the theme classes, so only the new furniture is styled here.
   Prefix is pscs- so nothing collides with the theme own psc- rules. */

.pscs-hero-actions{margin:14px 0 0}
.pscs-hero-link{display:inline-flex;align-items:center;gap:8px;color:#c9a84c;font-weight:700;
  text-decoration:none;border-bottom:1px solid rgba(201,168,76,.4);padding-bottom:2px}
.pscs-hero-link:hover{color:#e0c27a;border-bottom-color:#e0c27a}

.pscs-band{padding:44px 0 8px;background:#0d0d0d}
/* Posters first at full width, the secondary tile as a strip under them
   (2026-09-25, Marc's iPad test). Was a 320px tile column beside the row. */
.pscs-band-inner{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:start}
@media (max-width:900px){.pscs-band-inner{gap:26px}}

.pscs-tile{display:block;border-radius:14px;overflow:hidden;text-decoration:none;
  background:#16161c;border:1px solid rgba(255,255,255,.08);transition:border-color .2s,transform .2s}
.pscs-tile:hover{border-color:#c9a84c;transform:translateY(-2px)}
.pscs-tile-media{display:block;position:relative;height:150px;background-size:cover;background-position:center;overflow:hidden}
.pscs-tile-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* Rights credit for the film still on the tile's screen (2026-09-22, Marc:
   "we need... copyrights"). Small corner watermark rather than a block line
   like .pscs-hero-credit -- there's no room below a 150px tile image for a
   separate line without pushing the card copy down. */
.pscs-tile-credit{position:absolute;right:6px;bottom:6px;padding:2px 6px;
  background:rgba(0,0,0,.55);border-radius:4px;font-size:10px;line-height:1.4;
  color:rgba(255,255,255,.75);letter-spacing:.2px}
.pscs-tile-copy{display:block;padding:18px 20px 20px}
.pscs-tile-copy strong{display:block;color:#fff;font-size:18px;line-height:1.25;margin-bottom:6px}
.pscs-tile-copy > span{display:block;color:#b9b9c4;font-size:14px;line-height:1.5}
.pscs-tile-cta{display:inline-flex;gap:6px;margin-top:12px;color:#c9a84c;font-weight:700;font-size:14px}

.pscs-row-title{color:#fff;font-size:24px;margin:0 0 4px}
.pscs-row-note{color:#8b8b96;font-size:13px;margin:0 0 18px}
.pscs-cards{list-style:none;margin:0;padding:0;display:grid;gap:16px;
  grid-template-columns:repeat(4,minmax(0,1fr))}
.pscs-row--small .pscs-cards{grid-template-columns:repeat(3,minmax(0,1fr));max-width:560px}
/* Homepage row: 6 posters in one row, so it never ends on a 4 + 2 gap.
   Drops to 3x2 and 2x3 below, still full rows. */
.pscs-band .pscs-row--full .pscs-cards{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:900px){.pscs-cards,.pscs-band .pscs-row--full .pscs-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.pscs-cards,.pscs-band .pscs-row--full .pscs-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

.pscs-card a{display:block;text-decoration:none}
.pscs-card-art{display:block;aspect-ratio:2/3;border-radius:10px;background:#1d1d24 center/cover no-repeat;
  border:1px solid rgba(255,255,255,.08);transition:border-color .2s;overflow:hidden}
/* Lazy <img> in place of the old background-image (2026-09-22); same crop as background-size:cover. */
.pscs-card-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.pscs-card a:hover .pscs-card-art{border-color:#c9a84c}
.pscs-card-title{display:block;margin-top:8px;color:#e7e7ee;font-size:13px;line-height:1.35}
/* Rating under the title (2026-09-25). */
.pscs-card-rating{display:inline-block;margin-top:5px;padding:1px 7px;border:1px solid rgba(201,168,76,.45);
  border-radius:999px;color:#c9a84c;font-size:11px;font-weight:700;line-height:1.5;letter-spacing:.4px}

/* Secondary tile as a strip: image left, copy right. Stacks on phones. */
@media (min-width:621px){
  .pscs-tile{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);align-items:stretch}
  .pscs-tile-media{height:auto;min-height:150px}
  .pscs-tile-copy{display:flex;flex-direction:column;justify-content:center;padding:22px 28px}
  .pscs-tile-cta{align-self:flex-start}
}
.pscs-row-more{margin:18px 0 0}
.pscs-row-more a{color:#c9a84c;font-weight:700;text-decoration:none;font-size:14px}

@media (prefers-reduced-motion:reduce){
  .pscs-tile,.pscs-card-art{transition:none}
  .pscs-tile:hover{transform:none}
}

/* Rights credit under the hero trust line (the hero image's caption). */
.pscs-hero-credit{margin:6px 0 0;font-size:11px;line-height:1.4;color:rgba(255,255,255,.55);letter-spacing:.2px}

/* Phones (2026-09-22): same full-background hero, slid left so the movie
   screen sits behind the hero text. --pscs-mobile-x comes from the hero
   image's recorded screen position (PSC_Render::mobile_focus_x). */
@media (max-width:767px){
  .psc-home-hero-v2.pscs-hero{background-position:var(--pscs-mobile-x, center) center}
}
