/* Overview page styles — lean, leveraging base.css tokens */
.hero {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-8);
  align-items: center;
}
.hero__content p { color: var(--color-muted); }
.hero__cta { margin-top: var(--space-6); display: inline-flex; gap: var(--space-5); flex-wrap: wrap; }
.hero__media { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
}

.section { margin-block: var(--space-12); }

.toc { margin-block: var(--space-10); }
.toc__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-4); }
.toc__list a { display: block; padding: var(--space-4) var(--space-6); border: 1px solid rgba(255,255,255,0.06); border-radius: var(--radius-md); color: var(--gray-100); background: linear-gradient(180deg, rgba(224,177,92,0.05), transparent 50%); }
.toc__list a:hover { color: #fff; border-color: rgba(255,255,255,0.12); }

.media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }

.faq details { padding: var(--space-5) 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
.faq details:last-child { border-bottom: 0; }
.faq summary { cursor: pointer; font-weight: 600; }
.faq summary:focus-visible { outline: 2px solid var(--ring-color); outline-offset: var(--ring-offset); border-radius: var(--radius-sm); }

/* Subtle search feedback */
.search-hidden { display: none !important; }