ENRE_WEB/colectivos.html

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Colectivos · La Enredadera de Tetuán</title>
  <meta name="description" content="Los colectivos que habitan el CSO La Enredadera de Tetuán: feminismos, vivienda, hacklab, bicilab, biblioteca libre y más.">
  <!-- Vista previa al compartir el enlace (Mastodon, Telegram, WhatsApp). -->
  <meta property="og:type" content="website">
  <meta property="og:site_name" content="CSO La Enredadera de Tetuán">
  <meta property="og:locale" content="es_ES">
  <meta property="og:title" content="Colectivos · La Enredadera de Tetuán">
  <meta property="og:description" content="Los colectivos que habitan el CSO La Enredadera de Tetuán: feminismos, vivienda, hacklab, bicilab, biblioteca libre y más.">
  <meta property="og:image" content="/INFO/cso_laenre.jpeg">
  <meta property="og:image:alt" content="Fachada del CSO La Enredadera: el cartel «La Enredadera» pintado a mano letra a letra sobre la puerta, y encima el mural «El último tesoro que le queda a la ciudad, es el barrio»">
  <meta name="twitter:card" content="summary_large_image">
  <link rel="preload" href="/Code462WPink-Regular.ttf" as="font" type="font/ttf" crossorigin>
  <link rel="icon" href="/favicon.svg" type="image/svg+xml">
  <link rel="icon" href="/favicon.ico" sizes="any">
  <link rel="stylesheet" href="/index.css">
</head>
<body>

<input type="checkbox" id="nav-toggle" class="sr-only">
<label for="nav-toggle" class="sb-toggle" aria-label="Abrir o cerrar el menú">☰</label>
<label for="nav-toggle" class="sb-overlay" aria-hidden="true"></label>

<svg class="defs" aria-hidden="true" focusable="false" width="0" height="0">
  <symbol id="hoja-forma" viewBox="0 0 100 132">
    <!-- Volteada: el rabillo queda arriba y la hoja cuelga. Así el punto por
         el que se agarra a la raíz es la esquina superior del recuadro, y el
         giro no depende de ningún porcentaje. -->
    <g transform="translate(0,132) scale(1,-1)" fill="none" stroke-linejoin="round" stroke-linecap="round">
      <!-- Rabillo, en marrón: es la parte leñosa que engancha con el tallo.
           Mide 42 y no 24: con el corto, el limbo nacía pegado a la raíz y
           la cruzaba. El recuadro crece con él (114 -> 132) para que la caja
           siga midiendo lo que se dibuja; el limbo no cambia de tamaño. -->
      <path stroke="var(--rabillo)" stroke-width="3.2" d="M50 88 L50 130"/>
      <!-- Zarcillo verde. Sale solo en algunas hojas: el CSS enciende
           --zarcillo en una de cada tres para que no salgan calcadas. -->
      <path stroke="var(--nervio)" stroke-width="1.9" stroke-opacity="var(--zarcillo,0)"
            d="M50 100 C38 98 32 90 36 84 C39 80 45 82 44 88 C43 94 36 96 30 92"/>
      <!-- Contorno de hoja de hiedra, en rosa -->
      <path stroke="var(--trazo)" stroke-width="2.7"
            d="M50 5 C56 20 61 36 65 48 C76 44 89 40 96 45 C96 62 84 74 70 80 C62 84 56 83 50 88 C44 83 38 84 30 80 C16 74 4 62 4 45 C11 40 24 44 35 48 C39 36 44 20 50 5 Z"/>
      <!-- Nervadura palmada, en verde: los cinco nervios salen del rabillo -->
      <g stroke="var(--nervio)" stroke-width="1.5">
        <path d="M50 86 L50 13"/>
        <path d="M50 86 C59 72 78 56 90 48"/>
        <path d="M50 86 C41 72 22 56 10 48"/>
        <path d="M50 86 C57 84 65 81 71 77"/>
        <path d="M50 86 C43 84 35 81 29 77"/>
      </g>
    </g>
  </symbol>
</svg>

