/* Keep long domains and existing template grids within narrow screens. */
html { scroll-padding-top: 16px; }
body { min-width: 0; }
body * { letter-spacing: 0 !important; }
h1 { font-size: 40px !important; line-height: 1.15 !important; overflow-wrap: anywhere; }
h2 { font-size: 26px !important; }
h3 { font-size: 20px !important; }
.container, .grid > *, .hero > *, .hero-grid > * { min-width: 0; }
.card .articles, .card .faq-list { max-height: none !important; overflow: visible !important; }
.release-nav { display: flex; gap: 12px 20px; flex-wrap: wrap; padding: 14px 18px; }
.release-nav a, footer a, .release-contact a { text-decoration: underline; text-underline-offset: 3px; }
.release-contact { padding: 18px 0; }
.release-contact p { margin: 8px 0; }
.release-nav a:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
@media (max-width: 600px) {
  h1 { font-size: 30px !important; }
  h2 { font-size: 24px !important; }
  .grid, .hero, .hero-grid, .tiles, .related-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .card, .hero-card { padding: 18px !important; }
  .section { padding: 36px 0 !important; }
  .container { padding-left: 16px; padding-right: 16px; }
  .cta { max-width: 100%; white-space: normal; text-align: center; }
}
