/* TV PLAY V1.18 — carrusel de plataformas con movimiento continuo.
   SVG de Simple Icons / marcas de sus respectivos titulares. 
   El carrusel informa plataformas del reproductor, no número de conexiones.
*/
.platform-marquee{
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:100%;
  overflow:hidden;
  margin-top:14px;
  padding:16px 0 26px;
  border-top:1px solid rgba(42,78,117,.43);
  background:
    radial-gradient(ellipse 58% 120% at 0% 70%,rgba(28,103,155,.13),transparent 78%),
    radial-gradient(ellipse 61% 100% at 100% 20%,rgba(37,74,142,.14),transparent 80%);
}
.platform-marquee-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:15px;
}
.platform-eyebrow{
  color:#79dfee;
  font-size:10px;
  font-weight:850;
  letter-spacing:2px;
}
.platform-marquee-heading a{
  color:#a8dcf1;
  font-size:12px;
  font-weight:760;
  text-decoration:underline;
  text-underline-offset:4px;
}
.platform-marquee-heading a span{margin-left:5px}
.platform-marquee-heading a:hover{color:#ecfdff}
.platform-marquee-heading a:focus-visible{outline:3px solid #73e4f3;outline-offset:4px;border-radius:4px}
.platform-marquee-window{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:4px;
  overflow:hidden;
  padding:4px 0;
  width:100%;
}
.platform-marquee-window::before,
.platform-marquee-window::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:3;
  top:0;
  bottom:0;
  width:min(7vw,96px);
}
.platform-marquee-window::before{left:0;background:linear-gradient(90deg,#081527,rgba(8,21,39,0))}
.platform-marquee-window::after{right:0;background:linear-gradient(270deg,#081527,rgba(8,21,39,0))}
.platform-marquee-track{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  width:max-content;
  transform:translate3d(0,0,0);
  will-change:transform;
}
.platform-marquee-left{animation:tvplayPlatformLeft 37s linear infinite}
.platform-marquee-right{animation:tvplayPlatformRight 39s linear infinite}
@keyframes tvplayPlatformLeft{to{transform:translate3d(-50%,0,0)}}
@keyframes tvplayPlatformRight{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
.platform-marquee-window:hover .platform-marquee-track,
.platform-marquee-window:focus-within .platform-marquee-track{animation-play-state:paused}
.platform-marquee-set{
  box-sizing:border-box;
  list-style:none;
  display:flex;
  align-items:center;
  flex:0 0 auto;
  gap:clamp(22px,3.4vw,54px);
  margin:0;
  padding:0 clamp(22px,3.4vw,54px) 0 0;
}
.platform-entry{
  box-sizing:border-box;
  flex:0 0 auto;
  min-width:136px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  height:69px;
  padding:7px 2px;
  white-space:nowrap;
  user-select:none;
}
.platform-mark{
  display:block;
  width:36px;
  height:36px;
  flex:0 0 auto;
  object-fit:contain;
}
.platform-name{
  color:#ddeaf7;
  font-size:25px;
  font-weight:750;
  letter-spacing:-.85px;
  line-height:1.05;
}
.platform-name-samsung{
  color:#7ab7f4;
  font-size:24px;
  text-transform:uppercase;
  font-weight:850;
  font-style:italic;
  letter-spacing:-1.1px;
}
.platform-name-android{color:#74e7af}
.platform-name-androidtv{color:#dceefd}
.platform-name-roku{color:#b78bf6;font-weight:870;font-size:28px}
.platform-name-lg{font-size:22px;font-weight:670;color:#d9e0ed}
.platform-name-appletv{font-weight:700;font-size:27px}
.platform-name-macos{font-weight:720;font-size:23px}
.platform-name-linux{font-size:25px;color:#e4edf5}
.platform-name-ios{font-size:27px}
.platform-text-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  color:#eaf5ff;
  line-height:1;
  white-space:nowrap;
}
.platform-text-vidaa{
  font-family:Arial,sans-serif;
  font-weight:500;
  letter-spacing:1.7px;
  font-size:31px;
  color:#e54dbe;
}
.platform-text-firetv{
  font-size:35px;
  letter-spacing:-1.2px;
  font-weight:470;
  color:#f78c48;
  font-family:Arial,sans-serif;
}
.platform-text-firetv span{font-weight:790;font-size:25px;color:#f4f8fc;margin-left:2px}
.platform-text-windows{
  color:#138bdf;
  font-size:39px;
  line-height:.75;
  font-family:Arial,sans-serif;
}
.platform-name-windows{color:#5ab0f4;font-size:25px}
.platform-text-vega{
  color:#e3eaf5;
  font-size:28px;
  font-weight:850;
  letter-spacing:-1.1px;
}
.platform-text-xbox{
  display:grid;
  place-items:center;
  height:40px;
  width:40px;
  border-radius:50%;
  border:2px solid #39a83c;
  color:#4ec74e;
  font-size:30px;
  font-weight:750;
}
.platform-name-xbox{color:#78d576;font-size:26px}
.platform-marquee-note{
  font-size:11px;
  line-height:1.65;
  color:#7e97b5;
  margin-top:12px;
}
@media(max-width:900px){
  .platform-marquee{padding-top:15px}
  .platform-entry{min-width:115px;height:60px;gap:9px}
  .platform-mark{width:30px;height:30px}
  .platform-name{font-size:21px}
  .platform-name-samsung,.platform-name-macos,.platform-name-lg{font-size:19px}
  .platform-text-vidaa{font-size:25px}
  .platform-text-firetv{font-size:29px}
  .platform-text-firetv span{font-size:22px}
  .platform-text-vega{font-size:24px}
  .platform-name-roku{font-size:24px}
}
@media(max-width:600px){
  .platform-marquee{margin-top:12px;padding-top:13px;padding-bottom:18px}
  .platform-marquee-heading{margin-bottom:7px;gap:9px}
  .platform-eyebrow{font-size:9px;letter-spacing:1.4px}
  .platform-marquee-heading a{font-size:11px}
  .platform-marquee-window{gap:3px}
  .platform-entry{min-width:99px;height:53px;gap:8px}
  .platform-mark{width:27px;height:27px}
  .platform-name{font-size:19px;letter-spacing:-.5px}
  .platform-name-samsung{font-size:17px}
  .platform-name-roku{font-size:22px}
  .platform-name-lg{font-size:16px}
  .platform-name-ios{font-size:20px}
  .platform-name-windows{font-size:18px}
  .platform-text-vidaa{font-size:24px}
  .platform-text-firetv{font-size:26px}
  .platform-text-firetv span{font-size:19px}
  .platform-text-windows{font-size:30px}
  .platform-text-vega{font-size:21px}
  .platform-text-xbox{width:30px;height:30px;font-size:22px}
  .platform-name-xbox{font-size:20px}
  .platform-marquee-note{margin-top:8px;font-size:10px;line-height:1.55}
  .platform-marquee-left{animation-duration:32s}
  .platform-marquee-right{animation-duration:34s}
}
@media(prefers-reduced-motion:reduce){
  .platform-marquee-window{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#305d81 #0b1b33}
  .platform-marquee-window::before,.platform-marquee-window::after{display:none}
  .platform-marquee-track{transform:none!important;animation:none!important;will-change:auto}
  .platform-marquee-set[aria-hidden="true"]{display:none}
}

/* Wordmarks that already include the platform name must not be repeated. */
.platform-mark.platform-wordmark{height:42px;width:96px;max-width:none;object-fit:contain}
.platform-mark.platform-wordmark-appletv{width:94px}
.platform-mark.platform-wordmark-samsung{width:117px}
.platform-mark.platform-wordmark-ios{width:58px}
.platform-mark.platform-wordmark-roku{width:91px}
.platform-mark.platform-wordmark-macos{width:100px}
@media(max-width:900px){
 .platform-mark.platform-wordmark{height:36px}
 .platform-mark.platform-wordmark-appletv{width:84px}
 .platform-mark.platform-wordmark-samsung{width:104px}
 .platform-mark.platform-wordmark-ios{width:50px}
 .platform-mark.platform-wordmark-roku{width:82px}
 .platform-mark.platform-wordmark-macos{width:89px}
}
@media(max-width:600px){
 .platform-mark.platform-wordmark{height:32px}
 .platform-mark.platform-wordmark-appletv{width:72px}
 .platform-mark.platform-wordmark-samsung{width:91px}
 .platform-mark.platform-wordmark-ios{width:42px}
 .platform-mark.platform-wordmark-roku{width:73px}
 .platform-mark.platform-wordmark-macos{width:78px}
}
