Código web radio
<div style="font-family:Arial,sans-serif;max-width:900px;margin:0 auto;padding:20px;color:#1f2937">
<h1>Radio Chat Cristiana</h1>
<p>Música cristiana, mensaje de fe y chat grupal en vivo para compartir esperanza todos los días.</p>
<h2>En vivo 24/7</h2>
<audio controls style="width:100%">
<source src="URL_REAL_DE_TU_RADIO" type="audio/mpeg">
Tu navegador no admite el reproductor de audio.
</audio>
<h2 style="margin-top:24px">Chat grupal</h2>
<p>Pega aquí el código real de tu chat (Tawk.to, Tidio, etc.) en un segundo bloque incrustado.</p>
</div>
<audio id="stream" controls preload="none" style="width:400px;">
<source src="https://server01.heplayer.com/8072/stream" type="audio/mpeg">
Tu navegador no admite el reproductor de audio.
</audio>
<style>
.rc-page{font-family:Arial,sans-serif;max-width:1100px;margin:0 auto;padding:24px;color:#1f2937}
.rc-hero{background:linear-gradient(135deg,#0f172a,#14532d);color:#fff;border-radius:20px;padding:42px 28px;text-align:center}
.rc-hero h1{font-size:42px;line-height:1.1;margin:0 0 14px}
.rc-hero p{font-size:18px;max-width:760px;margin:0 auto 22px}
.rc-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.rc-btn{display:inline-block;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:700}
.rc-btn.primary{background:#22c55e;color:#fff}
.rc-btn.secondary{background:#fff;color:#14532d}
.rc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:22px}
.rc-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:20px;box-shadow:0 4px 18px rgba(0,0,0,.05)}
.rc-card h2{margin:0 0 10px;font-size:22px;color:#14532d}
.rc-audio{width:100%;margin-top:10px}
.rc-footer{margin-top:22px;text-align:center;font-size:14px;color:#6b7280}
</style>
<div class="rc-page">
<section class="rc-hero">
<h1>Radio Chat Cristiana</h1>
<p>Música cristiana, mensaje de fe y chat grupal en vivo para compartir esperanza todos los días.</p>
<div class="rc-btns">
<a class="rc-btn primary" href="#en-vivo">Escuchar en vivo</a>
<a class="rc-btn secondary" href="#chat">Entrar al chat</a>
</div>
</section>
<div class="rc-grid">
<section class="rc-card" id="en-vivo">
<h2>En vivo 24/7</h2>
<p>Escucha nuestra programación con alabanza, palabra de Dios y momentos especiales para toda la familia.</p>
<audio class="rc-audio" controls preload="none">
<source src="https://server01.heplayer.com/8072/stream" type="audio/mpeg">
Tu navegador no admite el reproductor de audio.
</audio>
</section>
<section class="rc-card" id="chat">
<h2>Chat grupal</h2>
<p>Conéctate con nuestra comunidad, comparte tu saludo y participa en un espacio sano, respetuoso y cristiano.</p>
<div style="border:1px dashed #94a3b8;border-radius:14px;padding:18px;background:#f8fafc;">
Pega aquí el código de tu chat (Tawk.to, Tidio, etc.).
</div>
</section>
<section class="rc-card">
<h2>Sobre nosotros</h2>
<p>Somos un proyecto cristiano dedicado a bendecir vidas con música, mensaje y comunidad.</p>
</section>
<section class="rc-card">
<h2>Contacto</h2>
<p>¿Quieres colaborar con nosotros? Escríbenos y con gusto te respondemos.</p>
</section>
</div>
<div class="rc-footer">
Radio Chat Cristiana — fe, música y comunidad.
</div>
</div>