/* VIGIL — polish layer over the extracted design system */

:root{
  --container: 1180px;
  --header-h: 66px;
}

html{ scroll-padding-top: calc(var(--header-h) + 20px); }
.btn, .explore-link, section[id], .hero-ctas{ scroll-margin-top: calc(var(--header-h) + 16px); }

body{
  background-image:
    radial-gradient(ellipse 90% 50% at 50% -10%, rgba(217,164,65,0.045), transparent 50%),
    radial-gradient(ellipse 40% 30% at 100% 20%, rgba(124,147,184,0.03), transparent 50%);
}

body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none; z-index:250;
  opacity:0.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.skip-link{
  position:absolute; left:16px; top:12px;
  z-index:400;
  padding:10px 16px;
  background:var(--accent); color:#151004;
  font-family:'IBM Plex Mono', monospace;
  font-size:12px; letter-spacing:0.06em; text-transform:uppercase;
  border-radius:999px;
  transform:translateY(-140%);
  transition:transform .25s var(--ease);
}
.skip-link:focus{ transform:translateY(0); }

:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}
.btn:focus-visible,
.nav-dropdown-trigger:focus-visible,
.tabbtn:focus-visible,
.nav-toggle:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

/* hero stage: CCTV + system feed stacked in the right column */
.hero-stage{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.hero-copy{ min-width:0; }
.hero-kicker{
  margin-top:18px;
  font-size:12.5px;
  color:var(--text-dimmer);
  letter-spacing:0.04em;
}

.hero{
  padding:168px 0 96px;
  background:
    radial-gradient(ellipse 70% 55% at 80% 10%, rgba(217,164,65,0.05), transparent 55%);
}

.page-hero{
  padding:172px 0 80px;
}

.page-hero::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--accent-line), transparent);
  pointer-events:none;
}

/* mobile nav was clipping product links */
.mobile-nav.open{ max-height:min(80vh, 520px); overflow:auto; }

.tabbar-wrap::after{
  background:linear-gradient(90deg, transparent, var(--bg) 70%);
}
section.mf-bg .tabbar-wrap::after,
section.trust-bg .tabbar-wrap::after{
  background:linear-gradient(90deg, transparent, var(--bg-2) 70%);
}

/* jump-to strip */
.jump-nav{ padding:36px 0; }
.jump-row{
  display:flex; flex-wrap:wrap; gap:12px; align-items:center;
}
.jump-label{
  font-family:'IBM Plex Mono', monospace;
  font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--text-dimmer);
}

.section-tight{ padding-bottom:70px; }
.section-flush{ padding-top:0; }

.cases-2{ grid-template-columns:repeat(2,1fr); }
@media (max-width:600px){ .cases-2{ grid-template-columns:1fr; } }
.cases-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:900px){ .cases-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .cases-3{ grid-template-columns:1fr; } }

.workflow-strip{
  justify-content:flex-start !important;
  flex-wrap:wrap;
  gap:10px;
  background:none !important;
  padding:0 !important;
}

.center-eyebrow{ justify-content:center; }
.prose{
  max-width:680px;
  color:var(--text-dim);
  font-size:15.5px;
  line-height:1.75;
}
.prose p + p{ margin-top:16px; }
.max-copy{ max-width:460px; color:var(--text-dim); font-size:15px; }
.stack{ display:flex; flex-direction:column; gap:14px; }
.stack-lg{ display:flex; flex-direction:column; gap:16px; }
.badge-row{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:30px; }
.mt-6{ margin-top:6px; }
.mt-16{ margin-top:16px; }
.mt-20{ margin-top:20px; }
.mt-22{ margin-top:22px; }
.mt-24{ margin-top:24px; }
.mt-26{ margin-top:26px; }
.mt-40{ margin-top:40px; }
.mb-16{ margin-bottom:16px; }
.tl-wide{ max-width:760px; }
.detect-kicker{
  text-align:center;
  font-family:'IBM Plex Mono', monospace;
  font-size:13px;
  color:var(--text-dim);
  letter-spacing:0.04em;
  margin-bottom:8px;
}
.center-block{ max-width:640px; margin:0 auto; text-align:center; }

/* status badge: support both ::before and inner .sys-dot */
.status-badge:has(.sys-dot)::before{ display:none; }

.modal{
  max-height: calc(100vh - 48px);
  overflow-y: auto;
}
.modal-backdrop{ z-index: 300; }

footer{
  background:
    linear-gradient(180deg, transparent, rgba(217,164,65,0.02));
}
.foot-fine{ max-width:720px; line-height:1.7; }

/* quieter card lift on touch devices */
@media (hover:none){
  .pillar:hover, .case:hover, .audience-card:hover, .fork-card:hover,
  .industry-card:hover, .tl-card:hover, .alert-card:hover{
    transform:none;
  }
}

@media (prefers-reduced-motion: reduce){
  .ticker-track{ animation:none; }
  header.scrolled::after{ animation:none; }
  .final .btn.solid{ animation:none; }
}