#page-home2 {
  background: linear-gradient(180deg, #f8fafc 0%, #f3f6fb 100%);
  border-radius: 18px;
  padding-bottom: 28px;
}

#page-home2 .home-section {
  margin-bottom: 0;
}

#page-home2 .home-sections {
  display: flex;
  flex-direction: column;
  gap: 44px;
  margin-top: 32px;
}

#page-home2 .ms_heading h2 {
  color: #0f172a;
}

#page-home2 .ms_heading .veiw_all a {
  color: #3b82f6;
  font-weight: 600;
}

#page-home2 .home2-review-box,
#page-home2 .home2-tracks-card,
#page-home2 .home2-artist-card {
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

#page-home2 .home2-info-hub {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 14px;
  background: #eef2f7;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
}

#page-home2 .home2-info-col {
  background: #fff;
  border-radius: 14px;
  padding: 12px 12px 14px;
  border: 1px solid #e8ecf4;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
  min-width: 0;
}

#page-home2 .home2-info-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

#page-home2 .home2-info-heading h2 {
  margin: 0;
  font-size: 1.05rem;
  color: #0f172a;
  letter-spacing: -0.02em;
}

#page-home2 .home2-info-heading a {
  font-size: 12px;
  font-weight: 500;
  color: #2563eb;
  text-decoration: none;
  white-space: nowrap;
}

#page-home2 .home2-info-heading a:hover {
  color: #2563eb;
  text-decoration: underline;
}

#page-home2 .home2-concert-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#page-home2 .home2-concert-row {
  display: flex;
  align-items: stretch;
  gap: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  text-decoration: none;
  color: inherit;
  background: #fff;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  transition: box-shadow .15s ease, transform .15s ease;
}

#page-home2 .home2-concert-row:hover {
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.1);
  transform: translateY(-1px);
}

#page-home2 .home2-concert-datebox {
  flex: 0 0 56px;
  background: #1e293b;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 8px 4px;
  text-align: center;
  line-height: 1.1;
}

#page-home2 .home2-concert-datebox-wd {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  opacity: 0.9;
}

#page-home2 .home2-concert-datebox-day {
  font-size: 18px;
  font-weight: 800;
  margin: 2px 0;
}

#page-home2 .home2-concert-datebox-mon {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  opacity: 0.88;
}

#page-home2 .home2-concert-main {
  flex: 1;
  min-width: 0;
  padding: 10px 10px 10px 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

#page-home2 .home2-concert-main h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#page-home2 .home2-concert-venue {
  margin: 0;
  font-size: 12px;
  color: #64748b;
  line-height: 1.3;
}

#page-home2 .home2-concert-icons {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  color: #94a3b8;
  font-size: 12px;
}

#page-home2 .home2-concert-icons img {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #e2e8f0;
}

#page-home2 .home2-concert-pill {
  flex: 0 0 auto;
  align-self: center;
  margin-right: 10px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

#page-home2 .home2-concert-pill.home-mini-badge--community {
  background: #dcfce7;
  color: #166534;
}

#page-home2 .home2-concert-pill.home-mini-badge--goout {
  background: #dbeafe;
  color: #1d4ed8;
}

#page-home2 .home2-news-featured {
  display: block;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}

#page-home2 .home2-news-featured-img {
  position: relative;
  aspect-ratio: 16 / 10;
  background: #e2e8f0;
}

#page-home2 .home2-news-featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#page-home2 .home2-news-featured-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 12px;
  background: linear-gradient(180deg, transparent 0%, rgba(15, 23, 42, 0.82) 100%);
}

#page-home2 .home2-news-site {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.92);
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

#page-home2 .home2-news-featured-overlay h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#page-home2 .home2-news-featured-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  background: #fff;
  font-size: 11px;
  color: #64748b;
}

#page-home2 .home2-news-author {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #334155;
  min-width: 0;
}

#page-home2 .home2-news-author img {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}

#page-home2 .home2-news-share {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
}

#page-home2 .home2-news-compact {
  display: block;
  margin-top: 10px;
  padding: 8px 0 0;
  border-top: 1px solid #f1f5f9;
  text-decoration: none;
  color: inherit;
}

#page-home2 .home2-news-compact h4 {
  margin: 0 0 2px;
  font-size: 12px;
  font-weight: 700;
  color: #0f172a;
}

