@font-face {
		font-family: 'Inter';
		src: url('../fonts/InterVariable.woff2') format('woff2');
		font-weight: 100 900;
		font-style: normal;
		font-display: swap;
	}
	
    :root{
      --blue:#0876df;--navy:#0b3267;--ink:#102d55;--muted:#607794;
      --line:#e7eef7;--soft:#f6faff;--green:#14b86e;--orange:#ff7448;
      --radius:22px;--shadow:0 16px 40px rgba(18,62,108,.09);
    }
    *{box-sizing:border-box} html{scroll-behavior:smooth}
    body{margin:0;font-family:'Inter',Arial,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#fff}
    a{text-decoration:none;color:inherit}.container{width:min(1280px,calc(100% - 40px));margin:auto}
    header{height:74px;display:flex;align-items:center;background:rgba(255,255,255,.96);position:sticky;top:0;z-index:50;border-bottom:1px solid #eef3f8;backdrop-filter:blur(12px)}
    nav{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%}
    .brand{display:flex;align-items:center;gap:11px;font-weight:800}.brand-mark{width:38px;height:44px;border-radius:12px 12px 18px 18px;background:linear-gradient(145deg,#0a5fc0,#11a7df);display:grid;place-items:center;color:white;font-size:21px}
	.brand-mark-logo {width:45px;height:44px;}
	.brand-mark-logo img {width:40px;}
    .brand small{display:block;color:#6c8098;font-weight:500;margin-top:2px}.menu{display:flex;gap:30px;font-size:14px;font-weight:600}.menu a:hover{color:var(--blue)}
    .nav-actions{display:flex;align-items:center;gap:10px}.langs{display:flex;background:#f1f6fb;padding:3px;border-radius:10px}.lang{border:0;background:transparent;padding:8px 10px;border-radius:8px;cursor:pointer;font-weight:700;color:#68809b}.lang.active{background:white;color:var(--blue);box-shadow:0 2px 8px #dce8f3}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 22px;border-radius:11px;border:1px solid var(--blue);font-weight:750;transition:.2s}.btn.primary{background:var(--blue);color:white}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(8,118,223,.18)}
    .hero{min-height:560px;background:linear-gradient(90deg,#f7fbff 0%,#f7fbff 43%,rgba(247,251,255,.65) 58%,rgba(240,248,255,.15)),radial-gradient(circle at 78% 42%,#d9eefb 0 14%,#edf7fc 15% 28%,#dfeef5 29% 44%,#f5f9fb 45%);overflow:hidden}
    .hero-grid{display:grid;grid-template-columns:1.02fr .98fr;min-height:560px;align-items:center;gap:30px}.hero h1{font-size:clamp(43px,5vw,68px);line-height:.96;letter-spacing:-2.5px;margin:0 0 16px;max-width:650px}.hero h1 span{display:block;color:var(--blue);font-size:.55em;letter-spacing:-1px;margin-top:15px}.lead{font-size:19px;line-height:1.55;max-width:590px;color:#314e70}
    .stats{display:flex;gap:42px;margin:32px 0}.stat strong{display:block;font-size:32px;color:#0b3267}.stat span{font-size:13px;color:#687d95}
    .hero-buttons{display:flex;gap:14px}.visual{position:relative;height:470px}.kitchen{position:absolute;inset:20px 0 0 15px;border-radius:32px;background:linear-gradient(145deg,rgba(8,118,223,.08),rgba(255,255,255,.3)),repeating-linear-gradient(90deg,#d9e6ec 0 3px,transparent 3px 115px);box-shadow:inset 0 0 100px rgba(15,61,103,.08);overflow:hidden; background-image:url("../images/cctv_camera.png"); background-size:28%; background-repeat:no-repeat;}
    .kitchen:before{content:"";position:absolute;width:330px;height:190px;left:55px;bottom:55px;border-radius:18px;background:linear-gradient(#d9e4e8 0 12%,#fafafa 12% 72%,#aabdc4 72%);box-shadow:0 20px 40px rgba(18,62,108,.14); background-image:url("../images/camera_school2.jpg"); background-size:cover;}
    .kitchen:after{content:"◉";position:absolute;right:58px;top:12px;font-size:86px;color:#29465f;transform:rotate(180deg);opacity:.82}
    .monitor-card{position:absolute;right:0;width:168px;padding:13px 15px;background:rgba(255,255,255,.95);border-radius:15px;box-shadow:var(--shadow);display:flex;gap:11px;align-items:center}.monitor-card b{display:block;font-size:16px}.monitor-card small{color:#657b93}.monitor-card em{font-size:11px;color:var(--green);font-style:normal;font-weight:700}.mi{font-size:24px}.m1{top:115px}.m2{top:196px}.m3{top:277px}.m4{top:358px}
    section{padding:68px 0}.section-title{font-size:36px;letter-spacing:-1.2px;margin:0 0 8px}.section-sub{font-size:17px;color:var(--muted);margin:0 0 30px}
    .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{padding:24px;border:1px solid #edf2f7;border-radius:18px;box-shadow:var(--shadow);background:white;min-height:185px}.icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#eaf5ff;font-size:25px;margin-bottom:18px}.card:nth-child(2) .icon{background:#fff0eb}.card:nth-child(3) .icon{background:#eaf5ff}.card:nth-child(4) .icon{background:#e7fbf3}
	.icon img {width:64px;}
	.card h3{font-size:18px;margin:0 0 8px}.card p{margin:0;color:#698099;line-height:1.45;font-size:14px}
    .geo{background:linear-gradient(180deg,#fff,#f8fbff)}.geo-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}.geo-stats{display:flex;gap:40px;margin:34px 0}
	.geo .region {position:absolute;left: 30%;top: 15%;color: #905d2f}
	/*.map{height:330px;position:relative;background:linear-gradient(145deg,#d7edff,#8fc8fb);clip-path:polygon(17% 15%,40% 5%,59% 16%,83% 11%,95% 36%,87% 54%,98% 76%,76% 92%,52% 85%,35% 98%,22% 77%,6% 64%,12% 42%,3% 28%);filter:drop-shadow(0 15px 25px rgba(8,118,223,.12))}
	*/

.map {
     
    aspect-ratio: 1.28 / 1;
	width:450px;
	height:500px;
	 position:relative;
    background: linear-gradient(
        135deg,
        #8fd0ff 0%,
        #55aff4 55%,
        #1688e5 100%
    );
	background:linear-gradient(135deg, #fceccc 0%, #e5be8d 55%, #ba6b05 100% );
	

clip-path: polygon(29% 93%, 28% 84%, 22% 83%, 19% 76%, 12% 72%, 12% 65%, 14% 64%, 8% 53%, 8% 51%, 6% 51%, 6% 51%, 5% 49%, 2% 40%, 9% 41%, 9% 41%, 14% 41%, 14% 41%, 12% 37%, 6% 35%, 0% 28%, 7% 23%, 16% 24%, 23% 21%, 28% 25%, 30% 31%, 30% 31%, 27% 35%, 27% 41%, 32% 28%, 41% 29%, 42% 22%, 36% 24%, 30% 19%, 21% 17%, 15% 13%, 18% 8%, 23% 5%, 30% 6%, 38% 5%, 47% 5%, 55% 4%, 63% 0%, 74% 1%, 87% 5%, 92% 13%, 97% 26%, 86% 29%, 97% 98%, 90% 98%, 81% 89%, 71% 88%, 61% 89%, 46% 95%, 27% 100%);
-webkit-clip-path: polygon(29% 93%, 28% 84%, 22% 83%, 19% 76%, 12% 72%, 12% 65%, 14% 64%, 8% 53%, 8% 51%, 6% 51%, 6% 51%, 5% 49%, 2% 40%, 9% 41%, 9% 41%, 14% 41%, 14% 41%, 12% 37%, 6% 35%, 0% 28%, 7% 23%, 16% 24%, 23% 21%, 28% 25%, 30% 31%, 30% 31%, 27% 35%, 27% 41%, 32% 28%, 41% 29%, 42% 22%, 36% 24%, 30% 19%, 21% 17%, 15% 13%, 18% 8%, 23% 5%, 30% 6%, 38% 5%, 47% 5%, 55% 4%, 63% 0%, 74% 1%, 87% 5%, 92% 13%, 97% 26%, 86% 29%, 97% 98%, 90% 98%, 81% 89%, 71% 88%, 61% 89%, 46% 95%, 27% 100%);


}
	
 
	.pin-dc{position:absolute;z-index:2;background:var(--orange);padding:36px;border-radius:100%;box-shadow:0 8px 22px rgba(10,64,110,.12);font-size:12px;font-weight:700;border: 16px solid #feaa90;}
	.pin{position:absolute;z-index:2;background:white;padding:8px 11px;border-radius:10px;box-shadow:0 8px 22px rgba(10,64,110,.12);font-size:12px;font-weight:700}.pin i{display:inline-block;width:8px;height:8px;background:var(--green);border-radius:50%;margin-right:5px}
	.p1{left:9%;top:62%}
	.p2{right:28%;top:28%}
	.p3{left:30%;bottom:11%}
	.p4{left:4%;top:43%}
	.p5{left:14%;bottom:18%}
	.p6{left:34%;top:50%}
	.p7{left:18%;bottom:25%}
	.pdc{left:3%;top:55%}
 
	
	
	
    .cta{padding:0 0 58px}.cta-box{min-height:180px;border-radius:24px;padding:40px 48px;display:flex;align-items:center;justify-content:space-between;gap:30px;color:white;background:linear-gradient(100deg,#064582,#0876c9 58%,#0b3267)}.cta-box h2{font-size:29px;margin:0 0 9px}.cta-box p{margin:0;color:#dcecff;max-width:620px}.cta .btn{background:white;color:#0b5fac;border-color:white;white-space:nowrap}
    footer{border-top:1px solid #edf2f7;padding:28px 0}.foot{display:flex;align-items:center;justify-content:space-between;gap:30px}.copyright{text-align:right;font-size:12px;color:#71869d}
	.partner {text-align: center;}
	.partner h3 {text-transform: uppercase;font-size:0.95rem;font-weight: 700;}
	.partner img {width:75px}
    @media(max-width:900px){.menu{display:none}.hero-grid,.geo-grid{grid-template-columns:1fr}.hero{padding-top:25px}.hero-grid{min-height:auto}.visual{height:390px}.cards{grid-template-columns:1fr 1fr}.geo-grid{gap:25px}.map{}.cta-box{align-items:flex-start;flex-direction:column}.stats,.geo-stats{flex-wrap:wrap}.hero h1{font-size:52px}}
    @media(max-width:560px){.container{width:min(100% - 28px,1180px)}header{height:66px}.brand small{display:none}.nav-actions>.btn{display:none}.hero h1{font-size:42px}.lead{font-size:16px}.stats{gap:20px}.stat{min-width:65px}.stat strong{font-size:27px}.visual{height:340px;margin-top:-5px}.kitchen{inset:10px 0}.monitor-card{width:145px;padding:10px}.m1{top:55px}.m2{top:123px}.m3{top:191px}.m4{top:259px}.cards{grid-template-columns:1fr}.section-title{font-size:30px}section{padding:48px 0}.geo-stats{gap:24px}.cta-box{padding:30px 25px}.foot{align-items:flex-start;flex-direction:column}.copyright{text-align:left}}
	
/* =========================================================
   MOBILE / TABLET LANDING
   ========================================================= */
.menu-toggle,
.mobile-menu-extra {
  display: none;
}

.punkt-stats {
  padding: 30px;
}

.punkt-stats table {
  width: 100%;
  border-collapse: collapse;
}

.punkt-stats table td {
  padding: 4px 25px 3px 20px;
  border-top: 1px solid #ccc;
  white-space: nowrap;
}

.table-scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 900px) {
  header {
    height: 68px;
  }

  nav {
    position: relative;
    gap: 12px;
  }

  .brand {
    min-width: 0;
  }

  .brand > span:last-child {
    min-width: 0;
  }

  .brand-mark-logo {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
  }

  .brand-mark-logo img {
    width: 36px;
  }

  .menu-toggle {
    display: flex;
    width: 42px;
    height: 42px;
    margin-left: auto;
    border: 0;
    border-radius: 10px;
    background: #f1f6fb;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
  }

  .menu-toggle span {
    width: 19px;
    height: 2px;
    border-radius: 2px;
    background: var(--navy);
    transition: .2s;
  }

  .menu-toggle.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .menu-toggle.open span:nth-child(2) {
    opacity: 0;
  }

  .menu-toggle.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .menu {
    display: none;
    position: absolute;
    top: 57px;
    left: 0;
    right: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255,255,255,.98);
    box-shadow: var(--shadow);
    flex-direction: column;
    gap: 2px;
  }

  .menu.open {
    display: flex;
  }

  .menu a {
    padding: 12px 10px;
    border-radius: 9px;
  }

  .menu a:hover {
    background: var(--soft);
  }

  .mobile-menu-extra {
    display: none;
  }

  .nav-actions {
    margin-left: 0;
  }

  .desktop-langs {
    display: flex;
  }

  .nav-actions > .btn {
    display: none;
  }

  .hero {
    min-height: auto;
    padding: 38px 0 18px;
  }

  .hero-grid {
    grid-template-columns: 1fr;
    min-height: auto;
    gap: 16px;
  }

  .hero h1 {
    max-width: 720px;
    font-size: clamp(42px, 8vw, 58px);
    line-height: 1;
  }

  .lead {
    max-width: 680px;
  }

  .hero-buttons {
    flex-wrap: wrap;
  }

  .visual {
    width: min(100%, 620px);
    height: 390px;
    margin: 0 auto;
  }

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

  .geo-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .geo-grid > div:last-child {
    width: min(100%, 520px);
    margin: 0 auto;
  }

  .map {
    width: min(100%, 450px);
    height: auto;
    aspect-ratio: .9 / 1;
    margin: 0 auto;
  }

  .pin {
    font-size: 11px;
    padding: 7px 9px;
  }

  .geo .region {
    left: 32%;
    top: 14%;
    font-size: 12px;
  }

  .punkt-stats {
    padding: 10px 0 0;
  }

  .cta-box {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 560px) {
  .container {
    width: calc(100% - 28px);
  }

  header {
    height: 64px;
  }

  .brand {
    gap: 7px;
    font-size: 13px;
  }

  .brand small {
    display: none;
  }

  .brand-mark-logo {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
  }

  .brand-mark-logo img {
    width: 32px;
  }

  .desktop-langs {
    display: none;
  }

  .menu-toggle {
    order: 3;
    width: 40px;
    height: 40px;
  }

  .menu {
    top: 53px;
  }

  .menu.open .mobile-menu-extra {
    display: flex;
  }

  .mobile-menu-extra {
    flex-direction: column;
    gap: 10px;
    margin-top: 7px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
  }

  .mobile-menu-extra .langs {
    align-self: flex-start;
  }

  .mobile-menu-extra .btn {
    width: 100%;
  }

  .hero {
    padding-top: 28px;
  }

  .hero h1 {
    font-size: clamp(36px, 11vw, 46px);
    letter-spacing: -1.7px;
  }

  .hero h1 span {
    margin-top: 11px;
    line-height: 1.1;
  }

  .lead {
    font-size: 16px;
  }

  .stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 12px;
    margin: 24px 0;
  }

  .stat {
    min-width: 0;
  }

  .hero-buttons {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hero-buttons .btn {
    width: 100%;
  }

  .visual {
    height: 315px;
    margin-top: 8px;
  }

  .kitchen {
    inset: 6px 0 0;
    border-radius: 22px;
    background-size: 24%;
  }

  .kitchen:before {
    width: 68%;
    height: 45%;
    left: 7%;
    bottom: 10%;
  }

  .kitchen:after {
    right: 8%;
    top: 2%;
    font-size: 58px;
  }

  .monitor-card {
    right: 3px;
    width: 140px;
    padding: 8px 10px;
    gap: 7px;
  }

  .monitor-card b {
    font-size: 14px;
  }

  .monitor-card small,
  .monitor-card em {
    font-size: 9px;
  }

  .mi {
    font-size: 19px;
  }

  .m1 { top: 38px; }
  .m2 { top: 98px; }
  .m3 { top: 158px; }
  .m4 { top: 218px; }

  section {
    padding: 44px 0;
  }

  .section-title {
    font-size: 29px;
    line-height: 1.08;
  }

  .section-sub {
    font-size: 15px;
    margin-bottom: 22px;
  }

  .cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .card {
    min-height: 0;
    padding: 20px;
  }

  .geo-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px 12px;
    margin: 24px 0;
  }

  .punkt-stats table {
    min-width: 470px;
    font-size: 12px;
  }

  .punkt-stats table td {
    padding: 7px 12px;
  }

  .geo-grid > div:last-child {
    transform: scale(.92);
    transform-origin: top center;
    margin-bottom: -28px;
  }

  .map {
    width: 100%;
    max-width: 390px;
  }

  .pin {
    font-size: 9px;
    padding: 5px 7px;
    border-radius: 7px;
  }

  .pin i {
    width: 6px;
    height: 6px;
  }

  .cta {
    padding-bottom: 38px;
  }

  .cta-box {
    min-height: 0;
    padding: 28px 22px;
    border-radius: 18px;
  }

  .cta-box h2 {
    font-size: 25px;
    line-height: 1.1;
  }

  .cta-box .btn {
    width: 100%;
  }

  .partner {
    padding: 6px 0;
  }

  .partner img {
    width: 64px;
  }

  .partner .section-sub {
    margin-bottom: 0;
  }

  footer {
    padding: 24px 0;
  }

  .foot {
    align-items: flex-start;
    flex-direction: column;
    gap: 18px;
  }

  .copyright {
    text-align: left;
    line-height: 1.5;
  }
}

@media (max-width: 380px) {
  .hero h1 {
    font-size: 34px;
  }

  .visual {
    height: 290px;
  }

  .monitor-card {
    width: 128px;
  }

  .m1 { top: 31px; }
  .m2 { top: 87px; }
  .m3 { top: 143px; }
  .m4 { top: 199px; }

  .geo-grid > div:last-child {
    transform: scale(.84);
    margin-bottom: -58px;
  }
}