// Hero — animated document → extracted data → emission report function Hero({ t }) { const narrow = window.useNarrow(768); return (
{/* faint grid background */}
{t.kicker}

{t.title_a}
{t.title_b}{" "} {t.title_c}

{t.sub}

{t.cta} → {t.cta_b}
{t.meta}
{narrow ? (
) : (
)}
); } // Three-stage diorama: invoice → extracted rows → emission report. // Subtle continuous animation; respects prefers-reduced-motion. function HeroAnim() { const [stage, setStage] = React.useState(0); const [hovered, setHovered] = React.useState(null); // 0|1|2|null React.useEffect(() => { const reduced = window.matchMedia("(prefers-reduced-motion: reduce)").matches; if (reduced) { setStage(2); return; } if (hovered !== null) return; // pause auto-cycle when hovering let i = stage; const tick = () => { i = (i + 1) % 3; setStage(i); }; const id = setInterval(tick, 2400); return () => clearInterval(id); }, [hovered]); const activeIndex = hovered !== null ? hovered : stage; return (
{/* Connectors */} {/* Document card — back-left */}
setHovered(0)} onMouseLeave={() => setHovered(null)} style={{ position: "absolute", inset: 0 }}>
setHovered(1)} onMouseLeave={() => setHovered(null)} style={{ position: "absolute", inset: 0 }}>
setHovered(2)} onMouseLeave={() => setHovered(null)} style={{ position: "absolute", inset: 0 }}>
); } function _UnusedHeroAnimRest() { return null; } function CardShell({ children, style, active, label }) { return (
{label}
{children}
); } function DocCard({ active }) { return (
[ENERJİ TEDARİKÇİSİ] · Sanayi Tarifesi
ÖRNEK
2.847.392 kWh}/>
{Array.from({ length: 5 }).map((_, i) => ( ))}
); } function Row({ label, v }) { return (
{label} {v}
); } function Highlight({ active, children }) { return ( {children} ); } function ExtractCard({ active }) { return (
{[ { f: "kWh consumption", val: "2,847,392", conf: 99, src: "p.4 · table 2" }, { f: "Period start", val: "2025-07-01", conf: 99, src: "p.1 · header" }, { f: "Period end", val: "2025-09-30", conf: 99, src: "p.1 · header" }, { f: "Facility ID", val: "TR-KOC-0042", conf: 87, src: "p.1 · footer", review: true }, { f: "Grid factor", val: "0.4421 kgCO₂/kWh", conf: 100, src: "TEİAŞ 2024" }, ].map((r, i) => (
{r.f}
{r.src}
{r.val}
95 ? "var(--ink-3)" : "var(--warn)"), minWidth: 36, textAlign: "right", }}> {r.review ? "REVIEW" : `${r.conf}%`}
))} {/* compute beam when active */} {active && (
)}
); } function ReportCard({ active }) { return (
Scope 2 · Location-based
1.258,9 tCO₂e
Q3 2025 · 1 facility · location-based
{/* mini bars */}
{[0.3, 0.45, 0.4, 0.6, 0.55, 0.7, 0.8, 0.65, 0.75, 0.9, 0.85, 1].map((h, i) => (
))}
OCAEYL '25
{/* footer ribbon */}
TSRS-2 · 29-32(c) READY ✓
); } window.Hero = Hero;