:root{
  --bg:#FFF8F6;
  --surface:#FFFFFF;
  --text:#2E2B28;
  --muted:#6D675F;
  --brand:#C45A64;
  --brand2:#D88CA1;
  --neutral1:#D9CEC2;
  --neutral2:#F0D9CF;
  --accent:#C97733;
  --stroke:#E7DDD3;
  --max: 960px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,h2,h3{font-family: 'DM Sans', Inter, system-ui, sans-serif; margin:0 0 .5rem 0}
h1{font-weight:800;letter-spacing:-0.02em;font-size: clamp(2rem, 4vw, 2.8rem)}
.h2,h2{font-size: clamp(1.25rem,2.2vw,1.6rem);font-weight:700}
a{color:var(--brand);text-decoration:none}
a:hover{opacity:.9}
.container{max-width:var(--max);margin:0 auto;padding:0 22px}

.top-accent{height:6px;background:linear-gradient(90deg,var(--brand),var(--brand2));}
.site-header{position:sticky;top:0;background:rgba(255,248,246,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--stroke);z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{font-weight:800;letter-spacing:-.01em;color:var(--text)}
.nav a{margin-left:18px;color:var(--text);position:relative;padding-bottom:6px}
.nav a::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:transparent;transition:background .2s}
.nav a:hover::after{background:var(--neutral1)}
.nav .button{margin-left:20px}

.button{display:inline-block;padding:10px 16px;border-radius:14px;background:var(--brand);color:#fff;font-weight:700;border:1px solid transparent;transition:transform .06s ease}
.button:hover{transform:translateY(-1px)}
.button.ghost{background:transparent;color:var(--text);border-color:var(--stroke)}

.hero{padding:72px 0 28px;border-bottom:1px solid var(--stroke)}
.hero-title{max-width:780px}
.hero-sub{color:var(--muted);max-width:780px;margin-top:.5rem}
.cta-row{margin-top:16px;display:flex;gap:12px}

.page{padding:40px 0}
.mt-20{margin-top:20px}.mt-56{margin-top:56px}
.card{background:var(--surface);border:1px solid var(--stroke);border-radius:18px;padding:18px}
.elevate{box-shadow:0 8px 30px rgba(0,0,0,.04)}

.grid.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.list{padding-left:22px}
.post-list{list-style:disc;padding-left:22px}
.post-list.large li{margin-bottom:14px}
.post-meta{color:var(--muted);font-size:.9rem;margin-left:8px}
.post-snippet{color:var(--muted);margin:.25rem 0 0}

.pill-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.pill-list li{background:var(--surface);border:1px solid var(--stroke);padding:6px 10px;border-radius:999px;color:var(--muted)}

.site-footer{border-top:1px solid var(--stroke);padding:28px 0;margin-top:44px}

.muted{color:var(--muted)}

/* Timeline (titles only) */
.timeline{position:relative;margin:28px 0;padding-left:28px}
.timeline:before{content:'';position:absolute;left:12px;top:0;bottom:0;width:2px;background:var(--neutral1)}
.tl-item{position:relative;margin:24px 0}
.tl-dot{position:absolute;left:6px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 0 0 2px var(--brand2)}
.tl-content{background:var(--surface);border:1px solid var(--stroke);border-radius:14px;padding:14px 16px}
.tl-role{color:var(--muted);margin:.35rem 0 0}