/* Start:/skzs-pautina/styles.css?179061898118055*/
   :root {
       --bg: #f3f6f8;
       --card: #ffffff;
       --ink: #15243a;
       --ink2: #263950;
       --muted: #627186;
       --line: #dce5ee;
       --line2: #e9eef4;
       --blue: #17385f;
       --blue2: #265f91;
       --gold: #d49a22;
       --gold2: #e4b64b;
       --green: #4f8b5c;
       --dark: #111927;
       --shadow: 0 18px 50px rgba(18, 42, 68, .10);
       --shadow2: 0 10px 26px rgba(18, 42, 68, .07);
       --max: 1180px;
       --r: 28px;
   }

   /*
   * {
       box-sizing: border-box
   }

   html,
   body {
       margin: 0;
       width: 100%;
       overflow-x: hidden;
       scroll-behavior: smooth
   }

   body {
       font-family: Arial, Helvetica, sans-serif;
       color: var(--ink);
       background:
           radial-gradient(circle at 84% 0%, rgba(212, 154, 34, .16), transparent 28%),
           linear-gradient(180deg, #f9fbfd 0%, #edf3f7 48%, #f9fbfd 100%);
       line-height: 1.55;
   }

   img {
       max-width: 100%;
       display: block
   }

   a {
       color: inherit;
       text-decoration: none
   }

   button,
   input,
   textarea,
   select {
       font: inherit
   }

   h1,
   h2,
   h3,
   p {
       margin-top: 0
   }*/

   h1.skzs {
       font-size: 54px;
       line-height: 1.04;
       letter-spacing: -1.2px;
       color: #12213a;
       margin-bottom: 22px;
       max-width: 820px
   }

   h2.skzs {
       font-size: 36px;
       line-height: 1.14;
       letter-spacing: -.55px;
       color: #12213a;
       margin-bottom: 12px
   }

   .skzs h3 {
       font-size: 21px;
       line-height: 1.25;
       color: #12213a;
       margin-bottom: 8px;
       font-weight: bold;
   }

   p {
       color: var(--muted)
   }

    p.skzs{
       font-size: 16px;
   }

   .container {
       max-width: var(--max);
       margin: 0 auto;
       padding: 0 24px
   }

   .section {
       padding: 64px 0
   }

   .section.tight {
       padding: 46px 0
   }

   .lead {
       font-size: 18px;
       line-height: 1.62;
       color: var(--muted);
       max-width: 830px;
       margin-bottom: 0
   }

   .badge {
       display: inline-flex;
       align-items: center;
       gap: 9px;
       padding: 8px 13px;
       border-radius: 999px;
       background: #fff7e6;
       color: #8b5f16;
       border: 1px solid #e8cf97;
       font-size: 13px;
       font-weight: 800;
       margin-bottom: 18px
   }

   .badge:before {
       content: "";
       width: 8px;
       height: 8px;
       border-radius: 50%;
       background: var(--gold);
       box-shadow: 0 0 0 4px rgba(212, 154, 34, .17);
       flex: 0 0 auto
   }

   .btns {
       display: flex;
       flex-wrap: wrap;
       gap: 12px;
       margin-top: 30px
   }

   .btn, .hero a.btn, .skzs a.btn {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       min-height: 50px;
       padding: 14px 23px;
       border-radius: 12px;
       border: 1px solid transparent;
       font-weight: 900;
       cursor: pointer;
       transition: .18s ease;
       white-space: nowrap;
       font-size: 16px;
       line-height: 1;
   }

   .btn.primary, .hero a.btn.primary {
       background: linear-gradient(180deg, var(--gold2), var(--gold));
       color: #fff;
       box-shadow: 0 14px 28px rgba(212, 154, 34, .24)
   }

   .btn.secondary, .hero a.btn.secondary, .skzs a.btn.secondary {
       background: #fff;
       color: #8b5f16;
       border-color: #dfbd68
   }

   .btn.dark {
       background: #17385f;
       color: #fff
   }

   .btn:hover {
       transform: translateY(-1px)
   }

   .section-head {
       display: flex;
       align-items: flex-end;
       justify-content: space-between;
       gap: 28px;
       margin-bottom: 30px
   }

   .pill {
       display: inline-flex;
       align-items: center;
       border: 1px solid var(--line);
       background: #fff;
       color: #52637a;
       border-radius: 999px;
       padding: 8px 13px;
       font-size: 13px;
       font-weight: 800;
       white-space: nowrap
   }

   .hero {
       padding: 36px 0 54px
   }

   .hero-wrap {
       display: grid;
       grid-template-columns: minmax(0, 1.05fr) .95fr;
       gap: 34px;
       align-items: stretch;
       background: linear-gradient(135deg, #fff 0%, #fff 55%, #f0f5f8 100%);
       border: 1px solid var(--line);
       border-radius: 34px;
       box-shadow: var(--shadow);
       overflow: hidden;
       padding: 48px
   }

   .hero-copy {
       position: relative;
       z-index: 2
   }

   .hero-visual {
       position: relative;
       min-height: 560px;
       border-radius: 28px;
       overflow: hidden;
       background: #17385f;
       box-shadow: 0 22px 48px rgba(23, 56, 95, .22);
       border: 1px solid rgba(255, 255, 255, .6)
   }

   .hero-visual img {
       width: 100%;
       height: 100%;
       min-height: 560px;
       object-fit: cover;
       object-position: center
   }

   .hero-visual:after {
       content: "";
       position: absolute;
       inset: 0;
       background: linear-gradient(180deg, rgba(16, 30, 48, 0) 40%, rgba(16, 30, 48, .86) 100%)
   }

   .hero-caption {
       position: absolute;
       z-index: 2;
       left: 26px;
       right: 26px;
       bottom: 24px;
       color: #fff
   }

   .hero-caption b {
       display: block;
       font-size: 24px;
       margin-bottom: 7px;
       color: #fff;
   }

   .hero-caption span {
       display: block;
       color: rgba(255, 255, 255, .82)
   }

   .hero-metrics {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       gap: 12px;
       margin-top: 34px;
       max-width: 720px
   }

   .metric {
       border: 1px solid var(--line2);
       background: #f8fbfd;
       border-radius: 18px;
       padding: 16px;
       min-height: 120px
   }

   .metric b {
       display: block;
       color: #12213a;
       font-size: 17px;
       margin-bottom: 5px
   }

   .metric span {
       display: block;
       color: var(--muted);
       font-size: 13px;
       line-height: 1.42
   }

   .anchorbar {
       position: sticky;
       top: 0;
       z-index: 30;
       background: rgba(248, 250, 252, .94);
       backdrop-filter: blur(10px);
       border-top: 1px solid var(--line2);
       border-bottom: 1px solid var(--line2);
       overflow-x: visible;/*auto;*/
       white-space: nowrap;
       padding: 10px 0
   }

   .anchorbar .container {
       display: flex;
       gap: 8px
   }

   .anchorbar a {
       display: inline-flex;
       padding: 9px 12px;
       border-radius: 999px;
       border: 1px solid var(--line);
       background: #fff;
       color: #4e6078;
       font-weight: 800;
       font-size: 13px;
       margin-right: 0;
   }

   .answer {
       display: grid;
       grid-template-columns: 1fr .72fr;
       gap: 26px;
       align-items: stretch
   }

   .panel {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 28px;
       box-shadow: var(--shadow);
       padding: 30px
   }

   .panel.blue {
       background: linear-gradient(135deg, #17385f, #255f91);
       color: #fff;
       border: 0
   }

   .panel.blue h2,
   .panel.blue h3 {
       color: #fff
   }

   .panel.blue p,
   .panel.blue li {
       color: rgba(255, 255, 255, .82)
   }

   .skzs-list {
       list-style: none;
       padding: 0;
       margin: 20px 0 0;
       display: grid;
       gap: 12px
   }

   .skzs-list li {
       position: relative;
       padding-left: 22px;
       color: var(--muted);
       font-size: 15px;
       line-height: 1.48
   }

   .skzs-list li:before {
       content: "";
       position: absolute;
       left: 0;
       top: .56em;
       width: 8px;
       height: 8px;
       border-radius: 50%;
       background: var(--gold)
   }

   .form-side .skzs-list li {
        color: rgba(255, 255, 255, .82);
   }

   .skzs-cards {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 16px
   }

   .skzs-card {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 22px;
       padding: 24px;
       box-shadow: var(--shadow2);
       min-height: 218px;
       position: relative;
       overflow: hidden
   }

   .skzs-card:before {
       content: "";
       position: absolute;
       left: 0;
       top: 0;
       right: 0;
       height: 4px;
       background: linear-gradient(90deg, var(--blue2), var(--green))
   }

   .skzs-card.gold:before {
       background: linear-gradient(90deg, var(--gold), var(--green))
   }

   .skzs-card p {
       font-size: 15px;
       margin-bottom: 0
   }

   .tag {
       display: inline-flex;
       padding: 6px 9px;
       border-radius: 999px;
       background: #eef5ff;
       color: #245384;
       font-size: 11px;
       font-weight: 900;
       text-transform: uppercase;
       letter-spacing: .3px;
       margin-bottom: 14px
   }

   .tag.green {
       background: #eef7f0;
       color: #2f653a
   }

   .tag.gold {
       background: #fff7e8;
       color: #8b5f16
   }

   .scheme {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 26px;
       align-items: stretch
   }

   .image-panel {
       border-radius: 28px;
       overflow: hidden;
       background: #fff;
       border: 1px solid var(--line);
       box-shadow: var(--shadow);
       position: relative;
       min-height: 500px
   }

   .image-panel img {
       width: 100%;
       height: 100%;
       min-height: 500px;
       object-fit: cover;
       object-position: center
   }

   .image-panel:after {
       content: "";
       position: absolute;
       inset: auto 0 0;
       height: 42%;
       background: linear-gradient(0deg, rgba(15, 30, 50, .80), rgba(15, 30, 50, 0))
   }

   .image-panel-caption {
       position: absolute;
       z-index: 2;
       left: 22px;
       right: 22px;
       bottom: 20px;
       color: #fff
   }

   .image-panel-caption b {
       display: block;
       font-size: 22px;
       margin-bottom: 5px
   }

   .image-panel-caption span {
       color: rgba(255, 255, 255, .82)
   }

   .feature-stack {
       display: grid;
       gap: 14px
   }

   .feature {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 20px;
       padding: 20px 22px;
       box-shadow: 0 8px 24px rgba(18, 42, 68, .055)
   }

   .feature b {
       display: block;
       color: #12213a;
       margin-bottom: 5px;
       font-size: 17px
   }

   .feature p {
       margin: 0;
       color: var(--muted);
       font-size: 15px
   }

   .spec-grid {
       display: grid;
       grid-template-columns: repeat(5, 1fr);
       gap: 14px
   }

   .spec {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 18px;
       padding: 18px;
       box-shadow: 0 8px 20px rgba(18, 42, 68, .045);
       min-height: 140px
   }

   .spec b {
       display: block;
       color: #12213a;
       margin-bottom: 6px
   }

   .spec span {
       display: block;
       color: var(--muted);
       font-size: 14px;
       line-height: 1.42
   }

   .tabs {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 28px;
       box-shadow: var(--shadow);
       padding: 24px
   }

   .tab-buttons {
       display: flex;
       gap: 8px;
       flex-wrap: wrap;
       margin-bottom: 20px
   }

   .tab-btn {
       border: 1px solid var(--line);
       background: #f8fbfd;
       color: #465a73;
       border-radius: 999px;
       padding: 9px 13px;
       font-weight: 900;
       cursor: pointer;
        line-height: 1;
        font-size: 16px;
   }

   .tab-btn.active {
       background: #17385f;
       color: #fff;
       border-color: #17385f
   }

   .tab-content {
       display: none
   }

   .tab-content.active {
       display: block
   }

   .tab-layout {
       display: grid;
       grid-template-columns: .9fr 1.1fr;
       gap: 24px;
       align-items: stretch
   }

   .tab-layout img {
       border-radius: 20px;
       width: 100%;
       height: 360px;
       object-fit: cover;
       border: 1px solid var(--line)
   }

   .process {
       display: grid;
       grid-template-columns: repeat(5, 1fr);
       gap: 12px
   }

   .step {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 20px;
       box-shadow: var(--shadow2);
       padding: 20px 18px;
       min-height: 210px;
       position: relative
   }

   .step:before {
       content: "";
       display: block;
       width: 42px;
       height: 4px;
       border-radius: 999px;
       background: linear-gradient(90deg, var(--gold), var(--green));
       margin-bottom: 16px
   }

   .step p {
       font-size: 14px;
       margin: 0
   }

   .trust-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 14px
   }

   .trust {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 18px;
       padding: 18px;
       box-shadow: 0 8px 20px rgba(18, 42, 68, .045)
   }

   .trust b {
       display: block;
       color: #12213a;
       font-size: 22px;
       margin-bottom: 3px
   }

   .trust span {
       display: block;
       color: var(--muted);
       font-size: 14px
   }

   .doc-grid {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 26px;
       align-items: stretch
   }

   .doc-image {
       border-radius: 28px;
       overflow: hidden;
       border: 1px solid var(--line);
       box-shadow: var(--shadow);
       background: #fff
   }

   .doc-image img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       min-height: 430px
   }

   .faq {
       display: grid;
       gap: 10px
   }

   .faq-item {
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 18px;
       box-shadow: 0 8px 20px rgba(18, 42, 68, .045);
       overflow: hidden
   }

   .faq-q {
       width: 100%;
       text-align: left;
       background: #fff;
       border: 0;
       padding: 18px 20px;
       display: flex;
       justify-content: space-between;
       gap: 16px;
       align-items: center;
       color: #12213a;
       font-weight: 900;
       cursor: pointer
   }

   .faq-q span:last-child {
       color: #8b5f16;
       font-size: 22px;
       line-height: 1
   }

   .faq-a {
       display: none;
       padding: 0 20px 18px;
       color: var(--muted);
       font-size: 15px
   }

   .faq-item.open .faq-a {
       display: block
   }

   .form-wrap {
       display: grid;
       grid-template-columns: .75fr 1fr;
       background: #fff;
       border: 1px solid var(--line);
       border-radius: 32px;
       box-shadow: var(--shadow);
       overflow: hidden
   }

   .form-side {
       padding: 42px;
       background: radial-gradient(circle at 22% 20%, rgba(212, 154, 34, .16), transparent 32%), linear-gradient(135deg, #17385f, #255f91);
       color: #fff
   }

   .form-side h2 {
       color: #fff
   }

   .form-side p {
       color: rgba(255, 255, 255, .82)
   }

   .form-body {
       padding: 42px
   }

   .form-grid {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 14px
   }

   .field.full {
       grid-column: 1/-1
   }

   .field label {
       display: block;
       font-size: 12px;
       font-weight: 900;
       color: #69768b;
       text-transform: uppercase;
       letter-spacing: .45px;
       margin-bottom: 7px
   }

   .field input,
   .field textarea,
   .field select {
       width: 100%;
       border: 1px solid #d7e2ee;
       border-radius: 13px;
       padding: 14px 15px;
       outline: none;
       color: var(--ink);
       background: #fff
   }

   .field textarea {
       min-height: 100px;
       resize: vertical
   }

   .form-note {
       margin-top: 12px;
       color: var(--muted);
       font-size: 13px;
       line-height: 1.45
   }

   .form-submit {
       width: 100%;
       margin-top: 16px
   }

   .meta-box {
       display: grid;
       grid-template-columns: 1fr 1fr;
       gap: 16px;
       margin-top: 22px
   }

   .meta-item {
       border: 1px solid var(--line);
       border-radius: 18px;
       background: #fff;
       padding: 18px
   }

   .meta-item b {
       display: block;
       margin-bottom: 5px;
       color: #12213a
   }

   .meta-item span {
       color: var(--muted);
       font-size: 14px
   }


   .anchorbar.sticky-bar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
    }

   @media(max-width:1120px) {

       .hero-wrap,
       .answer,
       .scheme,
       .tab-layout,
       .doc-grid,
       .form-wrap {
           grid-template-columns: 1fr
       }

       .skzs-cards {
           grid-template-columns: repeat(2, 1fr)
       }

       .spec-grid,
       .process,
       .trust-grid {
           grid-template-columns: repeat(2, 1fr)
       }

       .hero-visual,
       .hero-visual img {
           min-height: 420px
       }
   }

   @media(max-width:760px) {
       .container {
           padding: 0 18px
       }

       .section {
           padding: 46px 0
       }

       .section.tight {
           padding: 34px 0
       }

       h1 {
           font-size: 34px
       }

       h2 {
           font-size: 27px
       }

       .hero-wrap {
           padding: 24px;
           border-radius: 24px
       }

       .hero-metrics,
       .skzs-cards,
       .spec-grid,
       .process,
       .trust-grid,
       .form-grid,
       .meta-box {
           grid-template-columns: 1fr
       }

       .btns .btn {
           width: 100%
       }

       .section-head {
           display: block
       }

       .pill {
           margin-top: 12px;
           white-space: normal
       }

       .hero-visual,
       .hero-visual img,
       .image-panel,
       .image-panel img {
           min-height: 300px
       }

       .form-side,
       .form-body {
           padding: 26px
       }

       .panel {
           padding: 22px
       }

       .tab-layout img {
           height: 260px
       }
   }
/* End */
/* /skzs-pautina/styles.css?179061898118055 */