:root { --navy: #071a3a; --blue: #0877d9; --sky: #27b8f4; --ink: #14233b; --pale: #f2f8fd; --line: #d6e5f3; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0px; background: rgb(255, 255, 255); color: var(--ink); font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.65; }
a { color: var(--blue); }
.wrap { width: min(1160px, 100% - 40px); margin-inline: auto; }
.site-head { position: sticky; top: 0px; z-index: 20; background: rgb(255, 255, 255); border-bottom: 1px solid rgb(230, 238, 245); box-shadow: rgba(7, 26, 58, 0.07) 0px 3px 16px; }
.nav { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; color: var(--navy); font-size: 21px; font-weight: 800; line-height: 1; text-decoration: none; }
.brand img { width: 56px; height: 56px; margin-right: 9px; object-fit: contain; }
.nav-links { display: flex; align-items: center; justify-content: flex-end; gap: 20px; flex-wrap: wrap; }
.nav-links a { color: var(--navy); font-size: 14px; font-weight: 700; text-decoration: none; }
.nav-links a:hover, .nav-links a:focus-visible { color: var(--blue); }
.hero { padding: 64px 0px 54px; color: rgb(255, 255, 255); background: linear-gradient(135deg, rgb(6, 27, 60) 0%, rgb(6, 62, 118) 58%, rgb(6, 140, 203) 100%); }
.hero h1 { max-width: 820px; margin: 0px 0px 14px; font-size: clamp(36px, 5vw, 58px); line-height: 1.06; }
.hero p { max-width: 760px; margin: 0px; color: rgb(232, 245, 255); font-size: 19px; }
section { padding: 54px 0px; }
main section:nth-child(2n+1):not(.hero) { background: var(--pale); }
h2, h3 { color: var(--navy); line-height: 1.2; }
h2 { margin: 0px 0px 18px; font-size: clamp(27px, 3vw, 36px); }
h3 { margin: 32px 0px 12px; font-size: 23px; }
p:first-child { margin-top: 0px; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 24px; }
.card { padding: 28px; background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 14px; box-shadow: rgba(7, 26, 58, 0.07) 0px 7px 22px; }
.card h2 { font-size: 27px; }
.doc-links { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 11px 20px; color: rgb(4, 26, 56); background: var(--sky); border: 2px solid var(--sky); border-radius: 8px; font-weight: 800; text-decoration: none; }
.btn:hover, .btn:focus-visible { filter: brightness(1.06); outline: rgba(8, 119, 217, 0.25) solid 3px; outline-offset: 2px; }
.list-clean { margin: 20px 0px; padding-left: 24px; }
.list-clean li { margin-bottom: 10px; }
.note { margin-top: 28px; padding: 14px 18px; background: rgb(238, 247, 255); border-left: 4px solid var(--blue); }
.site-foot { padding: 28px 0px; color: rgb(216, 234, 255); background: rgb(4, 20, 45); text-align: center; }
@media (max-width: 760px) {
  .wrap { width: min(100% - 28px, 1160px); }
  .nav { min-height: 72px; align-items: flex-start; padding: 9px 0px 12px; flex-direction: column; gap: 8px; }
  .brand img { width: 48px; height: 48px; }
  .nav-links { width: 100%; justify-content: flex-start; gap: 8px 16px; }
  .hero, section { padding: 42px 0px; }
  .grid { grid-template-columns: 1fr; }
  .card { padding: 21px; }
  .doc-links { flex-direction: column; }
  .btn { width: 100%; text-align: center; }
}