// guardCity shared — paleta DirectLuz-aligned (azul royal + noite), módulos, cena cinematográfica.
const GC = {
ink: '#070809', // base mais profunda
midnight: '#0C0D0F', // hero bg
navy: '#131517', // panels
steel: '#23262B', // borders
iron: '#2F3339', // emphasis-low
fog: '#7A828B', // muted
cloud: '#D8DCE0', // body
bone: '#F2F4F6', // bright UI
white: '#FFFFFF',
// Acentos = monocromáticos (white-driven)
blue: '#FFFFFF', // (alias) acento principal = branco puro
blueLight: '#F2F4F6', // (alias) soft accent
blueGlow: '#FFFFFF', // (alias) glow accent
amber: '#D8DCE0', // (alias) "luz" = cinza claro neutro, sem cor
};
const GC_MODULES = [
{ key: 'viewguard', name: 'ViewGuard', role: 'VMS · Vídeo', pitch: 'Vídeo gerenciado de ponta a ponta. Multi-stream, multi-câmera, multi-cidade.', icon: 'assets/viewguard-icon.svg', accent: '#10b981' },
{ key: 'faceguard', name: 'FaceGuard', role: 'IA · Reconhecimento', pitch: 'Reconhecimento facial em tempo real, com cadeia de custódia e governança LGPD.', icon: 'assets/faceguard-aperture-icon.png', accent: '#10b981' },
{ key: 'cityguard', name: 'CityGuard', role: 'OMS · Operações', pitch: 'Despacho, patrulhamento e gestão de incidentes integrados ao VMS.', icon: 'assets/cityguard-icon.svg', accent: '#f59e0b' },
{ key: 'directluz', name: 'DirectLuz', role: 'Iluminação Pública', pitch: 'Telegestão de iluminação pública. Postes, luminárias, ordens de serviço e equipes de campo.', icon: 'assets/directluz-icon.png', accent: '#4169e8' },
];
// Cena cinematográfica: skyline → postes → luz/câmeras → feixes → nodes → logo guardCity.
// 6 atos sincronizados ao scroll progress 0→1.
function CityScene({ progress }) {
const p = Math.max(0, Math.min(1, progress));
const seg = (a, b) => Math.max(0, Math.min(1, (p - a) / (b - a)));
const ease = t => t < .5 ? 2*t*t : 1 - Math.pow(-2*t+2, 2)/2;
const easeOut = t => 1 - Math.pow(1 - t, 3);
const easeBack = t => {
const c1 = 1.70158, c3 = c1 + 1;
return 1 + c3 * Math.pow(t - 1, 3) + c1 * Math.pow(t - 1, 2);
};
// Atos
const skyline = ease(seg(0.00, 0.16)); // 0-16%
const poles = ease(seg(0.10, 0.32)); // 10-32%
const lights = ease(seg(0.28, 0.50)); // 28-50%
const cams = ease(seg(0.42, 0.60)); // 42-60%
const beams = ease(seg(0.52, 0.74)); // 52-74%
// Daylight: cresce conforme luzes acendem; postes acendem BRANCO sobre cinza-noite
const daylight = ease(seg(0.30, 0.78)); // 30-78%: cinza-noite → cinza-dia
// Final ato: cena dissolve TOTAL + logo blades montam
const sceneFade = ease(seg(0.70, 0.88)); // cena fade-out 70-88%
const logoIn = ease(seg(0.74, 1.00)); // blades fly-in 74-100% (mais tempo p/ montar)
const sceneOpacity = 1 - sceneFade; // some por inteiro
const sceneScale = 1 - sceneFade * 0.12;
const logoOpacity = logoIn;
const logoScale = 0.6 + easeOut(logoIn) * 0.45;
// Final morph: blades fade out as real PNG logo takes over (handled by parent)
const bladesFade = ease(seg(0.90, 0.98)); // blades fade out as crisp PNG takes over
// Lerp helper for color interpolation
const lerpHex = (a, b, t) => {
const pa = [parseInt(a.slice(1,3),16), parseInt(a.slice(3,5),16), parseInt(a.slice(5,7),16)];
const pb = [parseInt(b.slice(1,3),16), parseInt(b.slice(3,5),16), parseInt(b.slice(5,7),16)];
const r = Math.round(pa[0] + (pb[0]-pa[0])*t);
const g = Math.round(pa[1] + (pb[1]-pa[1])*t);
const bl = Math.round(pa[2] + (pb[2]-pa[2])*t);
return `rgb(${r},${g},${bl})`;
};
// Day/night palette — STRICT GREYSCALE: noite cinza-escuro → "dia" cinza claro neutro
const skyTop = lerpHex('#0A0B0D', '#C8CCD0', daylight);
const skyMid = lerpHex('#101216', '#D8DCE0', daylight);
const skyBottom = lerpHex('#0E1014', '#E8EBEE', daylight);
const bldgTop = lerpHex('#1A1D22', '#8A8E94', daylight);
const bldgBot = lerpHex('#0A0C10', '#6E7278', daylight);
const groundCol = lerpHex('#06080A', '#B8BCC0', daylight);
const lineCol = lerpHex('#23262B', '#9DA1A6', daylight);
// Stars and window lights fade out as day rises
const nightAlpha = 1 - daylight;
// Building skyline data (deterministic). [x, width, height]
const buildings = [
[40, 60, 220], [105, 45, 180], [155, 80, 280], [240, 55, 160],
[300, 70, 240], [375, 90, 320], [470, 50, 200], [525, 65, 260],
[595, 75, 300], [675, 55, 220], [735, 70, 280], [810, 60, 240],
[875, 95, 360], [975, 50, 200], [1030, 70, 260], [1105, 60, 220],
];
// Light pole positions along ground (x positions)
const polePositions = [180, 320, 460, 600, 740, 880, 1020];
return (
);
}
// Module card — DirectLuz-aligned blue accent.
function ModuleCard({ m, mono }) {
return (
{m.name}
{m.pitch}
Conhecer →
);
}
Object.assign(window, { GC, GC_MODULES, CityScene, ModuleCard });