// === Section components === // ---- Nav + language toggle ---- function Nav({ lang, setLang, copy, onJump }) { return ( ); } // ---- Hero ---- function Hero({ copy, onJump }) { return (
{/* Marquee dots top + bottom */}
{/* Boomerang decorations */} {/* Star sparkles */}
✦
✦
{copy.heroEyebrow}

EL SABOR ORIGINAL AMERICANO, CON EL CORAZON MEXICANO

{copy.heroSub}

{/* Brand strip */}
★ Since 1986 ★ 275+ Restaurants ★ 26 Countries ★
{/* Sunburst rays */} {Array.from({ length: 24 }).map((_, i) => { const a = i / 24 * 360; return ( ); })} {/* The food photo */} Hamburguesa doble, malteada y papas Johnny Rockets {/* Marquee bulbs riding on the disc edge */} {Array.from({ length: 24 }).map((_, i) => { const angle = i / 24 * 2 * Math.PI; const r = 47; // % const x = 50 + Math.cos(angle) * r; const y = 50 + Math.sin(angle) * r; return ( ); })} {/* Sticker badge */}
Hand-spun shakes since '86
); } // ---- Stats ---- function Stats({ copy }) { const items = [ { num: copy.stat1Num, label: copy.stat1Label, color: "var(--jr-red)" }, { num: copy.stat2Num, label: copy.stat2Label, color: "var(--jr-blue)" }, { num: copy.stat3Num, label: copy.stat3Label, color: "var(--jr-yellow-deep)" }, { num: copy.stat4Num, label: copy.stat4Label, color: "var(--jr-teal)" }]; return (

{copy.statsTitle}

{items.map((it, i) =>
{it.num}
{it.label}
)}
); } // ---- Why franchise ---- function Why({ copy }) { const items = [ { t: copy.why1Title, b: copy.why1Body, icon: "🏆", accent: "var(--jr-red)" }, { t: copy.why2Title, b: copy.why2Body, icon: "📊", accent: "var(--jr-blue)" }, { t: copy.why3Title, b: copy.why3Body, icon: "🤝", accent: "var(--jr-teal)" }, { t: copy.why4Title, b: copy.why4Body, icon: "🌶️", accent: "var(--jr-yellow-deep)" }]; return (
{copy.whyKicker}

{copy.whyTitle.split(" ").slice(0, -2).join(" ")} {copy.whyTitle.split(" ").slice(-2).join(" ")}

{items.map((it, i) =>
{String(i + 1).padStart(2, "0")}

{it.t}

{it.b}

)}
); } // ---- Brand story ---- function Story({ copy, lang }) { const es = lang === "es"; return (
EST. 1986
{es ? "Nuestra historia" : "Brand Story"}

All-American nostalgia {es ? "en cada plato." : "on every plate."}

{es ?

Johnny Rockets abrió su primer restaurante el 6 de junio de 1986, en la icónica Melrose Avenue de Los Ángeles, California. La idea era simple: recrear el diner clásico americano de los años 50. Booths rojos, rocolas, malteadas batidas a mano, y servicio con una sonrisa.

Fue un éxito instantáneo. La gente hacía fila hasta las 5 de la mañana, con 600 a 700 comensales diarios en una sola ubicación. Hoy somos más de 275 restaurantes franquiciados en 26 países — desde Tokio hasta Dubai, desde Santiago hasta la Ciudad de México.

:

Johnny Rockets opened its first restaurant on June 6th, 1986, on the iconic Melrose Avenue in Los Angeles, California. The idea was simple: recreate the classic American diner of the 1950s. Red booths, jukeboxes, hand-spun shakes, and service with a smile.

It was an instant hit. Crowds swarmed the Melrose location until 5am, with 600–700 guests daily. Today we are 275+ franchised restaurants in 26 countries — from Tokyo to Dubai, from Santiago to Mexico City.

}
“

Good food, good tunes & great entertainment.

— {es ? "Promesa de marca, desde el día uno" : "Brand promise, since day one"}
{/* Name origin */}
{es ? "El nombre" : "The name"}

“Johnny Rockets” {es ? " — puro Americana." : " — pure Americana."}

Johnny

{es ? "En honor a Johnny Appleseed, el legendario pionero estadounidense que sembró manzanos por todo el Medio Oeste — símbolo del espíritu emprendedor y la generosidad americana." : "After Johnny Appleseed, the legendary American pioneer who planted apple trees across the Midwest — a symbol of entrepreneurial spirit and American generosity."}

Rockets

{es ? "Por el clásico Oldsmobile Rocket 88, el primer muscle car americano — el sonido del motor V8, los cromados brillantes y el optimismo de la posguerra de los 50." : "After the classic Oldsmobile Rocket 88, America's first muscle car — the V8 roar, the chrome shine, and the post-war optimism of the 1950s."}

{[ { k: es ? "Diseño diner" : "Diner Design", v: es ? "Booths rojos, piso a cuadros, fixtures de la era atómica. Ideal 75–230 m²." : "Red booths, checkered floors, atomic-era fixtures. Ideal 75–230 m²." }, { k: "Certified Angus Beef®", v: es ? "Hamburguesas hechas a la orden con res certificada. Vegetarianas y pollo crujiente también." : "Cooked-to-order burgers with certified beef. Veggie and crispy chicken too." }, { k: "Hand-spun shakes", v: es ? "Malteadas y malts batidos a mano. El crew canta, baila y juega ketchup art." : "Hand-spun shakes and malts. The crew sings, dances and does ketchup art." }]. map((p, i) =>
{p.k}
{p.v}
)}
); } // ---- Process ---- function Process({ copy }) { const steps = [ { n: 1, t: copy.step1, b: copy.step1Body, color: "var(--jr-red)" }, { n: 2, t: copy.step2, b: copy.step2Body, color: "var(--jr-yellow-deep)" }, { n: 3, t: copy.step3, b: copy.step3Body, color: "var(--jr-blue)" }, { n: 4, t: copy.step4, b: copy.step4Body, color: "var(--jr-teal)" }, { n: 5, t: copy.step5, b: copy.step5Body, color: "var(--jr-red-deep)" }]; return (
{copy.processKicker}

{copy.processTitle}

{steps.map((s, i) =>
{s.n}
{s.t}
{s.b}
)}
); } // ---- Map (uses MexicoMap component) ---- function MapSection({ copy, locations, mapStyle }) { return (
{copy.mapKicker}

{copy.mapTitle.split(" ").slice(0, 2).join(" ")} {copy.mapTitle.split(" ").slice(2).join(" ")}

{copy.mapSub}

); } // ---- Form section ---- function FormSection({ copy, states, lang }) { return (
{copy.formKicker}

{copy.formTitle.split(" ").slice(0, 2).join(" ")} {copy.formTitle.split(" ").slice(2).join(" ")}

{copy.formSub}

48h {lang === "es" ? "respuesta inicial" : "initial response"}
3–9 {lang === "es" ? "meses de apertura" : "months to open"}
); } // ---- Footer ---- function Footer({ copy }) { return ( ); } Object.assign(window, { Nav, Hero, Stats, Why, Story, Process, MapSection, FormSection, Footer });