// sections.jsx — Copa Culinaria Carozzi 2026 // Header, Hero, About, Categories, Clasificatorias, Banner, Premios, Sponsors, Footer const { useState, useEffect, useRef } = React; // ─────────────── Shared bits ─────────────── const Arrow = ({size=14}) => ( ); const scrollToForm = (cat) => { const el = document.getElementById('inscripcion'); if (el) el.scrollIntoView ? window.scrollTo({top: el.offsetTop - 60, behavior:'smooth'}) : null; if (cat) window.dispatchEvent(new CustomEvent('preselect-category', {detail: cat})); }; const LogoMark = ({white=false, size=44}) => (
Copa Culinaria Carozzi
COPA CULINARIA CAROZZI · XI EDICIÓN 2026
); // ─────────────── 1. HEADER ─────────────── function Header(){ const [scrolled, setScrolled] = useState(false); const [open, setOpen] = useState(false); const [narrow, setNarrow] = useState(false); useEffect(()=>{ const onScroll = () => setScrolled(window.scrollY > 40); const onResize = () => setNarrow(window.innerWidth < 720); window.addEventListener('scroll', onScroll); window.addEventListener('resize', onResize); onResize(); return ()=> { window.removeEventListener('scroll', onScroll); window.removeEventListener('resize', onResize); }; },[]); const nav = [ {label:'Concurso', id:'concurso'}, {label:'Categorías', id:'categorias'}, {label:'Clasificatorias', id:'clasificatorias'}, {label:'Premios', id:'premios'}, {label:'Galería', id:'galeria', url:'galeria.html'}, {label:'Bases', id:'bases'}, {label:'Contacto', id:'contacto'}, ]; const go = (n) => { // Si el item del menú tiene una url, es una página aparte: navegar a ella if (n && n.url) { window.location.href = n.url; return; } const id = (n && n.id) ? n.id : n; const el = document.getElementById(id); if (el) window.scrollTo({top: el.offsetTop - 60, behavior:'smooth'}); setOpen(false); }; return (
{e.preventDefault(); window.scrollTo({top:0, behavior:'smooth'})}}>
{open && (
{nav.map(n => ( go(n)} style={{display:'block', padding:'12px 0', fontSize:16, fontWeight:600, color:'#fff', borderBottom:'1px solid rgba(255,255,255,.06)'}}>{n.label} ))}
)}
); } // ─────────────── 2. HERO ─────────────── // Portada según diseño oficial: video de fondo + título compuesto (PNG con // tipografías oficiales, logo, trazo de Chile, XI Edición 2026) + dos botones // + tira de ciudades. Sin texto duplicado. function Hero(){ const videoRef = useRef(null); useEffect(()=>{ const v = videoRef.current; if (v){ v.muted = true; v.playsInline = true; const playPromise = v.play(); if (playPromise) playPromise.catch(()=>{/* autoplay blocked, no-op */}); } },[]); return (
{/* Video background */} {/* Dark overlay for legibility */}
); } // ─────────────── 3. ABOUT ─────────────── function About(){ return (
{/* Photo collage — homage to previous editorial style, real photos */}
{/* Floating badge */}
XI
once años forjando el talento culinario chileno
¿Qué es la Copa Culinaria?

Once años elevando
la cocina chilena.

Copa Culinaria Carozzi es la competencia gastronómica más importante de Chile: el escenario donde el talento se prueba, se mide y se transmite. Una apuesta concreta de Carozzi Food Service por el desarrollo de la gastronomía nacional.

Seis clasificatorias regionales, dos categorías —Junior y Profesional—, una gran final transmitida por Canal 13 y un premio que cambia carreras. En 2026, llega tu llamado.

