/* Little Play, article styles (extends /activities/activity.css) */
.byline { display:flex; align-items:center; gap:.6rem; font-size:.85rem; opacity:.7; margin-bottom:1.6rem; }
.byline .dot { opacity:.5; }
.summary { background:#fff; border-left:4px solid var(--sage); border-radius:16px; padding:1.2rem 1.4rem; margin-bottom:1.6rem; box-shadow:0 10px 30px rgba(92,58,46,.07); }
.summary h2 { font-family:'Outfit',sans-serif; font-size:1rem; margin-bottom:.6rem; letter-spacing:.04em; text-transform:uppercase; color:var(--terracotta-deep); }
.summary ul { margin-left:1.2rem; }
.summary li { margin-bottom:.35rem; font-size:.95rem; }
.toc { background:var(--cream-2); border-radius:16px; padding:1.1rem 1.4rem; margin-bottom:2rem; font-size:.92rem; }
.toc b { font-family:'Outfit',sans-serif; display:block; margin-bottom:.5rem; }
.toc a { display:block; padding:.22rem 0; text-decoration:none; opacity:.85; }
.toc a:hover { opacity:1; color:var(--terracotta-deep); }
article h2 { font-family:'Outfit',sans-serif; font-size:1.55rem; margin:2.4rem 0 .9rem; scroll-margin-top:80px; }
article h3 { font-family:'Outfit',sans-serif; font-size:1.15rem; margin:1.6rem 0 .6rem; }
article p { margin-bottom:1rem; }
article ul, article ol { margin:0 0 1rem 1.4rem; }
article li { margin-bottom:.4rem; }
article table { width:100%; border-collapse:collapse; margin:1.2rem 0 1.6rem; background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 8px 24px rgba(92,58,46,.07); font-size:.92rem; }
article th { background:var(--cream-2); text-align:left; padding:.7rem .9rem; font-family:'Outfit',sans-serif; font-size:.85rem; }
article td { padding:.65rem .9rem; border-top:1px solid rgba(92,58,46,.08); vertical-align:top; }
.act { display:flex; align-items:center; gap:.9rem; background:#fff; border-radius:16px; padding:.7rem .9rem; margin:.7rem 0;
  text-decoration:none; box-shadow:0 8px 24px rgba(92,58,46,.07); transition:transform .15s; }
.act:hover { transform:translateY(-2px); }
.act img { width:56px; height:56px; border-radius:12px; object-fit:cover; flex:none; }
.act b { font-family:'Outfit',sans-serif; font-size:.98rem; display:block; }
.act span { font-size:.8rem; opacity:.7; }
.act .go { margin-left:auto; color:var(--terracotta); font-weight:700; }
.callout { background:var(--cream-2); border-radius:14px; padding:1rem 1.2rem; margin:1.2rem 0; font-size:.95rem; }
.faq-item { background:#fff; border-radius:16px; padding:1.1rem 1.3rem; margin-bottom:.8rem; box-shadow:0 8px 24px rgba(92,58,46,.06); }
.faq-item h3 { margin:0 0 .5rem; font-size:1.02rem; }
.faq-item p { margin:0; font-size:.94rem; opacity:.9; }
.related { display:grid; grid-template-columns:repeat(3,1fr); gap:.9rem; margin-top:1rem; }
.related a { background:#fff; border-radius:14px; padding:1rem 1.1rem; text-decoration:none; font-size:.9rem; font-weight:600;
  font-family:'Outfit',sans-serif; box-shadow:0 8px 24px rgba(92,58,46,.06); }
.related a small { display:block; font-family:'Inter',sans-serif; font-weight:400; opacity:.65; margin-top:.3rem; }
.email-box { background:var(--cream-2); border-radius:18px; padding:1.6rem; text-align:center; margin:2rem 0 0; }
.email-box h3 { font-family:'Outfit',sans-serif; margin-bottom:.4rem; }
.email-box p { font-size:.9rem; opacity:.8; margin-bottom:1rem; }
.email-box form { display:flex; gap:.5rem; max-width:400px; margin:0 auto; }
.email-box input { flex:1; border:1px solid rgba(92,58,46,.15); border-radius:999px; padding:.7rem 1.1rem; font-family:inherit; font-size:.9rem; }
.email-box button { border:none; background:var(--sage); color:#fff; font-weight:700; font-family:inherit; padding:.7rem 1.2rem; border-radius:999px; cursor:pointer; }
.disclaimer { font-size:.8rem; opacity:.55; margin-top:2rem; }
.hero-caption { font-size:.8rem; opacity:.6; margin:-1rem 0 1.4rem; text-align:center; }
@media (max-width:640px){ .related { grid-template-columns:1fr; } .email-box form { flex-direction:column; } }

/* Resources index */
.res-lede { font-size:1.05rem; opacity:.85; margin-bottom:2rem; max-width:40rem; }
.res-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.3rem; }
.res-card { background:#fff; border-radius:20px; overflow:hidden; text-decoration:none; box-shadow:0 10px 30px rgba(92,58,46,.08); display:flex; flex-direction:column; transition:transform .18s; }
.res-card:hover { transform:translateY(-4px); }
.res-card img { width:100%; height:170px; object-fit:cover; display:block; }
.res-body { padding:1.1rem 1.25rem 1.35rem; display:flex; flex-direction:column; flex:1; }
.res-cat { font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--terracotta); margin-bottom:.4rem; }
.res-card h2 { font-family:'Outfit',sans-serif; font-size:1.12rem; line-height:1.3; margin-bottom:.45rem; }
.res-card p { font-size:.88rem; opacity:.75; margin-bottom:.8rem; }
.res-more { margin-top:auto; font-size:.85rem; font-weight:700; color:var(--sage); }
