/* Page-level reset (ported from the original design's inline <style> block) */
html { scroll-behavior: smooth; }
body { margin: 0; background: #FFFFFF; font-family: var(--font-body); color: var(--text-primary); }
* { box-sizing: border-box; }
a { color: var(--orange-600); text-decoration: none; }
a:hover { color: var(--orange-700); text-decoration: underline; }

@keyframes arwFade { from { opacity: 0; } to { opacity: 1; } }

/* Video lightbox: hidden until JS adds .is-open */
.video-modal { display: none; }
.video-modal.is-open { display: block; }

/* Keyboard-focus visibility for the custom role="button" video cards
   (mouse users get the authored hover treatment instead) */
[data-vid]:focus-visible {
  outline: 2px solid var(--orange-500);
  outline-offset: 2px;
}
button:focus-visible,
a:focus-visible {
  outline: 2px solid var(--orange-500);
  outline-offset: 2px;
}

/* Language switcher (header, both language versions) */
.lang-switch {
  display: inline-flex; align-items: center; flex: none;
  border: 1px solid var(--border-default); border-radius: 2px; overflow: hidden;
}
.lang-switch a,
.lang-switch span {
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  letter-spacing: 0.1em; line-height: 1; padding: 10px 11px;
  color: var(--text-secondary); text-decoration: none;
}
.lang-switch a:hover { background: var(--surface-subtle); color: var(--text-primary); text-decoration: none; }
.lang-switch .is-active { background: var(--gray-950); color: #FFFFFF; }