<div class="container">

  <aside class="sidebar">
    <!-- El botón va antes que el logo: es lo primero que se ve al abrir el
         menú, y la asamblea lo quiso arriba del todo. -->
    <a class="sb-pedir" href="/pedir/">Pedir evento</a>
    <img src="/INFO/logo_enre_negro.png" alt="" class="logo" width="96" height="96">
    <!-- Es la marca del panel, no un encabezado de sección: como el panel
         va ANTES del <main>, un <h2> aquí hacía que el primer encabezado
         del documento fuera de nivel 2 y el <h1> viniera después. -->
    <p class="sb-marca">La Enredadera</p>
    <p class="lema">Centro Social Autogestionado en Tetuán. Haciendo barrio desde 2009.</p>
    <nav class="sidebar-nav" aria-label="Secciones">
      <ul>
        <li><a href="/colectivos.html" aria-current="page">Colectivos</a></li>
        <li><a href="/calendario.html">Calendario</a></li>
        <li><a href="/eventos.html">Eventos</a></li>
        <li><a href="/subdir/campa.html">Campañas</a></li>
        <li><a href="/subdir/sobre_nosotrxs.html">La Enre</a></li>
        <li><a href="/subdir/contacto.html">Contacto</a></li>
        <li><a href="https://okupanel.laenre.net">Actividades</a></li>
        <li><a href="https://www.instagram.com/la_enredadera_de_tetuan/">Instagram</a></li>
        <li><a href="https://masto.es/@csolaenre">Mastodon</a></li>
      </ul>
    </nav>
  </aside>

  <main class="main">

    <header class="cabecera">
      <h1>COLECTIVOS</h1>
      <p class="sub">Cada hoja, una asamblea. Pulsa para conocerla.</p>
    </header>

    <a class="volver" href="/index.html">← Volver a la enredadera</a>

    <div class="enredadera-wrap">
      <ul class="enredadera" id="hojas">

        <li>
          <a class="hoja" href="#ficha-feminismos">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Feminismos</span>
          </a>
        </li>

        <li>
          <a class="hoja" href="#ficha-vivienda">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Vivienda</span>
          </a>
        </li>

        <li>
          <a class="hoja" href="#ficha-fridays">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Fridays for Future</span>
          </a>
        </li>

        <li>
          <a class="hoja" href="#ficha-hacklab">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Hacklab</span>
          </a>
        </li>

        <li>
          <a class="hoja" href="#ficha-biblioteka">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Biblioteca Libre</span>
          </a>
        </li>

        <li>
          <a class="hoja" href="#ficha-bicilab">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Bicilab</span>
          </a>
        </li>

        <li>
          <a class="hoja" href="/tatus.html">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Tattoo Circus</span>
          </a>
        </li>

        <!-- Colectivos que existen pero aún no han escrito su ficha.
             Van con la clase "brota": hoja más tenue, pero visible. -->
        <li>
          <a class="hoja brota" href="#ficha-circo">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Circo</span>
          </a>
        </li>

        <li>
          <a class="hoja brota" href="#ficha-tienda-gratis">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Tienda Gratis</span>
          </a>
        </li>

        <li>
          <a class="hoja brota" href="#ficha-warawas">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Warawas</span>
          </a>
        </li>

        <li>
          <a class="hoja brota" href="#ficha-hongos">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Hongos</span>
          </a>
        </li>

        <li>
          <a class="hoja brota" href="#ficha-fermentos">
            <svg class="hoja-svg" viewBox="0 0 100 132" aria-hidden="true"><use href="#hoja-forma"></use></svg>
            <span class="hoja-txt">Fermentos</span>
          </a>
        </li>

      </ul>
    </div>

    <footer class="pie-pagina">
      <p>
        Calle de la Coruña nº 5, Madrid ·
        <a href="mailto:enredadera@riseup.net">enredadera@riseup.net</a> ·
        <a href="https://masto.es/@csolaenre">@csolaenre</a>
      </p>
    </footer>

  </main>
</div>


<!-- ==============================================================
     FICHAS. Cada una se abre con :target, sin JavaScript. El botón
     atrás del navegador funciona y el enlace se puede compartir:
     laenre.net/colectivos.html#ficha-feminismos
     "Cerrar" apunta a #hojas, que deja de cumplirse el :target.
     ============================================================== -->