#page-home2 .home2-news-compact-meta {
  font-size: 10px;
  color: #94a3b8;
}

#page-home2 .home2-chart-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#page-home2 .home2-chart-row {
  display: flex;
  align-items: stretch;
  gap: 10px;
  padding: 8px 10px 8px 0;
  border-radius: 12px;
  border: 1px solid #e8ecf4;
  background: #fff;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
  position: relative;
  overflow: hidden;
  transition: box-shadow .15s ease;
}

#page-home2 .home2-chart-row::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, #22c55e, #16a34a);
  border-radius: 12px 0 0 12px;
}

#page-home2 .home2-chart-row:hover {
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

#page-home2 .home2-chart-collage {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 2px;
  border-radius: 8px;
  overflow: hidden;
  margin-left: 6px;
  background: #e2e8f0;
}

#page-home2 .home2-chart-collage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#page-home2 .home2-chart-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  padding: 2px 0;
}

#page-home2 .home2-chart-body h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#page-home2 .home2-chart-author {
  margin: 0;
  font-size: 11px;
  color: #64748b;
}

#page-home2 .home2-chart-side {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  padding: 2px 4px 2px 0;
  font-size: 10px;
  color: #64748b;
}

#page-home2 .home2-chart-side > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

#page-home2 .home2-chart-stat {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-weight: 600;
}

#page-home2 .home-hero {
  position: relative;
  margin: 8px 0 20px;
  border-radius: 24px;
  overflow: hidden;
  min-height: 245px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: #0a1628;
}

#page-home2 .home-hero-bg {
  position: absolute;
  inset: 0;
  background-color: #0a1628;
  background-image:
    linear-gradient(115deg, rgba(7, 16, 39, 0.78) 0%, rgba(10, 28, 53, 0.5) 42%, rgba(7, 16, 39, 0.72) 100%),
    radial-gradient(ellipse 120% 80% at 50% 0%, rgba(255, 255, 255, 0.08), transparent 55%),
    url("{{ base }}image/Gemini_Generated_Image_nlfpt4nlfpt4nlfp.png");
  background-size: cover, cover, cover;
  background-position: center, center, center;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 0;
}

#page-home2 .home-hero-floats {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

#page-home2 .home-hero-float {
  position: absolute;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.12);
  box-shadow: 0 8px 22px rgba(2, 6, 23, 0.28);
  transform: rotate(-8deg);
}

#page-home2 .home-hero-float-1 { width: 18px; height: 18px; left: 4%; top: 22%; }
#page-home2 .home-hero-float-2 { width: 13px; height: 13px; left: 10%; top: 12%; transform: rotate(12deg); }
#page-home2 .home-hero-float-3 { width: 15px; height: 15px; right: 6%; top: 18%; transform: rotate(10deg); }
#page-home2 .home-hero-float-4 { width: 18px; height: 18px; right: 3%; top: 38%; transform: rotate(-14deg); }
#page-home2 .home-hero-float-5 { width: 12px; height: 12px; right: 11%; bottom: 20%; transform: rotate(10deg); }
#page-home2 .home-hero-float-6 { width: 16px; height: 16px; right: 4%; bottom: 14%; transform: rotate(-12deg); }

#page-home2 .home-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 680px;
  margin: 0 auto;
  padding: 22px 18px 36px;
  text-align: center;
}

#page-home2 .home-hero-pretitle span {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .01em;
  color: rgba(255, 255, 255, 0.86);
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  padding: 4px 12px;
  margin-bottom: 10px;
}

#page-home2 .home-hero-title {
  margin: 0;
  font-size: clamp(26px, 3.2vw, 42px);
  line-height: 1.12;
  font-weight: 800;
  color: #fff;
  text-shadow: 0 3px 22px rgba(0, 0, 0, 0.45);
}

#page-home2 .home-hero-subtitle {
  margin: 6px auto 16px;
  font-size: 16px;
  line-height: 1.35;
  color: rgba(241, 245, 249, 0.96);
  max-width: 620px;
}

#page-home2 .home-hero-btns {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

#page-home2 .home-hero-btn {
  min-width: 220px;
  padding: 12px 14px;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-decoration: none;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.3);
}

