/* Vanilla Framework supplies typography, grid, themes, controls and spacing.
   These additions cover only Pometa branding and screenshot presentation. */
html { scroll-behavior: smooth; scroll-padding-top: 1.5rem; }
[hidden] { display: none !important; }
.site-header { border-bottom: 1px solid #d9d9d9; }
.site-header__inner { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; min-height: 5rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; font-size: 1.5rem; color: inherit; text-decoration: none; }
.brand:hover { text-decoration: none; }
.brand img { flex: none; margin: 0; }
.site-header nav { display: flex; gap: 1.5rem; align-items: center; }
.site-header nav > a:not([class]) { color: inherit; }
.hero { padding-top: 4rem; padding-bottom: 2rem; }
.hero__intro { padding-top: .5rem; }
.hero__icon { margin-bottom: 1.5rem; }
.screenshot-strip { padding-top: 0; }
.app-shot { margin: 0; }
.app-shot img { width: 100%; height: auto; display: block; filter: drop-shadow(0 12px 16px #11111118); }
.app-shot figcaption { text-align: center; color: #666; margin-top: .5rem; }
.screenshot-caption { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; color: #666; }
.feature-row { margin-top: 3rem; }
details { border-top: 1px solid #d9d9d9; padding: 1rem 0; }
details:last-child { border-bottom: 1px solid #d9d9d9; }
summary { cursor: pointer; }
details p { margin: 1rem 0 0; }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.site-footer p { margin-bottom: 0; }
@media (max-width: 619px) {
  .site-header__inner { align-items: flex-start; flex-direction: column; gap: .5rem; padding-top: 1rem; padding-bottom: .5rem; }
  .site-header nav { width: 100%; flex-wrap: wrap; gap: .75rem 1rem; font-size: .875rem; }
  .site-header nav .p-button { font-size: .875rem; }
  .hero { padding-top: 2rem; }
  .hero__intro { padding-top: 1rem; }
  .hero__icon { width: 56px; height: 56px; }
  .screenshot-caption, .site-footer { flex-direction: column; gap: .5rem; }
  .screenshot-caption p { margin-bottom: 0; }
  .p-tabs__link { padding-left: .65rem; padding-right: .65rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.p-tabs__list { list-style: none; }