<article class="ficha" id="ficha-feminismos" aria-labelledby="t-feminismos">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-feminismos">Feminismos Tetuán</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <a href="https://www.instagram.com/feminismostetuan" target="_blank" rel="noopener" aria-label="Instagram de Feminismos Tetuán (abre en otra pestaña)">
        <img src="/INFO/feminismos_tetuan.jpg" alt="Ilustración de dos manos entrelazadas sobre fondo lila, con «feminismos tetuán» escrito a mano" loading="lazy" width="1080" height="1080">
      </a>
      <p><strong>Feminismo Tetuán</strong> es una asamblea de barrio que nace a raíz del movimiento del <strong>8M</strong>.</p>
      <p>Es una asamblea abierta no mixta transinclusiva. <strong>Nos reunimos los jueves a las 20</strong> en el CSO La Enredadera.</p>
      <p>Uno de los temas que más trabajamos es el derecho a la libre intervención del embarazo, ya que en nuestro barrio se encuentra la clínica Dator, la primera clínica en realizar abortos en España.</p>
      <ul class="enlaces">
        <li><a href="https://linktr.ee/FeminismosTetuan" target="_blank" rel="noopener">LinkTree<span class="sr-only"> (abre en otra pestaña)</span></a></li>
        <li><a href="https://www.instagram.com/feminismostetuan/" target="_blank" rel="noopener">Instagram<span class="sr-only"> (abre en otra pestaña)</span></a></li>
      </ul>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-vivienda" aria-labelledby="t-vivienda">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-vivienda">Colectivo de Vivienda</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <a href="https://www.instagram.com/organizacionviviendatetuan/" target="_blank" rel="noopener" aria-label="Instagram de la Organización de Vivienda de Tetuán (abre en otra pestaña)">
        <img src="/INFO/ovt.jpg" alt="Logotipo en blanco y negro: la silueta de una casa con una llama en la chimenea y el texto «Organización de Vivienda de Tetuán»" loading="lazy" width="1080" height="1080">
      </a>
      <p>Asamblea abierta desde donde defendemos que la vivienda es para quien la habita y no un negocio.</p>
      <p><strong>Nos reunimos los jueves a las 19</strong> en el CSO La Enredadera.</p>
      <ul class="enlaces">
        <li><a href="https://www.instagram.com/organizacionviviendatetuan/" target="_blank" rel="noopener">Instagram<span class="sr-only"> (abre en otra pestaña)</span></a></li>
      </ul>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-fridays" aria-labelledby="t-fridays">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-fridays">Fridays for Future</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <a href="https://linktr.ee/fridaysforfuturemadrid" target="_blank" rel="noopener" aria-label="Enlaces de Fridays for Future Madrid (abre en otra pestaña)">
        <img src="/INFO/fridays_madrid.jpg" alt="Logotipo circular verde: un globo terráqueo dibujado a mano, rodeado por el texto «Fridays for Future Madrid»" loading="lazy" width="1080" height="1080">
      </a>
      <p>Somos parte del movimiento global juvenil por la Justicia Climática.</p>
      <p><strong>Nos reunimos el segundo y el último viernes de cada mes</strong> en el CSO La Enredadera.</p>
      <ul class="enlaces">
        <li><a href="https://linktr.ee/fridaysforfuturemadrid" target="_blank" rel="noopener">LinkTree<span class="sr-only"> (abre en otra pestaña)</span></a></li>
        <li><a href="https://www.instagram.com/fridaysformadrid/" target="_blank" rel="noopener">Instagram<span class="sr-only"> (abre en otra pestaña)</span></a></li>
      </ul>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-hacklab" aria-labelledby="t-hacklab">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-hacklab">Hacklab La Raíz</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <a href="https://hacklab.laenre.net" target="_blank" rel="noopener" aria-label="Web del Hacklab La Raíz (abre en otra pestaña)">
        <img src="/INFO/hacklab.jpeg" alt="Ilustración de raíces de árbol sobre un circuito impreso verde oscuro con nodos luminosos, y el texto «Hacklab La Raíz»" loading="lazy" width="640" height="640">
      </a>
      <!-- PENDIENTE: escribir aquí el párrafo del Hacklab. La sección
           original no tenía ni una línea de texto, solo las dos fotos. -->
      <p>Tecnología libre, cacharreo y autodefensa digital en el CSO La Enredadera. <strong>Nos juntamos los viernes</strong>, salvo el segundo del mes, que es Art-Lab.</p>
      <a href="https://hacklab.laenre.net/eventos.html" target="_blank" rel="noopener" aria-label="Eventos del Hacklab La Raíz (abre en otra pestaña)">
        <img src="/INFO/teclado_negro_planta.jpg" alt="Primer plano de un teclado gris oscuro con brotes verdes creciendo entre las teclas" loading="lazy" width="474" height="474">
      </a>
      <ul class="enlaces">
        <li><a href="https://hacklab.laenre.net" target="_blank" rel="noopener">hacklab.laenre.net<span class="sr-only"> (abre en otra pestaña)</span></a></li>
      </ul>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-biblioteka" aria-labelledby="t-biblioteka">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-biblioteka">Biblioteca Libre</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p>Accede a libros, fanzines y documentos sobre activismo, agroecología, tecnología libre y feminismos.</p>
      <!-- El botón original apuntaba a /archivos/biblioteca.pdf, que no existe.
           Cuando subáis el PDF, devolvedlo aquí como <ul class="enlaces">. -->
    </div>
  </div>
