:root {
  --colour-navy: #101a3a;
  --colour-navy-soft: #17234b;
  --colour-blue: #2864ff;
  --colour-blue-dark: #1746c6;
  --colour-cyan: #39d0ff;
  --colour-lilac: #eef2ff;
  --colour-green: #10b981;
  --colour-orange: #f59e0b;
  --colour-text: #1f2937;
  --colour-muted: #6b7280;
  --colour-border: #dfe5f2;
  --colour-bg: #f6f8fc;
  --colour-white: #ffffff;
  --shadow-soft: 0 20px 60px rgba(16, 26, 58, 0.12);
  --shadow-card: 0 18px 46px rgba(16, 26, 58, 0.06);
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--colour-text);
  background: var(--colour-white);
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
img, svg { max-width: 100%; }
.container { width: min(100% - 40px, var(--container)); margin: 0 auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(223,229,242,.9);
  backdrop-filter: blur(16px);
}
.header-inner { min-height: 78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.logo { display:inline-flex; align-items:center; flex:0 0 auto; max-width:190px; line-height:0; }
.fastdox-logo { display:block; width:100%; max-width:190px; height:auto; object-fit:contain; }
.header-nav { display:flex; align-items:center; gap:24px; color:var(--colour-muted); font-size:.94rem; font-weight:700; }
.header-nav a:hover { color:var(--colour-blue); }
.header-cta { padding:12px 20px; border-radius:999px; background:var(--colour-navy); color:var(--colour-white); font-weight:800; box-shadow:0 10px 30px rgba(16,26,58,.16); }

.hero {
  position:relative;
  overflow:hidden;
  color:var(--colour-white);
  background:
    radial-gradient(circle at 20% 10%, rgba(57,208,255,.28), transparent 28%),
    radial-gradient(circle at 85% 15%, rgba(40,100,255,.36), transparent 30%),
    linear-gradient(135deg, #101a3a 0%, #14245d 48%, #0f172a 100%);
}
.hero::after { content:""; position:absolute; inset:auto -120px -220px auto; width:520px; height:520px; background:rgba(57,208,255,.12); border-radius:50%; }
.hero-grid { position:relative; z-index:1; min-height:700px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:56px; padding:82px 0; }
.eyebrow { margin:0 0 14px; color:var(--colour-blue); font-size:.78rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.hero .eyebrow { color:var(--colour-cyan); }
h1,h2,h3 { margin:0; color:var(--colour-navy); line-height:1.08; letter-spacing:-.04em; }
.hero h1 { color:var(--colour-white); font-size:clamp(2.85rem, 5vw, 5.35rem); max-width:900px; }
.hero-subtitle { max-width:760px; margin:26px 0 0; color:rgba(255,255,255,.84); font-size:1.18rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:14px 24px; border:0; border-radius:999px; cursor:pointer; font:inherit; font-weight:900; transition:transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:linear-gradient(135deg, var(--colour-blue), var(--colour-cyan)); color:var(--colour-white); box-shadow:0 16px 36px rgba(40,100,255,.32); }
.btn-primary:hover { box-shadow:0 22px 46px rgba(40,100,255,.4); }
.btn-secondary { background:var(--colour-white); color:var(--colour-navy); border:1px solid rgba(255,255,255,.55); }
.btn-secondary.light { background:rgba(255,255,255,.12); color:var(--colour-white); border-color:rgba(255,255,255,.28); }

.hero-proof-panel { display:grid; gap:14px; margin-top:30px; padding:18px; border:1px solid rgba(255,255,255,.16); border-radius:20px; background:rgba(255,255,255,.08); }
.hero-proof-panel p { margin:0; color:rgba(255,255,255,.72); font-weight:750; }
.trust-logos { display:flex; flex-wrap:wrap; gap:10px; }
.trust-logos strong { display:inline-flex; padding:9px 13px; border:1px solid rgba(255,255,255,.18); border-radius:999px; background:rgba(255,255,255,.08); color:rgba(255,255,255,.92); font-size:.86rem; }
.hero-benefits { display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-top:26px; }
.hero-benefits div { padding:16px; border:1px solid rgba(255,255,255,.16); border-radius:16px; background:rgba(255,255,255,.08); }
.hero-benefits strong { display:block; color:#fff; font-size:.95rem; line-height:1.25; margin-bottom:5px; }
.hero-benefits span { display:block; color:rgba(255,255,255,.68); font-size:.86rem; line-height:1.45; }
.hero-panel { display:flex; justify-content:flex-end; }
.workflow-card { width:min(100%, 510px); padding:28px; border:1px solid rgba(255,255,255,.16); border-radius:var(--radius-lg); background:rgba(255,255,255,.1); box-shadow:0 28px 90px rgba(0,0,0,.26); backdrop-filter:blur(22px); }
.workflow-header { display:flex; align-items:center; gap:10px; padding-bottom:22px; color:rgba(255,255,255,.86); font-weight:900; }
.status-dot { width:11px; height:11px; background:var(--colour-green); border-radius:50%; box-shadow:0 0 0 6px rgba(16,185,129,.18); }
.workflow-steps { display:grid; gap:14px; }
.workflow-step { display:grid; grid-template-columns:42px 1fr; gap:14px; padding:18px; border-radius:18px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); }
.workflow-step span { width:42px; height:42px; display:grid; place-items:center; border-radius:14px; color:rgba(255,255,255,.72); background:rgba(255,255,255,.12); font-weight:950; }
.workflow-step strong { color:var(--colour-white); }
.workflow-step p { margin:4px 0 0; color:rgba(255,255,255,.66); font-size:.94rem; }
.workflow-step.complete span { background:rgba(16,185,129,.18); color:#b8f7db; }
.workflow-step.active { border-color:rgba(57,208,255,.55); background:rgba(57,208,255,.12); }
.workflow-step.active span { color:var(--colour-white); background:linear-gradient(135deg, var(--colour-blue), var(--colour-cyan)); }
.workflow-footer { margin-top:18px; padding:18px; display:flex; justify-content:space-between; gap:14px; border-radius:18px; background:rgba(255,255,255,.94); color:var(--colour-navy); }
.workflow-footer span { color:var(--colour-muted); font-weight:800; }

.stats-strip, .mini-proof { background:#fff; border-bottom:1px solid var(--colour-border); }
.stats-grid { display:grid; grid-template-columns:repeat(3, 1fr); }
.stats-grid div { padding:30px 34px; border-left:1px solid var(--colour-border); }
.stats-grid div:last-child { border-right:1px solid var(--colour-border); }
.stats-grid strong { display:block; color:var(--colour-navy); font-size:1.05rem; margin-bottom:4px; }
.stats-grid span { color:var(--colour-muted); font-size:.95rem; }
.mini-proof-inner { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:24px 0; }
.mini-proof-inner p { margin:0; color:var(--colour-muted); font-size:.94rem; font-weight:800; }
.mini-proof-inner div { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
.mini-proof-inner strong { display:inline-flex; padding:9px 13px; border:1px solid var(--colour-border); border-radius:999px; background:var(--colour-bg); color:var(--colour-navy); font-size:.86rem; font-weight:900; }

.section { padding:104px 0; }
.two-column, .platform-grid, .demo-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:start; }
.section-intro { position:sticky; top:110px; }
.section-intro h2, .section-heading h2, .platform-grid h2, .demo-copy h2, .checklist-box h2, .comparison-copy h2 { font-size:clamp(2.1rem, 3vw, 3.6rem); }
.section-intro p, .section-heading p, .platform-grid p, .demo-copy p, .checklist-box p, .comparison-copy p { margin:22px 0 0; color:var(--colour-muted); font-size:1.05rem; }
.centred { max-width:860px; margin:0 auto 52px; text-align:center; }
.urgency-section, .proof-section { background:#fff; border-bottom:1px solid var(--colour-border); }
.problem-section, .portal-section, .audience-section, .demo-section { background:var(--colour-bg); }
.mid-cta-section, .checklist-section { padding:0; background:#fff; }

.role-strip { background:var(--colour-bg); border-bottom:1px solid var(--colour-border); }
.role-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:38px; align-items:center; padding:42px 0; }
.role-pills { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }
.role-pills span { display:inline-flex; padding:10px 14px; border:1px solid var(--colour-border); border-radius:999px; background:#fff; color:var(--colour-navy); font-weight:850; }

.problem-list { display:grid; gap:14px; }
.problem-item { display:grid; grid-template-columns:18px 1fr; gap:16px; align-items:start; padding:22px; border:1px solid var(--colour-border); border-radius:18px; background:#fff; box-shadow:0 10px 28px rgba(16,26,58,.04); }
.problem-item span { width:10px; height:10px; margin-top:8px; border-radius:50%; background:var(--colour-blue); box-shadow:0 0 0 6px rgba(40,100,255,.12); }
.problem-item p { margin:0; color:var(--colour-text); font-weight:700; }
.solution-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.solution-card { min-height:280px; padding:30px; border:1px solid var(--colour-border); border-radius:var(--radius-md); background:#fff; box-shadow:var(--shadow-card); }
.icon-circle { width:48px; height:48px; display:grid; place-items:center; margin-bottom:24px; border-radius:16px; color:var(--colour-blue); background:var(--colour-lilac); font-weight:950; }
.solution-card h3 { font-size:1.35rem; }
.solution-card p { margin:14px 0 0; color:var(--colour-muted); }
.audience-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.audience-card { padding:28px; border:1px solid var(--colour-border); border-radius:var(--radius-md); background:#fff; box-shadow:var(--shadow-card); }
.audience-card h3 { font-size:1.25rem; }
.audience-card p { margin:14px 0 0; color:var(--colour-muted); }

.comparison-section { background:#fff; }
.comparison-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:50px; align-items:start; }
.comparison-table { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.compare-card { padding:26px; border:1px solid var(--colour-border); border-radius:var(--radius-lg); background:var(--colour-bg); box-shadow:var(--shadow-card); }
.compare-card.after { background:linear-gradient(180deg, #eef2ff, #fff); border-color:rgba(40,100,255,.25); }
.compare-card h3 { font-size:1.35rem; margin-bottom:18px; }
.compare-card ul { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.compare-card li { position:relative; padding-left:28px; font-weight:700; color:var(--colour-text); }
.compare-card li::before { position:absolute; left:0; top:0; font-weight:950; }
.compare-card.before li::before { content:"×"; color:#ef4444; }
.compare-card.after li::before { content:"✓"; color:var(--colour-green); }

.platform-section { color:#fff; background:radial-gradient(circle at 12% 20%, rgba(57,208,255,.22), transparent 30%), linear-gradient(135deg, #101a3a, #17234b); }
.platform-section h2, .platform-section h3 { color:#fff; }
.platform-section .eyebrow { color:var(--colour-cyan); }
.platform-section p { color:rgba(255,255,255,.75); }
.tick-list { display:grid; gap:12px; margin:32px 0 0; padding:0; list-style:none; }
.tick-list li { position:relative; padding-left:34px; color:rgba(255,255,255,.86); font-weight:700; }
.tick-list li::before { content:"✓"; position:absolute; left:0; top:0; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:rgba(57,208,255,.18); color:var(--colour-cyan); font-size:.78rem; font-weight:950; }
.platform-card { padding:34px; border:1px solid rgba(255,255,255,.15); border-radius:var(--radius-lg); background:rgba(255,255,255,.08); box-shadow:0 28px 80px rgba(0,0,0,.18); }
.platform-card h3 { margin-bottom:26px; font-size:1.6rem; }
.timeline { display:grid; gap:16px; }
.timeline-item { position:relative; padding:18px 18px 18px 24px; border-left:3px solid var(--colour-cyan); border-radius:0 18px 18px 0; background:rgba(255,255,255,.08); }
.timeline-item strong { color:#fff; }
.timeline-item p { margin:4px 0 0; font-size:.94rem; }
.testimonial-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.testimonial-card { display:flex; min-height:320px; flex-direction:column; justify-content:space-between; padding:30px; border:1px solid var(--colour-border); border-radius:var(--radius-md); background:linear-gradient(180deg, rgba(238,242,255,.8), #fff); box-shadow:var(--shadow-card); }
.testimonial-card p { margin:0; color:var(--colour-text); font-size:1.02rem; }
.testimonial-card footer { margin-top:28px; }
.testimonial-card strong, .testimonial-card span { display:block; }
.testimonial-card span { color:var(--colour-muted); font-size:.92rem; }
.proof-extra { margin-top:34px; padding-top:28px; border-top:1px solid var(--colour-border); }

.checklist-box { display:flex; align-items:center; justify-content:space-between; gap:34px; padding:46px; border-radius:var(--radius-lg); background:radial-gradient(circle at 90% 20%, rgba(57,208,255,.24), transparent 24%), linear-gradient(135deg, #2864ff, #101a3a); color:#fff; box-shadow:var(--shadow-soft); }
.checklist-box h2, .checklist-box .eyebrow { color:#fff; }
.checklist-box .eyebrow { color:var(--colour-cyan); }
.checklist-box p { max-width:760px; color:rgba(255,255,255,.78); }
.demo-grid { align-items:center; }
.demo-points { display:grid; gap:16px; margin-top:34px; }
.demo-points div { padding:18px; border:1px solid var(--colour-border); border-radius:18px; background:#fff; }
.demo-points strong, .demo-points span { display:block; }
.demo-points span { margin-top:4px; color:var(--colour-muted); }
.demo-form { padding:34px; border:1px solid var(--colour-border); border-radius:var(--radius-lg); background:#fff; box-shadow:var(--shadow-soft); }
.demo-form h3 { margin-bottom:12px; font-size:1.7rem; }
.form-intro { margin:0 0 22px; color:var(--colour-muted); font-size:.96rem; line-height:1.6; }
.demo-form label { display:block; margin:16px 0 7px; color:var(--colour-navy); font-size:.92rem; font-weight:850; }
.demo-form input, .demo-form select, .demo-form textarea { width:100%; padding:15px 16px; border:1px solid var(--colour-border); border-radius:14px; background:#fff; color:var(--colour-text); font:inherit; outline:none; transition:border-color .2s ease, box-shadow .2s ease; }
.demo-form input:focus, .demo-form select:focus, .demo-form textarea:focus { border-color:var(--colour-blue); box-shadow:0 0 0 4px rgba(40,100,255,.12); }
.optional { color:var(--colour-muted); font-size:.82rem; font-weight:650; }
.form-submit { width:100%; margin-top:22px; }
.form-note, .next-note { margin:14px 0 0; color:var(--colour-muted); font-size:.84rem; }
.next-note { padding:12px 14px; border-radius:14px; background:var(--colour-bg); font-weight:700; }
.form-note a { color:var(--colour-blue); font-weight:850; }

.fdx-legal-footer { position:relative !important; overflow:hidden !important; background:radial-gradient(circle at top left, rgba(0,128,255,.18), transparent 34%), radial-gradient(circle at 85% 10%, rgba(49,211,255,.12), transparent 30%), #071d2e !important; color:#d8ecff !important; }
.fdx-legal-footer * { box-sizing:border-box !important; }
.fdx-legal-footer a { color:inherit !important; text-decoration:none !important; }
.fdx-legal-footer-container { width:min(100% - 96px, 1500px) !important; margin:0 auto !important; }
.fdx-legal-footer-main { background:rgba(7,29,46,.78) !important; }
.fdx-legal-footer-grid { display:grid !important; grid-template-columns:minmax(280px,1.15fr) repeat(3,minmax(170px,.85fr)) !important; gap:72px !important; align-items:start !important; padding:74px 0 70px !important; }
.fdx-legal-footer-about { max-width:420px !important; }
.fdx-legal-footer-logo { display:inline-flex !important; align-items:center !important; width:190px !important; max-width:190px !important; margin:0 0 28px !important; line-height:0 !important; }
.fdx-legal-footer-logo img { display:block !important; width:190px !important; max-width:190px !important; height:auto !important; object-fit:contain !important; filter:brightness(0) invert(1) !important; }
.fdx-legal-footer-about p { margin:0 !important; color:#bfe4ff !important; font-size:1.02rem !important; line-height:1.64 !important; font-weight:500 !important; }
.fdx-legal-footer-buttons { display:flex !important; flex-wrap:wrap !important; gap:14px !important; margin-top:32px !important; }
.fdx-legal-footer-button { display:inline-flex !important; align-items:center !important; justify-content:center !important; min-height:52px !important; padding:15px 22px !important; border-radius:999px !important; border:2px solid #fff !important; background:#fff !important; color:#071d2e !important; font-size:.94rem !important; font-weight:950 !important; line-height:1 !important; text-align:center !important; box-shadow:0 16px 36px rgba(0,0,0,.24), inset 0 -2px 0 rgba(7,29,46,.08) !important; }
.fdx-legal-footer-button-secondary { background:rgba(255,255,255,.08) !important; border-color:rgba(255,255,255,.22) !important; color:#fff !important; box-shadow:none !important; }
.fdx-legal-footer-column h3 { position:relative !important; margin:0 0 26px !important; padding-bottom:14px !important; color:#fff !important; font-size:1.02rem !important; line-height:1.2 !important; font-weight:950 !important; letter-spacing:-.03em !important; }
.fdx-legal-footer-column h3::after { content:"" !important; position:absolute !important; left:0 !important; bottom:0 !important; width:34px !important; height:3px !important; border-radius:999px !important; background:linear-gradient(90deg,#34d399,#39bdf8) !important; }
.fdx-legal-footer-column ul { display:grid !important; gap:15px !important; margin:0 !important; padding:0 !important; list-style:none !important; }
.fdx-legal-footer-column a { display:inline-flex !important; align-items:flex-start !important; gap:8px !important; color:#bfe4ff !important; font-size:.98rem !important; line-height:1.45 !important; font-weight:750 !important; }
.fdx-legal-footer-column a::before { content:"›" !important; flex:0 0 auto !important; color:rgba(57,189,248,.9) !important; font-weight:950 !important; }
.fdx-legal-footer-bottom { background:rgba(3,17,29,.36) !important; border-top:1px solid rgba(255,255,255,.12) !important; }
.fdx-legal-footer-bottom-inner { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:32px !important; padding:28px 0 !important; }
.fdx-legal-footer-bottom p { margin:0 !important; color:rgba(191,228,255,.82) !important; font-size:.9rem !important; line-height:1.5 !important; }
.fdx-legal-footer-legal { display:flex !important; flex-wrap:wrap !important; gap:24px !important; align-items:center !important; justify-content:flex-end !important; }
.fdx-legal-footer-legal a { color:#d8ecff !important; font-size:.92rem !important; font-weight:800 !important; }

@media (max-width:1020px) {
  .header-nav { display:none; }
  .hero-grid, .two-column, .platform-grid, .demo-grid, .comparison-grid, .role-grid { grid-template-columns:1fr; }
  .hero-grid { min-height:auto; padding:72px 0; }
  .hero-panel { justify-content:flex-start; }
  .hero-benefits, .solution-grid, .testimonial-grid, .stats-grid { grid-template-columns:1fr; }
  .stats-grid div { border-right:1px solid var(--colour-border); border-bottom:1px solid var(--colour-border); }
  .mini-proof-inner { align-items:flex-start; flex-direction:column; }
  .mini-proof-inner div, .role-pills { justify-content:flex-start; }
  .section-intro { position:static; }
  .audience-grid, .comparison-table { grid-template-columns:1fr 1fr; }
  .checklist-box { align-items:flex-start; flex-direction:column; }
  .fdx-legal-footer-container { width:min(100% - 56px,1500px) !important; }
  .fdx-legal-footer-grid { grid-template-columns:1fr 1fr !important; gap:52px 48px !important; }
  .fdx-legal-footer-about { max-width:none !important; grid-column:1 / -1 !important; }
}
@media (max-width:640px) {
  .container { width:min(100% - 28px, var(--container)); }
  .header-inner { min-height:68px; }
  .logo, .fastdox-logo { max-width:145px; }
  .header-cta { padding:10px 16px; font-size:.82rem; }
  .hero-grid { padding:64px 0; }
  .hero h1 { font-size:2.55rem; }
  .hero-subtitle { font-size:1.02rem; }
  .hero-actions, .trust-logos { flex-direction:column; align-items:stretch; }
  .btn { width:100%; }
  .workflow-card, .demo-form, .platform-card, .checklist-box, .compare-card { padding:24px; }
  .workflow-step, .comparison-table { grid-template-columns:1fr; }
  .workflow-footer { flex-direction:column; }
  .section { padding:72px 0; }
  .solution-card, .testimonial-card, .audience-card { min-height:auto; padding:24px; }
  .audience-grid { grid-template-columns:1fr; }
  .fdx-legal-footer-container { width:min(100% - 32px,1500px) !important; }
  .fdx-legal-footer-grid { grid-template-columns:1fr !important; gap:38px !important; padding:54px 0 !important; }
  .fdx-legal-footer-buttons, .fdx-legal-footer-button { width:100% !important; }
  .fdx-legal-footer-buttons { display:grid !important; }
  .fdx-legal-footer-bottom-inner { align-items:flex-start !important; flex-direction:column !important; gap:18px !important; }
  .fdx-legal-footer-legal { justify-content:flex-start !important; gap:16px 22px !important; }
}
