.home-archive { position: relative; isolation: isolate; overflow: clip; }
.home-archive__atmosphere { position: absolute; z-index: -1; inset: 0; overflow: hidden; pointer-events: none; }
.home-archive__fog { position: absolute; inset: 16% -15% 8%; opacity: .075; background: radial-gradient(ellipse at 30% 70%, var(--color-fog), transparent 42%), radial-gradient(ellipse at 70% 40%, var(--color-fog), transparent 38%); animation: homeFog 22s ease-in-out infinite alternate; }
.home-archive__cinders { position: absolute; inset: 0; opacity: .24; background-image: radial-gradient(circle at 17% 21%, var(--color-ember) 0 1px, transparent 1.5px), radial-gradient(circle at 77% 49%, var(--color-ember) 0 1px, transparent 1.5px), radial-gradient(circle at 38% 74%, var(--color-ember) 0 1px, transparent 1.5px); background-size: 27rem 31rem, 39rem 35rem, 32rem 37rem; }
.home-archive__atmosphere::before { position: absolute; inset: 0; opacity: .18; background-image: linear-gradient(117deg, transparent 0 46%, rgb(158 161 156 / .12) 46.1% 46.3%, transparent 46.4%), linear-gradient(42deg, transparent 0 70%, rgb(158 161 156 / .08) 70.1% 70.25%, transparent 70.4%); background-size: 23rem 17rem, 31rem 23rem; content: ""; }
.home-archive .section { position: relative; }
.home-archive h1 a, .home-archive h2 a, .home-archive h3 a { color: inherit; text-decoration: none; }
.home-archive a:focus-visible { box-shadow: var(--focus-ring); }
.home-section-heading { display: flex; align-items: end; justify-content: space-between; gap: var(--space-6); }
.home-section-heading > * { min-width: 0; }
.home-section-heading p { max-width: 64ch; }
.home-section-link, .home-notice__action { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); font-weight: 700; }
.home-quest { padding-top: var(--space-18); }
.home-quest__grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(18rem, 4fr); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-quest__feature { position: relative; min-width: 0; min-height: 30rem; overflow: hidden; background: var(--color-basalt); }
.home-quest__image, .home-quest__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-quest__image { object-position: right center; }
.home-quest__veil { background: linear-gradient(90deg, rgb(17 18 20 / .98) 0%, rgb(17 18 20 / .9) 44%, rgb(17 18 20 / .36) 76%, rgb(17 18 20 / .18) 100%), linear-gradient(0deg, rgb(17 18 20 / .56), transparent 46%); }
.home-quest__content { position: relative; z-index: 1; display: flex; width: min(58%, 46rem); min-width: 0; min-height: 30rem; flex-direction: column; justify-content: center; gap: var(--space-3); padding: var(--space-8); }
.home-quest__content h1, .home-quest__content p { margin: 0; }
.home-quest__marker { display: flex; align-items: center; gap: var(--space-2); color: var(--color-ember-bright); font-size: var(--text-xs); font-weight: 700; letter-spacing: .09em; line-height: var(--leading-xs); }
.home-quest__marker-rule { width: 2.5rem; height: 2px; background: var(--color-ember); }
.home-quest__context { color: var(--color-ash-secondary); font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-quest__content h1 { max-width: 24ch; font-size: clamp(3.25rem, 5vw, 4rem); }
.home-quest__summary { max-width: 60ch; color: var(--color-ash-primary); font-size: var(--text-lg); line-height: var(--leading-lg); }
.home-quest__meta { margin-bottom: var(--space-2); }
.home-quest__content > .button { align-self: flex-start; }
.home-quest__notices { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); min-width: 0; background: var(--color-stone-line); gap: 1px; }
.home-notice { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); border-inline-start: 2px solid var(--color-ember); background: linear-gradient(135deg, rgb(255 255 255 / .025), transparent 45%), var(--color-basalt); padding: var(--space-5); }
.home-notice > * { margin: 0; }
.home-notice h2 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-notice p:not(.eyebrow) { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-notice__action { margin-top: auto; }
.home-dispatches__heading { margin-bottom: var(--space-6); }
.home-dispatches__wall { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-dispatch-card { position: relative; min-width: 0; overflow: hidden; background: var(--color-basalt); }
.home-dispatch-card--lead { min-height: 28rem; }
.home-dispatch-card--lead > img, .home-dispatch-card__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-dispatch-card--lead > img { object-position: right center; }
.home-dispatch-card__veil { background: linear-gradient(0deg, rgb(17 18 20 / .97), rgb(17 18 20 / .16) 75%); transition: background var(--transition-fast); }
.home-dispatch-card__content { position: relative; z-index: 1; display: flex; min-height: 28rem; flex-direction: column; justify-content: end; gap: var(--space-3); padding: var(--space-6); }
.home-dispatch-card__content > * { margin: 0; }
.home-dispatch-card h3 { font-size: var(--text-2xl); }
.home-dispatch-card--lead h3 { max-width: 24ch; }
.home-dispatch-card__content p:last-child { max-width: 42ch; color: var(--color-ash-primary); }
.home-dispatches__support { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); gap: 1px; min-width: 0; background: var(--color-stone-line); }
.home-dispatch-card--text { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); }
.home-dispatch-card--text > * { margin: 0; }
.home-dispatch-card--text:last-child { grid-column: 1 / -1; }
.home-dispatch-card--text h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-dispatch-card--text p:last-child { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-reviews__grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-review-intro { display: flex; max-width: 52ch; flex-direction: column; align-items: flex-start; gap: var(--space-3); margin-bottom: var(--space-6); }
.home-review-intro > * { margin: 0; }
.home-review-feature { display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); min-width: 0; background: var(--color-basalt); }
.home-review-feature__image { min-width: 0; min-height: 32rem; overflow: hidden; }
.home-review-feature__image img { width: 100%; height: 100%; object-position: 58% center; }
.home-review-feature__copy { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: var(--space-3); padding: var(--space-6); }
.home-review-feature__copy > * { margin: 0; }
.home-review-feature__copy h3 { max-width: 22ch; }
.home-review-feature__copy p { max-width: 48ch; }
.home-review-feature__copy > .button { align-self: flex-start; margin-top: var(--space-2); }
.home-review-shelf { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); gap: 1px; min-width: 0; background: var(--color-stone-line); }
.home-review-shelf__card { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); background: var(--color-basalt); padding: var(--space-5); }
.home-review-shelf__card > * { margin: 0; }
.home-review-shelf__card h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-review-shelf__card p { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-review-shelf__card a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); margin-top: auto; font-weight: 700; }
.home-guides__intro { display: flex; max-width: 60ch; flex-direction: column; align-items: flex-start; gap: var(--space-3); margin-bottom: var(--space-6); }
.home-guides__intro > * { margin: 0; }
.home-guides__wall { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-guide-feature { grid-column: span 6; display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; background: var(--color-basalt); }
.home-guide-feature > img { width: 100%; aspect-ratio: 3 / 2; object-position: center; }
.home-guide-feature__copy { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); padding: var(--space-5); }
.home-guide-feature__copy > * { margin: 0; }
.home-guide-feature__copy p { max-width: 52ch; }
.home-guide-feature__copy > .button { align-self: flex-start; margin-top: var(--space-2); }
.home-guide-card { grid-column: span 3; display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); background: var(--color-basalt); padding: var(--space-5); }
.home-guide-card > * { margin: 0; }
.home-guide-card h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-guide-card p { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-guide-card > a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); margin-top: auto; font-weight: 700; }
.home-guide-card__meta-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); color: var(--color-ash-secondary); font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-guide-card__meta-grid span { min-width: 0; }
.home-guide-card__meta-grid b { display: block; font-size: var(--text-xs); }
.home-guide-index { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); min-width: 0; background: var(--color-basalt-raised); padding: var(--space-5); }
.home-guide-index > * { min-width: 0; margin: 0; }
.home-guide-index p { max-width: 70ch; }
.home-guide-index .button { flex: 0 0 auto; }
.home-lore__intro { display: flex; max-width: 58ch; flex-direction: column; align-items: flex-start; gap: var(--space-3); margin-bottom: var(--space-6); }
.home-lore__intro > * { margin: 0; }
.home-longread { position: relative; min-width: 0; min-height: 32rem; overflow: hidden; border: var(--border-default); background: var(--color-basalt); }
.home-longread > img, .home-longread__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-longread > img { object-position: right center; }
.home-longread__veil { background: linear-gradient(90deg, rgb(17 18 20 / .94) 0%, rgb(17 18 20 / .78) 42%, rgb(17 18 20 / .18) 78%), linear-gradient(0deg, rgb(17 18 20 / .72), transparent 55%); }
.home-longread__copy { position: relative; z-index: 1; display: flex; width: min(48%, 40rem); min-height: 32rem; flex-direction: column; justify-content: end; gap: var(--space-3); padding: var(--space-8); }
.home-longread__copy > * { margin: 0; }
.home-longread__copy h3 { max-width: 22ch; }
.home-longread__copy p { max-width: 56ch; color: var(--color-ash-primary); }
.home-longread__copy > .button { align-self: flex-start; margin-top: var(--space-2); }
.home-lore-fragments { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-lore-fragments > article { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); background: var(--color-basalt); padding: var(--space-5); }
.home-lore-fragments > article > * { margin: 0; }
.home-lore-fragments h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-lore-fragments p { max-width: 42ch; }
.home-lore-fragments a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); margin-top: auto; font-weight: 700; }
.home-releases__heading { margin-bottom: var(--space-6); }
.home-releases__heading p { max-width: 58ch; }
.home-releases__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-releases__grid > article { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); border-inline-start: 2px solid var(--color-ember); background: var(--color-basalt); padding: var(--space-5); }
.home-releases__grid > article > * { margin: 0; }
.home-releases__grid h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-releases__grid p:not(.eyebrow) { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-releases__grid a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); margin-top: auto; font-weight: 700; }
.home-community__intro { display: flex; max-width: 56ch; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-6); }
.home-community__intro > * { margin: 0; }
.home-community__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-community-feature { position: relative; min-width: 0; min-height: 25rem; overflow: hidden; background: var(--color-basalt); }
.home-community-feature > img, .home-community-feature__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-community-feature > img { object-position: left center; }
.home-community-feature__veil { background: linear-gradient(0deg, rgb(17 18 20 / .96), rgb(17 18 20 / .16) 72%); }
.home-community-feature__copy { position: relative; z-index: 1; display: flex; min-height: 25rem; flex-direction: column; justify-content: end; gap: var(--space-3); padding: var(--space-6); border-top: 2px solid var(--color-ember); }
.home-community-feature__copy > * { margin: 0; }
.home-community-feature__copy h3 { font-size: var(--text-2xl); }
.home-community-feature__copy p { color: var(--color-ash-primary); }
.home-community-feature__copy a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); font-weight: 700; }
.home-community__support { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; min-width: 0; background: var(--color-stone-line); }
.home-community__support article { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); background: var(--color-basalt); padding: var(--space-5); }
.home-community__support article > * { margin: 0; }
.home-community__support h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-community__support p { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-community__support a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); margin-top: auto; font-weight: 700; }
.home-paths__intro { display: flex; max-width: 55ch; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-6); }
.home-paths__intro > * { margin: 0; }
.home-paths__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; border: var(--border-default); background: var(--color-stone-line); }
.home-paths__grid > article { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); background: var(--color-basalt); padding: var(--space-5); transition: background-color var(--transition-fast), box-shadow var(--transition-fast); }
.home-paths__grid > article > * { margin: 0; }
.home-paths__grid > article:hover, .home-paths__grid > article:focus-within { background: var(--color-basalt-raised); box-shadow: inset 0 2px 0 var(--color-ember); }
.home-paths__grid h3 { font-size: var(--text-xl); line-height: var(--leading-xl); }
.home-paths__grid p:not(.eyebrow) { font-size: var(--text-sm); line-height: var(--leading-sm); }
.home-paths__grid a:last-child { display: inline-flex; min-height: 44px; align-items: center; gap: var(--space-2); margin-top: auto; font-weight: 700; }
.home-editorial__panel { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); min-width: 0; border-top: 2px solid var(--color-ember); border-inline: var(--border-default); border-bottom: var(--border-default); background: linear-gradient(135deg, rgb(255 255 255 / .025), transparent 55%), var(--color-basalt); }
.home-editorial__copy { display: flex; min-width: 0; max-width: 42.5rem; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-8); }
.home-editorial__copy > * { margin: 0; }
.home-editorial__copy h2 { max-width: 24ch; }
.home-editorial__space { min-width: 0; background: radial-gradient(circle at 72% 66%, rgb(217 101 43 / .09), transparent 25%), linear-gradient(140deg, transparent 0 64%, rgb(158 161 156 / .04) 64.2% 64.5%, transparent 64.7%); }
.home-dispatch-card:hover .home-dispatch-card__veil, .home-dispatch-card:focus-within .home-dispatch-card__veil { background: linear-gradient(0deg, rgb(17 18 20 / .9), rgb(17 18 20 / .08) 75%); }
.home-notice:hover, .home-notice:focus-within, .home-guide-card:hover, .home-guide-card:focus-within, .home-releases__grid > article:hover, .home-releases__grid > article:focus-within { background: var(--color-basalt-raised); box-shadow: inset 0 2px 0 var(--color-ember); }
.home-reveal { opacity: 0; transition: opacity 220ms ease; }
.home-reveal.home-reveal--visible { opacity: 1; }
@keyframes homeFog { from { transform: translateX(-2%); opacity: .045; } to { transform: translateX(2%); opacity: .09; } }
@media (max-width: 60rem) { .home-reviews__grid { grid-template-columns: minmax(0, 1fr); } .home-review-feature__image { min-height: 0; aspect-ratio: 4 / 5; } .home-review-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); } }
@media (max-width: 56.25rem) { .home-quest__grid { grid-template-columns: minmax(0, 1fr); } .home-quest__notices { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); } .home-guides__wall { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-guide-feature { grid-column: 1 / -1; } .home-guide-card { grid-column: span 1; } }
@media (max-width: 51.25rem) { .home-dispatches__wall { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-dispatch-card--lead { grid-column: 1 / -1; } .home-dispatches__support { grid-column: 1 / -1; } .home-community__grid { grid-template-columns: minmax(0, 1fr); } .home-community__support { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-paths__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 48.75rem) { .home-section-heading { align-items: flex-start; flex-direction: column; } .home-releases__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-releases__grid > article:last-child { grid-column: 1 / -1; } }
@media (max-width: 47.5rem) { .home-longread { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; overflow: visible; } .home-longread > img { position: relative; aspect-ratio: 16 / 9; } .home-longread__veil { display: none; } .home-longread__copy { width: 100%; min-height: 0; background: var(--color-basalt); padding: var(--space-5); } .home-longread__copy h3 { max-width: none; } .home-longread__copy p { max-width: 56ch; } }
@media (max-width: 45rem) { .home-quest { padding-top: var(--space-10); } .home-quest__feature, .home-quest__content { min-height: 29rem; } .home-quest__content { width: 68%; padding: var(--space-6); } .home-quest__content h1 { font-size: clamp(2.5rem, 9vw, 3rem); } .home-quest__summary { font-size: var(--text-base); line-height: var(--leading-base); } .home-review-shelf { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); } .home-editorial__panel { grid-template-columns: minmax(0, 1fr); } .home-editorial__space { display: none; } .home-editorial__copy { padding: var(--space-5); } }
@media (max-width: 40rem) { .home-dispatches__wall, .home-dispatches__support { grid-template-columns: minmax(0, 1fr); } .home-dispatch-card--text:last-child { grid-column: auto; } .home-dispatch-card--lead, .home-dispatch-card__content { min-height: 25rem; } .home-lore-fragments, .home-community__support { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 35rem) { .home-quest__notices, .home-guides__wall, .home-releases__grid, .home-paths__grid { grid-template-columns: minmax(0, 1fr); } .home-quest__notices { grid-template-rows: auto; } .home-guide-card, .home-guide-feature, .home-releases__grid > article:last-child { grid-column: auto; } .home-quest__content { width: 100%; min-height: 0; padding: var(--space-5); background: linear-gradient(90deg, rgb(17 18 20 / .96), rgb(17 18 20 / .78)); } .home-quest__feature { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; } .home-quest__image { position: relative; height: 14rem; order: 2; } .home-quest__veil { display: none; } .home-quest__content { order: 1; } .home-quest__content h1 { font-size: clamp(2.25rem, 10vw, 2.75rem); } .home-guide-index { flex-direction: column; align-items: stretch; } .home-guide-index .button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .home-archive__fog { animation: none; } .home-reveal { opacity: 1; transition: none; } }
