:root{
  --rust:#a8402a;
  --rust-dark:#7c2f1f;
  --rust-darker:#5e2216;
  --cream:#fdf6ec;
  --cream-dim:rgba(253,246,236,.72);
  --ink:#2a1810;
  --line:rgba(253,246,236,.22);
}

*{ box-sizing:border-box; margin:0; padding:0; }

html,body{ height:100%; }

body{
  background:var(--rust);
  color:var(--cream);
  font-family:'Space Grotesk', sans-serif;
  line-height:1.5;
}

a{ color:inherit; text-decoration:none; }

.wrap{
  max-width:1040px;
  margin:0 auto;
  padding:0 28px;
}

h1,h2,h3{
  font-family:'Fraunces', serif;
  font-weight:600;
  line-height:1.1;
}

/* ---------- Top bar ---------- */
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:26px 0;
}

.nav-links{
  display:flex;
  gap:28px;
  list-style:none;
  font-size:17px;
}

.nav-links a{
  opacity:.85;
  padding-bottom:2px;
  border-bottom:1px solid transparent;
}

.nav-links a:hover,
.nav-links a.active{
  opacity:1;
  border-bottom-color:var(--cream);
}

.socials{
  display:flex;
  align-items:center;
  gap:18px;
}

.socials a{ opacity:.85; display:flex; }
.socials a:hover{ opacity:1; }
.socials svg{ width:24px; height:24px; fill:var(--cream); }

.nav-toggle{
  display:none;
  background:none;
  border:none;
  font-size:22px;
  color:var(--cream);
  cursor:pointer;
}

@media (max-width:600px){
  .nav-links{
    position:absolute;
    top:74px; left:0; right:0;
    background:var(--rust-dark);
    flex-direction:column;
    padding:18px 28px;
    display:none;
    z-index:20;
  }
  .nav-links.open{ display:flex; }
  .nav-toggle{ display:block; }
}

/* ---------- Footer note ---------- */
.site-footer{
  text-align:center;
  font-size:13px;
  opacity:.55;
  padding:28px 0;
}