#page-home2 .home-hero-btn-primary {
  background: linear-gradient(95deg, #f97316 0%, #fb923c 100%);
}

#page-home2 .home-hero-btn-secondary {
  background: linear-gradient(95deg, #15803d 0%, #22c55e 100%);
}

#page-home2 .home-hero-btn-icon {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.16);
  flex-shrink: 0;
}

#page-home2 .home-hero-btn-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  line-height: 1.2;
  font-size: 14px;
  font-weight: 700;
}

#page-home2 .home-hero-btn-tag {
  display: inline-flex;
  margin-left: 2px;
  padding: 3px 7px;
  border-radius: 0;
  font-size: 9px;
  letter-spacing: .03em;
  text-transform: uppercase;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

#page-home2 .home-hero-note {
  margin: 12px 0 0;
  color: rgba(241, 245, 249, 0.88);
  font-size: 12px;
}

@media (max-width: 991px) {
  #page-home2 .home2-info-hub {
    grid-template-columns: 1fr;
  }
}

#page-home2 .home2-reviews-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 12px;
}

#page-home2 .home2-reviews-heading h2 {
  margin: 0;
  flex: 1 1 auto;
  min-width: min(100%, 200px);
}

#page-home2 .home2-reviews-heading-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 14px;
  flex: 1 1 auto;
}

#page-home2 .home2-reviews-heading-actions .home2-review-tabs {
  padding: 0;
  margin: 0;
}

#page-home2 .home2-reviews-heading-actions .veiw_all {
  flex-shrink: 0;
  white-space: nowrap;
}

#page-home2 .home2-review-box {
  border: 1px solid #e6e8ee;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  padding: 12px;
}

#page-home2 .home2-review-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

#page-home2 .home2-review-tab {
  font-size: 12px;
  color: #4b5563;
  border: 1px solid #e2e8f0;
  border-radius: 0;
  padding: 7px 14px;
  background: #f8fafc;
  font-weight: 600;
  cursor: pointer;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}

#page-home2 .home2-review-tab:hover:not(.is-active) {
  color: #65B24C;
  border-color: #65B24C;
  background: #f0faf0;
}

#page-home2 .home2-review-tab.is-active {
  color: #fff;
  background: #65B24C;
  border-color: #65B24C;
  box-shadow: none;
}

#page-home2 .home2-review-panel {
  display: none;
}

#page-home2 .home2-review-panel.is-active {
  display: block;
}

#page-home2 .home2-review-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

#page-home2 .home2-review-card {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  min-height: 142px;
  text-decoration: none;
  color: #fff;
  background: #d1d5db;
  box-shadow: 0 10px 20px rgba(15, 23, 42, 0.18);
  display: block;
  transition: box-shadow .25s ease, transform .2s ease;
}

#page-home2 .home2-review-card:hover {
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.26);
  transform: translateY(-2px);
}

#page-home2 .home2-review-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1);
  transition: transform .35s ease;
}

#page-home2 .home2-review-card:hover img {
  transform: scale(1.05);
}

#page-home2 .home2-review-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(2, 6, 23, 0.2) 0%, rgba(2, 6, 23, 0.72) 100%);
  z-index: 1;
  transition: background .3s ease, opacity .3s ease;
}

#page-home2 .home2-review-card:hover::before {
  background: linear-gradient(180deg, rgba(2, 6, 23, 0.28) 0%, rgba(2, 6, 23, 0.86) 100%);
}

#page-home2 .home2-review-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 142px;
  padding: 10px;
  padding-bottom: 36px;
}

#page-home2 .home2-review-content > .home2-review-title {
  order: 4;
}

#page-home2 .home2-review-content > .home2-review-sub {
  order: 3;
}

#page-home2 .home2-review-content > .home2-review-author {
  order: 2;
}

#page-home2 .home2-review-content > .home2-score-badge {
  order: 1;
}

#page-home2 .home2-review-content > .home2-review-hover-excerpt {
  order: 5;
}

#page-home2 .home2-review-title {
  font-size: 30px;
  line-height: 1.25;
  font-weight: 700;
  margin: 0 0 2px;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.45);
}

#page-home2 .home2-review-sub {
  margin: 0 0 4px;
  font-size: 24px;
  color: rgba(255, 255, 255, 0.92);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
  line-height: 1.25;
}

