:root{
  --iy-navyA:#0b1020;
  --iy-navyB:#141a3a;
  --iy-navyC:#1c0f2e;

  --iy-text: rgba(255,255,255,.92);
  --iy-muted: rgba(255,255,255,.72);

  --iy-gold:#F6C945;
  --iy-accent:#7c3aed;
  --iy-cyan:#22d3ee;

  --iy-ink: rgba(0,0,0,.88);
  --iy-sub: rgba(0,0,0,.62);
  --iy-line: rgba(0,0,0,.08);

  --iy-bg: #f6f7fb;
  --iy-container: min(1180px, calc(100% - 36px));
}

.iy-mhub{
  background:
    radial-gradient(900px 420px at 70% 0%, rgba(120,72,255,.14), transparent 60%),
    radial-gradient(900px 420px at 10% 10%, rgba(246,201,69,.10), transparent 55%),
    var(--iy-bg);
}

.iy-mhub__container{
  width: var(--iy-container);
  margin: 0 auto;
  padding: 26px 0 70px;
}

/* breadcrumb */
.iy-mhub__crumb{
  margin: 0 0 14px 0;
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12.5px;
  color: rgba(0,0,0,.55);
}
.iy-mhub__crumb a{ color: rgba(0,0,0,.62); text-decoration:none; }
.iy-mhub__crumb a:hover{ color: rgba(0,0,0,.86); }
.iy-mhub__sep{ opacity:.45; }
.iy-mhub__current{ color: rgba(0,0,0,.80); font-weight: 800; }

/* hero */
.iy-mhubHero{
  display:grid;
  grid-template-columns: 1fr 420px;
  gap: 18px;
  align-items: start;
  margin-bottom: 18px;
}

.iy-mhubHero__title{
  margin: 0;
  font-size: 28px;
  font-weight: 950;
  letter-spacing: .2px;
  color: var(--iy-ink);
}
.iy-mhubHero__desc{
  margin: 10px 0 0;
  color: rgba(0,0,0,.68);
  line-height: 1.7;
  font-size: 14.5px;
  max-width: 70ch;
}

.iy-mhubHero__chips{
  margin-top: 12px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}

.iy-chip{
  display:inline-flex;
  align-items:center;
  padding: 8px 10px;
  border-radius: 999px;
  text-decoration:none;
  color: rgba(0,0,0,.72);
  font-weight: 850;
  font-size: 12.5px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.85);
  box-shadow: 0 10px 20px rgba(0,0,0,.04);
}
.iy-chip:hover{
  border-color: rgba(246,201,69,.55);
  box-shadow: 0 0 0 3px rgba(246,201,69,.12) inset, 0 12px 22px rgba(0,0,0,.06);
}

.iy-mhubHero__actions{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* buttons */
.iy-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 42px;
  padding: 0 14px;
  border-radius: 14px;
  text-decoration:none;
  font-weight: 950;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  color: rgba(0,0,0,.82);
  box-shadow: 0 12px 24px rgba(0,0,0,.06);
}
.iy-btn--primary{
  border-color: rgba(246,201,69,.65);
  background: rgba(246,201,69,.22);
  color: #0b1020;
  box-shadow: 0 0 0 3px rgba(246,201,69,.12) inset, 0 12px 24px rgba(0,0,0,.06);
}
.iy-btn--ghost{
  border-color: rgba(124,58,237,.22);
  background: rgba(124,58,237,.06);
  color: rgba(124,58,237,.95);
  box-shadow: 0 12px 24px rgba(124,58,237,.08);
}
.iy-btn:hover{ transform: translateY(-1px); }

/* mini card right */
.iy-miniCard{
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(0,0,0,.06);
  overflow:hidden;
  padding: 16px;
}
.iy-miniCard__title{
  font-weight: 950;
  font-size: 16px;
  color: rgba(0,0,0,.86);
}
.iy-miniCard__sub{
  margin-top: 4px;
  color: rgba(0,0,0,.62);
  font-weight: 650;
  font-size: 13.5px;
}

.iy-rowLink{
  margin-top: 12px;
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 12px 12px;
  border-radius: 14px;
  text-decoration:none;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(0,0,0,.015);
}
.iy-rowLink:hover{
  border-color: rgba(124,58,237,.16);
  background: rgba(124,58,237,.05);
  transform: translateY(-1px);
}
.iy-rowLink__icon{
  width: 36px;
  height: 36px;
  display:grid;
  place-items:center;
  border-radius: 12px;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.06);
}
.iy-rowLink__text b{
  display:block;
  color: rgba(0,0,0,.86);
  font-weight: 950;
  font-size: 13.5px;
}
.iy-rowLink__text small{
  display:block;
  margin-top: 2px;
  color: rgba(0,0,0,.62);
  font-weight: 700;
  font-size: 12.5px;
}
.iy-rowLink__arrow{
  margin-left:auto;
  color: rgba(0,0,0,.35);
  font-size: 18px;
  font-weight: 900;
}

.iy-miniCard__all{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  margin-top: 12px;
  font-weight: 950;
  color: rgba(124,58,237,.95);
  text-decoration:none;
}

