:root{
  --bg:#f6f3ef;
  --paper:#ffffff;
  --ink:#17212b;
  --muted:#647084;
  --line:#e5ded4;
  --brand:#19324a;
  --brand-2:#244b6f;
  --gold:#b88a44;
  --soft:#f0e8dc;
  --success:#0f766e;
  --radius:22px;
  --shadow:0 24px 70px rgba(25,50,74,.13);
  --max:1160px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
svg{display:block;width:22px;height:22px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}

.notice{
  background:#102235;
  color:#f8fafc;
  padding:9px 18px;
  font-size:13px;
}
.notice .inner{
  max-width:var(--max);
  margin:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.93);
  border-bottom:1px solid rgba(229,222,212,.9);
  backdrop-filter:blur(14px);
}
.nav{
  max-width:var(--max);
  margin:auto;
  padding:15px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.logo{
  display:flex;
  align-items:center;
  gap:11px;
  font-weight:900;
  color:var(--brand);
  letter-spacing:-.03em;
  font-size:20px;
}
.logo-mark{
  width:40px;
  height:40px;
  border-radius:14px;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff;
  display:grid;
  place-items:center;
}