/* ════════════════════════════════════════════════════════════════════════
   RBCopilot — Marketing pages design system (public, dark premium)
   Shared by /platform, /bid-intelligence, /field-assistant, /claims-rfis,
   /scdot-2025, /about, /demo. Matches the landing aesthetic.
   ════════════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root{
  --bg:#050505; --bg-2:#0c0c0c; --bg-3:#141414;
  --amber:#F59E0B; --amber-dim:rgba(245,158,11,.13); --amber-glow:rgba(245,158,11,.22);
  --emerald:#10B981; --emerald-dim:rgba(16,185,129,.11);
  --violet:#8B5CF6; --blue:#60A5FA; --red:#EF4444;
  --ink-0:#FAFAFA; --ink-1:#E5E7EB; --ink-2:#9CA3AF; --ink-3:#6B7280;
  --border:rgba(255,255,255,.07); --border-hi:rgba(255,255,255,.13);
  --card:rgba(255,255,255,.028); --card-h:rgba(255,255,255,.055);
  --spring:cubic-bezier(.32,.72,0,1); --expo:cubic-bezier(.19,1,.22,1);
}
html{ scroll-behavior:smooth; }
body{
  background:var(--bg); color:var(--ink-0);
  font-family:"Plus Jakarta Sans", -apple-system, system-ui, sans-serif;
  -webkit-font-smoothing:antialiased; line-height:1.5; overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
.container{ max-width:1200px; margin:0 auto; padding:0 24px; }

/* ambient mesh */
.mesh{ position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.6;
  background:
   radial-gradient(680px 420px at 12% -5%, rgba(245,158,11,.10), transparent 60%),
   radial-gradient(720px 480px at 95% 0%, rgba(16,185,129,.07), transparent 60%),
   radial-gradient(900px 600px at 50% 110%, rgba(139,92,246,.06), transparent 60%); }