{[ ['XI', 'ediciones'], ['6', 'ciudades sede'], ['10K USD', 'premio mayor'], ].map(([n, l])=> (
{n}
{l}
))}
{/* Highlight stripe — navy (matches the previous site's navy callout) */}
); } // ─────────────── 4. CATEGORIES ─────────────── function Categories(){ const cats = [ { id:'junior', label:'Junior', sub:'Estudiantes de gastronomía', desc:'Estudiantes de educación superior de gastronomía (CFT e institutos profesionales). El equipo es una dupla.', meta:'2 participantes · 1 coach', img:'assets/photos/junior-cutting.jpg', imgPos:'center 25%', stat:'10.000 USD' }, { id:'profesional', label:'Senior', sub:'Cocineros profesionales destacados', desc:'Para cocineros profesionales que ya operan en hoteles, restaurantes y cocinas de alto nivel. Participación individual con un ayudante de apoyo.', meta:'1 participante · 1 ayudante', img:'assets/photos/dupla-portrait.jpg', imgPos:'center 30%', stat:'5.000.000 CLP' }, ]; return (
Dos rutas, un mismo escenario

Categorías 2026

Elige la categoría que te corresponde. Transmisión de Categoría Junior por canal 13.

{cats.map((c, i)=> (
0{i+1} · {c.label}
{c.stat}
1er lugar

{c.label}

{c.sub}

{c.desc}

{c.meta}
))}
); } // ─────────────── 5. CLASIFICATORIAS ─────────────── function Clasificatorias(){ // Detectar si estamos en mobile para ajustar el fontSize del día // cuando el texto es largo (caso "02 y 03" de Santiago). // En desktop el espacio sobra y todos van a 64px; en mobile los // textos largos bajan a 32px para no encimarse con el "SEP / 2026". const [isMobile, setIsMobile] = React.useState( typeof window !== 'undefined' && window.matchMedia('(max-width: 768px)').matches ); React.useEffect(() => { const mq = window.matchMedia('(max-width: 768px)'); const handler = (e) => setIsMobile(e.matches); mq.addEventListener('change', handler); return () => mq.removeEventListener('change', handler); }, []); const dates = [ {city:'Puerto Montt', venue:'Santo Tomás', date:'22 jul 2026', d:'22', m:'JUL', cat:'Junior · Profesional'}, {city:'Antofagasta', venue:'INACAP', date:'29 jul 2026', d:'29', m:'JUL', cat:'Junior · Profesional'}, {city:'La Serena', venue:'INACAP', date:'04 ago 2026', d:'04', m:'AGO', cat:'Junior · Profesional'}, {city:'Concepción', venue:'DUOC UC', date:'07 ago 2026', d:'07', m:'AGO', cat:'Junior · Profesional'}, {city:'Valparaíso', venue:'INACAP', date:'25 ago 2026', d:'25', m:'AGO', cat:'Junior · Profesional'}, {city:'Santiago', venue:'Carozzi Nos', date:'02 y 03 sep 2026', d:'02 y 03', m:'SEP', cat:'Junior · Profesional'}, ]; return (
Calendario nacional

Clasificatorias
2026

Seis ciudades. Seis fechas. Una clasificación. Elige tu sede al inscribirte.

