riseup-squad20/Website/index.html

254 lines
11 KiB
HTML

<!DOCTYPE html>
<!--
Template name: Nova
Template author: FreeBootstrap.net
Author website: https://freebootstrap.net/
License: https://freebootstrap.net/license
-->
<html lang="ptbr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>SUS Conecta</title>
<!-- ======= Google Font =======-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&amp;display=swap" rel="stylesheet">
<!-- End Google Font-->
<!-- ======= Styles =======-->
<link href="assets/vendors/bootstrap/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendors/bootstrap-icons/font/bootstrap-icons.min.css" rel="stylesheet">
<link href="assets/vendors/glightbox/glightbox.min.css" rel="stylesheet">
<link href="assets/vendors/swiper/swiper-bundle.min.css" rel="stylesheet">
<link href="assets/vendors/aos/aos.css" rel="stylesheet">
<!-- End Styles-->
<!-- ======= Theme Style =======-->
<link href="assets/css/style.css" rel="stylesheet">
<!-- End Theme Style-->
<!-- ======= Apply theme =======-->
<script>
// Apply the theme as early as possible to avoid flicker
(function () {
const storedTheme = localStorage.getItem('theme') || 'light';
document.documentElement.setAttribute('data-bs-theme', storedTheme);
})();
</script>
</head>
<body>
<!-- ======= Site Wrap =======-->
<div class="site-wrap">
<!-- ======= Header =======-->
<header class="fbs__net-navbar navbar navbar-expand-lg dark" aria-label="freebootstrap.net navbar">
<div class="container d-flex align-items-center justify-content-between">
<!-- Start Logo-->
<div class="topbar__left">
<div class="logo">SUS<span>Conecta</span></div>
</div>
<!-- End Logo-->
<!-- Start offcanvas-->
<div class="offcanvas offcanvas-start w-75" id="fbs__net-navbars" tabindex="-1"
aria-labelledby="fbs__net-navbarsLabel">
<div class="offcanvas-header">
<div class="offcanvas-header-logo">
h5#fbs__net-navbarsLabel.offcanvas-title Vertex
</div>
<button class="btn-close btn-close-black" type="button" data-bs-dismiss="offcanvas"
aria-label="Close"></button>
</div>
<div class="offcanvas-body align-items-lg-center">
<ul class="navbar-nav nav me-auto ps-lg-5 mb-2 mb-lg-0">
<li class="nav-item"><a class="nav-link scroll-link active" aria-current="page" href="#home">Início</a>
</li>
<li class="nav-item"><a class="nav-link scroll-link" href="#about">Sobre</a></li>
</ul>
</div>
</div>
<!-- End offcanvas-->
<div class="ms-auto w-auto">
<div class="header-social d-flex align-items-center gap-1"><a class="btn btn-primary py-2"
href="paciente.html">Sou
Paciente</a><a class="btn btn-white-outline py-2" href="manage.html">Sou Profissional de Saúde</a>
<a class="btn btn-white-outline py-2" href="administrador.html">Sou Administrador de uma Clínica</a>
<button class="fbs__net-navbar-toggler justify-content-center align-items-center ms-auto"
data-bs-toggle="offcanvas" data-bs-target="#fbs__net-navbars" aria-controls="fbs__net-navbars"
aria-label="Toggle navigation" aria-expanded="false">
<svg class="fbs__net-icon-menu" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round">
<line x1="21" x2="3" y1="6" y2="6"></line>
<line x1="15" x2="3" y1="12" y2="12"></line>
<line x1="17" x2="3" y1="18" y2="18"></line>
</svg>
<svg class="fbs__net-icon-close" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round">
<path d="M18 6 6 18"></path>
<path d="m6 6 12 12"></path>
</svg>
</button>
</div>
</div>
</div>
</header>
<!-- End Header-->
<!-- ======= Main =======-->
<main>
<!-- ======= Hero =======-->
<section class="hero__v6 section" id="home">
<div class="container">
<div class="row">
<div class="col-lg-6 mb-4 mb-lg-0">
<div class="row">
<div class="col-lg-11"><span class="hero-subtitle text-uppercase" data-aos="fade-up"
data-aos-delay="0">Aproximando médicos e pacientes</span>
<h1 class="hero-title mb-3" data-aos="fade-up" data-aos-delay="100">Segurança, Confiabilidade e
Rapidez</h1>
<p class="hero-description mb-4 mb-lg-5" data-aos="fade-up" data-aos-delay="200">Experimente o futuro
dos agendamentos.<br>Encontre profissionais capacitados e marque já sua consulta.</p>
<div class="cta d-flex gap-2 mb-4 mb-lg-5" data-aos="fade-up" data-aos-delay="300"><a class="btn"
href="paciente.html">Sou Paciente</a><a class="btn btn-white-outline" href="manage.html">Sou
Profissional de Saúde </a>
<a class="btn btn-white-outline" href="administrador.html">Sou Administrador de uma Clínica</a>
</div>
<div class="hero-description mb-4 mb-lg-5" data-aos="fade-up" data-aos-delay="300">
<ul class="value-list">
<li>📄 Laudos digitais e padronizados</li>
<li>🔔 Notificações automáticas ao paciente</li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="hero-img"><img class="img-main img-fluid rounded-4" src="assets/images/foto-main1.png"
height="550" alt="Hero Image" data-aos="fade-in" data-aos-delay="500"></div>
<div class="hero-description mb-4 mb-lg-5" data-aos=fade-up data-aos-delay="300"
style="padding-top: 57px;">
<li>🔒 LGPD: controle de acesso e consentimento</li>
</div>
</div>
</div>
</div>
<!-- End Hero-->
</section>
<!-- End Hero-->
<!-- ======= About =======-->
<section class="about__v4 section" id="about">
<div class="container">
<div class="row">
<div class="col-md-6 order-md-2">
<div class="row justify-content-end">
<div class="col-md-11 mb-4 mb-md-0"><span class="subtitle text-uppercase mb-3" data-aos="fade-up"
data-aos-delay="0">Sobre nós</span>
<h2 class="mb-4" data-aos="fade-up" data-aos-delay="100">Experimente o futuro do gerenciamento dos
seus atendimentos médicos</h2>
<div data-aos="fade-up" data-aos-delay="200">
<p>Somos uma plataforma inovadora que conecta pacientes e médicos de forma prática, segura e
humanizada. Nosso objetivo é simplificar o processo de emissão e acompanhamento de laudos médicos,
oferecendo um ambiente online confiável e acessível.
</p>
<p>Aqui, os pacientes podem registrar suas informações de saúde e solicitar laudos de forma rápida,
enquanto os médicos têm acesso a ferramentas que facilitam a análise, validação e emissão dos
documentos. </p>
</div>
<h4 class="small fw-bold mt-4 mb-3" data-aos="fade-up" data-aos-delay="300">Nossos valores</h4>
<ul class="d-flex flex-row flex-wrap list-unstyled gap-3 features" data-aos="fade-up"
data-aos-delay="400">
<li class="d-flex align-items-center gap-2"><span class="icon rounded-circle text-center"><i
class="bi bi-check"></i></span><span class="text">Inovação</span></li>
<li class="d-flex align-items-center gap-2"><span class="icon rounded-circle text-center"><i
class="bi bi-check"></i></span><span class="text">Segurança</span></li>
<li class="d-flex align-items-center gap-2"><span class="icon rounded-circle text-center"><i
class="bi bi-check"></i></span><span class="text">Discrição</span></li>
<li class="d-flex align-items-center gap-2"><span class="icon rounded-circle text-center"><i
class="bi bi-check"></i></span><span class="text">Transparência</span></li>
<li class="d-flex align-items-center gap-2"><span class="icon rounded-circle text-center"><i
class="bi bi-check"></i></span><span class="text">Agilidade</span></li>
</ul>
</div>
</div>
</div>
<div class="col-md-6">
<div class="img-wrap position-relative"><img class="img-fluid rounded-4"
src="assets/images/about_2-min.jpg" alt="FreeBootstrap.net image placeholder" data-aos="fade-up"
data-aos-delay="0">
<div class="mission-statement p-4 rounded-4 d-flex gap-4" data-aos="fade-up" data-aos-delay="100">
<div class="mission-icon text-center rounded-circle"><i class="bi bi-lightbulb fs-4"></i></div>
<div>
<h3 class="text-uppercase fw-bold">Nosso objetivo</h3>
<p class="fs-5 mb-0">Nosso compromisso é garantir qualidade, segurança e sigilo em cada atendimento,
unindo tecnologia à responsabilidade médica.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End About-->
<!-- ======= Footer =======-->
<footer class="footer">
<div class="container">
<span>© 2025 SUS Conecta</span>
<a href="#">Termos</a>
<a href="#">Privacidade (LGPD)</a>
<a href="#" id="ajuda">Ajuda</a>
</div>
</footer>
<!-- End Footer-->
</main>
</div>
<!-- ======= Back to Top =======-->
<button id="back-to-top"><i class="bi bi-arrow-up-short"></i></button>
<!-- End Back to top-->
<!-- ======= Javascripts =======-->
<script src="assets/vendors/bootstrap/bootstrap.bundle.min.js"></script>
<script src="assets/vendors/gsap/gsap.min.js"></script>
<script src="assets/vendors/imagesloaded/imagesloaded.pkgd.min.js"></script>
<script src="assets/vendors/isotope/isotope.pkgd.min.js"></script>
<script src="assets/vendors/glightbox/glightbox.min.js"></script>
<script src="assets/vendors/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendors/aos/aos.js"></script>
<script src="assets/vendors/purecounter/purecounter.js"></script>
<script src="assets/js/custom.js"></script>
<script src="assets/js/send_email.js"></script>
<!-- End JavaScripts-->
</body>
</html>