@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root{--ink:#050b11;--ink-2:#09131e;--panel:#0d1824;--paper:#eef4f7;--muted:#9eabb7;--gold:#e9b44a;--gold-2:#ffcf6a;--blue:#59a9ff;--violet:#755cff;--line:rgba(255,255,255,.13);--max:1180px;--shadow:0 25px 80px rgba(0,0,0,.45)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,Arial,sans-serif;line-height:1.65;overflow-x:hidden}body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.13;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,black,transparent 75%)}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button{font:inherit}.wrap{width:min(calc(100% - 40px),var(--max));margin-inline:auto}.skip{position:fixed;left:12px;top:-100px;z-index:999;background:#fff;color:#000;padding:10px 16px}.skip:focus{top:12px}
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(5,11,17,.82);border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}.nav{height:78px;display:flex;align-items:center;gap:30px}.brand{margin-right:auto;display:flex;align-items:center;gap:12px}.brand-mark{width:38px;color:var(--gold)}.brand-copy{font-family:"Barlow Condensed",Impact,sans-serif;font-weight:700;letter-spacing:.08em;line-height:.94;text-transform:uppercase;font-size:1.08rem}.brand-copy small{display:block;color:var(--gold);font-size:.64rem;letter-spacing:.32em;margin-top:7px}.nav-links{display:flex;align-items:center;gap:25px;font-family:"Barlow Condensed",Impact,sans-serif;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.nav-links a{color:#c4cbd2;transition:.2s}.nav-links a:hover,.nav-links a[aria-current="page"]{color:#fff}.nav-links a[aria-current="page"]::after{content:"";display:block;height:2px;background:var(--gold);margin-top:4px}.nav-join{padding:10px 15px;border:1px solid #6858ff;background:linear-gradient(135deg,#5940da,#221b70);box-shadow:0 0 22px rgba(104,84,255,.28);color:#fff!important}.menu-btn{display:none;background:transparent;border:1px solid var(--line);color:#fff;border-radius:7px;width:44px;height:40px;font-size:1.25rem}
.hero{min-height:720px;padding:150px 0 90px;position:relative;isolation:isolate;display:flex;align-items:center;overflow:hidden}.hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:url('./images/main-banner3.png');background-size:1200px auto;background-repeat:no-repeat;background-position:calc(50% + 1px) ;opacity:.9}.hero::after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#050b11 0%,rgba(5,11,17,.96) 31%,rgba(5,11,17,.63) 57%,rgba(5,11,17,.14) 100%),linear-gradient(0deg,#050b11 0%,transparent 30%,rgba(5,11,17,.25) 100%)}.hero-inner{max-width:710px}.eyebrow,.kicker{font-family:"Barlow Condensed",Impact,sans-serif;color:var(--blue);font-weight:700;letter-spacing:.25em;text-transform:uppercase}.eyebrow{font-size:.88rem}.eyebrow::after{content:"";display:inline-block;vertical-align:middle;width:70px;height:1px;background:linear-gradient(90deg,var(--blue),transparent);margin-left:14px}.display{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(4.7rem,10vw,8.4rem);line-height:.78;letter-spacing:-.035em;margin:26px 0 0;text-transform:uppercase;text-shadow:0 8px 30px #000}.display span{display:block;font-size:.36em;letter-spacing:.28em;color:#8771ff;margin:29px 0 0 5px}.hero-lede{font-size:clamp(1.08rem,2vw,1.28rem);max-width:650px;color:#d7dde3;margin:31px 0 0}.hero-lede strong{color:#fff}.tagline{color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.05em;font-size:1.25rem;font-weight:700}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.btn{min-height:52px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:11px;border:1px solid var(--gold);font-family:"Barlow Condensed",Impact,sans-serif;font-weight:700;letter-spacing:.08em;text-transform:uppercase;transition:.2s;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}.btn:hover{transform:translateY(-2px);filter:brightness(1.12)}.btn-primary{background:linear-gradient(135deg,#6045eb,#2a1a90);border-color:#8778ff;box-shadow:0 12px 35px rgba(92,66,235,.3)}.btn-secondary{background:rgba(4,9,14,.75)}.btn img{width:23px;height:23px}.btn-primary img{filter:brightness(0) invert(1)}
.page-hero{min-height:600px;padding:100px 0 80px;position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center}.page-hero::before{content:"";position:absolute;inset:0;z-index:0;background-image:url('./images/civilian-banner.jpg');background-size:1200px;background-repeat:no-repeat;background-position:calc(50% + 1px) ;opacity:0.4}.page-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#050b11 2%,rgba(5,11,17,.95) 36%,rgba(5,11,17,.22)),linear-gradient(0deg,#050b11,transparent 50%)}.page-hero h1{font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;font-size:clamp(3.8rem,9vw,7rem);line-height:.88;margin:18px 0 22px;max-width:780px}.page-hero p{max-width:650px;color:#d0d8df;font-size:1.15rem}.page-game{--art-y:-555px}.page-features{--art-y:-820px}.page-alter{--art-y:-1010px}.page-community{--art-y:-1200px}
.section{padding:95px 0;position:relative}.section-alt{background:linear-gradient(180deg,rgba(14,25,37,.9),rgba(8,16,24,.78));border-block:1px solid var(--line)}.section-head{margin-bottom:48px}.kicker{font-size:.78rem}.title{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4.2rem);line-height:.95;text-transform:uppercase;letter-spacing:-.02em;margin:13px 0 18px}.intro{color:var(--muted);font-size:1.08rem}.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.card{background:linear-gradient(145deg,rgba(17,29,42,.95),rgba(7,14,22,.95));border:1px solid var(--line);padding:30px;position:relative;overflow:hidden}.card::after{content:"";position:absolute;right:-50px;bottom:-50px;width:120px;height:120px;background:var(--blue);filter:blur(65px);opacity:.1}.icon-box{width:56px;height:56px;padding:12px;display:grid;place-items:center;background:rgba(71,155,255,.11);border:1px solid rgba(83,168,255,.28);color:var(--blue);margin-bottom:23px}.icon-box img{width:100%;height:100%;filter:invert(61%) sepia(73%) saturate(1127%) hue-rotate(183deg) brightness(103%)}.card h3{font-family:"Barlow Condensed",Impact,sans-serif;font-size:1.55rem;text-transform:uppercase;letter-spacing:.04em;margin:0 0 10px}.card p{margin:0;color:var(--muted)}.text-link{display:inline-block;color:var(--gold);font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;margin-top:20px;font-weight:700}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:65px;align-items:center}
.art-panel{min-height:300px;background-image:linear-gradient(0deg,rgba(5,11,17,.75),transparent 65%),url('./images/Uncover_Your_Origin_300x300.png'); background-position:center;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-panel::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-panelyourlife{min-height:407px;background-image:linear-gradient(0deg,rgba(5,11,17,.75),transparent 35%),url('./images/TKOS-YourLife.png'); background-position:center;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-yourlife::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-panelyourlegacy{min-height:407px;background-image:linear-gradient(0deg,rgba(5,11,17,.75),transparent 65%),url('./images/TKOS-YourLegacy.png'); background-position:center;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-yourlife::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-johnny{min-height:600px;background-image:url('./images/TKOS-JohnnyBoomerang.png'); background-position:center;width:561px;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-johnny::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-vampvww{min-height:525px;background-image:url('./images/TKOS-VampVsWereWolf.png'); background-position:center;width:420px;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-vampvww::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-interface{min-height:610px;background-image:linear-gradient(0deg,rgba(5,11,17,.75),transparent 65%),url('./images/TKOS-CityInterface.png'); background-position:center;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-interface::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-tomb{min-height:384px;background-image:linear-gradient(0deg,rgba(5,11,17,.75),transparent 65%),url('./images/TKOS-Decipher.png'); background-position:center;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-tomb::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.art-community{min-height:310px;background-image:linear-gradient(0deg,rgba(5,11,17,.75),transparent 65%),url('./images/TKOS-GuildMates.png'); background-position:center;border:1px solid rgba(233,180,74,.45);box-shadow:var(--shadow);position:relative}.art-community::after{content:attr(data-caption);position:absolute;left:24px;bottom:18px;font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-2)}.prose h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(2.6rem,5vw,4rem);line-height:.95;text-transform:uppercase;margin:0 0 25px}.prose p{color:#aeb9c3}.prose p+p{margin-top:20px}.quote{border-left:2px solid var(--gold);padding:8px 0 8px 22px;color:#dbe3e9;font-size:1.15rem;margin:28px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.stat{background:#09131d;padding:28px}.stat strong{display:block;color:var(--gold-2);font-family:"Barlow Condensed",Impact,sans-serif;font-size:2.2rem}.stat span{color:var(--muted);font-size:.85rem}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:steps}.step{position:relative;padding:35px 26px;border-top:1px solid var(--line);counter-increment:steps}.step::before{content:"0" counter(steps);display:block;color:var(--blue);font-family:"Barlow Condensed",Impact,sans-serif;font-size:1.15rem;margin-bottom:18px}.step:not(:last-child)::after{content:"";position:absolute;right:0;top:30px;bottom:30px;width:1px;background:var(--line)}.step h3{font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;font-size:1.55rem;margin:0 0 10px}.step p{color:var(--muted);margin:0}.origin-card{text-align:center;padding:30px 18px}.origin-card .icon-box{margin:0 auto 20px}.origin-card.featured{border-color:#7661ff;box-shadow:0 0 35px rgba(118,97,255,.17)}.origin-card.featured .icon-box{border-color:#7661ff;background:rgba(118,97,255,.15)}.origin-card.featured .icon-box img{filter:invert(50%) sepia(80%) saturate(2850%) hue-rotate(225deg) brightness(105%)}
.community-banner{display:grid;grid-template-columns:1.1fr .9fr;min-height:340px;border:1px solid #5545d5;background:linear-gradient(100deg,rgba(10,14,29,.98),rgba(40,24,105,.83)),url('./images/Shared_World_300x300.png');background-size:auto,1536px auto;background-position:center,center -1200px;box-shadow:0 20px 80px rgba(63,45,188,.22)}.community-copy{padding:48px}.community-copy h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:3.2rem;line-height:.95;text-transform:uppercase;margin:15px 0}.community-copy p{color:#c7cde0}.community-action{display:flex;align-items:center;justify-content:center;padding:40px}.community-action .btn{font-size:1.15rem;min-height:62px}.community-action .btn img{width:30px;height:30px}.faq details{border-top:1px solid var(--line);padding:23px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;font-family:"Barlow Condensed",Impact,sans-serif;font-size:1.35rem;text-transform:uppercase;letter-spacing:.04em}.faq details p{color:var(--muted);max-width:850px}
.classic{padding:48px 0;background:linear-gradient(90deg,#19150e,#0b0c0c);border-block:1px solid rgba(233,180,74,.3)}.classic-inner{display:flex;align-items:center;gap:35px}.classic-icon{width:64px;color:var(--gold)}.classic-copy{margin-right:auto}.classic h2{font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.06em;margin:0;font-size:2rem}.classic p{color:#bcb6a8;margin:6px 0 0}.site-footer{padding:55px 0 30px;background:#04080c}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px}.footer-brand p{color:var(--muted);font-size:.87rem;max-width:320px}.footer-col h3{font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:.95rem}.footer-col a{display:block;color:var(--muted);font-size:.9rem;margin:8px 0}.footer-col a:hover{color:#fff}.copyright{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);color:#67737e;font-size:.78rem;display:flex;justify-content:space-between;gap:20px}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.menu-btn{display:block}.nav-links{position:absolute;top:78px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;padding:20px;background:#07111b;border-bottom:1px solid var(--line)}.nav-links.open{display:flex}.nav-links a{padding:8px 20px}.nav-links a[aria-current="page"]::after{display:none}.nav-join{text-align:center}.hero::before{background-position:58% -30px}.hero::after{background:linear-gradient(90deg,rgba(5,11,17,.97),rgba(5,11,17,.64)),linear-gradient(0deg,#050b11,transparent)}.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.art-panel{min-height:350px}.timeline{grid-template-columns:repeat(2,1fr)}.community-banner{grid-template-columns:1fr}.community-action{justify-content:flex-start;padding-top:0}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.wrap{width:min(calc(100% - 28px),var(--max))}.brand-copy{font-size:.92rem}.brand-mark{width:32px}.hero{min-height:680px;padding-top:125px}.display{font-size:4.6rem}.display span{font-size:.29em;letter-spacing:.22em}.actions{align-items:stretch}.actions .btn{width:100%}.page-hero{min-height:450px;padding-top:125px}.page-hero h1{font-size:4rem}.section{padding:72px 0}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.timeline{grid-template-columns:1fr}.step:not(:last-child)::after{display:none}.stats{grid-template-columns:1fr}.classic-inner{align-items:flex-start;flex-wrap:wrap}.classic-inner .btn{width:100%}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.copyright{flex-direction:column}.community-copy{padding:34px 26px}.community-copy h2{font-size:2.6rem}.community-action{padding:0 26px 34px}.community-action .btn{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.btn{transition:none}}
