| <!DOCTYPE html> |
| <html lang="pt-BR"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Dra. Sinara Nogueira | Especialista em Crianças Atípicas</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> |
| <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <style> |
| @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Raleway:wght@300;400;500;600&display=swap'); |
| |
| body { |
| font-family: 'Raleway', sans-serif; |
| color: #5a4a42; |
| } |
| |
| h1, h2, h3, h4 { |
| font-family: 'Playfair Display', serif; |
| color: #5a4a42; |
| } |
| |
| .bg-primary { |
| background-color: #8B4513; |
| } |
| |
| .bg-secondary { |
| background-color: #F5F5DC; |
| } |
| |
| .bg-accent { |
| background-color: #DAA520; |
| } |
| |
| .text-primary { |
| color: #8B4513; |
| } |
| |
| .text-secondary { |
| color: #F5F5DC; |
| } |
| |
| .text-accent { |
| color: #DAA520; |
| } |
| |
| .border-primary { |
| border-color: #8B4513; |
| } |
| |
| .border-accent { |
| border-color: #DAA520; |
| } |
| |
| .hero-gradient { |
| background: linear-gradient(135deg, rgba(245, 245, 220, 0.95), rgba(230, 211, 163, 0.95)); |
| } |
| |
| .card-hover { |
| transition: all 0.3s ease; |
| } |
| |
| .card-hover:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 25px rgba(139, 69, 19, 0.15); |
| } |
| |
| .btn-primary { |
| background-color: #8B4513; |
| color: #F5F5DC; |
| transition: all 0.3s ease; |
| } |
| |
| .btn-primary:hover { |
| background-color: #A0522D; |
| transform: translateY(-2px); |
| } |
| |
| .btn-accent { |
| background-color: #DAA520; |
| color: #5a4a42; |
| transition: all 0.3s ease; |
| } |
| |
| .btn-accent:hover { |
| background-color: #e6b733; |
| transform: translateY(-2px); |
| } |
| </style> |
| </head> |
| <body class="bg-secondary"> |
| |
| <header class="bg-white shadow-md"> |
| <div class="container mx-auto px-6 py-4"> |
| <div class="flex items-center justify-between"> |
| <div class="flex items-center"> |
| <i data-feather="heart" class="text-primary mr-2"></i> |
| <span class="text-xl font-bold text-primary">Dra. Sinara Nogueira</span> |
| </div> |
| <nav class="hidden md:flex space-x-8"> |
| <a href="#sobre" class="text-primary hover:text-accent transition">Sobre</a> |
| <a href="#especialidades" class="text-primary hover:text-accent transition">Especialidades</a> |
| <a href="#diferencial" class="text-primary hover:text-accent transition">Diferencial</a> |
| <a href="#servicos" class="text-primary hover:text-accent transition">Serviços</a> |
| <a href="#contato" class="text-primary hover:text-accent transition">Contato</a> |
| </nav> |
| <button class="md:hidden focus:outline-none"> |
| <i data-feather="menu" class="text-primary"></i> |
| </button> |
| </div> |
| </div> |
| </header> |
|
|
| |
| <section class="hero-gradient py-20"> |
| <div class="container mx-auto px-6 flex flex-col md:flex-row items-center"> |
| <div class="md:w-1/2 mb-10 md:mb-0" data-aos="fade-right"> |
| <h1 class="text-4xl md:text-5xl font-bold mb-4">Olá, eu sou a Dra. Sinara! <span class="text-blue-700">💙</span></h1> |
| <h2 class="text-2xl md:text-3xl font-semibold mb-6">Especialista no cuidado de crianças atípicas</h2> |
| <p class="text-lg mb-8">Autismo, TDAH e Altas Habilidades <span class="text-accent">✨</span></p> |
| <div class="flex space-x-4"> |
| <button class="btn-primary px-6 py-3 rounded-full font-medium">Agendar Consulta</button> |
| <button class="border-2 border-primary px-6 py-3 rounded-full font-medium text-primary hover:bg-primary hover:text-secondary transition">Saiba Mais</button> |
| </div> |
| </div> |
| <div class="md:w-1/2 flex justify-center" data-aos="fade-left"> |
| <div class="relative"> |
| <img src="http://static.photos/medical/640x360/1" alt="Dra. Sinara" class="rounded-lg shadow-xl w-full max-w-md border-4 border-white"> |
| <div class="absolute -bottom-4 -right-4 bg-accent text-white px-4 py-2 rounded-lg shadow-md"> |
| <p class="font-bold">+15 anos de experiência</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="sobre" class="py-20 bg-white"> |
| <div class="container mx-auto px-6"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl font-bold mb-4">Sobre Mim</h2> |
| <div class="w-20 h-1 bg-accent mx-auto"></div> |
| </div> |
| <div class="flex flex-col md:flex-row items-center"> |
| <div class="md:w-1/2 mb-10 md:mb-0" data-aos="fade-right"> |
| <img src="http://static.photos/people/640x360/2" alt="Dra. Sinara com pacientes" class="rounded-lg shadow-lg w-full max-w-md"> |
| </div> |
| <div class="md:w-1/2 md:pl-12" data-aos="fade-left"> |
| <p class="text-lg mb-6">Sou médica pediatra com especialização em neurodesenvolvimento infantil, dedicada ao cuidado de crianças atípicas e suas famílias.</p> |
| <p class="text-lg mb-6">Minha abordagem vai além do diagnóstico - busco entender cada criança em sua singularidade, oferecendo um atendimento humanizado e acolhedor.</p> |
| <p class="text-lg mb-8">"Porque quando cuido do seu filho, <span class="font-semibold">EU ENTENDO</span> o que você vive. As noites sem dormir, as dúvidas, a busca por respostas..."</p> |
| <div class="flex items-center"> |
| <i data-feather="award" class="text-accent mr-2"></i> |
| <span class="font-medium">Formada pela Universidade de Brasília</span> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="especialidades" class="py-20 bg-secondary"> |
| <div class="container mx-auto px-6"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl font-bold mb-4">Minhas Especialidades</h2> |
| <div class="w-20 h-1 bg-accent mx-auto"></div> |
| </div> |
| <div class="grid md:grid-cols-3 gap-8"> |
| <div class="bg-white p-8 rounded-lg shadow-md card-hover" data-aos="fade-up" data-aos-delay="100"> |
| <div class="text-accent mb-4"> |
| <i data-feather="activity" class="w-10 h-10"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Autismo</h3> |
| <p class="mb-4">Avaliação diagnóstica completa e acompanhamento personalizado para crianças no espectro autista.</p> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Diagnóstico precoce</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Orientação familiar</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Encaminhamento multidisciplinar</span> |
| </li> |
| </ul> |
| </div> |
| <div class="bg-white p-8 rounded-lg shadow-md card-hover" data-aos="fade-up" data-aos-delay="200"> |
| <div class="text-accent mb-4"> |
| <i data-feather="zap" class="w-10 h-10"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">TDAH</h3> |
| <p class="mb-4">Avaliação e manejo do Transtorno de Déficit de Atenção e Hiperatividade com abordagem integral.</p> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Avaliação clínica detalhada</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Estratégias para escola e casa</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Acompanhamento contínuo</span> |
| </li> |
| </ul> |
| </div> |
| <div class="bg-white p-8 rounded-lg shadow-md card-hover" data-aos="fade-up" data-aos-delay="300"> |
| <div class="text-accent mb-4"> |
| <i data-feather="star" class="w-10 h-10"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Altas Habilidades</h3> |
| <p class="mb-4">Identificação e orientação para crianças com habilidades acima da média em uma ou mais áreas.</p> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Avaliação de potencial</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Orientação educacional</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="check" class="text-accent mr-2 mt-1"></i> |
| <span>Desenvolvimento socioemocional</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="diferencial" class="py-20 bg-primary text-white"> |
| <div class="container mx-auto px-6"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl font-bold mb-4">Meu Diferencial</h2> |
| <div class="w-20 h-1 bg-accent mx-auto"></div> |
| </div> |
| <div class="flex flex-col md:flex-row items-center"> |
| <div class="md:w-1/2 mb-10 md:mb-0" data-aos="fade-right"> |
| <div class="relative"> |
| <img src="http://static.photos/family/640x360/3" alt="Dra. Sinara com família" class="rounded-lg shadow-xl w-full max-w-md"> |
| <div class="absolute -bottom-4 -right-4 bg-accent text-white px-4 py-2 rounded-lg shadow-md"> |
| <p class="font-bold">Mãe de 3 crianças</p> |
| </div> |
| </div> |
| </div> |
| <div class="md:w-1/2 md:pl-12" data-aos="fade-left"> |
| <h3 class="text-2xl font-bold mb-6">Sou mãe de 3 estrelas brilhantes - 2 delas atípicas <span class="text-pink-300">💝</span><span class="text-blue-300">💙</span></h3> |
| <p class="text-lg mb-6">Minha experiência pessoal me dá uma compreensão única das lutas e vitórias das famílias com crianças atípicas.</p> |
| <div class="space-y-6"> |
| <div class="flex items-start"> |
| <div class="bg-accent rounded-full p-2 mr-4"> |
| <i data-feather="heart" class="w-5 h-5 text-white"></i> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Acolho a família</h4> |
| <p>Entendo que o cuidado deve incluir toda a família, não apenas a criança.</p> |
| </div> |
| </div> |
| <div class="flex items-start"> |
| <div class="bg-accent rounded-full p-2 mr-4"> |
| <i data-feather="eye" class="w-5 h-5 text-white"></i> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Escuto suas preocupações</h4> |
| <p>Sei que cada dúvida e angústia de mãe/pai é válida e merece atenção.</p> |
| </div> |
| </div> |
| <div class="flex items-start"> |
| <div class="bg-accent rounded-full p-2 mr-4"> |
| <i data-feather="compass" class="w-5 h-5 text-white"></i> |
| </div> |
| <div> |
| <h4 class="font-bold mb-2">Oriento como quem já viveu</h4> |
| <p>Minhas recomendações vêm tanto da experiência clínica quanto da vivência pessoal.</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="servicos" class="py-20 bg-white"> |
| <div class="container mx-auto px-6"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl font-bold mb-4">Serviços Oferecidos</h2> |
| <div class="w-20 h-1 bg-accent mx-auto"></div> |
| </div> |
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> |
| <div class="border-2 border-secondary rounded-lg p-6 card-hover" data-aos="fade-up" data-aos-delay="100"> |
| <div class="text-primary mb-4"> |
| <i data-feather="clipboard" class="w-8 h-8"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Consulta Inicial</h3> |
| <p class="mb-6">Avaliação detalhada com história clínica completa e exame físico minucioso.</p> |
| <div class="flex justify-between items-center"> |
| <span class="font-bold text-primary">R$ 400,00</span> |
| <button class="btn-accent px-4 py-2 rounded-full text-sm">Agendar</button> |
| </div> |
| </div> |
| <div class="border-2 border-secondary rounded-lg p-6 card-hover" data-aos="fade-up" data-aos-delay="200"> |
| <div class="text-primary mb-4"> |
| <i data-feather="refresh-cw" class="w-8 h-8"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Acompanhamento</h3> |
| <p class="mb-6">Consultas de retorno para monitoramento do desenvolvimento e ajustes no plano de cuidado.</p> |
| <div class="flex justify-between items-center"> |
| <span class="font-bold text-primary">R$ 300,00</span> |
| <button class="btn-accent px-4 py-2 rounded-full text-sm">Agendar</button> |
| </div> |
| </div> |
| <div class="border-2 border-secondary rounded-lg p-6 card-hover" data-aos="fade-up" data-aos-delay="300"> |
| <div class="text-primary mb-4"> |
| <i data-feather="home" class="w-8 h-8"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Visita Domiciliar</h3> |
| <p class="mb-6">Atendimento no conforto do seu lar, ideal para avaliação do ambiente familiar.</p> |
| <div class="flex justify-between items-center"> |
| <span class="font-bold text-primary">R$ 600,00</span> |
| <button class="btn-accent px-4 py-2 rounded-full text-sm">Agendar</button> |
| </div> |
| </div> |
| <div class="border-2 border-secondary rounded-lg p-6 card-hover" data-aos="fade-up" data-aos-delay="100"> |
| <div class="text-primary mb-4"> |
| <i data-feather="book" class="w-8 h-8"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Orientação Escolar</h3> |
| <p class="mb-6">Reunião com professores e equipe pedagógica para adaptações necessárias.</p> |
| <div class="flex justify-between items-center"> |
| <span class="font-bold text-primary">R$ 500,00</span> |
| <button class="btn-accent px-4 py-2 rounded-full text-sm">Agendar</button> |
| </div> |
| </div> |
| <div class="border-2 border-secondary rounded-lg p-6 card-hover" data-aos="fade-up" data-aos-delay="200"> |
| <div class="text-primary mb-4"> |
| <i data-feather="file-text" class="w-8 h-8"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Laudos e Relatórios</h3> |
| <p class="mb-6">Documentação completa para escolas, planos de saúde e processos seletivos.</p> |
| <div class="flex justify-between items-center"> |
| <span class="font-bold text-primary">R$ 350,00</span> |
| <button class="btn-accent px-4 py-2 rounded-full text-sm">Agendar</button> |
| </div> |
| </div> |
| <div class="border-2 border-secondary rounded-lg p-6 card-hover" data-aos="fade-up" data-aos-delay="300"> |
| <div class="text-primary mb-4"> |
| <i data-feather="users" class="w-8 h-8"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-4">Grupo de Apoio</h3> |
| <p class="mb-6">Encontros mensais para pais e cuidadores de crianças atípicas.</p> |
| <div class="flex justify-between items-center"> |
| <span class="font-bold text-primary">R$ 100,00</span> |
| <button class="btn-accent px-4 py-2 rounded-full text-sm">Participar</button> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-20 bg-secondary"> |
| <div class="container mx-auto px-6"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl font-bold mb-4">O Que Dizem os Pais</h2> |
| <div class="w-20 h-1 bg-accent mx-auto"></div> |
| </div> |
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> |
| <div class="bg-white p-8 rounded-lg shadow-md" data-aos="fade-up" data-aos-delay="100"> |
| <div class="text-accent mb-4"> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| </div> |
| <p class="italic mb-6">"A Dra. Sinara foi a primeira profissional que realmente entendeu meu filho. Sua abordagem acolhedora fez toda a diferença no nosso processo."</p> |
| <div class="flex items-center"> |
| <img src="http://static.photos/people/100x100/4" alt="Mãe de paciente" class="w-12 h-12 rounded-full mr-4"> |
| <div> |
| <h4 class="font-bold">Ana Carolina</h4> |
| <p class="text-sm">Mãe do Pedro, 6 anos (TEA)</p> |
| </div> |
| </div> |
| </div> |
| <div class="bg-white p-8 rounded-lg shadow-md" data-aos="fade-up" data-aos-delay="200"> |
| <div class="text-accent mb-4"> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| </div> |
| <p class="italic mb-6">"Finalmente encontramos alguém que olha para além do diagnóstico. A Dra. vê o potencial do meu filho e nos ajuda a desenvolvê-lo."</p> |
| <div class="flex items-center"> |
| <img src="http://static.photos/people/100x100/5" alt="Pai de paciente" class="w-12 h-12 rounded-full mr-4"> |
| <div> |
| <h4 class="font-bold">Ricardo Almeida</h4> |
| <p class="text-sm">Pai da Sofia, 8 anos (AH/SD)</p> |
| </div> |
| </div> |
| </div> |
| <div class="bg-white p-8 rounded-lg shadow-md" data-aos="fade-up" data-aos-delay="300"> |
| <div class="text-accent mb-4"> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| <i data-feather="star" class="w-5 h-5"></i> |
| </div> |
| <p class="italic mb-6">"Como mãe de uma criança com TDAH, a orientação da Dra. Sinara transformou nossa rotina. Ela fala com propriedade e empatia."</p> |
| <div class="flex items-center"> |
| <img src="http://static.photos/people/100x100/6" alt="Mãe de paciente" class="w-12 h-12 rounded-full mr-4"> |
| <div> |
| <h4 class="font-bold">Fernanda Gomes</h4> |
| <p class="text-sm">Mãe do Lucas, 7 anos (TDAH)</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="contato" class="py-20 bg-primary text-white"> |
| <div class="container mx-auto px-6"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl font-bold mb-4">Entre em Contato</h2> |
| <div class="w-20 h-1 bg-accent mx-auto"></div> |
| </div> |
| <div class="flex flex-col lg:flex-row"> |
| <div class="lg:w-1/2 mb-10 lg:mb-0 lg:pr-12" data-aos="fade-right"> |
| <h3 class="text-2xl font-bold mb-6">Agende sua consulta</h3> |
| <p class="mb-8">Estou aqui para ajudar sua família. Entre em contato para marcar uma consulta ou tirar dúvidas.</p> |
| <div class="space-y-6"> |
| <div class="flex items-start"> |
| <i data-feather="map-pin" class="text-accent mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold mb-1">Consultório</h4> |
| <p>SHLS 716, Bloco E, Sala 210 - Asa Sul, Brasília/DF</p> |
| </div> |
| </div> |
| <div class="flex items-start"> |
| <i data-feather="mail" class="text-accent mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold mb-1">Email</h4> |
| <p>contato@drasinara.com.br</p> |
| </div> |
| </div> |
| <div class="flex items-start"> |
| <i data-feather="phone" class="text-accent mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold mb-1">Telefone</h4> |
| <p>(61) 99999-9999</p> |
| </div> |
| </div> |
| <div class="flex items-start"> |
| <i data-feather="clock" class="text-accent mr-4 mt-1"></i> |
| <div> |
| <h4 class="font-bold mb-1">Horário de Atendimento</h4> |
| <p>Segunda a Sexta: 8h às 18h<br>Sábado: 8h às 12h</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="lg:w-1/2" data-aos="fade-left"> |
| <form class="bg-white rounded-lg shadow-xl p-8 text-primary"> |
| <div class="mb-6"> |
| <label for="name" class="block font-medium mb-2">Nome Completo</label> |
| <input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent"> |
| </div> |
| <div class="mb-6"> |
| <label for="email" class="block font-medium mb-2">Email</label> |
| <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent"> |
| </div> |
| <div class="mb-6"> |
| <label for="phone" class="block font-medium mb-2">Telefone</label> |
| <input type="tel" id="phone" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent"> |
| </div> |
| <div class="mb-6"> |
| <label for="service" class="block font-medium mb-2">Serviço de Interesse</label> |
| <select id="service" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent"> |
| <option value="">Selecione...</option> |
| <option value="consulta">Consulta Inicial</option> |
| <option value="retorno">Acompanhamento</option> |
| <option value="domiciliar">Visita Domiciliar</option> |
| <option value="escola">Orientação Escolar</option> |
| <option value="laudo">Laudos e Relatórios</option> |
| <option value="grupo">Grupo de Apoio</option> |
| </select> |
| </div> |
| <div class="mb-6"> |
| <label for="message" class="block font-medium mb-2">Mensagem</label> |
| <textarea id="message" rows="4" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent"></textarea> |
| </div> |
| <button type="submit" class="btn-primary w-full py-3 rounded-lg font-medium">Enviar Mensagem</button> |
| </form> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="bg-gray-900 text-white py-12"> |
| <div class="container mx-auto px-6"> |
| <div class="flex flex-col md:flex-row justify-between"> |
| <div class="mb-8 md:mb-0"> |
| <div class="flex items-center mb-4"> |
| <i data-feather="heart" class="text-accent mr-2"></i> |
| <span class="text-xl font-bold">Dra. Sinara Nogueira</span> |
| </div> |
| <p class="mb-4">Especialista no cuidado de crianças atípicas</p> |
| <div class="flex space-x-4"> |
| <a href="#" class="text-gray-400 hover:text-accent transition"> |
| <i data-feather="facebook"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-accent transition"> |
| <i data-feather="instagram"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-accent transition"> |
| <i data-feather="linkedin"></i> |
| </a> |
| <a href="#" class="text-gray-400 hover:text-accent transition"> |
| <i data-feather="youtube"></i> |
| </a> |
| </div> |
| </div> |
| <div class="grid grid-cols-2 md:grid-cols-3 gap-8"> |
| <div> |
| <h4 class="font-bold mb-4">Links Rápidos</h4> |
| <ul class="space-y-2"> |
| <li><a href="#sobre" class="text-gray-400 hover:text-accent transition">Sobre</a></li> |
| <li><a href="#especialidades" class="text-gray-400 hover:text-accent transition">Especialidades</a></li> |
| <li><a href="#diferencial" class="text-gray-400 hover:text-accent transition">Diferencial</a></li> |
| <li><a href="#servicos" class="text-gray-400 hover:text-accent transition">Serviços</a></li> |
| </ul> |
| </div> |
| <div> |
| <h4 class="font-bold mb-4">Contato</h4> |
| <ul class="space-y-2"> |
| <li class="flex items-start"> |
| <i data-feather="map-pin" class="text-accent mr-2 mt-1 w-4 h-4"></i> |
| <span class="text-gray-400">SHLS 716, Bloco E, Sala 210</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="mail" class="text-accent mr-2 mt-1 w-4 h-4"></i> |
| <span class="text-gray-400">contato@drasinara.com.br</span> |
| </li> |
| <li class="flex items-start"> |
| <i data-feather="phone" class="text-accent mr-2 mt-1 w-4 h-4"></i> |
| <span class="text-gray-400">(61) 99999-9999</span> |
| </li> |
| </ul> |
| </div> |
| <div> |
| <h4 class="font-bold mb-4">Legal</h4> |
| <ul class="space-y-2"> |
| <li><a href="#" class="text-gray-400 hover:text-accent transition">Política de Privacidade</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-accent transition">Termos de Uso</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-accent transition">FAQ</a></li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| <div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-500"> |
| <p>© 2023 Dra. Sinara Nogueira. Todos os direitos reservados.</p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| AOS.init({ |
| duration: 800, |
| easing: 'ease-in-out', |
| once: true |
| }); |
| |
| feather.replace(); |
| |
| |
| document.querySelector('.md\\:hidden').addEventListener('click', function() { |
| const nav = document.querySelector('nav'); |
| nav.classList.toggle('hidden'); |
| nav.classList.toggle('flex'); |
| nav.classList.toggle('flex-col'); |
| nav.classList.toggle('absolute'); |
| nav.classList.toggle('top-16'); |
| nav.classList.toggle('right-6'); |
| nav.classList.toggle('bg-white'); |
| nav.classList.toggle('p-4'); |
| nav.classList.toggle('rounded-lg'); |
| nav.classList.toggle('shadow-lg'); |
| nav.classList.toggle('space-y-4'); |
| nav.classList.toggle('space-x-8'); |
| }); |
| </script> |
| </body> |
| </html> |
|
|
