/* Монетний Двір — статичний сайт (лендинг + легальні сторінки). Темна золота тема. */
:root{
  --bg:#0E1116; --surface:#161A21; --card:#1E232C; --divider:#2A303A;
  --gold:#C9A24B; --gold-light:#E8C97A;
  --text:#F4F5F7; --muted:#AEB5C0; --dim:#6B7280;
  --maxw:1040px; --readw:720px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65; -webkit-font-smoothing:antialiased; font-size:16px;
}
a{color:var(--gold-light); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 22px}

/* Header */
header.site{position:sticky; top:0; z-index:10; background:rgba(14,17,22,.9);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--divider)}
.nav{display:flex; align-items:center; gap:14px; height:62px}
.nav .brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:18px; color:var(--text)}
.nav .brand img{width:30px; height:30px; border-radius:7px}
.nav .spacer{flex:1}
.nav a.link{color:var(--muted); font-size:14px}
.nav a.link:hover{color:var(--text); text-decoration:none}
.langs{display:flex; gap:6px}
.langs button{background:var(--card); color:var(--muted); border:1px solid var(--divider);
  border-radius:8px; padding:6px 10px; font-size:12px; cursor:pointer; transition:.15s}
.langs button:hover{color:var(--text)}
.langs button.active{background:var(--gold); color:#1a1300; border-color:var(--gold); font-weight:700}

/* Hero */
.hero{text-align:center; padding:72px 0 44px}
.hero img.logo{width:108px; height:108px; border-radius:26px; box-shadow:0 12px 46px rgba(201,162,75,.28)}
.hero h1{font-size:42px; margin:24px 0 6px; letter-spacing:.5px}
.hero .tagline{color:var(--gold-light); font-size:18px; margin:0 0 12px; letter-spacing:.4px}
.hero p.lead{color:var(--muted); max-width:640px; margin:0 auto 28px; font-size:17px}
.badges{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
.badge{display:inline-flex; align-items:center; gap:8px; background:var(--card);
  border:1px solid var(--divider); border-radius:14px; padding:12px 18px; color:var(--text); font-weight:600}
.badge small{display:block; color:var(--dim); font-weight:400; font-size:11px}

/* Features */
.features{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; padding:24px 0 60px}
.feature{background:var(--card); border:1px solid var(--divider); border-radius:18px; padding:24px}
.feature h3{margin:0 0 8px; font-size:17px; color:var(--gold-light)}
.feature p{margin:0; color:var(--muted); font-size:14.5px}

/* Legal / content pages — readable column */
.page{max-width:var(--readw); margin:0 auto; padding:44px 22px 72px}
.page .back{display:inline-block; margin-bottom:22px; color:var(--muted); font-size:14px}
.page h1{font-size:32px; margin:0 0 6px; line-height:1.2}
.page .edition{color:var(--dim); font-size:13.5px; margin:0 0 8px}
.page .intro{color:var(--muted); font-size:16px; margin:0 0 10px; padding-bottom:22px; border-bottom:1px solid var(--divider)}
.page h2{font-size:20px; color:var(--gold-light); margin:38px 0 10px; line-height:1.3}
.page p{color:var(--text); opacity:.92; font-size:16px; margin:0 0 14px}
.page ul{margin:0 0 16px; padding-left:22px}
.page li{color:var(--text); opacity:.92; font-size:16px; margin:0 0 7px}
.page .note{background:var(--surface); border:1px solid var(--divider); border-left:3px solid var(--gold);
  border-radius:12px; padding:14px 16px; margin:0 0 16px; color:var(--muted); font-size:15px}
.page .contact{margin-top:34px; padding-top:22px; border-top:1px solid var(--divider); color:var(--muted); font-size:15px}

/* Footer */
footer.site{border-top:1px solid var(--divider); padding:30px 0 54px; color:var(--dim); font-size:13px}
footer.site .row{display:flex; gap:18px; flex-wrap:wrap; align-items:center}
footer.site .spacer{flex:1}
footer.site a{color:var(--muted)}

/* Language visibility */
[data-lang]{display:none}
[data-lang].show{display:block}
.langline[data-lang]{display:none}
.langline[data-lang].show{display:inline}

@media (max-width:560px){
  body{font-size:15.5px}
  .hero{padding:52px 0 36px}
  .hero h1{font-size:33px}
  .page{padding:32px 18px 56px}
  .page h1{font-size:27px}
  .page h2{font-size:18px; margin:30px 0 9px}
  .nav a.link{display:none}
}