/* Actual vertical films stay vertical, before and after playback.
   Source frames: YouTube 404x720, local introduction 480x848.
   Load after the legacy media/homepage styles. No invented stills or cropping. */

.pl-refined.pl-home .pl26-films{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
  max-width:980px;
  margin-inline:auto;
  align-items:start;
}
.pl-refined.pl-home .pl26-films .pl26-film-card{
  display:block;
  grid-column:auto;
  min-width:0;
  width:100%;
  max-width:290px;
  justify-self:center;
}
.pl-refined.pl-home .pl26-films .pl26-video-poster,
.pl-refined .yt-buehne[data-yt="NpNXHCJ96FQ"],
.pl-refined .yt-buehne[data-yt="W0Ooo5aGMtI"]{
  position:relative;
  display:block;
  width:min(100%,225px);
  height:auto;
  max-height:none;
  min-height:0;
  aspect-ratio:auto;
  margin-inline:auto;
  padding:0;
  border:1px solid #dce3ed;
  border-radius:16px;
  overflow:hidden;
  background:#17243e;
  color:#243459;
  box-shadow:0 9px 26px #17243e0c;
}
.pl-refined.pl-home .pl26-films .pl26-video-poster>img,
.pl-refined .yt-buehne[data-yt="NpNXHCJ96FQ"]>img,
.pl-refined .yt-buehne[data-yt="W0Ooo5aGMtI"]>img{
  display:block;
  position:static;
  width:100%;
  height:400px;
  max-height:none;
  aspect-ratio:9/16;
  object-fit:contain;
  object-position:center;
  margin:0;
  padding:0;
  background:#17243e;
  transform:none!important;
  transition:none;
}
.pl-refined.pl-home .pl26-films .pl26-video-poster::after,
.pl-refined .yt-buehne[data-yt="NpNXHCJ96FQ"]::after,
.pl-refined .yt-buehne[data-yt="W0Ooo5aGMtI"]::after{
  display:none;
}
/* The caption sits below the complete frame, including any original subtitles. */
.pl-refined.pl-home .pl26-films .pl26-video-poster .pl26-poster-label,
.pl-refined .yt-buehne[data-yt="NpNXHCJ96FQ"] .yt-titel,
.pl-refined .yt-buehne[data-yt="W0Ooo5aGMtI"] .yt-titel{
  display:block;
  position:static;
  inset:auto;
  min-height:64px;
  padding:12px 14px;
  margin:0;
  border-top:1px solid #dce3ed;
  background:#fff;
  color:#243459;
  font-size:15px;
  line-height:1.3;
  font-weight:700;
  text-align:left;
  transform:none;
  box-sizing:border-box;
}
.pl-refined.pl-home .pl26-films .pl26-poster-label small{
  display:block;
  color:#52617a;
  font-size:10px;
  line-height:1.25;
  margin-bottom:5px;
}
/* Faces sit in the upper half of all three verified frames. */
.pl-refined.pl-home .pl26-films .pl26-poster-play,
.pl-refined .yt-buehne[data-yt="NpNXHCJ96FQ"] .yt-play,
.pl-refined .yt-buehne[data-yt="W0Ooo5aGMtI"] .yt-play{
  display:flex!important;
  position:absolute;
  top:338px;
  left:13px;
  right:auto;
  bottom:auto;
  width:46px;
  height:46px;
  align-items:center;
  justify-content:center;
  border:1px solid #ffffffb8;
  border-radius:50%;
  background:#fff;
  color:#243459;
  box-shadow:0 3px 16px #17243e30;
  transform:none!important;
  z-index:2;
  pointer-events:none;
}
.pl-refined.pl-home .pl26-films .pl26-poster-play svg,
.pl-refined .yt-buehne[data-yt="NpNXHCJ96FQ"] .yt-play svg,
.pl-refined .yt-buehne[data-yt="W0Ooo5aGMtI"] .yt-play svg{
  width:21px;
  height:21px;
  margin-left:3px;
}

