:root {
  --dark-bg:#080c1a; --light-bg:#f0f4ff; --surface:#ffffff; --surface-2:#f8faff;
  --border:#e0e7ff; --border-2:#c7d2fe;
  --accent:#4f46e5; --accent-d:#3730a3; --accent-2:#818cf8;
  --green:#10b981; --orange:#f59e0b; --red:#ef4444;
  --text:#0f172a; --text-2:#475569; --muted:#94a3b8;
  --max:1140px; --r:12px; --r-lg:20px; --r-xl:28px; --r-sm:8px;
  --shadow-sm:0 1px 3px rgba(15,23,42,.06);
  --shadow:0 4px 16px rgba(15,23,42,.08);
  --shadow-lg:0 12px 40px rgba(15,23,42,.1);
  --t-fast:150ms cubic-bezier(.4,0,.2,1);
  --t-base:280ms cubic-bezier(.4,0,.2,1);
  --t-slow:480ms cubic-bezier(.4,0,.2,1);
  --t-spring:500ms cubic-bezier(.34,1.56,.64,1);
}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{background:var(--dark-bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none;transition:color var(--t-fast)}
a:hover{color:var(--accent-d);text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.wrap-wide{max-width:var(--max);margin:0 auto;padding:0 24px}
/* ── HEADER ── */
header.site{position:sticky;top:0;z-index:200;background:rgba(8,12,26,.92);backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid rgba(255,255,255,.07);transition:background var(--t-base),border-color var(--t-base)}
.topbar{max-width:var(--max);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 24px;position:relative}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px;color:#fff;text-decoration:none;flex-shrink:0;transition:opacity var(--t-fast)}
.brand:hover{opacity:.85;text-decoration:none}
.brand .mono{font-family:"Roboto Mono",monospace;font-weight:600;color:var(--accent-2)}
.brand svg{transition:transform var(--t-spring)}
.brand:hover svg{transform:rotate(20deg) scale(1.1)}
nav.menu{display:flex;flex-wrap:wrap;gap:2px;align-items:center}
nav.menu a{display:inline-flex;align-items:center;padding:7px 14px;border-radius:8px;color:rgba(255,255,255,.7);font-size:14px;font-weight:500;white-space:nowrap;transition:background var(--t-fast),color var(--t-fast)}
nav.menu a:hover{background:rgba(255,255,255,.08);color:#fff}
nav.menu a.active{background:rgba(99,102,241,.2);color:var(--accent-2)}
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-sm);cursor:pointer;padding:0 11px;flex-shrink:0;transition:background var(--t-fast)}
.burger:hover{background:rgba(255,255,255,.14)}
.burger span{display:block;height:2px;background:#fff;border-radius:2px;transition:transform var(--t-base),opacity var(--t-base);transform-origin:center}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none;overflow:hidden;max-height:0;border-top:1px solid transparent;background:rgba(8,12,26,.97);transition:max-height var(--t-slow),border-color var(--t-base)}
.mobile-nav.open{max-height:600px;border-color:rgba(255,255,255,.08)}
.mobile-nav-list{list-style:none;padding:8px 0 4px}
.mobile-nav-list li{border-bottom:1px solid rgba(255,255,255,.06)}
.mobile-nav-list li:last-child{border-bottom:none}
.mobile-nav-list a{display:block;padding:14px 24px;color:rgba(255,255,255,.8);font-size:15px;font-weight:500;text-decoration:none;transition:background var(--t-fast),color var(--t-fast),padding-left var(--t-base)}
.mobile-nav-list a:hover{background:rgba(255,255,255,.06);color:#fff;padding-left:30px}
.mobile-nav-list a.active{color:var(--accent-2);background:rgba(99,102,241,.12);font-weight:700}
/* ── DARK HERO ── */
.page-hero-dark{background:var(--dark-bg);background-image:radial-gradient(ellipse 90% 70% at 50% -5%,rgba(79,70,229,.4) 0%,transparent 60%),radial-gradient(ellipse 55% 45% at 85% 60%,rgba(99,102,241,.15) 0%,transparent 55%),radial-gradient(ellipse 45% 55% at 5% 80%,rgba(79,70,229,.12) 0%,transparent 50%);position:relative;overflow:visible}
.page-hero-inner{max-width:var(--max);margin:0 auto;padding:0 24px 100px}
.page-hero-wave{position:relative;line-height:0;margin-bottom:-1px}
.page-hero-wave svg{width:100%;height:90px;display:block}
/* ── LIGHT BODY ── */
main{background:var(--light-bg);min-height:200px}
main .wrap{padding-top:0;padding-bottom:72px}
/* ── REVEAL ── */
.reveal{opacity:0;transform:translateY(18px);transition:opacity var(--t-slow),transform var(--t-slow)}
.reveal.visible{opacity:1;transform:translateY(0)}
/* ── ANCHOR NAV (audit) ── */
.anchor-nav{position:sticky;top:57px;z-index:100;background:rgba(8,12,26,.95);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.07);will-change:transform;transform:translateZ(0);flex-shrink:0}
.anchor-nav-inner{max-width:var(--max);margin:0 auto;display:flex;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding:0 24px}
.anchor-nav-inner::-webkit-scrollbar{display:none}
.anchor-nav a{display:inline-flex;align-items:center;padding:11px 14px;color:rgba(255,255,255,.5);font-size:13px;font-weight:500;border-bottom:2px solid transparent;white-space:nowrap;transition:color var(--t-fast),border-color var(--t-fast)}
.anchor-nav a:hover{color:rgba(255,255,255,.9);border-bottom-color:rgba(255,255,255,.3)}
.anchor-nav a.anchor-active{color:var(--accent-2);border-bottom-color:var(--accent-2)}

/* ── HERO TEXT (audit) ── */
.hero-text{padding:44px 0 20px}
.hero-text h1{font-size:clamp(28px,4vw,48px);font-weight:800;letter-spacing:-.03em;line-height:1.1;color:#ffffff;margin:0 0 12px;text-align:left}
.hero-text h1 em{font-style:normal;background:linear-gradient(135deg,#a78bfa,#818cf8,#38bdf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.kicker{display:block;font-size:clamp(15px,1.8vw,18px);font-weight:400;color:rgba(203,213,255,.65);letter-spacing:0;text-transform:none;margin-top:8px}
.pub-date{font-size:13px;color:rgba(255,255,255,.35);margin-top:8px;display:block}

/* ── VIDEO (audit hero) ── */
.video{border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 24px 64px rgba(0,0,0,.55);margin:24px 0 0}

/* ── AUDIT IMAGE (under video) ── */
.audit-hero-img{border-radius:20px;overflow:hidden;margin:24px 0 0;border:1px solid rgba(255,255,255,.1);box-shadow:0 16px 48px rgba(0,0,0,.5);aspect-ratio:21/7}
.audit-hero-img img{width:100%;height:100%;object-fit:cover;object-position:center 35%;display:block;filter:brightness(.85) saturate(1.1)}

/* ── SECTION BLOCKS (audit) ── */
article.section-block{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:64px 56px;position:relative;overflow:hidden;box-shadow:0 2px 8px rgba(79,70,229,.05);transition:transform var(--t-base),box-shadow var(--t-base),border-color var(--t-base)}
article.section-block::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#4f46e5,#818cf8,#38bdf8);opacity:0;transition:opacity var(--t-base)}
article.section-block:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(79,70,229,.1);border-color:var(--border-2)}
article.section-block:hover::before{opacity:1}
.section-num{display:inline-flex;align-items:center;background:rgba(79,70,229,.08);border:1px solid rgba(79,70,229,.18);border-radius:999px;padding:4px 14px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:14px}
.section-num::before{display:none}
h2{font-size:clamp(20px,2.4vw,28px);font-weight:700;color:var(--text);letter-spacing:-.025em;line-height:1.2;margin:0 0 14px}
h3{font-size:17px;font-weight:600;color:#1e293b;margin:22px 0 8px;letter-spacing:-.01em}
p{color:var(--text-2);font-size:15px;line-height:1.78;margin:8px 0}
ul,ol{padding-left:22px;margin:10px 0}
li{color:var(--text-2);font-size:15px;margin-bottom:6px;line-height:1.7}
.answer{display:block;background:rgba(79,70,229,.04);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;padding:12px 18px;font-weight:600;color:#1e293b;font-size:15px;margin:14px 0}
.intro-block{background:rgba(79,70,229,.04);border:1px solid rgba(79,70,229,.15);border-left:3px solid var(--accent);border-radius:0 14px 14px 0;padding:20px 24px;margin:0 0 24px}
.intro-block p{color:#1e293b;margin:0}

/* ── TABLE ── */
.table-wrap{border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm);margin:20px 0}
.table-wrap table{width:100%;border-collapse:collapse}
.table-wrap th{background:#f0f4ff;color:var(--accent);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:12px 16px;border-bottom:1px solid var(--border);text-align:left}
.table-wrap td{padding:12px 16px;font-size:14px;color:var(--text-2);border-bottom:1px solid #f0f4ff;vertical-align:top}
.table-wrap tbody tr:last-child td{border-bottom:none}
.table-wrap tbody tr:hover td{background:#f8faff}
.threat-low{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:#dcfce7;color:#15803d;border:1px solid #bbf7d0}
.threat-mid{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:#fef9c3;color:#a16207;border:1px solid #fef08a}
.threat-high{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:#fee2e2;color:#b91c1c;border:1px solid #fecaca}

/* ── FAQ ── */
details{background:#fafbff;border:1px solid var(--border);border-radius:var(--r-lg);margin:8px 0;transition:box-shadow var(--t-base),border-color var(--t-base)}
details[open]{border-color:var(--border-2);box-shadow:0 0 0 3px rgba(79,70,229,.06)}
details summary{cursor:pointer;font-weight:600;font-size:15px;color:#1e293b;padding:16px 20px;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;outline:none;user-select:none;transition:background var(--t-fast)}
details summary:hover{background:#f0f4ff}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";font-size:20px;font-weight:300;color:var(--accent);flex-shrink:0;transition:transform var(--t-base);line-height:1}
details[open] summary::after{transform:rotate(45deg)}
.faq-body{padding:4px 20px 16px;color:var(--text-2);font-size:14px;line-height:1.78}

/* ── PROCESS CTA ── */
.process-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:999px;background:var(--accent);color:#fff;font-weight:600;font-size:15px;box-shadow:0 4px 18px rgba(79,70,229,.35);transition:transform var(--t-spring),box-shadow var(--t-base),background var(--t-fast)}
.process-btn:hover{background:var(--accent-d);transform:translateY(-2px);box-shadow:0 8px 28px rgba(79,70,229,.45);color:#fff}

/* ── MISC ── */
.inline-link{color:var(--accent);text-decoration:underline;text-decoration-color:rgba(79,70,229,.35);text-underline-offset:3px;font-weight:500}
.inline-link:hover{color:var(--accent-d)}
.ref-inline{background:rgba(79,70,229,.08);border:1px solid rgba(79,70,229,.2);border-radius:999px;padding:2px 8px;font-size:11px;color:var(--accent);font-weight:600}
.sources-list{list-style:none;padding:0;margin:12px 0}
.sources-list li{padding:8px 0;border-bottom:1px solid var(--border);font-size:13px;color:var(--muted)}
.sources-list li:last-child{border-bottom:none}
.sources-list a{color:var(--accent)}
.sources-list a:hover{color:var(--accent-d)}

/* ── FOOTER ── */
footer.foot{background:#080c1a;border-top:none;padding:64px 24px 48px;color:#94a3b8;font-size:14px}
.foot-grid{max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;gap:48px}
.foot-col{flex:1 1 180px}
.foot-col h4{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#e2e8f0;font-weight:700;margin-bottom:14px}
.foot-col p{margin-bottom:8px;color:#64748b}
.foot-col ul{list-style:none}
.foot-col ul li{margin-bottom:10px}
.foot-col ul a{color:#64748b;transition:color var(--t-fast)}
.foot-col ul a:hover{color:#e2e8f0;text-decoration:none}
.foot-bottom{max-width:var(--max);margin:32px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:#475569}
.foot-bottom a{color:#475569;transition:color var(--t-fast)}
.foot-bottom a:hover{color:#e2e8f0}
#back-to-top{position:fixed;bottom:28px;right:24px;z-index:300;width:46px;height:46px;background:var(--accent);color:#fff;border:none;border-radius:var(--r);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(79,70,229,.4);opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;transition:opacity var(--t-base),transform var(--t-spring),background var(--t-fast)}
#back-to-top.visible{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
#back-to-top:hover{background:var(--accent-d);transform:translateY(-2px) scale(1.05)}
@media(max-width:860px){nav.menu{display:none}.burger{display:flex}.mobile-nav{display:block}}
@media(max-width:768px){.page-hero-inner{padding-bottom:70px}h1{font-size:28px!important}main .wrap{padding-top:24px;padding-bottom:36px}footer.foot{padding:40px 16px 32px}}
@media(max-width:600px){.wrap{padding:0 16px}.wrap-wide{padding:0 16px}#back-to-top{right:14px;bottom:16px}}
/* ── COMPACT HERO variant ── */
.page-hero-dark--sm .page-hero-inner { padding-bottom: 60px; }

/* ── MAIN light body ── */
main { background: #f0f4ff; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 24px; }

/* Video + image in dark hero */
.video { border-radius: 20px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 16px 56px rgba(0,0,0,.5); margin: 24px 0 0; }

/* Audit image below video */
.audit-hero-img { margin-top: 20px; }

/* Section blocks in light area */
.text-columns { display: flex; flex-direction: column; gap: 28px; padding: 48px 0 0; }

/* ── READABILITY — audit light sections ── */
article.section-block h2 { color: #0f172a !important; }
article.section-block h3 { color: #1e293b !important; }
article.section-block p, article.section-block li { color: #374151 !important; }
article.section-block .answer { color: #1e293b !important; }
.intro-block p { color: #1e293b !important; }
.table-wrap th { color: #4f46e5 !important; background: #f0f4ff !important; }
.table-wrap td { color: #374151 !important; }
.faq-body { color: #374151 !important; }
details summary { color: #1e293b !important; }

/* ── HERO TEXT READABILITY (dark bg) ── */
.hero-text h1 { color: #ffffff; }
.hero-text .kicker { color: rgba(203,213,255,.7); }
.pub-date { color: rgba(255,255,255,.4); font-size: 13px; margin-top: 8px; display: block; }

/* ── VIDEO in dark hero ── */
.video { border-radius: 20px; overflow: hidden; margin: 24px 0 0;
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 16px 56px rgba(0,0,0,.5); }

/* ── AUDIT COVER IMAGE ── */
.article-cover-wrap--audit {
  border-radius: 18px; overflow: hidden;
  margin: 20px 0 0;
  border: none;
  box-shadow: 0 16px 48px rgba(0,0,0,.45);
  aspect-ratio: 21/7;
}
.article-cover-wrap--audit img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 35%; display: block;
  filter: brightness(.85);
}

/* ── LOGO ── */
.brand-logo { height: 40px; width: auto; display: block; filter: brightness(1.1); }
.brand:hover .brand-logo { opacity: .85; }

/* [ref styles moved to drone.css] */
.ref a { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; background:rgba(79,70,229,.1); border:1px solid rgba(79,70,229,.3); border-radius:50%; font-size:11px; font-weight:700; color:#4f46e5; text-decoration:none; margin-left:3px; vertical-align:middle; cursor:default; transition:background 150ms ease; }
.ref a:hover { background:rgba(79,70,229,.2); }

/* ── LOGO POSITION LOCK — одинаково на всех страницах ── */
header.site .topbar { align-items: center !important; padding: 13px 24px !important; }
header.site .brand  { display: flex !important; align-items: center !important; flex-shrink: 0 !important; gap: 10px !important; }
header.site .brand-logo { height: 40px !important; width: auto !important; display: block !important; flex-shrink: 0 !important; }

/* ── REF TOOLTIP ── */
.ref a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px;
  background: rgba(79,70,229,.08); border: 1px solid rgba(79,70,229,.22);
  border-radius: 50%; font-size: 11px; font-weight: 700;
  color: var(--accent, #4f46e5); text-decoration: none;
  margin-left: 2px; vertical-align: middle;
  cursor: pointer; transition: background 150ms;
}
.ref a:hover { background: rgba(79,70,229,.18); text-decoration: none; }
.ref-tooltip {
  position: fixed; z-index: 9999;
  max-width: 280px;
  background: #0f172a; border: 1px solid #334155;
  border-radius: 10px; padding: 10px 14px;
  font-size: 13px; font-family: Inter, system-ui, sans-serif;
  color: #e2e8f0; line-height: 1.55; white-space: normal;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  pointer-events: none;
  opacity: 0; transform: translateY(4px);
  transition: opacity 150ms ease, transform 150ms ease;
}
.ref-tooltip.visible { opacity: 1; transform: translateY(0); }

/* ── SMOOTH ACCORDION ── */
details { overflow: visible; }
.faq-body { display: none; padding: 0 20px 18px; }
.faq-body p { margin: 0 0 10px; }
.faq-body p:last-child { margin-bottom: 0; }

/* ── SECTION IMAGES (same as index.html) ── */
.site-img-wrap { border-radius: 18px; overflow: hidden; border: 1px solid var(--border); box-shadow: var(--shadow, 0 2px 8px rgba(0,0,0,.08)); margin: 20px 0 24px; aspect-ratio: 16/6; }
.site-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.site-img-wrap:hover img { transform: scale(1.02); }
.site-img-wrap--sm { aspect-ratio: 16/6; }

/* ── Адаптивное видео: iframe тянется на всю ширину блока (16:9) ── */
.video { position: relative; width: 100%; }
.video::before { content: ""; display: block; padding-top: 56.25%; }
.video iframe,
.video video,
.video embed,
.video object {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
  display: block;
}
