Projeto help family
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portal de Agendamento - Terapia TEA</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<style>
:root {
--primary-blue: #0077b6;
--soft-blue: #caf0f8;
--accent-green: #2ecc71;
--text-dark: #333;
--white: #ffffff;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
background-color: #f4f9fc;
color: var(--text-dark);
}
header {
background-color: var(--primary-blue);
color: var(--white);
padding: 1rem 5%;
text-align: center;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.container {
max-width: 1000px;
margin: 2rem auto;
padding: 0 20px;
}
.intro {
text-align: center;
margin-bottom: 2rem;
}
/* Card de Agendamento */
.booking-card {
background: var(--white);
border-radius: 15px;
padding: 20px;
box-shadow: 0 10px 20px rgba(0,0,0,0.05);
min-height: 600px;
}
/* Botão Flutuante WhatsApp */
.whatsapp-float {
position: fixed;
bottom: 30px;
right: 30px;
background-color: var(--accent-green);
color: white;
border-radius: 50px;
padding: 15px 25px;
text-decoration: none;
display: flex;
align-items: center;
gap: 10px;
font-weight: bold;
box-shadow: 0 4px 10px rgba(0,0,0,0.3);
z-index: 1000;
transition: transform 0.3s ease;
}
.whatsapp-float:hover {
transform: scale(1.05);
}
.footer {
text-align: center;
padding: 2rem;
font-size: 0.9rem;
color: #777;
}
</style>
</head>
<body>
<header>
<h1>Agenda Terapêutica TEA</h1>
<p>Organização e acolhimento para sua família</p>
</header>
<div class="container">
<div class="intro">
<h2>Reserve sua Sessão</h2>
<p>Selecione abaixo o melhor horário. A confirmação será enviada ao seu e-mail e integrada ao Google Agenda.</p>
</div>
<div class="booking-card">
<div class="calendly-inline-widget"
data-url="https://calendly.com/SEU_LINK_AQUI"
style="min-width:320px;height:630px;"></div>
<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js" async></script>
</div>
</div>
<a href="https://wa.me/5500999999999?text=Olá! Gostaria de tirar uma dúvida sobre o agendamento terapêutico."
class="whatsapp-float" target="_blank">
<i class="fab fa-whatsapp"></i>
Falar com Suporte
</a>
<footer class="footer">
<p>© 2024 Portal de Saúde - Conectado com Google Calendar</p>
</footer>
</body>
</html>
关闭于 2026-04-05 0 条评论