:root {
  --title-max: 1180px;
}

.title-page-main {
  width: min(var(--title-max), calc(100% - 40px));
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 4.5rem) 0 6rem;
}

.title-page-main [hidden] {
  display: none !important;
}

.title-loading,
.title-error {
  min-height: 55vh;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  color: var(--muted);
}

.title-error {
  flex-direction: column;
}

.title-error a {
  color: var(--gold);
  text-decoration: none;
  font-weight: 760;
}

.title-detail {
  display: grid;
  grid-template-columns: minmax(240px, 340px) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
}

.title-poster-column {
  position: sticky;
  top: 94px;
}

.title-poster-frame {
  position: relative;
  overflow: hidden;
  aspect-ratio: 2 / 3;
  border: 1px solid var(--line);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(242, 201, 76, 0.08), transparent 48%),
    var(--panel);
  box-shadow: var(--shadow);
}

.title-poster-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.title-poster-missing {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--faint);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.title-copy-column {
  min-width: 0;
  padding-top: 0.35rem;
}

.title-kicker,
.quick-take-label,
.watch-panel-kicker {
  margin: 0;
  color: var(--gold);
  font-size: 0.63rem;
  font-weight: 850;
  letter-spacing: 0.18em;
}

.title-copy-column h1 {
  max-width: 780px;
  margin: 0.35rem 0 0.9rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.8rem, 6vw, 5.4rem);
  font-weight: 500;
  letter-spacing: -0.055em;
  line-height: 0.98;
  text-wrap: balance;
}

.title-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  color: var(--muted);
  font-size: 0.82rem;
}

.title-meta-chip {
  display: inline-flex;
  min-height: 31px;
  align-items: center;
  padding: 0 0.68rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
}

.title-meta-chip.rating-chip {
  border-color: color-mix(in srgb, var(--gold) 46%, var(--line));
  color: var(--gold);
  font-weight: 820;
}

.title-genres {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.85rem;
}

.title-genre {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 0 0.6rem;
  border-radius: 999px;
  background: var(--gold-soft);
  color: var(--gold);
  font-size: 0.65rem;
  font-weight: 780;
}

.quick-take {
  max-width: 760px;
  padding: 1.2rem 1.25rem 1.3rem;
  margin-top: 2rem;
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 88%, transparent);
}

.quick-take p {
  margin: 0.6rem 0 0;
  color: var(--text);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.08rem, 2vw, 1.28rem);
  line-height: 1.65;
}

.watch-panel {
  max-width: 760px;
  padding-top: 2.1rem;
  margin-top: 2rem;
  border-top: 1px solid var(--line);
}

.watch-panel h2 {
  margin: 0.2rem 0 0.9rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -0.035em;
}

.title-watch-list {
  display: grid;
  gap: 0.55rem;
}

.title-watch-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.7rem;
  padding: 0.72rem 0.8rem;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--panel);
}

.title-watch-provider strong,
.title-watch-provider span {
  display: block;
}

.title-watch-provider strong {
  font-size: 0.82rem;
}

.title-watch-provider span {
  color: var(--muted);
  font-size: 0.68rem;
}

