/* Activity pages: article, collection grid, hub. Uses tokens from styles.css. */
footer .wrap > div:first-child{display:flex;flex-wrap:wrap;gap:6px 22px}
footer a{margin-right:0}
footer a[href^="mailto:"]{overflow-wrap:anywhere}
.brand{white-space:nowrap;text-decoration:none}
nav .wrap{gap:16px}
.navlinks{display:flex;align-items:center;gap:22px}
.navlinks a:not(.btn){text-decoration:none;font-weight:600;font-size:15px}
.wrap.narrow{max-width:760px}
.crumbs{font-size:14px;color:var(--ink-soft);margin:26px 0 18px}
.crumbs a{text-decoration:none}
.article h1,.collection h1,.hub h1{font-size:clamp(32px,4.4vw,48px);margin:18px 0 8px}
.article .meta{color:var(--ink-soft);font-size:16px;margin-bottom:12px}
.hero-art{display:block;width:100%;max-width:640px;height:auto;border-radius:24px;border:1px solid var(--hair);background:var(--card)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.chip{display:inline-block;background:var(--sage-tint);color:var(--sage-deep);border-radius:999px;padding:6px 12px;font:600 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.article section{padding:26px 0 0;border:0}
.article h2,.collection h2,.hub h2{font-size:24px;margin-bottom:10px}
.article p,.article li,.article dd{font-size:17px;line-height:1.6}
.materials,.steps{padding-left:24px}
.steps li{margin-bottom:10px}
.skills dt{font-weight:600;margin-top:12px}
.skills dd{color:var(--ink-soft);margin:2px 0 0}
.switch p{margin-bottom:8px}
.cta{margin:40px 0;background:var(--sage-tint);border-radius:28px;padding:34px 30px}
.cta h2{font-size:26px}
.cta p{color:var(--ink);font-size:16px;margin:10px 0 18px;max-width:38em}
.cta .badges{justify-content:flex-start}
.cta .badge{opacity:1;text-decoration:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px;margin-top:8px}
.card{display:block;text-decoration:none;background:var(--card);border:1px solid var(--hair);border-radius:20px;overflow:hidden;transition:.18s}
.card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(65,61,52,.12)}
.card img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:var(--card)}
.card-title{display:block;font-family:var(--serif);font-size:18px;padding:12px 14px 2px}
.card-meta{display:block;font-size:13px;color:var(--ink-soft);padding:0 14px 14px}
.collection .intro,.hub .intro{font-size:18px;color:var(--ink);max-width:44em;margin:8px 0 6px}
.count{font-size:14px;color:var(--ink-soft);margin-bottom:20px}
.browse{padding:30px 0 60px}
.browse p{line-height:2}
.browse a{text-decoration:none;color:var(--sage-deep);font-weight:600}
.hub section{padding:28px 0 0;border:0}
.collection section{border:0;padding-top:28px}
.collist{list-style:none;columns:2;column-gap:40px}
.collist li{break-inside:avoid;padding:8px 0;border-bottom:1px solid var(--hair);display:flex;justify-content:space-between;gap:12px}
.collist a{text-decoration:none}
.collist .n{color:var(--ink-soft);font-size:14px}
@media(max-width:700px){
  .brand{font-size:17px}
  .collist{columns:1}
  .navlinks{gap:12px}
  .navlinks .btn{padding:11px 16px;font-size:14px}
  .cta{padding:26px 20px}
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
}