@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url("inter-400-latin-cyrillic.ff7f76c83735.woff2") format("woff2");}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url("inter-600-latin-cyrillic.0e2efeeab0c9.woff2") format("woff2");}

    :root {
      color-scheme:dark;
      --safe-top:env(safe-area-inset-top,0px);
      --safe-right:env(safe-area-inset-right,0px);
      --safe-bottom:env(safe-area-inset-bottom,0px);
      --safe-left:env(safe-area-inset-left,0px);
      --bg:#090d18;
      --panel:#11192a;
      --line:#26344b;
      --text:#edf4ff;
      --muted:#9aaac2;
      --accent:#8be5c4;
    }

    * {
      box-sizing:border-box;
    }

    html {
      scroll-behavior:smooth;
      scroll-padding-top:calc(84px + var(--safe-top));
    }

    body {
      margin:0;
      background:var(--bg);
      color:var(--text);
      font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
      line-height:1.6;
      padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);
    }

    body::before {
      content:"";
      position:fixed;
      top:0;
      left:0;
      right:0;
      height:var(--safe-top);
      background:var(--bg);
      z-index:6;
      pointer-events:none;
    }

    a {
      color:inherit;
    }

    header {
      position:sticky;
      top:var(--safe-top);
      z-index:5;
      background:#090d18dc;
      backdrop-filter:blur(16px);
      border-bottom:1px solid #26344b;
    }

    nav {
      max-width:1120px;
      margin:auto;
      padding:17px 24px;
      display:flex;
      align-items:center;
      gap:20px;
    }

    .logo {
      font-weight:800;
      letter-spacing:.08em;
    }

    .links {
      display:flex;
      align-items:center;
      gap:24px;
      font-size:13px;
      color:var(--muted);
      margin-left:auto;
    }

    .links a {
      text-decoration:none;
    }

    .wrap {
      max-width:1120px;
      margin:auto;
      padding:0 24px;
    }

    .hero {
      padding:72px var(--safe-right) 64px var(--safe-left);
      margin-left:calc(0px - var(--safe-left));
      margin-right:calc(0px - var(--safe-right));
      position:relative;
      overflow:hidden;
    }

    .hero:before {
      content:'';
      position:absolute;
      width:650px;
      height:650px;
      background:radial-gradient(circle,#173f4a88,transparent 65%);
      right:-180px;
      top:-150px;
      pointer-events:none;
    }

    .eyebrow {
      color:var(--accent);
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:.22em;
      font-weight:800;
    }

    h1 {
      font-size:clamp(32px,4.8vw,60px);
      line-height:1.12;
      letter-spacing:-.035em;
      max-width:1000px;
      margin:20px 0;
    }

    h1 em,
    .section-title em {
      font-style:normal;
      color:var(--accent);
    }

    .lead {
      font-size:clamp(17px,2vw,22px);
      color:#bac8db;
      max-width:720px;
    }

    .buttons {
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-top:32px;
    }

    .btn {
      padding:13px 20px;
      border:1px solid #4b6474;
      border-radius:10px;
      text-decoration:none;
      font-weight:650;
      font-size:14px;
    }

    .btn.primary {
      background:var(--accent);
      color:#08161b;
      border-color:var(--accent);
    }

    .stats {
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:12px;
      margin:75px 0 0;
    }

    .stat {
      border-top:1px solid #3b5265;
      padding-top:20px;
      display:flex;
      flex-direction:column;
    }

    .stat strong {
      font-size:clamp(28px,4vw,44px);
      letter-spacing:-.05em;
      display:block;
    }

    .stat span {
      color:var(--muted);
      font-size:13px;
    }

    section {
      padding:90px 0;
    }

    .section-title {
      font-size:clamp(32px,4vw,52px);
      letter-spacing:-.05em;
      line-height:1.14;
      margin:14px 0 20px;
    }

    .intro {
      max-width:750px;
      color:var(--muted);
      font-size:17px;
    }

    .timeline {
      position:relative;
      margin-top:55px;
    }

    .timeline:before {
      content:'';
      position:absolute;
      top:12px;
      bottom:30px;
      left:112px;
      width:2px;
      background:linear-gradient(var(--accent),#30405d);
    }

    .step {
      display:grid;
      grid-template-columns:92px minmax(0,1fr);
      gap:42px;
      position:relative;
      padding-bottom:28px;
    }

    .year {
      font-size:16px;
      font-weight:750;
      color:var(--accent);
      padding-top:26px;
    }

    .year-range {
      display:block;
      white-space:nowrap;
    }

    .step:before {
      content:'';
      position:absolute;
      left:105px;
      top:30px;
      width:16px;
      height:16px;
      border-radius:50%;
      background:var(--accent);
      box-shadow:0 0 0 6px #193d3d;
    }

    .card {
      background:linear-gradient(130deg,#152034,#101827);
      border:1px solid #283950;
      border-radius:18px;
      padding:30px;
    }

    .card h3 {
      font-size:25px;
      letter-spacing:-.03em;
      margin:3px 0 10px;
    }

    .card p {
      color:#b2c0d3;
      margin:10px 0;
    }

    .tag {
      font-size:11px;
      letter-spacing:.14em;
      text-transform:uppercase;
      color:var(--accent);
      font-weight:800;
    }

    .impact {
      margin-top:18px;
      padding-top:16px;
      border-top:1px solid #293b51;
      color:#e4f6f0;
      font-size:14px;
    }

    .section-alt {
      background:#101a2a;
      border-top:1px solid #29374d;
      border-bottom:1px solid #29374d;
    }

    .case-grid {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:45px;
      align-items:start;
    }

    .case h3 {
      font-size:28px;
      margin:0 0 10px;
    }

    .case p {
      color:#b3c1d2;
    }

    .features {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:12px;
      margin:26px 0 0;
      padding:0;
      list-style:none;
    }

    .feature {
      padding:18px;
      background:#172338;
      border:1px solid #2c3e55;
      border-radius:12px;
      font-size:14px;
    }

    .feature b {
      display:block;
      color:var(--accent);
      margin-bottom:5px;
    }

    .numbers {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:14px;
      margin:0;
    }

    .number {
      padding:26px;
      background:#18263a;
      border-radius:16px;
      border:1px solid #33465d;
      display:flex;
      flex-direction:column;
    }

    .number strong {
      display:block;
      font-size:40px;
      letter-spacing:-.05em;
      color:var(--accent);
    }

    .number span {
      font-size:13px;
      color:#b8c5d5;
    }

    .note {
      font-size:12px;
      color:#8c9bb0;
      margin-top:18px;
    }

    .principles {
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:15px;
      margin-top:32px;
    }

    .principle {
      border:1px solid #283950;
      border-radius:16px;
      padding:25px;
      background:#11192a;
    }

    .principle h3 {
      margin-top:0;
    }

    .principle p {
      color:var(--muted);
      font-size:14px;
    }

    .ending {
      padding-top:80px;
      padding-bottom:110px;
      text-align:center;
    }

    .ending h2 {
      font-size:clamp(35px,5vw,62px);
      line-height:1.1;
      letter-spacing:-.05em;
      max-width:800px;
      margin:0 auto 25px;
    }

    .ending p {
      max-width:640px;
      margin:0 auto 30px;
      color:var(--muted);
    }

    .ending .buttons {
      justify-content:center;
    }

    footer {
      border-top:1px solid #27364a;
      padding:28px 0;
      color:#9eacc0;
      font-size:13px;
    }

    .foot {
      display:flex;
      justify-content:space-between;
      gap:20px;
      flex-wrap:wrap;
    }

    @media(max-width:760px) {
      .links {
        gap:12px;
        font-size:11px;
      }
      .hero {
        padding-top:48px;
        padding-bottom:48px;
      }
      .stats {
        gap:24px;
      }
      .timeline:before {
        left:7px;
        top:13px;
      }
      .step {
        grid-template-columns:minmax(0,1fr);
        gap:12px;
        padding-left:32px;
      }
      .year {
        padding-top:0;
      }
      .year-range {
        display:inline;
      }
      .logo-sub {
        display:none;
      }
      .step:before {
        left:0;
        top:5px;
      }
      .card {
        padding:20px;
      }
      .card h3 {
        font-size:21px;
      }
      .case-grid,.principles {
        grid-template-columns:1fr;
      }
      .features {
        grid-template-columns:1fr;
      }
      section {
        padding:65px 0;
      }
      .numbers {
        grid-template-columns:1fr 1fr;
      }
      .number {
        padding:17px;
      }
      .number strong {
        font-size:31px;
      }
    }

    .stat dd,.number dd {
      order:-1;
      margin:0;
    }

    .technologies {
      list-style:none;
      display:flex;
      flex-wrap:wrap;
      margin:0;
      padding:0;
    }

    .technologies li {
      white-space:nowrap;
    }

    .technologies li + li::before {
      content:"·";
      margin:0 .35em;
    }

    :focus-visible {
      outline:3px solid var(--accent);
      outline-offset:4px;
    }

    .skip-link {
      position:fixed;
      top:calc(var(--safe-top) + 12px);
      left:calc(var(--safe-left) + 12px);
      z-index:7;
      padding:10px 16px;
      background:var(--accent);
      color:var(--bg);
      border-radius:8px;
      transform:translateY(calc(-100% - var(--safe-top) - 24px));
    }

    .skip-link:focus {
      transform:translateY(0);
    }

    @media(max-width:480px) {
      .stats,.numbers {
        grid-template-columns:1fr;
      }
    }

    @media(prefers-reduced-motion:reduce) {
      html {
        scroll-behavior:auto;
      }
      *,*::before,*::after {
        animation:none!important;
        transition:none!important;
      }
    }
  
.logo-mark { color: var(--accent); }


.nav-contact {
  background: none;
  border: 1px solid var(--accent);
  color: var(--accent);
  border-radius: 8px;
  padding: 6px 14px;
  font-size: 13px;
  cursor: pointer;
  font-family: inherit;
  line-height: inherit;
}

.modal-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 100;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(4px);
  align-items: center;
  justify-content: center;
}

.modal-backdrop.open {
  display: flex;
}

.modal {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 36px 32px 32px;
  max-width: 400px;
  width: calc(100% - 48px);
  position: relative;
  text-align: center;
}

.modal-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 24px;
}

.modal-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.modal-close {
  position: absolute;
  top: 14px;
  right: 16px;
  background: none;
  border: none;
  color: var(--muted);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
  padding: 4px;
}

@media(max-width:480px) {
}
@page { size: A4; margin: 16mm; }
@media print {
  :root { color-scheme: light; --bg: #fff; --text: #111; --muted: #333; --accent: #111; --safe-top: 0px; --safe-right: 0px; --safe-bottom: 0px; --safe-left: 0px; }
  html { scroll-behavior: auto; }
  body { background: #fff; color: #111; padding: 0; font-size: 11pt; }
  body::before, .hero::before, .timeline::before, .step::before, .skip-link, nav .links { display: none; }
  header { position: static; background: #fff; backdrop-filter: none; border-color: #bbb; }
  nav, .wrap { max-width: none; padding-left: 0; padding-right: 0; }
  .hero, section, .ending { padding: 8mm 0; margin: 0; overflow: visible; }
  h1 { font-size: 30pt; max-width: none; }
  .section-title, .ending h2 { font-size: 23pt; }
  .lead, .intro { font-size: 11pt; max-width: none; }
  .stats { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 8mm; }
  .stat strong, .number strong { font-size: 22pt; }
  .step { grid-template-columns: 1fr; gap: 2mm; padding-left: 0; padding-bottom: 6mm; }
  .year { padding-top: 0; }
  .year-range { display: inline; }
  .case-grid { grid-template-columns: 1fr; gap: 5mm; }
  .card, .feature, .number, .principle, .case, .section-alt, .btn { background: #fff; color: #111; box-shadow: none; border-color: #bbb; }
  .card, .principle, .feature, .number { break-inside: avoid; }
  .card { padding: 5mm; }
  .card p, .case p, .principle p, .ending p, .lead, .intro, .impact, .note, .stat span, .number span, footer { color: #333; }
  .btn.primary { background: #fff; color: #111; border-color: #777; }
  h2, h3 { break-after: avoid; }
  a[href^="mailto:"]::after { content: " (" attr(href) ")"; font-size: 9pt; }
  footer { border-color: #bbb; }
}

/* Experience and areas of work in the introductory block. */
.stats { grid-template-columns:repeat(5,minmax(0,1fr)); gap:20px; }
.stat-activity strong { font-size:28px; letter-spacing:-.035em; }
.stats .stat dd { min-height:54px; display:flex; align-items:center; }
@media screen and (max-width:1000px) {
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stats .stat:first-child { grid-column:1 / -1; }
}
@media screen and (max-width:600px) {
  .stats { grid-template-columns:minmax(0,1fr); }
  .stats .stat dd { min-height:40px; }
}
@media print {
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stats .stat:first-child { grid-column:1 / -1; }
  .stat-activity strong { font-size:18pt; }
}

.engineering-note {
  margin:24px 0 0;
  padding:18px 22px;
  border:0;
  border-left:3px solid var(--accent);
  border-radius:0 8px 8px 0;
  background:rgba(139,229,196,.06);
  color:var(--accent);
  font-size:16px;
  font-weight:600;
}
@media print {
  .engineering-note { background:transparent; color:#222; border-left-color:#555; break-inside:avoid; }
}

/* Engineering involvement in the closing block. */
.ending .closing-engineering-note {
  color:var(--accent);
  font-size:clamp(16px,2vw,20px);
  font-weight:600;
  line-height:1.6;
}
.ending .closing-engineering-note::before {
  content:"";
  display:block;
  width:40px;
  height:2px;
  margin:0 auto 18px;
  background:currentColor;
}
@media print {
  .ending .closing-engineering-note { color:#222; }
}

/* Three peer topics presented as accessible tabs. */
.approach-tabs { margin-top:32px; }
.approach-tablist {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.approach-tab {
  padding:16px 20px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel);
  color:var(--muted);
  font:inherit;
  font-size:16px;
  font-weight:600;
  line-height:1.4;
  cursor:pointer;
}
.approach-tab:hover {
  color:var(--text);
  border-color:#4b6474;
}
.approach-tab[aria-selected="true"] {
  color:var(--accent);
  border-color:var(--accent);
  background:rgba(139,229,196,.1);
}
.approach-panel { padding:24px 0 0; }
.approach-panel .intro { margin:0; }
.approach-panel .intro + .intro { margin-top:18px; }
 .approach-accordion-heading { display:none; }
@media screen and (max-width:760px) {
  .approach-tablist { display:none; }
  .approach-accordion-heading {
    display:block;
    margin:0;
    border-bottom:1px solid var(--line);
  }
  .approach-accordion-button {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    width:100%;
    padding:20px 0;
    border:0;
    background:transparent;
    color:var(--text);
    font:inherit;
    font-size:17px;
    line-height:1.4;
    text-align:left;
    cursor:pointer;
  }
  .approach-accordion-button[aria-expanded="true"] { color:var(--accent); }
  .approach-accordion-icon::before { content:"+"; }
  .approach-accordion-button[aria-expanded="true"] .approach-accordion-icon::before { content:"−"; }
  .approach-accordion-icon { color:var(--accent); font-size:24px; flex-shrink:0; }
  .approach-panel { padding:20px 0 24px; }
}
@media print {
  .approach-panel[hidden] { display:block; }
}

/* Personal motivation before the management principles. */
.approach-motivation {
  position:relative;
  margin-top:32px;
  padding:64px 36px 28px;
  border:1px solid #3b5265;
  border-radius:20px;
  background:rgba(139,229,196,.035);
}
.motivation-quote-mark {
  position:absolute;
  top:14px;
  left:32px;
  color:var(--accent);
  font-family:Georgia,serif;
  font-size:72px;
  line-height:1;
  pointer-events:none;
}
.approach-motivation blockquote {
  margin:0;
  padding:0;
  font-style:normal;
}
.approach-motivation .intro:last-child { margin-bottom:0; }
@media(max-width:600px) {
  .approach-motivation { padding:60px 22px 24px; border-radius:16px; }
  .motivation-quote-mark { left:20px; }
}
@media print {
  .approach-motivation { background:transparent; border-color:#bbb; }
}
.approach-motivation h3 {
  max-width:750px;
  margin:0 0 18px;
  font-size:clamp(22px,2.5vw,28px);
  line-height:1.25;
  letter-spacing:-.025em;
}

/* Human value of the product, alongside its scale. */
.case-purpose {
  margin-top:0;
  padding:28px;
  border:1px solid #33465d;
  border-radius:18px;
  background:var(--panel);
}
.case-purpose h3 {
  font-size:22px;
  line-height:1.3;
  letter-spacing:-.025em;
  margin:0 0 12px;
}
.case-purpose p { margin:0; }
.case-purpose p + h3 { margin-top:28px; }

@media(max-width:600px) {
  .case-purpose { padding:22px; border-radius:16px; }
}
@media print {
  .case-purpose { background:transparent; border-color:#bbb; }
}

.case-purpose .number {
  padding:0 0 18px;
  border:0;
  border-bottom:1px solid #33465d;
  border-radius:0;
  background:transparent;
  min-width:0;
}
.case-purpose .number strong { font-size:clamp(28px,3vw,38px); }
.case-purpose .note { margin:18px 0 28px; }