.title-watch-badge {
  color: var(--gold);
  font-size: 0.61rem;
  font-weight: 820;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.title-watch-link,
.imdb-detail-link,
.back-home,
.title-nav-link {
  text-decoration: none;
}

.title-watch-link {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 0 0.75rem;
  border: 1px solid var(--gold);
  border-radius: 999px;
  color: var(--gold);
  font-size: 0.68rem;
  font-weight: 800;
  white-space: nowrap;
}

.title-watch-link:hover {
  background: var(--gold-soft);
}

.title-links-row {
  margin-top: 1.3rem;
}

.imdb-detail-link {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 720;
}

.imdb-detail-link:hover {
  color: var(--gold);
}

.back-home {
  justify-self: end;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 720;
}

.back-home:hover,
.title-nav-link:hover {
  color: var(--gold);
}

.title-nav-link {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 0.9rem;
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.875rem;
}

.release-card .poster-wrap[data-listing-ready="true"] {
  cursor: pointer;
}

@media (max-width: 800px) {
  .title-detail {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }

  .title-poster-column {
    position: static;
    width: min(72vw, 310px);
    margin: 0 auto;
  }

  .title-copy-column h1 {
    font-size: clamp(2.6rem, 12vw, 4.2rem);
  }
}

@media (max-width: 560px) {
  .title-page-main {
    width: min(100% - 24px, var(--title-max));
    padding-top: 1.5rem;
  }

  .title-watch-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .title-watch-badge {
    display: none;
  }

  .back-home {
    font-size: 0.72rem;
  }
}


/* Media first, then title context, then editorial and watch options. */
.title-page-main{--title-max:1280px;width:min(var(--title-max),calc(100% - 64px));padding-top:30px}
.title-detail{display:block}
.title-media-row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:14px;align-items:stretch}
.title-poster-column{position:static;width:auto;margin:0;min-width:0}
.title-poster-frame{height:100%;border-radius:16px;box-shadow:0 18px 60px #0004}
.title-trailer-slot{min-width:0;min-height:0}
.title-trailer-slot:not(:has(.listing-trailer)){aspect-ratio:16/9;border-radius:16px;background:var(--panel)}
.title-heading{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:32px;margin:30px 0 32px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.title-heading-copy{min-width:0}
.title-heading h1{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:clamp(34px,4.4vw,62px);line-height:1.06;letter-spacing:-.045em;margin:7px 0 14px;text-wrap:balance;overflow-wrap:anywhere}
.title-meta-row{gap:0;color:var(--muted);font-size:12px}
.title-meta-chip{min-height:0;padding:0;border:0;border-radius:0;background:none}
.title-meta-chip+.title-meta-chip::before{content:"·";margin:0 10px;color:var(--faint)}
.title-genres{margin:15px 0 0;gap:7px}
.title-genre{min-height:28px;padding:4px 11px;font-size:10px;border:1px solid color-mix(in srgb,var(--gold) 23%,var(--line));background:var(--gold-soft);font-weight:650}
.title-rating{min-width:114px;padding-left:26px;border-left:1px solid var(--line)}
.title-rating-label{display:block;color:var(--muted);font-size:9px;letter-spacing:.16em;font-weight:800;margin-bottom:5px}
.title-rating .rating-chip{display:flex;align-items:center;gap:5px;white-space:nowrap}
.title-rating-star{color:var(--gold);font-size:27px;margin-right:4px}
.title-rating strong{font-size:24px;line-height:1;font-weight:750}
.title-rating-scale{font-size:12px;color:var(--muted)}
.title-heading .title-share-slot{min-width:0;max-width:280px}
.title-share-slot .w2w-share-invite{margin:0;padding:0;border:0;background:none}
.title-share-slot .w2w-share-invite p{display:none}
.title-share-slot .w2w-share-detail-buttons{width:100%;flex-wrap:nowrap}
.title-share-slot .w2w-share-primary{justify-content:center}
.title-information-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,370px);gap:clamp(28px,4vw,56px);align-items:start}
.title-copy-column{padding:0}
.quick-take{max-width:none;margin:0;padding:0 0 25px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none}
.quick-take p{font-size:clamp(17px,1.6vw,20px);line-height:1.75;margin-top:11px}
.title-links-row{margin-top:19px}
.title-watch-column{min-width:0}
.watch-panel{max-width:none;padding:23px;margin:0;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,var(--gold-soft),transparent 65%),var(--panel)}
.watch-panel h2{font-size:28px;margin:4px 0 19px}
.title-watch-row{grid-template-columns:minmax(0,1fr) auto;gap:9px;padding:12px 0;border:0;border-radius:0;background:none;border-bottom:1px solid var(--line)}
.title-watch-row:first-child{padding-top:0}
.title-watch-row:last-child{border-bottom:0;padding-bottom:0}
.title-watch-provider strong{font-size:12px;overflow-wrap:anywhere}
.title-watch-provider span{font-size:10px;margin-top:2px}
.title-watch-badge{display:none}
.title-watch-link{position:relative;isolation:isolate;min-height:38px;max-width:100%;padding:7px 12px;font-size:10px;white-space:normal;text-align:center;justify-content:center;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--gold);box-shadow:none}
.title-watch-link::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(115deg,#fff0b4,#f8d46b 39%,#e5b43e 80%,#c89528);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none}
.title-watch-link:hover{background:var(--gold-soft);color:var(--gold);box-shadow:0 0 14px #dba92d18}
.watch-attribution{font-size:9px;line-height:1.65;color:var(--muted);margin:18px 0 0}
@media(max-width:1000px){
.title-page-main{width:calc(100% - 40px);padding-top:25px}.title-heading{gap:22px}.title-heading h1{font-size:44px}.title-rating{padding-left:18px;min-width:100px}
.title-information-row{grid-template-columns:minmax(0,1fr) minmax(275px,320px);gap:28px}.watch-panel{padding:19px}
}
@media(max-width:760px){
.title-heading{grid-template-columns:minmax(0,1fr) auto;gap:22px 18px;margin:25px 0;padding-bottom:24px}.title-heading-copy{grid-column:1/-1}.title-heading h1{font-size:38px}.title-rating{padding-left:0;border-left:0;min-width:0}.title-heading .title-share-slot{justify-self:end}.title-media-row{gap:10px}.title-information-row{grid-template-columns:1fr;gap:28px}.quick-take p{font-size:18px}
}
@media(max-width:600px){
.title-page-main{width:calc(100% - 28px);padding-top:20px;padding-bottom:48px}
.title-heading{margin-top:23px;gap:20px 12px}.title-heading h1{font-size:clamp(30px,8vw,42px);margin-top:6px;margin-bottom:12px}.title-kicker{font-size:8px;letter-spacing:.15em}.title-meta-row{font-size:10px;row-gap:5px}.title-meta-chip+.title-meta-chip::before{margin:0 7px}
.title-rating-label{font-size:8px;letter-spacing:.1em}.title-rating strong{font-size:22px}.title-rating-star{font-size:24px;margin-right:0}.title-rating-scale{font-size:11px}.title-rating .rating-chip{gap:4px}
.title-genres{margin-top:13px;gap:6px}.title-genre{font-size:9px;min-height:27px;padding:4px 9px}
.title-heading .w2w-share-primary{font-size:11px;padding-left:12px;padding-right:12px}.title-heading .w2w-share-more{width:36px;min-width:36px}
.title-poster-frame{border-radius:10px}.title-trailer-slot .listing-trailer-frame{border-radius:10px}.title-trailer-slot .listing-trailer-top{inset:10px 12px auto}.title-trailer-slot .listing-trailer-audio{display:none}.title-trailer-slot .listing-trailer-content{left:12px;right:12px;bottom:12px}.title-trailer-slot .listing-trailer-play{min-height:40px;padding:6px 10px 6px 7px;font-size:11px;gap:7px}.title-trailer-slot .listing-trailer-play-icon{width:24px;height:24px}.title-trailer-slot .listing-trailer-cta-arrow{display:none}
.title-trailer-slot .listing-trailer-unavailable-title{font-size:15px;margin-bottom:6px}.title-trailer-slot .listing-trailer-unavailable-copy{font-size:10px;line-height:1.5}.title-trailer-slot .listing-trailer-unavailable .listing-trailer-frame{min-height:0}
.quick-take p{font-size:17px;line-height:1.7}.watch-panel{padding:20px}.title-watch-link{min-height:40px;font-size:11px}.title-watch-provider strong{font-size:13px}.title-watch-provider span{font-size:11px}
}
@media(max-width:400px){.title-media-row:has(.listing-trailer-unavailable){grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.title-trailer-slot .listing-trailer-unavailable-copy{display:none}}

/* Compact desktop composition keeps the editorial visible with the media. */
.title-page-main{--title-max:1180px;padding-top:20px}
.title-heading{grid-template-columns:minmax(0,1fr) auto;gap:20px;margin:0 0 16px;padding:0;border:0}
.title-heading h1{font-size:clamp(28px,3vw,40px);line-height:1.08;margin:4px 0 8px;letter-spacing:-.035em}
.title-kicker{font-size:8px;letter-spacing:.14em}
.title-meta-row{font-size:11px}
.title-rating{min-width:93px;padding-left:18px}
.title-rating-label{font-size:8px;margin-bottom:3px}
.title-rating strong{font-size:20px}
.title-rating-star{font-size:22px;margin-right:2px}
.title-rating-scale{font-size:10px}
.title-media-row{--media-height:clamp(240px,40vh,340px);height:var(--media-height);grid-template-columns:calc(var(--media-height)*2/3) minmax(0,1fr);gap:12px}
.title-poster-frame{aspect-ratio:auto;border-radius:12px}
.title-trailer-slot .listing-trailer-frame{aspect-ratio:auto;border-radius:12px}
.title-trailer-slot .listing-trailer-play{min-height:44px;padding:7px 15px 7px 9px;font-size:12px;gap:10px}
.title-trailer-slot .listing-trailer-play-icon{width:28px;height:28px}
.title-trailer-slot .listing-trailer-content{left:24px;bottom:23px}
.title-trailer-slot .listing-trailer-top{inset:16px 20px auto}
.title-information-row{margin-top:15px;grid-template-columns:minmax(0,1fr) minmax(270px,320px);gap:30px}
.title-genres{margin:0 0 12px;gap:5px}
.title-genre{min-height:23px;padding:2px 9px;font-size:9px}
.quick-take{padding-bottom:13px;border:0}
.quick-take-label,.watch-panel-kicker{font-size:8px;letter-spacing:.14em}
.quick-take p{font-size:15px;line-height:1.6;margin:6px 0 0}
.title-copy-column .title-share-slot{margin-top:12px;display:inline-block;max-width:100%}
.title-share-slot .w2w-share-primary{font-size:11px;min-height:36px;padding-top:7px;padding-bottom:7px}
.title-share-slot .w2w-share-more{min-height:36px}
.title-links-row{margin-top:10px}
.imdb-detail-link{font-size:10px}
.watch-panel{padding:16px;border-radius:12px}
.watch-panel h2{font-size:23px;margin:3px 0 12px}
.title-watch-row{padding:8px 0}
.title-watch-provider strong{font-size:11px}
.title-watch-provider span{font-size:9px}
.title-watch-link{min-height:32px;padding:5px 10px;font-size:9px;border-radius:9px}
.watch-attribution{font-size:8px;margin-top:12px}
@media(min-width:761px) and (max-height:800px){
.title-page-main{padding-top:16px}.title-heading{margin-bottom:12px}.title-heading h1{font-size:34px}.title-media-row{--media-height:clamp(220px,37vh,290px)}.title-information-row{margin-top:12px}.title-genres{margin-bottom:9px}.quick-take p{font-size:14px;line-height:1.55}
}
@media(max-width:760px){
.title-page-main{padding-top:20px}.title-heading-copy{grid-column:auto}.title-heading{gap:16px;margin:0 0 15px}.title-heading h1{font-size:32px}.title-rating{border-left:1px solid var(--line);padding-left:14px}
.title-media-row{height:auto;grid-template-columns:minmax(0,3fr) minmax(0,8fr)}.title-poster-frame{aspect-ratio:2/3}.title-trailer-slot .listing-trailer-frame{height:100%}.title-information-row{grid-template-columns:1fr;gap:22px;margin-top:15px}.quick-take p{font-size:16px;line-height:1.65}.watch-panel{padding:19px}.title-watch-link{min-height:40px;font-size:11px}
}
@media(max-width:600px){
.title-heading h1{font-size:clamp(25px,6.5vw,32px)}.title-heading{gap:12px}.title-rating{min-width:76px;padding-left:12px}.title-rating strong{font-size:18px}.title-rating-star{font-size:20px}.title-rating-label{font-size:7px}.title-meta-row{font-size:10px}
.title-trailer-slot .listing-trailer-content{left:12px;bottom:12px}.title-trailer-slot .listing-trailer-top{inset:10px 12px auto}.title-trailer-slot .listing-trailer-play{min-height:40px;padding:6px 10px 6px 7px;font-size:11px;gap:7px}.title-trailer-slot .listing-trailer-play-icon{width:24px;height:24px}.title-genres{margin-bottom:12px}.title-watch-provider strong{font-size:12px}.title-watch-provider span{font-size:10px}
}

/* Preserve native media proportions independently of viewport height. */
.title-media-row{height:auto;grid-template-columns:minmax(0,3fr) minmax(0,8fr)}
.title-poster-frame{height:100%;aspect-ratio:2/3}
.title-trailer-slot .listing-trailer-frame{height:auto;aspect-ratio:16/9}
.title-genre-actions{display:flex;align-items:center;justify-content:space-between;gap:14px 24px;margin:12px 0 15px}
.title-genre-actions .title-genres{margin:0;flex:1;min-width:0}
.title-genre-actions .title-share-slot{flex-shrink:0;max-width:100%}
.title-information-row{margin-top:0}
@media(max-width:600px){.title-genre-actions{gap:10px 12px;flex-wrap:wrap;margin:12px 0 15px}.title-genre-actions .title-genres{flex-basis:auto}.title-genre-actions .title-share-slot{margin-left:auto}.title-genre-actions .w2w-share-primary{font-size:10px;padding-left:10px;padding-right:10px}.title-genre-actions .w2w-share-more{width:32px;min-width:32px}}
@media(max-width:400px){.title-media-row:has(.listing-trailer-unavailable){grid-template-columns:minmax(0,3fr) minmax(0,8fr)}}

/* Share starts on the same column boundary as the trailer. */
@media(min-width:601px){
.title-genre-actions{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);column-gap:12px;justify-content:normal}
.title-genre-actions .title-share-slot{justify-self:start;margin-left:0}
}
@media(min-width:601px) and (max-width:760px){.title-genre-actions{column-gap:10px}}
@media(max-width:600px){.title-genre-actions{justify-content:flex-start}.title-genre-actions .title-genres{flex:0 1 auto}.title-genre-actions .title-share-slot{margin-left:0}}
