@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;
      justify-content:space-between;
      gap:20px;
    }

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

    .links {
      display:flex;
      gap:24px;
      font-size:13px;
      color:var(--muted);
    }

    .links a {
      text-decoration:none;
    }

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

    .hero {
      padding:110px var(--safe-right) 95px 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(43px,7vw,88px);
      line-height:1.08;
      letter-spacing:-.035em;
      max-width:900px;
      margin:24px 0;
    }

    h1 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;
    }

    .case {
      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:80px 0 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);
    }

    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:75px;
        padding-bottom:75px;
      }
      .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); }
@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, .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; }
}
