/* Shared base styles. Page-specific styles live at the top of each page in src/pages. */
:root {
  --ink: #0E1A2F;
  --body: #46526A;
  --text: #2B3650;
  --line: #E2E7F0;
  --tint: #F4F7FB;
  --yellow: #FDCB1A;
  --blue: #1F55BD;
  --green: #087A35;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: #FFFFFF; color: var(--ink); font-family: 'Plus Jakarta Sans', system-ui, sans-serif; overflow-x: hidden; }
img { max-width: 100%; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #4C86F0; outline-offset: 2px; }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 10; background: var(--ink); color: #FFFFFF; padding: 10px 16px; border-radius: 8px; }
.skip:focus { left: 8px; }
[hidden] { display: none !important; }

/* Header sticks to the top, slides away on scroll down and back on scroll up */
html { scroll-padding-top: 16px; }
.site-header { position: sticky; top: 0; z-index: 50; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.site-header.is-scrolled { box-shadow: 0 4px 16px rgba(14, 26, 47, 0.08); }
.site-header.is-hidden { transform: translateY(-100%); }

/* Guide filter pills only work with JavaScript */
html:not(.js) .guide-filter { display: none !important; }

/* Sample file viewer on Home: without JavaScript every panel shows and the tabs are hidden */
html:not(.js) .sample-tabs { display: none !important; }

@media (max-width: 600px) {
  .btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-header { transition: none; }
}