| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238 |
- import { a0 as attr_class, a1 as attr_style, a2 as ensure_array_like, a3 as attr, e as escape_html, a4 as stringify } from "../../chunks/index.js";
- function _page($$renderer, $$props) {
- $$renderer.component(($$renderer2) => {
- let scrolled = false;
- let menuOpen = false;
- let formState = "idle";
- const navLinks = [
- { label: "About", href: "#about" },
- { label: "Industries", href: "#industries" },
- { label: "Intelligence", href: "#signals" },
- { label: "Advantage", href: "#advantage" }
- ];
- const industries = [
- {
- name: "Finance & Fintech",
- desc: "ESG metrics, high-frequency transaction data, and regulatory risk signals for quantitative and macro funds seeking asymmetric intelligence."
- },
- {
- name: "Entertainment & Media",
- desc: "Audience psychographics and cross-platform engagement metrics for studios and talent agencies navigating a fragmented attention economy."
- },
- {
- name: "Blockchain & Digital Assets",
- desc: "Deep-chain analytics, liquidity flow tracking, and sentiment mapping across decentralized and hybrid ecosystems."
- },
- {
- name: "Consumer Sales & Retail",
- desc: "Hyper-local demographic data and real-time spending velocity for supply chain optimization and precision site selection."
- }
- ];
- const advantages = [
- {
- title: "Global Reach & Deep Access",
- desc: "We source from data markets invisible to traditional aggregators — proprietary relationships and access points built over years of operational presence."
- },
- {
- title: "Vetted Integrity",
- desc: "A rigorous multi-stage validation framework with full chain of custody. Every dataset arrives compliance-ready and traceable."
- },
- {
- title: "Absolute Discretion",
- desc: "We operate as a silent partner. Client identities, inquiry scope, and operational requirements are never disclosed to third parties."
- },
- {
- title: "Scalable Architecture",
- desc: "From one-off intelligence reports to continuous high-volume API data feeds — infrastructure that adapts to your operational tempo."
- }
- ];
- const sources = [
- "Satellite imagery & geospatial intelligence",
- "Shipping manifests & logistics data",
- "Deep-web sentiment analysis",
- "Proprietary financial signal extraction",
- "Cross-border transaction flow mapping",
- "Alternative economic indicator networks"
- ];
- $$renderer2.push(`<nav${attr_class("fixed top-0 left-0 right-0 z-50 transition-all duration-300", void 0, { "bg-bg": scrolled })}${attr_style("")}><div class="max-w-7xl mx-auto px-6 h-16 flex items-center justify-between"><a href="#hero" class="flex items-center gap-2.5 no-underline group"><span class="text-accent text-lg leading-none transition-all duration-300 group-hover:drop-shadow-[0_0_8px_rgba(14,165,233,0.8)]">◆</span> <span class="font-heading font-600 text-sm tracking-[0.18em] uppercase text-text">KeystoneIntel</span></a> <div class="hidden md:flex items-center gap-8"><!--[-->`);
- const each_array = ensure_array_like(navLinks);
- for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
- let link = each_array[$$index];
- $$renderer2.push(`<a${attr("href", link.href)} class="font-mono text-[0.7rem] tracking-[0.15em] uppercase text-muted hover:text-accent transition-colors no-underline">${escape_html(link.label)}</a>`);
- }
- $$renderer2.push(`<!--]--> <a href="#contact" class="btn-primary text-xs py-2.5 px-5">Secure Inquiry</a></div> <button class="md:hidden flex flex-col gap-1.5 p-1" aria-label="Toggle menu"><span${attr_class("block w-5 h-px bg-muted transition-all duration-200", void 0, { "rotate-45": menuOpen, "translate-y-2": menuOpen })}></span> <span${attr_class("block w-5 h-px bg-muted transition-all duration-200", void 0, { "opacity-0": menuOpen })}></span> <span${attr_class("block w-5 h-px bg-muted transition-all duration-200", void 0, { "-rotate-45": menuOpen, "-translate-y-2": menuOpen })}></span></button></div></nav> `);
- {
- $$renderer2.push("<!--[-1-->");
- }
- $$renderer2.push(`<!--]--> <section id="hero" class="relative flex flex-col items-center justify-center overflow-hidden" style="height: 100vh; height: 100svh; max-height: 100vh; max-height: 100svh;"><canvas class="absolute inset-0 w-full h-full" style="display: block;"></canvas> <div class="absolute inset-0 pointer-events-none" style="background: radial-gradient(ellipse 80% 70% at 50% 50%, transparent 20%, rgba(6,9,14,0.7) 100%)"></div> <div class="absolute inset-0 pointer-events-none" style="background: linear-gradient(to bottom, rgba(6,9,14,0.5) 0%, transparent 20%, transparent 70%, rgba(6,9,14,0.9) 100%)"></div> <div class="relative z-10 text-center px-6 max-w-5xl mx-auto" style="animation: fade-up 1s cubic-bezier(0.25, 1, 0.5, 1) both;"><div class="inline-flex items-center gap-4 mb-10 font-mono text-[0.62rem] tracking-[0.28em] uppercase text-accent"><span class="w-8 h-px bg-accent opacity-60"></span> Data Intelligence · Brokerage · Proprietary Signals <span class="w-8 h-px bg-accent opacity-60"></span></div> <h1 class="font-heading font-700 leading-[1.0] mb-6 tracking-tight" style="font-size: clamp(2.4rem, 7vw, 5.5rem); color: var(--color-text);">THE ARCHITECTURE<br/> <span style="color: var(--color-accent);">OF INFORMED</span><br/> DECISIONS.</h1> <p class="font-body font-300 leading-relaxed max-w-xl mx-auto mb-12" style="font-size: clamp(1rem, 2vw, 1.15rem); color: var(--color-muted);">Premier intelligence firm. Bridging the gap between massive data lakes and executive action.</p> <div class="flex flex-col sm:flex-row gap-4 justify-center items-center"><a href="#contact" class="btn-primary">Initiate Inquiry →</a> <a href="#about" class="btn-secondary">Discover More</a></div></div> <div class="absolute bottom-8 left-1/2 -translate-x-1/2 flex flex-col items-center gap-2" style="animation: fade-up 1.4s 0.6s cubic-bezier(0.25,1,0.5,1) both;"><span class="font-mono text-[0.6rem] tracking-[0.3em] uppercase" style="color: var(--color-dim)">Scroll</span> <div class="w-px h-10" style="background: linear-gradient(to bottom, var(--color-accent), transparent)"></div></div></section> <section id="about" class="py-20 sm:py-32 px-6" style="background: var(--color-bg)"><div class="max-w-6xl mx-auto"><div class="section-tag reveal">01 / About</div> <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-20 items-start"><div><h2 class="font-heading font-600 leading-[1.1] mb-6 reveal" style="font-size: clamp(1.9rem, 4vw, 3rem); color: var(--color-text);">The Architecture of<br/>Informed Decision<br/>Making.</h2> <div class="accent-bar reveal delay-1"></div> <blockquote class="font-heading text-lg italic reveal delay-2" style="color: var(--color-accent); border-left: 2px solid var(--color-accent-dim); padding-left: 1.25rem; line-height: 1.6;">"The keystone — the essential data point that holds a strategic vision together."</blockquote> <div class="flex flex-wrap gap-4 mt-10 reveal delay-3"><!--[-->`);
- const each_array_2 = ensure_array_like(["High-Fidelity Data", "Global Sources", "Compliance Ready"]);
- for (let $$index_2 = 0, $$length = each_array_2.length; $$index_2 < $$length; $$index_2++) {
- let chip = each_array_2[$$index_2];
- $$renderer2.push(`<span class="font-mono text-[0.62rem] tracking-widest uppercase px-3 py-1.5" style="border: 1px solid var(--color-border); color: var(--color-accent); background: var(--color-accent-glow);">${escape_html(chip)}</span>`);
- }
- $$renderer2.push(`<!--]--></div></div> <div class="space-y-5 font-300 leading-relaxed reveal delay-1" style="color: var(--color-muted)"><p>KeystoneIntel is a premier intelligence firm specializing in the sourcing, validation, and
- brokerage of high-fidelity data at scale. We occupy the vital space between massive data
- lakes and executive action.</p> <p>Our mission is to bridge the gap between raw information and strategic advantage —
- delivering the signals that drive first-mover positioning, risk mitigation, and market
- dominance.</p> <p>Where traditional aggregators stop, we begin. Our proprietary methods surface intelligence
- from the data markets others can't access, can't process, or don't know exist. Every
- dataset we deliver represents an asymmetric advantage for our clients.</p> <p>Founded on the principle that in a world saturated with data, the true scarce resource is <em style="color: var(--color-text)">signal</em> — actionable intelligence that changes decisions.</p></div></div></div></section> <div class="max-w-6xl mx-auto px-6"><div class="h-px" style="background: linear-gradient(to right, transparent, var(--color-border), transparent)"></div></div> <section id="industries" class="py-20 sm:py-32 px-6" style="background: var(--color-bg)"><div class="max-w-6xl mx-auto"><div class="section-tag reveal">02 / Industries</div> <div class="max-w-2xl mb-14"><h2 class="font-heading font-600 leading-tight mb-4 reveal" style="font-size: clamp(1.9rem, 4vw, 3rem); color: var(--color-text);">Vertical Expertise.<br/>Global Impact.</h2> <p class="font-300 reveal delay-1" style="color: var(--color-muted)">Bespoke data solutions engineered for high-stakes decision environments.</p></div> <div class="grid grid-cols-1 sm:grid-cols-2 gap-px" style="background: var(--color-border)"><!--[-->`);
- const each_array_3 = ensure_array_like(industries);
- for (let i = 0, $$length = each_array_3.length; i < $$length; i++) {
- let ind = each_array_3[i];
- $$renderer2.push(`<div${attr_class(`industry-card group p-8 sm:p-10 transition-colors duration-300 reveal delay-${stringify(i % 4 + 1)}`)}><div class="font-mono text-[0.62rem] tracking-[0.2em] mb-4" style="color: var(--color-accent); opacity: 0.5">0${escape_html(i + 1)}</div> <h3 class="font-heading font-600 text-lg mb-3 transition-colors duration-200 group-hover:text-accent" style="color: var(--color-text)">${escape_html(ind.name)}</h3> <p class="text-sm leading-relaxed font-300" style="color: var(--color-muted)">${escape_html(ind.desc)}</p> <div class="mt-6 w-6 h-px transition-all duration-300 group-hover:w-12" style="background: var(--color-accent)"></div></div>`);
- }
- $$renderer2.push(`<!--]--></div></div></section> <section id="signals" class="py-20 sm:py-32 px-6" style="background: var(--color-surface)"><div class="max-w-6xl mx-auto"><div class="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-20 items-center"><div><div class="section-tag reveal">03 / Intelligence</div> <h2 class="font-heading font-600 leading-[1.1] mb-6 reveal" style="font-size: clamp(1.9rem, 4vw, 3rem); color: var(--color-text);">The Signal<br/>Over the Noise.</h2> <div class="accent-bar reveal delay-1"></div> <p class="font-300 leading-relaxed mb-8 reveal delay-1" style="color: var(--color-muted)">Our custom-built extraction engines harvest alternative data from disparate global sources.
- We transform raw, unstructured information into high-fidelity intelligence that predicts
- market shifts, mitigates risk, and front-runs economic trends.</p> <div class="space-y-3 reveal delay-2"><!--[-->`);
- const each_array_4 = ensure_array_like(sources);
- for (let $$index_4 = 0, $$length = each_array_4.length; $$index_4 < $$length; $$index_4++) {
- let src = each_array_4[$$index_4];
- $$renderer2.push(`<div class="flex items-center gap-3 text-sm font-300" style="color: var(--color-muted)"><span class="w-1.5 h-1.5 rounded-full shrink-0" style="background: var(--color-accent)"></span> ${escape_html(src)}</div>`);
- }
- $$renderer2.push(`<!--]--></div></div> <div class="reveal delay-2"><div class="relative overflow-hidden rounded-sm" style="border: 1px solid var(--color-border); background: var(--color-card);"><div class="flex items-center gap-2 px-4 py-3" style="background: var(--color-surface); border-bottom: 1px solid var(--color-border);"><span class="w-2.5 h-2.5 rounded-full" style="background: #3d5470"></span> <span class="w-2.5 h-2.5 rounded-full" style="background: #3d5470"></span> <span class="w-2.5 h-2.5 rounded-full" style="background: var(--color-accent-dim)"></span> <span class="ml-3 font-mono text-[0.62rem] tracking-widest uppercase" style="color: var(--color-dim)">SIGNAL_STREAM — LIVE</span> <span class="ml-auto w-1.5 h-1.5 rounded-full" style="background: var(--color-accent); animation: cursor-blink 1.2s ease-in-out infinite;"></span></div> <div class="h-72 overflow-hidden relative" style="font-family: var(--font-mono); font-size: 0.65rem; line-height: 1.6;"><div style="animation: scroll-data 22s linear infinite; will-change: transform;"><!--[-->`);
- const each_array_5 = ensure_array_like(Array(2));
- for (let $$index_6 = 0, $$length = each_array_5.length; $$index_6 < $$length; $$index_6++) {
- each_array_5[$$index_6];
- $$renderer2.push(`<!--[-->`);
- const each_array_6 = ensure_array_like([
- {
- t: "INF-FIN",
- id: "F-2847",
- sig: "▲ 0.0391",
- label: "HFT flow delta",
- color: "#38bdf8"
- },
- {
- t: "INF-BLK",
- id: "B-0192",
- sig: "● 0.8812",
- label: "Chain liquidity depth",
- color: "#0ea5e9"
- },
- {
- t: "INF-GEO",
- id: "G-5531",
- sig: "▼ 0.1204",
- label: "Satellite port activity",
- color: "#7a9ab5"
- },
- {
- t: "INF-SEN",
- id: "S-3901",
- sig: "▲ 0.6670",
- label: "Deep-web sentiment",
- color: "#38bdf8"
- },
- {
- t: "INF-LOG",
- id: "L-0044",
- sig: "● 0.2219",
- label: "Shipping manifest delta",
- color: "#0ea5e9"
- },
- {
- t: "INF-FIN",
- id: "F-7730",
- sig: "▲ 0.9102",
- label: "Regulatory signal burst",
- color: "#38bdf8"
- },
- {
- t: "INF-BLK",
- id: "B-4421",
- sig: "▼ 0.0503",
- label: "Token velocity shift",
- color: "#7a9ab5"
- },
- {
- t: "INF-GEO",
- id: "G-8820",
- sig: "● 0.4497",
- label: "Cross-border flow map",
- color: "#0ea5e9"
- },
- {
- t: "INF-CON",
- id: "C-1182",
- sig: "▲ 0.7731",
- label: "Consumer spend velocity",
- color: "#38bdf8"
- },
- {
- t: "INF-SEN",
- id: "S-2210",
- sig: "▼ 0.3308",
- label: "Alt-data feed ingested",
- color: "#7a9ab5"
- },
- {
- t: "INF-FIN",
- id: "F-9944",
- sig: "● 0.5561",
- label: "ESG metrics validated",
- color: "#0ea5e9"
- },
- {
- t: "INF-LOG",
- id: "L-3378",
- sig: "▲ 0.1834",
- label: "Supply chain deviation",
- color: "#38bdf8"
- }
- ]);
- for (let $$index_5 = 0, $$length2 = each_array_6.length; $$index_5 < $$length2; $$index_5++) {
- let row = each_array_6[$$index_5];
- $$renderer2.push(`<div class="flex items-center gap-3 px-5 py-1.5" style="border-bottom: 1px solid rgba(22,36,54,0.6)"><span style="color: var(--color-dim); width: 5rem; shrink: 0">${escape_html(row.t)}</span> <span style="color: var(--color-accent); opacity: 0.5; width: 5rem;">${escape_html(row.id)}</span> <span${attr_style(`color: ${stringify(row.color)}; width: 5.5rem; font-weight: 500;`)}>${escape_html(row.sig)}</span> <span style="color: var(--color-muted); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">${escape_html(row.label)}</span></div>`);
- }
- $$renderer2.push(`<!--]-->`);
- }
- $$renderer2.push(`<!--]--></div></div> <div class="flex items-center justify-between px-4 py-2.5" style="background: var(--color-surface); border-top: 1px solid var(--color-border);"><span class="font-mono text-[0.6rem] tracking-widest" style="color: var(--color-dim)">SIGNALS VALIDATED</span> <span class="font-mono text-[0.6rem]" style="color: var(--color-accent)">◆ SECURE</span></div></div></div></div></div></section> <section id="advantage" class="py-20 sm:py-32 px-6" style="background: var(--color-bg)"><div class="max-w-6xl mx-auto"><div class="section-tag reveal">04 / Advantage</div> <h2 class="font-heading font-600 leading-tight mb-16 reveal" style="font-size: clamp(1.9rem, 4vw, 3rem); color: var(--color-text);">The Keystone Advantage.</h2> <div class="grid grid-cols-1 sm:grid-cols-2 gap-x-12 gap-y-10"><!--[-->`);
- const each_array_7 = ensure_array_like(advantages);
- for (let i = 0, $$length = each_array_7.length; i < $$length; i++) {
- let adv = each_array_7[i];
- $$renderer2.push(`<div${attr_class(`pt-8 reveal delay-${stringify(i % 4 + 1)}`)} style="border-top: 1px solid var(--color-border)"><div class="font-mono text-[0.62rem] tracking-[0.2em] mb-3" style="color: var(--color-accent); opacity: 0.5">0${escape_html(i + 1)}</div> <h3 class="font-heading font-600 text-xl mb-3" style="color: var(--color-text)">${escape_html(adv.title)}</h3> <p class="text-sm leading-relaxed font-300" style="color: var(--color-muted)">${escape_html(adv.desc)}</p></div>`);
- }
- $$renderer2.push(`<!--]--></div></div></section> <section id="contact" class="py-20 sm:py-32 px-6" style="background: var(--color-surface)"><div class="max-w-3xl mx-auto"><div class="section-tag reveal">05 / Contact</div> <h2 class="font-heading font-600 leading-[1.1] mb-4 reveal" style="font-size: clamp(1.9rem, 4vw, 3rem); color: var(--color-text);">Initiate Your Intelligence<br/>Requirement.</h2> <p class="font-300 mb-10 reveal delay-1" style="color: var(--color-muted)">Secure your advantage today. All inquiries treated with absolute discretion.</p> <div class="inline-flex items-center gap-2.5 mb-10 px-4 py-2.5 reveal delay-1" style="border: 1px solid var(--color-border); background: var(--color-accent-glow);"><svg width="12" height="14" viewBox="0 0 12 14" fill="none" xmlns="http://www.w3.org/2000/svg" style="color: var(--color-accent); flex-shrink: 0;"><path d="M6 0L0.5 2.5V6.5C0.5 9.7 2.9 12.7 6 13.5C9.1 12.7 11.5 9.7 11.5 6.5V2.5L6 0Z" fill="currentColor" fill-opacity="0.2" stroke="currentColor" stroke-width="0.8"></path><path d="M4 7L5.5 8.5L8.5 5.5" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"></path></svg> <span class="font-mono text-[0.6rem] tracking-[0.2em] uppercase" style="color: var(--color-muted)">SSL Encrypted · Confidential · Zero Disclosure</span></div> `);
- {
- $$renderer2.push("<!--[-1-->");
- $$renderer2.push(`<form class="space-y-5 reveal delay-2"><div class="grid grid-cols-1 sm:grid-cols-2 gap-5"><div><label class="field-label" for="name">Full Name</label> <input id="name" type="text" required="" placeholder="John Smith" class="field-input"/></div> <div><label class="field-label" for="email">Corporate Email</label> <input id="email" type="email" required="" placeholder="j.smith@company.com" class="field-input"/></div></div> <div class="grid grid-cols-1 sm:grid-cols-2 gap-5"><div><label class="field-label" for="industry">Industry</label> <select id="industry" class="field-input">`);
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Finance & Fintech`);
- });
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Entertainment & Media`);
- });
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Blockchain & Digital Assets`);
- });
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Consumer Sales & Retail`);
- });
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Other`);
- });
- $$renderer2.push(`</select></div> <div><label class="field-label" for="inquiry">Inquiry Type</label> <select id="inquiry" class="field-input">`);
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Data Sourcing`);
- });
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Signal Brokerage`);
- });
- $$renderer2.option({}, ($$renderer3) => {
- $$renderer3.push(`Strategic Consulting`);
- });
- $$renderer2.push(`</select></div></div> <div><label class="field-label" for="message">Intelligence Requirement</label> <textarea id="message" rows="5" placeholder="Briefly outline your data requirements, target market, and timeframe." class="field-input resize-none"></textarea></div> <div class="pt-2"><button type="submit"${attr("disabled", formState === "sending", true)} class="btn-primary w-full sm:w-auto justify-center sm:justify-start"${attr_style("")}>${escape_html("Submit Secure Inquiry →")}</button></div></form>`);
- }
- $$renderer2.push(`<!--]--></div></section> <footer class="px-6 py-14" style="background: var(--color-bg); border-top: 1px solid var(--color-border);"><div class="max-w-6xl mx-auto"><div class="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-8 mb-10"><div><div class="flex items-center gap-2.5 mb-2"><span style="color: var(--color-accent)">◆</span> <span class="font-heading font-600 text-sm tracking-[0.18em] uppercase" style="color: var(--color-text)">KeystoneIntel</span></div> <p class="font-mono text-[0.62rem] tracking-wider" style="color: var(--color-dim)">DATA INTELLIGENCE · SIGNAL BROKERAGE · STRATEGIC ADVANTAGE</p></div> <div class="flex flex-wrap gap-6"><!--[-->`);
- const each_array_8 = ensure_array_like(navLinks);
- for (let $$index_8 = 0, $$length = each_array_8.length; $$index_8 < $$length; $$index_8++) {
- let link = each_array_8[$$index_8];
- $$renderer2.push(`<a${attr("href", link.href)} class="font-mono text-[0.65rem] tracking-[0.15em] uppercase no-underline transition-colors hover:text-accent" style="color: var(--color-dim)">${escape_html(link.label)}</a>`);
- }
- $$renderer2.push(`<!--]--> <a href="#contact" class="font-mono text-[0.65rem] tracking-[0.15em] uppercase no-underline transition-colors hover:text-accent" style="color: var(--color-dim)">Contact</a></div></div> <div class="h-px mb-8" style="background: linear-gradient(to right, var(--color-border), transparent)"></div> <div class="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3"><p class="font-mono text-[0.6rem] tracking-wider" style="color: var(--color-dim)">© ${escape_html((/* @__PURE__ */ new Date()).getFullYear())} KEYSTONEINTEL. ALL RIGHTS RESERVED.</p> <a href="https://digitalmar.dev" target="_blank" rel="noopener noreferrer" class="font-mono text-[0.6rem] no-underline transition-colors hover:text-muted" style="color: var(--color-dim)">Made by digitalmar.dev</a></div></div></footer>`);
- });
- }
- export {
- _page as default
- };
|