diff --git a/assets/css/custom.css b/assets/css/custom.css
new file mode 100644
index 0000000..e41ba66
--- /dev/null
+++ b/assets/css/custom.css
@@ -0,0 +1,39 @@
+
+body {
+ font-family: 'Nunito', sans-serif;
+ background-color: #F8F9FA;
+}
+
+.navbar-brand {
+ font-weight: bold;
+}
+
+.pecs-card {
+ border-radius: 0.5rem;
+ transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
+ cursor: pointer;
+ overflow: hidden;
+}
+
+.pecs-card:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+}
+
+.pecs-card.active {
+ transform: translateY(-5px);
+ box-shadow: 0 6px 20px rgba(0,0,0,0.15);
+ border: 2px solid #4285F4;
+}
+
+.card-img-top {
+ width: 100%;
+ height: 150px;
+ object-fit: cover;
+ background-color: #e9ecef;
+}
+
+.card-title {
+ font-size: 1.1rem;
+ font-weight: bold;
+}
diff --git a/assets/js/main.js b/assets/js/main.js
new file mode 100644
index 0000000..b38bd2a
--- /dev/null
+++ b/assets/js/main.js
@@ -0,0 +1,20 @@
+document.addEventListener('DOMContentLoaded', () => {
+ const cards = document.querySelectorAll('.pecs-card');
+ const synth = window.speechSynthesis;
+
+ cards.forEach(card => {
+ card.addEventListener('click', () => {
+ // Remove active state from all other cards
+ cards.forEach(c => c.classList.remove('active'));
+ // Add active state to clicked card
+ card.classList.add('active');
+
+ const textToSpeak = card.querySelector('.card-title').textContent;
+ if (textToSpeak && synth) {
+ const utterance = new SpeechSynthesisUtterance(textToSpeak);
+ utterance.lang = 'pt-BR'; // Set language to Brazilian Portuguese
+ synth.speak(utterance);
+ }
+ });
+ });
+});
diff --git a/index.php b/index.php
index 7205f3d..8b5efec 100644
--- a/index.php
+++ b/index.php
@@ -1,150 +1,75 @@
-
-
-
+
+
-
-
- New Style
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ Talk TEA
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
Analyzing your requirements and generating your website…
-
- Loading…
-
-
= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.
-
This page will update automatically as the plan is implemented.
-
Runtime: PHP = htmlspecialchars($phpVersion) ?> — UTC = htmlspecialchars($now) ?>
-
-
-
+
+
+
+
+ Necessidades
+
+
+
+ 'Estou com fome', 'icon' => '🍽️'],
+ ['text' => 'Estou com sede', 'icon' => '💧'],
+ ['text' => 'Quero ir ao banheiro', 'icon' => '🚽'],
+ ['text' => 'Estou cansado', 'icon' => '😴'],
+ ['text' => 'Quero brincar', 'icon' => '🧸'],
+ ['text' => 'Preciso de ajuda', 'icon' => '🙋'],
+ ];
+
+ foreach ($cards as $card):
+ ?>
+
+
+
+
+
+
+
+
+
+
+
+
-
+
\ No newline at end of file