@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700;9..144,900&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;600;700&display=swap');

:root{
  --ink:#201A14;
  --paper:#F2E8D5;
  --paper-deep:#E9DCC0;
  --card:#FBF6EA;
  --stamp-red:#9C2B22;
  --gold:#E7A857;
  --gold-deep:#C9A227;
  --green:#3F6B4A;
  --panel:#2A2018;
  --panel-line:#4A3A28;
  --ink-soft:#5B5142;
  --ink-faint:#93866D;
  --radius:12px;
  --shadow: 4px 4px 0 rgba(32,26,20,0.14);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:'';
  position:fixed; inset:0; pointer-events:none; z-index:0;
  background:repeating-linear-gradient(to bottom, transparent 0 37px, rgba(32,26,20,0.05) 37px 38px);
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{font-family:'Fraunces', serif; font-weight:700; color:var(--ink); line-height:1.12;}
.mono{font-family:'JetBrains Mono', monospace;}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px; position:relative; z-index:1;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono', monospace; font-size:11.5px; font-weight:700;
  letter-spacing:1.2px; text-transform:uppercase; color:var(--stamp-red);
}
.btn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:'Inter'; font-weight:700; font-size:15px;
  padding:14px 26px; border-radius:9px; border:1.5px solid var(--ink);
  cursor:pointer; transition:transform .12s ease, box-shadow .12s ease;
}
.btn-primary{background:var(--stamp-red); color:#F7EFDD; border-color:var(--stamp-red); box-shadow:4px 4px 0 rgba(32,26,20,0.3);}
.btn-primary:hover{transform:translate(-2px,-2px); box-shadow:6px 6px 0 rgba(32,26,20,0.3);}
.btn-ghost{background:transparent; color:var(--ink); box-shadow:3px 3px 0 rgba(32,26,20,0.16);}
.btn-ghost:hover{transform:translate(-2px,-2px); box-shadow:5px 5px 0 rgba(32,26,20,0.16);}
.hero .btn-ghost{color:#F7EFDD; border-color:#F7EFDD; box-shadow:3px 3px 0 rgba(0,0,0,0.35);}
.hero .btn-ghost:hover{box-shadow:5px 5px 0 rgba(0,0,0,0.35);}
.btn-dark{background:var(--panel); color:var(--gold); border-color:var(--panel);}
.btn-dark:hover{transform:translate(-2px,-2px);}

/* ---------- Header ---------- */
header.site{
  position:sticky; top:0; z-index:50;
  background:var(--panel); border-bottom:1.5px solid var(--panel-line);
}
header.site .bar{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; max-width:1120px; margin:0 auto;
}
.brand{display:flex; align-items:center; gap:11px;}
.brand .mark{width:38px; height:44px; flex-shrink:0; display:flex; align-items:flex-end;}
.brand .mark svg{display:block;}
.brand .name{font-family:'Fraunces'; font-weight:700; font-size:21px; color:var(--gold);}
nav.main{display:flex; align-items:center; gap:18px;}
.nav-links-frame{
  display:flex; align-items:center; gap:4px;
  background:#241C13; border:1px solid var(--panel-line); border-radius:11px; padding:5px;
}
.nav-links-frame a{padding:8px 14px; border-radius:7px; font-size:13.8px;}
.nav-links-frame a:hover{background:#332818; color:var(--gold);}
nav.main a{font-size:14.5px; font-weight:600; color:#D8CBAE; transition:color .15s;}
nav.main a:hover{color:var(--gold);}
nav.main .cta{
  background:var(--gold); color:var(--panel); padding:10px 20px; border-radius:8px;
  font-weight:700; font-size:14px;
}
nav.main .guide-link{
  display:flex; align-items:center; gap:7px;
  border:1.5px solid var(--gold-deep); color:var(--gold); padding:8px 15px; border-radius:8px;
  font-weight:700; font-size:13.5px; background:rgba(231,168,87,0.08);
}
nav.main .guide-link:hover{background:rgba(231,168,87,0.16); color:var(--gold);}
nav.main .guide-link svg{flex-shrink:0;}
nav.main .lang-switch{
  border:1.5px solid var(--panel-line); padding:7px 14px; border-radius:7px; font-size:13px; font-weight:700;
}
nav.main .lang-switch:hover{border-color:var(--gold); color:var(--gold);}
.nav-toggle{display:none;}

/* ---------- Footer ---------- */
footer.site{
  background:var(--panel); border-top:1.5px solid var(--panel-line);
  padding:56px 0 28px; color:#C7B79A; margin-top:100px;
}
footer.site .cols{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:40px;}
footer.site h4{color:var(--gold); font-size:14px; text-transform:uppercase; letter-spacing:0.6px; margin-bottom:14px; font-family:'Inter'; font-weight:700;}
footer.site .brand .name{color:var(--gold);}
footer.site .footer-tagline{font-family:'JetBrains Mono',monospace; font-weight:700; font-size:11px; letter-spacing:1.6px; color:var(--stamp-red); margin-top:8px;}
footer.site p{font-size:13.5px; color:#A7987C; max-width:320px; margin-top:12px;}
footer.site ul{list-style:none;}
footer.site li{margin-bottom:9px;}
footer.site li a{font-size:13.5px; color:#C7B79A;}
footer.site li a:hover{color:var(--gold);}
footer.site .bottom{
  border-top:1px solid var(--panel-line); padding-top:22px; margin-top:8px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
  font-size:12.5px; color:#7C7156;
}

@media (max-width: 860px){
  nav.main{position:fixed; top:70px; left:0; right:0; bottom:0; background:var(--panel);
    flex-direction:column; align-items:flex-start; padding:28px; gap:22px;
    transform:translateX(100%); transition:transform .25s ease; overflow-y:auto;}
  nav.main.open{transform:translateX(0);}
  nav.main a{font-size:18px;}
  .nav-links-frame{flex-direction:column; align-items:stretch; background:none; border:none; padding:0; gap:14px; width:100%;}
  .nav-links-frame a{padding:0;}
  .nav-links-frame a:hover{background:none;}
  .nav-toggle{display:block; background:none; border:1.5px solid var(--panel-line); border-radius:8px; width:42px; height:42px; color:var(--gold); font-size:18px; cursor:pointer;}
  footer.site .cols{grid-template-columns:1fr;}
}