/* ── NAV ── */
.nav-wrap{ position:sticky; top:0; z-index:50; padding:14px 0; }
.nav{ max-width:1200px; margin:0 auto; display:flex; align-items:center; gap:20px; padding:11px 18px;
  background:rgba(10,10,10,.72); border:1px solid var(--border); border-radius:16px;
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
.nav-brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:15.5px; letter-spacing:-.02em; }
.nav-brand .mk{ width:30px; height:30px; border-radius:8px; background:linear-gradient(135deg,var(--amber),#b45309);
  display:flex; align-items:center; justify-content:center; font-size:15px; }
.nav-links{ display:flex; gap:6px; margin-left:auto; }
.nav-links a{ padding:8px 13px; border-radius:9px; font-size:13px; font-weight:500; color:var(--ink-2); transition:color .2s, background .2s; }
.nav-links a:hover, .nav-links a.active{ color:var(--ink-0); background:rgba(255,255,255,.05); }
.nav-cta{ display:inline-flex; align-items:center; gap:7px; padding:9px 16px; border-radius:999px;
  background:var(--amber); color:#0a0a0a; font-weight:700; font-size:13px; transition:filter .2s, transform .15s; }
.nav-cta:hover{ filter:brightness(1.08); } .nav-cta:active{ transform:scale(.97); }
@media(max-width:880px){ .nav-links{ display:none; } }

/* ── HERO ── */
.mhero{ padding:78px 0 40px; text-align:center; }
.eyebrow{ display:inline-flex; align-items:center; gap:9px; padding:7px 15px; border-radius:999px;
  background:var(--card); border:1px solid var(--border-hi); font-size:11.5px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; color:var(--ink-2); }
.eyebrow .dot{ width:7px; height:7px; border-radius:50%; background:var(--amber); box-shadow:0 0 0 4px var(--amber-dim); }
.eyebrow .dot.em{ background:var(--emerald); box-shadow:0 0 0 4px var(--emerald-dim); }
.eyebrow .dot.rd{ background:var(--red); box-shadow:0 0 0 4px rgba(239,68,68,.14); }
.mhero h1{ font-size:clamp(34px,5.4vw,60px); font-weight:700; letter-spacing:-.03em; line-height:1.04; margin:26px auto 0; max-width:880px; }
.mhero h1 em{ font-style:normal; background:linear-gradient(135deg,var(--amber),var(--emerald));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.mhero p{ font-size:clamp(15px,1.8vw,18px); color:var(--ink-2); max-width:660px; margin:24px auto 0; line-height:1.7; }
.hero-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:34px; }

/* ── BUTTONS ── */
.btn{ display:inline-flex; align-items:center; gap:9px; padding:13px 24px; border-radius:999px;
  font-weight:700; font-size:14px; transition:filter .2s, transform .15s, box-shadow .3s; cursor:pointer; border:0; }
.btn-primary{ background:var(--amber); color:#0a0a0a; box-shadow:0 0 48px -8px var(--amber-glow); }
.btn-primary:hover{ filter:brightness(1.08); transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:var(--ink-1); border:1px solid var(--border-hi); }
.btn-ghost:hover{ background:rgba(255,255,255,.05); color:var(--ink-0); }
.btn .pill{ width:22px; height:22px; border-radius:50%; background:rgba(0,0,0,.16); display:flex; align-items:center; justify-content:center; font-size:12px; }

/* ── SECTION HEADERS ── */
.sec{ padding:70px 0; }
.sec-head{ text-align:center; max-width:760px; margin:0 auto 50px; }
.sec-title{ font-size:clamp(26px,3.4vw,40px); font-weight:700; letter-spacing:-.025em; line-height:1.1; margin-top:24px; }
.sec-title em{ font-style:normal; background:linear-gradient(135deg,var(--amber),var(--emerald));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.sec-sub{ font-size:15.5px; color:var(--ink-2); line-height:1.7; margin-top:18px; }

/* ── CARDS / GRIDS ── */
.grid{ display:grid; gap:18px; }
.g2{ grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); }
.g3{ grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.g4{ grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.card{ background:var(--card); border:1px solid var(--border); border-radius:18px; padding:28px 26px;
  transition:border-color .3s, background .3s, transform .35s var(--spring); }
.card:hover{ border-color:var(--border-hi); background:var(--card-h); transform:translateY(-3px); }
.card .ic{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:var(--amber-dim); font-size:22px; margin-bottom:18px; }
.card h3{ font-size:17px; font-weight:600; letter-spacing:-.01em; margin-bottom:9px; color:var(--ink-0); }
.card p{ font-size:13.5px; line-height:1.62; color:var(--ink-2); }
.card ul{ list-style:none; margin-top:14px; }
.card li{ display:flex; gap:9px; font-size:13px; color:var(--ink-1); padding:5px 0; }
.card li::before{ content:"✓"; color:var(--emerald); font-weight:700; flex-shrink:0; }

/* feature row (split) */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.split.rev{ direction:rtl; } .split.rev > *{ direction:ltr; }
.split h2{ font-size:clamp(24px,3vw,34px); font-weight:700; letter-spacing:-.02em; line-height:1.12; }
.split p{ font-size:15px; color:var(--ink-2); line-height:1.7; margin-top:18px; }
.split .panel{ background:linear-gradient(135deg,var(--card-h),var(--card)); border:1px solid var(--border-hi);
  border-radius:22px; padding:30px; min-height:280px; }
@media(max-width:820px){ .split{ grid-template-columns:1fr; gap:28px; } .split.rev{ direction:ltr; } }

/* chips / steps */
.chips{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.chip{ display:inline-flex; align-items:center; gap:8px; padding:10px 17px; border-radius:999px;
  background:var(--card); border:1px solid var(--border-hi); font-size:13.5px; font-weight:500; color:var(--ink-1); }
.chip .d{ width:7px; height:7px; border-radius:50%; background:var(--emerald); flex-shrink:0; }
.steps{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); counter-reset:s; }
.step{ background:var(--card); border:1px solid var(--border); border-radius:16px; padding:24px; position:relative; }
.step::before{ counter-increment:s; content:counter(s); position:absolute; top:20px; right:22px;
  font-size:30px; font-weight:800; color:rgba(255,255,255,.07); }
.step h4{ font-size:15px; font-weight:600; margin-bottom:8px; }
.step p{ font-size:13px; color:var(--ink-2); line-height:1.6; }

/* ── FINAL CTA ── */
.cta{ padding:90px 0; }
.cta-box{ text-align:center; max-width:820px; margin:0 auto; padding:60px 40px; border-radius:28px;
  background:radial-gradient(900px 400px at 50% -20%, rgba(245,158,11,.12), transparent 60%), var(--bg-2);
  border:1px solid var(--border-hi); }
.cta-box h2{ font-size:clamp(28px,4vw,44px); font-weight:700; letter-spacing:-.03em; line-height:1.08; }
.cta-box h2 em{ font-style:normal; background:linear-gradient(135deg,var(--amber),var(--emerald));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.cta-box p{ color:var(--ink-2); font-size:15.5px; margin:20px auto 0; max-width:560px; line-height:1.7; }
.cta-box .hero-actions{ margin-top:34px; }

/* ── disclaimer + footer ── */
.disclaimer{ max-width:880px; margin:40px auto 0; padding:20px 26px; background:rgba(255,255,255,.02);
  border:1px solid var(--border); border-radius:14px; font-size:12.5px; line-height:1.65; color:var(--ink-3); text-align:center; }
.mfooter{ border-top:1px solid var(--border); padding:46px 0 38px; margin-top:30px; }
.mfooter-inner{ max-width:1200px; margin:0 auto; padding:0 24px; display:flex; flex-wrap:wrap; gap:22px; align-items:center; justify-content:space-between; }
.mfooter-brand{ font-weight:700; }
.mfooter-brand small{ display:block; font-weight:400; font-size:11.5px; color:var(--ink-3); margin-top:3px; letter-spacing:.02em; }
.mfooter-links{ display:flex; flex-wrap:wrap; gap:18px; font-size:13px; }
.mfooter-links a{ color:var(--ink-2); } .mfooter-links a:hover{ color:var(--ink-0); }
.mfooter-copy{ width:100%; font-size:12px; color:var(--ink-3); line-height:1.6; }

/* reveal on scroll */
.rev{ opacity:0; transform:translateY(20px); transition:opacity .7s var(--expo), transform .7s var(--expo); }
.rev.in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){ .rev{ opacity:1; transform:none; } html{ scroll-behavior:auto; } }
