:root {
    --sanja-black: #020806;
    --sanja-ink: #06100c;
    --sanja-panel: #091710;
    --sanja-panel-2: #0d2117;
    --sanja-line: rgba(133, 255, 189, .12);
    --sanja-line-red: rgba(41, 218, 121, .36);
    --sanja-red: #159455;
    --sanja-red-hot: #32e58a;
    --sanja-red-dark: #073c24;
    --sanja-ember: #68ffaf;
    --sanja-gold: #b9d87d;
    --sanja-text: #effff5;
    --sanja-muted: #8fa99a;
    --sanja-max: 1420px;
    --sanja-shadow: 0 28px 90px rgba(0, 12, 7, .58);
}

body.edition-jade {
    background:
        linear-gradient(90deg, rgba(29, 128, 76, .05) 1px, transparent 1px),
        linear-gradient(rgba(29, 128, 76, .04) 1px, transparent 1px),
        radial-gradient(circle at 16% 12%, rgba(19, 128, 73, .24), transparent 32rem),
        linear-gradient(145deg, #020806, #07110c 60%, #020604);
    background-size: 96px 96px, 96px 96px, auto, auto;
}

.edition-jade .sanja-header {
    left: 78px;
    height: 76px;
    border-color: rgba(73, 236, 149, .16);
    background: rgba(2, 12, 8, .82);
}

.edition-jade .sanja-header::after {
    width: 48%;
    background: linear-gradient(90deg, var(--sanja-red-hot), transparent);
}

.edition-jade .sanja-header__inner {
    width: min(calc(100% - 60px), var(--sanja-max));
}

.edition-jade .sanja-brand__sigil,
.edition-jade .sanja-feature-card > i {
    border-radius: 0;
    border-color: rgba(71, 239, 153, .48);
    background: linear-gradient(145deg, rgba(47, 229, 137, .34), rgba(3, 39, 21, .12));
    box-shadow: inset 0 0 24px rgba(64, 255, 159, .13), 0 0 28px rgba(30, 203, 112, .12);
}

.edition-jade .sanja-nav > a,
.edition-jade .sanja-nav__group > a {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    letter-spacing: .16em;
}

.jade-command-rail {
    position: fixed;
    z-index: 1100;
    inset: 0 auto 0 0;
    width: 78px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 26px;
    padding: 25px 0;
    color: rgba(151, 255, 201, .55);
    border-right: 1px solid rgba(72, 230, 145, .18);
    background: rgba(2, 10, 7, .94);
    box-shadow: 18px 0 50px rgba(0, 0, 0, .22);
}

.jade-command-rail b {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #dffff0;
    border: 1px solid #2de187;
    font: 700 15px/1 ui-monospace, monospace;
}

.jade-command-rail span {
    font: 700 10px/1 ui-monospace, monospace;
    letter-spacing: .2em;
}

.jade-command-rail i {
    width: 1px;
    flex: 1;
    background: linear-gradient(transparent, #2de187, transparent);
}

.jade-command-rail small {
    font: 700 8px/1 ui-monospace, monospace;
    letter-spacing: .25em;
    writing-mode: vertical-rl;
}

.edition-jade .sanja-hero {
    margin-left: 78px;
    min-height: 900px;
    height: 100vh;
    border-bottom: 1px solid rgba(57, 235, 142, .2);
}

.edition-jade .sanja-hero::after {
    background:
        linear-gradient(90deg, rgba(1, 8, 5, .94), rgba(1, 8, 5, .73) 33%, rgba(1, 8, 5, .08) 68%),
        repeating-linear-gradient(90deg, transparent 0 119px, rgba(78, 240, 153, .035) 120px);
}

.edition-jade .sanja-hero__slide:not(:first-of-type),
.edition-jade .sanja-hero__controls { display: none; }
.edition-jade .sanja-hero__slide:first-of-type { opacity: 1 !important; visibility: visible !important; }
.edition-jade .sanja-hero__slide:first-of-type .sanja-eyebrow,
.edition-jade .sanja-hero__slide:first-of-type h2,
.edition-jade .sanja-hero__slide:first-of-type .sanja-hero__content > p,
.edition-jade .sanja-hero__slide:first-of-type .sanja-hero__buttons { opacity: 1 !important; transform: none !important; animation: none !important; }

.edition-jade .sanja-hero__visual {
    background-position: center right;
    filter: saturate(.94) contrast(1.09);
}

.edition-jade .sanja-hero__content {
    width: min(calc(100% - 96px), var(--sanja-max));
    padding-top: clamp(190px, 24vh, 250px);
}

.edition-jade .sanja-hero__content::before {
    position: absolute;
    z-index: -1;
    top: 150px;
    left: -32px;
    width: min(680px, 54vw);
    height: 650px;
    content: "";
    border: 1px solid rgba(72, 239, 151, .12);
    border-left: 3px solid rgba(52, 238, 140, .7);
    background: linear-gradient(135deg, rgba(3, 17, 10, .73), rgba(3, 17, 10, .08));
    clip-path: polygon(0 0, 92% 0, 100% 12%, 100% 100%, 8% 100%, 0 88%);
}

.edition-jade .sanja-hero h2 {
    max-width: 760px;
    font-size: clamp(56px, 7.3vw, 106px);
    text-transform: uppercase;
}

.edition-jade .sanja-hero h2 em {
    -webkit-text-stroke-color: rgba(68, 248, 155, .86);
}

.edition-jade .sanja-eyebrow,
.edition-jade .sanja-feature-card small {
    color: #8bdcaf;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

.edition-jade .sanja-button { clip-path: polygon(0 0, 90% 0, 100% 28%, 100% 100%, 10% 100%, 0 72%); }
.edition-jade .sanja-button--primary,
.edition-jade .sanja-header-cta { border-color: rgba(67, 235, 149, .55); background: linear-gradient(135deg, #2edc83, #0b673a 72%); box-shadow: 0 14px 36px rgba(20, 151, 82, .3); }
.edition-jade .sanja-dev-badge { border-color: rgba(61, 231, 143, .42); background: rgba(4, 17, 10, .9); }

.edition-jade .sanja-feature-ribbon {
    margin: -28px 0 0 78px;
}

.edition-jade .sanja-feature-ribbon__inner {
    width: min(calc(100% - 96px), var(--sanja-max));
    margin-left: max(48px, calc((100% - var(--sanja-max)) / 2));
    background: rgba(3, 17, 11, .9);
    border-color: rgba(76, 238, 151, .17);
    clip-path: polygon(0 0, 97% 0, 100% 28%, 100% 100%, 3% 100%, 0 72%);
}

.edition-jade .sanja-feature-card { min-height: 132px; }
.edition-jade .sanja-feature-card:hover { background: rgba(41, 218, 121, .1); }

.edition-jade .sanja-main {
    margin-left: calc(78px + max(24px, (100vw - 78px - var(--sanja-max)) / 2));
    margin-right: max(24px, (100vw - 78px - var(--sanja-max)) / 2);
    width: auto;
}

.edition-jade .sanja-content-grid {
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 28px;
}

.edition-jade .sanja-primary .page-hd,
.edition-jade .sanja-primary .content,
.edition-jade .sanja-sidebar .widget {
    border-color: rgba(73, 232, 145, .16);
    border-radius: 0;
    background-color: rgba(5, 20, 12, .88);
    clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}

.edition-jade .sanja-sidebar { position: sticky; top: 96px; }

.edition-jade .sanja-footer {
    margin-left: 78px;
    background: linear-gradient(90deg, rgba(2,9,6,.98), rgba(3,20,12,.9)), url('../images/editions/jade-dominion/hero.webp') center 55% / cover;
}

@media (max-width: 1120px) {
    .jade-command-rail { display: none; }
    .edition-jade .sanja-header { left: 0; }
    .edition-jade .sanja-hero,
    .edition-jade .sanja-footer { margin-left: 0; }
    .edition-jade .sanja-feature-ribbon { margin-left: 0; }
    .edition-jade .sanja-feature-ribbon__inner { margin-left: auto; }
    .edition-jade .sanja-main { width: min(calc(100% - 48px), var(--sanja-max)); margin-left: auto; margin-right: auto; }
}

@media (max-width: 760px) {
    .edition-jade .sanja-hero { min-height: 820px; height: 100svh; }
    .edition-jade .sanja-hero__content { width: calc(100% - 40px); padding-top: 170px; }
    .edition-jade .sanja-hero__content::before { left: -12px; top: 135px; width: calc(100% + 24px); height: 630px; }
    .edition-jade .sanja-hero h2 { font-size: clamp(43px, 14vw, 68px); }
    .edition-jade .sanja-feature-ribbon { margin-top: 0; }
    .edition-jade .sanja-feature-ribbon__inner { width: 100%; clip-path: none; grid-template-columns: 1fr; }
    .edition-jade .sanja-feature-card { min-height: 92px; }
    .edition-jade .sanja-content-grid { grid-template-columns: 1fr; }
    .edition-jade .sanja-sidebar { position: static; }
}
