
:root{
 --bg:#040910; --panel:#09131f; --panel2:#0c1b2b; --text:#f6f7f9; --muted:#aeb8c6;
 --gold:#e7b865; --gold2:#ffd991; --blue:#18a8ff; --line:rgba(255,255,255,.12);
 --max:1240px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 70% 0,#0d2945 0,#050b13 34%,#02060b 75%);color:var(--text);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}.wrap{width:min(var(--max),calc(100% - 42px));margin:auto}
header{position:sticky;top:0;z-index:30;background:rgba(3,8,14,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.nav{min-height:92px;display:flex;align-items:center;gap:28px}
.brand img{width:158px;height:76px;object-fit:cover;object-position:center 28%;border-radius:12px}
nav{margin-left:auto;display:flex;gap:24px;align-items:center;font-size:14px;letter-spacing:.06em}
.lang,.cta{border:1px solid rgba(231,184,101,.55);padding:10px 14px;border-radius:999px}.cta{background:linear-gradient(120deg,#c99039,#ffe0a0);color:#111;font-weight:700}
.preview{border-bottom:1px solid rgba(231,184,101,.35);background:linear-gradient(90deg,rgba(231,184,101,.12),rgba(24,168,255,.08))}
.preview .wrap{padding:16px 0;text-align:center;font-weight:700;letter-spacing:.035em}.preview strong{color:var(--gold2)}
.hero{padding:68px 0 54px}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center}
.eyebrow{color:var(--gold);letter-spacing:.22em;font-size:13px;font-weight:700}
h1{font-size:clamp(46px,7vw,88px);line-height:.94;margin:14px 0 22px;letter-spacing:-.04em}
h1 span{display:block;color:var(--gold2)}.lead{font-size:21px;color:#d7dee8;max-width:720px}
.slogan{font-size:22px;margin:28px 0}.slogan b{color:var(--gold2)}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.button{padding:14px 20px;border-radius:10px;border:1px solid var(--line);font-weight:700}.button.primary{background:linear-gradient(120deg,#d39a42,#ffe0a0);color:#101010}
.hero-art img{width:100%;display:block;border-radius:28px;box-shadow:0 24px 80px rgba(0,0,0,.55);border:1px solid rgba(231,184,101,.3)}
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#07111d}.track{white-space:nowrap;padding:16px 0;font-size:18px;color:var(--gold2);letter-spacing:.12em;animation:scroll 34s linear infinite}.track span{margin-right:48px}@keyframes scroll{to{transform:translateX(-50%)}}
section{padding:82px 0}.section-head{max-width:820px;margin-bottom:38px}.section-head h2{font-size:clamp(34px,5vw,58px);line-height:1.03;margin:10px 0}.section-head p{color:var(--muted);font-size:18px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:linear-gradient(145deg,rgba(14,30,48,.92),rgba(5,12,20,.94));border:1px solid var(--line);border-radius:18px;padding:25px;min-height:220px}.card .num{color:var(--gold);font-size:13px;letter-spacing:.15em}.card h3{font-size:23px;margin:10px 0}.card p{color:#bdc7d3;margin:0;font-size:17.5px;line-height:1.7}
.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}.feature-panel{padding:34px;border-radius:22px;border:1px solid var(--line);background:rgba(7,17,29,.86)}.feature-panel h3{font-size:31px;margin-top:0}.feature-panel p{font-size:17.5px;line-height:1.7}.feature-panel li{margin:11px 0;color:#c7d0dc;font-size:17px;line-height:1.58}
.gold{color:var(--gold2)}.worlds{background:linear-gradient(180deg,transparent,rgba(11,31,50,.65),transparent)}
.quote{font-size:clamp(30px,4.5vw,58px);text-align:center;max-width:1040px;margin:auto;line-height:1.08}.quote strong{color:var(--gold2)}
.about{display:grid;grid-template-columns:1.25fr .75fr;gap:32px}.about-card{background:#07111d;border:1px solid var(--line);border-radius:20px;padding:30px}.portrait{width:100%;max-width:300px;border-radius:18px;display:block;margin:0 auto 18px}.hebhi{width:110px;margin-bottom:18px}
footer{border-top:1px solid var(--line);padding:34px 0 48px;color:#8793a2;text-align:center}
@media(max-width:900px){nav a:not(.lang):not(.cta){display:none}.hero-grid,.split,.about{grid-template-columns:1fr}.hero-art{order:-1}.grid{grid-template-columns:1fr 1fr}.brand img{width:128px;height:64px}}
@media(max-width:620px){.wrap{width:min(100% - 26px,var(--max))}.grid{grid-template-columns:1fr}.nav{gap:10px}.cta{display:none}.hero{padding-top:38px}section{padding:58px 0}}

@media(max-width:620px){
  .card h3{font-size:21px}
  .card p{font-size:16.5px;line-height:1.68}
  .feature-panel h3{font-size:27px}
  .feature-panel p,.feature-panel li{font-size:16.5px}
}