#page-home2 .home2-review-author {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 500;
  color: #cccccc;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
  line-height: 1.35;
}

#page-home2 .home2-review-hover-excerpt {
  margin: 0 0 8px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.95);
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55);
  transition: max-height .32s ease, opacity .22s ease, margin .22s ease;
}

#page-home2 .home2-review-card:hover .home2-review-hover-excerpt {
  max-height: 4.5em;
  opacity: 1;
}

#page-home2 .home2-score-badge {
  margin-left: auto;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 10px;
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  padding: 6px 10px;
  color: #fff;
  background: rgba(255, 255, 255, 0.28);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

#page-home2 .home2-tracks-card {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}

#page-home2 .home2-track-row {
  display: grid;
  grid-template-columns: 48px minmax(0, 1.35fr) minmax(0, 0.95fr) minmax(120px, 0.85fr) 76px 20px 52px;
  align-items: center;
  gap: 10px 12px;
  padding: 12px 16px 12px 14px;
  border-bottom: 1px solid #eef2f7;
  text-decoration: none;
  color: inherit;
  transition: background .15s ease;
}

#page-home2 .home2-track-row:last-child {
  border-bottom: 0;
}

#page-home2 .home2-track-row:hover {
  background: #fafbfd;
}

#page-home2 .home2-track-rank {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1;
}

#page-home2 .home2-track-rank-num {
  position: relative;
  z-index: 0;
  min-width: 34px;
  text-align: center;
}

#page-home2 .home2-track-rank-num::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  z-index: -1;
  opacity: 0;
}

#page-home2 .home2-track-rank--1 .home2-track-rank-num::before {
  opacity: 1;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.35) 0%, rgba(59, 130, 246, 0) 72%);
}

#page-home2 .home2-track-rank--2 .home2-track-rank-num::before {
  opacity: 1;
  background: radial-gradient(circle, rgba(234, 179, 8, 0.38) 0%, rgba(234, 179, 8, 0) 72%);
}

#page-home2 .home2-track-rank--3 .home2-track-rank-num::before {
  opacity: 1;
  background: radial-gradient(circle, rgba(148, 163, 184, 0.45) 0%, rgba(148, 163, 184, 0) 72%);
}

#page-home2 .home2-track-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

#page-home2 .home2-track-cover {
  position: relative;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}

#page-home2 .home2-track-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#page-home2 .home2-track-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111827'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E");
  background-size: 12px 12px;
  background-position: 55% 50%;
  background-repeat: no-repeat;
}

#page-home2 .home2-track-titles {
  min-width: 0;
}

#page-home2 .home2-track-title {
  margin: 0 0 2px;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#page-home2 .home2-track-artist {
  margin: 0;
  font-size: 12px;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#page-home2 .home2-track-album {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

#page-home2 .home2-track-album-duo {
  position: relative;
  flex: 0 0 44px;
  width: 44px;
  height: 36px;
}

#page-home2 .home2-track-album-pic {
  position: absolute;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  overflow: hidden;
  border: 2px solid #fff;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.1);
  background: #f1f5f9;
}

#page-home2 .home2-track-album-pic:first-child {
  left: 0;
  top: 2px;
  z-index: 1;
}

#page-home2 .home2-track-album-pic--2 {
  left: 14px;
  top: 6px;
  z-index: 0;
}

#page-home2 .home2-track-album-pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#page-home2 .home2-track-album-name {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: #0f172a;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#page-home2 .home2-track-score-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

#page-home2 .home2-track-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  padding: 4px 9px 4px 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}

#page-home2 .home2-track-badge-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  align-items: center;
  justify-content: center;
}

#page-home2 .home2-track-badge-icon svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
}

#page-home2 .home2-track-badge--elite {
  background: linear-gradient(135deg, #16a34a, #15803d);
}

#page-home2 .home2-track-badge--gold {
  background: linear-gradient(135deg, #ca8a04, #a16207);
}

#page-home2 .home2-track-badge--silver {
  background: linear-gradient(135deg, #64748b, #475569);
}

#page-home2 .home2-track-badge--amber {
  background: linear-gradient(135deg, #eab308, #ca8a04);
}

#page-home2 .home2-track-badge--coral {
  background: linear-gradient(135deg, #f97316, #dc2626);
}

