/* Inspiration page specific styles */
.hero { position: relative; padding: var(--space-16) 0 var(--space-12); }
.hero-inner { text-align: center; }
.hero::before, .hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero::before { background: radial-gradient(600px 280px at 20% 20%, rgba(var(--rgb-accent), 0.10), transparent 60%); }
.hero::after { background: radial-gradient(800px 380px at 80% 0%, rgba(var(--rgb-primary), 0.10), transparent 60%); }
.cta-group { display: inline-flex; gap: var(--space-4); margin-top: var(--space-6); flex-wrap: wrap; }
.btn--outline { margin-bottom: 4px; }
.section { padding: var(--space-12) 0 var(--space-10); }
.section-head { margin-bottom: var(--space-6); }
.section-head p { color: var(--gray-100); }
.hero p {margin: 0 auto;}
/* Prompts */
.prompts-actions { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); flex-wrap: wrap; }
.prompt-live { min-height: 1.5em; color: var(--color-accent); font-weight: 600; }
.prompts-grid { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: var(--space-6); }
@media (min-width: 720px) { .prompts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .prompts-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Quotes */
.quotes-bar { display: flex; justify-content: flex-end; margin-bottom: var(--space-4); }
.quotes-grid { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: var(--space-6); }
@media (min-width: 860px) { .quotes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
blockquote p { font-size: var(--text-lg); margin-bottom: var(--space-3); }
blockquote footer { color: var(--gray-300); }

/* Spotlight */
.spotlight-grid { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: var(--space-6); }
@media (min-width: 900px) { .spotlight-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.meta { color: var(--gray-300); font-size: var(--text-sm); }

/* Tips */
.tips-list { list-style: none; padding: 0; margin: 0 0 var(--space-6); display: grid; gap: var(--space-4); }
.tips-list li { background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.03)); border: 1px solid rgba(255,255,255,0.10); border-radius: var(--radius-xl); padding: var(--space-5); box-shadow: var(--shadow-sm); }
.tips-cta { display: flex; gap: var(--space-3); flex-wrap: wrap; }

/* DIY */
.diy-list { display: grid; gap: var(--space-5); }
.diy-list details { overflow: hidden; }
.diy-list summary { cursor: pointer; list-style: none; position: relative; padding-left: 28px; }
.diy-list summary::marker { display: none; }
.diy-list summary::before { content: "+"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; line-height: 20px; text-align: center; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12); border-radius: var(--radius-sm); font-weight: 700; color: var(--color-text); }
.diy-list details[open] summary::before { content: "−"; }
.diy-content { margin-top: var(--space-4); }
.diy-content h4 { margin-top: var(--space-3); }

/* Events */
.event-list { list-style: none; padding: 0; display: grid; gap: var(--space-6); }
.event-list time { color: var(--color-primary); font-weight: 600; }

/* Gallery */
.gallery-grid { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: var(--space-6); }
@media (min-width: 900px) { .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.gallery-item img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); transition: transform var(--duration-200) var(--easing-standard), box-shadow var(--duration-200) var(--easing-standard); }
.gallery-item:hover img { transform: translateY(-2px); box-shadow: var(--shadow-lg), 0 0 36px rgba(var(--rgb-accent), 0.12); }
.gallery-item figcaption { margin-top: var(--space-3); color: var(--gray-100); }
.gallery-cta { margin-top: var(--space-6); display: flex; gap: var(--space-3); flex-wrap: wrap; justify-content: center; }

/* Resources */
.resources-grid { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: var(--space-6); }
@media (min-width: 900px) { .resources-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Small enhancements */
.card:focus { outline: none; box-shadow: var(--shadow-glow-accent); }