</article>

<article class="ficha" id="ficha-bicilab" aria-labelledby="t-bicilab">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-bicilab">Bicilab</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p>Bocata de espaguetis todos los domingos a las 17:00 nos engrasamos las manos y recuperamos tu bicicleta!</p>
      <!-- OJO: el calendario semanal pone Bicilab el domingo a las 19:00 y este
           texto dice 17:00. Hay que decidir cuál es la hora buena. -->
      <!-- El botón original apuntaba a /archivos/asamblea.pdf, que no existe. -->
    </div>
  </div>
</article>

<article class="ficha" id="ficha-circo" aria-labelledby="t-circo">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-circo">Circo</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p class="aviso">Esta hoja todavía está brotando. El colectivo existe y se reúne en la Enre, pero aún no ha escrito su presentación. Si eres parte, pásate por la asamblea de los lunes y la publicamos.</p>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-tienda-gratis" aria-labelledby="t-tienda">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-tienda">Tienda Gratis</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p class="aviso">Esta hoja todavía está brotando. El colectivo existe y se reúne en la Enre, pero aún no ha escrito su presentación. Si eres parte, pásate por la asamblea de los lunes y la publicamos.</p>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-warawas" aria-labelledby="t-warawas">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-warawas">Warawas</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p class="aviso">Esta hoja todavía está brotando. El colectivo existe y se reúne en la Enre, pero aún no ha escrito su presentación. Si eres parte, pásate por la asamblea de los lunes y la publicamos.</p>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-hongos" aria-labelledby="t-hongos">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-hongos">Hongos</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p class="aviso">Esta hoja todavía está brotando. El colectivo existe y se reúne en la Enre, pero aún no ha escrito su presentación. Si eres parte, pásate por la asamblea de los lunes y la publicamos.</p>
    </div>
  </div>
</article>

<article class="ficha" id="ficha-fermentos" aria-labelledby="t-fermentos">
  <a class="ficha-fondo" href="#hojas" aria-label="Cerrar la ficha" tabindex="-1"></a>
  <div class="ficha-caja">
    <div class="ficha-cab">
      <h2 id="t-fermentos">Fermentos</h2>
      <a class="ficha-cerrar" href="#hojas" aria-label="Cerrar">×</a>
    </div>
    <div class="ficha-cuerpo">
      <p class="aviso">Esta hoja todavía está brotando. El colectivo existe y se reúne en la Enre, pero aún no ha escrito su presentación. Si eres parte, pásate por la asamblea de los lunes y la publicamos.</p>
    </div>
  </div>
</article>

</body>
</html>