/* Shared behavior around the existing Essence visual system. */
.server-promo [hidden] { display: none !important; }
.server-promo :focus-visible { outline: 2px solid #e6c18b; outline-offset: 4px; }
.server-promo .home-slider-description, .server-promo .reviews-grid-item__description { white-space: pre-line; }
.server-promo .streams-slider:not(.swiper-initialized) .swiper-wrapper { display: grid; gap: 24px; }
.server-promo .home-slider:not(.swiper-initialized) .home-slider-item { width: 100%; }
.server-promo .home-slider:not(.swiper-initialized) { max-height: none; }
.server-promo .home-slider.swiper-initialized .home-slider-item { overflow: hidden; }
.server-promo .home-slider-pagination { min-height: 16px; }
.server-promo .promo-header-social { display: inline-flex; align-items: center; }
.server-promo .events-server-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.server-promo .promo-clan-image { width: 64px; height: 64px; object-fit: contain; }
.server-promo .gw-timer__amount { font-variant-numeric: tabular-nums; }
.server-promo .countdown-box { min-height: 92px; }
@media (max-width: 475px) { .server-promo .countdown-box { min-height: 72px; } }
.server-promo .streams-line-btn { color: inherit; }
.server-promo .modal__close { font-size: 32px; color: inherit; }
.server-promo .xm-classes-video { object-fit: cover; }
.server-promo .xm-classes-perf { padding: 20px; }
@media (prefers-reduced-motion: reduce) { .server-promo *, .server-promo *::before, .server-promo *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }
.server-promo .home-container, .server-promo .home-body, .server-promo .home-slider { min-width: 0; width: 100%; }
.server-promo .home-logo { width: min(640px, 100%); }
.server-promo .home-logo img { width: 100%; height: auto; }
.server-promo .home-aside { min-width: 0; }
.server-promo .home-slider-backdrop { width: 100%; max-width: 840px; min-width: 0; }
.server-promo :is(.home-slider-backdrop, .home-aside) { position: relative; isolation: isolate; }
.server-promo :is(.home-slider-backdrop, .home-aside)::after {
    content: "";
    position: absolute;
    inset: -24px -16px;
    z-index: -1;
    background: radial-gradient(ellipse at 35% 50%, rgb(5 8 15 / 65%) 0%, rgb(5 8 15 / 45%) 35%, transparent 75%);
    filter: blur(24px);
    pointer-events: none;
}
.server-promo .home-aside::after {
    inset: -12px -20px;
    filter: blur(24px);
    background: linear-gradient(90deg, transparent 0%, rgb(5 8 15 / 25%) 30%, rgb(5 8 15 / 55%) 65%, rgb(5 8 15 / 35%) 85%, transparent 100%);
}
.server-promo[data-promo-page="main"] .home-footer { margin-block: 40px 0; }
.server-promo[data-promo-page="main"] .home { min-height: calc(100dvh - var(--promo-hero-offset, 0px)); padding-bottom: 32px; }
.server-promo[data-promo-page="main"] .home .home-hero-stack { margin-top: 0; }
.server-promo[data-promo-page="main"] :is(.heading-label, .home-aside__title span) { color: #dad0a4 !important; }
.server-promo[data-promo-page="main"] .header .navigation__menu__bar-list li a::after { background-color: #dad0a4; }
.server-promo[data-promo-page="main"] :is(.home-slider-pagination, .events-server-pagination) .progress { background: #dad0a4 !important; }
.server-promo .home-aside__title { white-space: nowrap; text-align: center; }
@media (max-width: 970px) {
    .server-promo .home .home-hero-stack { margin-top: 0; }
    .server-promo .home-logo { max-width: 360px; }
    .server-promo .home-slider { max-width: 100%; }
    .server-promo .home-timer { margin-left: 0; }
}
.server-promo .header .promo-auth-button {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 200px;
    height: 60px;
    padding: 0;
    opacity: 0.5;
    background: url('resources/promo_essence/img/btn.png') center / contain no-repeat;
    font-family: var(--root-button-ff);
    font-size: 13.333333px;
    font-weight: 400;
}
.server-promo .header .promo-auth-button:hover { opacity: 1; }
.server-promo .header .burger-menu-bar__btn .promo-auth-button { width: 55%; height: 80px; opacity: 0.75; font-size: 16px; }
.server-promo .header .promo-language { position: static; }
.server-promo .header .promo-language summary { list-style: none; }
.server-promo .header .promo-language summary::-webkit-details-marker { display: none; }
.server-promo .header .promo-language .promo-language-flag { width: 30px; height: 20px; flex-shrink: 0; object-fit: cover; }
.server-promo .header .promo-language .arrow-icon { margin-right: 0; }
.server-promo .header .promo-language[open] .language-options { display: block; }
.server-promo .header .promo-language .language-options { min-width: 81px; }
.server-promo .header .promo-language .language-option { width: auto; height: auto; opacity: 1; }

.server-promo .button-sm { isolation: isolate; }

.server-promo .xm-classes-perf__rows { display: grid; gap: 12px; }
.server-promo .xm-classes-perf__row-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; }
.server-promo .xm-classes-perf > .button { margin-top: 20px; }

@media (max-width: 1250px) {
    .server-promo .home .home-hero-stack { margin-top: 0; }
    .server-promo .home-footer { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .server-promo .home-footer .home-button { margin-inline: auto; }
    .server-promo .home-aside { width: 100%; }
}
@media (max-width: 1020px) {
    .server-promo .home-aside { grid-template-columns: minmax(0, 1fr); row-gap: 12px; }
    .server-promo .home-aside__title { white-space: normal; }
    .server-promo .home-timer { margin-left: 0; }
}
@media (max-width: 475px) {
    .server-promo .gw-timer__item { width: min(72px, calc((100vw - 40px) / 4)); height: min(72px, calc((100vw - 40px) / 4)); }
    .server-promo .gw-timer__border { width: 100%; }
}

.server-promo .reviews:not(.reviews-enhanced) .xm-review-flip__timer { display: none; }

/* Main has editorial event cards, a staged roadmap, and eight feature tabs. */
.server-promo .promo-events .cards { --ff-sec: "Cormorant", serif; }
.server-promo .promo-events .card-items { text-align: center; height: 350px; gap: 16px; overflow: hidden; isolation: isolate; }
.server-promo .promo-events .card-items:is(:hover, :focus-visible) { height: 350px; transform: none; }
.server-promo .promo-events .card-items__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; z-index: 0; transition: transform 350ms ease; }
.server-promo .promo-events .card-items:is(:hover, :focus-visible) .card-items__image { transform: scale(1.08); }
.server-promo .promo-events .card-items::before { background-image: linear-gradient(to bottom, transparent, #303030 70%); z-index: 1; transition: background-color 250ms ease; }
.server-promo .promo-events .card-items:is(:hover, :focus-visible)::before { background-color: rgba(0, 0, 0, 0.72); }
.server-promo .promo-events .card-btn { opacity: 0.55; filter: brightness(0.7); transition: opacity 200ms ease, filter 200ms ease; flex-shrink: 0; width: 180px; max-width: 100%; }
.server-promo .promo-events .card-items:is(:hover, :focus-visible) .card-btn { opacity: 1; filter: brightness(1); }
.server-promo .promo-events .card-items:hover .card-btn img { content: normal; }
.server-promo .promo-events .home-events-primary > .container { width: 100%; max-width: none; padding: 0; }
.server-promo .promo-events .home-events-primary { margin-top: 0; margin-bottom: 40px; }
.server-promo .promo-events .home-events-primary__main { position: relative; }
.server-promo .home-events-primary__main video.events-bg { filter: brightness(0.6); }
.server-promo .home-events-primary__card .events-server-list { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 16px; }
.server-promo .home-events-primary__card .events-server-values { flex-shrink: 0; }
.server-promo .home-events-primary__card .events-server-values--additional { padding: 14px; gap: 4px; line-height: 1.2; overflow-wrap: anywhere; }
.server-promo .home-events-primary__card .events-server-values--additional::after { width: 120%; height: 120%; }
.server-promo .home-events-primary__card .events-server-values--additional > div { white-space: pre-line; }
.server-promo .home-events-primary__card .events-server-values--additional small { font-size: 14px; font-weight: 700; color: #e1bf7c; cursor: help; }
.server-promo .promo-events .home-events-primary__card { position: relative; overflow: hidden; min-height: clamp(200px, 32vw, 320px); }
.server-promo .promo-events .card-items::after { pointer-events: none; z-index: 4; }
.server-promo .promo-events .card-items__heading { margin: 0; top: 0; flex-shrink: 0; }
.server-promo .promo-events .card-items__paragraph { margin: 0; min-height: 0; }
.server-promo .promo-events .card-items__paragraph-cont { display: block; position: relative; z-index: 3; overflow: auto; scrollbar-width: none; min-height: 0; max-height: 0; flex: 0 1 auto; opacity: 0; transform: translateY(16px); transition: max-height 350ms ease, grid-template-rows 350ms ease, opacity 250ms ease, transform 350ms ease; }
.server-promo .promo-events .card-items__paragraph-cont::-webkit-scrollbar { display: none; }
.server-promo .promo-events .card-items:is(:hover, :focus-visible) .card-items__paragraph-cont { grid-template-rows: 1fr; max-height: 220px; opacity: 1; transform: none; }
@media (hover: none) {
    .server-promo .promo-events .card-items { flex-basis: 100%; }
    .server-promo .promo-events .card-items__paragraph-cont { grid-template-rows: 1fr; max-height: 220px; opacity: 1; transform: none; }
    .server-promo .promo-events .card-items::before { background-color: rgba(0, 0, 0, 0.72); }
}
.server-promo .promo-roadmap { overflow: clip; --ff-sec: "Cormorant", serif; }
.server-promo[data-promo-page="main"] main > :is(.home, .promo-events, .promo-roadmap, .xm-classes-section, .reviews)::after,
.server-promo[data-promo-page="main"] main > :is(.home, .promo-events, .promo-roadmap, .xm-classes-section, .reviews) + section::before { display: none; }
.server-promo[data-promo-page="main"] .promo-roadmap { overflow: clip visible; }
.server-promo[data-promo-page="main"] .xm-classes-section--essence { border: 0; }
.server-promo[data-promo-page="essence"] main > section::before,
.server-promo[data-promo-page="essence"] main > section::after { display: none; }
.server-promo[data-promo-page="essence"] .xm-classes-section--essence { border: 0; }
.server-promo .promo-roadmap .roadmap-list-item { background: none; border: 0; padding: 0; color: inherit; }
.server-promo .promo-roadmap .roadmap-block-title { margin: 0; font-family: var(--ff); }
.server-promo .promo-roadmap .roadmap-list-dots { height: auto; aspect-ratio: 961 / 317; fill: #7b8389; overflow: visible; }
.server-promo .promo-roadmap .roadmap-list-item__stage { font-family: var(--ff); }
.server-promo .promo-roadmap .roadmap-block-title span { color: #b19570 !important; }
.server-promo .promo-roadmap .roadmap-character { width: 60%; }
.server-promo .promo-roadmap .roadmap-character img { width: 100%; height: auto; }
.server-promo .promo-roadmap .roadmap-block p { margin: 0; line-height: 1.6; }
.server-promo .promo-roadmap .roadmap-block .roadmap-block-subtitle { font-size: 22px; color: #dad0a4; }
.server-promo .promo-roadmap .roadmap-block:has(> .roadmap-block-subtitle) { gap: 12px; }
.server-promo .promo-roadmap .roadmap-panels { display: grid; gap: 20px; }
.server-promo .promo-roadmap.roadmap-enhanced .roadmap-block { grid-area: 1 / 1; visibility: hidden; }
.server-promo .promo-roadmap.roadmap-enhanced .roadmap-block.active { visibility: visible; }
.server-promo .promo-roadmap:not(.roadmap-enhanced) .roadmap-list,
.server-promo .promo-roadmap:not(.roadmap-enhanced) .roadmap-character { display: none; }
.server-promo .promo-roadmap:not(.roadmap-enhanced) .roadmap-container { min-height: auto; padding-block: 40px; }
/* Keep the original track proportions, with slightly tighter horizontal spacing. */
.server-promo .promo-roadmap.roadmap--flow .roadmap-list {
    --roadmap-spacing: .88;
    left: -60px;
    width: calc(1008px * var(--roadmap-spacing));
    height: 128px;
    display: grid;
    grid-template-columns: calc(256px * var(--roadmap-spacing)) calc(221px * var(--roadmap-spacing)) calc(256px * var(--roadmap-spacing)) calc(245px * var(--roadmap-spacing));
    gap: calc(10px * var(--roadmap-spacing));
}
.server-promo .promo-roadmap.roadmap--flow:not(.roadmap--four) .roadmap-list { bottom: 82px; }
.server-promo .promo-roadmap.roadmap--flow .roadmap-list-dots {
    left: calc(144px * var(--roadmap-spacing));
    height: 289.3px;
    object-fit: fill;
}
.server-promo .promo-roadmap.roadmap--flow .roadmap-list-item { height: 128px; }
/* Centre the markers in the three gaps measured in the original track. */
.server-promo .promo-roadmap.roadmap--flow .roadmap-list-item--second { left: calc(-12px * var(--roadmap-spacing)); bottom: 142px; }
.server-promo .promo-roadmap.roadmap--flow .roadmap-list-item--third { left: calc(21px * var(--roadmap-spacing)); bottom: 110px; }
.server-promo .promo-roadmap.roadmap--flow .roadmap-list-item--fourth { left: calc(-12px * var(--roadmap-spacing)); bottom: 304px; }
.server-promo .promo-roadmap.roadmap--flow .roadmap-list-item:nth-of-type(n + 5) {
    position: absolute;
    left: calc((1018px + var(--extension-index) * 266px) * var(--roadmap-spacing));
    width: calc(256px * var(--roadmap-spacing));
}
.server-promo .roadmap-extension {
    position: absolute;
    /* Continue one dot interval beyond the original track's last dot, without clipping it. */
    left: calc(1038px * var(--roadmap-spacing));
    transform: scaleX(var(--roadmap-spacing));
    transform-origin: left top;
    top: -260px;
    pointer-events: none;
    overflow: visible;
}
.server-promo .roadmap-extension path {
    fill: none;
    stroke: #7b8389;
    stroke-width: 11px;
    stroke-dasharray: 1 26;
    stroke-linecap: round;
}
.server-promo .promo-roadmap.roadmap--four .roadmap-list { --roadmap-spacing: 1; left: -64px; }
@media (min-width: 911px) {
    .server-promo .promo-roadmap:not(.roadmap--flow) .roadmap-list {
        left: -64px;
        width: 1008px;
        height: 128px;
        display: grid;
        grid-template-columns: 256px 221px 256px 245px;
        gap: 10px;
    }
    .server-promo .promo-roadmap:not(.roadmap--flow) .roadmap-list-item { height: 128px; }
    .server-promo .promo-roadmap:not(.roadmap--flow) .roadmap-list-item--second { left: -12px; bottom: 142px; }
    .server-promo .promo-roadmap:not(.roadmap--flow) .roadmap-list-item--third { left: 21px; bottom: 110px; }
    .server-promo .promo-roadmap:not(.roadmap--flow) .roadmap-list-item--fourth { left: -12px; bottom: 304px; }
}
@media (max-width: 1250px) {
    .server-promo .promo-roadmap.roadmap--flow .roadmap-list {
        position: static;
        display: flex;
        flex-direction: column;
        width: auto;
        height: auto;
    }
    .server-promo .promo-roadmap.roadmap--flow .roadmap-container {
        min-height: auto;
        padding: 20px;
        display: flex;
        flex-direction: column-reverse;
        gap: 20px;
    }
    .server-promo .promo-roadmap.roadmap--flow .roadmap-list-item,
    .server-promo .promo-roadmap.roadmap--flow .roadmap-list-item:nth-of-type(n + 5) {
        position: relative;
        left: auto;
        bottom: 0;
        width: auto;
        height: auto;
        flex-direction: row;
        gap: 0;
    }
    .server-promo .promo-roadmap.roadmap--flow .roadmap-list-item img { transform: none; }
    .server-promo .promo-roadmap.roadmap--flow .roadmap-list-dots,
    .server-promo .roadmap-extension { display: none; }
}
.server-promo .promo-roadmap.roadmap--flow:not(.roadmap-enhanced) .roadmap-list { display: none; }
.server-promo[data-promo-page="main"] .xm-classes-tab__label {
    font-size: clamp(1rem, 1.4vw, 1.125rem);
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
}
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .streams-info { min-width: 0; }
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .streams-video video { width: 100%; }
@media (min-width: 901px) {
    .server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .streams-body { grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1fr); }
}
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-main { align-items: center; }
.server-promo[data-promo-page="main"] .xm-classes-layout > .streams-line { display: none; }
.server-promo[data-promo-page="main"] .xm-classes-tab__content { min-width: 0; }
.server-promo[data-promo-page="main"] .xm-classes-tab { align-items: center; justify-content: center; }
.server-promo[data-promo-page="main"] .xm-classes-tab__label { min-width: 0; margin-left: 8px; }
.server-promo[data-promo-page="main"] .xm-classes-tab__icon { display: grid; place-items: center; width: 32px; height: 32px; }
.server-promo[data-promo-page="main"] .xm-classes-tab__icon--font { text-align: center; font-size: clamp(22px, 1.8vw, 28px); line-height: 1; color: #c5bca4; }
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-text { width: 100%; margin-bottom: 60px; }
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-title {
    display: block;
    margin: 0;
    padding: 0;
    font-family: var(--ff);
    font-size: clamp(32px, 4vw, 48px);
    letter-spacing: -0.2px;
    line-height: 1;
    text-wrap: balance;
    hyphens: none;
}
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-title::after { display: none; }
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-text .xm-classes-desc {
    max-width: none;
    font-size: clamp(18px, 1.4vw, 20px);
    line-height: 1.5;
    color: #c5bca4;
    text-wrap: pretty;
    hyphens: none;
}
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-frame { max-width: 680px; min-height: 0; margin: 0 0 36px; }
.server-promo:is([data-promo-page="main"], [data-promo-page="essence"]) .xm-classes-video-wrap { border-radius: 16px; }
.server-promo[data-promo-page="main"] #xm-classes-image { object-position: right center; }
@media (min-width: 1024px) {
    .server-promo[data-promo-page="main"] .xm-classes-section__inner { max-width: var(--container-width); }
    .server-promo[data-promo-page="main"] .xm-classes-layout { grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1fr); }
    .server-promo[data-promo-page="main"] .xm-classes-tabs { grid-column: 3; padding-right: 10px; }
}
.server-promo .reviews .reviews-grid.reviews-fallback { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
.server-promo .reviews .reviews-grid.reviews-fallback > li { grid-column: auto; grid-row: auto; }
.server-promo .reviews-grid-item__icon > .promo-clan-image { width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 576px) {
    .server-promo .reviews .reviews-grid.reviews-fallback { grid-template-columns: minmax(0, 1fr); }
}

.server-promo .reviews-heading .heading-title { margin-bottom: 0; }
.server-promo[data-promo-page="main"] .reviews { padding-top: calc(var(--section-pt, 0px) + 32px); }
.server-promo :is(.streams-heading, .footer-heading) .heading-title { margin-bottom: 16px; }
.server-promo :is(.streams-heading, .footer-heading) .heading-subheading { line-height: 20px; }
.server-promo .xm-classes-fps-badge { font-family: var(--ff); }
.server-promo button, .server-promo .xm-classes-tab, .server-promo .xm-classes-tab__label { font-family: var(--root-button-ff); }
.server-promo .streams-slider:not(.swiper-initialized) { height: auto; max-height: none; }
.server-promo .streams-slider:not(.swiper-initialized) .swiper-wrapper { height: auto; width: 100%; }
.server-promo .streams-slider:not(.swiper-initialized) .streams-videos__item { aspect-ratio: 16 / 9; height: auto; }
.server-promo .streams-slider.swiper-initialized { height: 900px; }
.server-promo .streams-slider.swiper-vertical > .swiper-wrapper { flex-direction: column; }

/* Five-stage campaign map. */
.server-promo .roadmap--campaign { padding: 64px 0 80px; }
.server-promo .roadmap--campaign .campaign-container { position: relative; padding: 0 32px; isolation: isolate; }
.server-promo .campaign-heading { display: flex; align-items: center; gap: 24px; margin-bottom: 32px; position: relative; z-index: 1; }
.server-promo .campaign-heading h2 { margin: 0; font: 700 36px/1.2 var(--ff); color: #fff; text-transform: uppercase; }
.server-promo .campaign-heading > span { color: #dad0a4; font-size: 16px; }
.server-promo .campaign-heading::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, #555253, transparent); }
.server-promo .campaign-map-scroll { width: 70%; overflow-x: auto; position: relative; z-index: 3; scrollbar-width: thin; scrollbar-color: #8a7350 #17191b; }
.server-promo .campaign-map { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); min-width: 760px; height: 280px; }
.server-promo .campaign-route { position: absolute; inset: 0; z-index: 1; width: 100%; height: 280px; overflow: visible; fill: #7b8389; pointer-events: none; }
.server-promo .campaign-node { position: relative; z-index: 2; margin-top: var(--node-top); align-self: start; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 0 8px; border: 0; background: none; color: #c5bfb2; font-family: var(--ff); cursor: pointer; }
.server-promo .campaign-node-seal { position: relative; display: grid; place-items: center; width: 72px; height: 72px; border: 0; background: none; }
.server-promo .campaign-node-seal img { position: absolute; width: 96px; height: 96px; max-width: none; object-fit: contain; transition: opacity 220ms ease-out; }
.server-promo .campaign-mark-gold { opacity: 0; }
.server-promo .campaign-node-seal > span { position: absolute; bottom: -12px; min-width: 28px; padding: 2px 6px; color: #dad0a4; font-size: 12px; line-height: 16px; }
.server-promo .campaign-node-title { font: 700 18px/24px var(--ff); text-transform: uppercase; overflow-wrap: anywhere; }
.server-promo .campaign-node:hover { color: #fff1d4; }
.server-promo .campaign-node.active { color: #dad0a4; }
.server-promo .campaign-node:is(.active, .is-complete) .campaign-mark-gold { opacity: 1; }
.server-promo .campaign-node:is(.active, .is-complete) .campaign-mark-white { opacity: 0; }

.server-promo .campaign-node:focus-visible { outline: 2px solid #e1bf7c; outline-offset: 8px; border-radius: 4px; }
.server-promo .roadmap--campaign .campaign-panels { position: relative; z-index: 1; width: 66%; padding: 8px 0 0; }
.server-promo .roadmap--campaign .campaign-panel { position: relative; max-width: none; min-height: 260px; padding: 32px; gap: 16px; border: 6px solid #464646; border-radius: 16px; background: linear-gradient(to bottom, #303030, #4d4d4d); }

.server-promo .campaign-panel .roadmap-block-title { font-size: clamp(32px, 2.5vw, 40px); line-height: 1.2; color: #fff; }

.server-promo .campaign-character { position: absolute; right: 36px; bottom: -48px; width: 48%; height: calc(100% + 48px); object-fit: contain; object-position: right bottom; z-index: 2; pointer-events: none; opacity: 0; transition: opacity 350ms ease-out; }
.server-promo .campaign-character.active { opacity: 1; }
.server-promo .campaign-character--left { right: 56px; }
.server-promo .campaign-character--further-left { right: 76px; }
.server-promo .campaign-character--last { right: -4px; bottom: -68px; transform: scale(1.1); transform-origin: right bottom; }
.server-promo .roadmap--campaign:not(.roadmap-enhanced) .campaign-map-scroll { display: none; }
@media (max-width: 1100px) {
    .server-promo .campaign-map-scroll { width: 100%; }
    .server-promo .roadmap--campaign .campaign-panels { width: 80%; }
    .server-promo .campaign-character { width: 55%; }
    .server-promo .campaign-character.active { opacity: .2; }
}
@media (max-width: 760px) {
    .server-promo .roadmap--campaign { padding: 40px 0; }
    .server-promo .roadmap--campaign .campaign-container { padding: 0 20px; }
    .server-promo .campaign-heading { margin-bottom: 20px; gap: 16px; }
    .server-promo .campaign-heading h2 { font-size: 28px; }
    .server-promo .roadmap--campaign .campaign-panels { width: 100%; padding-top: 20px; }
    .server-promo .roadmap--campaign .campaign-panel { padding: 24px; min-height: 280px; }
    .server-promo .campaign-character { display: none; }
}
.server-promo .campaign-route circle { transition: fill 220ms ease-out; }
.server-promo .campaign-route circle.is-filled { fill: #dad0a4; }

.server-promo .campaign-autoplay { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid #555253; border-radius: 8px; background: #1b1c1e; color: #dad0a4; cursor: pointer; }
.server-promo .campaign-autoplay:hover { background: #303030; }
.server-promo .campaign-autoplay[aria-pressed="true"] .campaign-play-icon,
.server-promo .campaign-autoplay[aria-pressed="false"] .campaign-pause-icon { display: none; }

/* Keep GOD copy readable over the pale hair and scattered light in its artwork. */
.server-promo[data-promo-slug="god"] .xm-classes-section--essence { padding-top: 0; }
.server-promo[data-promo-slug="god"] .xm-classes-tabs .xm-classes-tab__label { text-transform: uppercase; }
.server-promo[data-promo-slug="god"] .home-slider-pagination .progress { background: #fff !important; }
.server-promo[data-promo-slug="god"] .header .navigation__menu__bar-list li a::after { background-color: #fff; }
.server-promo[data-promo-slug="god"] :is(.heading, .home-slider-heading, .home-slider-description, .home-aside, .campaign-heading, .campaign-node-title, .campaign-panel, .reviews-grid-item, .footer-bottom, .header) {
    text-shadow: 0 2px 4px rgb(0 0 0 / 90%), 0 0 16px rgb(0 0 0 / 65%);
}
.server-promo[data-promo-slug="god"] :is(.heading-label, .home-aside__title span) { color: #adb0b6 !important; }
.server-promo[data-promo-slug="god"] .home-slider-backdrop::after {
    inset: -32px -24px;
    background: radial-gradient(ellipse at 30% 50%, rgb(8 11 18 / 88%) 0%, rgb(8 11 18 / 65%) 38%, transparent 76%);
    filter: blur(28px);
}
.server-promo[data-promo-slug="god"] .home-aside::after {
    background: linear-gradient(90deg, transparent, rgb(8 11 18 / 65%) 25%, rgb(8 11 18 / 85%) 65%, rgb(8 11 18 / 55%) 85%, transparent);
}
.server-promo[data-promo-slug="god"] :is(.xm-classes-text, .reviews-heading, .streams-heading, .footer-heading) {
    position: relative;
    isolation: isolate;
}
.server-promo[data-promo-slug="god"] :is(.xm-classes-text, .reviews-heading, .streams-heading, .footer-heading)::before {
    content: "";
    position: absolute;
    inset: -28px -24px;
    z-index: -1;
    background: radial-gradient(ellipse, rgb(10 13 19 / 80%), rgb(10 13 19 / 45%) 45%, transparent 75%);
    filter: blur(20px);
    pointer-events: none;
}
.server-promo[data-promo-slug="god"] :is(.heading-subheading, .xm-classes-desc, .reviews-grid-item__description, .footer-bottom) { color: #d5d6da; }
.server-promo[data-promo-slug="god"] .reviews-grid-item { background: rgb(20 23 29 / 88%); }
.server-promo[data-promo-slug="god"] .campaign-panel { background: linear-gradient(180deg, rgb(29 32 38 / 96%), rgb(48 51 58 / 96%)); }
.server-promo[data-promo-slug="god"] .campaign-route { filter: drop-shadow(0 2px 3px rgb(0 0 0 / 85%)); }
.server-promo[data-promo-slug="god"] .footer { background: linear-gradient(180deg, transparent, rgb(10 13 19 / 55%) 35%, #0a0d13 82%); }
.server-promo[data-promo-slug="god"] .home-events-primary__card::after { display: block; background: rgb(0 0 0 / 20%); }
.server-promo[data-promo-slug="god"] .home-events-primary__main .button-sm::after { display: none; }
.server-promo[data-promo-slug="god"] :is(.home-button.button-primary, .promo-auth-button, .home-events-primary__main .button-sm) {
    --god-button-art: url('resources/promo_essence/img/btn.png');
    position: relative;
    isolation: isolate;
    background: none !important;
    opacity: 1;
    color: #f0f1f4;
    text-shadow: 0 2px 3px #080a0e;
    outline-color: #cfd2da;
}
.server-promo[data-promo-slug="god"] .home-button.button-primary { --god-button-art: url('resources/promo_essence/img/btn-large.png'); }
.server-promo[data-promo-slug="god"] :is(.home-button.button-primary, .promo-auth-button, .home-events-primary__main .button-sm)::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--god-button-art) center / contain no-repeat;
    opacity: 1;
    transform: none;
    filter: grayscale(1) brightness(.75) contrast(1.1);
    transition: filter 200ms ease-out;
    pointer-events: none;
}
.server-promo[data-promo-slug="god"] :is(.home-button.button-primary, .promo-auth-button, .home-events-primary__main .button-sm):is(:hover, :focus-visible)::before { filter: grayscale(1) brightness(1) contrast(1.1); }

.server-promo .xm-classes-gallery-controls { display: flex; align-items: center; justify-content: center; gap: 18px; padding-top: 16px; color: #c5bca4; }
.server-promo .xm-classes-gallery-controls[hidden] { display: none; }
.server-promo .xm-classes-gallery-controls button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; color: #e1bf7c; background: #17191d; border: 1px solid #71654f; border-radius: 50%; cursor: pointer; }
.server-promo .xm-classes-gallery-controls button:is(:hover, :focus-visible) { color: #f0dba7; background: #29251f; border-color: #e1bf7c; }
.server-promo .xm-classes-gallery-controls button:focus-visible { outline: 2px solid #e1bf7c; outline-offset: 3px; }
.server-promo .xm-classes-gallery-controls [data-feature-image-count] { min-width: 64px; text-align: center; font-family: var(--ff); font-size: 16px; font-variant-numeric: tabular-nums; letter-spacing: .08em; }