about.html

<!DOCTYPE html>
<html lang="pt">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Sobre Nós - EyesEverywhere</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
  <link rel="stylesheet" href="css/styles.css">
</head>

<body>

  <nav class="navbar">
    <div class="container">
      <h1 class="logo">EyesEverywhere</h1>
      <ul class="nav-links">
        <li><a href="index.html">Início</a></li>
        <li><a href="about.html" class="active">Sobre Nós</a></li>
        <li><a href="ocorrencias.html">Ocorrências</a></li>
        <li><a href="contacto.html">Contacto</a></li>
      </ul>
    </div>
  </nav>

  <header class="header-pequeno">
    <div class="header-content">
      <h1>Sobre Nós</h1>
      <p>Início > Sobre Nós</p>
    </div>
  </header>

  <!-- SECÇÃO PRESERVAR HOJE - COM A NOVA IMAGEM -->
  <section class="secao-preservar">
    <div class="preservar-container">

      <div class="preservar-texto">
        <h2>🌿 Preservar Hoje,<br>Garantir o Amanhã</h2>
        <p>
          Atuamos todos os dias para assegurar que o património natural e histórico se mantém intacto e acessível para
          as futuras gerações.
          Através da tecnologia, educação e ação no terreno, construímos um legado de proteção ambiental e cultural.
        </p>
        <a href="#competencias" class="btn-verde">Saber Mais</a>
      </div>

      <div class="preservar-imagem">
        <img src="img/celebrar-natureza.jpg" alt="Trabalho de campo com tablet e ventoinhas">
      </div>

    </div>
  </section>

  <section class="cards">
    <div class="card">
      <h2 id="total-auditorias">...</h2>
      <p>Auditorias</p>
    </div>
    <div class="card">
      <h2 id="ocorrencias-resolvidas">...</h2>
      <p>Ocorrências resolvidas</p>
    </div>

    <div class="card">
      <h2>&lt;48h</h2>
      <p>Tempo médio de resposta</p>
    </div>
    <div class="card">
      <h2>93%</h2>
      <p>Satisfação dos visitantes</p>
    </div>
  </section>

  <section class="grelha-imagens">
    <img src="img/atividade1.jpg" alt="Cascata entre rochas escuras">
    <img src="img/atividade2.jpg" alt="Trilho na floresta">
    <img src="img/atividade3.jpg" alt="Pessoa em lago com cascata ao fundo">
    <img src="img/atividade4.jpg" alt="Cascata com lago verde">
  </section>

  <section class="section competencias" id="competencias">
    <h2>Competências e Áreas de Especialização</h2>
    <p>As nossas principais competências aplicadas à preservação do património:</p>

    <div class="competencias-grid">

      <div class="competencia-card">
        <img src="img/monitorizacao.jpg" alt="Monitorização no Terreno">
        <div class="conteudo-card">
          <h3>Monitorização no Terreno</h3>
          <p>Acompanhamento em tempo real com sensores, rondas de vigilância e relatórios de campo para identificar
            riscos precocemente.</p>
        </div>
      </div>

      <div class="competencia-card">
        <img src="img/educacao.jpg" alt="Educação Ambiental e Cultural">
        <div class="conteudo-card">
          <h3>Educação Ambiental e Cultural</h3>
          <p>Promovemos ações educativas junto de escolas, visitantes e comunidades locais, despertando interesse e
            respeito pelo património.</p>
        </div>
      </div>

      <div class="competencia-card">
        <img src="img/conservacao.jpg" alt="Ações de Conservação">
        <div class="conteudo-card">
          <h3>Ações de Conservação</h3>
          <p>Limpeza, manutenção preventiva e restauro de locais históricos e naturais, assegurando a sua preservação.
          </p>
        </div>
      </div>

      <div class="competencia-card">
        <img src="img/auditorias.jpg" alt="Auditorias Técnicas">
        <div class="conteudo-card">
          <h3>Auditorias Técnicas</h3>
          <p>Avaliações estruturais e técnicas em monumentos e trilhos para garantir segurança, estabilidade e
            acessibilidade.</p>
        </div>
      </div>

      <div class="competencia-card">
        <img src="img/tecnologias.jpg" alt="Tecnologias de Informação">
        <div class="conteudo-card">
          <h3>Tecnologias de Informação</h3>
          <p>Plataformas digitais, sensores inteligentes e dashboards interativos para análise e gestão em tempo real.
          </p>
        </div>
      </div>

    </div>
  </section>

  <section class="section testemunhos">
    <h2>Testemunhos & Feedbacks</h2>
    <p>O que dizem aqueles que já colaboraram na conservação do nosso trabalho:</p>

    <div class="testemunhos-grid">
      <div class="testemunho-card">
        <div class="aspas">“</div>
        <p class="mensagem">
          A EyesEverywhere foi essencial na preservação de locais turísticos importantes, garantindo a sua conservação
          para futuras gerações.
        </p>
        <h4 class="autor">Tiago Pinho</h4>
      </div>

      <div class="testemunho-card">
        <div class="aspas">“</div>
        <p class="mensagem">
          Excelente trabalho de proteção ambiental e informação ao visitante!
        </p>
        <h4 class="autor">Carla Silva</h4>
      </div>

      <div class="testemunho-card">
        <div class="aspas">“</div>
        <p class="mensagem">
          Conseguiram salvar uma ponte histórica que já estava esquecida.
        </p>
        <h4 class="autor">João Ribeiro</h4>
      </div>
    </div>
  </section>

  <footer class="footer">
    <div class="footer-container">
      <div class="footer-col">
        <h4>EyesEverywhere</h4>
        <p>Rua da Cultura, 125<br>4800-123 Guimarães, Portugal</p>
        <p><strong>Telefone:</strong> +351 253 123 456</p>
        <p><strong>Email:</strong> contacto@eyeseverywhere.pt</p>
      </div>

      <div class="footer-col">
        <h4>Links Úteis</h4>
        <ul>
          <li><a href="index.html">Página Inicial</a></li>
          <li><a href="about.html">Sobre nós</a></li>
          <li><a href="#">Auditorias</a></li>
          <li><a href="ocorrencias.html">Ocorrências</a></li>
        </ul>
      </div>

      <div class="footer-col">
        <h4>Os nossos serviços</h4>
        <ul>
          <li>Monitorização de Monumentos</li>
          <li>Auditoria de Trilhos Naturais</li>
          <li>Geocaching Sustentável</li>
          <li>Relatórios Públicos</li>
        </ul>
      </div>

      <div class="footer-col">
        <h4>© 2025 EyesEverywhere</h4>
        <p>Desenvolvido por EyesEverywhere Team</p>
        <div class="footer-socials">
          <a href="#"><i class="fab fa-facebook-f"></i></a>
          <a href="#"><i class="fab fa-instagram"></i></a>
          <a href="#"><i class="fab fa-linkedin-in"></i></a>
          <a href="#"><i class="fab fa-twitter"></i></a>
        </div>
      </div>
    </div>

    <div class="footer-bottom">
      <p>© Copyright <strong>Moderna</strong> All Rights Reserved</p>
      <p>Designed by <a href="#">BootstrapMade</a></p>
    </div>
  </footer>

  <script>
    function contarItens(chave) {
      const dados = JSON.parse(localStorage.getItem(chave));
      return Array.isArray(dados) ? dados.length : 0;
    }

    function atualizarNumeros() {
      const totalAuditorias = contarItens("auditorias") +
        contarItens("auditoriasADECORRER") +
        contarItens("auditoriasConcluidas");

      const concluidas = contarItens("auditoriasConcluidas");

      document.getElementById("total-auditorias").textContent = totalAuditorias;
      document.getElementById("ocorrencias-resolvidas").textContent = concluidas;
    }

    atualizarNumeros();
  </script>


</body>

</html>