diff --git a/ifttt/home.js b/ifttt/home.js new file mode 100644 index 0000000..77e3057 --- /dev/null +++ b/ifttt/home.js @@ -0,0 +1,75 @@ +(() => { + const prefersReducedMotion = + typeof window !== "undefined" && + window.matchMedia && + window.matchMedia("(prefers-reduced-motion: reduce)").matches; + + const stepEl = document.getElementById("howStep"); + const detailEl = document.getElementById("howDetail"); + if (!stepEl || !detailEl) return; + + const steps = [ + { + step: "1) You write the confidential document.", + detail: "Keep the source private. Don’t publish it to “prove” it exists.", + }, + { + step: "2) Your system produces an output.", + detail: "A summary, decision, report, message, or answer.", + }, + { + step: "3) IF.Trace binds source → output.", + detail: "Hashes + trace id + proof links (so evidence can be checked later).", + }, + { + step: "4) You share proof, not your raw data.", + detail: "Third parties verify without needing your accounts or logins.", + }, + { + step: "5) If there’s no trace, it’s not trustworthy.", + detail: "A simple rule that survives vendors, contractors, and audits.", + }, + ]; + + const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms)); + + async function typeInto(el, text, opts = {}) { + const minDelayMs = opts.minDelayMs ?? 12; + const maxDelayMs = opts.maxDelayMs ?? 26; + + el.textContent = ""; + for (let idx = 0; idx < text.length; idx += 1) { + el.textContent += text[idx]; + const jitter = Math.floor(Math.random() * (maxDelayMs - minDelayMs + 1)); + await sleep(minDelayMs + jitter); + } + } + + async function run() { + if (prefersReducedMotion) { + const first = steps[0]; + stepEl.textContent = first.step; + detailEl.textContent = first.detail; + return; + } + + let idx = 0; + // eslint-disable-next-line no-constant-condition + while (true) { + const current = steps[idx % steps.length]; + await typeInto(stepEl, current.step); + await sleep(120); + await typeInto(detailEl, current.detail, { minDelayMs: 8, maxDelayMs: 18 }); + await sleep(2200); + + stepEl.textContent = ""; + detailEl.textContent = ""; + await sleep(240); + + idx += 1; + } + } + + void run(); +})(); + diff --git a/ifttt/index.html b/ifttt/index.html index 1188912..d729d02 100644 --- a/ifttt/index.html +++ b/ifttt/index.html @@ -3,15 +3,15 @@ - IF.Trace — Open Verification for AI Governance + IF.Trace — Open Verification - + @@ -21,39 +21,49 @@ - -
-
-
-

- Traceable - Transparent - Trustworthy -

+ +
+
+ IF.Trace + +
+
+ +
+
+
+
+ IF.Transparent + + IF.Traceable + + IF.Trustworthy +
+ +

IF.Trace

+

Confidential documents > open verification

+

3rd party unfalsifiable audit trails.

+ +
+
How it works
+
+
+
+ +
+
-
-
-
- IF.Trace - · - Verticals - Public Sector - Enterprise - Research - Professional - Healthcare - Financial - Legal -
-
- Developer - | - API -
-
-
+ contact + + diff --git a/ifttt/pricing/index.html b/ifttt/pricing/index.html new file mode 100644 index 0000000..d281c05 --- /dev/null +++ b/ifttt/pricing/index.html @@ -0,0 +1,65 @@ + + + + + + IF.Trace — Pricing + + + + + + + +
+
+ IF.Trace + +
+
+ +
+
+
+
+ IF.Transparent + + IF.Traceable + + IF.Trustworthy +
+ +

Pricing

+

A simple model, on purpose.

+

If you need audit‑ready verification, we price by risk and responsibility.

+ +
+
Early access
+
+
What we charge for
+
+ Setup + governance configuration, integration support, and proof‑surface hardening. +
+
What we do not charge for
+
+ “Per‑click” pricing for verification. Third‑party checking should stay cheap. +
+
+ To discuss scope, email + ds@infrafabric.io. +
+
+
+
+
+
+ + contact + + diff --git a/ifttt/style.css b/ifttt/style.css index 380eb8e..be7c4c0 100644 --- a/ifttt/style.css +++ b/ifttt/style.css @@ -1071,3 +1071,323 @@ body.home--minimal .homeMain { font-size: clamp(38px, 10vw, 54px); } } + +/* Homepage (Sigstore-ish, dark mode) */ +body.home--sig { + padding-bottom: 0; + color: #e5e7eb; + background: + radial-gradient(900px 520px at 18% 10%, rgba(56, 189, 248, 0.16), transparent 62%), + radial-gradient(900px 520px at 82% 16%, rgba(34, 197, 94, 0.12), transparent 62%), + radial-gradient(1100px 620px at 50% 86%, rgba(245, 158, 11, 0.10), transparent 62%), + linear-gradient(180deg, #050812 0%, #0b1220 55%, #050812 100%); +} + +body.home--sig a { + color: rgba(226, 232, 240, 0.92); +} + +body.home--sig a:hover { + text-decoration: none; +} + +.sigNav { + position: fixed; + left: 0; + right: 0; + top: 18px; + z-index: 60; + pointer-events: none; +} + +.sigNav__inner { + pointer-events: auto; + position: relative; + display: flex; + align-items: center; + justify-content: space-between; + gap: 14px; + padding: 10px 14px; + border-radius: 18px; + border: 1px solid rgba(255, 255, 255, 0.14); + background: rgba(11, 18, 32, 0.55); + backdrop-filter: blur(14px) saturate(140%); + box-shadow: + 0 1px 0 rgba(255, 255, 255, 0.06), + 0 26px 80px rgba(0, 0, 0, 0.55); + overflow: hidden; +} + +/* “Traffic” background (subtle R/A/G glow) behind the frosted nav only */ +.sigNav__inner::before { + content: ""; + position: absolute; + inset: -70%; + z-index: 0; + opacity: 0.95; + background: + radial-gradient(circle at 16% 52%, rgba(239, 68, 68, 0.26) 0, transparent 44%), + radial-gradient(circle at 50% 48%, rgba(245, 158, 11, 0.22) 0, transparent 46%), + radial-gradient(circle at 84% 50%, rgba(34, 197, 94, 0.20) 0, transparent 46%), + radial-gradient(circle at 34% 38%, rgba(59, 130, 246, 0.12) 0, transparent 46%), + radial-gradient(circle at 68% 62%, rgba(147, 197, 253, 0.10) 0, transparent 46%), + linear-gradient( + 90deg, + rgba(255, 255, 255, 0.00) 0%, + rgba(255, 255, 255, 0.06) 45%, + rgba(255, 255, 255, 0.00) 70% + ); + filter: blur(12px); + transform: translateX(-8%); + animation: sigTraffic 12s linear infinite; +} + +@keyframes sigTraffic { + 0% { + transform: translateX(-10%) translateY(0); + } + 50% { + transform: translateX(10%) translateY(-2%); + } + 100% { + transform: translateX(-10%) translateY(0); + } +} + +.sigNav__inner > * { + position: relative; + z-index: 1; +} + +.sigBrand { + font-weight: 900; + letter-spacing: -0.01em; + color: rgba(255, 255, 255, 0.96); + padding: 8px 10px; + border-radius: 14px; +} + +.sigBrand:hover { + background: rgba(255, 255, 255, 0.06); +} + +.sigLinks { + display: flex; + align-items: center; + gap: 10px; + font-size: 13px; + letter-spacing: 0.01em; + flex-wrap: wrap; + justify-content: flex-end; +} + +.sigLinks a { + color: rgba(226, 232, 240, 0.88); + padding: 8px 10px; + border-radius: 14px; + border: 1px solid transparent; +} + +.sigLinks a:hover { + border-color: rgba(255, 255, 255, 0.12); + background: rgba(255, 255, 255, 0.06); +} + +.sigLinks__sep { + color: rgba(226, 232, 240, 0.42); + user-select: none; +} + +.sigMain { + min-height: 100vh; + display: flex; + align-items: center; + padding: 120px 0 80px; +} + +.sigMain__inner { + width: 100%; +} + +.sigHero { + text-align: center; + max-width: 980px; + margin: 0 auto; +} + +.sigCycle { + display: inline-flex; + align-items: center; + gap: 10px; + font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; + font-size: 13px; + color: rgba(226, 232, 240, 0.70); + letter-spacing: 0.01em; + margin: 0 0 18px; + user-select: none; +} + +.sigCycle__sep { + color: rgba(226, 232, 240, 0.35); +} + +.sigCycle__item { + opacity: 0.45; + transition: + opacity 220ms ease, + color 220ms ease; + animation: sigCycleFocus 9s infinite; +} + +.sigCycle__item--1 { + animation-delay: 0s; +} + +.sigCycle__item--2 { + animation-delay: 3s; +} + +.sigCycle__item--3 { + animation-delay: 6s; +} + +@keyframes sigCycleFocus { + 0%, + 22% { + opacity: 1; + color: rgba(255, 255, 255, 0.96); + text-shadow: 0 0 22px rgba(56, 189, 248, 0.22); + } + 33%, + 100% { + opacity: 0.38; + color: rgba(226, 232, 240, 0.62); + text-shadow: none; + } +} + +.sigTitle { + margin: 0 0 10px; + font-size: clamp(54px, 7.2vw, 92px); + line-height: 1.02; + letter-spacing: -0.03em; + font-weight: 920; + color: rgba(255, 255, 255, 0.96); +} + +.sigTitle--sub { + font-size: clamp(40px, 5.6vw, 64px); +} + +.sigTag { + margin: 0 0 8px; + font-size: 18px; + color: rgba(226, 232, 240, 0.80); +} + +.sigSub { + margin: 0; + font-size: 14px; + color: rgba(226, 232, 240, 0.62); +} + +.sigHow { + margin-top: 28px; +} + +.sigHow__kicker { + font-size: 11px; + font-weight: 850; + letter-spacing: 0.12em; + text-transform: uppercase; + color: rgba(226, 232, 240, 0.55); + margin: 0 0 10px; +} + +.sigHow__panel { + max-width: 920px; + margin: 0 auto; + text-align: left; + padding: 16px 16px; + border-radius: 18px; + border: 1px solid rgba(255, 255, 255, 0.14); + background: rgba(15, 23, 42, 0.38); + backdrop-filter: blur(10px) saturate(140%); + box-shadow: + 0 1px 0 rgba(255, 255, 255, 0.05), + 0 22px 70px rgba(0, 0, 0, 0.50); +} + +.sigHow__line { + font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; + font-size: 14px; + line-height: 1.55; +} + +.sigHow__line--step { + color: rgba(255, 255, 255, 0.92); +} + +.sigHow__line--detail { + color: rgba(226, 232, 240, 0.70); + margin-top: 10px; +} + +.sigHow__caret { + width: 10px; + height: 18px; + border-radius: 3px; + background: rgba(226, 232, 240, 0.72); + margin-top: 12px; + animation: caretblink 1s steps(1, end) infinite; +} + +.sigContact { + position: fixed; + right: 18px; + bottom: 18px; + z-index: 65; + padding: 10px 12px; + border-radius: 16px; + border: 1px solid rgba(255, 255, 255, 0.14); + background: rgba(11, 18, 32, 0.55); + backdrop-filter: blur(14px) saturate(140%); + box-shadow: + 0 1px 0 rgba(255, 255, 255, 0.06), + 0 22px 70px rgba(0, 0, 0, 0.55); + color: rgba(226, 232, 240, 0.90); + font-size: 12px; + font-weight: 750; + letter-spacing: 0.02em; +} + +.sigContact:hover { + border-color: rgba(255, 255, 255, 0.22); + background: rgba(11, 18, 32, 0.66); +} + +@media (max-width: 980px) { + .sigNav { + top: 12px; + } + .sigNav__inner { + border-radius: 16px; + } + .sigMain { + padding-top: 108px; + } + .sigTag { + font-size: 16px; + } +} + +@media (prefers-reduced-motion: reduce) { + .sigNav__inner::before { + animation: none; + } + .sigCycle__item { + animation: none; + opacity: 1; + color: rgba(226, 232, 240, 0.86); + } +}