@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/open-sans-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/open-sans-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

* { box-sizing: border-box; }
html { background: #e6e6e6; }
body {
  max-width: 1040px;
  margin: 48px auto;
  padding: 0 40px;
  background: #fff;
  box-shadow: 0 2px 6px #0003;
  color: #444;
  font: 0.875rem/1.72 "Open Sans", Arial, sans-serif;
}
a { color: #21759b; }
a:hover { color: #0f3647; }
a:focus-visible { outline: 2px solid #21759b; outline-offset: 4px; }
.skip { position: absolute; left: -10000px; }
.skip:focus { left: 1rem; top: 1rem; padding: .5rem; background: #fff; }
.site-header { padding: 24px 0 0; }
.site-title { font-size: 1.625rem; font-weight: 700; color: #515151; text-decoration: none; }
.tagline { margin: 0; color: #757575; }
nav {
  display: flex;
  flex-wrap: wrap;
  column-gap: 40px;
  margin-top: 24px;
  border-block: 1px solid #ededed;
}
nav a {
  padding: 11px 0;
  text-decoration: none;
  text-transform: uppercase;
  color: #626262;
  font-size: .8125rem;
}
nav a[aria-current] { font-weight: 700; color: #383838; }
main { padding: 44px 0 24px; }
h1, h2, h3 { line-height: 1.35; color: #333; }
h1 { margin: 0 0 24px; font-size: 1.55rem; font-weight: 400; }
h2 { margin: 26px 0 18px; font-size: 1.2rem; }
h3 { margin: 24px 0 14px; font-size: 1rem; }
p, ol, ul { margin: 0 0 24px; }
li > ul { margin-bottom: 0; }
img { display: block; max-width: 100%; height: auto; border-radius: 3px; }
figure { margin: 0; }
.portrait { margin-bottom: 24px; }
.portrait + h1 { font-size: 1.2rem; font-weight: 700; }
.contact { margin: 0 auto 14px; text-align: center; }
.contact a {
  display: inline-block;
  padding: 10px 23px;
  border-radius: 999px;
  color: #fff;
  background: #32373c;
  text-decoration: none;
}
.contact a:hover { background: #515961; }
hr { border: 0; border-top: 1px solid #e6e6e6; margin: 26px 0; }
.gallery {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.gallery img { width: 100%; aspect-ratio: 1; object-fit: cover; }
pre { padding: 20px; overflow: auto; background: #f7f7f7; font: .875rem/1.55 Consolas, monospace; }
footer { border-top: 1px solid #ededed; padding: 24px 0; font-size: .8125rem; }
@media (max-width: 640px) {
  html { background: #fff; }
  body { margin: 0; padding-inline: 20px; box-shadow: none; overflow-wrap: anywhere; }
  nav { column-gap: 24px; }
  main { padding-top: 30px; }
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.metrika-pixel { position: absolute; left: -9999px; }
