/* Лендинг «Карта ризиків» у стилі сайту SK Security (sksecurity.ua): графіт, білий, золото; великі заголовки капсом,
   коротка золота риска під заголовком, пігулки-кнопки, номери «#1». Шрифт сайту — Cera Pro; тут найближчий відкритий — Jost. */
:root { --g:#23282C; --g2:#212528; --g3:#2F3438; --gold:#F5AA2A; --goldD:#C9871A; --ink:#212528; --mut:#6B7075; --line:#DBDBDB;
  --bg:#F6F6F6; --bg2:#E5E5E4; --card:#fff; --ok:#3F8F4E; --red:#C0392B; --r:4px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:#fff; }
body { margin:0; font:16px/1.65 Jost, 'Cera Pro', -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--ink); background:#fff; }
a { color:var(--g); }
.wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
h1, h2, h3 { font-weight:600; }
.btn { display:inline-block; white-space:nowrap; padding:11px 26px; border-radius:999px; background:var(--g); color:#fff; text-decoration:none;
  border:1.5px solid var(--g); cursor:pointer; font:inherit; font-size:14px; font-weight:500; text-transform:uppercase; letter-spacing:.06em; transition:background .15s, color .15s, box-shadow .15s; }
.btn:hover { background:#000; border-color:#000; box-shadow:0 8px 20px rgba(0,0,0,.18); }
.btn.ghost { background:transparent; color:var(--g); border-color:var(--g); }
.btn.ghost:hover { background:var(--g); color:#fff; }
.btn.big { padding:14px 32px; font-size:15px; }
.dark .btn, .hero .btn { background:#fff; color:var(--g); border-color:#fff; }
.dark .btn:hover, .hero .btn:hover { background:var(--gold); border-color:var(--gold); color:var(--g); }
.dark .btn.ghost, .hero .btn.ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,.6); }
.dark .btn.ghost:hover, .hero .btn.ghost:hover { background:#fff; color:var(--g); }

/* навігація */
.nav { position:sticky; top:0; z-index:10; background:rgba(33,37,40,.96); backdrop-filter:blur(8px); border-bottom:1px solid rgba(255,255,255,.08); }
.nav-in { display:flex; align-items:center; justify-content:space-between; gap:16px; height:72px; }
.brand { display:flex; align-items:center; gap:14px; text-decoration:none; color:#fff; white-space:nowrap; }
.logo-img { height:46px; width:auto; display:block; }
.brand-t { font-size:14px; letter-spacing:.14em; text-transform:uppercase; padding-left:14px; border-left:1px solid var(--gold); }
.links { display:flex; } .links a { text-decoration:none; color:#E5E5E4; font-size:14px; padding:0 14px; border-left:1px solid rgba(255,255,255,.25); }
.links a:first-child { border-left:0; } .links a:hover { color:var(--gold); }
.nav-cta { display:flex; gap:10px; } .nav .btn { padding:9px 20px; font-size:13px; background:var(--gold); border-color:var(--gold); color:var(--g); }
.nav .btn:hover { background:#fff; border-color:#fff; } .nav .btn.ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,.5); } .nav .btn.ghost:hover { background:#fff; color:var(--g); }

/* hero — темний, з діагональною фактурою як на sksecurity.ua */
.hero { color:#fff; padding:84px 0 76px;
  background:repeating-linear-gradient(115deg, rgba(255,255,255,.025) 0 2px, transparent 2px 22px), radial-gradient(900px 500px at 80% 20%, #3A3F44 0%, transparent 70%), var(--g); }
.hero-in { display:grid; grid-template-columns:1fr 1.05fr; gap:52px; align-items:center; }
.eyebrow { display:inline-block; color:var(--gold); font-size:13px; letter-spacing:.18em; text-transform:uppercase; margin-bottom:18px; }
h1 { font-size:48px; line-height:1.08; margin:0 0 22px; text-transform:uppercase; letter-spacing:.01em; color:#fff; }
h1::after { content:''; display:block; width:64px; height:3px; background:var(--gold); margin-top:24px; }
.hl { color:var(--gold); }
.lead { font-size:18px; color:#C7C7C7; margin:0 0 30px; font-weight:300; }
.hero-cta { display:flex; gap:12px; flex-wrap:wrap; }
.proof { list-style:none; padding:0; margin:40px 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.proof li { display:flex; flex-direction:column; } .proof b { font-size:30px; font-weight:500; color:#fff; line-height:1.1; }
.proof b::after { content:''; display:block; width:56px; height:2px; background:var(--gold); margin:12px 0 10px; }
.proof span { font-size:13.5px; color:#C7C7C7; line-height:1.4; }
.shot { margin:0; } .shot img { display:block; width:100%; height:auto; border-radius:6px; box-shadow:0 30px 70px rgba(0,0,0,.45); border:1px solid rgba(255,255,255,.12); }
.shot figcaption { margin-top:10px; font-size:12.5px; color:#9A9EA2; letter-spacing:.08em; text-transform:uppercase; text-align:right; }

/* блоки */
.band { background:var(--bg2); } .band-in { padding:34px 24px; font-size:20px; text-align:center; font-weight:300; color:var(--g); }
.band b { font-weight:600; } .band i { font-style:normal; color:var(--goldD); font-weight:500; }
.sec { padding:88px 0; } .sec.alt { background:var(--bg); }
h2 { font-size:38px; line-height:1.12; margin:0 0 18px; color:var(--g); text-transform:uppercase; letter-spacing:.01em; }
h2::after { content:''; display:block; width:64px; height:3px; background:var(--gold); margin-top:20px; }
.sub { color:var(--mut); font-size:17px; max-width:780px; margin:0 0 40px; }
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.f { background:var(--card); border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:30px 28px 32px; transition:background .15s; }
.f:hover { background:var(--bg); }
.num { font-size:64px; line-height:1; font-weight:700; color:var(--bg2); letter-spacing:-.02em; }
.f h3 { margin:14px 0 8px; font-size:18px; color:var(--g); text-transform:uppercase; letter-spacing:.03em; } .f p { margin:0; color:var(--mut); font-size:15px; }
.two { display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:start; }
.ticks { list-style:none; padding:0; margin:18px 0; } .ticks li { padding-left:30px; position:relative; margin:10px 0; color:#3A3F44; }
.ticks li::before { content:''; position:absolute; left:0; top:13px; width:18px; height:2px; background:var(--gold); }
.doc { background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:24px; box-shadow:0 20px 44px rgba(0,0,0,.10); font-family:'Times New Roman', Georgia, serif; border-top:4px solid var(--g); }
.doc-h { font:700 16px Calibri, Arial, sans-serif; text-align:center; } .doc-s { text-align:center; color:var(--mut); margin:4px 0 12px; font-size:14px; }
.doc table { width:100%; border-collapse:collapse; font-size:14px; } .doc td { border:1px solid #444; padding:4px 8px; }
.doc .l1 { background:#e2efda; } .doc .l2 { background:#fff2cc; } .doc .l3 { background:#fbe0cf; }
.doc-v { margin-top:12px; border:1px solid #bbb; background:#f7f7f7; padding:8px 10px; font-size:14px; font-weight:700; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:24px; }
.st span { display:block; font-size:64px; line-height:1; font-weight:700; color:var(--bg2); }
.st h3 { margin:12px 0 8px; color:var(--g); text-transform:uppercase; letter-spacing:.04em; font-size:19px; } .st p { margin:0; color:var(--mut); font-size:15px; }
.plans { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch; }
.p { background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:30px 28px; display:flex; flex-direction:column; position:relative; }
.p.hot { background:var(--g); border-color:var(--g); color:#fff; } .p.hot h3, .p.hot li { color:#fff; } .p.hot .pp { color:var(--gold); }
.p.hot .btn { background:var(--gold); border-color:var(--gold); color:var(--g); } .p.hot .btn:hover { background:#fff; border-color:#fff; }
.p .tag { position:absolute; top:-13px; left:28px; background:var(--gold); color:var(--g); font-size:12px; font-weight:600; padding:3px 12px; border-radius:999px; text-transform:uppercase; letter-spacing:.06em; }
.p h3 { margin:0; font-size:24px; color:var(--g); text-transform:uppercase; letter-spacing:.03em; } .pp { color:var(--mut); margin:4px 0 16px; font-weight:500; }
.p ul { padding-left:18px; margin:0 0 22px; flex:1; } .p li { margin:7px 0; font-size:15px; color:#3A3F44; }
.note { background:var(--g); color:#C7C7C7; border-radius:var(--r); padding:30px; } .note h3 { margin-top:0; color:#fff; text-transform:uppercase; letter-spacing:.04em; }
.note h3::after { content:''; display:block; width:48px; height:2px; background:var(--gold); margin-top:12px; } .note p { margin:0; font-size:15px; }

/* форма */
.demo-sec { background:repeating-linear-gradient(115deg, rgba(255,255,255,.025) 0 2px, transparent 2px 22px), var(--g); color:#C7C7C7; }
.demo-sec h2 { color:#fff; }
.form { background:#fff; border-radius:var(--r); padding:30px; box-shadow:0 24px 60px rgba(0,0,0,.35); color:var(--ink); }
.form label { display:block; font-weight:500; font-size:13px; color:#3A3F44; margin-bottom:14px; text-transform:uppercase; letter-spacing:.05em; }
.form input, .form select, .form textarea { display:block; width:100%; margin-top:6px; padding:11px 12px; border:1px solid #C7C7C7; border-radius:var(--r); font:inherit; font-size:15px; text-transform:none; letter-spacing:0; background:#fff; color:var(--ink); }
.form input:focus, .form select:focus, .form textarea:focus { outline:2px solid rgba(245,170,42,.45); border-color:var(--gold); }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.chk { display:flex !important; gap:10px; align-items:flex-start; text-transform:none !important; letter-spacing:0 !important; font-size:14px !important; } .chk input { width:auto; margin-top:5px; }
.form .btn { background:var(--g); color:#fff; border-color:var(--g); } .form .btn:hover { background:#000; }
.hp { position:absolute; left:-9999px; }
.msg { margin-top:12px; font-weight:500; } .msg.ok { color:var(--ok); } .msg.err { color:var(--red); }
.login-box { margin-top:30px; border:1px solid rgba(255,255,255,.18); border-radius:var(--r); padding:26px; } .login-box h3 { margin:0 0 8px; color:#fff; text-transform:uppercase; letter-spacing:.04em; font-size:18px; }
.login-box p { margin:0 0 16px; } .login-box .btn { background:#fff; color:var(--g); border-color:#fff; }

/* футер як на sksecurity.ua */
.foot { background:var(--g2); color:#C7C7C7; padding:46px 0 26px; font-size:14px; }
.foot a { color:#fff; text-decoration:none; } .foot a:hover { color:var(--gold); }
.foot-in { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:24px; align-items:start; }
.foot-brand { display:flex; gap:18px; align-items:center; color:#fff; letter-spacing:.1em; font-size:13px; } .foot-brand img { height:64px; } .foot-brand span { color:#9A9EA2; letter-spacing:0; }
.foot-addr { color:#fff; font-size:13px; letter-spacing:.06em; } .foot-contacts { text-align:right; font-size:13px; letter-spacing:.04em; line-height:1.9; }
.foot .small { grid-column:1 / -1; border-top:1px solid rgba(255,255,255,.1); padding-top:20px; margin-top:10px; font-size:12px; color:#7E8286; text-align:center; }

@media (max-width: 1120px) { .links { display:none; } }
@media (max-width: 980px) {
  .hero-in, .two { grid-template-columns:1fr; } h1 { font-size:38px; } .grid3, .plans, .steps { grid-template-columns:1fr 1fr; } .foot-in { grid-template-columns:1fr 1fr; } .foot-contacts { text-align:left; }
}
@media (max-width: 640px) {
  .grid3, .plans, .steps, .row2, .proof, .foot-in { grid-template-columns:1fr; } h1 { font-size:31px; } h2 { font-size:28px; } .nav-cta .ghost { display:none; }
  .brand-t { display:none; } .sec { padding:60px 0; } .hero { padding:56px 0; }
}

/* стрічка подій */
.feed-head { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; }
.feed-meta { display:flex; gap:12px; align-items:center; color:var(--mut); font-size:13px; margin-bottom:16px; }
.live { display:inline-flex; align-items:center; gap:6px; font-weight:600; color:var(--red); text-transform:uppercase; letter-spacing:.08em; font-size:12px; }
.live i { width:9px; height:9px; border-radius:50%; background:var(--red); animation:pulse 1.6s infinite; }
@keyframes pulse { 0% { box-shadow:0 0 0 0 rgba(192,57,43,.6); } 70% { box-shadow:0 0 0 9px rgba(192,57,43,0); } 100% { box-shadow:0 0 0 0 rgba(192,57,43,0); } }
.chips { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.chip { border:1px solid var(--g); background:#fff; border-radius:999px; padding:6px 16px; font:inherit; font-size:13px; font-weight:500; color:var(--g); cursor:pointer; text-transform:uppercase; letter-spacing:.05em; }
.chip.on { background:var(--g); color:#fff; }
.feed { border:1px solid var(--line); border-radius:var(--r); background:#fff; max-height:540px; overflow-y:auto; }
.fi { display:grid; grid-template-columns:92px 1fr; gap:14px; padding:14px 18px; border-top:1px solid var(--line); }
.fi:first-child { border-top:0; } .fi-date { color:var(--mut); font-size:13px; font-weight:500; }
.fi-type { display:inline-block; font-size:11.5px; font-weight:600; padding:2px 9px; border-radius:999px; margin-right:6px; text-transform:uppercase; letter-spacing:.04em; }
.c-military { background:#F6DCD8; color:#9E2B1F; } .c-crime { background:#E8E4EF; color:#4F3F75; } .c-registry { background:#FCEBCB; color:#8A5A00; } .c-civil { background:#ECECEC; color:#4A4F54; }
.fi-place { color:var(--g); font-weight:600; font-size:14px; } .fi-title { font-size:15px; color:#2F3438; margin-top:2px; } .fi-title a { color:inherit; text-decoration:none; } .fi-title a:hover { text-decoration:underline; }
.fi-src { font-size:12px; color:var(--mut); }
.feed-empty { padding:24px; color:var(--mut); text-align:center; }
.feed-foot { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-top:14px; } .small-note { font-size:12.5px; color:var(--mut); }
/* зразок дайджесту */
.sample-card { display:block; text-decoration:none; color:#C7C7C7; background:var(--g); border-radius:var(--r); padding:32px; box-shadow:0 20px 44px rgba(0,0,0,.18); transition:transform .15s; }
.sample-card:hover { transform:translateY(-3px); }
.sample-top { font-size:22px; font-weight:600; color:#fff; text-transform:uppercase; letter-spacing:.03em; }
.sample-top::after { content:''; display:block; width:48px; height:2px; background:var(--gold); margin-top:12px; }
.sample-no { color:#9A9EA2; font-weight:500; margin:12px 0 14px; }
.sample-card ul { margin:0 0 18px; padding-left:18px; } .sample-card li { margin:6px 0; } .sample-cta { color:var(--gold); font-weight:500; text-transform:uppercase; letter-spacing:.06em; font-size:13.5px; }
@media (max-width: 640px) { .fi { grid-template-columns:1fr; gap:2px; } }

/* джерела даних */
.src-wrap { overflow-x:auto; margin:18px 0 26px; border:1px solid var(--line); border-radius:var(--r); background:var(--card); }
.src-table { width:100%; border-collapse:collapse; font-size:14px; min-width:760px; }
.src-table th { text-align:left; background:var(--g); color:#fff; font-weight:500; padding:12px 14px; text-transform:uppercase; letter-spacing:.05em; font-size:12.5px; }
.src-table td { padding:12px 14px; border-top:1px solid var(--line); vertical-align:top; color:#3A3F44; }
.src-table td:first-child { width:26%; } .src-table td:nth-child(4) { white-space:nowrap; }
.src-no { background:var(--card); border:1px solid var(--line); border-left:3px solid var(--gold); border-radius:var(--r); padding:22px 26px; }
.src-no h3 { margin:0 0 8px; color:var(--g); text-transform:uppercase; letter-spacing:.04em; font-size:17px; } .src-no ul { margin:6px 0 12px; padding-left:20px; color:#3A3F44; } .src-no li { margin:4px 0; }