/* EternalMU home layout polish: tighter update cards and stronger responsive layout. */
.em-home-final {
  max-width: 1360px !important;
}

.em-home-final .em-home-columns {
  gap: 18px !important;
  margin-top: 20px !important;
}

.em-home-final .em-home-columns > .em-panel,
.em-home-final .em-home-columns > section.em-panel {
  min-height: 348px !important;
  padding: 24px 24px 28px !important;
}

.em-main-updates {
  margin-top: 42px !important;
}

.em-main-updates__head {
  margin-bottom: 24px !important;
}

.em-main-updates__head h2 {
  font-size: clamp(34px, 4.5vw, 58px) !important;
  line-height: 1 !important;
}

.em-main-updates__head p {
  max-width: 780px !important;
  font-size: clamp(15px, 1.6vw, 19px) !important;
}

.em-updates-panel {
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 50% 0, rgba(151, 82, 255, .12), transparent 32%),
    linear-gradient(180deg, rgba(12, 7, 23, .985), rgba(5, 3, 12, .99)) !important;
  box-shadow:
    0 20px 58px rgba(0, 0, 0, .46),
    inset 0 1px rgba(255, 255, 255, .055) !important;
}

.em-updates-panel:before {
  height: 260px !important;
  opacity: .65 !important;
}

.em-update-tabs {
  min-height: 64px !important;
  background:
    linear-gradient(180deg, rgba(38, 20, 62, .96), rgba(16, 8, 30, .98)) !important;
}

.em-update-tabs button {
  min-height: 64px !important;
  gap: 8px !important;
  padding: 9px 10px !important;
}

.em-update-tabs button.is-active {
  box-shadow: inset 0 -3px #ff8a2c, 0 0 18px rgba(151, 82, 255, .16) !important;
}

.em-update-tabs span {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
}

.em-update-tabs .em-update-tab-icon img {
  width: 48px !important;
  height: 48px !important;
}

.em-update-tabs b {
  font-size: 12px !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

.em-update-stage {
  min-height: 0 !important;
}

.em-update-pane {
  grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr) !important;
  gap: 34px !important;
  padding: 38px 42px 42px !important;
}

.em-update-copy h3 {
  margin-bottom: 14px !important;
  padding-bottom: 14px !important;
  font-size: clamp(28px, 3vw, 38px) !important;
}

.em-update-copy p {
  max-width: 620px !important;
  margin-bottom: 10px !important;
  font-size: 15.5px !important;
  line-height: 1.58 !important;
}

.em-update-copy strong {
  margin: 22px 0 8px !important;
}

.em-update-copy ul {
  font-size: 15px !important;
  line-height: 1.62 !important;
}

.em-update-media {
  min-height: 238px !important;
  border-radius: 16px !important;
  box-shadow:
    0 18px 48px rgba(0, 0, 0, .34),
    0 0 24px rgba(151, 82, 255, .12) !important;
}

.em-update-media:before {
  background:
    radial-gradient(circle at 72% 30%, rgba(151, 82, 255, .22), transparent 30%),
    linear-gradient(90deg, rgba(10, 6, 18, .56), transparent 48%, rgba(255, 138, 44, .1)) !important;
}

.em-update-media span {
  left: 20px !important;
  bottom: 18px !important;
  font-size: clamp(19px, 2.1vw, 25px) !important;
}

.em-update-media button {
  width: 62px !important;
  height: 50px !important;
  border-radius: 14px !important;
}

.em-update-media button:before {
  left: 25px !important;
  top: 15px !important;
  border-left-width: 17px !important;
  border-top-width: 10px !important;
  border-bottom-width: 10px !important;
}

@media (max-width: 1180px) {
  .em-home-final {
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .em-home-final .em-home-columns {
    gap: 16px !important;
  }

  .em-main-updates {
    margin-top: 34px !important;
  }

  .em-update-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .em-update-pane {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding: 30px 28px 34px !important;
  }

  .em-update-copy p {
    max-width: none !important;
  }

  .em-update-media {
    min-height: 230px !important;
  }
}

@media (max-width: 820px) {
  .em-home-final {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .em-main-updates__head {
    margin-bottom: 18px !important;
  }

  .em-updates-panel {
    border-radius: 16px !important;
  }

  .em-update-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    min-height: 0 !important;
  }

  .em-update-tabs button {
    min-height: 58px !important;
    padding: 8px 9px !important;
  }

  .em-update-tabs span {
    width: 36px !important;
    height: 36px !important;
    border-radius: 11px !important;
  }

  .em-update-tabs .em-update-tab-icon img {
    width: 43px !important;
    height: 43px !important;
  }

  .em-update-tabs b {
    font-size: 11px !important;
  }

  .em-update-pane {
    padding: 22px 16px 26px !important;
    gap: 18px !important;
  }

  .em-update-copy h3 {
    font-size: 26px !important;
  }

  .em-update-copy p,
  .em-update-copy ul {
    font-size: 14px !important;
  }

  .em-update-media {
    min-height: 190px !important;
  }
}

@media (max-width: 520px) {
  .em-home-final .em-home-columns {
    gap: 12px !important;
  }

  .em-main-updates {
    margin-top: 26px !important;
  }

  .em-main-updates__head h2 {
    font-size: 30px !important;
  }

  .em-main-updates__head p {
    font-size: 14px !important;
  }

  .em-update-tabs button {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 7px !important;
    padding: 7px !important;
  }

  .em-update-tabs span {
    width: 32px !important;
    height: 32px !important;
  }

  .em-update-tabs .em-update-tab-icon img {
    width: 39px !important;
    height: 39px !important;
  }

  .em-update-pane {
    padding: 18px 12px 22px !important;
  }

  .em-update-copy h3 {
    font-size: 23px !important;
  }

  .em-update-copy strong {
    margin-top: 16px !important;
  }

  .em-update-copy ul {
    padding-left: 18px !important;
  }

  .em-update-media {
    min-height: 168px !important;
  }

  .em-update-media span {
    left: 14px !important;
    bottom: 13px !important;
    font-size: 17px !important;
  }
}
