/* Small additions needed after converting the React app to static HTML. */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
/* Keep section headings clear of the fixed navigation bar when jumping to an anchor. */
section[id] { scroll-margin-top: 8.5rem; }
/* Navigation items were buttons in the original; as links they need the same box. */
a.nav-link:not(.block):not(.w-full) { display: inline-block; }
#form-status:empty { display: none; }
/* Placeholder text that still needs Radu's input. The deploy refuses to publish while any exists. */
.draft { background: #fff1c2; color: #6b4e00; padding: 0 0.25em; }
/* Legal pages: clear the fixed navigation bar (taller than pt-32 on desktop). */
.legal-page { padding-top: 11rem; }
/* Accent-coloured text: darker gold for WCAG AA contrast (4.9:1 on white, 4.65:1 on the page background).
   Backgrounds and borders keep the original accent. */
.text-accent, .hover\:text-accent:hover { color: #8c6b3f; }
/* Three-column grid for the focus sectors (not in the compiled Tailwind build). */
@media (min-width: 48rem) { .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Navigation: keep the logo and the button intact on medium screens. */
nav a[aria-label="xStoica"] { flex-shrink: 0; }
nav .nav-link { white-space: nowrap; }
@media (min-width: 64rem) and (max-width: 75rem) {
  nav .md\:flex.gap-8 { gap: 1.25rem; }
  nav .md\:flex.gap-8 > a:last-child { padding-left: 1rem; padding-right: 1rem; }
}
/* Keep the fixed EN | DE switch (top right) clear of the navigation button (also present in the original design). */
@media (min-width: 64rem) and (max-width: 90rem) { nav > .container { padding-right: 6.5rem; } }
/* Tablets (768–1023 px): use the compact menu; the links and the button do not fit next to the logo and the language switch. */
@media (min-width: 48rem) and (max-width: 63.99rem) {
  nav .hidden.md\:flex { display: none !important; }
  nav #menu-toggle { display: block; }
  nav #mobile-menu:not([hidden]) { display: block; }
}
/* Full-width button in the mobile menu, as in the original design. */
#mobile-menu a.w-full { display: block; }