#page-home2 .home2-track-score-bar {
  flex: 1;
  min-width: 48px;
  height: 5px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}

#page-home2 .home2-track-score-bar > span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  transition: width 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}

#page-home2 .home2-track-score-bar[data-home2-bar].is-ready > span {
  width: var(--home2-bar-pct, 0%) !important;
}

#page-home2 .home2-track-row--elite .home2-track-score-bar > span {
  background: linear-gradient(90deg, #22c55e, #16a34a);
}

#page-home2 .home2-track-row--gold .home2-track-score-bar > span {
  background: linear-gradient(90deg, #eab308, #ca8a04);
}

#page-home2 .home2-track-row--silver .home2-track-score-bar > span {
  background: linear-gradient(90deg, #94a3b8, #64748b);
}

#page-home2 .home2-track-row--amber .home2-track-score-bar > span {
  background: linear-gradient(90deg, #facc15, #eab308);
}

#page-home2 .home2-track-row--coral .home2-track-score-bar > span {
  background: linear-gradient(90deg, #fb923c, #ef4444);
}

#page-home2 .home2-track-trend {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
}

#page-home2 .home2-track-trend--up {
  color: #16a34a;
}

#page-home2 .home2-track-trend--down {
  color: #dc2626;
}

#page-home2 .home2-track-trend--flat {
  color: #94a3b8;
  font-weight: 600;
}

#page-home2 .home2-track-trend svg {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
}

#page-home2 .home2-track-sep {
  text-align: center;
  color: #cbd5e1;
  font-size: 14px;
  font-weight: 400;
}

#page-home2 .home2-track-comments {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
}

#page-home2 .home2-track-comments svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  stroke: #94a3b8;
  fill: none;
}

#page-home2 .home2-albums-section .ms_heading h2 {
  font-size: clamp(1.05rem, 1.35vw, 1.32rem);
  color: #0f172a;
  letter-spacing: -0.02em;
}

#page-home2 .home2-for-you-subtitle {
  margin: -4px 0 14px;
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
  line-height: 1.45;
  max-width: 52rem;
}

#page-home2 .home2-albums-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 10px;
}

#page-home2 .home2-album-card {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  min-height: 0;
  text-decoration: none;
  color: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.14), inset 0 -16px 32px rgba(0, 0, 0, 0.42);
  display: block;
  transition: transform .28s ease, box-shadow .28s ease;
  background: #d1d5db;
}

#page-home2 .home2-album-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 40px rgba(15, 23, 42, 0.26), inset 0 -24px 48px rgba(0, 0, 0, 0.55);
}

#page-home2 .home2-album-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  image-rendering: auto;
  transform: scale(1);
  transform-origin: center center;
  transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}

#page-home2 .home2-album-card:hover img {
  transform: scale(1.05);
}

#page-home2 .home2-album-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.1) 0%, rgba(15, 23, 42, 0) 46%, rgba(15, 23, 42, 0) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

/* Spodná „žľaza“: gradient do stratena (hore priehľadné → dole čitateľné) */
#page-home2 .home2-album-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 36%;
  z-index: 2;
  padding: 6px 7px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 3px;
  border-radius: 0 0 10px 10px;
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0) 0%,
    rgba(15, 23, 42, 0.18) 24%,
    rgba(15, 23, 42, 0.62) 58%,
    rgba(8, 11, 22, 0.9) 100%
  );
  transition: background 0.45s ease;
}

#page-home2 .home2-album-card:hover .home2-album-overlay {
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0) 0%,
    rgba(15, 23, 42, 0.26) 24%,
    rgba(15, 23, 42, 0.74) 56%,
    rgba(5, 8, 18, 0.95) 100%
  );
}

#page-home2 .home2-album-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.92);
  font-weight: 600;
}

#page-home2 .home2-album-year {
  display: none;
}

#page-home2 .home2-album-score {
  display: none;
}

#page-home2 .home2-album-title {
  margin: 0;
  font-size: 12px;
  line-height: 1.25;
  font-weight: 800;
  color: #fff;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

#page-home2 .home2-album-artist {
  margin: 0;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.86);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#page-home2 .home2-album-stars {
  display: none;
}

