/* Homepage styles are scoped so account, wiki and faction pages keep their layout. */
.home-launch {
    --home-bg: #131315;
    --home-ink: #e7e6e3;
    --home-muted: #b0ada6;
    --home-gold: #be9a3c;
    --home-gold-light: #dcc387;
    position: relative;
    color: var(--home-ink);
    background: var(--home-bg);
    font-family: var(--ui);
    overflow: clip;
}
.home-launch *, .home-launch *::before, .home-launch *::after { box-sizing: border-box; }
.home-launch .shell { width: min(1160px, calc(100% - 80px)); margin-inline: auto; }
.home-launch h1, .home-launch h2, .home-launch h3, .home-launch p { margin: 0; }
.home-launch h2, .home-launch h3 { font-family: var(--serif); font-weight: 400; line-height: 1.08; }
.home-launch h2 { font-size: clamp(36px, 4vw, 56px); }
.home-launch h3 { font-size: clamp(36px, 4vw, 54px); }
.home-launch a { color: inherit; text-decoration: none; }
.home-launch a:focus-visible, .home-launch button:focus-visible { outline: 2px solid var(--home-gold-light); outline-offset: 6px; }
.home-launch img { display: block; max-width: 100%; }
.home-launch svg { width: 20px; height: 20px; flex: 0 0 auto; }
.home-launch .symbols, .home-launch .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.home-launch .hero { display: block; position: relative; isolation: isolate; min-height: max(760px, 100svh); height: auto; padding: 0; background: none; overflow: visible; }
.home-launch .hero::before, .home-launch .hero::after { display: none; }
.home-launch .hero-landscape {
    position: absolute;
    z-index: -1;
    inset: -86px 0 -24px;
    background: linear-gradient(90deg, #131315 0%, #131315ee 18%, #1313158c 43%, #13131515 70%),
        linear-gradient(0deg, #131315 1%, #13131500 42%, #13131577 100%),
        url('/assets/images/hero-fog.webp') 70% 42% / cover no-repeat;
}
.home-launch .hero-inner { position: relative; min-height: max(760px, 100svh); padding-top: clamp(150px, 21svh, 250px); padding-bottom: 30px; display: flex; flex-direction: column; justify-content: space-between; }
.home-launch .hero-copy { position: relative; z-index: 1; width: calc(100% - 460px); max-width: 640px; }
.home-launch .hero h1 { width: 620px; max-width: calc(100% + 40px); margin-left: -40px; line-height: 1; }
.home-launch .hero h1 img { width: 100%; height: auto; image-rendering: pixelated; }
.home-launch .hero-description { max-width: 560px; font: 28px/1.3 var(--serif); margin-top: 36px; }
.home-launch .hero-subtitle { font-size: 17px; line-height: 1.6; color: #bdb8af; margin-top: 18px; }
.home-launch .hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 30px; }
.home-launch .hero__actions .button { min-height: 50px; padding: 12px 22px; background: var(--home-gold); border: 0; color: #141414; font-size: 15px; font-weight: 700; }
.home-launch .hero__actions .button:hover { background: #d1ae50; }
.home-launch .hero__secondary { font-size: 14px; min-height: 44px; }
.home-launch .hero__secondary svg { color: var(--home-gold-light); }
.home-launch .home-live { display: flex; flex-direction: row; align-items: baseline; justify-content: start; flex-wrap: wrap; gap: 6px 18px; margin-top: 32px; padding-left: 16px; border-left: 2px solid #dcc38766; max-width: none; text-align: left; }
.home-launch .home-live h2 { font: 20px/1.4 var(--serif); color: var(--home-gold-light); }
.home-launch .home-live__pass { display: flex; align-items: baseline; gap: 5px 12px; color: var(--home-muted); font-size: 13px; }
.home-launch .home-live__pass p { margin: 0; }
.home-launch .home-live__pass .text-link { font-size: 13px; }
.home-launch .home-live__pass small { display: block; font-size: 12px; }
.home-launch .home-live__price { margin-left: 8px; }
.home-launch .hero-bottom { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 30px; margin-top: 70px; color: var(--home-muted); font-size: 12px; }
.home-launch .down-link { display: inline-flex; gap: 18px; align-items: center; min-height: 44px; }
.home-launch .down-link span { color: var(--home-gold-light); font-size: 20px; transition: translate .25s ease; }
.home-launch .down-link:hover span { translate: 0 4px; }
.home-launch .server-address { display: inline-flex; align-items: center; gap: 10px; width: auto; min-height: 44px; margin: 0 0 0 auto; padding: 8px 0; border: 0; background: none; font: inherit; color: #d6c59d; cursor: pointer; }
.home-launch .server-address span { margin: 0; color: inherit; }
.home-launch .server-address svg { width: 15px; height: 15px; opacity: .7; }
.home-launch .eyebrow { font: 12px/1.4 var(--ui); letter-spacing: 1.7px; text-transform: uppercase; color: var(--home-gold-light); margin: 0 0 18px; }
.home-launch .home-section-break { display: flex; align-items: center; justify-content: center; gap: 18px; height: 48px; color: #bca36b; }
.home-launch .home-section-break span { flex: 1; max-width: 260px; height: 1px; background: linear-gradient(90deg, transparent, #bca36b40); transform-origin: right; }
.home-launch .home-section-break span:last-child { background: linear-gradient(90deg, #bca36b40, transparent); transform-origin: left; }
.home-launch .home-section-break svg { width: 40px; height: 24px; stroke: currentColor; stroke-width: 1; }
.home-launch .world { padding-top: 76px; padding-bottom: 64px; scroll-margin-top: 110px; }
.home-launch .world-heading { display: grid; grid-template-columns: 1fr 1fr; column-gap: 80px; align-items: end; }
.home-launch .world-heading .eyebrow { grid-column: 1 / -1; }
.home-launch .world-heading h2 { font-size: 48px; }
.home-launch .world-heading > p:last-child { max-width: 400px; color: var(--home-muted); font-size: 17px; justify-self: end; padding-bottom: 5px; }
.home-launch .feature { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.home-launch .feature-city { margin-top: 46px; }
.home-launch .feature-copy { max-width: 390px; }
.home-launch .feature-copy > p:not(.eyebrow) { margin-top: 24px; color: var(--home-muted); font-size: 17px; line-height: 1.7; }
.home-launch .inline-link { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; color: var(--home-gold-light); font-size: 14px; }
.home-launch .inline-link:hover { color: #f3ddaa; }
.home-launch .inline-link svg { width: 18px; transition: transform .2s; }
.home-launch .inline-link:hover svg { transform: translateX(4px); }
.home-launch .feature-copy .inline-link { margin-top: 22px; }
.home-launch .asset-slot { position: relative; isolation: isolate; min-width: 0; background: none; }
.home-launch .asset-slot::before, .home-launch .asset-slot::after { display: none; }
.home-launch .asset-render { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 18px 18px #0004) drop-shadow(0 0 40px rgb(var(--asset-glow,174 128 63) / .12)); pointer-events: none; }
.home-launch .hero-render { position: absolute; right: -35px; bottom: 100px; width: 480px; height: clamp(550px, 68svh, 710px); }
.home-launch .hero-render .asset-render { filter: drop-shadow(0 18px 18px #0004); }
.home-launch .town-slot { height: 430px; --asset-glow: 170 83 55; }
.home-launch .feature-farming { margin-top: 50px; grid-template-columns: .95fr 1.05fr; }
.home-launch .feature-farming .feature-copy { padding-left: 36px; }
.home-launch .farmer-slot { height: 470px; --asset-glow: 173 139 68; }
.home-launch .feature-travel { margin-top: 40px; grid-template-columns: 1.2fr .8fr; gap: 70px; }
.home-launch .feature-travel .feature-copy { max-width: 325px; }
.home-launch .ship-slot { height: 520px; --asset-glow: 74 118 148; }
.home-launch .feature-siege { margin-top: 50px; grid-template-columns: .9fr 1.3fr; gap: 36px; }
.home-launch .feature-siege .feature-copy { padding-left: 36px; }
.home-launch .siege-slot { height: 430px; --asset-glow: 156 91 49; }
.home-launch .home-banners { padding: 65px 0 80px; }
.home-launch .home-factions-layout { display: block; }
.home-launch .home-section-head, .home-launch .section-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin: 0 0 40px; }
.home-launch .home-section-head h2 { font: 400 clamp(36px,4vw,56px)/1.08 var(--serif); }
.home-launch .home-section-head p { color: var(--home-muted); margin-top: 14px; font-size: 15px; }
.home-launch .home-section-head a { flex: none; }
.home-faction-controls[hidden] { display:none; }
.home-launch .home-banner-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; }
.home-launch .home-banner-gallery:has(> :only-child) { grid-template-columns: minmax(0, 1fr); max-width: 850px; margin-inline: auto; }
.home-launch .home-banner-gallery:has(> :only-child) .home-banner-link { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 60px; }
.home-launch .home-banner-gallery:has(> :only-child) .home-banner-caption { margin-top: 0; }
.home-launch .home-banner-gallery:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2,minmax(0,1fr)); max-width: 850px; margin-inline: auto; gap: 80px; }
.home-launch .home-standard, .home-launch .home-faction-placeholder { min-width: 0; padding: 24px; background: none; }
.home-launch .home-banner-link { display: flex; flex-direction: column; height: 100%; }
.home-launch .home-banner-gallery .faction-standard { width: 100%; max-width: 320px; margin-inline: auto; align-self: center; }
.home-launch .home-banner-caption { margin-top: 24px; }
.home-launch .home-banner-caption h3 { display: flex; justify-content: space-between; gap: 12px; font: 400 30px/1.15 var(--serif); overflow-wrap: anywhere; }
.home-launch .home-banner-caption h3 svg { color: var(--home-gold-light); transition: translate .25s ease; }
.home-launch .home-banner-link:hover h3 svg { translate: 4px 0; }
.home-launch .home-banner-caption > p { margin: 14px 0; color: var(--home-muted); font-size: 16px; }
.home-launch .home-banner-caption .faction-meta { padding-top: 8px; margin-top: auto; }
.home-launch .home-faction-placeholder .text-link { width: fit-content; min-height: 44px; display: inline-flex; align-items: center; color: var(--home-gold-light); font-size: 14px; }
.home-launch .news { padding: 84px 0 96px; }
.home-launch .section-heading .eyebrow { margin: 0 0 18px; color: var(--home-gold-light); }
.home-launch .news-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: start; }
.home-launch .news-card { position: relative; min-width: 0; display: flex; flex-direction: column; background: #1b1b1d; overflow: hidden; transition: background-color .25s ease; }
.home-launch .news-grid > .news-card:only-child { grid-column: 1 / -1; }
.home-launch .news-grid > .news-card:only-child:has(> img) { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; }
.home-launch .news-list { display: grid; gap: 30px; padding-top: 4px; }
.home-launch .news-list .news-card { background: transparent; }
.home-launch .news-list .news-card > div { padding: 8px 0 24px; }
.home-launch .news-list .news-card:has(> img) { display: grid; grid-template-columns: 120px 1fr; align-items: start; gap: 20px; }
.home-launch .news-list .news-card > img { aspect-ratio: 1; }
.home-launch .news-list .news-card::after { left: 0; right: 0; }
.home-launch .news-card::after { content: ''; position: absolute; bottom: 0; left: 24px; right: 24px; height: 2px; background: var(--home-gold-light); transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.home-launch .news-card:hover, .home-launch .news-card:focus-visible { background: #22211f; }
.home-launch .news-card:hover::after, .home-launch .news-card:focus-visible::after { transform: scaleX(1); }
.home-launch .news-card > img { width: 100%; aspect-ratio: 16/10; height: auto; margin: 0; object-fit: contain; background: #101012; transition: filter .3s ease; }
.home-launch .news-card:hover > img { filter: brightness(1.08); }
.home-launch .news-card > div { padding: 22px 24px 26px; }
.home-launch .news-card time { color: #a99d87; font-size: 12px; }
.home-launch .news-card h3 { font-size: 28px; line-height: 1.12; margin-top: 12px; overflow-wrap: anywhere; }
.home-launch .news-card p { color: var(--home-muted); font-size: 14px; line-height: 1.65; margin-top: 14px; }
.home-launch .news-empty { padding-block: 10px 24px; color: var(--home-muted); }
.home-launch .motion-ready .feature-copy { opacity: 0; translate: 0 18px; }
.home-launch .motion-ready .asset-slot { opacity: 0; translate: var(--reveal-x, -28px) 0; }
.home-launch .feature-farming, .home-launch .feature-siege { --reveal-x: 28px; }
.home-launch .feature-copy, .home-launch .feature .asset-slot { transition: opacity .8s ease, translate 1s cubic-bezier(.16,1,.3,1); }
.home-launch .motion-visible .feature-copy, .home-launch .motion-visible .asset-slot { opacity: 1; translate: 0 0; }
.home-launch .motion-visible .asset-slot { transition-delay: .12s; }
.home-launch :is(.home-standard,.home-faction-placeholder,.news-card).motion-ready { opacity: 0; translate: 0 18px; transition: opacity .6s ease var(--reveal-delay,0ms), translate .8s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms), background-color .25s ease; }
.home-launch :is(.home-standard,.home-faction-placeholder,.news-card).motion-visible { opacity: 1; translate: 0 0; }
.home-launch .home-section-break.motion-ready span { scale: 0 1; opacity: 0; }
.home-launch .home-section-break span { transition: scale 1s cubic-bezier(.16,1,.3,1), opacity .8s ease; }
.home-launch .home-section-break.motion-visible span { scale: 1 1; opacity: 1; }
.home-launch .hero-copy > * { animation: home-enter .8s cubic-bezier(.16,1,.3,1) both; }
.home-launch .hero-description { animation-delay: .08s; }
.home-launch .hero-subtitle { animation-delay: .14s; }
.home-launch .hero__actions { animation-delay: .2s; }
.home-launch .home-live { animation-delay: .26s; }
.home-launch .hero-render { animation: home-enter 1.1s .15s ease both; }
@keyframes home-enter { from { opacity: 0; translate: 0 15px; } to { opacity: 1; translate: 0 0; } }
@media (min-width:901px) and (max-width:1200px) {
    .home-launch .hero-copy { width: calc(100% - 330px); }
    .home-launch .hero-render { right: -10px; width: 350px; height: 500px; }
    .home-launch .hero h1 { width: 520px; }
    .home-launch .hero-description { font-size: 26px; }
    .home-launch .feature { gap: 35px; }
    .home-launch .feature-siege .feature-copy { padding-left: 0; }
}
/* A native scrolling row keeps every faction available without duplicated slides. */
.home-faction-tools { display:flex; align-items:center; gap:28px; }
.home-faction-controls { display:flex; align-items:center; gap:2px; }
.home-faction-controls button { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:0; background:transparent; color:var(--chalk-300); cursor:pointer; }
.home-faction-controls button:hover { color:var(--coin-300); }
.home-faction-controls button:focus-visible { outline:2px solid var(--coin-300); outline-offset:2px; }
.home-faction-controls button:disabled { opacity:.25; cursor:default; }
.home-faction-controls button[hidden] { display:none; }
.home-faction-controls [data-faction-previous] svg { transform:rotate(180deg); }
.home-faction-controls .home-faction-rotation { width:36px; margin-left:8px; color:var(--chalk-500); }
.home-faction-rotation .rotation-play, .home-faction-rotation.is-paused .rotation-pause { display:none; }
.home-faction-rotation.is-paused .rotation-play { display:block; }
.home-launch .home-banner-gallery[data-faction-gallery]:has(> :nth-child(2)) {
    --faction-columns:3;
    display:grid; grid-template-columns:none; grid-auto-flow:column;
    grid-auto-columns:calc((100% - 64px) / var(--faction-columns));
    gap:32px; max-width:none; margin:0;
    overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory;
    scrollbar-width:none;
}
.home-launch [data-faction-gallery]::-webkit-scrollbar { display:none; }
.home-launch .home-banner-gallery[data-faction-gallery]:has(> :nth-child(2):last-child) { --faction-columns:2; grid-auto-columns:calc((100% - 32px) / 2); }
.home-launch [data-faction-slide] { scroll-snap-align:start; padding:12px 12px 20px; }
.home-launch [data-faction-gallery]:has(> :nth-child(2)) .home-banner-link { display:flex; flex-direction:column; align-items:stretch; gap:0; }
.home-launch [data-faction-gallery]:has(> :nth-child(2)) .home-banner-caption { margin-top:24px; display:flex; flex:1; flex-direction:column; }
.home-launch [data-faction-slide] .home-banner-caption h3 { font-size:27px; }
.home-launch [data-faction-slide] .home-banner-caption h3 span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.home-launch [data-faction-slide] .home-banner-caption p { font-size:15px; margin-bottom:20px; }
.home-launch [data-faction-gallery]:has(> :nth-child(2)) .home-banner-caption p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.home-launch [data-faction-gallery]:has(> :nth-child(2)) .faction-standard { max-width:280px; }
.home-launch [data-faction-slide] .faction-meta { margin-top:auto; }
@media (min-width:761px) and (max-width:1050px) {
    .home-launch .home-banner-gallery[data-faction-gallery]:has(> :nth-child(2)) { grid-auto-columns:calc((100% - 32px) / 2); }
}
@media (max-width:760px) {
    .home-faction-tools { width:100%; justify-content:space-between; gap:12px; }
    .home-launch .home-banner-gallery[data-faction-gallery]:has(> :nth-child(2)) { grid-auto-columns:84%; gap:20px; }
    .home-launch [data-faction-slide] { padding-inline:8px; }
}
@media (max-width:900px) {
    .home-launch .hero, .home-launch .hero-inner { min-height: 0; }
    .home-launch .hero-inner { padding-top: 65px; }
    .home-launch .hero-copy { width: 100%; max-width: 600px; }
    .home-launch .hero-render { position: relative; right: auto; bottom: auto; align-self: flex-end; width: 300px; height: 350px; margin-top: 24px; }
    .home-launch .hero-bottom { margin-top: 24px; }
    .home-launch .feature-farming .feature-copy { padding-left: 0; }
    .home-launch .home-banner-gallery { gap: 24px; }
    .home-launch .home-banner-caption h3 { font-size: 26px; }
}
@media (max-width:760px) {
    .home-launch .shell { width: calc(100% - 40px); }
    .home-launch h2 { font-size: 36px; }
    .home-launch .hero, .home-launch .hero-inner { min-height: 0; }
    .home-launch .hero-inner { padding-top: 104px; padding-bottom: 14px; }
    .home-launch .hero-landscape { inset: -72px 0 -24px; background: linear-gradient(0deg,#131315 0%,#131315bb 50%,#13131566 100%),url('/assets/images/hero-fog.webp') 65% 0 / auto 100% no-repeat; }
    .home-launch .hero h1 { width: 520px; margin-left: -20px; max-width: calc(100% + 20px); }
    .home-launch .hero-description { font-size: 27px; line-height: 1.25; margin-top: 30px; }
    .home-launch .hero-subtitle { font-size: 15px; margin-top: 16px; }
    .home-launch .hero__actions { gap: 12px 20px; margin-top: 26px; }
    .home-launch .hero__actions .button { padding: 12px 18px; font-size: 14px; }
    .home-launch .hero__secondary { font-size: 13px; }
    .home-launch .home-live { align-items: baseline; gap: 6px 14px; margin-top: 20px; }
    .home-launch .home-live h2 { font-size: 19px; }
    .home-launch .hero-bottom { gap: 4px 16px; }
    .home-launch .server-status { order: 2; width: 100%; }
    .home-launch .server-address { font-size: 12px; }
    .home-launch .world { padding-top: 65px; padding-bottom: 30px; }
    .home-launch .world-heading { display: block; }
    .home-launch .world-heading h2 { font-size: 38px; }
    .home-launch .world-heading > p:last-child { margin-top: 20px; font-size: 15px; }
    .home-launch .world-heading br { display: none; }
    .home-launch .eyebrow { font-size: 10px; letter-spacing: 1.5px; margin-bottom: 14px; }
    .home-launch .feature { display: flex; flex-direction: column; gap: 0; align-items: stretch; }
    .home-launch .feature-city { margin-top: 50px; }
    .home-launch .feature-copy { max-width: none; }
    .home-launch .feature-copy h3 { font-size: 38px; }
    .home-launch .feature-copy > p:not(.eyebrow) { font-size: 15px; line-height: 1.7; margin-top: 20px; }
    .home-launch .feature-copy .inline-link { margin-top: 14px; font-size: 13px; }
    .home-launch .feature-city .feature-copy, .home-launch .feature-travel .feature-copy { order: -1; max-width: none; }
    .home-launch .feature-farming, .home-launch .feature-travel, .home-launch .feature-siege { margin-top: 44px; }
    .home-launch .feature-siege .feature-copy { padding-left: 0; }
    .home-launch .asset-slot { margin-top: 24px; }
    .home-launch .hero-render { margin-top: 18px; }
    .home-launch .town-slot { height: 340px; }
    .home-launch .farmer-slot { height: 380px; }
    .home-launch .ship-slot { height: 360px; }
    .home-launch .siege-slot { height: 310px; }
    .home-launch .home-banners { padding: 50px 0 40px; }
    .home-launch .home-section-head, .home-launch .section-heading { align-items: start; flex-wrap: wrap; gap: 16px; margin-bottom: 30px; }
    .home-launch .home-section-head p { font-size: 13px; }
    .home-launch .home-banner-gallery { grid-template-columns: 1fr; gap: 40px; }
    .home-launch .home-banner-gallery:has(> :only-child), .home-launch .home-banner-gallery:has(> :nth-child(2):last-child) { grid-template-columns: 1fr; }
    .home-launch .home-banner-gallery:has(> :only-child) .home-banner-link { display: flex; gap: 0; }
    .home-launch .home-banner-gallery:has(> :only-child) .home-banner-caption { margin-top: 24px; }
    .home-launch .home-banner-gallery .faction-standard { width: 260px; max-width: 100%; }
    .home-launch .home-banner-caption h3 { font-size: 29px; }
    .home-launch .home-banner-caption > p { font-size: 15px; }
    .home-launch .news { padding-top: 54px; padding-bottom: 60px; }
    .home-launch .news-grid { grid-template-columns: 1fr; gap: 24px; }
    .home-launch .news-grid > .news-card:only-child:has(> img) { display: flex; }
    .home-launch .news-list { gap: 16px; }
    .home-launch .news-card > div { padding: 20px; }
    .home-launch .news-card h3 { font-size: 28px; }
}
@media (max-width:380px) {
    .home-launch .shell { width: calc(100% - 32px); }
    .home-launch .hero-description { font-size: 25px; }
    .home-launch .hero__actions { gap: 8px 14px; }
    .home-launch .hero__actions .button { padding-inline: 14px; }
    .home-launch .hero__secondary { font-size: 12px; }
    .home-launch .hero-render { width: 260px; height: 320px; }
}
@media (prefers-reduced-motion:reduce) {
    .home-launch *, .home-launch *::before, .home-launch *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
    .home-launch .motion-ready, .home-launch .motion-ready .feature-copy, .home-launch .motion-ready .asset-slot { opacity: 1 !important; translate: none !important; }
    .home-launch .home-section-break.motion-ready span { scale: 1 1; opacity: 1; }
}
