.artifact-book {
    --artifact-green: #5af5a0;
    --artifact-deep: #07110c;
    --artifact-gold: #c69a5f;
    --artifact-text: #d9d7ce;
    position: relative;
    isolation: isolate;
    max-width: 1080px;
    margin: 0 auto;
    padding: clamp(38px, 6vw, 74px) clamp(18px, 5vw, 58px) 84px;
    overflow: hidden;
    color: var(--artifact-text);
    border: 1px solid rgba(90, 245, 160, .2);
    clip-path: polygon(0 16px, 16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px));
    background:
        radial-gradient(circle at 50% 16%, rgba(45, 173, 104, .12), transparent 29%),
        radial-gradient(circle at 8% 58%, rgba(198, 154, 95, .07), transparent 27%),
        linear-gradient(145deg, rgba(12, 22, 16, .97), rgba(3, 8, 5, .98));
    box-shadow: 0 35px 90px rgba(0, 0, 0, .62), inset 0 0 120px rgba(0, 0, 0, .62);
}

.artifact-book::before,
.artifact-book::after {
    content: '';
    position: absolute;
    z-index: -1;
    pointer-events: none;
}

.artifact-book::before {
    inset: 12px;
    border: 1px solid rgba(198, 154, 95, .13);
    clip-path: inherit;
}

.artifact-book::after {
    width: 520px;
    height: 520px;
    left: 50%;
    top: -325px;
    border: 1px solid rgba(90, 245, 160, .14);
    border-radius: 50%;
    box-shadow: 0 0 80px rgba(90, 245, 160, .08), inset 0 0 80px rgba(90, 245, 160, .05);
    transform: translateX(-50%);
}

.artifact-runes {
    position: absolute;
    top: 65px;
    color: rgba(90, 245, 160, .16);
    font-size: 1.05rem;
    letter-spacing: .48rem;
    writing-mode: vertical-rl;
    text-shadow: 0 0 12px rgba(90, 245, 160, .28);
    animation: artifact-rune-pulse 4.8s ease-in-out infinite;
}

.artifact-runes--left { left: 21px; }
.artifact-runes--right { right: 21px; transform: rotate(180deg); animation-delay: -2.4s; }

.artifact-hero { position: relative; text-align: center; }

.artifact-kicker {
    margin: 0 0 21px;
    color: var(--artifact-gold);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .3em;
    text-transform: uppercase;
}

.artifact-sigil {
    display: grid;
    width: 68px;
    height: 68px;
    margin: 0 auto 17px;
    place-items: center;
    color: var(--artifact-green);
    border: 1px solid rgba(90, 245, 160, .45);
    transform: rotate(45deg);
    box-shadow: 0 0 30px rgba(90, 245, 160, .12), inset 0 0 22px rgba(90, 245, 160, .08);
}

.artifact-sigil::before {
    content: '';
    position: absolute;
    inset: 7px;
    border: 1px solid rgba(198, 154, 95, .35);
}

.artifact-sigil span { font-size: 1.75rem; transform: rotate(-45deg); text-shadow: 0 0 16px currentColor; }

.artifact-hero h1 {
    margin: 0;
    color: #f0eee7;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(2.55rem, 6vw, 4.8rem);
    font-weight: 500;
    letter-spacing: .08em;
    line-height: 1;
    text-shadow: 0 0 34px rgba(90, 245, 160, .15);
}

.artifact-untitled {
    margin: 14px 0 0;
    color: #9fa8a0;
    font-size: clamp(1.05rem, 2.4vw, 1.45rem);
    letter-spacing: .12em;
    text-transform: uppercase;
}

.artifact-lead {
    max-width: 710px;
    margin: 25px auto 0;
    color: #aeb5af;
    font-size: clamp(1rem, 2vw, 1.15rem);
    line-height: 1.85;
}

