@charset "UTF-8";
:root{
  --bg:#0a0a0d;--bg2:#101014;--panel:#141316;--line:rgba(224,185,141,.18);
  --ink:#e9ded0;--muted:#ada29a;--dim:#84786f;--copper:#c9814e;--ember:#ec7b37;--gold:#dfb27c;
  --font-ui:Inter,"Segoe UI",Arial,system-ui,sans-serif;--font-display:Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-ui);overflow-x:hidden;line-height:1.65;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 70% 10%,rgba(96,39,15,.10),transparent 35%),radial-gradient(circle at 14% 75%,rgba(80,35,20,.075),transparent 36%)}
::selection{background:rgba(234,132,70,.4);color:white}
a{color:inherit;text-decoration:none}
button{font:inherit}
img,svg{max-width:100%}
.container{width:min(1200px,calc(100% - 76px));margin:auto}
#embers{position:fixed;inset:0;pointer-events:none;z-index:18;opacity:.67}
.noise{position:fixed;inset:0;z-index:17;pointer-events:none;opacity:.065;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.87' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.32'/%3E%3C/svg%3E")}
.site-header{position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(209,178,145,.10);background:rgba(9,9,12,.88);backdrop-filter:blur(19px);-webkit-backdrop-filter:blur(19px)}
.nav-wrap{height:86px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:inline-flex;align-items:baseline;gap:8px;white-space:nowrap;color:#f0d0a7;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.1em;line-height:1}
.brand-mark{font-family:serif;font-size:25px;color:var(--ember);filter:drop-shadow(0 0 8px #e75b1d55);margin-right:2px}
.brand-small{font-size:14px;color:#b6a18c}
.brand-big{font-size:28px;letter-spacing:.055em;text-shadow:0 1px 9px rgba(229,102,36,.2)}
.nav-links{display:flex;align-items:center;gap:clamp(14px,1.45vw,25px);font-size:12px;font-weight:640;letter-spacing:.015em}
.nav-links a{position:relative;color:#b8ada3;white-space:nowrap;transition:color .2s ease}
.nav-links a:hover,.nav-links a:focus-visible{color:#f9dcc0}
.nav-links a::after{content:"";position:absolute;height:1px;left:0;right:100%;bottom:-8px;background:var(--ember);transition:right .23s}
.nav-links a:hover::after,.nav-links a:focus-visible::after{right:0}
.nav-links a.upcoming{color:#b98f6c}
.nav-divider{height:20px;width:1px;background:var(--line);margin:0 3px}
.mobile-toggle{display:none;background:transparent;border:1px solid #5f4637;border-radius:4px;width:45px;height:42px;padding:9px;cursor:pointer}
.mobile-toggle span{display:block;background:#c9ac91;height:2px;margin:5px 0;transition:transform .2s,opacity .2s}
.section{position:relative;padding:112px 0}
.section-kicker{color:#d49a64;font-size:11px;font-weight:780;letter-spacing:.23em;text-transform:uppercase}
.section h2,.coming-content h1{font-family:var(--font-display);font-weight:500;letter-spacing:-.028em;font-size:clamp(39px,4vw,67px);line-height:1.12;margin:22px 0 0}
h1 em,h2 em{color:#d7a06e;font-weight:400;font-style:italic}
.section-heading{display:flex;justify-content:space-between;gap:55px;align-items:end;margin-bottom:38px}
.section-heading>p{width:255px;flex-shrink:0;color:var(--muted);font-size:14px;line-height:1.9;margin:0 0 7px}
/* HERO */
.hero{position:relative;isolation:isolate;min-height:min(800px,calc(100svh - 86px));display:flex;align-items:center;overflow:hidden;border-bottom:1px solid rgba(216,153,90,.1);background:radial-gradient(ellipse at 75% 42%,rgba(153,54,22,.13),transparent 45%),linear-gradient(150deg,#0c0b0d 20%,#15100e 69%,#0b0a0d 100%)}
.hero::before{content:"";position:absolute;left:0;bottom:-20%;width:70%;height:75%;z-index:-1;background:radial-gradient(ellipse at 12% 80%,rgba(176,65,24,.13),transparent 62%)}
.hero-aura{position:absolute;right:-5%;top:-10%;width:55%;height:105%;background:radial-gradient(ellipse,rgba(241,92,29,.12),transparent 62%);pointer-events:none;filter:blur(18px)}
.hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(450px,1.05fr);gap:30px;align-items:center;position:relative;padding:55px 0 65px}
.hero-copy{position:relative;z-index:3}
.eyebrow{display:flex;align-items:center;gap:11px;flex-wrap:wrap;color:#cc9d76;letter-spacing:.19em;font-size:10px;font-weight:780;line-height:1.6}
.pulse-dot{display:inline-block;flex-shrink:0;width:7px;height:7px;background:#e7894f;border-radius:50%;box-shadow:0 0 0 4px rgba(221,113,58,.13),0 0 14px #ed7d37;animation:pulse 2.8s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(221,113,58,.06),0 0 20px #ed7d37}}
.divider-tiny{color:#634c3b}
.ornament{display:flex;gap:10px;align-items:center;margin-top:42px;margin-bottom:18px;width:210px;color:var(--gold)}
.ornament span{display:block;height:1px;background:linear-gradient(90deg,#a36338,transparent);flex:1}.ornament span:last-child{transform:rotate(180deg)}
.ornament i{font-size:11px;font-style:normal}
.hero h1{font-family:var(--font-display);font-size:clamp(58px,5.9vw,93px);line-height:1.01;letter-spacing:-.035em;font-weight:500;margin:0;text-shadow:0 10px 30px #0008}
.hero h1 em{font-size:.96em}
.hero-intro{color:#b6a9a0;line-height:1.9;font-size:15px;max-width:475px;margin:27px 0 16px}
.hero-slogan{font-size:11px;letter-spacing:.18em;color:#c9966f;font-weight:750;margin:18px 0 30px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:16px;text-align:center;border:1px solid transparent;padding:15px 22px;min-width:166px;text-transform:uppercase;letter-spacing:.1em;font-size:11px;font-weight:800;transition:transform .22s,background .22s,box-shadow .22s,border-color .22s;border-radius:2px}
.btn:hover{transform:translateY(-3px)}.btn:focus-visible,.mobile-toggle:focus-visible,a:focus-visible{outline:2px solid #eec090;outline-offset:3px}
.btn-primary{background:linear-gradient(135deg,#dc965c,#9c4c29);color:#170d09;box-shadow:0 12px 36px #81391933}
.btn-primary:hover{background:linear-gradient(135deg,#efad75,#b66439);box-shadow:0 16px 42px #984e3061}
.btn-outline{border-color:#665044;color:#e2c2a8;background:rgba(16,11,11,.58)}.btn-outline:hover{border-color:#d29b6b;background:rgba(97,58,34,.18)}
.hero-foot{display:flex;gap:17px;align-items:center;max-width:480px;color:#867264;font-size:9px;letter-spacing:.15em;margin-top:80px;font-weight:760;white-space:nowrap}
.hairline{height:1px;background:rgba(191,141,107,.22);flex:1}
.hero-art{position:relative;z-index:2;width:100%;max-width:640px;justify-self:end}
.hero-art img{display:block;width:100%;height:auto;filter:drop-shadow(0 30px 80px rgba(147,47,18,.16));animation:float 8s ease-in-out infinite;mask-image:radial-gradient(circle at center,#000 42%,#000c 66%,transparent 84%);-webkit-mask-image:radial-gradient(circle at center,#000 42%,#000c 66%,transparent 84%)}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.hero-art-glow{position:absolute;inset:15%;border-radius:50%;background:radial-gradient(circle,rgba(229,82,27,.15),transparent 70%);filter:blur(40px)}
.art-corner{position:absolute;width:27px;height:27px;opacity:.5}.art-corner--tl{left:13%;top:18%;border-top:1px solid #a45f3d;border-left:1px solid #a45f3d}.art-corner--br{right:11%;bottom:17%;border-bottom:1px solid #a45f3d;border-right:1px solid #a45f3d}
.hero-bottom-fade{position:absolute;pointer-events:none;bottom:0;width:100%;height:65px;background:linear-gradient(0deg,var(--bg),transparent)}
/* INTRO */
.intro{background:#0b0a0d}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:105px;align-items:center}
.intro-copy{color:#b5aaa0;font-size:15px;line-height:2.0}.intro-copy p{margin:0 0 20px}
.tiny-tag{margin-top:33px;font-size:10px;font-weight:750;letter-spacing:.18em;color:#bf9370}.tiny-tag span{margin:0 10px;color:#5e4635}
/* CLASSES */
.classes{background:linear-gradient(180deg,#0c0b0d,#151013 52%,#0d0b0d)}; 
.class-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.class-card{position:relative;overflow:hidden;min-height:410px;padding:36px 30px 26px;border:1px solid rgba(224,185,141,.14);background:linear-gradient(150deg,#181416,#121114 70%);transition:transform .25s,border-color .25s,box-shadow .25s}
.class-card::before{content:"";height:3px;position:absolute;top:0;left:0;right:0;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.56;transition:opacity .3s}
.class-card::after{content:"";width:260px;height:260px;position:absolute;right:-88px;top:-75px;background:radial-gradient(circle,var(--accentfade),transparent 70%);pointer-events:none;opacity:.6;transition:opacity .3s}
.class-card:hover{transform:translateY(-7px);border-color:rgba(224,185,141,.30);box-shadow:0 26px 50px #0005}.class-card:hover::before,.class-card:hover::after{opacity:1}
.class-card.warrior{--accent:#db8155;--accentfade:#a955332f}.class-card.healer{--accent:#92b9a5;--accentfade:#4c987324}.class-card.mage{--accent:#9ba2d4;--accentfade:#696cb434}
.class-symbol{width:97px;height:97px;display:grid;place-items:center;color:var(--accent);border:1px solid rgba(226,174,132,.15);border-radius:50%;margin:18px 0 31px;background:linear-gradient(145deg,#241915,#0c0d0f);box-shadow:0 0 40px var(--accentfade)}
.class-symbol svg{width:66px;height:66px}
.class-nr{font-size:10px;color:var(--accent);font-weight:760;letter-spacing:.18em}
.class-card h3{font-family:var(--font-display);font-size:37px;font-weight:500;line-height:1.1;margin:14px 0}
.class-card p{font-size:14px;color:#b9afa6;line-height:1.85;max-width:295px;margin-bottom:35px}
.class-bottom{position:absolute;bottom:22px;left:30px;right:30px;border-top:1px solid rgba(219,172,135,.14);padding-top:18px;font-size:9px;letter-spacing:.15em;color:#b99a83;font-weight:750;display:flex;justify-content:space-between}
.class-bottom span{font-size:16px;color:var(--accent);line-height:1}
/* REGION */
.regions{background:linear-gradient(180deg,#0d0b0d,#111013)}
.region-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.region-card{position:relative;isolation:isolate;min-height:300px;display:flex;align-items:flex-end;overflow:hidden;border:1px solid rgba(221,182,143,.16);background:#151014;transition:border-color .25s,transform .25s}
.region-card:hover{transform:translateY(-4px);border-color:#ae6c41}
.region-back{position:absolute;inset:-3%;z-index:-1;background:radial-gradient(circle at 55% 85%,#85401c80,#130f11 56%),linear-gradient(150deg,#39231c,#0e0e12);transition:transform .4s}
.region-card:hover .region-back{transform:scale(1.075)}
.region-card::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(0deg,#0c0a0efa 6%,#0d0b0e60 50%,transparent 80%)}
.region-card::after{content:"";position:absolute;z-index:-1;top:48px;left:calc(50% - 56px);width:112px;height:150px;opacity:.20;border:2px solid #cd8b58;border-radius:55px 55px 0 0;box-shadow:0 0 38px #dc794a33,0 0 0 28px #140f1280;transform:perspective(220px) rotateX(7deg)}
.region-two .region-back{background:radial-gradient(circle at 35% 35%,#535b654a,#15171a 50%,#121013 80%),radial-gradient(circle at 80% 70%,#69492d,#0b0a0e 70%)}
.region-three .region-back{background:radial-gradient(circle at 60% 80%,#3d3e435a,#121214 59%),linear-gradient(150deg,#0f1617,#2d1814)}
.region-two::after{transform:rotate(-17deg);height:145px;border-radius:25% 70% 10% 80%;box-shadow:0 0 70px #9a7c5c58}
.region-three::after{transform:skewY(-13deg) scale(.8);border-radius:10px;box-shadow:0 0 40px #8b9f9b34}
.region-content{padding:28px;position:relative;z-index:2}.region-content>span{font-size:9px;color:#d6a378;letter-spacing:.17em;font-weight:750}
.region-content h3{font-family:var(--font-display);font-size:33px;margin:10px 0 3px;line-height:1.15;font-weight:500}.region-content p{font-size:13px;color:#b2a59b;margin:5px 0 0}
.region-disclaimer{font-size:11px;color:#766a62;margin-top:17px}
/* BETA */
.beta{padding:145px 0;background:radial-gradient(ellipse at 50% 50%,#8b3b1624,transparent 58%),#0b0a0d}
.beta-frame{position:relative;isolation:isolate;overflow:hidden;border:1px solid rgba(213,143,90,.3);background:linear-gradient(140deg,#15100f,#140d0c 55%,#111014);min-height:500px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:75px 30px}
.beta-frame:before{content:"";position:absolute;inset:12px;border:1px solid rgba(216,155,116,.14);pointer-events:none}
.beta-frame:after{content:"";position:absolute;z-index:-1;inset:-30%;background:radial-gradient(circle,#b45c251c,transparent 53%);pointer-events:none}
.beta-ring{font-family:serif;color:var(--copper);font-size:22px;margin-bottom:25px;display:grid;place-items:center;border:1px solid #704732;width:62px;height:62px;border-radius:50%;box-shadow:0 0 50px #b05a2a25}
.beta h2{font-size:clamp(45px,5.6vw,85px);margin-top:19px}
.beta p{color:#bdb0a6;font-size:15px;line-height:1.85;max-width:590px;margin:25px 0}
.beta-status{display:inline-flex;align-items:center;gap:12px;border:1px solid rgba(213,142,85,.3);background:#211710;color:#d9a77c;padding:14px 21px;letter-spacing:.14em;font-size:10px;font-weight:780;margin-top:5px}
.beta-hint{font-size:11px;color:#8f8074;letter-spacing:.035em;margin-top:22px}
/* FUTURE */
.future{background:#0e0d10;padding-top:90px;padding-bottom:135px}
.future-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.future-grid a{position:relative;border:1px solid rgba(213,171,136,.17);background:linear-gradient(150deg,#181416,#100f12);padding:30px 22px;min-height:175px;display:flex;flex-direction:column;transition:background .25s,border-color .25s,transform .25s}
.future-grid a:hover{border-color:#a76b49;transform:translateY(-4px);background:linear-gradient(150deg,#261710,#131014)}
.future-icon{font-size:24px;color:#b77c4c;line-height:1.1;margin-bottom:18px}.future-grid b{font-family:var(--font-display);font-size:23px;font-weight:500}.future-grid a>span:nth-last-of-type(1){font-size:9px;letter-spacing:.17em;font-weight:700;color:#987359;margin-top:8px}.future-grid i{position:absolute;right:22px;bottom:27px;font-size:16px;color:#cb8e61;font-style:normal}
/* FOOTER */
.site-footer{position:relative;border-top:1px solid var(--line);background:#09090b;padding:50px 0 35px}
.footer-content{display:flex;justify-content:space-between;gap:35px}.footer-brand .brand-big{font-size:23px}.footer-brand .brand-small{font-size:12px}
.site-footer p{color:#8b7d74;font-size:12px;margin:15px 0 0}.footer-right{text-align:right;max-width:440px}
.site-footer .footer-note{font-size:11px;color:#7f7269}.footer-right small{display:block;font-size:10px;color:#796e66;margin-top:18px}
/* SOON PAGES */
.coming-page{min-height:calc(100svh - 86px);position:relative;isolation:isolate;display:flex;align-items:center;background:radial-gradient(ellipse at 74% 50%,rgba(158,69,35,.11),transparent 45%),#0b0a0d;overflow:hidden}
.coming-glow{position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,#09090b 38%,rgba(48,24,15,.13) 100%)}
.coming-inner{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center;padding:65px 0 100px}
.coming-art{grid-column:2;grid-row:1}.coming-art img{display:block;max-width:560px;opacity:.82;mask-image:radial-gradient(circle,#000 35%,transparent 72%);-webkit-mask-image:radial-gradient(circle,#000 35%,transparent 72%);filter:drop-shadow(0 20px 80px #f8521830)}
.coming-content{grid-column:1;grid-row:1;z-index:2}
.coming-symbol{font-size:59px;color:#aa744b;margin-top:33px;line-height:1}
.coming-content h1{font-size:clamp(65px,7vw,104px);margin:7px 0 9px}
.coming-label{font-family:var(--font-display);font-size:32px;letter-spacing:.10em;color:#c78959}
.coming-content p{max-width:450px;color:#afa29a;margin:30px 0;line-height:1.95;font-size:15px}
/* REVEAL - starts visible, JS adds class after DOM ready */
.js [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.15,1)}
.js [data-reveal].visible{opacity:1;transform:translateY(0)}
/* RESPONSIVE */
@media(max-width:1100px){.nav-links{gap:12px;font-size:11px}.brand-big{font-size:25px}.hero-inner{grid-template-columns:minmax(0,1fr) minmax(350px,1fr)}.hero-foot{margin-top:55px}.container{width:min(1140px,calc(100% - 52px))}}
@media(max-width:880px){.site-header{position:sticky}.nav-wrap{height:76px}.mobile-toggle{display:block}.nav-links{display:none;position:absolute;top:75px;left:0;right:0;z-index:50;flex-direction:column;align-items:stretch;background:rgba(14,12,14,.98);border-bottom:1px solid #5f4131;box-shadow:0 24px 45px #0009;gap:0;padding:12px 26px 24px;max-height:calc(100svh - 76px);overflow-y:auto}.nav-links.is-open{display:flex}.nav-links a{padding:12px 9px;font-size:14px}.nav-links a::after{display:none}.nav-divider{width:100%;height:1px;margin:8px 0}.hero{min-height:auto}.hero-inner{grid-template-columns:1fr;gap:5px;text-align:center;padding:60px 0 90px}.hero-copy{order:2}.hero-art{order:1;max-width:540px;justify-self:center;margin:-10px auto -40px}.hero h1{font-size:clamp(52px,8.3vw,78px)}.eyebrow,.ornament,.hero-actions,.hero-foot{justify-content:center;margin-left:auto;margin-right:auto}.hero-intro{margin-left:auto;margin-right:auto}.hero-foot{max-width:430px}.intro-grid{gap:40px}.section{padding:90px 0}.class-grid{gap:10px}.class-card{padding:30px 20px 24px}.class-bottom{left:20px;right:20px}.future-grid{grid-template-columns:1fr 1fr}.section-heading{gap:20px}.coming-inner{grid-template-columns:1fr;gap:0;text-align:center}.coming-art{grid-row:1;grid-column:1;justify-self:center;max-width:470px;margin-bottom:-75px}.coming-content{grid-row:2;grid-column:1}.coming-content p{margin-left:auto;margin-right:auto}}
@media(max-width:600px){.container{width:calc(100% - 36px)}.hero-inner{padding:30px 0 70px}.hero-art{max-width:min(100%,455px);margin:-30px auto -44px}.hero h1{font-size:clamp(47px,12.2vw,69px)}.hero-intro{font-size:14px;margin-top:22px}.eyebrow{font-size:9px;gap:7px;letter-spacing:.1em}.ornament{margin-top:25px}.hero-foot{font-size:8px;gap:9px;margin-top:50px}.btn{width:100%;min-width:0}.hero-actions{flex-direction:column;align-items:stretch}.section{padding:76px 0}.section h2{font-size:45px}.intro-grid{grid-template-columns:1fr;gap:25px}.intro-copy{font-size:14px}.section-heading{display:block}.section-heading>p{width:auto;margin-top:25px}.class-grid,.region-grid{grid-template-columns:1fr}.class-card{min-height:345px}.class-symbol{margin:4px 0 24px;width:81px;height:81px}.class-symbol svg{width:55px;height:55px}.class-card h3{font-size:34px}.region-card{min-height:230px}.beta{padding:75px 0}.beta-frame{min-height:440px;padding:60px 23px}.beta h2{font-size:44px}.beta p{font-size:14px}.beta-status{font-size:9px;letter-spacing:.07em;padding:13px 12px}.future-grid{gap:9px}.future-grid a{min-height:135px;padding:22px 15px}.future-icon{font-size:20px;margin-bottom:10px}.future-grid b{font-size:22px}.future-grid i{right:15px;bottom:15px}.footer-content{flex-direction:column;text-align:center;gap:18px}.footer-right{text-align:center;max-width:unset}.coming-art{max-width:390px;margin-bottom:-55px}.coming-content h1{font-size:65px}.coming-label{font-size:27px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.js [data-reveal]{opacity:1;transform:none}#embers{display:none}}