app/assets/main.css

@@ -2,6 +2,7 @@
 @import "@nuxt/ui";
 
 @import url('https://fonts.googleapis.com/css2?family=Exo:ital,wght@0,100..900;1,100..900&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
 
 body {
   font-family: 'Exo', sans-serif;
@@ -11,4 +12,9 @@ body {
 ::selection {
   background: #C8E600;
   color: #0A0B09;
+}
+
+:root {
+  --color-primary: #8AAB10;
+  --font-inter: 'Inter', sans-serif;
 }

app/components/FaqSection.vue

@@ -0,0 +1,68 @@
+<template>
+    <section class="w-full bg-[#F6FFE9] py-12 md:py-18 md:px-10">
+        <div class="w-full max-w-[1200px] mx-auto flex flex-col md:flex-row md:justify-between items-center md:items-start gap-6 md:gap-20 px-4 sm:px-0">
+            <div class="flex flex-col items-center gap-4 md:items-start text-center md:text-left">
+                <span class="inline-flex items-center justify-center w-[127px] h-[53.05px] rounded-full
+                border-[1.55px] border-[#8DC63F] bg-[var(--color-primary)] text-white text-2xl font-bold">
+                FAQ</span>
+                <p style="font-family: var(--font-inter)"   class="font-semibold text-[40px] lg:text-[88px] leading-tight tracking-[-0.03em]">
+                    Perguntas <br class="hidden md:block">Frequentes
+                </p>
+            </div>
+            <div class="flex flex-col items-center md:items-start gap-4 flex-1">
+                <div v-for="(faq, index) in faqs"
+                :key="index"
+                class="w-full lg:max-w-[677px] bg-[#0C0D17] border border-white/10 rounded-3xl px-6 md:px-8 py-5 items-center">
+                    <div @click="toggleIsOpen(index)" class="flex items-center justify-between w-full cursor-pointer">
+                        <p class="font-inter font-normal text-[21.07px] leading-[24px] md:leading-[31.61px] text-white">
+                            {{ faq.question }}
+                        </p>
+                        <button class="text-white text-[22px] md:text-[26.34px] leading-none flex-end">
+                            {{ openIndex === index ? '-' : '+' }}
+                        </button>
+                    </div>
+                   <div v-if="openIndex == index" class="mt-4 text-white/70 text-sm md:text-base">
+                        <p>{{ faq.answer }}</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+    const openIndex = ref<number | null>(null)
+    function toggleIsOpen(indexClicked: number) {
+        openIndex.value = openIndex.value === indexClicked ? null  : indexClicked
+    }
+
+    const faqs = [
+    {
+    question: "A Kyon substitui todos os sistemas que uso hoje?",
+    answer:
+      "Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro labore voluptatum unde nihil, iste illo voluptas nobis repudiandae nulla cupiditate harum sint magnam exercitationem reprehenderit fuga commodi accusamus libero, quasi earum. Rerum incidunt hic veritatis debitis ipsa, iure facere, dolorum ad cumque doloribus, ut numquam earum distinctio eos repellat quidem."
+    },
+    {
+    question: "Como funciona o Prontuário unificado?",
+    answer:
+      "Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro labore voluptatum unde nihil, iste illo voluptas nobis repudiandae nulla cupiditate harum sint magnam exercitationem reprehenderit fuga commodi accusamus libero, quasi earum. Rerum incidunt hic veritatis debitis ipsa, iure facere, dolorum ad cumque doloribus, ut numquam earum distinctio eos repellat quidem."
+    },
+    {
+    question: "O agente de IA realmente atende pacientes no WhatsApp?",
+    answer:
+        "Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro labore voluptatum unde nihil, iste illo voluptas nobis repudiandae nulla cupiditate harum sint magnam exercitationem reprehenderit fuga commodi accusamus libero, quasi earum. Rerum incidunt hic veritatis debitis ipsa, iure facere, dolorum ad cumque doloribus, ut numquam earum distinctio eos repellat quidem."
+    },
+    {
+    question: "A telemedicina é integrada ou preciso de outra plataforma?",
+    answer:
+      "Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro labore voluptatum unde nihil, iste illo voluptas nobis repudiandae nulla cupiditate harum sint magnam exercitationem reprehenderit fuga commodi accusamus libero, quasi earum. Rerum incidunt hic veritatis debitis ipsa, iure facere, dolorum ad cumque doloribus, ut numquam earum distinctio eos repellat quidem."
+    },
+    {
+    question: "Como funciona a auditoria LGPD?",
+    answer:
+      "Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro labore voluptatum unde nihil, iste illo voluptas nobis repudiandae nulla cupiditate harum sint magnam exercitationem reprehenderit fuga commodi accusamus libero, quasi earum. Rerum incidunt hic veritatis debitis ipsa, iure facere, dolorum ad cumque doloribus, ut numquam earum distinctio eos repellat quidem."
+    }
+    ]
+</script>

app/pages/index.vue

@@ -1,3 +1,4 @@
 <template>
   <SectionSecondary />
+  <FaqSection />
 </template>

package-lock.json

@@ -69,7 +69,6 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -335,7 +334,6 @@
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.2.tgz",
       "integrity": "sha512-4GgRzy/+fsBa72/RZVJmGKPmZu9Byn8o4MoLpmNe1m8ZfYnz5emHLQz3U4gLud6Zwl0RZIcgiLD7Uq7ySFuDLA==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/types": "^7.29.0"
       },
@@ -1808,8 +1806,18 @@
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/citty/-/citty-0.2.2.tgz",
       "integrity": "sha512-+6vJA3L98yv+IdfKGZHBNiGW5KHn22e/JwID0Strsz8h4S/csAu/OuICwxrg44k5MRiZHWIo8XXuJgQTriRP4w==",
+      "license": "MIT"
+    },
+    "node_modules/@nuxt/cli/node_modules/commander": {
+      "version": "13.1.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-13.1.0.tgz",
+      "integrity": "sha512-/rFeCpNJQbhSZjGVwO9RFV3xPqbnERS8MmIQzCtD/zl6gpJuV/bMLuN92oG3F7d8oDEHHRrujSXNUr8fpjntKw==",
       "license": "MIT",
-      "peer": true
+      "optional": true,
+      "peer": true,
+      "engines": {
+        "node": ">=18"
+      }
     },
     "node_modules/@nuxt/cli/node_modules/std-env": {
       "version": "4.1.0",
@@ -3253,7 +3261,6 @@
       "integrity": "sha512-tmmZ3lQxAe/k/+rNnXQRawJ4NjxO2hqiOLTHvWchtGZULp4RyFeh6aU4XdOYBFe2KE1oShQTv4AblOs2iOrNnQ==",
       "hasInstallScript": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "detect-libc": "^2.0.3",
         "is-glob": "^4.0.3",
@@ -4851,7 +4858,6 @@
       "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.22.tgz",
       "integrity": "sha512-tbTR1zKGce4Lj+JLzFXDq36K4vcSZbJ1RBu8FxcDv1IGRz//Dh2EBqksyGVypz3kXpshIfWKGOCcqpSbyGWRJQ==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/parser": "^7.28.4",
         "@vue/compiler-core": "3.5.22",
@@ -5005,7 +5011,6 @@
       "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-13.9.0.tgz",
       "integrity": "sha512-ts3regBQyURfCE2BcytLqzm8+MmLlo5Ln/KLoxDVcsZ2gzIwVNnQpQOL/UKV8alUqjSZOlpFZcRNsLRqj+OzyA==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/web-bluetooth": "^0.0.21",
         "@vueuse/metadata": "13.9.0",
@@ -5131,7 +5136,6 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz",
       "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
       "license": "MIT",
-      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -5498,7 +5502,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.8.19",
         "caniuse-lite": "^1.0.30001751",
@@ -5650,7 +5653,6 @@
       "resolved": "https://registry.npmjs.org/cac/-/cac-6.7.14.tgz",
       "integrity": "sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=8"
       }
@@ -6494,8 +6496,7 @@
       "version": "8.6.0",
       "resolved": "https://registry.npmjs.org/embla-carousel/-/embla-carousel-8.6.0.tgz",
       "integrity": "sha512-SjWyZBHJPbqxHOzckOfo8lHisEaJWmwd23XppYFYVh10bU66/Pn5tkVkbkCMZVdbUE5eTCI2nD8OyIP4Z+uwkA==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/embla-carousel-auto-height": {
       "version": "8.6.0",
@@ -7044,7 +7045,6 @@
       "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-7.3.0.tgz",
       "integrity": "sha512-plz8RVjfcDedTGfVngWH1jmJvBvAwi1v2jecfDerbEnMcmOYUEEwKFTHbNoCiYyzaK2Ws8lABkTCcRSqCY1q4w==",
       "license": "Apache-2.0",
-      "peer": true,
       "engines": {
         "node": ">=10"
       },
@@ -9432,7 +9432,6 @@
       "resolved": "https://registry.npmjs.org/nuxt/-/nuxt-4.2.0.tgz",
       "integrity": "sha512-4qzf2Ymf07dMMj50TZdNZgMqCdzDch8NY3NO2ClucUaIvvsr6wd9+JrDpI1CckSTHwqU37/dIPFpvIQZoeHoYA==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@dxup/nuxt": "^0.2.0",
         "@nuxt/cli": "^3.29.3",
@@ -9685,7 +9684,6 @@
       "resolved": "https://registry.npmjs.org/oxc-parser/-/oxc-parser-0.95.0.tgz",
       "integrity": "sha512-Te8fE/SmiiKWIrwBwxz5Dod87uYvsbcZ9JAL5ylPg1DevyKgTkxCXnPEaewk1Su2qpfNmry5RHoN+NywWFCG+A==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@oxc-project/types": "^0.95.0"
       },
@@ -9906,7 +9904,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.11",
         "picocolors": "^1.1.1",
@@ -10685,7 +10682,6 @@
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.2.tgz",
       "integrity": "sha512-J9qZyW++QK/09NyN/zeO0dG/1GdGfyp9lV8ajHnRVLfo/uFsbji5mHnDgn/qYdUHyCkM2N+8VyspgZclfAh0eQ==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/estree": "1.0.8"
       },
@@ -11388,7 +11384,6 @@
       "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.4.0.tgz",
       "integrity": "sha512-uSaO4gnW+b3Y2aWoWfFpX62vn2sR3skfhbjsEnaBI81WD1wBLlHZe5sWf0AqjksNdYTbGBEd0UasQMT3SNV15g==",
       "license": "MIT",
-      "peer": true,
       "funding": {
         "type": "github",
         "url": "https://github.com/sponsors/dcastil"
@@ -11417,8 +11412,7 @@
       "version": "4.1.17",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.17.tgz",
       "integrity": "sha512-j9Ee2YjuQqYT9bbRTfTZht9W/ytp5H+jJpZKiYdP/bpnXARAuELt9ofP0lPnmHjbga7SNQIxdTAXCmtKVYjN+Q==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/tapable": {
       "version": "2.3.0",
@@ -12302,7 +12296,6 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-7.3.2.tgz",
       "integrity": "sha512-Bby3NOsna2jsjfLVOHKes8sGwgl4TT0E6vvpYgnAYDIF/tie7MRaFthmKuHx1NSXjiTueXH3do80FMQgvEktRg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "esbuild": "^0.27.0",
         "fdir": "^6.5.0",
@@ -13088,7 +13081,6 @@
       "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.22.tgz",
       "integrity": "sha512-toaZjQ3a/G/mYaLSbV+QsQhIdMo9x5rrqIpYRObsJ6T/J+RyCSFwN2LHNVH9v8uIcljDNa3QzPVdv3Y6b9hAJQ==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@vue/compiler-dom": "3.5.22",
         "@vue/compiler-sfc": "3.5.22",
@@ -13131,7 +13123,6 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.3.tgz",
       "integrity": "sha512-ARBedLm9YlbvQomnmq91Os7ck6efydTSpRP3nuOKCvgJOHNrhRoJDSKtee8kcL1Vf7nz6U+PMBL+hTvR3bTVQg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@vue/devtools-api": "^6.6.4"
       },
@@ -13359,7 +13350,6 @@
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.3.tgz",
       "integrity": "sha512-AvbaCLOO2Otw/lW5bmh9d/WEdcDFdQp2Z2ZUH3pX9U2ihyUY0nvLv7J6TrWowklRGPYbB/IuIMfYgxaCPg5Bpg==",
       "license": "ISC",
-      "peer": true,
       "bin": {
         "yaml": "bin.mjs"
       },