@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&display=swap');

/* =========================================================
   RELICMU START V2 — VISUAL LAYER
   Mantém as integrações Morpheus e sobrescreve apenas visual.
   ========================================================= */
:root {
  --relic-bg: #07070a;
  --relic-bg-2: #0b0b10;
  --relic-panel: #0f0f14;
  --relic-panel-2: #13131a;
  --relic-line: rgba(207, 156, 57, .26);
  --relic-line-soft: rgba(255,255,255,.065);
  --relic-gold: #c99638;
  --relic-gold-2: #e3bb63;
  --relic-gold-dark: #76501d;
  --relic-purple: #7d42bb;
  --relic-purple-2: #a668e4;
  --relic-green: #42e58b;
  --relic-text: #f4efe6;
  --relic-muted: #9b98a2;
  --relic-danger: #b33b43;
  --relic-radius: 10px;
  --relic-shadow: 0 18px 55px rgba(0,0,0,.36);
}

html { background: var(--relic-bg); }
body.relic-theme {
  background:
    radial-gradient(circle at 78% 8%, rgba(111,55,166,.11), transparent 27rem),
    radial-gradient(circle at 14% 25%, rgba(188,132,42,.07), transparent 28rem),
    var(--relic-bg);
  color: var(--relic-text);
}

body.relic-theme ::selection { background: rgba(201,150,56,.35); color: #fff; }
body.relic-theme ::-webkit-scrollbar-thumb { background: var(--relic-gold-dark); }
body.relic-theme ::-webkit-scrollbar-thumb:hover { background: var(--relic-gold); }
body.relic-theme ::-webkit-scrollbar-track { background: #050507; }

/* TOP / SOCIAL */
body.relic-theme .header__top {
  height: 44px;
  background: rgba(5,5,8,.98);
  border-bottom: 1px solid var(--relic-line);
}
body.relic-theme .header__top .container { max-width: 1240px; }
body.relic-theme .header__social .social__box,
body.relic-theme .footer__social .social__box {
  background: #0d0d12;
  border: 1px solid var(--relic-line);
  color: #c9c3b8;
  border-radius: 8px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.015);
}
body.relic-theme .header__social .social__box:hover,
body.relic-theme .footer__social .social__box:hover {
  background: rgba(201,150,56,.11);
  border-color: rgba(227,187,99,.65);
  color: var(--relic-gold-2);
  transform: translateY(-1px);
}

/* NAV */
body.relic-theme .header__nav {
  height: 92px;
  background: rgba(7,7,10,.97);
  border-bottom: 1px solid var(--relic-line);
  box-shadow: 0 10px 35px rgba(0,0,0,.22);
}
body.relic-theme .header__nav .header__desktop .wrapper { max-width: 1240px; overflow: visible; }
body.relic-theme .header__nav .header__menu-box {
  border-left: 1px solid var(--relic-line);
  border-right: 1px solid var(--relic-line);
  transform: none;
  background: linear-gradient(90deg, rgba(201,150,56,.025), transparent 24%, transparent 76%, rgba(125,66,187,.025));
}
body.relic-theme .header__nav .header__menu-area {
  padding: 0 26px;
  position: absolute;
  align-items: center;
}
body.relic-theme .header__nav .header__menu-area .menu__left,
body.relic-theme .header__nav .header__menu-area .menu__right {
  margin: 0;
  padding: 0;
  align-items: center;
}
body.relic-theme .header__nav .header__menu-area .menu__links { column-gap: 24px; align-items: center; }
body.relic-theme .header__nav .header__menu-area .menu__link {
  color: #c8c4bd;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
  transition: color .18s ease;
}
body.relic-theme .header__nav .header__menu-area .menu__link:hover { color: #fff; }
body.relic-theme .header__nav .header__menu-area .menu__link::after {
  background: linear-gradient(90deg, var(--relic-gold-dark), var(--relic-gold-2));
  height: 3px;
  transform: none;
  bottom: 0;
}
body.relic-theme .header__nav .header__menu-area .logo-reference {
  width: 216px;
  min-width: 216px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
body.relic-theme .header__nav .header__menu-area .logo-reference::before {
  content: 'RELICMU';
  color: var(--relic-gold-2);
  font-family: 'Cinzel', Georgia, serif;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: .075em;
  line-height: 1;
  text-shadow: 0 0 20px rgba(201,150,56,.2);
}
body.relic-theme .header__nav .header__menu-area .logo-reference::after {
  content: 'SEASON 6';
  color: #77717d;
  font-family: 'Rajdhani', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .38em;
  margin-top: 7px;
}

/* MOBILE */
body.relic-theme .header .mobile__button { border: 1px solid var(--relic-line); border-radius: 8px; }
body.relic-theme .header .mobile__line { background: var(--relic-gold-2); }
body.relic-theme .sidebar {
  background: #09090d;
  border-right: 1px solid var(--relic-line);
}
body.relic-theme .sidebar__title,
body.relic-theme .heading__column-title { color: var(--relic-gold-2); }

/* HERO */
body.relic-theme .banner {
  height: 510px;
  min-height: 510px;
  max-height: 510px;
  background: #08080c;
  border-bottom: 1px solid var(--relic-line);
  position: relative;
  overflow: hidden;
}
body.relic-theme .banner::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(4,4,7,.98) 0%, rgba(4,4,7,.88) 26%, rgba(4,4,7,.45) 58%, rgba(4,4,7,.35) 100%),
    radial-gradient(circle at 77% 44%, rgba(114,49,181,.18), transparent 30rem),
    linear-gradient(180deg, transparent 55%, #07070a 100%);
  pointer-events: none;
}
body.relic-theme .banner::after {
  content: '';
  position: absolute;
  z-index: 2;
  right: 7%;
  top: 0;
  width: min(48vw, 720px);
  height: 100%;
  background: url('../img/relic-hero-crop.png') center/cover no-repeat;
  opacity: .72;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 23%, #000 88%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 23%, #000 88%, transparent 100%);
  filter: saturate(1.12) contrast(1.04);
  pointer-events: none;
}
body.relic-theme .banner .wrapper { max-width: none; }
body.relic-theme .banner video {
  position: absolute;
  inset: 0;
  top: 0;
  left: 0;
  transform: none;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  opacity: .12;
  filter: saturate(.45) brightness(.55) hue-rotate(230deg);
  z-index: 0;
}
body.relic-theme .relic-hero {
  position: relative;
  z-index: 3;
  width: min(1180px, calc(100% - 40px));
  height: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding-bottom: 18px;
}
body.relic-theme .relic-hero__eyebrow {
  color: var(--relic-gold-2);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
body.relic-theme .relic-hero__title {
  max-width: 680px;
  color: var(--relic-text);
  font-family: 'Cinzel', Georgia, serif;
  font-size: clamp(42px, 5.2vw, 72px);
  font-weight: 600;
  line-height: .98;
  letter-spacing: -.035em;
  text-transform: uppercase;
  text-shadow: 0 12px 35px rgba(0,0,0,.58);
}
body.relic-theme .relic-hero__title span { color: var(--relic-gold-2); }
body.relic-theme .relic-hero__text {
  max-width: 580px;
  color: #b7b2b8;
  font-family: 'Work Sans', sans-serif;
  font-size: 14px;
  line-height: 1.65;
  margin-top: 17px;
}
body.relic-theme .relic-hero__actions { display: flex; gap: 10px; margin-top: 24px; flex-wrap: wrap; }
body.relic-theme .relic-hero__button {
  min-width: 154px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border-radius: 7px;
  border: 1px solid rgba(227,187,99,.5);
  background: linear-gradient(180deg, #9b651d, #6f4312);
  color: #fff6e4;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 2px rgba(255,211,113,.09), 0 10px 28px rgba(0,0,0,.25);
}
body.relic-theme .relic-hero__button:hover { filter: brightness(1.12); transform: translateY(-1px); }
body.relic-theme .relic-hero__button--ghost { background: rgba(8,8,12,.72); border-color: rgba(201,150,56,.32); color: #d8d2c8; }

/* MARQUEE */
body.relic-theme .marquee {
  background: #09090d;
  border-top: 1px solid rgba(201,150,56,.12);
  border-bottom: 1px solid var(--relic-line);
  min-height: 44px;
}
body.relic-theme .marquee__left,
body.relic-theme .marquee__right { background: linear-gradient(135deg, #6d4516, #b27a27); }
body.relic-theme .marquee__track p { color: #b6b0b5; }
body.relic-theme .marquee__track a { color: var(--relic-gold-2); }

/* MAIN LAYOUT */
body.relic-theme .content { background: transparent; padding-top: 42px; padding-bottom: 68px; }
body.relic-theme .content > .container { max-width: 1240px; column-gap: 22px; }
body.relic-theme .column { row-gap: 18px; }
body.relic-theme .main { row-gap: 22px; }
body.relic-theme .main__content,
body.relic-theme .column__content {
  border: 1px solid var(--relic-line-soft);
  background: linear-gradient(180deg, rgba(17,17,23,.96), rgba(9,9,13,.97));
  border-radius: var(--relic-radius);
  overflow: hidden;
  box-shadow: var(--relic-shadow);
}
body.relic-theme .column__content { row-gap: 0; }
body.relic-theme .column__box {
  background: transparent;
  border-bottom: 1px solid rgba(255,255,255,.045);
  padding: 17px 20px;
}
body.relic-theme .column__box:last-child { border-bottom: 0; }
body.relic-theme .column--heading {
  background: linear-gradient(90deg, rgba(201,150,56,.12), rgba(125,66,187,.035));
  border-bottom: 1px solid var(--relic-line);
}
body.relic-theme .heading__column-title,
body.relic-theme .heading__main-title {
  font-family: 'Cinzel', Georgia, serif;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}
body.relic-theme .heading__column-title { font-size: 18px; }
body.relic-theme .main__title {
  width: 100%;
  padding: 18px 22px;
  border-bottom: 1px solid var(--relic-line);
  background: linear-gradient(90deg, rgba(201,150,56,.09), transparent 55%);
}
body.relic-theme .heading__main-title { color: var(--relic-text); font-size: 22px; }
body.relic-theme .heading__main-title::first-letter { color: var(--relic-gold-2); }

/* STATS */
body.relic-theme .status__loading { background: #08080b; border: 1px solid rgba(255,255,255,.05); transform: none; border-radius: 20px; overflow: hidden; height: 10px; }
body.relic-theme .status__loaded { background: linear-gradient(90deg, #26b96e, var(--relic-green)); height: 100%; box-shadow: 0 0 16px rgba(66,229,139,.28); }
body.relic-theme .status__description,
body.relic-theme .summary__detail { color: var(--relic-gold); }
body.relic-theme .status__total { color: #fff; font-size: 42px; }
body.relic-theme .summary__definition { color: #f0ece5; font-size: 21px; }

/* SLIDES/BANNERS */
body.relic-theme .slide-container {
  border-radius: var(--relic-radius);
  overflow: hidden;
  border: 1px solid var(--relic-line-soft);
  box-shadow: var(--relic-shadow);
}

/* NEWS */
body.relic-theme .news { gap: 10px; }
body.relic-theme .news__item {
  background: #0c0c11;
  border: 1px solid rgba(255,255,255,.05);
  border-left: 2px solid rgba(201,150,56,.72);
  border-radius: 8px;
  padding: 18px 20px;
}
body.relic-theme .news__item:hover {
  background: #111118;
  border-color: rgba(201,150,56,.24);
  border-left-color: var(--relic-gold-2);
  transform: translateY(-1px);
}
body.relic-theme .news__title { color: #f0ece6; font-size: 20px; letter-spacing: .015em; }
body.relic-theme .news__description { color: var(--relic-gold); font-size: 13px; letter-spacing: .08em; }
body.relic-theme .post__content,
body.relic-theme .page,
body.relic-theme .form,
body.relic-theme fieldset { border-color: var(--relic-line-soft); }

/* CASTLE SIEGE */
body.relic-theme .castle {
  background:
    radial-gradient(circle at 85% 0%, rgba(125,66,187,.12), transparent 20rem),
    #0b0b10;
  padding: 24px;
}
body.relic-theme .castle__guild .guild__emblem { border-color: var(--relic-gold); box-shadow: 0 0 22px rgba(201,150,56,.15); }
body.relic-theme .castle__guild .guild__name { font-family: 'Cinzel', Georgia, serif; color: var(--relic-gold-2); }
body.relic-theme .castle__description { border-color: rgba(255,255,255,.06); }
body.relic-theme .castle__description .description__detail { color: var(--relic-muted); }
body.relic-theme .castle__description .description__definition span { color: var(--relic-purple-2); }

/* RANKING TOP 5 / RANKINGS */
body.relic-theme .rankings__title {
  background: linear-gradient(125deg, rgba(111,67,18,.9), rgba(33,20,43,.92));
  border-bottom: 1px solid var(--relic-line);
}
body.relic-theme .rankings__heading {
  color: #fff;
  font-family: 'Cinzel', Georgia, serif;
  letter-spacing: -.02em;
}
body.relic-theme .rankings__tag span { color: var(--relic-purple-2); }
body.relic-theme .rankings__content { background: transparent; }
body.relic-theme .rankings__box,
body.relic-theme .ranking__item {
  background: #0b0b10;
  border-bottom: 1px solid rgba(255,255,255,.045);
}
body.relic-theme .rankings__box:hover,
body.relic-theme .ranking__item:hover { background: #101017; }
body.relic-theme .rankings__rank { color: var(--relic-gold-2); }
body.relic-theme .rankings__character,
body.relic-theme .ranking__character { color: #f0ece5; }
body.relic-theme .rankings__score,
body.relic-theme .ranking__score { color: #c3bdc5; }
body.relic-theme .rankings__menu { background: #0d0d12; border-bottom: 1px solid rgba(255,255,255,.05); }
body.relic-theme .rankings__menu .menu__link::after,
body.relic-theme .rankings__menu .menu__link.active::after { background: var(--relic-gold); height: 3px; transform: none; }
body.relic-theme .rankings--rating { border-radius: 6px; overflow: hidden; }

/* TABLES / GENERAL DATA */
body.relic-theme .table th { background: #15141a; color: var(--relic-gold-2); }
body.relic-theme .table td { background: #0b0b10; color: #d0cbd0; }
body.relic-theme .table tr:hover td { background: #101017; }
body.relic-theme .table th,
body.relic-theme .table td { border-color: rgba(255,255,255,.04); }

/* FORMS / BUTTONS / LOGIN */
body.relic-theme input,
body.relic-theme select,
body.relic-theme textarea,
body.relic-theme .form__input {
  background: #0b0b10 !important;
  border-color: rgba(201,150,56,.2) !important;
  color: #eee8df !important;
  border-radius: 7px !important;
}
body.relic-theme input:focus,
body.relic-theme select:focus,
body.relic-theme textarea:focus,
body.relic-theme .form__input:focus { border-color: rgba(227,187,99,.72) !important; box-shadow: 0 0 0 3px rgba(201,150,56,.08) !important; }
body.relic-theme .button__medium,
body.relic-theme .button__large,
body.relic-theme .btn,
body.relic-theme button[type='submit'] {
  border-radius: 7px !important;
  border-color: rgba(201,150,56,.4) !important;
}
body.relic-theme .loginModal { backdrop-filter: blur(8px); }
body.relic-theme .login {
  background: #0b0b10;
  border: 1px solid var(--relic-line);
  border-radius: 12px;
  box-shadow: 0 30px 90px rgba(0,0,0,.55);
}
body.relic-theme .login__heading { border-bottom: 1px solid var(--relic-line); }
body.relic-theme .login__title { font-family: 'Cinzel', Georgia, serif; color: var(--relic-gold-2); }

/* WEB SHOP / MARKET / PACKAGES / EVENTS */
body.relic-theme .webshop-container,
body.relic-theme .webshop-grid,
body.relic-theme .ws-sidebar,
body.relic-theme .market,
body.relic-theme .package,
body.relic-theme .event,
body.relic-theme .auction {
  border-color: var(--relic-line-soft) !important;
}
body.relic-theme .ws-card,
body.relic-theme .market__item,
body.relic-theme .packages__item,
body.relic-theme .event__item {
  background: #0c0c11 !important;
  border-color: rgba(255,255,255,.055) !important;
}

/* ALERTS */
body.relic-theme .alerts__alert { border-radius: 8px; }
body.relic-theme .alert--warning { background: rgba(201,150,56,.1); border: 1px solid rgba(201,150,56,.26); color: #e7c982; }
body.relic-theme .alert--success { background: rgba(66,229,139,.08); border: 1px solid rgba(66,229,139,.22); color: #7eebb0; }

/* POPUP PRESERVADO, APENAS REESTILIZADO */
body.relic-theme .popup { background: rgba(3,3,6,.82) !important; backdrop-filter: blur(8px); }
body.relic-theme .popup-content {
  background: #0b0b10 !important;
  border: 1px solid rgba(201,150,56,.58) !important;
  border-radius: 12px !important;
  padding: 6px !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.65), 0 0 0 1px rgba(125,66,187,.16) inset;
}
body.relic-theme .close {
  background: #0b0b10 !important;
  border: 1px solid rgba(201,150,56,.5);
  color: var(--relic-gold-2) !important;
  border-radius: 8px !important;
  font-size: 22px !important;
  padding: 5px 10px !important;
}
body.relic-theme .prev,
body.relic-theme .next { background: rgba(7,7,10,.78) !important; color: var(--relic-gold-2) !important; border: 1px solid rgba(201,150,56,.22) !important; }

/* FOOTER */
body.relic-theme .footer {
  background: #050507;
  border-top: 1px solid var(--relic-line);
  color: #85818b;
}
body.relic-theme .footer__top { background: transparent; }
body.relic-theme .footer a { color: var(--relic-gold-2); }

/* GO TOP / PRELOADER */
body.relic-theme .button__top { background: #0d0d12; color: var(--relic-gold-2); border: 1px solid var(--relic-line); }
body.relic-theme .preloaderr { background: #060609; }
body.relic-theme .preloader__loaded { color: var(--relic-gold-2); }

/* RESPONSIVE */
@media (max-width: 1040px) {
  body.relic-theme .header__nav .header__menu-area .menu__links { column-gap: 14px; }
  body.relic-theme .header__nav .header__menu-area .menu__link { font-size: 12px; }
  body.relic-theme .header__nav .header__menu-area .logo-reference { width: 170px; min-width: 170px; }
  body.relic-theme .header__nav .header__menu-area .logo-reference::before { font-size: 21px; }
}
@media (max-width: 879px) {
  body.relic-theme .header__nav { height: 72px; }
  body.relic-theme .header__mobile { height: 72px; }
  body.relic-theme .banner { height: 440px; min-height: 440px; max-height: 440px; }
  body.relic-theme .banner::after { right: -11%; width: 76vw; opacity: .5; }
  body.relic-theme .relic-hero { width: calc(100% - 32px); }
  body.relic-theme .relic-hero__text { max-width: 520px; }
}
@media (max-width: 610px) {
  body.relic-theme .header__top { height: 38px; }
  body.relic-theme .banner { height: 400px; min-height: 400px; max-height: 400px; }
  body.relic-theme .banner::after { opacity: .28; right: -35%; width: 110vw; }
  body.relic-theme .relic-hero__title { font-size: 38px; max-width: 420px; }
  body.relic-theme .relic-hero__text { font-size: 13px; max-width: 380px; }
  body.relic-theme .relic-hero__button { min-width: 136px; height: 44px; padding: 0 18px; font-size: 13px; }
  body.relic-theme .content { padding-top: 26px; }
  body.relic-theme .content > .container { padding-left: 14px; padding-right: 14px; }
}
