
:root{
  --bg:#faf7f1;
  --paper:#fffaf0;
  --ink:#2f2a26;
  --accent:#7a5c40;   /* warm brown */
  --accent2:#3c6e5d;  /* muted green */
  --gold:#b6955a;
  --link:#2e6f6c;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family: 'Libre Baskerville', Georgia, serif;line-height:1.55}
a{color:var(--link);text-underline-offset:3px}
.container{max-width:1100px;margin:0 auto;padding:1.25rem}
header.site-header{position:sticky;top:0;z-index:10;background:linear-gradient(0deg, rgba(250,247,241,0.92), rgba(250,247,241,0.98)), var(--bg);backdrop-filter:saturate(1.2) blur(6px);border-bottom:3px solid var(--accent)}
.brand{display:flex;align-items:center;gap:.75rem}
.brand .logo {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: url("/assets/img/JS-logo.png") center/cover no-repeat;
  box-shadow: inset 0 0 0 3px var(--paper), 0 1px 2px rgba(0,0,0,.1);
}
nav ul{list-style:none;display:flex;gap:1rem;padding:0;margin:0;flex-wrap:wrap}
nav a{display:inline-block;padding:.5rem .75rem;border-radius:999px;border:1px solid transparent}
nav a:hover{border-color:var(--accent);background:#fffdf7;color:var(--ink)}
.hero{
  background:
    radial-gradient(1200px 200px at 50% -40%, rgba(58, 92, 79, .08), transparent 60%),
    url('../img/morris-border.svg') top left / 220px repeat-x,
    url('../img/morris-border.svg') bottom left / 220px repeat-x;
  padding:3.5rem 1.25rem 2.5rem;
} 
.hero h1{font-size:clamp(2rem, 4vw, 3rem);margin:.25rem 0;color:var(--accent2)}
.hero p{max-width:65ch}
.grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap:1rem;
}
.card{background:var(--paper);border:2px solid var(--accent);border-radius:20px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.card img{width:100%;display:block}
.card .pad{padding:1rem}
.leaf-divider{height:14px;background:url('../img/leaf-divider.svg') center/auto 14px repeat-x;opacity:.7;margin:1.25rem 0}
footer{margin-top:2rem;border-top:3px solid var(--accent);background:#fffdf7}
footer .footer-inner{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
/* Forms */
form{background:var(--paper);border:2px solid var(--accent);border-radius:18px;padding:1rem;max-width:720px}
label{display:block;margin:.5rem 0 .25rem}
input,textarea{width:100%;padding:.65rem .75rem;border:1.5px solid var(--accent);border-radius:12px;background:#fffef9}
button.btn{margin-top:.75rem;background:var(--accent2);color:#fff;border:none;padding:.7rem 1rem;border-radius:999px;cursor:pointer}
button.btn:hover{filter:brightness(1.05)}
/* Blog list */
.post-list{display:grid;gap:1rem}
.post{padding:1rem;background:var(--paper);border:2px solid var(--accent);border-radius:16px}
.post h3{margin:.25rem 0}
/* Responsive tweaks */
@media (max-width:640px){
  nav ul{gap:.5rem}
}
