/* ============================================================
   MU MAYA · SLIDER + STATUS BAR POLISH v1
   - El banner principal conserva su imagen completa 2:1.
   - Las miniaturas viven fuera del marco principal.
   - La barra de estado usa estética MU y nunca pisa el slider.
   ============================================================ */

/* ---------- SLIDER: imagen principal independiente ---------- */
.page-home .webzen-hero{
  position:relative;
  padding-top:14px!important;
  padding-bottom:24px!important;
}
.page-home .webzen-hero__shell{
  position:relative!important;
  overflow:hidden!important;
  border-radius:14px!important;
  border:1px solid rgba(220,180,102,.46)!important;
  background:
    radial-gradient(circle at 50% 0%,rgba(51,112,190,.11),transparent 42%),
    #050812!important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.58),
    0 0 0 1px rgba(255,213,132,.05) inset,
    0 0 40px rgba(55,112,188,.08)!important;
}
.page-home .webzen-hero__shell::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:2px;
  z-index:8;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,#62b7ff 28%,#e4bd70 50%,#62b7ff 72%,transparent);
  opacity:.78;
}
.page-home .webzen-hero__slides{
  position:relative!important;
  width:100%!important;
  aspect-ratio:2 / 1!important;
  min-height:0!important;
  overflow:hidden!important;
  background:#050812!important;
}
.page-home .webzen-hero__slides .slick-list,
.page-home .webzen-hero__slides .slick-track,
.page-home .webzen-hero__slide,
.page-home .webzen-hero__slide-link{
  height:100%!important;
  min-height:0!important;
}
.page-home .webzen-hero__slide img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:#050812!important;
  filter:none!important;
  opacity:1!important;
}
.page-home .webzen-hero__slide-link::before{
  display:none!important;
  content:none!important;
}

/* Las miniaturas ya no forman parte del alto del banner principal. */
.page-home .webzen-hero__thumbs-wrap{
  position:relative;
  z-index:3;
  margin-top:10px;
  padding:7px;
  border:1px solid rgba(194,160,96,.24);
  border-radius:12px;
  background:
    linear-gradient(180deg,rgba(17,19,31,.98),rgba(8,10,18,.99)),
    #0a0d16;
  box-shadow:0 14px 32px rgba(0,0,0,.28);
}
.page-home .webzen-hero__thumbs{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;
  background:transparent!important;
  border:0!important;
}
.page-home .webzen-hero__thumb{
  position:relative!important;
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  min-height:70px!important;
  padding:7px 9px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.055)!important;
  border-radius:8px!important;
  background:linear-gradient(145deg,rgba(28,31,44,.92),rgba(12,14,23,.96))!important;
  color:#cbd4e4!important;
  box-shadow:none!important;
  transition:.22s ease!important;
}
.page-home .webzen-hero__thumb::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:2px;
  transform:scaleX(0);
  transform-origin:left;
  background:linear-gradient(90deg,#5db6ff,#e2ba6b);
  transition:transform .22s ease;
}
.page-home .webzen-hero__thumb:hover,
.page-home .webzen-hero__thumb.is-active{
  transform:translateY(-1px);
  color:#fff!important;
  border-color:rgba(226,186,111,.28)!important;
  background:linear-gradient(145deg,rgba(37,43,61,.98),rgba(20,22,34,.98))!important;
  box-shadow:0 7px 16px rgba(0,0,0,.22)!important;
}
.page-home .webzen-hero__thumb:hover::after,
.page-home .webzen-hero__thumb.is-active::after{transform:scaleX(1)}
.page-home .webzen-hero__thumb-image{
  display:block!important;
  width:72px!important;
  height:48px!important;
  overflow:hidden!important;
  border-radius:5px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  background:#070a12!important;
}
.page-home .webzen-hero__thumb-image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
.page-home .webzen-hero__thumb-copy{min-width:0!important}
.page-home .webzen-hero__thumb-copy strong{
  display:block!important;
  font-family:"Philosopher",Georgia,serif!important;
  font-size:13px!important;
  line-height:1.15!important;
  color:#f0e6d3!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.page-home .webzen-hero__thumb-copy small{
  display:block!important;
  margin-top:3px!important;
  font-size:9px!important;
  line-height:1.3!important;
  color:#8794a9!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Flechas más MU: pequeñas y fuera del contenido visual importante. */
.page-home .webzen-hero__arrow{
  width:42px!important;
  height:58px!important;
  border:1px solid rgba(222,185,112,.32)!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,rgba(16,21,32,.90),rgba(6,8,14,.94))!important;
  color:#e7c27b!important;
  text-shadow:0 0 12px rgba(79,168,255,.35)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.25)!important;
}
.page-home .webzen-hero__arrow:hover{
  border-color:rgba(109,190,255,.55)!important;
  color:#fff!important;
  background:linear-gradient(180deg,rgba(26,55,91,.94),rgba(10,18,31,.97))!important;
}

