-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
65 lines (65 loc) · 40.1 KB
/
index.html
File metadata and controls
65 lines (65 loc) · 40.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html><html lang="es"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><link rel="canonical" href="https://59gray.github.io/"><!-- Primary Meta Tags --><title>Frecuencia Global — Publishing Automation System — Frecuencia Global</title><meta name="title" content="Frecuencia Global — Publishing Automation System — Frecuencia Global"><meta name="description" content="Open-source multi-platform publishing automation built with Python, Astro, Playwright, and n8n. REST API bridge, browser automation, and workflow orchestration."><meta name="author" content="Frecuencia Global"><!-- Open Graph --><meta property="og:type" content="website"><meta property="og:url" content="https://59gray.github.io/"><meta property="og:title" content="Frecuencia Global — Publishing Automation System — Frecuencia Global"><meta property="og:description" content="Open-source multi-platform publishing automation built with Python, Astro, Playwright, and n8n. REST API bridge, browser automation, and workflow orchestration."><meta property="og:image" content="https://59gray.github.io/images/og/fg_website_hero_20260402_v1.webp"><meta property="og:locale" content="es_ES"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@frec_global"><meta property="twitter:url" content="https://59gray.github.io/"><meta property="twitter:title" content="Frecuencia Global — Publishing Automation System — Frecuencia Global"><meta property="twitter:description" content="Open-source multi-platform publishing automation built with Python, Astro, Playwright, and n8n. REST API bridge, browser automation, and workflow orchestration."><meta property="twitter:image" content="https://59gray.github.io/images/og/fg_website_hero_20260402_v1.webp"><!-- RSS --><link rel="alternate" type="application/rss+xml" title="Frecuencia Global" href="/rss.xml"><link rel="alternate" type="application/rss+xml" title="Frecuencia Global Podcast" href="/podcast/rss.xml"><meta name="generator" content="Astro v6.1.2"><link rel="stylesheet" href="/_astro/BaseLayout.HhbmAoGZ.css"></head> <body class="flex flex-col min-h-screen bg-fg-black text-fg-white"> <header class="sticky top-0 z-50 border-b border-white/10 bg-fg-black/75 backdrop-blur-xl"> <nav class="mx-auto flex h-16 max-w-[1500px] items-center justify-between px-md lg:px-xl"> <a href="/" class="flex items-center gap-3"> <span class="relative flex h-10 w-10 items-center justify-center border border-white/10 bg-white/5"> <img src="/images/logo/fg_isotipo.svg" alt="Frecuencia Global" class="h-6 w-6"> <span class="absolute -right-1 -top-1 h-2.5 w-2.5 rounded-full bg-fg-cyan shadow-[0_0_12px_rgba(0,229,255,0.9)]"></span> </span> <span class="hidden sm:block"> <span class="block font-display text-[1.15rem] tracking-[0.18em] text-fg-white">FRECUENCIA GLOBAL</span> <span class="hidden font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray lg:block">
análisis internacional / club signal
</span> </span> </a> <ul class="hidden items-center gap-2 md:flex"> <li class="relative group"> <a href="/" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-fg-cyan"> Inicio </a> </li><li class="relative group"> <a href="/pilares" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Pilares <svg class="h-3 w-3" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </a> <ul class="absolute left-0 top-full mt-2 min-w-[230px] border border-white/10 bg-fg-black/95 p-2 invisible opacity-0 transition-all duration-200 group-hover:visible group-hover:opacity-100"> <li> <a href="/pilares/geopolitik-drop" class="block px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 hover:bg-white/5 text-pilar-p1"> Geopolitik Drop </a> </li><li> <a href="/pilares/bass-and-borders" class="block px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 hover:bg-white/5 text-pilar-p2"> Bass & Borders </a> </li><li> <a href="/pilares/frecuencia-global" class="block px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 hover:bg-white/5 text-pilar-p3"> Frecuencia Global </a> </li><li> <a href="/pilares/behind-the-policy" class="block px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 hover:bg-white/5 text-pilar-p4"> Behind the Policy </a> </li> </ul> </li><li class="relative group"> <a href="/contenido" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Contenido </a> </li><li class="relative group"> <a href="/podcast" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Podcast </a> </li><li class="relative group"> <a href="/stack" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Stack </a> </li><li class="relative group"> <a href="/sobre" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Sobre </a> </li><li class="relative group"> <a href="/contacto" class="inline-flex items-center gap-1 px-3 py-2 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 border border-white/15 text-fg-white hover:border-white/35 hover:bg-white/5"> Contacto </a> </li> </ul> <button id="mobile-menu-btn" class="border border-white/10 p-2 text-fg-gray transition-colors duration-300 hover:text-fg-white md:hidden" aria-label="Menú" aria-expanded="false"> <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </nav> <div id="mobile-menu" class="hidden border-t border-white/10 bg-fg-black/95 md:hidden"> <ul class="space-y-1 px-md py-lg"> <li> <a href="/" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-cyan"> Inicio </a> </li> <li> <a href="/pilares" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Pilares </a> </li> <li> <a href="/pilares/geopolitik-drop" class="block py-2 pl-4 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-pilar-p1"> Geopolitik Drop </a> </li><li> <a href="/pilares/bass-and-borders" class="block py-2 pl-4 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-pilar-p2"> Bass & Borders </a> </li><li> <a href="/pilares/frecuencia-global" class="block py-2 pl-4 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-pilar-p3"> Frecuencia Global </a> </li><li> <a href="/pilares/behind-the-policy" class="block py-2 pl-4 font-data text-[11px] uppercase tracking-[0.22em] transition-colors duration-300 text-pilar-p4"> Behind the Policy </a> </li> <li> <a href="/contenido" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Contenido </a> </li> <li> <a href="/podcast" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Podcast </a> </li> <li> <a href="/stack" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Stack </a> </li> <li> <a href="/sobre" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Sobre </a> </li> <li> <a href="/contacto" class="block py-2 font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 text-fg-gray hover:text-fg-white"> Contacto </a> </li> </ul> </div> </header> <script type="module">const e=document.getElementById("mobile-menu-btn"),n=document.getElementById("mobile-menu");e?.addEventListener("click",()=>{const t=e.getAttribute("aria-expanded")==="true";e.setAttribute("aria-expanded",String(!t)),n?.classList.toggle("hidden")});</script> <main class="flex-1"> <section class="relative isolate overflow-hidden border-b border-white/10"> <div class="absolute inset-0 scale-[1.03] bg-cover bg-center opacity-34 blur-[2px] lg:bg-right" style="background-image: url('/images/og/fg_website_hero_20260402_v1.webp');" aria-hidden="true"></div> <div class="absolute inset-0 bg-[radial-gradient(circle_at_18%_18%,rgba(0,229,255,0.18),transparent_30%),radial-gradient(circle_at_82%_14%,rgba(255,0,229,0.12),transparent_22%),linear-gradient(135deg,rgba(255,255,255,0.02),transparent_42%)]" aria-hidden="true"></div> <div class="signal-grid absolute inset-0 opacity-40" aria-hidden="true"></div> <div class="signal-scan absolute inset-y-0 left-[-12%] w-[52%] bg-[linear-gradient(90deg,transparent,rgba(0,229,255,0.14),transparent)] blur-3xl" aria-hidden="true"></div> <div class="signal-drift absolute right-[6%] top-[18%] h-28 w-28 rounded-full border border-white/10 bg-white/5 shadow-[0_0_80px_rgba(255,0,229,0.14)]" aria-hidden="true"></div> <div class="relative z-10 mx-auto grid min-h-[calc(100svh-4rem)] max-w-[1500px] items-end gap-10 px-md pb-12 pt-12 lg:grid-cols-[minmax(0,1.35fr)_minmax(320px,0.72fr)] lg:px-xl lg:pb-16 lg:pt-16"> <div> <div class="mb-6 flex flex-wrap items-center gap-3 font-data text-[11px] uppercase tracking-[0.32em] text-fg-gray"> <span class="inline-flex items-center gap-2"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-fg-cyan); box-shadow: 0 0 2px var(--color-fg-cyan);" role="presentation"></span>
publishing automation system
</span> <span class="hidden text-white/15 sm:inline">/</span> <span class="text-white/60">open source</span> </div> <p class="mb-5 font-data text-[11px] uppercase tracking-[0.36em] text-fg-cyan/90">
python · playwright · astro · n8n · REST API
</p> <h1 class="max-w-[10ch] font-display text-[clamp(4.5rem,16vw,11rem)] leading-[0.82] tracking-[0.08em] text-fg-white"> <span class="block">FRECUENCIA</span> <span class="block text-transparent [-webkit-text-stroke:1px_rgba(255,255,255,0.68)]"> GLOBAL </span> </h1> <p class="mt-6 max-w-2xl text-lg leading-relaxed text-fg-gray sm:text-xl"> An open-source publishing automation system that transforms markdown content into validated, multi-platform posts via Python scripts, API integrations, and a local REST bridge server. </p> <div class="mt-8 flex flex-wrap gap-4"> <a href="/stack" class="inline-flex items-center justify-center border border-fg-cyan bg-fg-cyan px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-black transition-transform duration-300 hover:-translate-y-0.5"> View technical stack </a> <a href="/contenido" class="inline-flex items-center justify-center border border-white/15 px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-white transition-colors duration-300 hover:border-white/40 hover:bg-white/5"> Browse output </a> </div> <dl class="mt-10 grid max-w-4xl gap-4 sm:grid-cols-3"> <div class="border-t border-white/10 pt-4"> <dt class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">automation scripts</dt> <dd class="mt-2 font-display text-3xl tracking-[0.08em] text-fg-white sm:text-4xl text-fg-cyan"> 09 </dd> </div><div class="border-t border-white/10 pt-4"> <dt class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">platform integrations</dt> <dd class="mt-2 font-display text-3xl tracking-[0.08em] text-fg-white sm:text-4xl text-pilar-p4"> 06 </dd> </div><div class="border-t border-white/10 pt-4"> <dt class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">API endpoints</dt> <dd class="mt-2 font-display text-3xl tracking-[0.08em] text-fg-white sm:text-4xl text-pilar-p2"> 05 </dd> </div><div class="border-t border-white/10 pt-4"> <dt class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">content pieces validated</dt> <dd class="mt-2 font-display text-3xl tracking-[0.08em] text-fg-white sm:text-4xl text-pilar-p3"> 04 </dd> </div> </dl> </div> <aside class="relative overflow-hidden border border-white/10 bg-black/35 px-6 py-6 backdrop-blur-xl sm:px-7 sm:py-8"> <div class="absolute inset-x-0 top-0 h-px bg-[linear-gradient(90deg,transparent,rgba(255,255,255,0.6),transparent)]" aria-hidden="true"></div> <p class="font-data text-[11px] uppercase tracking-[0.32em] text-fg-gray">current drop</p> <div class="mt-5"> <span class="inline-block font-data tracking-widest border rounded-sm bg-pilar-p2/10 border-pilar-p2/30 text-pilar-p2 px-sm py-2xs text-xs"> BASS & BORDERS </span> <a href="/contenido/techno-detroit-historia-musica-electronica" class="mt-5 block"> <h2 class="font-display text-3xl leading-[0.9] tracking-[0.05em] text-fg-white transition-colors duration-300 hover:text-fg-cyan"> El techno nació en Detroit, no en Berlín </h2> </a> <p class="mt-4 text-sm leading-relaxed text-fg-gray"> La historia de la música electrónica es también una historia de migración, resistencia y globalización cultural. De las fábricas de Detroit a las pistas de baile del mundo. </p> <div class="mt-6 font-data text-[11px] uppercase tracking-[0.28em] text-fg-gray"> 05 abr 2026 </div> <a href="/contenido/techno-detroit-historia-musica-electronica" class="mt-6 inline-flex items-center font-data text-xs uppercase tracking-[0.26em] text-fg-cyan transition-colors duration-300 hover:text-fg-white">
leer transmisión →
</a> </div> <div class="mt-8 border-t border-white/10 pt-6"> <p class="font-data text-[11px] uppercase tracking-[0.32em] text-fg-gray">señal base</p> <ul class="mt-4 space-y-3"> <li class="flex items-center gap-3 text-sm text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-fg-cyan); box-shadow: 0 0 2px var(--color-fg-cyan);" role="presentation"></span> <span>python automation</span> </li><li class="flex items-center gap-3 text-sm text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-fg-cyan); box-shadow: 0 0 2px var(--color-fg-cyan);" role="presentation"></span> <span>playwright browser control</span> </li><li class="flex items-center gap-3 text-sm text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-fg-cyan); box-shadow: 0 0 2px var(--color-fg-cyan);" role="presentation"></span> <span>REST API bridge</span> </li><li class="flex items-center gap-3 text-sm text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-fg-cyan); box-shadow: 0 0 2px var(--color-fg-cyan);" role="presentation"></span> <span>astro static site</span> </li> </ul> </div> </aside> </div> <div class="border-t border-white/10 bg-black/30 backdrop-blur-sm"> <div class="signal-marquee overflow-hidden"> <div class="signal-marquee-track flex w-max gap-8 px-md py-3 lg:px-xl"> <span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> python automation </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> playwright browser control </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> REST API bridge </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> astro static site </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> n8n workflows </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> multi-platform publishing </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> graph API integration </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> dry-run validation </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> python automation </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> playwright browser control </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> REST API bridge </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> astro static site </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> n8n workflows </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> multi-platform publishing </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> graph API integration </span><span class="font-data text-[11px] uppercase tracking-[0.34em] text-white/65"> dry-run validation </span> </div> </div> </div> </section> <section class="relative py-16 lg:py-24"> <div class="mx-auto max-w-[1500px] px-md lg:px-xl"> <div class="grid gap-8 border border-white/10 bg-[linear-gradient(135deg,rgba(0,229,255,0.08),rgba(255,255,255,0.02))] p-6 lg:grid-cols-[minmax(0,1.1fr)_340px] lg:p-8"> <div> <p class="font-data text-[11px] uppercase tracking-[0.3em] text-fg-cyan">podcast + videopodcast</p> <h2 class="mt-4 max-w-[12ch] font-display text-4xl leading-[0.86] tracking-[0.08em] text-fg-white sm:text-5xl">
La señal ahora también sale en audio RSS y YouTube largo.
</h2> <p class="mt-4 max-w-2xl text-base leading-relaxed text-fg-gray">
Cada episodio vive como audio-first en el feed del podcast, página canónica en el sitio y videopodcast 16:9 con visualizer editorial en el canal de YouTube.
</p> <div class="mt-8 flex flex-wrap gap-4"> <a href="/podcast" class="inline-flex items-center justify-center border border-fg-cyan bg-fg-cyan px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-black transition-transform duration-300 hover:-translate-y-0.5">
abrir podcast
</a> <a href="/podcast/rss.xml" class="inline-flex items-center justify-center border border-white/15 px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-white transition-colors duration-300 hover:border-white/35 hover:bg-white/5">
feed rss
</a> </div> </div> <article class="group border-t border-white/10 pt-md"> <a href="/podcast/frecuencia-global-podcast-ep-002" class="mb-md block aspect-video overflow-hidden border border-white/10 bg-fg-surface/30"> <img src="/images/og/fg_website_hero_20260402_v1.webp" alt="Frecuencia Global Podcast 002: quien controla tu feed y por que importa" class="h-full w-full object-cover transition-transform duration-700 group-hover:scale-[1.04]" loading="lazy"> </a> <div class="flex flex-wrap items-center justify-between gap-3"> <span class="inline-block font-data tracking-widest border rounded-sm bg-pilar-p1/10 border-pilar-p1/30 text-pilar-p1 px-xs py-[2px] text-[10px]"> GEOPOLITIK DROP </span> <time class="font-data text-[10px] uppercase tracking-[0.24em] text-fg-gray" datetime="2026-04-03T00:00:00.000Z"> 02 abr 2026 </time> </div> <a href="/podcast/frecuencia-global-podcast-ep-002" class="mt-sm block"> <h3 class="font-display text-2xl leading-[0.9] tracking-[0.05em] text-fg-white transition-colors duration-300 group-hover:text-fg-cyan"> Frecuencia Global Podcast 002: quien controla tu feed y por que importa </h3> </a> <p class="mt-sm text-sm leading-relaxed text-fg-gray"> Segundo episodio de prueba del podcast y videopodcast de Frecuencia Global. Una lectura editorial sobre plataformas, dependencia tecnica y control de la distribucion digital. </p> <dl class="mt-4 grid grid-cols-2 gap-3 border-t border-white/10 pt-4 font-data text-[10px] uppercase tracking-[0.22em] text-fg-gray"> <div> <dt>episodio</dt> <dd class="mt-1 text-fg-white">S1 / EP02</dd> </div> <div> <dt>duración</dt> <dd class="mt-1 text-fg-white">19:08</dd> </div> <div class="col-span-2"> <dt>modo video</dt> <dd class="mt-1 text-fg-white">Visualizer editorial</dd> </div> <div class="col-span-2"> <dt>distribución</dt> <dd class="mt-1 text-fg-white">Spotify / Apple Podcasts / YouTube</dd> </div> </dl> </article> </div> </div> </section> <section class="relative py-16 lg:py-24 border-b border-white/10"> <div class="mx-auto max-w-[1500px] px-md lg:px-xl"> <p class="font-data text-[11px] uppercase tracking-[0.3em] text-fg-cyan">system overview</p> <h2 class="mt-4 font-display text-4xl leading-[0.86] tracking-[0.08em] text-fg-white sm:text-5xl">
HOW IT WORKS
</h2> <div class="mt-8 grid gap-6 lg:grid-cols-3"> <div class="border border-white/10 bg-white/[0.02] p-6"> <div class="flex items-center gap-3"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-fg-cyan); box-shadow: 0 0 2px var(--color-fg-cyan);" role="presentation"></span> <p class="font-data text-xs uppercase tracking-wider text-fg-cyan">1. Content Pipeline</p> </div> <p class="mt-3 text-sm leading-relaxed text-fg-gray">
Markdown files in <code class="font-data text-fg-cyan">04_Produccion/</code> contain platform-specific
content sections. A preflight validator checks structure before any publishing.
</p> </div> <div class="border border-white/10 bg-white/[0.02] p-6"> <div class="flex items-center gap-3"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-pilar-p3); box-shadow: 0 0 2px var(--color-pilar-p3);" role="presentation"></span> <p class="font-data text-xs uppercase tracking-wider text-pilar-p3">2. Bridge API</p> </div> <p class="mt-3 text-sm leading-relaxed text-fg-gray">
Python HTTP server on <code class="font-data text-fg-cyan">:3001</code> with API key auth.
Exposes 5 REST endpoints for validation, discovery, and batch runs.
</p> </div> <div class="border border-white/10 bg-white/[0.02] p-6"> <div class="flex items-center gap-3"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-pilar-p2); box-shadow: 0 0 2px var(--color-pilar-p2);" role="presentation"></span> <p class="font-data text-xs uppercase tracking-wider text-pilar-p2">3. Multi-Platform Publish</p> </div> <p class="mt-3 text-sm leading-relaxed text-fg-gray">
Dedicated scripts per platform: Playwright for browser automation (X, IG, LinkedIn),
Graph API for Threads, Bot API for Telegram.
</p> </div> </div> <div class="mt-8 flex flex-wrap gap-4"> <a href="/stack" class="inline-flex items-center justify-center border border-fg-cyan bg-fg-cyan px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-black transition-transform duration-300 hover:-translate-y-0.5">full technical stack</a> <a href="https://github.com/59gray" target="_blank" rel="noopener noreferrer" class="inline-flex items-center justify-center border border-white/15 px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-white transition-colors duration-300 hover:border-white/35 hover:bg-white/5">github.com/59gray</a> </div> </div> </section> <section class="relative py-16 lg:py-24"> <div class="mx-auto grid max-w-[1500px] gap-10 px-md lg:grid-cols-[minmax(0,0.95fr)_1.05fr] lg:gap-14 lg:px-xl"> <div> <p class="font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray">design philosophy</p> <h2 class="mt-4 max-w-[12ch] font-display text-4xl leading-[0.86] tracking-[0.08em] text-fg-white sm:text-5xl lg:text-6xl">
Automate the pipeline. Focus on the content.
</h2> </div> <div class="grid gap-8 sm:grid-cols-3"> <div class="border-t border-white/10 pt-4"> <p class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">Automation</p> <h3 class="mt-3 font-body text-base font-semibold leading-snug text-fg-white"> Markdown in, validated multi-platform posts out. </h3> <p class="mt-3 text-sm leading-relaxed text-fg-gray"> Each content piece goes through preflight checks, per-platform dry-runs, and automated publishing via scripts and APIs. </p> </div><div class="border-t border-white/10 pt-4"> <p class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">Architecture</p> <h3 class="mt-3 font-body text-base font-semibold leading-snug text-fg-white"> A local bridge server exposes the pipeline as REST. </h3> <p class="mt-3 text-sm leading-relaxed text-fg-gray"> Python HTTP server with API key auth, 5 endpoints, subprocess orchestration, and structured JSON responses. </p> </div><div class="border-t border-white/10 pt-4"> <p class="font-data text-[10px] uppercase tracking-[0.28em] text-fg-gray">Integration</p> <h3 class="mt-3 font-body text-base font-semibold leading-snug text-fg-white"> 6 platforms. Zero manual copy-paste. </h3> <p class="mt-3 text-sm leading-relaxed text-fg-gray"> X, Threads, Instagram, LinkedIn, Telegram, and AI image generation — each with dedicated scripts and persistent sessions. </p> </div> </div> </div> </section> <section class="relative py-16 lg:py-24"> <div class="absolute inset-x-0 top-0 h-px bg-[linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent)]" aria-hidden="true"></div> <div class="mx-auto grid max-w-[1500px] gap-10 px-md lg:grid-cols-[300px_minmax(0,1fr)] lg:gap-14 lg:px-xl"> <div class="h-fit lg:sticky lg:top-24"> <div class="mb-4 flex items-center gap-3 font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-pilar-p1); box-shadow: 0 0 2px var(--color-pilar-p1);" role="presentation"></span> <span>01 / canal</span> </div> <h2 class="font-display text-4xl leading-[0.86] tracking-[0.08em] sm:text-5xl lg:text-6xl text-pilar-p1"> GEOPOLITIK DROP </h2> <p class="mt-4 max-w-sm text-base leading-relaxed text-fg-gray"> Poder, conflicto y movimientos estratégicos globales. </p> <p class="mt-6 font-data text-[11px] uppercase tracking-[0.28em] text-white/55"> 01 drops listos </p> <a href="/pilares/geopolitik-drop" class="mt-7 inline-flex items-center font-data text-xs uppercase tracking-[0.26em] transition-colors duration-300 hover:text-fg-white text-pilar-p1">
entrar al pilar →
</a> </div> <div class="relative"> <div class="absolute bottom-0 left-0 top-0 w-px opacity-80 bg-[linear-gradient(180deg,rgba(0,229,255,0.75),transparent)]" aria-hidden="true"></div> <div class="pl-6 sm:pl-8"> <article class="group grid gap-6 border-b border-white/10 py-8 first:pt-0 last:border-b-0 last:pb-0 lg:grid-cols-[minmax(0,1fr)_260px] lg:gap-8"> <div> <div class="flex flex-wrap items-center gap-3 font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray"> <span class="text-white/45">#01</span> <span class="text-white/20">/</span> <time datetime="2026-03-30T00:00:00.000Z">29 mar 2026</time> </div> <a href="/contenido/cables-submarinos-geopolitica-internet" class="mt-4 block"> <h3 class="font-display text-2xl leading-[0.9] tracking-[0.05em] text-fg-white transition-colors duration-300 group-hover:text-fg-cyan sm:text-3xl"> Los cables submarinos que conectan (y controlan) internet </h3> </a> <p class="mt-4 max-w-2xl text-sm leading-relaxed text-fg-gray sm:text-base"> El 99% del tráfico de datos intercontinental viaja por cables de fibra óptica en el fondo del océano. Esta infraestructura invisible es el nuevo campo de batalla geopolítico. </p> <div class="mt-5 flex flex-wrap items-center gap-4"> <span class="inline-block font-data tracking-widest border rounded-sm bg-pilar-p1/10 border-pilar-p1/30 text-pilar-p1 px-xs py-[2px] text-[10px]"> GEOPOLITIK DROP </span> <a href="/contenido/cables-submarinos-geopolitica-internet" class="font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 hover:text-fg-white text-pilar-p1">
leer análisis →
</a> </div> </div> <a href="/contenido/cables-submarinos-geopolitica-internet" class="block aspect-[4/3] overflow-hidden border border-white/10 bg-fg-surface/30"> <img src="/images/articles/cables-submarinos.jpg" alt="Los cables submarinos que conectan (y controlan) internet" class="h-full w-full object-cover transition-transform duration-700 group-hover:scale-[1.04]" loading="lazy"> </a> </article> </div> </div> </div> </section><section class="relative py-16 lg:py-24"> <div class="absolute inset-x-0 top-0 h-px bg-[linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent)]" aria-hidden="true"></div> <div class="mx-auto grid max-w-[1500px] gap-10 px-md lg:grid-cols-[300px_minmax(0,1fr)] lg:gap-14 lg:px-xl"> <div class="h-fit lg:sticky lg:top-24"> <div class="mb-4 flex items-center gap-3 font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-pilar-p2); box-shadow: 0 0 2px var(--color-pilar-p2);" role="presentation"></span> <span>02 / canal</span> </div> <h2 class="font-display text-4xl leading-[0.86] tracking-[0.08em] sm:text-5xl lg:text-6xl text-pilar-p2"> BASS & BORDERS </h2> <p class="mt-4 max-w-sm text-base leading-relaxed text-fg-gray"> Música electrónica como lente cultural y geopolítico. </p> <p class="mt-6 font-data text-[11px] uppercase tracking-[0.28em] text-white/55"> 01 drops listos </p> <a href="/pilares/bass-and-borders" class="mt-7 inline-flex items-center font-data text-xs uppercase tracking-[0.26em] transition-colors duration-300 hover:text-fg-white text-pilar-p2">
entrar al pilar →
</a> </div> <div class="relative"> <div class="absolute bottom-0 left-0 top-0 w-px opacity-80 bg-[linear-gradient(180deg,rgba(255,0,229,0.75),transparent)]" aria-hidden="true"></div> <div class="pl-6 sm:pl-8"> <article class="group grid gap-6 border-b border-white/10 py-8 first:pt-0 last:border-b-0 last:pb-0 lg:grid-cols-[minmax(0,1fr)_260px] lg:gap-8"> <div> <div class="flex flex-wrap items-center gap-3 font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray"> <span class="text-white/45">#01</span> <span class="text-white/20">/</span> <time datetime="2026-04-06T00:00:00.000Z">05 abr 2026</time> </div> <a href="/contenido/techno-detroit-historia-musica-electronica" class="mt-4 block"> <h3 class="font-display text-2xl leading-[0.9] tracking-[0.05em] text-fg-white transition-colors duration-300 group-hover:text-fg-cyan sm:text-3xl"> El techno nació en Detroit, no en Berlín </h3> </a> <p class="mt-4 max-w-2xl text-sm leading-relaxed text-fg-gray sm:text-base"> La historia de la música electrónica es también una historia de migración, resistencia y globalización cultural. De las fábricas de Detroit a las pistas de baile del mundo. </p> <div class="mt-5 flex flex-wrap items-center gap-4"> <span class="inline-block font-data tracking-widest border rounded-sm bg-pilar-p2/10 border-pilar-p2/30 text-pilar-p2 px-xs py-[2px] text-[10px]"> BASS & BORDERS </span> <a href="/contenido/techno-detroit-historia-musica-electronica" class="font-data text-xs uppercase tracking-[0.24em] transition-colors duration-300 hover:text-fg-white text-pilar-p2">
leer análisis →
</a> </div> </div> <a href="/contenido/techno-detroit-historia-musica-electronica" class="block aspect-[4/3] overflow-hidden border border-white/10 bg-fg-surface/30"> <img src="/images/articles/techno-detroit.jpg" alt="El techno nació en Detroit, no en Berlín" class="h-full w-full object-cover transition-transform duration-700 group-hover:scale-[1.04]" loading="lazy"> </a> </article> </div> </div> </div> </section><section class="relative py-16 lg:py-24"> <div class="absolute inset-x-0 top-0 h-px bg-[linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent)]" aria-hidden="true"></div> <div class="mx-auto grid max-w-[1500px] gap-10 px-md lg:grid-cols-[300px_minmax(0,1fr)] lg:gap-14 lg:px-xl"> <div class="h-fit lg:sticky lg:top-24"> <div class="mb-4 flex items-center gap-3 font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-pilar-p3); box-shadow: 0 0 2px var(--color-pilar-p3);" role="presentation"></span> <span>03 / canal</span> </div> <h2 class="font-display text-4xl leading-[0.86] tracking-[0.08em] sm:text-5xl lg:text-6xl text-pilar-p3"> FRECUENCIA GLOBAL </h2> <p class="mt-4 max-w-sm text-base leading-relaxed text-fg-gray"> Tecnología, datos y las fuerzas que dan forma al mundo. </p> <p class="mt-6 font-data text-[11px] uppercase tracking-[0.28em] text-white/55"> canal en preparación </p> <a href="/pilares/frecuencia-global" class="mt-7 inline-flex items-center font-data text-xs uppercase tracking-[0.26em] transition-colors duration-300 hover:text-fg-white text-pilar-p3">
entrar al pilar →
</a> </div> <div class="relative"> <div class="absolute bottom-0 left-0 top-0 w-px opacity-80 bg-[linear-gradient(180deg,rgba(184,255,0,0.75),transparent)]" aria-hidden="true"></div> <div class="pl-6 sm:pl-8"> <div class="py-10"> <p class="font-display text-3xl leading-[0.9] tracking-[0.05em] text-pilar-p3">
afinando la señal
</p> <p class="mt-4 max-w-2xl text-base leading-relaxed text-fg-gray">
Este canal ya tiene identidad editorial definida, pero todavía estamos armando su primera tanda de piezas.
La idea es que la portada también muestre qué viene después, no solo lo ya publicado.
</p> </div> </div> </div> </div> </section><section class="relative py-16 lg:py-24"> <div class="absolute inset-x-0 top-0 h-px bg-[linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent)]" aria-hidden="true"></div> <div class="mx-auto grid max-w-[1500px] gap-10 px-md lg:grid-cols-[300px_minmax(0,1fr)] lg:gap-14 lg:px-xl"> <div class="h-fit lg:sticky lg:top-24"> <div class="mb-4 flex items-center gap-3 font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray"> <span class="inline-block rounded-full w-2 h-2" style="background: var(--color-pilar-p4); box-shadow: 0 0 2px var(--color-pilar-p4);" role="presentation"></span> <span>04 / canal</span> </div> <h2 class="font-display text-4xl leading-[0.86] tracking-[0.08em] sm:text-5xl lg:text-6xl text-pilar-p4"> BEHIND THE POLICY </h2> <p class="mt-4 max-w-sm text-base leading-relaxed text-fg-gray"> Lo que hay detrás de las políticas que afectan tu vida. </p> <p class="mt-6 font-data text-[11px] uppercase tracking-[0.28em] text-white/55"> canal en preparación </p> <a href="/pilares/behind-the-policy" class="mt-7 inline-flex items-center font-data text-xs uppercase tracking-[0.26em] transition-colors duration-300 hover:text-fg-white text-pilar-p4">
entrar al pilar →
</a> </div> <div class="relative"> <div class="absolute bottom-0 left-0 top-0 w-px opacity-80 bg-[linear-gradient(180deg,rgba(74,107,255,0.75),transparent)]" aria-hidden="true"></div> <div class="pl-6 sm:pl-8"> <div class="py-10"> <p class="font-display text-3xl leading-[0.9] tracking-[0.05em] text-pilar-p4">
afinando la señal
</p> <p class="mt-4 max-w-2xl text-base leading-relaxed text-fg-gray">
Este canal ya tiene identidad editorial definida, pero todavía estamos armando su primera tanda de piezas.
La idea es que la portada también muestre qué viene después, no solo lo ya publicado.
</p> </div> </div> </div> </div> </section><section class="px-md pb-16 pt-8 lg:px-xl lg:pb-24"> <div class="mx-auto max-w-[1500px] border border-white/10 bg-[linear-gradient(135deg,rgba(255,255,255,0.04),rgba(255,255,255,0.01))] px-6 py-8 sm:px-8 sm:py-10 lg:flex lg:items-end lg:justify-between lg:gap-10"> <div> <p class="font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray">última llamada</p> <h2 class="mt-4 max-w-[13ch] font-display text-4xl leading-[0.86] tracking-[0.08em] text-fg-white sm:text-5xl">
Si la señal te sirve, sigamos construyéndola.
</h2> <p class="mt-4 max-w-2xl text-base leading-relaxed text-fg-gray">
El siguiente paso es llenar cada pilar con más drops, consolidar la línea de podcast semanal y conectar un dominio propio para dejar atrás el `vercel.app`.
</p> </div> <div class="mt-8 flex flex-wrap gap-4 lg:mt-0"> <a href="/contenido" class="inline-flex items-center justify-center border border-fg-cyan bg-fg-cyan px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-black transition-transform duration-300 hover:-translate-y-0.5">
ver archivo
</a> <a href="/podcast" class="inline-flex items-center justify-center border border-white/15 px-5 py-3 font-data text-xs uppercase tracking-[0.26em] text-fg-white transition-colors duration-300 hover:border-white/35 hover:bg-white/5">
escuchar podcast
</a> </div> </div> </section> </main> <footer class="relative mt-20 border-t border-white/10"> <div class="absolute inset-0 bg-[radial-gradient(circle_at_20%_20%,rgba(0,229,255,0.08),transparent_25%),radial-gradient(circle_at_78%_18%,rgba(74,107,255,0.08),transparent_24%)]" aria-hidden="true"></div> <div class="relative mx-auto max-w-[1500px] px-md py-12 lg:px-xl lg:py-16"> <div class="grid gap-10 lg:grid-cols-[minmax(0,1.2fr)_0.8fr_0.8fr]"> <div> <p class="font-data text-[11px] uppercase tracking-[0.3em] text-fg-gray">fin de transmisión</p> <h2 class="mt-4 font-display text-4xl leading-[0.86] tracking-[0.08em] text-fg-white sm:text-5xl">
FRECUENCIA GLOBAL
</h2> <p class="mt-4 max-w-xl text-base leading-relaxed text-fg-gray">
Geopolítica, cultura y tecnología contadas con rigor editorial y energía de club nocturno.
</p> </div> <div class="grid gap-10 sm:grid-cols-2 lg:col-span-2"> <div> <h3 class="font-data text-[11px] uppercase tracking-[0.28em] text-fg-gray">pilares</h3> <ul class="mt-4 space-y-3"> <li> <a href="/pilares/geopolitik-drop" class="font-body text-sm transition-colors duration-300 hover:text-fg-white text-pilar-p1"> Geopolitik Drop </a> </li><li> <a href="/pilares/bass-and-borders" class="font-body text-sm transition-colors duration-300 hover:text-fg-white text-pilar-p2"> Bass & Borders </a> </li><li> <a href="/pilares/frecuencia-global" class="font-body text-sm transition-colors duration-300 hover:text-fg-white text-pilar-p3"> Frecuencia Global </a> </li><li> <a href="/pilares/behind-the-policy" class="font-body text-sm transition-colors duration-300 hover:text-fg-white text-pilar-p4"> Behind the Policy </a> </li> </ul> </div> <div> <h3 class="font-data text-[11px] uppercase tracking-[0.28em] text-fg-gray">rutas</h3> <ul class="mt-4 space-y-3"> <li> <a href="/contenido" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> Contenido </a> </li><li> <a href="/podcast" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> Podcast </a> </li><li> <a href="/stack" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> Stack </a> </li><li> <a href="/sobre" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> Sobre </a> </li><li> <a href="/contacto" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> Contacto </a> </li><li> <a href="/rss.xml" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> RSS Artículos </a> </li><li> <a href="/podcast/rss.xml" class="font-body text-sm text-fg-gray transition-colors duration-300 hover:text-fg-white"> RSS Podcast </a> </li> </ul> </div> <div class="sm:col-span-2"> <h3 class="font-data text-[11px] uppercase tracking-[0.28em] text-fg-gray">social</h3> <div class="mt-4 flex flex-wrap gap-4"> <a href="https://instagram.com/globalfrequency.es" target="_blank" rel="noopener noreferrer" class="font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray transition-colors duration-300 hover:text-fg-cyan"> Instagram </a><a href="https://youtube.com/@FrecuenciaGlobal" target="_blank" rel="noopener noreferrer" class="font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray transition-colors duration-300 hover:text-fg-cyan"> YouTube </a><a href="https://tiktok.com/@frecuenciaglobal" target="_blank" rel="noopener noreferrer" class="font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray transition-colors duration-300 hover:text-fg-cyan"> TikTok </a><a href="https://x.com/frec_global" target="_blank" rel="noopener noreferrer" class="font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray transition-colors duration-300 hover:text-fg-cyan"> X </a><a href="https://www.linkedin.com/company/frecuencia-global" target="_blank" rel="noopener noreferrer" class="font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray transition-colors duration-300 hover:text-fg-cyan"> LinkedIn </a> </div> </div> </div> </div> <div class="mt-10 flex flex-col gap-3 border-t border-white/10 pt-5 font-data text-[11px] uppercase tracking-[0.24em] text-fg-gray sm:flex-row sm:items-center sm:justify-between"> <p>© 2026 Frecuencia Global. Todos los derechos reservados.</p> <p> <span class="text-fg-cyan">●</span> transmitiendo
</p> </div> </div> </footer> </body></html>