.artifact-divider {
    display: flex;
    align-items: center;
    gap: 17px;
    width: min(470px, 82%);
    margin: 40px auto;
    color: rgba(198, 154, 95, .78);
}

.artifact-divider::before,
.artifact-divider::after {
    content: '';
    height: 1px;
    flex: 1;
    background: linear-gradient(90deg, transparent, currentColor);
}

.artifact-divider::after { transform: scaleX(-1); }
.artifact-divider span { color: var(--artifact-green); font-size: 1.25rem; text-shadow: 0 0 12px currentColor; }

.artifact-intro {
    max-width: 800px;
    margin: 0 auto 48px;
    color: #c0c3bc;
    font-size: 1rem;
    line-height: 1.9;
    text-align: center;
}

.artifact-intro p { margin: 0 0 17px; }
.artifact-intro strong { color: #ece9df; }

.artifact-record {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    position: relative;
    border: 1px solid rgba(90, 245, 160, .2);
    background: rgba(1, 7, 3, .56);
    box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 18px 45px rgba(0, 0, 0, .24);
}

.artifact-record::before {
    content: 'ᚠ  ·  ᚢ  ·  ᚦ  ·  ᚨ  ·  ᚱ';
    position: absolute;
    left: 50%;
    top: -12px;
    padding: 2px 14px;
    color: rgba(90, 245, 160, .65);
    background: #07100b;
    font-size: .73rem;
    letter-spacing: .22em;
    transform: translateX(-50%);
}

.artifact-record__item {
    min-width: 0;
    padding: 29px 16px 26px;
    border-right: 1px solid rgba(90, 245, 160, .14);
    text-align: center;
}

.artifact-record__item:last-child { border-right: 0; }

.artifact-record__item span {
    display: block;
    min-height: 34px;
    margin-bottom: 10px;
    color: #78827b;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .14em;
    line-height: 1.45;
    text-transform: uppercase;
}

.artifact-record__item strong {
    color: #dedbd1;
    font-size: 1.02rem;
    line-height: 1.4;
}

.artifact-record__item--chapters strong {
    display: block;
    color: var(--artifact-green);
    font-size: 2.55rem;
    line-height: 1;
    text-shadow: 0 0 25px rgba(90, 245, 160, .32);
}

.artifact-subscription {
    position: relative;
    max-width: 820px;
    margin: 62px auto 0;
    padding: 42px clamp(18px, 5vw, 52px);
    overflow: hidden;
    border: 1px solid rgba(90, 245, 160, .22);
    background:
        radial-gradient(circle at 50% 0, rgba(90, 245, 160, .12), transparent 42%),
        rgba(2, 9, 5, .63);
    box-shadow: 0 22px 55px rgba(0, 0, 0, .28), inset 0 0 55px rgba(0, 0, 0, .28);
    text-align: center;
}

.artifact-subscription::before,
.artifact-subscription::after {
    content: 'ᚾ ᛟ ᛏ';
    position: absolute;
    top: 20px;
    color: rgba(90, 245, 160, .15);
    letter-spacing: .35em;
}

.artifact-subscription::before { left: 22px; }
.artifact-subscription::after { right: 22px; transform: scaleX(-1); }

.artifact-subscription__rune {
    color: var(--artifact-green);
    font-size: 2.3rem;
    line-height: 1;
    text-shadow: 0 0 20px rgba(90, 245, 160, .7);
}

.artifact-subscription__eyebrow {
    margin: 13px 0 8px;
    color: var(--artifact-gold);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .23em;
    text-transform: uppercase;
}

.artifact-subscription h2 {
    margin: 0 0 12px;
    color: #ece9df;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.55rem, 3.4vw, 2.25rem);
    font-weight: 500;
}

.artifact-subscription > p:not(.artifact-subscription__eyebrow) {
    max-width: 640px;
    margin: 0 auto;
    color: #969f98;
    line-height: 1.75;
}

.artifact-subscription__form {
    max-width: 660px;
    margin: 28px auto 0;
    text-align: left;
}

.artifact-email-label {
    display: block;
    margin: 0 0 8px;
    color: #b9c1bb;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.artifact-email-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
}

.artifact-email-row input {
    min-width: 0;
    padding: 14px 16px;
    color: #eef2ef;
    border: 1px solid rgba(90, 245, 160, .3);
    border-radius: 4px;
    background: rgba(1, 7, 3, .82);
    font: inherit;
    outline: none;
}

.artifact-email-row input:focus {
    border-color: var(--artifact-green);
    box-shadow: 0 0 0 3px rgba(90, 245, 160, .1);
}

.artifact-email-row button {
    padding: 13px 20px;
    color: #061009;
    border: 1px solid var(--artifact-green);
    border-radius: 4px;
    background: linear-gradient(135deg, #72ffb2, #35b875);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
    transition: transform .2s ease, filter .2s ease;
}

.artifact-email-row button:hover,
.artifact-email-row button:focus-visible {
    filter: brightness(1.12);
    transform: translateY(-1px);
}

.artifact-consent {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: start;
    margin-top: 14px;
    color: #7f8982;
    font-size: .78rem;
    line-height: 1.55;
}

.artifact-consent input { margin-top: 3px; accent-color: var(--artifact-green); }
.artifact-consent a { color: #9bd8b8; }
.artifact-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.artifact-form-message {
    max-width: 660px;
    margin: 22px auto -6px;
    padding: 12px 15px;
    border: 1px solid;
    border-radius: 4px;
    font-size: .9rem;
    line-height: 1.55;
}

.artifact-form-message--success { color: #baf8d4; border-color: rgba(90, 245, 160, .32); background: rgba(90, 245, 160, .08); }
.artifact-form-message--error { color: #f1b7b7; border-color: rgba(205, 83, 83, .35); background: rgba(205, 83, 83, .08); }

.artifact-seal-section {
    position: relative;
    max-width: 780px;
    margin: 64px auto 0;
    padding: 43px clamp(18px, 5vw, 52px) 38px;
    overflow: hidden;
    border-top: 1px solid rgba(198, 154, 95, .25);
    border-bottom: 1px solid rgba(198, 154, 95, .25);
    text-align: center;
}

.artifact-seal-section h2 {
    position: relative;
    z-index: 1;
    margin: 0 0 10px;
    color: #e2ded2;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.45rem, 3vw, 2rem);
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.artifact-seal-section > p:not(.artifact-quote-count) {
    position: relative;
    z-index: 1;
    max-width: 590px;
    margin: 0 auto;
    color: #89928b;
    line-height: 1.75;
}

.artifact-orbit {
    position: absolute;
    width: 440px;
    height: 440px;
    left: 50%;
    top: 85px;
    border: 1px dashed rgba(90, 245, 160, .08);
    border-radius: 50%;
    transform: translateX(-50%);
    animation: artifact-orbit 32s linear infinite;
}

.artifact-orbit::before,
.artifact-orbit::after {
    content: 'ᛉ';
    position: absolute;
    color: rgba(90, 245, 160, .42);
    text-shadow: 0 0 15px currentColor;
}

.artifact-orbit::before { left: 16px; top: 91px; }
.artifact-orbit::after { right: 16px; bottom: 91px; transform: rotate(180deg); }

.artifact-seal {
    display: grid;
    position: relative;
    z-index: 2;
    width: 156px;
    height: 156px;
    margin: 31px auto 21px;
    padding: 0;
    place-items: center;
    overflow: hidden;
    color: #d2a66e;
    border: 1px solid rgba(198, 154, 95, .62);
    border-radius: 50%;
    background: radial-gradient(circle, #342719 0 23%, #15100b 25% 48%, #3b2a18 50% 52%, #080c09 54%);
    box-shadow: 0 0 0 7px rgba(198, 154, 95, .035), 0 0 38px rgba(90, 245, 160, .08), 0 18px 35px rgba(0, 0, 0, .5), inset 0 0 28px rgba(0, 0, 0, .82);
    cursor: pointer;
    transition: transform .25s ease, box-shadow .25s ease;
}

.artifact-seal:hover,
.artifact-seal:focus-visible {
    outline: 1px solid rgba(90, 245, 160, .6);
    outline-offset: 7px;
    transform: translateY(-3px) scale(1.025);
    box-shadow: 0 0 52px rgba(90, 245, 160, .17), 0 20px 40px rgba(0, 0, 0, .55), inset 0 0 28px rgba(0, 0, 0, .82);
}

.artifact-seal:active { transform: scale(.96); }

.artifact-seal.is-awake { animation: artifact-seal-awake .7s ease; }

.artifact-seal__ring {
    position: absolute;
    inset: 13px;
    color: rgba(210, 166, 110, .67);
    border: 1px dashed currentColor;
    border-radius: 50%;
    font-size: .68rem;
    letter-spacing: .17em;
    line-height: 128px;
    white-space: nowrap;
    animation: artifact-ring-turn 18s linear infinite reverse;
}

.artifact-seal__mark {
    color: var(--artifact-green);
    font-size: 3rem;
    text-shadow: 0 0 18px rgba(90, 245, 160, .68);
}

.artifact-quote {
    display: grid;
    min-height: 85px;
    margin: 16px auto 5px;
    place-items: center;
    color: #dcd8cd;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.05rem, 2.3vw, 1.32rem);
    font-style: italic;
    line-height: 1.65;
    opacity: .66;
    transform: translateY(0);
    transition: opacity .35s ease, transform .35s ease, color .35s ease;
}

.artifact-quote.is-changing { opacity: 0; transform: translateY(9px); }
.artifact-quote.is-revealed { opacity: 1; color: #efebe0; text-shadow: 0 0 22px rgba(90, 245, 160, .08); }

.artifact-quote-count {
    margin: 7px 0 0;
    color: #667169;
    font-size: .74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.artifact-closing {
    max-width: 670px;
    margin: 57px auto 0;
    color: #8d968f;
    font-size: .92rem;
    line-height: 1.8;
    text-align: center;
}

@keyframes artifact-orbit { to { transform: translateX(-50%) rotate(360deg); } }
@keyframes artifact-ring-turn { to { transform: rotate(360deg); } }
@keyframes artifact-rune-pulse { 50% { opacity: .4; filter: brightness(1.7); } }
@keyframes artifact-seal-awake { 45% { filter: brightness(1.55); transform: scale(1.04); } }

@media (max-width: 820px) {
    .artifact-record { grid-template-columns: repeat(2, 1fr); }
    .artifact-record__item:nth-child(2) { border-right: 0; }
    .artifact-record__item:nth-child(-n+2) { border-bottom: 1px solid rgba(90, 245, 160, .14); }
}

@media (max-width: 540px) {
    .artifact-book { padding-inline: 16px; }
    .artifact-runes { display: none; }
    .artifact-record { grid-template-columns: 1fr; }
    .artifact-record__item { border-right: 0; border-bottom: 1px solid rgba(90, 245, 160, .14); }
    .artifact-record__item:nth-child(2) { border-right: 0; }
    .artifact-record__item:nth-child(-n+2) { border-bottom: 1px solid rgba(90, 245, 160, .14); }
    .artifact-record__item:last-child { border-bottom: 0; }
    .artifact-seal { width: 138px; height: 138px; }
    .artifact-seal__ring { line-height: 110px; }
    .artifact-email-row { grid-template-columns: 1fr; }
    .artifact-email-row button { width: 100%; }
    .artifact-subscription::before,
    .artifact-subscription::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .artifact-runes,
    .artifact-orbit,
    .artifact-seal__ring,
    .artifact-seal.is-awake { animation: none; }
    .artifact-seal,
    .artifact-quote { transition: none; }
}
