/* Gedeelde opmaak van de openbare pagina's stee_info.html en stee_downloads.html. */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: hidden; }
body { margin: 0; font-family: var(--font-body, system-ui, sans-serif); background: var(--stee-surface-app); color: var(--stee-text-strong); line-height: 1.55; }
.info-wrap { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.info-top { position: sticky; top: 0; z-index: 10; background: var(--stee-surface-1); border-bottom: 1px solid var(--stee-border); }
.info-top .info-wrap { display: flex; align-items: center; gap: 12px; min-height: 60px; }
.info-brand { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 1.3em; color: var(--stee-color-primary); text-decoration: none; margin-right: auto; }
.info-logo { width: 30px; height: 30px; color: var(--stee-text-strong); }
.info-lang { width: auto; }
.info-lokaal { padding: 48px 0; border-top: 1px solid var(--stee-border); }
.info-lokaal h1 { font-size: clamp(1.9em, 5vw, 2.4em); margin: 0 0 8px; }
.info-lokaal h2 { font-size: 1.6em; margin: 0 0 12px; }
.info-lokaal-intro { color: var(--stee-text-muted); font-size: 1.05em; max-width: 720px; margin: 0 0 24px; }
.info-dl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.info-dl-card { background: var(--stee-surface-1); border: 1px solid var(--stee-border); border-radius: var(--stee-radius-lg, 12px); padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.info-dl-card h3 { margin: 0; font-size: 1.15em; }
.info-dl-meta { margin: 0 0 8px; color: var(--stee-text-muted); flex: 1; }
.info-dl-btn[aria-disabled="true"] { opacity: .5; pointer-events: none; cursor: default; }
.info-dl-extra { margin: 12px 0 0; color: var(--stee-text-muted); }
.info-lokaal-warn { margin-top: 24px; background: var(--stee-surface-1); border: 1px solid var(--stee-border); border-radius: var(--stee-radius-lg, 12px); padding: 20px; }
.info-lokaal-warn h3 { margin: 0 0 8px; font-size: 1.05em; }
.info-lokaal-warn ul { margin: 0; padding-left: 20px; color: var(--stee-text-muted); }
.info-lokaal-install p { color: var(--stee-text-muted); margin: 12px 0 0; }
.info-foot { border-top: 1px solid var(--stee-border); padding: 32px 0 48px; text-align: center; color: var(--stee-text-muted); }
.info-foot a { color: var(--stee-color-primary); }
@media (max-width: 760px) {
  .info-top .stee-btn--ghost { display: none; }
}