:root{
  --cream:#F5EDE2;
  --brown:#4B2D23;
  --rust:#B1482C;
  --gold:#D9A441; /* optional accent */
  --sage:#8D9B6A; /* optional accent */
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--cream);color:var(--brown);font-family:"Nunito Sans",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;}
a{color:var(--rust);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin-inline:auto;padding: clamp(16px, 4vw, 32px);}    
h1,h2,h3{font-family:"Lora", Georgia, serif;line-height:1.2;margin:0 0 .5rem}
h1{font-size:clamp(2rem, 5vw, 3rem)}
h2{font-size:clamp(1.5rem, 3.5vw, 2rem);margin-top:2rem}
p{margin:.25rem 0 1rem;max-width:70ch}

/* Header */
header{position:sticky;top:0;background:rgba(245,237,226,.9);backdrop-filter: blur(6px);border-bottom:1px solid #e9e0d4;z-index:20}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px}
.logo{display:inline-flex}
.cta{display:flex;gap:10px;align-items:center}
.btn{display:inline-block;padding:.7rem 1.05rem;border-radius:999px;border:1.5px solid var(--brown);color:var(--cream);background:var(--brown);font-weight:700}
.btn--ghost{background:transparent;color:var(--brown)}
.btn--accent{background:var(--rust);border-color:var(--rust)}
.btn:hover{filter:brightness(0.95)}

/* Hero */
.hero{padding: clamp(32px, 8vw, 80px) 0;}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px, 6vw, 48px);align-items:center}
.tagline{font-size:clamp(1.15rem, 2.2vw, 1.35rem);opacity:.95}
.card{background:#fff6ef;border:1px solid #efdacb;border-radius:16px;padding:20px}
.list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}

/* Sections */
section{padding: clamp(32px, 7vw, 72px) 0;border-top:1px solid #e9e0d4}
.pill{display:inline-block;border:1px solid var(--rust);color:var(--rust);padding:.3rem .6rem;border-radius:999px;font-weight:700;font-size:.8rem;letter-spacing:.02em}

/* Footer */
footer{padding:36px 0;border-top:1px solid #e9e0d4;font-size:.95rem}

/* Simple utility */
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.muted{opacity:.85}

/* Responsive */
@media (max-width: 880px){
  .hero-grid{grid-template-columns:1fr}
  .cta{display:none}
}

/* Logo sizing + alignment */
.brand {
  display: flex;
  align-items: center;
  gap: 12px; /* spacing between logo and text */
}

.brand .logo {
  height: 60px; /* much smaller, keeps logo proportional */
  width: auto;
}

.brand-text {
  font-size: 1.2rem; /* larger text */
  line-height: 1.2;
}
