/* "More from Dad, Look" - shared by every side site, takes its colours from the page around it */
.more { display: flex; flex-direction: column; gap: 14px; padding: 20px 0 4px; border-top: 1px solid rgba(128, 128, 128, 0.35); color: inherit; font-family: inherit; }
.more .more-title { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: inherit; opacity: 0.85; }
.more-list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.more-list a { display: flex; flex-direction: column; gap: 4px; height: 100%; box-sizing: border-box; padding: 12px 14px; border: 1px solid rgba(128, 128, 128, 0.4); border-radius: 10px; color: inherit; text-decoration: none; transition: border-color 0.2s ease, transform 0.2s ease; }
.more-list a:hover { border-color: currentColor; color: inherit; }
.more-list strong { font-size: 15px; }
.more-list span { font-size: 13px; line-height: 1.35; opacity: 0.85; }
.more-all { align-self: flex-start; font-size: 14px; font-weight: 800; color: inherit; }
.more-all:hover { color: inherit; opacity: 0.8; }

@media (prefers-reduced-motion: no-preference) {
	.more-list a:hover { transform: translateY(-2px); }
}
