// TagWave landing — main sections const { useState: useStateS, useEffect: useEffectS, useRef: useRefS } = React; /* ──────────────────────── NAV ──────────────────────── */ function NavLangSwitcher() { const { lang, setLang } = useLang(); const langs = [ { code: "pt", label: "PT" }, { code: "es", label: "ES" }, { code: "en", label: "EN" }, ]; return ( {langs.map((l, i) => ( {i > 0 && ·} ))} ); } function TopNav() { const [scrolled, setScrolled] = useStateS(false); const [menuOpen, setMenuOpen] = useStateS(false); const { tr } = useLang(); useEffectS(() => { const onS = () => setScrolled(window.scrollY > 16); onS(); window.addEventListener("scroll", onS, { passive: true }); return () => window.removeEventListener("scroll", onS); }, []); useEffectS(() => { document.body.style.overflow = menuOpen ? "hidden" : ""; return () => { document.body.style.overflow = ""; }; }, [menuOpen]); const closeMenu = () => setMenuOpen(false); const navItems = [ { href: "#features", label: tr.nav.features, icon: "FEAT" }, { href: "#workflow", label: tr.nav.workflow, icon: "FLOW" }, { href: "#integrations", label: tr.nav.integrations, icon: "INT" }, { href: "#pricing", label: tr.nav.pricing, icon: "PRICE" }, { href: "#testimonials", label: tr.nav.testimonials, icon: "DEP" }, { href: "#faq", label: tr.nav.faq, icon: "FAQ" }, ]; return ( <> {/* Mobile drawer */}
{navItems.map(({ href, label }) => ( {label} ))}
{tr.nav.download}
); } /* ──────── ANIMATED HERO FLOAT CARDS ──────── */ // ── Widget 1: MiniPlayer — recorte fiel do player horizontal do app function HeroNowPlayingCard() { const { tr } = useLang(); const tracks = [ { title: "Midnight Geometry", artist: "Helios Drift", bpm: "128", key: "8A", wave: [.3,.5,.8,.6,.9,.7,.4,.6,.8,1,.7,.5,.4,.7,.9,.6,.3,.5,.8,.6,.9,.7,.4,.6,.8,1,.5,.4,.7,.6,.8,.9,.5,.3,.6,.7,.8,.5,.4,.6] }, { title: "Crimson Hours", artist: "Nuit Bleue", bpm: "126", key: "9A", wave: [.4,.6,.5,.8,.7,.9,.5,.3,.6,.8,1,.7,.4,.5,.8,.6,.4,.7,.9,.5,.3,.6,.8,.7,.9,.5,.4,.6,.8,1,.7,.5,.4,.6,.9,.7,.3,.5,.8,.6] }, { title: "Floor of Glass", artist: "Astra", bpm: "124", key: "5A", wave: [.5,.7,.9,.6,.4,.8,.6,.5,.7,.9,.5,.3,.6,.8,1,.7,.4,.5,.9,.6,.3,.7,.8,.5,.4,.6,.9,.7,.5,.8,.6,.4,.7,.9,.5,.3,.6,.8,.7,.5] }, ]; const [idx, setIdx] = useStateS(0); const [vis, setVis] = useStateS(true); const [pct, setPct] = useStateS(32); useEffectS(() => { const prog = setInterval(() => setPct(p => p >= 85 ? 15 : p + 0.4), 120); const swap = setInterval(() => { setVis(false); setPct(15); setTimeout(() => { setIdx(i => (i + 1) % tracks.length); setVis(true); }, 350); }, 5000); return () => { clearInterval(prog); clearInterval(swap); }; }, []); const t = tracks[idx]; const W = 160, H = 32, bw = W / t.wave.length; return ( {/* Linha de progresso — igual ao topo do MiniPlayer real */}
{/* Zona 1: indicador + capa + info */}
{t.title}
{t.artist}
{/* Separador */}
{/* Zona 2: botão play */}
{/* Separador */}
{/* Zona 3: waveform */}
{t.wave.map((amp, i) => { const barH = Math.max(2, amp * (H - 4)); const y = (H - barH) / 2; const barPct = i / t.wave.length * 100; const played = barPct < pct; return ( ); })}
{/* Separador */}
{/* Zona 4: BPM + Tom */}
{t.bpm} {tr.software.widget_bpm_label}
{t.key}
); } // ── Widget 2: Inspector fields — recorte fiel do painel direito function HeroMetadataCard() { const { tr } = useLang(); const [phase, setPhase] = useStateS(0); // 0=messy · 1=fixing · 2=saved useEffectS(() => { const durations = [2600, 900, 3400]; let timer; const tick = (p) => { timer = setTimeout(() => { const n = (p + 1) % 3; setPhase(n); tick(n); }, durations[p]); }; tick(0); return () => clearTimeout(timer); }, []); const fields = [ { label: tr.software.widget_title, before: "03_FINAL2_helios-drift_v3", after: "Midnight Geometry" }, { label: tr.software.widget_artist, before: "Unknown Artist", after: "Helios Drift" }, { label: tr.software.widget_album, before: "—", after: "Submerged EP" }, ]; return ( {fields.map((f, i) => (
{/* Label — igual ao Inspector real: text-[10px] font-semibold text-[#8F8883] uppercase tracking-widest */}
{f.label}
{/* Input — bg-white/5 border-white/10, focus state com border-[#D95340] */}
{phase === 0 ? f.before : f.after}
))}
{tr.software.widget_saved}
); } // ── Widget 3: LibraryStats — recorte fiel do painel de biblioteca function HeroScanCard() { const { tr } = useLang(); const TARGET = 4128; const [count, setCount] = useStateS(3501); const [done, setDone] = useStateS(false); useEffectS(() => { if (done) { const t = setTimeout(() => { setCount(3501); setDone(false); }, 3000); return () => clearTimeout(t); } const id = setInterval(() => { setCount(c => { const n = c + Math.floor(Math.random() * 7) + 3; if (n >= TARGET) { setDone(true); return TARGET; } return n; }); }, 60); return () => clearInterval(id); }, [done]); const barData = () => [ { label: tr.software.widget_bpm, pct: 100 }, { label: tr.software.widget_key, pct: 87 }, { label: tr.software.widget_genre, pct: 94 }, { label: tr.software.widget_artwork, pct: 72 }, { label: tr.software.widget_rating, pct: 38 }, ]; return ( {/* Header — texto exato do LibraryStats real */}
{tr.software.widget_library}
{count.toLocaleString("pt-BR")} {tr.software.widget_tracks}
{(count * 0.0082).toFixed(1)} GB · {Math.floor(count * 0.0072)}h
{/* Cobertura */}
{tr.software.widget_coverage}
{barData().map((b) => { const curPct = Math.round(Math.min(count, TARGET) / TARGET * b.pct); const n = Math.round(curPct / 100 * TARGET); return (
{b.label} {n.toLocaleString("pt-BR")}/{TARGET.toLocaleString("pt-BR")} {curPct}%
{/* Bar — h-1 bg-white/[0.06] fill bg-[#D95340]/60 — igual ao app */}
); })} ); } /* ──────────────────────── HERO ──────────────────────── */ function Hero() { const { tr } = useLang(); const stageRef = useRefS(null); useEffectS(() => { const el = stageRef.current; if (!el) return; const onMove = (e) => { const r = el.getBoundingClientRect(); const x = (e.clientX - r.left) / r.width - 0.5; const y = (e.clientY - r.top) / r.height - 0.5; el.style.setProperty("--px", x.toFixed(3)); el.style.setProperty("--py", y.toFixed(3)); }; el.addEventListener("mousemove", onMove); return () => el.removeEventListener("mousemove", onMove); }, []); return (
{tr.hero.version}
{tr.hero.macos} {tr.hero.windows} {tr.hero.online}
◆   {tr.hero.eyebrow}

{tr.hero.h1_l1}
{tr.hero.h1_l2pre}{tr.hero.h1_italic}
{tr.hero.h1_l3}

{tr.hero.body}

{tr.hero.cta_trial} {tr.hero.cta_see}
● live · 128.04 BPM
SUBJECT / LISTENER.04 F2.8 — 1/250 — ISO 400
set · 25 may READY
{/* Scroll indicator */}
document.getElementById('features')?.scrollIntoView({ behavior: 'smooth' })}>
scroll
); } function Brackets() { const b = { position: "absolute", width: 18, height: 18, borderColor: "var(--bone)", opacity: 0.7, mixBlendMode: "screen" }; return ( <> ); } function Stat({ label, value }) { return (
{label}
{value}
); } /* ──────────────────────── LOGO STRIP ──────────────────────── */ function LogoStrip() { const { tr } = useLang(); const names = ["Rekordbox", "Serato", "Spotify", "Last.fm", "Beatport", "Apple Music", "Traktor"]; return (
{tr.logostrip.label}
{names.map((n) => ( {n} ))}
); } /* ──────────────────────── PROBLEM ──────────────────────── */ function Problem() { const { tr } = useLang(); const messy = [ "03_FINAL2_helios-drift_v3.mp3", "track1.mp3", "Helios_Drift- Midnight Geometry (official audio) [128bpm].mp3", "Unknown Artist — 08.aiff", "[FREE DL] HELIOS DRIFT - MIDNIGHT GEOMETRY (CLUB MIX).wav", "Helios Drift -midnight geometry- (Master 2.1).flac", "midnight_geom_FX_loop.wav", "Helios Drift - Midnight Geometry (Original Mix).mp3", ]; // Real app track data — same visual language as the TagWave interface const cleanTracks = [ { title: "Midnight Geometry", artist: "Helios Drift", genre: "DEEP·MELODIC", gc: "#2A1E40", key: "8A", kc: "#4A3A8C", bpm: "128.04", len: "6:42", cover: "linear-gradient(135deg,#2a1e40,#0e0d0c)" }, { title: "Floor of Glass", artist: "Astra", genre: "PROGRESSIVE", gc: "#2E1A0E", key: "5A", kc: "#8C5A20", bpm: "124.00", len: "7:18", cover: "linear-gradient(135deg,#2e1a0e,#0e0d0c)" }, { title: "Crimson Hours", artist: "Nuit Bleue", genre: "HOUSE", gc: "#1A2E1E", key: "9A", kc: "#2E7D4F", bpm: "126.50", len: "5:54", cover: "linear-gradient(135deg,#1a2e1e,#0e0d0c)" }, { title: "Long Way Down", artist: "Vermil", genre: "INDIE DANCE", gc: "#1E1A2E", key: "11A",kc: "#5B4A8C", bpm: "122.00", len: "4:48", cover: "linear-gradient(135deg,#1e1a2e,#0e0d0c)" }, { title: "Saudade", artist: "Okra Sessions",genre: "DOWNTEMPO", gc: "#2E2A1A", key: "4A", kc: "#7D6A2E", bpm: "118.00", len: "8:02", cover: "linear-gradient(135deg,#2e2a1a,#0e0d0c)" }, { title: "Phaseout", artist: "Maxine Field", genre: "TECH HOUSE", gc: "#1A2A2E", key: "10A",kc: "#2E6A7D", bpm: "130.20", len: "6:08", cover: "linear-gradient(135deg,#1a2a2e,#0e0d0c)" }, { title: "Reach North", artist: "Halocene", genre: "MELODIC TECHNO",gc:"#2A1A1E", key: "7A", kc: "#8C3A5A", bpm: "127.50", len: "7:30", cover: "linear-gradient(135deg,#2a1a1e,#0e0d0c)" }, { title: "Submerged (Edit)", artist: "Helios Drift", genre: "DEEP·MELODIC", gc: "#2A1E40", key: "8A", kc: "#4A3A8C", bpm: "128.00", len: "6:12", cover: "linear-gradient(135deg,#2a1e40,#0e0d0c)" }, ]; return (
02 · {tr.problem.section}

{tr.problem.h2_pre}{tr.problem.h2_italic1}.
{tr.problem.h2_mid}{tr.problem.h2_italic2}{tr.problem.h2_end}

{tr.problem.body} Electronic / Deep / House / Other.

{/* ANTES — raw filenames */}

{tr.problem.before}

{messy.map((f, i) => (
{String(i + 1).padStart(2, "0")} {f}
))}
{/* DEPOIS — recorte real da interface TagWave */}
{/* Mini toolbar — igual ao app */}
tagwave
76 faixas TODAS ✓ 72
{/* Column headers */}
{["","TÍTULO","BPM","TOM","DUR"].map((h, i) => (
{h}
))}
{/* Track rows */} {cleanTracks.map((t, i) => (
{/* Cover thumbnail */}
{/* Title + artist + genre tag */}
{t.title} {t.genre}
{t.artist}
{/* BPM */}
{t.bpm}
{/* Key circle */}
{t.key}
{/* Duration */}
{t.len}
))}
); } /* ──────────────────────── SOFTWARE UI ──────────────────────── */ function SoftwareUI() { const { tr } = useLang(); const [active, setActive] = useStateS(2); const tracks = [ { title: "Helios Drift — Midnight Geometry", artist: "Submerged EP", genre: "Deep / Melodic", key: "8A", bpm: "128.04", len: "6:42", wave: [.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.4,.6] }, { title: "Astra — Floor of Glass", artist: "Pale Horizon", genre: "Progressive", key: "5A", bpm: "124.00", len: "7:18", wave: [.4,.6,.8,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1] }, { title: "Nuit Bleue — Crimson Hours", artist: "Single", genre: "House", key: "9A", bpm: "126.50", len: "5:54", wave: [.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.4,.6,.8] }, { title: "Vermil — Long Way Down", artist: "Long Way Down", genre: "Indie Dance", key: "11A", bpm: "122.00", len: "4:48", wave: [.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8], warn: true }, { title: "Okra Sessions — Saudade", artist: "Tide Volumes", genre: "Downtempo", key: "4A", bpm: "118.00", len: "8:02", wave: [.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.4,.6] }, { title: "Maxine Field — Phaseout", artist: "Phaseout EP", genre: "Tech House", key: "10A", bpm: "130.20", len: "6:08", wave: [.4,.6,.8,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1] }, { title: "Halocene — Reach North", artist: "Reach", genre: "Melodic Techno", key: "7A", bpm: "127.50", len: "7:30", wave: [.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.3,.5,.7,.9,.6,.4,.6,.8,1,.7,.5,.4,.6,.8] }, ]; const active_t = tracks[active]; return (
03 · {tr.software.section}

{tr.software.h2_l1}
{tr.software.h2_italic}{tr.software.h2_l2}

{tr.software.body}

{/* ── TOOLBAR (bg mais escuro, como no app real #23201E) ── */}
{/* Traffic lights */}
{/* Logo ring */} {/* Sidebar toggle */}
{/* Folder open button (coral) */}
{/* Action buttons - text style like real app */} {[ { label: tr.software.app_btn_restore, icon: "M2 5.5A3.5 3.5 0 108.5 2.5L7 4 M2 2.5v3h3" }, { label: tr.software.app_btn_bpm, icon: "M1 8l2-4 2 2.5 2-5 2 3 1-2" }, { label: tr.software.app_btn_enrich, icon: "M5.5 3.5v2l1.5 1 M5.5 1.5a4 4 0 100 8 4 4 0 000-8z" }, { label: tr.software.app_btn_normalize, icon: "M1 3h9M3 5.5h5M4.5 8h2" }, { label: tr.software.app_btn_export, icon: "M5.5 1v6M3 4l2.5-3 2.5 3 M2 8v1.5h7V8" }, ].map((btn, i) => (
{btn.icon.split(" M").map((d, j) => )} {btn.label}
))} {/* Track count */} 76 {tr.software.app_tracks_unit} {/* Filter chips */}
{[ { label: tr.software.app_tab_all, active: true }, { label: "+ 73", active: false }, { label: "★ 0", active: false }, { label: "⚠ 4", active: false }, { label: "✓ 72", active: false }, ].map((tab, i) => ( {tab.label} ))}
{/* Right side */}
Trial · 13d Upgrade v0.4.3
{/* ── BODY ── */}
{/* SIDEBAR */}
{/* Tab bar — Recentes / Favoritos / Playlists */}
{[ { label: tr.software.app_tab_recent, count: 3 }, { label: tr.software.app_tab_fav, count: 0 }, { label: tr.software.app_tab_playlist, count: 0 }, ].map((tab, i) => (
{tab.label} {tab.count > 0 && ( {tab.count} )}
))}
{/* Folder list */}
{[ { name: "Reggae", active: false }, { name: "Pop", active: true }, { name: "Old", active: false }, { name: "Funk", active: false }, { name: "Hip Hop", active: false }, ].map((f, i) => (
{/* chevron */}
{f.name}
))}
{/* Dispositivos */}
{tr.software.app_devices}
{["Dados", "Macintosh HD", "Musicas", "SSD Interno", "UTM"].map((d, i) => (
{d}
))}
{/* Footer stats */}
76 {tr.software.app_tracks_unit}
0.36 GB · 5h 6min
{/* MAIN AREA */}
{/* Áudio / Vídeo sub-tabs (centered, inside main area) */}
{tr.software.app_media_audio} 76
{tr.software.app_media_video}
{/* Warning banner */}
{tr.software.app_warning} {tr.software.app_review} ×
{/* Track table */}
{/* Column headers */}
{["#", "", "★", tr.software.app_col_cover, tr.software.app_col_title, tr.software.app_col_genre_h, tr.software.app_col_key, tr.software.app_col_bpm, tr.software.app_col_len, tr.software.app_col_wave].map((h, i) => (
{i === 1 ? ( ) : h}
))}
{/* Track rows */} {[ { n:"27", title:"3 Doors Down", artist:"3 Doors Down", genre:"ROCK", gc:"#3A5A7A", key:"D", kc:"#7B3F9E", bpm:"100.00", len:"4:18", warn:true }, { n:"28", title:"The Kill", artist:"30 Seconds To Mars",genre:"ROCK", gc:"#3A5A7A", key:"A", kc:"#2E7D4F", bpm:"128.50", len:"3:53", warn:false }, { n:"29", title:"Zombie", artist:"Cranberries", genre:"ROCK", gc:"#3A5A7A", key:"B", kc:"#B34435", bpm:"84.00", len:"5:06", warn:false }, { n:"30", title:"I Hear You Call", artist:"Bliss", genre:"POP", gc:"#6A3A7A", key:"E", kc:"#4A7A3A", bpm:"120.00", len:"3:44", warn:false }, { n:"31", title:"I Still Haven't Found What I'm Looking For", artist:"U2", genre:"ROCK", gc:"#3A5A7A", key:"G", kc:"#C4872A", bpm:"103.00", len:"4:37", warn:false }, { n:"32", title:"Track-01", artist:"3 Days Grace", genre:"OTHER", gc:"#4A4A5A", key:"C", kc:"#1A6A7A", bpm:"—", len:"3:51", warn:false }, { n:"33", title:"for you", artist:"the calling", genre:"ROCK", gc:"#3A5A7A", key:"F", kc:"#3A7A6A", bpm:"93.50", len:"3:58", warn:false }, ].map((t, i) => (
setActive(i)} style={{ display: "grid", gridTemplateColumns: "28px 18px 18px 34px 1fr 70px 44px 52px 44px 38px", padding: "0 10px", height: 32, borderBottom: "1px solid rgba(244,237,228,0.03)", alignItems: "center", background: i === active ? "rgba(244,237,228,0.04)" : "transparent", cursor: "pointer", }}> {t.n} ★★★★★ {/* Cover thumbnail */}
{i % 3 !== 2 && (
)}
{t.title}
{t.artist}
{t.genre}
{t.key}
{t.bpm} {t.len}
))}
{/* RIGHT INSPECTOR */}
{/* Panel tabs: Selecionado / Biblioteca */}
{[tr.software.app_insp_selected, tr.software.app_insp_library].map((tab, i) => (
{tab}
))}
×
{/* Library content */}
76 {tr.software.app_tracks_unit}
0.4 GB · 5h 6min
{/* Coverage */}
{tr.software.app_coverage}
{[ { label: "BPM", val: 76, total: 76, pct: 100 }, { label: tr.software.app_col_key, val: 11, total: 76, pct: 14 }, { label: tr.software.app_col_genre_h, val: 75, total: 76, pct: 99 }, { label: tr.software.app_col_cover, val: 72, total: 76, pct: 95 }, { label: "Rating", val: 0, total: 76, pct: 0 }, ].map((bar, i) => (
{bar.label} {bar.val}/{bar.total} {bar.pct}%
))} {/* Problems */}
{tr.software.app_problems_n}
{/* Top Genres */}
{tr.software.app_top_genres}
{[["Rock",22],["Pop",19],["Alternative",7],["Other",5],["Blues",4]].map(([g,n], i) => (
{g} {n}
))}
{/* AI Assistant button */}
); } /* ──────────────────────── FEATURES ──────────────────────── */ function Features() { const { tr } = useLang(); const f = tr.features; return (
04 · {f.section}

{f.h2_l1}
{f.h2_l2}

{f.f1_label}

{f.f1_title}

{f.f1_body}

{f.f1_last}
{[128.04, 124.00, 126.5, 122.0, 118.0, 130.2, 127.5, 124.1, 132.0, 119.9, 126.0, 128.0].map((n, i) => ( {n} ))}
{f.f2_label}

{f.f2_title}

{f.f2_body}
{f.f3_label}

{f.f3_title}

{f.f3_body}

{f.f3_c1} FLAC
{f.f3_c2} 320 kbps
{f.f3_c3} WAV
{f.f4_label}

{f.f4_title}

{f.f4_body}

$ {"{artist} — {title} [{key} · {bpm}]"}
{f.f5_label}

{f.f5_title}

{f.f5_body}

● Rekordbox 6.8 ● Serato 3.2 ● Traktor 4
{f.f6_label}

{f.f6_title}

{f.f6_body}

{f.f6_offline} ● 0 KB uploaded
); } /* ──────────────────────── HOW IT WORKS ──────────────────────── */ function HowItWorks() { const { tr } = useLang(); const w = tr.workflow; const steps = [ { n: "01", title: w.step1_title, body: w.step1_body, img: "assets/curtain.jpg" }, { n: "02", title: w.step2_title, body: w.step2_body, img: "assets/wave-orb.jpg" }, { n: "03", title: w.step3_title, body: w.step3_body, img: "assets/visor.jpg" }, ]; return (
05 · {w.section}

{w.h2_l1}
{w.h2_pre}{w.h2_italic}{w.h2_end}

{steps.map((s, i) => (
{s.n}

{s.title}

{s.body}

 ))}
); } /* ──────────────────────── BIG STAT BREAK ──────────────────────── */ function StatBreak() { const { tr } = useLang(); return (
— {tr.statbreak.section}
42h

{tr.statbreak.body}

FIELD NOTE / 02:43 AM KLUB ECHO — LIS
); } /* ──────────────────────── INTEGRATIONS ──────────────────────── */ function Integrations() { const { tr } = useLang(); const items = ["Rekordbox", "✦", "Serato", "✦", "Spotify", "✦", "Last.fm", "✦", "Apple Music", "✦", "Beatport", "✦", "Traktor", "✦", "MusicBrainz", "✦", "Discogs"]; const doubled = [...items, ...items]; return (
06 · {tr.integrations.section}

{tr.integrations.h2_pre}{tr.integrations.h2_italic}{tr.integrations.h2_end}

{tr.integrations.body}

{doubled.map((s, i) => ( {s} ))}
); } /* ──────────────────────── PRICING ──────────────────────── */ function Pricing() { const { tr } = useLang(); const p = tr.pricing; return (
07 · {p.section}

{p.h2_l1}
{p.h2_italic}{p.h2_end}

{p.body}

{p.trial_label}
$0
{p.trial_sub}
  • {p.trial_f1}
  • {p.trial_f2}
  • {p.trial_f3}
  • {p.trial_f4}
{p.trial_cta}
{p.lifetime_label}
$129
{p.lifetime_sub}
  • {p.lifetime_f1}
  • {p.lifetime_f2}
  • {p.lifetime_f3}
  • {p.lifetime_f4}
  • {p.lifetime_f5}
  • {p.lifetime_f6}
{p.lifetime_cta}
{p.studio_label}
$229
{p.studio_sub}
  • {p.studio_f1}
  • {p.studio_f2}
  • {p.studio_f3}
  • {p.studio_f4}
  • {p.studio_f5}
{p.studio_cta}
); } /* ──────────────────────── TESTIMONIALS ──────────────────────── */ function Testimonials() { const { tr } = useLang(); const t = tr.testimonials; const avatarColors = [ { bg: "rgba(217,83,64,0.15)", border: "rgba(217,83,64,0.4)", text: "var(--accent)" }, { bg: "rgba(91,160,85,0.12)", border: "rgba(91,160,85,0.35)", text: "#5BA055" }, { bg: "rgba(139,42,66,0.18)", border: "rgba(139,42,66,0.4)", text: "#C99BA6" }, { bg: "rgba(217,83,64,0.10)", border: "rgba(217,83,64,0.3)", text: "var(--accent)" }, ]; return (
{t.section}

{t.h2_pre}{t.h2_italic}{t.h2_end}

{t.items.map((item, i) => { const col = avatarColors[i % avatarColors.length]; return (
e.currentTarget.style.borderColor = "rgba(244,237,228,0.14)"} onMouseLeave={e => e.currentTarget.style.borderColor = "rgba(244,237,228,0.07)"} > {/* Quote mark */}
“
{/* Quote text */}

{item.quote}

{/* Author */}
{item.avatar}
{item.name}
{item.role}
 ); })}
); } /* ──────────────────────── FAQ ──────────────────────── */ function FAQ() { const { tr } = useLang(); const f = tr.faq; const items = [ { q: f.q1, a: f.a1 }, { q: f.q2, a: f.a2 }, { q: f.q3, a: f.a3 }, { q: f.q4, a: f.a4 }, { q: f.q5, a: f.a5 }, { q: f.q6, a: f.a6 }, ]; return (
08 · {f.section}

{f.h2_pre}{f.h2_italic}{f.h2_end}

{items.map((it, i) => (
{it.q} +

{it.a}

 ))}
); } /* ──────────────────────── FOOTER ──────────────────────── */ function Footer() { const { lang, setLang, tr } = useLang(); const f = tr.footer; const langs = [ { code: "pt", label: "PT" }, { code: "es", label: "ES" }, { code: "en", label: "EN" }, ]; return (

{f.tagline}

TagWave.
{f.copyright} {f.build} {f.build_color}. {langs.map((l, i) => ( {i > 0 && ·} ))}
); } function FooterCol({ title, links }) { return (
{title}
{links.map((l) => { const label = typeof l === "string" ? l : l.label; const href = typeof l === "string" ? "#" : l.href; return {label}; })}
); } Object.assign(window, { TopNav, Hero, LogoStrip, Problem, SoftwareUI, Features, HowItWorks, StatBreak, Integrations, Pricing, Testimonials, FAQ, Footer });