/* =====================================================================
   COMPONENTE · HERO (portada con logo, avance y buscador)
   Celular: logo chico al lado del título, sin subtítulo, 2 accesos.
   ===================================================================== */

.hero{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(600px 300px at 12% 110%,rgba(255,204,46,.18),transparent 70%),
  radial-gradient(500px 260px at 95% -10%,rgba(46,158,85,.25),transparent 70%)}
.hero .wrap{position:relative;display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;align-items:center;padding-top:16px;padding-bottom:18px}

.logo{width:76px;height:auto;display:block;align-self:start;filter:drop-shadow(0 6px 18px rgba(0,0,0,.35))}

.hero-main .season{font-family:var(--display);font-style:italic;font-weight:800;font-size:clamp(22px,7vw,30px);line-height:.95;color:var(--pine);margin:0;padding-right:40px;white-space:nowrap}
.hero-main .sub{display:none;color:#C7CEEA;margin:6px 0 14px}

.track{display:flex;gap:5px;align-items:center;margin:8px 0}
.track i{width:22px;height:7px;border-radius:99px;background:rgba(255,255,255,.18)}
.track i.on{background:var(--pine)}
.track i.next{background:transparent;box-shadow:inset 0 0 0 2px var(--pine)}

.next-line{font-size:14px;color:#fff}
.next-line b{color:var(--pine)}

/* Buscador: ocupa todo el ancho en celular */
.finder{position:relative;margin:12px 0 0 -88px} /* en celular se extiende bajo el logo */
.finder input[type=search]{width:100%;font:inherit;padding:11px 14px 11px 40px;border-radius:99px;border:0;background:#fff;color:#141A33;min-height:44px}
.finder input::placeholder{color:#6A7290}
.finder svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);opacity:.5}
.finder ul{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);list-style:none;margin:0;padding:6px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.25);max-height:280px;overflow:auto}
.finder li button{width:100%;text-align:left;background:none;border:0;padding:10px;border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;gap:8px}
.finder li button:hover,.finder li button.act{background:var(--row)}
.finder li small{color:var(--muted)}
.finder li.none{padding:8px 10px;color:var(--muted)}

/* Accesos rápidos */
.hero-side{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.chip{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-md);padding:8px 12px;text-decoration:none;display:block}
.chip:hover{background:rgba(255,255,255,.13)}
.chip .k{font-size:13px;color:#C7CEEA}
.chip .v{font-family:var(--display);font-weight:700;font-size:20px;line-height:1.15}
.chip .v small{font-family:var(--body);font-size:13px;font-weight:500;color:#C7CEEA}
.chip.pozo .v{color:var(--pine)}
.chip.extra{display:none}

.theme{position:absolute;top:14px;right:16px;z-index:2;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:99px;width:34px;height:34px;cursor:pointer}

@media (min-width:600px){
  .hero .wrap{grid-template-columns:110px minmax(0,1fr);gap:18px;padding-top:22px;padding-bottom:24px}
  .logo{width:110px}
  .hero-main .season{font-size:38px}
  .hero-main .sub{display:block}
  .track{gap:6px}
  .track i{width:26px;height:8px}
  .next-line{font-size:15px}
  .finder{max-width:380px;margin-left:0}
  .hero-side{grid-template-columns:repeat(3,1fr)}
  .chip{padding:10px 14px}
  .chip .v{font-size:22px}
  .chip.extra{display:block}
}

@media (min-width:900px){
  .hero .wrap{grid-template-columns:150px minmax(0,1fr) 260px;gap:28px;padding-bottom:26px}
  .logo{width:150px;align-self:center}
  .hero-main .season{font-size:46px;padding-right:0}
  .finder{margin-top:14px}
  .hero-side{grid-column:3;grid-row:1;grid-template-columns:1fr}
  .chip .v{font-size:24px}
}

/* ---------- Selector de temporada ---------- */
.season-pick{display:inline-flex;align-items:center;gap:8px;margin:8px 0 6px;font-size:13px;color:#C7CEEA}
.season-pick select{font:inherit;font-weight:600;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:var(--r-md);padding:5px 28px 5px 10px;min-height:34px}
.season-pick select option{color:#141A33}
.hero.archive .logo{display:none}
/* Temporadas sin logo propio: el bloque principal ocupa la columna del logo */
.hero.archive .wrap{grid-template-columns:minmax(0,1fr)}
.hero.archive .finder{margin-left:0}
@media (min-width:600px){.hero.archive .wrap{grid-template-columns:minmax(0,1fr)}}
@media (min-width:900px){.hero.archive .wrap{grid-template-columns:minmax(0,1fr) 260px}.hero.archive .hero-side{grid-column:2}}