.pl-refined.pl-home .pl26-films .yt-rahmen,
.pl-refined .yt-rahmen:has(iframe[src*="/embed/NpNXHCJ96FQ"]),
.pl-refined .yt-rahmen:has(iframe[src*="/embed/W0Ooo5aGMtI"]){
  width:min(100%,225px);
  height:auto;
  aspect-ratio:auto;
  max-width:225px;
  margin-inline:auto;
  background:transparent;
}
.pl-refined.pl-home .pl26-films .yt-rahmen>iframe,
.pl-refined .yt-rahmen>iframe[src*="/embed/NpNXHCJ96FQ"],
.pl-refined .yt-rahmen>iframe[src*="/embed/W0Ooo5aGMtI"]{
  display:block;
  width:100%;
  height:400px!important;
  min-height:0;
  max-height:none!important;
  aspect-ratio:9/16;
  border:0;
  border-radius:16px;
  background:#17243e;
}
.pl-refined.pl-home .pl26-film-card>p,
.pl-refined.pl-home .pl26-film-card:first-child>p{
  margin:15px 0 9px;
  font-size:14px;
  line-height:1.55;
}
.pl-refined .mediathek:has(.yt-buehne[data-yt="NpNXHCJ96FQ"]),
.pl-refined .mediathek:has(.yt-buehne[data-yt="W0Ooo5aGMtI"]){
  grid-template-columns:repeat(auto-fit,minmax(225px,1fr));
  align-items:start;
  max-width:760px;
}

/* Only the verified vertical YouTube consultation uses this hero rule.
   Facebook's Aschy film is intentionally left in its existing format. */
.pl-refined .care-video-frame:has([data-media-id="NpNXHCJ96FQ"]),
.pl-refined .care-video-frame:has(iframe[src*="/embed/NpNXHCJ96FQ"]){
  width:min(100%,225px);
  height:400px;
  max-height:none;
  min-height:0;
  aspect-ratio:9/16;
  margin-inline:auto;
  background:#17243e;
}
.pl-refined .care-video-load[data-media-id="NpNXHCJ96FQ"]{
  height:100%;
  width:100%;
  min-height:0;
  padding:0;
  background:#17243e;
}
.pl-refined .care-video-load[data-media-id="NpNXHCJ96FQ"]>img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}
.pl-refined .care-video-load[data-media-id="NpNXHCJ96FQ"]::after{
  display:none;
}
.pl-refined .care-video-load[data-media-id="NpNXHCJ96FQ"] strong,
.pl-refined .care-video-load[data-media-id="NpNXHCJ96FQ"] small{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.pl-refined .care-video-load[data-media-id="NpNXHCJ96FQ"] .care-video-play{
  top:auto;
  right:auto;
  bottom:16px;
  left:13px;
  width:46px;
  height:46px;
  font-size:22px;
  transform:none;
}
.pl-refined .care-video-frame>iframe[src*="/embed/NpNXHCJ96FQ"]{
  width:100%;
  height:100%;
  background:#17243e;
}

@media(max-width:1000px) and (min-width:700px){
  .pl-refined.pl-home .pl26-films{grid-template-columns:repeat(2,minmax(0,1fr));max-width:640px;}
  .pl-refined.pl-home .pl26-film-card:first-child{grid-column:auto;display:block;}
}
@media(max-width:699px){
  .pl-refined.pl-home .pl26-films{grid-template-columns:1fr;max-width:310px;gap:32px;}
  .pl-refined.pl-home .pl26-film-card:first-child{grid-column:auto;display:block;}
  .pl-refined .mediathek:has(.yt-buehne[data-yt]),
  .pl-refined .mediathek:has(.yt-rahmen){grid-template-columns:1fr;}
}
html[data-theme='dark'] .pl-refined .pl26-video-poster .pl26-poster-label,
html[data-theme='dark'] .pl-refined .yt-buehne .yt-titel{
  background:#243459;
  color:#fff;
  border-color:#435574;
}
html[data-theme='dark'] .pl-refined.pl-home .pl26-poster-label small{color:#c6d2e7;}