#page-home2 .home2-album-extra {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  font-size: 9px;
  color: rgba(255, 255, 255, 0.84);
  margin-top: auto;
}

#page-home2 .home2-albums-section .home2-album-card--home-grid::before {
  display: none;
}

#page-home2 .home2-albums-section .home2-album-card--home-grid::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 68%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(8, 11, 22, 0) 0%, rgba(8, 11, 22, 0.28) 28%, rgba(8, 11, 22, 0.72) 62%, rgba(4, 6, 14, 0.94) 100%);
}

#page-home2 .home2-albums-section .home2-album-card--home-grid .home2-album-overlay {
  top: 30%;
  z-index: 2;
  padding: 8px 8px 7px;
  justify-content: flex-end;
  align-items: flex-start;
  text-align: left;
  gap: 2px;
  background: none;
}

#page-home2 .home2-albums-section .home2-album-card--home-grid .home2-album-title,
#page-home2 .home2-albums-section .home2-album-card--home-grid .home2-album-artist {
  width: 100%;
  text-align: left;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), 0 2px 10px rgba(0, 0, 0, 0.55);
}

#page-home2 .home2-albums-section .home2-album-card--home-grid .home2-album-extra {
  justify-content: flex-start;
  width: 100%;
}

#page-home2 .home2-albums-section .home2-album-card--home-grid .home2-album-year {
  display: inline-block;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  padding: 1px 6px;
}

#page-home2 .home2-album-pct {
  font-size: 13px;
  font-weight: 700;
  color: #fff;
}

#page-home2 .home2-album-play {
  display: none;
}

#page-home2 .home2-artist-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

#page-home2 .home2-artist-card {
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.18);
  text-decoration: none;
  color: inherit;
  display: block;
  overflow: hidden;
  position: relative;
  min-height: 210px;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
  transition: transform .2s ease, box-shadow .2s ease;
}

#page-home2 .home2-artist-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.22);
}

#page-home2 .home2-artist-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

#page-home2 .home2-artist-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  display: block;
  image-rendering: auto;
}

#page-home2 .home2-artist-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(3, 7, 18, 0.04) 0%, rgba(3, 7, 18, 0.62) 100%);
}

#page-home2 .home2-artist-content {
  position: relative;
  z-index: 1;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 12px;
}

#page-home2 .home2-artist-rank {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #111827;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#page-home2 .home2-artist-avatar {
  display: none;
}

#page-home2 .home2-artist-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#page-home2 .home2-artist-name {
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 8px;
  line-height: 1.3;
  color: #fff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

#page-home2 .home2-artist-meta {
  margin: 0;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.35;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

@media (max-width: 1399px) {
  #page-home2 .home2-albums-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 1199px) {
  #page-home2 .home2-artist-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #page-home2 .home2-albums-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  #page-home2 .home2-albums-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  #page-home2 .home-hero {
    min-height: 280px;
    border-radius: 18px;
  }

  #page-home2 .home-hero-inner {
    padding: 18px 14px 42px;
  }

  #page-home2 .home-hero-btn {
    width: auto;
    max-width: min(248px, 72vw);
    min-width: 0;
  }

  #page-home2 .home-hero-btn:has(.home-hero-btn-tag) {
    max-width: min(calc(100vw - 40px), 340px);
    width: max-content;
  }

  #page-home2 .home2-review-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #page-home2 .home2-artist-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #page-home2 .home2-track-row {
    grid-template-columns: 40px minmax(0, 1fr);
    grid-template-areas:
      "rank main"
      "rank album"
      "score score";
    column-gap: 10px;
    row-gap: 8px;
  }

  #page-home2 .home2-track-rank {
    grid-area: rank;
    align-self: start;
    padding-top: 4px;
  }

  #page-home2 .home2-track-main {
    grid-area: main;
  }

  #page-home2 .home2-track-album {
    grid-area: album;
  }

  #page-home2 .home2-track-score-wrap {
    grid-area: score;
  }

  #page-home2 .home2-track-trend,
  #page-home2 .home2-track-sep,
  #page-home2 .home2-track-comments {
    display: none;
  }

  #page-home2 .home2-albums-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #page-home2 .home2-reviews-heading {
    flex-direction: column;
    align-items: stretch;
  }

  #page-home2 .home2-reviews-heading-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  #page-home2 .home2-reviews-heading-actions .home2-review-tabs {
    justify-content: flex-start;
  }

  #page-home2 .home-sections {
    gap: 32px;
    margin-top: 24px;
  }
}

