/* ======================================================================
   Forethreat — shared stylesheet
   Palette: Obsidian / Cyan / Indigo / Signal Amber
   ====================================================================== */
:root{
  --bg:#070A12;
  --bg2:#0B1220;
  --panel:rgba(255,255,255,.05);
  --panel2:rgba(255,255,255,.08);
  --border:rgba(255,255,255,.12);
  --text:#E6EDF5;
  --muted:#9AA7B8;
  --muted2:rgba(255,255,255,.55);

  --accent:#22D3EE;   /* cyan */
  --accent2:#6366F1;  /* indigo */
  --signal:#FFB020;   /* amber CTA / threat */

  --shadow:0 18px 60px rgba(0,0,0,.55);
  --radius:18px;
  --radius2:24px;
  --max:1120px;
  --nav-offset:84px;
}
@media (max-width:980px){ :root{ --nav-offset:140px; } }

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background:
    radial-gradient(1200px 700px at 15% 8%, rgba(34,211,238,.18), transparent 55%),
    radial-gradient(900px 600px at 85% 18%, rgba(99,102,241,.20), transparent 55%),
    radial-gradient(900px 600px at 55% 90%, rgba(255,176,32,.06), transparent 55%),
    var(--bg);
  color:var(--text);
  line-height:1.55;
}
a{ color:inherit; text-decoration:none; }
a:hover{ opacity:.92; }
.wrap{ max-width:var(--max); margin:0 auto; padding:0 18px; }
.accent{ color:var(--accent); }
.gradient-text{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* NAV */
.nav{ position:sticky; top:0; z-index:50; backdrop-filter:blur(14px);
  background:rgba(7,10,18,.72); border-bottom:1px solid var(--border); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; gap:12px; flex-wrap:wrap; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:.2px; }
.brand img{ width:30px; height:30px; display:block; }
.nav-links{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.nav-links a{ font-size:.92rem; color:var(--muted); padding:8px 10px; border-radius:12px; border:1px solid transparent; }
.nav-links a:hover, .nav-links a.active{ color:var(--text); border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.04); }

/* BUTTONS */
.btn{ display:inline-flex; align-items:center; gap:10px; padding:12px 16px; border-radius:14px;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:var(--text); font-weight:600; }
.btn:hover{ background:rgba(255,255,255,.08); }
.btn.primary{ border-color:rgba(34,211,238,.55);
  background:linear-gradient(135deg, rgba(34,211,238,.95), rgba(99,102,241,.80)); color:#04121A;
  box-shadow:0 20px 65px rgba(34,211,238,.18); }
.btn.primary:hover{ opacity:.96; }
.btn.signal{ border-color:rgba(255,176,32,.55); background:var(--signal); color:#1A1206;
  box-shadow:0 16px 50px rgba(255,176,32,.20); }
.btn.signal:hover{ background:#ffbe44; }
.cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:10px; }

/* HERO */
.hero{ padding:56px 0 28px; }
.hero-grid{ display:grid; grid-template-columns:1.2fr .8fr; gap:18px; align-items:stretch; }
@media (max-width:980px){ .hero-grid{ grid-template-columns:1fr; } }
.eyebrow{ display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.92rem; }
.eyebrow .line{ width:36px; height:2px; background:linear-gradient(90deg,var(--accent),var(--accent2)); border-radius:99px; }
h1{ margin:12px 0 10px; font-size:clamp(2.1rem,4vw,3.2rem); line-height:1.08; letter-spacing:-.02em; }
h1 span{ background:linear-gradient(135deg,var(--accent),var(--accent2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.sub{ color:var(--muted); font-size:1.02rem; margin:0 0 18px; }
.chips{ display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 18px; }
.chip{ font-size:.86rem; color:rgba(255,255,255,.82); padding:8px 12px; border-radius:999px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); }

/* CARD */
.card{ border:1px solid var(--border); background:rgba(255,255,255,.05); border-radius:var(--radius2); box-shadow:var(--shadow); overflow:hidden; }
.card-top{ padding:16px 16px 12px; border-bottom:1px solid rgba(255,255,255,.09); display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.pill{ font-size:.78rem; color:rgba(255,255,255,.88); padding:7px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); white-space:nowrap; }
.card-title{ font-weight:700; margin:0; }
.card-sub{ margin:6px 0 0; color:var(--muted2); font-size:.92rem; }
.card-body{ padding:16px; }
.list{ margin:0; padding-left:18px; color:rgba(255,255,255,.84); }
.list li{ margin:10px 0; }
.micro{ margin-top:14px; padding:12px; border-radius:14px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); color:var(--muted); font-size:.92rem; }

/* SECTIONS */
section{ padding:34px 0; scroll-margin-top:var(--nav-offset); }
.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:14px; }
h2{ margin:0; font-size:1.55rem; letter-spacing:-.01em; }
.lead{ margin:0; color:var(--muted); max-width:72ch; }

.grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:980px){ .grid3{ grid-template-columns:1fr; } }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:980px){ .grid2{ grid-template-columns:1fr; } }

