/* global React */ const { useEffect, useRef, useState } = React; /* ---------- Imagery (Unsplash documentary) ---------- */ const IMG = { hero: "https://images.unsplash.com/photo-1509391366360-2e959784a276?auto=format&fit=crop&w=2000&q=80", // solar field wind: "https://images.unsplash.com/photo-1466611653911-95081537e5b7?auto=format&fit=crop&w=1600&q=80", // wind turbines terrain bess: "https://images.unsplash.com/photo-1581092918056-0c4c3acd3789?auto=format&fit=crop&w=1600&q=80", // industrial digital: "https://images.unsplash.com/photo-1558494949-ef010cbdcc31?auto=format&fit=crop&w=1600&q=80", // data center vision: "https://images.unsplash.com/photo-1508514177221-188b1cf16e9d?auto=format&fit=crop&w=2000&q=80", // mountain dawn grid: "https://images.unsplash.com/photo-1473341304170-971dccb5ac1e?auto=format&fit=crop&w=1600&q=80", // transmission lines solar2: "https://images.unsplash.com/photo-1545209463-e2825498edbf?auto=format&fit=crop&w=1600&q=80", // utility-scale solar farm aerial terrain: "https://images.unsplash.com/photo-1470770841072-f978cf4d019e?auto=format&fit=crop&w=2000&q=80", // terrain }; /* ---------- reveal hook ---------- */ function useReveal() { useEffect(() => { const els = document.querySelectorAll(".reveal, .split-word"); const io = new IntersectionObserver((entries) => { entries.forEach((e) => { if (e.isIntersecting) { e.target.classList.add("in"); io.unobserve(e.target); } }); }, { threshold: 0.15, rootMargin: "0px 0px -60px 0px" }); els.forEach((el) => io.observe(el)); return () => io.disconnect(); }, []); } /* Word-splitter that outputs inline spans with stagger */ function SplitHeading({ text, className = "", as: Tag = "h1", delayStep = 70 }) { const words = text.split(" "); return ( {words.map((w, i) => ( {w} {i < words.length - 1 ? " " : ""} ))} ); } /* ---------- NAV ---------- */ function Nav({ onSignIn }) { const [scrolled, setScrolled] = useState(false); const [lang, setLang] = useState("ES"); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 24); onScroll(); window.addEventListener("scroll", onScroll, { passive: true }); return () => window.removeEventListener("scroll", onScroll); }, []); return (
CINFRA
); } function Monogram({ size = 28 }) { return ( ); } /* ---------- HERO ---------- */ function Hero({ treatment }) { return (
{treatment === "photo" && (
)}
Consorcio Infraestructura

Una plataforma con visión de largo plazo, orientada a oportunidades selectivas en transición energética, infraestructura estratégica y nuevas tecnologías.

Contacto Conocer más
{/* Stat strip */}
{[ ["Horizonte", "Largo plazo"], ["Foco", "Calidad selectiva"], ["Sectores", "Energía · Digital"], ["Geografía", "Latinoamérica"], ].map(([k, v], i) => (
{k}
{v}
))}
{/* Scroll indicator */}
Scroll
); } /* ---------- ENFOQUE ---------- */ const FOCUS = [ { num: "01", title: "Activos renovables", body: "Interés en oportunidades vinculadas a generación y almacenamiento de energía, con foco en activos de alta calidad y desempeño de largo plazo.", img: IMG.solar2, tags: ["Solar", "Eólica", "BESS"], }, { num: "02", title: "Diversidad tecnológica", body: "Apertura a distintos vectores de infraestructura sostenible, incluyendo solar, almacenamiento en baterías, eólica y otras tecnologías complementarias.", img: IMG.wind, tags: ["Transición", "Híbridos", "Almacenamiento"], }, { num: "03", title: "Nuevas infraestructuras", body: "Exploración de sectores con alto potencial estratégico, incluyendo infraestructura digital y plataformas asociadas a tendencias estructurales de largo plazo.", img: IMG.digital, tags: ["Digital", "Data centers", "Fibra"], }, ]; function FocusEditorial() { const [hovered, setHovered] = useState(0); return (
{/* Left — heading + list */}
— Enfoque

Una plataforma sobria, moderna y preparada para crecer.

{FOCUS.map((f, i) => { const isActive = hovered === i; return (
setHovered(i)} >
{f.num}

{f.title}

{f.body}

{f.tags.map((t) => ( {t} ))}
); })}
{/* Right — image preview */}
{FOCUS.map((f, i) => (
))}
Referencia visual
{FOCUS[hovered].title}
{FOCUS[hovered].num}
); } /* Original 3-card grid variant */ function FocusGrid() { return (
— Enfoque

Una plataforma sobria, moderna y preparada para crecer.

{FOCUS.map((f, i) => (
{f.num}

{f.title}

{f.body}

))}
); } /* ---------- SECTORES marquee ---------- */ const SECTORS = [ { name: "Solar", img: IMG.solar2, meta: "Generación fotovoltaica" }, { name: "Eólica", img: IMG.wind, meta: "Onshore · Latinoamérica" }, { name: "BESS", img: IMG.bess, meta: "Almacenamiento en baterías" }, { name: "Transmisión", img: IMG.grid, meta: "Infraestructura de red" }, { name: "Digital", img: IMG.digital, meta: "Data centers · Fibra" }, { name: "Terreno", img: IMG.terrain, meta: "Desarrollo greenfield" }, ]; function Sectores({ imageryOn }) { const [paused, setPaused] = useState(false); const [hovered, setHovered] = useState(null); return (
— Sectores

Vectores donde exploramos oportunidades.

Apertura a distintos vectores de infraestructura sostenible y plataformas asociadas a tendencias estructurales de largo plazo.

setPaused(true)} onMouseLeave={() => { setPaused(false); setHovered(null); }} style={{ position: "relative", maskImage: "linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%)", WebkitMaskImage: "linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%)", }}>
{[...SECTORS, ...SECTORS].map((s, i) => (
setHovered(i)} style={{ position: "relative", flex: "0 0 auto", width: 360, height: 460, borderRadius: 4, overflow: "hidden", background: "var(--ink)", cursor: "pointer", filter: hovered !== null && hovered !== i ? "grayscale(60%) brightness(0.75)" : "none", transform: hovered === i ? "scale(1.02)" : "scale(1)", transition: "filter .5s ease, transform .5s cubic-bezier(.2,.7,.2,1)", }}> {imageryOn ? (
) : (
)}
{String(((i % SECTORS.length) + 1)).padStart(2, "0")} · Sector
{s.name}
{s.meta}
))}
); } /* ---------- VISIÓN (dark parallax) ---------- */ function Vision() { const ref = useRef(null); const [offset, setOffset] = useState(0); useEffect(() => { const onScroll = () => { if (!ref.current) return; const rect = ref.current.getBoundingClientRect(); const vh = window.innerHeight; const progress = (vh - rect.top) / (vh + rect.height); setOffset(Math.max(-0.1, Math.min(1.1, progress)) * 80 - 40); }; onScroll(); window.addEventListener("scroll", onScroll, { passive: true }); return () => window.removeEventListener("scroll", onScroll); }, []); return (
— Visión

Una plataforma con visión selectiva y ambición de largo plazo.

CINFRA busca posicionarse en la intersección entre infraestructura, transición energética y nuevas tecnologías, capturando oportunidades que requieran criterio, estructura y capacidad de ejecución.

La propuesta prioriza calidad sobre volumen, relaciones de largo plazo y una aproximación disciplinada al desarrollo y gestión de activos.

{[ ["Criterio", "Selectividad disciplinada sobre volumen."], ["Permanencia", "Relaciones y activos de largo plazo."], ["Ejecución", "Capacidad operativa y estructuración."], ["Apertura", "Vectores tecnológicos complementarios."], ].map(([k, v]) => (
{k}
{v}
))}
); } /* ---------- PRESENCIA + CONTACTO (closing) ---------- */ function Closing({ alternation }) { const bg = alternation === "bone" ? "#EFE8D6" : "transparent"; return (
{/* Contacto */}
— Contacto

Para oportunidades, alianzas o mayor información, puedes contactarnos directamente.

{[ ["Correo", "tomas@eolico.cl"], ["Ubicación", "Santiago · Chile"], ].map(([k, v]) => (
{k}
{v}
))}
{/* Footer */}
); } function ContactForm() { const [values, setValues] = useState({ nombre: "", correo: "", mensaje: "" }); const [focused, setFocused] = useState(null); const [sent, setSent] = useState(false); const onChange = (k) => (e) => setValues((v) => ({ ...v, [k]: e.target.value })); const onSubmit = (e) => { e.preventDefault(); if (!values.nombre || !values.correo) return; setSent(true); setTimeout(() => setSent(false), 3500); setValues({ nombre: "", correo: "", mensaje: "" }); }; const Field = ({ k, label, type = "text", area }) => { const active = focused === k || values[k]; const Tag = area ? "textarea" : "input"; return (
setFocused(k)} onBlur={() => setFocused(null)} rows={area ? 3 : undefined} style={{ width: "100%", padding: area ? "28px 0 14px" : "28px 0 14px", border: 0, outline: "none", background: "transparent", color: "var(--ink)", fontFamily: "inherit", fontSize: 17, resize: area ? "none" : undefined, }} />
); }; return (
Al enviar este formulario, aceptas ser contactado por nuestro equipo.
); } /* expose */ Object.assign(window, { Nav, Hero, FocusEditorial, FocusGrid, Sectores, Vision, Closing, useReveal, });