/* Ľavé menu (ms_sidemenu): väčší dych na home2 + gradientová značka aktívnej položky */
body:has(#page-home2) .ms_sidemenu_wrapper .ms_nav_wrapper > ul > li {
  margin-bottom: 6px;
}

body:has(#page-home2) .ms_sidemenu_wrapper.open_menu .ms_nav_wrapper > ul > li > a {
  padding: 12px 20px;
}

body:has(#page-home2) .ms_sidemenu_wrapper .ms_nav_wrapper > ul > li > a {
  position: relative;
  border-radius: 0 10px 10px 0;
}

body:has(#page-home2) .ms_sidemenu_wrapper .ms_nav_wrapper > ul > li > a.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, #7c3aed 0%, #f97316 100%);
  box-shadow: 0 0 12px rgba(124, 58, 237, 0.45);
}

body:has(#page-home2) .sidemenu-tip-strip {
  gap: 12px;
}

/* Komunitný pulz + tvoje recenzie */
#page-home2 .home2-community-pulse {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.92) 0%, rgba(241, 245, 249, 0.95) 100%);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

#page-home2 .home2-community-pulse-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 14px;
  margin-bottom: 10px;
}

#page-home2 .home2-community-pulse-head h2 {
  margin: 0;
  font-size: 1rem;
  color: #0f172a;
  letter-spacing: -0.02em;
}

#page-home2 .home2-community-pulse-hint {
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  color: #64748b;
  max-width: 420px;
  line-height: 1.35;
}

#page-home2 .home2-community-pulse-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

#page-home2 .home2-community-pulse-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: background 0.2s ease;
}

#page-home2 .home2-community-pulse-row:hover {
  background: rgba(124, 58, 237, 0.06);
}

#page-home2 .home2-community-pulse-row img {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  object-fit: cover;
  flex-shrink: 0;
}

#page-home2 .home2-community-pulse-main {
  flex: 1;
  min-width: 0;
}

#page-home2 .home2-community-pulse-main strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#page-home2 .home2-community-pulse-main span {
  font-size: 11px;
  color: #64748b;
}

#page-home2 .home2-community-pulse-heat {
  font-size: 11px;
  font-weight: 700;
  color: #7c3aed;
  white-space: nowrap;
}

#page-home2 .home2-user-reviews-strip {
  margin-top: 14px;
}

#page-home2 .home2-user-reviews-strip .ms_heading h2 {
  font-size: clamp(1rem, 1.2vw, 1.15rem);
}

#page-home2 .home2-user-reviews-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

@media (max-width: 991px) {
  #page-home2 .home2-user-reviews-cards {
    grid-template-columns: 1fr;
  }
}

#page-home2 .home2-user-review-card {
  display: block;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: #fff;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#page-home2 .home2-user-review-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.1);
}

#page-home2 .home2-user-review-card h3 {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

#page-home2 .home2-user-review-card p {
  margin: 0;
  font-size: 11px;
  color: #64748b;
}

#page-home2 .home2-user-review-card .home2-user-review-meta {
  margin-top: 6px;
  font-size: 10px;
  font-weight: 600;
  color: #94a3b8;
}

/* Recenzie: sociálne štítky v spodnom paneli */
#page-home2 .home2-review-social {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  background: rgba(2, 6, 23, 0.62);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

#page-home2 .home2-review-stat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

#page-home2 .home2-review-stat i {
  font-size: 12px;
  opacity: 0.92;
}

/* Homepage lazy section placeholders */
#page-home .home-lazy-placeholder,
#page-home2 .home-lazy-placeholder {
  min-height: 280px;
  margin-bottom: 8px;
  border-radius: 12px;
  background: linear-gradient(110deg, #f0f2f6 8%, #e8ebf1 18%, #f0f2f6 33%);
  background-size: 200% 100%;
  animation: home-lazy-shimmer 1.4s ease-in-out infinite;
}

#page-home .home-lazy-error,
#page-home2 .home-lazy-error {
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
}

@keyframes home-lazy-shimmer {
  to {
    background-position-x: -200%;
  }
}