/* ---------- BARRA DE ESTADO SUPERIOR ---------- */
.maya-status-strip.maya-status-strip--mu,
.maya-status-strip{
  position:relative!important;
  z-index:20!important;
  overflow:hidden!important;
  isolation:isolate;
  grid-template-columns:.82fr .9fr 2.2fr 1fr 1fr!important;
  min-height:60px!important;
  margin-top:10px!important;
  margin-bottom:15px!important;
  border:1px solid rgba(211,173,101,.34)!important;
  border-radius:11px!important;
  background:
    radial-gradient(circle at 14% 0%,rgba(54,125,201,.16),transparent 34%),
    radial-gradient(circle at 78% 110%,rgba(148,73,184,.10),transparent 34%),
    linear-gradient(180deg,rgba(15,20,31,.98),rgba(6,9,16,.99))!important;
  box-shadow:
    0 15px 36px rgba(0,0,0,.40),
    inset 0 1px rgba(255,255,255,.025)!important;
}
.maya-status-strip::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:2px;
  z-index:3;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 2%,#459fe9 18%,#d8ae60 50%,#459fe9 82%,transparent 98%);
  box-shadow:0 0 16px rgba(71,158,230,.40);
}
.maya-status-strip::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.24;
  background:
    linear-gradient(120deg,transparent 0 18%,rgba(255,255,255,.028) 18.2% 18.5%,transparent 18.7% 49%,rgba(255,255,255,.018) 49.2% 49.5%,transparent 49.7% 100%);
}
.maya-status-strip__item{
  position:relative!important;
  min-height:60px!important;
  padding:10px 14px!important;
  border-right:1px solid rgba(218,183,116,.10)!important;
  color:#e8edf6!important;
  text-decoration:none!important;
  transition:background .2s ease,box-shadow .2s ease!important;
}
.maya-status-strip__item:hover{
  background:linear-gradient(180deg,rgba(69,116,173,.12),rgba(210,159,78,.05))!important;
  box-shadow:inset 0 -2px rgba(98,177,240,.55)!important;
}
.maya-status-strip__item i,
.maya-status-strip__dot{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  border-radius:50%!important;
  border:1px solid rgba(90,170,235,.28)!important;
  background:radial-gradient(circle at 35% 30%,rgba(74,158,230,.26),rgba(8,15,25,.95))!important;
  color:#72c2ff!important;
  text-shadow:0 0 12px rgba(72,170,243,.7)!important;
  box-shadow:inset 0 0 12px rgba(71,150,220,.08),0 0 12px rgba(0,0,0,.25)!important;
}
.maya-status-strip__dot{
  width:11px!important;
  height:11px!important;
  margin:0 9px!important;
  border:1px solid rgba(90,255,166,.60)!important;
  background:#38df88!important;
  box-shadow:0 0 13px rgba(56,223,136,.75)!important;
}
.maya-status-strip__item small{
  font-size:8px!important;
  line-height:1.2!important;
  letter-spacing:.16em!important;
  color:#78879f!important;
  text-transform:uppercase!important;
}
.maya-status-strip__item strong{
  margin-top:3px!important;
  font-family:"Philosopher",Georgia,serif!important;
  font-size:12px!important;
  line-height:1.2!important;
  letter-spacing:.025em!important;
  color:#eee3cd!important;
  text-shadow:0 1px 8px rgba(0,0,0,.35)!important;
}
.maya-status-strip__item--wide span:last-child{
  color:#73c4ff!important;
  font-weight:800!important;
  font-size:10px!important;
  text-shadow:0 0 10px rgba(72,164,235,.35)!important;
}
.maya-status-strip__item:first-child strong{color:#83e5ae!important}
.maya-status-strip__item:last-child strong{color:#e5bd71!important}

/* Si la barra es hija directa del body en desktop, respeta el panel lateral. */
@media (min-width:1001px){
  body.page-home > .maya-status-strip,
  body > .maya-status-strip{
    width:auto!important;
    max-width:none!important;
    margin-left:300px!important;
    margin-right:28px!important;
  }
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .page-home .webzen-hero__thumbs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .maya-status-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .maya-status-strip__item--wide{grid-column:1/-1!important}
}
@media (max-width:700px){
  .page-home .webzen-hero{padding-top:8px!important}
  .page-home .webzen-hero__slides{aspect-ratio:2 / 1!important}
  .page-home .webzen-hero__thumbs-wrap{padding:5px;margin-top:7px}
  .page-home .webzen-hero__thumbs{grid-template-columns:1fr 1fr!important;gap:5px!important}
  .page-home .webzen-hero__thumb{grid-template-columns:54px minmax(0,1fr)!important;min-height:60px!important;padding:6px!important}
  .page-home .webzen-hero__thumb-image{width:54px!important;height:38px!important}
  .page-home .webzen-hero__thumb-copy strong{font-size:11px!important}
  .page-home .webzen-hero__thumb-copy small{display:none!important}
  .maya-status-strip{margin-left:8px!important;margin-right:8px!important;border-radius:9px!important}
}

/* Fondo atmosférico para slides que no sean exactamente 2:1: mantiene la imagen completa
   y rellena el marco con la misma ilustración desenfocada, sin barras vacías. */
.page-home .webzen-hero__slide-link{overflow:hidden!important;background:#050812!important}
.page-home .webzen-hero__slide-backdrop{
  position:absolute;
  inset:-24px;
  z-index:0;
  display:block;
  background-position:center center;
  background-size:cover;
  filter:blur(20px) brightness(.38) saturate(.85);
  transform:scale(1.08);
  opacity:.88;
  pointer-events:none;
}
.page-home .webzen-hero__slide-link>img{
  position:relative!important;
  z-index:1!important;
}
.page-home .webzen-hero__slide-link::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.03),transparent 75%,rgba(0,0,0,.12));
  box-shadow:inset 0 0 70px rgba(0,0,0,.16);
}