Footer

<footer class="cl-footer">
  <div class="container">
    <div class="cl-footer__inner">
      <div class="cl-footer__brand">
        <a class="cl-logo cl-footer__logo" href="/">
          <span class="cl-logo__text">
            <span class="cl-logo__domain">Secretaría de&nbsp;</span>
            <span class="cl-logo__name">Gobierno Digital</span>
          </span>
        </a>
        <p class="cl-footer__tagline">
          El sistema de diseño digital para construir los servicios de Chile
        </p>
      </div>

      <nav class="cl-footer__col" aria-labelledby="footer-heading-sistema">
        <p id="footer-heading-sistema" class="cl-footer__heading">Sistema de diseño</p>
        <ul class="cl-footer__links">
          <li><a class="cl-footer__link" href="/comenzar">Comenzar</a></li>
          <li><a class="cl-footer__link" href="/fundamentos">Fundamentos</a></li>
          <li><a class="cl-footer__link" href="/componentes">Componentes</a></li>
          <li><a class="cl-footer__link" href="/patrones">Patrones</a></li>
          <li><a class="cl-footer__link" href="/contenidos-digitales">Contenido</a></li>
          <li><a class="cl-footer__link" href="/calidad">Calidad y evaluación</a></li>
        </ul>
      </nav>

      <nav class="cl-footer__col" aria-labelledby="footer-heading-pacifico">
        <p id="footer-heading-pacifico" class="cl-footer__heading">Pacífico para</p>
        <ul class="cl-footer__links">
          <li><a class="cl-footer__link" href="/fundamentos">Diseñadores</a></li>
          <li><a class="cl-footer__link" href="/desarrollo">Desarrolladores</a></li>
          <li><a class="cl-footer__link" href="/contenidos-digitales">UX writers y contenido</a></li>
          <li><a class="cl-footer__link" href="/metodologia">Líderes de proyecto</a></li>
          <li><a class="cl-footer__link" href="/gobernanza">Coordinadores de TD</a></li>
        </ul>
      </nav>

      <nav class="cl-footer__col" aria-labelledby="footer-heading-ayuda">
        <p id="footer-heading-ayuda" class="cl-footer__heading">Ayuda</p>
        <ul class="cl-footer__links">
          <li><a class="cl-footer__link" href="/ayuda">Reportar problemas y errores</a></li>
          <li><a class="cl-footer__link" href="/ayuda">Solicitar/contribuir nuevos recursos</a></li>
          <li><a class="cl-footer__link" href="/ayuda">Comunidad</a></li>
          <li><a class="cl-footer__link" href="/ayuda">Aprende con videos</a></li>
          <li><a class="cl-footer__link" href="/ayuda">Contactar al equipo de soporte</a></li>
        </ul>
      </nav>

      <nav class="cl-footer__col" aria-labelledby="footer-heading-herramientas">
        <p id="footer-heading-herramientas" class="cl-footer__heading">Repositorios y herramientas</p>
        <ul class="cl-footer__links">
          <li>
            <a class="cl-footer__link" href="https://github.com/Asimovers/kitdigital-gob-cl" target="_blank" rel="noopener noreferrer">
              Github
              <span class="cl-icon" data-icon="open-in-new" aria-hidden="true"></span>
            </a>
          </li>
          <li>
            <a class="cl-footer__link" href="https://kitdigital.gob.cl" target="_blank" rel="noopener noreferrer">
              Storybook
              <span class="cl-icon" data-icon="open-in-new" aria-hidden="true"></span>
            </a>
          </li>
          <li>
            <a class="cl-footer__link" href="https://www.figma.com/design/VsV94WqHDDbMsfNO8woCz2/" target="_blank" rel="noopener noreferrer">
              Figma
              <span class="cl-icon" data-icon="open-in-new" aria-hidden="true"></span>
            </a>
          </li>
          <li>
            <a class="cl-footer__link" href="https://digital.gob.cl" target="_blank" rel="noopener noreferrer">
              Digital.gob.cl
              <span class="cl-icon" data-icon="open-in-new" aria-hidden="true"></span>
            </a>
          </li>
          <li>
            <a class="cl-footer__link" href="https://wikiguias.digital.gob.cl" target="_blank" rel="noopener noreferrer">
              Wikiguias
              <span class="cl-icon" data-icon="open-in-new" aria-hidden="true"></span>
            </a>
          </li>
          <li>
            <a class="cl-footer__link" href="https://kitdigital.gob.cl" target="_blank" rel="noopener noreferrer">
              Kitdigital.gob.cl
              <span class="cl-icon" data-icon="open-in-new" aria-hidden="true"></span>
            </a>
          </li>
        </ul>
      </nav>

      <span class="cl-brand-stripe" aria-hidden="true">
        <span class="cl-brand-stripe__bar cl-brand-stripe__bar--brand"></span>
        <span class="cl-brand-stripe__bar cl-brand-stripe__bar--accent"></span>
      </span>
    </div>
  </div>
</footer>

<footer class="cl-footer-clave-unica">
  <div class="cl-footer-clave-unica__col">
    <span>Colabora:</span>
  </div>
  <div class="cl-footer-clave-unica__center">
    Servicio de autenticación ClaveÚnica®<br />
    Gobierno de Chile
  </div>
  <div class="cl-footer-clave-unica__col">
    <span>Administra:</span>
  </div>
</footer>

<footer class="cl-footer-producto">
  <div class="cl-footer-producto__version">Versión 0.0.0</div>
  <a class="cl-footer-producto__link" href="#">Conoce detalles y versiones anteriores</a>
</footer>