/* P280 — Home Discovery web móvil: identidad editorial del hero P279 de /ver/.
 * Únicamente apariencia. Mantiene DOM, carrusel, fitting JS P269, control de
 * visibilidad, SEO, enlaces, y comportamiento de las aplicaciones inalterados.
 * Este archivo se carga después de P269; no modifica otras páginas/hero catálogo.
 */
@media (max-width:820px) {
  body.pf-web-p280 #pf-uhero-home {
    --pf280-ink:#090910;
    --pf280-violet:#ae89f8;
    --pf280-outline:rgba(181,149,249,.19);
    position:relative!important;
    isolation:isolate!important;
    width:100%!important;
    height:max(100svh,650px)!important;
    min-height:650px!important;
    max-height:none!important;
    margin:0!important;
    overflow:hidden!important;
    background:var(--pf280-ink)!important;
    border-bottom:1px solid rgba(174,134,255,.18)!important;
    border-radius:0 0 24px 24px!important;
    box-shadow:0 18px 35px rgba(0,0,0,.20)!important;
  }
  /* Una ambientación cinematográfica similar a /ver/, con imagen protagonista
     arriba y fundido natural al contenido; no se añaden imágenes ni peticiones. */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-bg {
    inset:0 0 auto!important;
    height:55%!important;
    background-size:cover!important;
    background-position:center 21%!important;
    filter:saturate(1.08) contrast(1.05)!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-overlay {
    inset:0!important;
    background:
      linear-gradient(180deg,rgba(3,3,8,.10) 0%,rgba(6,5,12,.23) 27%,rgba(7,7,12,.53) 44%,rgba(9,9,16,.96) 61%,#090910 77%,#090910 100%),
      linear-gradient(90deg,rgba(4,4,12,.56) 0%,rgba(4,4,12,.12) 66%,transparent 100%),
      radial-gradient(ellipse at 76% 11%,rgba(128,74,218,.15),transparent 56%)!important;
    pointer-events:none!important;
  }
  /* Evita la vieja lámina que oscurecía los botones desde arriba. */
  body.pf-web-p280 #pf-uhero-home::before {
    background:radial-gradient(ellipse at 72% 17%,rgba(135,71,221,.15),transparent 61%)!important;
    pointer-events:none!important;
    z-index:0!important;
  }
  /* Póster de la esquina superior derecha; mantiene su ubicación y su carga lazy. */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-poster {
    top:calc(var(--pfm-header-total,64px) + 14px)!important;
    right:clamp(13px,4.4vw,20px)!important;
    width:clamp(74px,22vw,94px)!important;
    max-width:94px!important;
    padding:3px!important;
    background:rgba(16,12,27,.75)!important;
    border:1px solid rgba(216,192,255,.38)!important;
    border-radius:14px!important;
    box-shadow:0 15px 36px rgba(0,0,0,.58),0 0 0 3px rgba(115,73,191,.13)!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-poster img {
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    aspect-ratio:2/3!important;
    border:0!important;
    border-radius:10px!important;
    object-fit:cover!important;
  }
  /* Panel informativo de Discovery con la misma materialidad que /ver/ P279.
     Conserva el orden, los tamaños calculados por P269 y su regla 1 línea. */
  body.pf-web-p280.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-content {
    z-index:15!important;
    left:clamp(12px,3.6vw,18px)!important;
    right:clamp(12px,3.6vw,18px)!important;
    bottom:max(42px,calc(env(safe-area-inset-bottom,0px) + 36px))!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    padding:13px 13px 14px!important;
    border-radius:19px!important;
    border:1px solid var(--pf280-outline)!important;
    background:linear-gradient(150deg,rgba(29,22,47,.86),rgba(13,13,22,.90) 63%,rgba(10,10,18,.97))!important;
    box-shadow:0 18px 42px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,255,255,.035)!important;
    backdrop-filter:blur(11px)!important;
    -webkit-backdrop-filter:blur(11px)!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-content > .p269-row-score {
    margin-bottom:8px!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .p269-row-score > .pf-uhero-pill {
    border:1px solid rgba(217,194,255,.26)!important;
    border-radius:999px!important;
    background:rgba(15,12,26,.73)!important;
    color:#efe6ff!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .p269-row-score .pf-uhero-pill-rating {
    background:rgba(250,195,74,.11)!important;
    border-color:rgba(242,192,89,.36)!important;
    color:#ffe4a4!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .p269-row-score .pf-uhero-pill-watched {
    color:#ddd2ee!important;
  }
  /* P281: NO imponer un color único a todas las etiquetas. El tipo de
     contenido recupera su paleta original y las etiquetas Smart tienen
     un tono propio sin cambiar tamaños, orden o ajuste a una sola línea. */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill {
    border-radius:999px!important;
  }
  /* Año y etiquetas neutras. */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill:not(.pf-uhero-pill-type):not(.pf-uhero-pill-label) {
    background:rgba(255,255,255,.075)!important;
    border:1px solid rgba(255,255,255,.15)!important;
    color:#e9e3f2!important;
  }
  /* Película = rojo coral, serie = verde, anime = rosa. */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-type.pf-uhero-pill-movie {
    background:rgba(239,68,68,.20)!important;
    border:1px solid rgba(239,68,68,.44)!important;
    color:#fecaca!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > :is(.pf-uhero-pill-type.pf-uhero-pill-serie,.pf-uhero-pill-type.pf-uhero-pill-series,.pf-uhero-pill-type.pf-uhero-pill-tv) {
    background:rgba(16,185,129,.20)!important;
    border:1px solid rgba(16,185,129,.45)!important;
    color:#bbf7d0!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-type.pf-uhero-pill-anime {
    background:rgba(236,72,153,.20)!important;
    border:1px solid rgba(236,72,153,.45)!important;
    color:#fbcfe8!important;
  }
  /* Editorial: popular naranja, tendencia turquesa, top dorado,
     reciente azul, personalizado lila, recomendados violeta. */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label {
    background:rgba(6,182,212,.15)!important;
    border:1px solid rgba(6,182,212,.35)!important;
    color:#a5f3fc!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label--popular {
    background:rgba(249,115,22,.20)!important;
    border-color:rgba(251,146,60,.50)!important;
    color:#fed7aa!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label--trending {
    background:rgba(8,145,178,.21)!important;
    border-color:rgba(34,211,238,.48)!important;
    color:#a5f3fc!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label--top {
    background:rgba(234,179,8,.20)!important;
    border-color:rgba(250,204,21,.50)!important;
    color:#fef08a!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label--recent {
    background:rgba(59,130,246,.19)!important;
    border-color:rgba(96,165,250,.48)!important;
    color:#bfdbfe!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label--personal {
    background:rgba(168,85,247,.20)!important;
    border-color:rgba(192,132,252,.49)!important;
    color:#e9d5ff!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-pills > .pf-uhero-pill-label--recommended {
    background:rgba(129,140,248,.20)!important;
    border-color:rgba(165,180,252,.45)!important;
    color:#c7d2fe!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-title {
    font-weight:950!important;
    letter-spacing:-.045em!important;
    line-height:1.08!important;
    color:#fff!important;
    text-shadow:0 5px 20px rgba(0,0,0,.45)!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-genres > .pf-uhero-genre {
    border:1px solid rgba(255,255,255,.13)!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.045)!important;
    color:#e6dafa!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-ov {
    color:rgba(243,237,251,.74)!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-actions > .pf-uhero-btn-play:not(.pf-uhero-btn-play--disabled) {
    background:linear-gradient(115deg,#7637ce,#a04fe6)!important;
    border:1px solid rgba(218,188,255,.34)!important;
    color:#fff!important;
    border-radius:12px!important;
    box-shadow:0 7px 24px rgba(106,47,194,.29)!important;
  }
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-actions > :is(.pf-uhero-btn-info,.pf-uhero-btn-trailer,.pf-uhero-btn-icon) {
    background:rgba(255,255,255,.055)!important;
    border:1px solid rgba(255,255,255,.13)!important;
    color:#eee6f9!important;
    border-radius:11px!important;
    box-shadow:none!important;
  }
  /* No se ocultan controles existentes (incluido el tráiler condicional). */
  body.pf-web-p280 #pf-uhero-home .pf-uhero-dots {
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.5));
  }
}
@media(max-width:359px){
  body.pf-web-p280 #pf-uhero-home{min-height:670px!important;height:max(100svh,670px)!important}
  body.pf-web-p280.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-content{padding:10px 10px 11px!important}
}
@media(prefers-reduced-motion:reduce){
  body.pf-web-p280 #pf-uhero-home .pf-uhero-slide .pf-uhero-bg{animation:none!important}
}