.svc{ padding:16px; border-radius:var(--radius2); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); }
.svc h3{ margin:0 0 8px; font-size:1.05rem; }
.svc p{ margin:0; color:var(--muted); }
.svc .tags{ margin-top:12px; display:flex; flex-wrap:wrap; gap:8px; }
.tag{ font-size:.78rem; padding:6px 9px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); color:rgba(255,255,255,.82); }

.step{ padding:16px; border-radius:var(--radius2); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); }
.step strong{ display:inline-block; padding:5px 9px; border-radius:999px; background:rgba(99,102,241,.18); border:1px solid rgba(99,102,241,.35); margin-bottom:10px; font-size:.82rem; }
.step p{ margin:0; color:var(--muted); }

/* PRICING */
.price-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; align-items:stretch; }
@media (max-width:980px){ .price-row{ grid-template-columns:1fr; } }
.price{ padding:20px; border-radius:var(--radius2); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); position:relative; overflow:hidden; display:flex; flex-direction:column; }
.price.pop{ border-color:rgba(34,211,238,.45); background:linear-gradient(180deg, rgba(34,211,238,.12), rgba(255,255,255,.05)); }
.price .badge{ position:absolute; top:14px; right:14px; font-size:.7rem; font-weight:700; letter-spacing:.04em; padding:5px 9px; border-radius:999px; background:var(--signal); color:#1A1206; }
.price h3{ margin:0 0 6px; }
.price .from{ color:#fff; font-weight:800; font-size:1.5rem; margin:0 0 4px; }
.price .from small{ font-size:.85rem; font-weight:600; color:var(--muted); }
.price .note{ color:var(--muted2); font-size:.85rem; margin:0 0 12px; }
.price ul{ margin:0 0 16px; padding-left:18px; color:var(--muted); }
.price li{ margin:8px 0; }
.price .btn{ margin-top:auto; justify-content:center; }

table.tbl{ width:100%; border-collapse:collapse; font-size:.92rem; }
table.tbl th, table.tbl td{ text-align:left; padding:11px 12px; border-bottom:1px solid rgba(255,255,255,.10); }
table.tbl th{ color:var(--text); font-weight:700; }
table.tbl td{ color:var(--muted); }
table.tbl tr:last-child td{ border-bottom:none; }

/* FAQ */
.faq{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:980px){ .faq{ grid-template-columns:1fr; } }
details{ border-radius:var(--radius2); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); padding:14px 16px; }
summary{ cursor:pointer; font-weight:700; color:rgba(255,255,255,.9); }
details p{ color:var(--muted); margin:10px 0 0; }

/* CONTACT */
.contact{ display:grid; grid-template-columns:1.1fr .9fr; gap:14px; }
@media (max-width:980px){ .contact{ grid-template-columns:1fr; } }
.contact-box{ padding:18px; border-radius:var(--radius2); border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); }
.contact-box p{ color:var(--muted); margin:8px 0 0; }
.contact-actions{ margin-top:14px; display:flex; flex-wrap:wrap; gap:10px; }

/* FOOTER */
.foot{ padding:22px 0 30px; color:var(--muted2); border-top:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.12); margin-top:34px; }
.foot-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.mini-links{ display:flex; gap:10px; flex-wrap:wrap; }
.mini-links a{ padding:8px 10px; border-radius:12px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:rgba(255,255,255,.86); font-size:.9rem; }

/* PROSE (legal / long-form pages) */
.prose{ max-width:820px; margin:0 auto; color:var(--text); }
.prose h2{ font-size:1.3rem; margin:28px 0 8px; }
.prose h3{ font-size:1.05rem; margin:20px 0 6px; }
.prose p, .prose li{ color:var(--muted); }
.prose ul{ padding-left:20px; }