/* MONOLITH — Bold editorial black + orange */ function MonolithHero({ accent }) { const mouse = useMouse(); const scroll = useScroll(); const [elRef, progress] = useElementScroll(); const [statsRef, statsVisible] = useReveal(); // fake live metrics (CLP realistas: ~$3.5M CLP/día entre todos los clientes, miles de conversiones/día) const [roas, setRoas] = useState(4.82); const [spend, setSpend] = useState(3_485_000); const [convs, setConvs] = useState(2847); const [ctr, setCtr] = useState(7.2); useEffect(() => { const id = setInterval(() => { setRoas(r => Math.max(3.8, Math.min(6.2, r + (Math.random() - 0.5) * 0.12))); setSpend(s => s + Math.round(Math.random() * 4800)); setConvs(c => c + Math.round(1 + Math.random() * 3)); setCtr(v => Math.max(5.0, Math.min(9.0, v + (Math.random() - 0.5) * 0.25))); }, 900); return () => clearInterval(id); }, []); // Bars for chart const bars = useMemo(() => Array.from({length:28},(_,i)=>({ h: 20 + Math.sin(i * 0.4) * 18 + Math.random() * 40 + i * 1.8, active: i > 20, })), []); const parallaxY = scroll.y * 0.3; const mx = mouse.rx * 20; const my = mouse.ry * 20; return (
{/* Grid lines bg */}
{/* Huge background type */}
{/* Left: headline */}
[ EN VIVO ] Campañas activas · Santiago, CL

Publicidad
que convierte .
Sin promesas, con resultados.

{CONTENT.heroSub}

{e.currentTarget.style.background='transparent';e.currentTarget.style.color=accent;}} onMouseLeave={e=>{e.currentTarget.style.background=accent;e.currentTarget.style.color='#0a0a0a';}}> Cotizar por WhatsApp →
{/* Right: dashboard */}
{/* window chrome */}
KERN · DASHBOARD · ABR 2026
● LIVE
{/* big stat */}
ROAS · Últimas 24h
{roas.toFixed(2)}×
▲ +12.4%
{/* chart */}
{bars.map((b,i)=>(
))}
{/* metrics grid */}
{[ { k:'Inversión hoy', v:`$${spend.toLocaleString('es-CL')}`, d:'+8.2%' }, { k:'Conversiones', v:convs.toString(), d:'+23' }, { k:'CTR promedio', v:`${ctr.toFixed(2)}%`, d:'+0.4%' }, { k:'CPA', v:`$${Math.round(spend/Math.max(convs,1)).toLocaleString('es-CL')}`, d:'−12%' }, ].map((m,i)=>(
{m.k}
{m.v}
{m.d}
))}
{/* live row */}
CAMPAÑAS TOP
{[ { n:'Calvac · PMax', r:'6.82×', s:'#4ade80' }, { n:'Enuss · Shopping', r:'5.14×', s:'#4ade80' }, { n:'Bioma · Reels IG', r:'4.02×', s:accent }, ].map((c,i)=>(
{c.n} {c.r}
))}
{/* floating badges */}
+$240MM CLP GESTIONADOS
ROAS 4.8× PROM.
{/* scroll hint */}
Scroll
); } function MonolithTicker({ accent }) { return (
{Array.from({length:6}).map((_,i)=>( Google Ads ★ Meta Ads ★ Creativos ★ Tracking ★ ROAS 4.8× ★ ))}
); } function MonolithServices({ accent }) { const [active, setActive] = useState(0); const [ref, visible] = useReveal(); return (

Cuatro pilares
que mueven
la aguja.

{CONTENT.services.map((s, i) => ( ))}
0{active+1}
Servicio seleccionado

{CONTENT.services[active].name}

{CONTENT.services[active].desc}

{CONTENT.services[active].points.map(p => (
→ {p}
))}
); } function MonolithStats({ accent }) { const [ref, visible] = useReveal(); return (
{CONTENT.stats.map((s, i) => { const val = useCounter(s.v, { start: visible, decimals: s.decimals || 0 }); return (
0{i+1} / {s.k}
{s.prefix||''}{val}{s.suffix||''}
{s.note &&
{s.note}
}
); })}
); } function SectionLabel({ n, label, accent }) { return (
[{n}] {label}
); } function MonolithPricing({ accent }) { const [ref] = useReveal(); return (

Sin planes
prefabricados.

Cada negocio es distinto. Cotizamos según tu industria, plataformas, volumen de campañas y necesidad creativa. Sin paquetes rígidos, sin sorpresas.

★ COTIZACIÓN PERSONALIZADA

Hablemos
y armamos
tu propuesta.

Escríbenos por WhatsApp y en una conversación rápida entendemos tu negocio y te armamos una propuesta clara con alcance, inversión sugerida en pauta y fee mensual.

    {CONTENT.plans[0].features.map(f=>(
  • →{f}
    • ))}
Qué define la inversión

4 variables clave

{CONTENT.pricingFactors.map((p,i)=>(
0{i+1} {p.k}

{p.d}

))}

* La inversión en anuncios se paga directamente a Google/Meta. Nuestra fee es por gestión y operación. Valores netos sin IVA.

); } function MonolithCases({ accent }) { const [ref] = useReveal(); const scroll = useScroll(); return (

Resultados
que se facturan.

{CONTENT.cases.map((c, i) => { const [cref, visible] = useReveal(); return (
{e.currentTarget.style.borderColor=accent;}} onMouseLeave={e=>{e.currentTarget.style.borderColor='rgba(255,255,255,.1)';}}>
CASO 0{i+1}

{c.name}

{c.tag}
{c.metric}
{c.unit}

{c.copy}

{c.delta} Resultado
); })}
); } function MonolithProcess({ accent }) { return (

Cómo trabajamos.

{CONTENT.process.map((p, i) => { const [r, visible] = useReveal(); return (
{p.n}

{p.title}

{p.desc}

); })}
); } function MonolithLogos({ accent }) { const half = Math.ceil(CONTENT.logos.length / 2); const row1 = CONTENT.logos.slice(0, half); const row2 = CONTENT.logos.slice(half); return (
{row1.map((l,i)=>( {l} ))} {row2.map((l,i)=>( {l} ))}
); } function MonolithTestimonials({ accent }) { const [i, setI] = useState(0); useEffect(()=>{const id=setInterval(()=>setI(x=>(x+1)%CONTENT.testimonials.length),6000);return()=>clearInterval(id);},[]); const t = CONTENT.testimonials[i]; return (
" {t.q} "
{t.who}
{t.role}
{CONTENT.testimonials.map((_,k)=>(
); } function MonolithCTA({ accent }) { const [form, setForm] = useState({ name:'', company:'', phone:'', msg:'' }); const [sent, setSent] = useState(false); const [sending, setSending] = useState(false); const [error, setError] = useState(null); const mouse = useMouse(); const handleSubmit = async (e) => { e.preventDefault(); setSending(true); setError(null); try { const res = await fetch('https://formsubmit.co/ajax/contacto@kernagency.cl', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' }, body: JSON.stringify({ name: form.name, company: form.company, phone: form.phone, message: form.msg || '(sin mensaje)', _subject: `Cotización Kern — ${form.company || form.name}`, _captcha: 'false', _template: 'table', }), }); const data = await res.json().catch(() => ({})); console.log('[Formsubmit response]', res.status, data); if (!res.ok || data.success === 'false' || data.success === false) { throw new Error(data.message || `HTTP ${res.status}`); } setSent(true); } catch (err) { console.error('[Formsubmit error]', err); setError('No pudimos enviar tu solicitud ahora. Por favor escríbenos por WhatsApp.'); } finally { setSending(false); } }; return (
[ HABLEMOS ]

Tu próximo
ROAS
empieza
hoy.

{sent ? (
✓

Recibido

Te escribimos por WhatsApp en menos de 24h.

{e.stopPropagation();}} style={{display:'inline-block',padding:'14px 28px',background:accent,color:'#0a0a0a',fontFamily:'Archivo,sans-serif',fontWeight:800,textTransform:'uppercase',fontSize:13,letterSpacing:'.1em',textDecoration:'none',cursor:'pointer',position:'relative',zIndex:2}}>Ir a WhatsApp ahora
) : ( <>
Cotización personalizada
{[ {k:'name',ph:'Tu nombre'}, {k:'company',ph:'Empresa'}, {k:'phone',ph:'WhatsApp o teléfono'}, ].map(f=>( setForm({...form,[f.k]:e.target.value})} style={{ width:'100%',background:'transparent',border:'none',borderBottom:'1px solid rgba(255,255,255,.15)',padding:'18px 0',fontSize:16,color:'#fff',fontFamily:'inherit',marginBottom:8, }}/> ))}