{dates.map((d, i)=> (
e.currentTarget.style.background='var(--c-bone)'} onMouseLeave={e=>e.currentTarget.style.background='#fff'}>
2) ? 54 : 64, color:'var(--c-red)', lineHeight:.9, whiteSpace:'nowrap'}}>{d.d}
{d.m}
2026
{d.city}
{d.venue}
{d.cat}
))}
{/* Finales */}
{[ {title:'Final Junior', date:'30 sep 2026', desc:'El gran cierre será transmitido por Canal 13. Las mejores duplas se enfrentan por los 10.000 USD y el título nacional Junior 2026.'}, {title:'Final Senior', date:'01 oct 2026', desc:'Los cocineros se enfrentan por los $5.000.000 CLP y el reconocimiento de la industria.'}, ].map((f, i) => (
))}
); } // ─────────────── 6. BANNER MOTIVACIONAL ─────────────── function Banner(){ const sectionRef = useRef(null); const photoRef = useRef(null); useEffect(()=>{ const section = sectionRef.current; const photo = photoRef.current; if (!section || !photo) return; const reduce = window.matchMedia?.('(prefers-reduced-motion: reduce)').matches; if (reduce) return; let raf = 0; const update = () => { raf = 0; const rect = section.getBoundingClientRect(); const vh = window.innerHeight; // Only animate when in view (with a buffer) if (rect.bottom < -100 || rect.top > vh + 100) return; // Section center relative to viewport center (negative = above) const sectionCenter = rect.top + rect.height / 2; const offsetFromCenter = sectionCenter - vh / 2; // Parallax: photo moves opposite direction at ~25% speed const translate = offsetFromCenter * -0.18; photo.style.transform = `translate3d(0, ${translate}px, 0) scale(1.18)`; }; const onScroll = () => { if (!raf) raf = requestAnimationFrame(update); }; update(); window.addEventListener('scroll', onScroll, {passive:true}); window.addEventListener('resize', onScroll); return ()=>{ window.removeEventListener('scroll', onScroll); window.removeEventListener('resize', onScroll); if (raf) cancelAnimationFrame(raf); }; }, []); return (
{/* Real celebration photo with parallax (scaled up so it never reveals edges) */}
); } // ─────────────── 7. PREMIOS ─────────────── function Premios(){ // Premios por categoría. Junior incluye reconocimiento al Coach. // Senior NO tiene premio para ayudante. const premiosJunior = [ {place:'2°', amount:'7.500', unit:'USD', coach:'$750.000'}, {place:'1°', amount:'10.000', unit:'USD', winner:true, coach:'$1.000.000'}, {place:'3°', amount:'2.500', unit:'USD', coach:'$500.000'}, ]; const premiosSenior = [ {place:'2°', amount:'3.000.000', unit:'CLP'}, {place:'1°', amount:'5.000.000', unit:'CLP', winner:true}, {place:'3°', amount:'2.000.000', unit:'CLP'}, ]; const TrophyIcon = ({color, size=42}) => ( ); const PrizeCard = ({p, large}) => (
{p.place}
Lugar · Participante
{p.amount}
{p.unit}
{p.coach && (
Coach
{p.coach}
)}
); const Podium = ({title, items, kicker}) => (
{kicker}

{title}

{items.map(p => )}
); return (
El premio

Premios que cambian carreras.

Más de USD 20.000 y CLP 11 millones repartidos entre las dos categorías, más el reconocimiento del coach.

); } // ─────────────── 9. SPONSORS ─────────────── function Sponsors(){ const sponsors = [ {name:'Carozzi Food Service', src:'assets/sponsors/carozzi-fs.png?v=9'}, {name:'Canal 13', src:'assets/sponsors/canal-13.png?v=9'}, {name:'Fegach', src:'assets/sponsors/fegach.png?v=9'}, {name:'Espacio Food Service', src:'assets/sponsors/espacio-fs.png?v=9'}, {name:'Chef & Hotel', src:'assets/sponsors/chef-hotel.png?v=9'}, {name:'Achiga', src:'assets/sponsors/achiga.png?v=9'}, {name:'Académie Culinaire de France', src:'assets/sponsors/academie-cf.png?v=9'}, {name:'Hoteleros de Chile', src:'assets/sponsors/hoteleros.png?v=9'}, {name:'Círculo Cronistas Gastronómicos', src:'assets/sponsors/cronistas.png?v=9'}, {name:'Culinary', src:'assets/sponsors/culinary.png?v=9'}, {name:'Le Cordon Bleu', src:'assets/sponsors/le-cordon.png?v=9'}, {name:'Santo Tomás', src:'assets/sponsors/santotomas.png?v=9'}, {name:'INACAP', src:'assets/sponsors/inacap.png?v=9'}, {name:'DUOC UC', src:'assets/sponsors/duoc.png?v=9'}, {name:'AIEP', src:'assets/sponsors/aiep.png?v=9'}, {name:'UDLA', src:'assets/sponsors/udla.png?v=9'}, {name:'Ecole', src:'assets/sponsors/ecole.png?v=9'}, {name:'IPDP', src:'assets/sponsors/ipdp.png?v=9'}, ]; return (
Auspiciadores y partners

Aliados del talento culinario chileno.

{sponsors.map((s, i) => (
{ e.currentTarget.style.background='var(--c-bone)'; }} onMouseLeave={e=>{ e.currentTarget.style.background='#fff'; }}> {s.name}
))}
); } // ─────────────── 10. FOOTER ─────────────── function Footer(){ return ( ); } Object.assign(window, {Header, Hero, About, Categories, Clasificatorias, Banner, Premios, Sponsors, Footer, Arrow, scrollToForm, LogoMark});