/* sections */
.iy-mhubSection{
  margin-top: 50px;
}
.iy-secHead{
  display:flex;
  align-items:flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.iy-secTitle{
  margin: 0;
  font-weight: 950;
  font-size: 22px;
  color: rgba(0,0,0,.86);
}
.iy-secSub{
  margin: 6px 0 0;
  color: rgba(0,0,0,.62);
  font-weight: 650;
  font-size: 13.5px;
}
.iy-secLink{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  font-weight: 900;
  font-size: 13px;
  color: rgba(124,58,237,.95);
  text-decoration:none;
  padding: 10px 10px;
  border-radius: 12px;
  border: 1px solid rgba(124,58,237,.18);
  background: rgba(124,58,237,.06);
}
.iy-secLink:hover{ background: rgba(124,58,237,.10); }

/* mood grid */
.iy-moodGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.iy-moodCard{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 18px;
  text-decoration:none;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 24px rgba(0,0,0,.05);
}
.iy-moodCard:hover{
  border-color: rgba(246,201,69,.45);
  box-shadow: 0 0 0 3px rgba(246,201,69,.12) inset, 0 16px 30px rgba(0,0,0,.07);
  transform: translateY(-1px);
}
.iy-moodCard__emoji{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.06);
}
.iy-moodCard__name{
  display:block;
  color: rgba(0,0,0,.88);
  font-weight: 950;
  font-size: 13.5px;
}
.iy-moodCard__hint{
  display:block;
  margin-top: 2px;
  color: rgba(0,0,0,.62);
  font-weight: 700;
  font-size: 12.5px;
}
.iy-moodCard__go{
  margin-left:auto;
  color: rgba(0,0,0,.35);
  font-size: 18px;
  font-weight: 900;
}
.iy-moodCard--all{
  border-style: dashed;
  background: rgba(255,255,255,.85);
}

/* featured movie strip */
.iy-movieStrip{
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
}
.iy-movieMini{
  position: relative;
  display:block;
  border-radius: 18px;
  overflow:hidden;
  background: #0b1020;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
  text-decoration:none;
}
.iy-movieMini__poster{
  width: 100%;
  aspect-ratio: 2/3;
}
.iy-movieMini__poster img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  transition: transform .35s ease;
}
.iy-movieMini:hover img{ transform: scale(1.035); }

.iy-movieMini__overlay{
  position:absolute;
  left: 10px; right: 10px; bottom: 10px;
  height: 86px;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  background:
    linear-gradient(to top, rgba(11,16,32,1) 0%, rgba(11,16,32,.65) 45%, rgba(11,16,32,.40) 80%);
  color: rgba(255,255,255,.92);
}
.iy-movieMini__title{
  font-weight: 900;
  font-size: 12px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 6px;
}
.iy-movieMini__meta{
  font-size: 12.5px;
  color: rgba(255,255,255,.82);
}

/* list cards */
.iy-listGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.iy-listCard{
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(0,0,0,.05);
  padding: 14px;
  text-decoration:none;
}
.iy-listCard:hover{
  border-color: rgba(124,58,237,.16);
  background: rgba(124,58,237,.03);
  transform: translateY(-1px);
}
.iy-listCard__top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.iy-listCard__badge{
  font-size: 12px;
  font-weight: 900;
  color: rgba(124,58,237,.95);
  border: 1px solid rgba(124,58,237,.18);
  background: rgba(124,58,237,.06);
  padding: 6px 10px;
  border-radius: 999px;
}
.iy-listCard__arrow{
  color: rgba(0,0,0,.35);
  font-weight: 950;
}
.iy-listCard__title{
  color: rgba(0,0,0,.88);
  font-weight: 950;
  font-size: 14px;
  line-height: 1.35;
}
.iy-listCard__sub{
  margin-top: 6px;
  color: rgba(0,0,0,.62);
  font-weight: 650;
  font-size: 13px;
  line-height: 1.55;
}

/* tags box */
.iy-tagBox{
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.92);
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(0,0,0,.05);
  padding: 14px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}
.iy-tag{
  display:inline-flex;
  align-items:center;
  padding: 8px 10px;
  border-radius: 999px;
  text-decoration:none;
  color: rgba(0,0,0,.72);
  font-weight: 850;
  font-size: 12.5px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(0,0,0,.02);
}
.iy-tag:hover{
  border-color: rgba(246,201,69,.55);
  box-shadow: 0 0 0 3px rgba(246,201,69,.14) inset;
}

/* CTA */
.iy-mhubCta{
  margin-top: 18px;
}
.iy-mhubCta__card{
  border: 1px solid rgba(124,58,237,.18);
  border-radius: 18px;
  padding: 16px;
  background:
    radial-gradient(600px 220px at 0% 0%, rgba(124,58,237,.08), transparent 60%),
    radial-gradient(600px 220px at 100% 0%, rgba(34,211,238,.08), transparent 60%),
    rgba(255,255,255,.92);
  box-shadow: 0 14px 30px rgba(124,58,237,.08);
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.iy-mhubCta__title{
  font-size: 14.5px;
  font-weight: 950;
  color: rgba(0,0,0,.86);
}
.iy-mhubCta__text{
  margin-top: 6px;
  color: rgba(0,0,0,.70);
  font-weight: 650;
  font-size: 13.5px;
}
.iy-mhubCta__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* responsive */
@media (max-width: 1100px){
  .iy-mhubHero{ grid-template-columns: 1fr 380px; }
  .iy-movieStrip{ grid-template-columns: repeat(5, minmax(0,1fr)); }
  .iy-moodGrid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .iy-listGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 992px){
  .iy-mhubHero{ grid-template-columns: 1fr; }
  .iy-movieStrip{ grid-template-columns: repeat(4, minmax(0,1fr)); }
  .iy-moodGrid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 680px){
  .iy-mhub__container{ padding: 18px 0 60px; }
  .iy-mhubHero__title{ font-size: 22px; }
  .iy-movieStrip{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .iy-moodGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .iy-listGrid{ grid-template-columns: 1fr; }
  .iy-secHead{ align-items:flex-start; flex-direction: column; }
}

@media (max-width: 420px){
  .iy-movieStrip{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* underline guard */
a:hover{ text-decoration: none !important; }


.iy-movieMood{
  margin-top: 4px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  color: rgba(255,255,255,.75);
}