 :root{--brand:#128CBA;--brand-2:#1EC3C8;--ink:#0f172a;--ink-2:#334155;--muted:#64748b;--bg:#f6fbff;--card:#fff;--shadow:0 10px 30px rgba(16,24,40,.08);--radius:24px;--radius-sm:16px;--maxw:1200px}

        body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans","Helvetica Neue",Arial;color:var(--ink);background:var(--bg);line-height:1.6}
        a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
        .header{position:fixed;inset:0 0 auto 0;height:72px;z-index:50;background:rgba(255,255,255,.75);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid rgba(2,6,23,.06)}
        .wrap{max-width:var(--maxw);margin-inline:auto;padding:0 20px}
        .nav{display:flex;align-items:center;justify-content:space-between;height:72px}
        .brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.2px}
        .brand-mark{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:radial-gradient(120% 120% at 20% 20%,var(--brand-2),var(--brand));box-shadow:var(--shadow)}
        .brand span{font-family:Montserrat,Inter,system-ui;font-size:20px}
        .menu{display:flex;gap:20px;align-items:center}.menu a{color:var(--ink-2);font-weight:600}
        .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 18px;border-radius:999px;font-weight:700;border:0;cursor:pointer;box-shadow:var(--shadow);transition:transform .15s ease,box-shadow .15s ease}
        .btn-primary{color:#fff;background:linear-gradient(135deg,var(--brand) 0%,var(--brand-2) 100%)}.btn:hover{transform:translateY(-1px);box-shadow:0 14px 34px rgba(16,24,40,.12)}
        .only-mobile{display:none}

        /* HERO */
        .hero{position:relative;height:100vh;min-height:620px;overflow:hidden}
        .slides{position:absolute;inset:0}
        .slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease}
        .slide.active{opacity:1}
        .slide img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(105%) contrast(105%);transform:scale(1.03)}
        .slide::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 10% 10%,rgba(15,23,42,.15),rgba(15,23,42,.6)),linear-gradient(to top,rgba(2,6,23,.55),rgba(2,6,23,.10))}
        .hero-content{position:relative;z-index:2;height:100%;display:grid;place-items:center;text-align:center;padding:0 20px}
        .hero-card{max-width:980px;color:#fff}
        .kz-ornament{width:120px;height:12px;margin:0 auto 18px;background:radial-gradient(circle at 10px 6px,#fff,#fff 3px,transparent 3px) 0 0/40px 12px repeat-x,radial-gradient(circle at 30px 6px,#fff,#fff 3px,transparent 3px) 0 0/40px 12px repeat-x;opacity:.9;filter:drop-shadow(0 1px 0 rgba(255,255,255,.3))}
        .hero h1{font-family:Montserrat,Inter,system-ui;font-size:clamp(28px,5vw,54px);line-height:1.15;margin:0 0 14px;letter-spacing:.2px;text-shadow:0 6px 28px rgba(0,0,0,.35)}
        .hero p{font-size:clamp(16px,2.3vw,20px);opacity:.95;margin:0 0 26px}
        .hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
        .arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border-radius:999px;display:grid;place-items:center;background:rgba(255,255,255,.85);border:1px solid rgba(2,6,23,.06);cursor:pointer}
        .arrow.left{left:18px}.arrow.right{right:18px}
        .hero-controls{position:absolute;inset:auto 0 24px 0;display:flex;justify-content:center;gap:10px;z-index:3}
        .dot{width:10px;height:10px;border-radius:999px;background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.9);cursor:pointer}
        .dot.active{background:#fff;transform:scale(1.1)}

        /* Sections */
        section{scroll-margin-top:90px}.section{padding:80px 0}
        .headline{font-family:Montserrat,Inter,system-ui;font-weight:800;font-size:clamp(26px,4vw,36px);margin:0 0 14px}
        .sub{color:var(--muted);margin:0 0 30px;max-width:900px}
        .grid{display:grid;gap:24px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}
        .card{background:var(--card);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
        .pill{display:inline-block;padding:6px 12px;border-radius:999px;font-weight:700;font-size:12px;color:#0b3b50;background:linear-gradient(135deg,#e6f6ff,#e7fbfb);border:1px solid rgba(18,140,186,.15)}
        .icon{width:28px;height:28px;padding:10px;border-radius:16px;background:linear-gradient(135deg,rgba(18,140,186,.12),rgba(30,195,200,.10));color:var(--brand);display:inline-grid;place-items:center;margin-right:10px;border:1px solid rgba(18,140,186,.18)}
        .pair{display:flex;align-items:flex-start;gap:14px}.pair b{font-size:18px}
        .img-rounded{
          align-self: stretch;           /* на всякий случай, чтобы колонка растягивалась по высоте строки */
          border-radius: var(--radius);
          overflow: hidden;
          box-shadow:var(--shadow);
        }
        .img-rounded > img{
          width: 100%;
          height: 100%;
          object-fit: cover;             /* заполнить, сохранив пропорции, лишнее обрежется */
          display: block;
        }
        .mini{font-size:14px;color:var(--muted)}

        /* Timeline */
        .timeline{position:relative;padding:10px 0 0 0;counter-reset:step;display:grid;gap:18px}
        .timeline .step{background:var(--card);border-radius:var(--radius-sm);padding:18px 18px 18px 56px;box-shadow:var(--shadow);position:relative}
        .timeline .step::before{counter-increment:step;content:counter(step);position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 6px 16px rgba(18,140,186,.32)}

        /* Footer */
        .footer{background:#0b2440;color:#e6eef7;padding:40px 0 60px;border-top:1px solid rgba(255,255,255,.08)}
        .footer a{color:#d7f3ff}.legal{opacity:.7;font-size:13px;margin-top:16px}

        /* Reveal */
        .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
        .reveal.show{opacity:1;transform:none}

        /* Responsive */
        @media (max-width:940px){.grid-5{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-2{grid-template-columns:1fr}.only-mobile{display:inline-flex}.menu .hide-mobile{display:none}}
        @media (max-width:520px){.grid-5,.grid-3{grid-template-columns:1fr}.arrow{display:none}}