Rediseño de la enredadera y páginas nuevas

Portada
- La bajada del título pasa de un trazo de grosor constante a dos cintas
  trenzadas que se afilan, con la punta rematada en zarcillo. El viewBox es
  1000x72 y la caja mide el 7.2% del ancho de la rejilla, así que la escala
  sale uniforme y el dibujo no se deforma en ninguna pantalla.
- El giro de la esquina es una Bézier cúbica de salida vertical y la franja
  entra también vertical: radio mínimo 26 unidades en vez de 15.
- La franja entera pasa de trazos a cintas. La cola deja de ser un lazo y
  abre un bucle afilado que remata una espiral logarítmica verde, con centro
  y sentido derivados de la tangente del tallo.
- El rabillo de la hoja pasa de 24 a 42 unidades (recuadro 100x132) para que
  el limbo no cruce la raíz. Con él, el origen del giro (1.52%) y la etiqueta
  (62%), que se miden sobre ese alto.
- Letra de las etiquetas un 10% mayor. "La Enre" a 164 grados y tamaño 1.16;
  "Calendario", a 1.00.

Móvil
- El tallo pasa de una recta a una onda de coseno, media vuelta por celda, en
  un recuadro cuadrado para que la escala sea uniforme. Tres dibujos: la onda,
  su espejo para las celdas pares y el remate en espiral de la última.
- Las seis hojas entran sin deslizar de 320x568 en adelante: la celda reparte
  el alto disponible en vez de medir lo que mide la hoja, --ancho-hoja se mide
  contra las dos dimensiones y la cabecera baja de 104 a 68px.
- El abanico de REDES se recoloca (centro -0.25r, apertura 0.50r) para caber
  en el hueco nuevo.

Páginas
- colectivos.html, calendario.html, eventos.html, tatus.html, panel.html y
  404.html.
- El calendario semanal esconde la semana entera vacía que dibujaba de más.

Comprobado con qa.py: 0 fallos y 0 avisos en 150 mediciones (10 páginas por
15 pantallas), con contraste, foco, brotes y HTML roto incluidos.

404.html

@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html lang="es">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Esta hoja no existe · La Enredadera de Tetuán</title>
+  <meta name="description" content="La página que buscabas no está. Vuelve a la enredadera y sigue otra hoja.">
+  <!-- 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="Esta hoja no existe · La Enredadera de Tetuán">
+  <meta property="og:description" content="La página que buscabas no está. Vuelve a la enredadera y sigue otra hoja.">
+  <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="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Anton&family=Rock+Salt&display=swap">
+  <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>
+
+<div class="container">
+
+  <aside class="sidebar">
+    <img src="/INFO/logo_enre_negro.png" alt="" class="logo" width="192" height="192">
+    <!-- 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">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" aria-current="page">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>Esta hoja no existe</h1>
+      <p class="sub">La rama que seguías se ha secado</p>
+    </header>
+
+    <a class="volver" href="/index.html">← Volver a la enredadera</a>
+
+    <article class="texto">
+        <h2>No está aquí</h2>
+        <p>La página que buscabas no existe. Puede que el enlace esté viejo o
+          que la hayamos movido de sitio.</p>
+        <p>Vuelve a <a href="/">la enredadera</a> y sigue otra hoja: ahí están
+          los <a href="/colectivos.html">colectivos</a>, el
+          <a href="/calendario.html">calendario</a> de cada semana y los
+          <a href="/eventos.html">eventos</a> que vienen.</p>
+        <p>Si has llegado desde un enlace de otra web y crees que deberíamos
+          saberlo, escríbenos a
+          <a href="mailto:enredadera@riseup.net">enredadera@riseup.net</a>.</p>
+      </article>
+
+
+    <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>
+
+</body>
+</html>