/* RelicMU START V3 — widescreen/full home pass
   Loaded after relic-v2.css. Keeps all Morpheus features, only changes layout/visual density. */

/* Wider shell: use the monitor instead of leaving huge empty sides */
body.relic-theme .header__top .container,
body.relic-theme .header__nav .header__desktop .wrapper,
body.relic-theme .relic-hero,
body.relic-theme .content > .container,
body.relic-theme .footer__copy .container {
  max-width: 1560px;
  width: calc(100% - 48px);
}

body.relic-theme .header__nav .header__desktop .wrapper {
  width: calc(100% - 48px);
}

body.relic-theme .header__nav .header__menu-area {
  padding-left: 34px;
  padding-right: 34px;
}
body.relic-theme .header__nav .header__menu-area .menu__links { column-gap: 30px; }
body.relic-theme .header__nav .header__menu-area .logo-reference {
  width: 240px;
  min-width: 240px;
}

/* Hero spans more of the viewport and balances copy/art */
body.relic-theme .banner { height: 500px; min-height: 500px; max-height: 500px; }
body.relic-theme .banner::after {
  right: 1.5%;
  width: min(55vw, 880px);
  opacity: .82;
  background-position: center 35%;
}
body.relic-theme .banner::before {
  background:
    linear-gradient(90deg, rgba(4,4,7,.99) 0%, rgba(4,4,7,.92) 24%, rgba(4,4,7,.58) 48%, rgba(4,4,7,.22) 73%, rgba(4,4,7,.34) 100%),
    radial-gradient(circle at 76% 42%, rgba(114,49,181,.22), transparent 34rem),
    linear-gradient(180deg, transparent 58%, #07070a 100%);
}
body.relic-theme .relic-hero {
  padding-left: 22px;
  padding-right: 22px;
}
body.relic-theme .relic-hero__title { max-width: 760px; font-size: clamp(44px, 4.5vw, 76px); }
body.relic-theme .relic-hero__text { max-width: 650px; font-size: 15px; }

/* Main home layout: fixed informative sidebar + large main area */
body.relic-theme .content { padding-top: 34px; padding-bottom: 54px; }
body.relic-theme .content > .container {
  padding-left: 0;
  padding-right: 0;
  column-gap: 28px;
  align-items: flex-start;
}
body.relic-theme .content > .container > .column {
  flex: 0 0 330px;
  width: 330px;
  min-width: 330px;
}
body.relic-theme .content > .container > .main {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

/* Preview wrapper uses exactly the same proportions */
body.relic-theme .mock-content { gap: 28px !important; }
body.relic-theme .mock-content > .column {
  flex: 0 0 330px !important;
  width: 330px !important;
  min-width: 330px !important;
}
body.relic-theme .mock-content > .main {
  flex: 1 1 auto !important;
  width: auto !important;
}

/* Increase content density and visual presence */
body.relic-theme .column { row-gap: 16px; }
body.relic-theme .main { row-gap: 20px; }
body.relic-theme .column__box { padding: 16px 20px; }
body.relic-theme .main__title { padding: 18px 24px; }
body.relic-theme .news__item { padding: 18px 22px; }
body.relic-theme .castle { padding: 26px 28px; }

/* Ranking: keep Top 5, remove giant billboard-like heading */
body.relic-theme .rankings__title {
  min-height: 84px;
  height: 84px;
  margin: 0;
  padding: 0 26px;
  justify-content: flex-start;
  background:
    linear-gradient(90deg, rgba(139,91,27,.32), rgba(68,35,92,.14) 48%, transparent 100%),
    #0c0c11;
  position: relative;
  overflow: hidden;
}
body.relic-theme .rankings__title::after {
  content: 'OS MELHORES DO RELICMU';
  position: absolute;
  right: 26px;
  top: 50%;
  transform: translateY(-50%);
  color: #77717b;
  font-family: 'Rajdhani', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
}
body.relic-theme .rankings__heading {
  margin: 0;
  font-size: 28px;
  line-height: 1;
  text-align: left;
  flex: none;
}
body.relic-theme .rankings__heading br { display: none; }
body.relic-theme .rankings__heading { font-size: 0; }
body.relic-theme .rankings__heading::before {
  content: 'RANKINGS';
  font-size: 28px;
  color: #f4eee5;
}
body.relic-theme .rankings__tag { display: none !important; }
body.relic-theme .rankings__content { width: 100% !important; }
body.relic-theme .rankings__item { max-width: none !important; width: 100% !important; }
body.relic-theme .rankings--rating { min-height: 64px; }

/* Market and cards can breathe on wide desktop */
body.relic-theme .market__items,
body.relic-theme .webshop__items { gap: 14px; }

/* Remove legacy red title slashes globally in Relic skin */
body.relic-theme .heading__column-title::before,
body.relic-theme .heading__main-title::before,
body.relic-theme .heading__main-subtitle::before {
  background: linear-gradient(180deg, var(--relic-gold-2), var(--relic-gold-dark));
  transform: skew(-18deg);
}

/* Footer follows the wide shell */
body.relic-theme .footer__top,
body.relic-theme .footer__copy { border-color: rgba(201,150,56,.12); }

@media (min-width: 1680px) {
  body.relic-theme .header__top .container,
  body.relic-theme .header__nav .header__desktop .wrapper,
  body.relic-theme .relic-hero,
  body.relic-theme .content > .container,
  body.relic-theme .footer__copy .container {
    max-width: 1600px;
  }
  body.relic-theme .content > .container > .column,
  body.relic-theme .mock-content > .column {
    flex-basis: 350px !important;
    width: 350px !important;
    min-width: 350px !important;
  }
}

@media (max-width: 1100px) {
  body.relic-theme .header__top .container,
  body.relic-theme .header__nav .header__desktop .wrapper,
  body.relic-theme .relic-hero,
  body.relic-theme .content > .container,
  body.relic-theme .footer__copy .container {
    width: calc(100% - 28px);
  }
  body.relic-theme .content > .container > .column,
  body.relic-theme .mock-content > .column {
    flex-basis: 280px !important;
    width: 280px !important;
    min-width: 280px !important;
  }
  body.relic-theme .header__nav .header__menu-area .menu__links { column-gap: 18px; }
  body.relic-theme .header__nav .header__menu-area .logo-reference { width: 190px; min-width: 190px; }
}

@media (max-width: 900px) {
  body.relic-theme .banner { height: 460px; min-height: 460px; max-height: 460px; }
  body.relic-theme .banner::after { right: -20%; width: 92vw; opacity: .42; }
  body.relic-theme .content > .container { flex-direction: column; }
  body.relic-theme .content > .container > .column,
  body.relic-theme .content > .container > .main,
  body.relic-theme .mock-content > .column,
  body.relic-theme .mock-content > .main {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  body.relic-theme .rankings__title::after { display: none; }
}
