@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/inter-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/inter-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/inter-latin.woff2') format('woff2');
}
:root { color-scheme: light; }
* { box-sizing: border-box; }
body { -webkit-font-smoothing: antialiased; }
::selection { color: white; background: #242424; }
.display { letter-spacing: -.052em; }
.rail { position: relative; }
.rail::before,
.rail::after {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  content: '';
  background: rgba(36,36,36,.10);
  pointer-events: none;
}
.rail::before { left: 0; }
.rail::after { right: 0; }
.cross {
  position: absolute;
  width: 11px;
  height: 11px;
  z-index: 10;
  pointer-events: none;
  background:
    linear-gradient(rgba(36,36,36,.18),rgba(36,36,36,.18)) center/1px 11px no-repeat,
    linear-gradient(90deg,rgba(36,36,36,.18),rgba(36,36,36,.18)) center/11px 1px no-repeat;
}
.terminal-grid {
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 24px 24px;
}
.dot-grid {
  background-image: radial-gradient(rgba(36,36,36,.15) 1px, transparent 1px);
  background-size: 16px 16px;
}
.reveal { animation: reveal .7s cubic-bezier(.16,1,.3,1) both; }
.reveal-delay { animation-delay: .12s; }
@keyframes reveal {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto!important; animation-duration: .01ms!important; transition-duration: .01ms!important; }
}

/* Sticky header: content stays rail-width, blurred backdrop goes full-bleed. */
.site-header { position: sticky; top: 0; z-index: 50; }
.site-header::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  left: 50%; right: 50%;
  width: 100vw;
  margin-left: -50vw;
  margin-right: -50vw;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background-color .2s ease, border-color .2s ease, backdrop-filter .2s ease;
  z-index: -1;
}
.site-header.scrolled::before {
  background: rgba(244,244,244,.72);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom-color: rgba(36,36,36,.10);
}

/* Avoid a flash of untranslated (German-authored) markup before JS applies
   the detected/saved language. Content is hidden, not removed, so layout
   and SEO crawling of the authored text are unaffected. */
html.i18n-loading body { visibility: hidden; }
