| 1 | <!DOCTYPE html>
|
| 2 | <html class="light" lang="pt-BR">
|
| 3 | <head>
|
| 4 | <meta charset="utf-8"/>
|
| 5 | <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
| 6 | <title>Nexo - Monitore suas emoções</title>
|
| 7 | <!-- Tailwind & Plugins -->
|
| 8 | <script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
| 9 | <!-- Fonts -->
|
| 10 | <link href="https://fonts.googleapis.com" rel="preconnect"/>
|
| 11 | <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
|
| 12 | <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"/>
|
| 13 | <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
| 14 |
|
| 15 | <link href="https://cdn.jsdelivr.net/npm/@glidejs/glide/dist/css/glide.core.min.css" rel="stylesheet"/>
|
| 16 | <link href="https://cdn.jsdelivr.net/npm/atropos/atropos.min.css" rel="stylesheet"/>
|
| 17 | <script src="https://cdn.jsdelivr.net/npm/animejs/dist/bundles/anime.umd.min.js"></script>
|
| 18 | <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
| 19 | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
|
| 20 | <link href="/styles/main.css" rel="stylesheet" />
|
| 21 | <script id="tailwind-config">
|
| 22 | tailwind.config = {
|
| 23 | darkMode: "class",
|
| 24 | theme: {
|
| 25 | extend: {
|
| 26 | "colors": {
|
| 27 | "background-light": "#f6f8f6",
|
| 28 | "border-subtle": "#f1f5f9",
|
| 29 | "surface-light": "#ffffff",
|
| 30 | "pill-indigo": "#e0e7ff",
|
| 31 | "pill-purple": "#f3e8ff",
|
| 32 | "text-primary": "#0f172a",
|
| 33 | "status-active-bg": "rgba(19, 236, 91, 0.1)",
|
| 34 | "text-secondary": "#64748b",
|
| 35 | "pill-blue": "#dbeafe",
|
| 36 | "brand-green": "#13ec5b"
|
| 37 | },
|
| 38 | "borderRadius": {
|
| 39 | "DEFAULT": "0.25rem",
|
| 40 | "lg": "0.5rem",
|
| 41 | "xl": "0.75rem",
|
| 42 | "full": "9999px"
|
| 43 | },
|
| 44 | "spacing": {
|
| 45 | "container-padding": "1rem",
|
| 46 | "section-gap": "2rem",
|
| 47 | "card-gap": "0.75rem",
|
| 48 | "internal-padding": "1rem",
|
| 49 | "inline-gap-sm": "0.5rem"
|
| 50 | },
|
| 51 | "fontFamily": {
|
| 52 | "label-sm": ["Inter"],
|
| 53 | "body-md": ["Inter"],
|
| 54 | "body-lg": ["Inter"],
|
| 55 | "headline-md": ["Inter"],
|
| 56 | "headline-lg": ["Inter"]
|
| 57 | },
|
| 58 | "fontSize": {
|
| 59 | "label-sm": ["12px", { "lineHeight": "16px", "letterSpacing": "0.05em", "fontWeight": "600" }],
|
| 60 | "body-md": ["14px", { "lineHeight": "20px", "fontWeight": "500" }],
|
| 61 | "body-lg": ["16px", { "lineHeight": "20px", "fontWeight": "700" }],
|
| 62 | "headline-md": ["18px", { "lineHeight": "24px", "fontWeight": "700" }],
|
| 63 | "headline-lg": ["20px", { "lineHeight": "28px", "letterSpacing": "-0.02em", "fontWeight": "700" }]
|
| 64 | }
|
| 65 | },
|
| 66 | },
|
| 67 | }
|
| 68 | </script>
|
| 69 | </head>
|
| 70 |
|
| 71 | <body class="text-text-primary">
|
| 72 | <header class="docked full-width top-0 sticky z-50 bg-surface-light/95 backdrop-blur-md border-b border-border-subtle shadow-sm">
|
| 73 | <nav class="flex justify-between items-center w-full px-container-padding max-w-7xl mx-auto h-16">
|
| 74 | <div class="flex items-center gap-2">
|
| 75 | <img src="/images/logo.svg" alt="" class="w-6 h-6 spin-slow" />
|
| 76 | <span class="text-headline-lg font-headline-lg text-text-primary">nexo</span>
|
| 77 | </div>
|
| 78 | <div class="hidden md:flex gap-8">
|
| 79 | <a class="text-text-primary font-bold border-b-2 border-status-active-bg transition-colors duration-200" href="#">
|
| 80 | Funcionalidades
|
| 81 | </a>
|
| 82 |
|
| 83 | <a class="text-text-secondary font-body-md hover:text-text-primary transition-colors duration-200"
|
| 84 | href="/monografia">
|
| 85 | Monografia
|
| 86 | </a>
|
| 87 |
|
| 88 | <a class="text-text-secondary font-body-md hover:text-text-primary transition-colors duration-200" href="#">
|
| 89 | Sobre o projeto
|
| 90 | </a>
|
| 91 | </div>
|
| 92 |
|
| 93 | <button class="bg-text-primary text-white px-6 py-2 rounded-lg font-body-lg btn-hover-effect">
|
| 94 | Começe já!
|
| 95 | </button>
|
| 96 | </nav>
|
| 97 | </header>
|
| 98 |
|
| 99 | <main>
|
| 100 | <section class="max-w-7xl mx-auto px-container-padding py-20 flex flex-col md:flex-row items-center gap-12">
|
| 101 | <div class="flex-1 space-y-8">
|
| 102 | <h1 class="text-5xl md:text-7xl font-extrabold tracking-tight leading-tight animate__animated animate__zoomIn">
|
| 103 | Equilíbrio em cada <span class="text-brand-green">registro</span>
|
| 104 | </h1>
|
| 105 | <p class="text-text-secondary text-lg md:text-xl max-w-lg">
|
| 106 | Monitore sua saúde mental e física com precisão clínica e interface intuitiva.
|
| 107 | Organize sua rotina de bem-estar em um só lugar.
|
| 108 | </p>
|
| 109 |
|
| 110 | <div class="flex gap-4">
|
| 111 | <button class="bg-brand-green text-text-primary px-8 py-4 rounded-xl font-body-lg shadow-lg shadow-brand-green/20 btn-hover-effect flex items-center gap-2">
|
| 112 | <span class="material-symbols-outlined">download</span>
|
| 113 | Baixar Agora
|
| 114 | </button>
|
| 115 |
|
| 116 | <button class="border border-border-subtle bg-surface-light px-8 py-4 rounded-xl font-body-lg btn-hover-effect">
|
| 117 | Saiba mais
|
| 118 | </button>
|
| 119 | </div>
|
| 120 | </div>
|
| 121 |
|
| 122 | <div class="flex-1 relative flex items-center justify-center">
|
| 123 | <div class="absolute -top-12 -left-12 w-64 h-64 bg-brand-green/10 rounded-full blur-3xl animate-pulse"></div>
|
| 124 | <div id="logo-container" class="relative z-10 w-64 h-64 md:w-80 md:h-80 cursor-pointer select-none"></div>
|
| 125 | </div>
|
| 126 | </section>
|
| 127 |
|
| 128 | <section class="bg-surface-light py-20 border-y border-border-subtle">
|
| 129 | <div class="max-w-7xl mx-auto px-container-padding">
|
| 130 | <div class="mb-12 flex justify-between items-end">
|
| 131 | <div>
|
| 132 | <h2 class="text-headline-lg font-headline-lg text-3xl mb-2">Funcionalidades</h2>
|
| 133 | <p class="text-text-secondary">Explore as ferramentas desenhadas para sua evolução.</p>
|
| 134 | </div>
|
| 135 | </div>
|
| 136 | <div class="glide">
|
| 137 | <div class="glide__track" data-glide-el="track">
|
| 138 | <ul class="glide__slides">
|
| 139 | <li class="glide__slide">
|
| 140 | <div class="bg-background-light p-8 rounded-xl border border-border-subtle h-full group hover:shadow-md transition-shadow">
|
| 141 | <div class="w-12 h-12 bg-pill-indigo rounded-lg flex items-center justify-center mb-6">
|
| 142 | <svg class="w-6 h-6 text-indigo-600 morph-icon" viewBox="0 0 24 24" fill="currentColor">
|
| 143 | <defs>
|
| 144 | <path class="morph-resting" d="M12 3 L13 10 L20 8 L14 12 L20 16 L13 14 L12 21 L11 14 L4 16 L10 12 L4 8 L11 10 Z"/>
|
| 145 | <path class="morph-shape" d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
|
| 146 | </defs>
|
| 147 | <path d="M12 3 L13 10 L20 8 L14 12 L20 16 L13 14 L12 21 L11 14 L4 16 L10 12 L4 8 L11 10 Z"/>
|
| 148 | </svg>
|
| 149 | </div>
|
| 150 | <h3 class="font-headline-md text-xl mb-3">Monitoramento de Humor</h3>
|
| 151 | <p class="text-text-secondary font-body-md mb-6">
|
| 152 | Identifique padrões emocionais e gatilhos diários com nosso
|
| 153 | sistema de tagging inteligente e análise de sentimentos.
|
| 154 | </p>
|
| 155 |
|
| 156 | <img alt="Mood tracking"
|
| 157 | class="w-full h-48 object-cover rounded-lg"
|
| 158 | src="/images/mood.jpg"/>
|
| 159 | </div>
|
| 160 | </li>
|
| 161 |
|
| 162 | <li class="glide__slide">
|
| 163 | <div class="bg-background-light p-8 rounded-xl border border-border-subtle h-full group hover:shadow-md transition-shadow">
|
| 164 | <div class="w-12 h-12 bg-pill-purple rounded-lg flex items-center justify-center mb-6">
|
| 165 | <svg class="w-6 h-6 text-purple-600 morph-icon" viewBox="0 0 24 24" fill="currentColor">
|
| 166 | <defs>
|
| 167 | <path class="morph-resting" d="M12 3 L13 10 L20 8 L14 12 L20 16 L13 14 L12 21 L11 14 L4 16 L10 12 L4 8 L11 10 Z"/>
|
| 168 | <path class="morph-shape" d="M17 11h-4V7h-2v4H7v2h4v4h2v-4h4z"/>
|
| 169 | </defs>
|
| 170 | <path d="M12 3 L13 10 L20 8 L14 12 L20 16 L13 14 L12 21 L11 14 L4 16 L10 12 L4 8 L11 10 Z"/>
|
| 171 | </svg>
|
| 172 | </div>
|
| 173 | <h3 class="font-headline-md text-xl mb-3">Gestão de Saúde</h3>
|
| 174 | <p class="text-text-secondary font-body-md mb-6">
|
| 175 | Controle medicação, consultas e exames em um cronograma
|
| 176 | unificado com alertas inteligentes e lembretes
|
| 177 | personalizáveis.
|
| 178 | </p>
|
| 179 | <img alt="Health management" class="w-full h-48 object-cover rounded-lg" data-alt="Close up of a modern medical laboratory or clinic setting with clean white surfaces and high-tech equipment. Soft natural light flows through a window, highlighting the precision and cleanliness of the health environment. Professional and trustworthy atmosphere." src="/images/pills.jpg"/>
|
| 180 | </div>
|
| 181 | </li>
|
| 182 |
|
| 183 | <li class="glide__slide">
|
| 184 | <div class="bg-background-light p-8 rounded-xl border border-border-subtle h-full group hover:shadow-md transition-shadow">
|
| 185 | <div class="w-12 h-12 bg-pill-blue rounded-lg flex items-center justify-center mb-6">
|
| 186 | <svg class="w-6 h-6 text-blue-600 morph-icon" viewBox="0 0 24 24" fill="currentColor">
|
| 187 | <defs>
|
| 188 | <path class="morph-resting" d="M12 3 L13 10 L20 8 L14 12 L20 16 L13 14 L12 21 L11 14 L4 16 L10 12 L4 8 L11 10 Z"/>
|
| 189 | <path class="morph-shape" d="M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9 9-4.03 9-9c0-.46-.04-.92-.1-1.36-.98 1.37-2.58 2.26-4.4 2.26-2.98 0-5.4-2.42-5.4-5.4 0-1.81.89-3.42 2.26-4.4-.44-.06-.9-.1-1.36-.1z"/>
|
| 190 | </defs>
|
| 191 | <path d="M12 3 L13 10 L20 8 L14 12 L20 16 L13 14 L12 21 L11 14 L4 16 L10 12 L4 8 L11 10 Z"/>
|
| 192 | </svg>
|
| 193 | </div>
|
| 194 |
|
| 195 | <h3 class="font-headline-md text-xl mb-3">Monitore seu sono</h3>
|
| 196 | <p class="text-text-secondary font-body-md mb-6">
|
| 197 | Controle também o seu sono, para conseguir antecipar flutuações no humor
|
| 198 | e identificar padrões com mais qualidade
|
| 199 | </p>
|
| 200 | <img alt="Exercise routines"
|
| 201 | class="w-full h-48 object-cover rounded-lg"
|
| 202 | src="/images/sleep.jpg"/>
|
| 203 | </div>
|
| 204 | </li>
|
| 205 | </ul>
|
| 206 | </div>
|
| 207 | <div class="glide__bullets mt-8 flex justify-center gap-2" data-glide-el="controls[nav]">
|
| 208 | <button type="button"
|
| 209 | class="glide__bullet w-3 h-3 rounded-full bg-border-subtle"
|
| 210 | data-glide-dir="=0">
|
| 211 | </button>
|
| 212 |
|
| 213 | <button type="button"
|
| 214 | class="glide__bullet w-3 h-3 rounded-full bg-border-subtle"
|
| 215 | data-glide-dir="=1">
|
| 216 | </button>
|
| 217 |
|
| 218 | <button type="button"
|
| 219 | class="glide__bullet w-3 h-3 rounded-full bg-border-subtle"
|
| 220 | data-glide-dir="=2">
|
| 221 | </button>
|
| 222 | </div>
|
| 223 | </div>
|
| 224 | </div>
|
| 225 | </section>
|
| 226 |
|
| 227 | <section class="py-24 max-w-7xl mx-auto px-container-padding text-center">
|
| 228 | <h2 class="text-headline-lg font-headline-lg text-4xl mb-16">Visualize padrões</h2>
|
| 229 | <div class="flex justify-center">
|
| 230 | <div class="atropos my-atropos w-full max-w-2xl">
|
| 231 | <div class="atropos-scale">
|
| 232 | <div class="atropos-rotate">
|
| 233 | <div class="atropos-inner rounded-[2rem] bg-surface-light border border-border-subtle shadow-2xl p-10 text-left overflow-hidden">
|
| 234 | <div class="flex justify-between items-start mb-8">
|
| 235 | <div data-atropos-offset="5">
|
| 236 | <span class="text-label-sm font-label-sm uppercase tracking-widest text-text-secondary">Energia</span>
|
| 237 | <h3 class="text-5xl font-extrabold mt-2 text-brand-green">84%</h3>
|
| 238 | </div>
|
| 239 |
|
| 240 | <div class="bg-status-active-bg p-3 rounded-xl" data-atropos-offset="10">
|
| 241 | <span class="material-symbols-outlined text-brand-green text-3xl">trending_up</span>
|
| 242 | </div>
|
| 243 | </div>
|
| 244 |
|
| 245 | <div class="flex items-end gap-3 h-48 mb-8" data-atropos-offset="3">
|
| 246 | <div class="flex-1 bg-border-subtle rounded-t-lg h-[60%] hover:bg-brand-green/20 transition-colors"></div>
|
| 247 | <div class="flex-1 bg-border-subtle rounded-t-lg h-[45%] hover:bg-brand-green/20 transition-colors"></div>
|
| 248 | <div class="flex-1 bg-brand-green rounded-t-lg h-[84%] relative">
|
| 249 | <div class="absolute -top-10 left-1/2 -translate-x-1/2 bg-text-primary text-white text-[10px] px-2 py-1 rounded">
|
| 250 | Hoje
|
| 251 | </div>
|
| 252 | </div>
|
| 253 | <div class="flex-1 bg-border-subtle rounded-t-lg h-[55%] transition-colors"></div>
|
| 254 | <div class="flex-1 bg-border-subtle rounded-t-lg h-[70%] transition-colors"></div>
|
| 255 | <div class="flex-1 bg-border-subtle rounded-t-lg h-[40%] transition-colors"></div>
|
| 256 | <div class="flex-1 bg-border-subtle rounded-t-lg h-[65%] transition-colors"></div>
|
| 257 | </div>
|
| 258 |
|
| 259 | <div class="grid grid-cols-2 gap-4" data-atropos-offset="8">
|
| 260 | <div class="p-4 bg-background-light rounded-xl">
|
| 261 | <span class="text-xs text-text-secondary block">Humor</span>
|
| 262 | <span class="font-bold">+12% mais ansioso nos últimos três dias</span>
|
| 263 | </div>
|
| 264 | <div class="p-4 bg-background-light rounded-xl">
|
| 265 | <span class="text-xs text-text-secondary block">Sono</span>
|
| 266 | <span class="font-bold">Você tem dormido melhor na última semana</span>
|
| 267 | </div>
|
| 268 | </div>
|
| 269 |
|
| 270 | <div class="absolute -right-16 -bottom-16 w-64 h-64 bg-brand-green/5 rounded-full blur-3xl"
|
| 271 | data-atropos-offset="-5"></div>
|
| 272 | </div>
|
| 273 | </div>
|
| 274 | </div>
|
| 275 | </div>
|
| 276 | </div>
|
| 277 | </section>
|
| 278 |
|
| 279 | <section class="bg-background-light py-24">
|
| 280 | <div class="max-w-7xl mx-auto px-container-padding">
|
| 281 | <div class="text-center mb-16">
|
| 282 | <h2 class="text-headline-lg font-headline-lg text-4xl mb-4">Por que o nexo?</h2>
|
| 283 | <p class="text-text-secondary max-w-2xl mx-auto">
|
| 284 | Tecnologia avançada focada no que realmente importa: seu bem-estar
|
| 285 | diário e a segurança dos seus dados.
|
| 286 | </p>
|
| 287 | </div>
|
| 288 | <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
| 289 | <div class="bg-surface-light p-10 rounded-2xl border border-border-subtle transition-all hover:-translate-y-2">
|
| 290 | <div class="w-14 h-14 bg-status-active-bg rounded-2xl flex items-center justify-center mb-8">
|
| 291 | <span class="material-symbols-outlined text-brand-green text-3xl">lock</span>
|
| 292 | </div>
|
| 293 | <h3 class="text-headline-md font-headline-md text-xl mb-4">Privacidade</h3>
|
| 294 | <p class="text-text-secondary font-body-md leading-relaxed">
|
| 295 | Seus dados de saúde são criptografados de ponta a ponta. Você tem
|
| 296 | controle total sobre o que compartilha e com quem.
|
| 297 | </p>
|
| 298 | </div>
|
| 299 |
|
| 300 | <div class="bg-surface-light p-10 rounded-2xl border border-border-subtle transition-all hover:-translate-y-2">
|
| 301 | <div class="w-14 h-14 bg-pill-blue rounded-2xl flex items-center justify-center mb-8">
|
| 302 | <span class="material-symbols-outlined text-blue-600 text-3xl">sync</span>
|
| 303 | </div>
|
| 304 | <h3 class="text-headline-md font-headline-md text-xl mb-4">Sincronização</h3>
|
| 305 | <p class="text-text-secondary font-body-md leading-relaxed">
|
| 306 | Acesse seu histórico de qualquer dispositivo. Utilize offline e o
|
| 307 | app sincronizará.
|
| 308 | </p>
|
| 309 | </div>
|
| 310 |
|
| 311 | <div class="bg-surface-light p-10 rounded-2xl border border-border-subtle transition-all hover:-translate-y-2">
|
| 312 | <div class="w-14 h-14 bg-pill-purple rounded-2xl flex items-center justify-center mb-8">
|
| 313 | <span class="material-symbols-outlined text-purple-600 text-3xl">analytics</span>
|
| 314 | </div>
|
| 315 | <h3 class="text-headline-md font-headline-md text-xl mb-4">Relatórios</h3>
|
| 316 | <p class="text-text-secondary font-body-md leading-relaxed">
|
| 317 | Gere PDFs detalhados para levar ao seu médico ou terapeuta,
|
| 318 | facilitando o diagnóstico e acompanhamento clínico.
|
| 319 | </p>
|
| 320 | </div>
|
| 321 | </div>
|
| 322 | </div>
|
| 323 | </section>
|
| 324 |
|
| 325 | <section class="max-w-7xl mx-auto px-container-padding py-12">
|
| 326 | <div class="bg-text-primary rounded-[2.5rem] p-12 md:p-20 text-center relative overflow-hidden">
|
| 327 | <div class="absolute top-0 right-0 w-96 h-96 bg-brand-green/10 rounded-full blur-[100px]"></div>
|
| 328 | <div class="absolute -bottom-20 -left-20 w-80 h-80 bg-blue-500/10 rounded-full blur-[80px]"></div>
|
| 329 | <div class="relative z-10 space-y-8">
|
| 330 | <h2 class="text-white text-4xl md:text-6xl font-extrabold tracking-tight animated-text">
|
| 331 | Pronto para começar sua jornada?
|
| 332 | </h2>
|
| 333 | <p class="text-slate-400 text-lg md:text-xl max-w-2xl mx-auto">
|
| 334 | Explore o código-fonte, e baixe o aplicativo na Google Play. Exporte seus dados quando quiser
|
| 335 | </p>
|
| 336 | <div class="flex flex-col sm:flex-row justify-center gap-4 pt-4">
|
| 337 | <button class="bg-brand-green text-text-primary px-10 py-5 rounded-xl font-bold text-lg shadow-xl shadow-brand-green/20 btn-hover-effect">
|
| 338 | Começar Grátis agora
|
| 339 | </button>
|
| 340 | <a href="https://pira.dev/eletrotupi/tcc"
|
| 341 | class="bg-white/10 backdrop-blur-md text-white border border-white/20 px-10 py-5 rounded-xl font-bold text-lg btn-hover-effect">
|
| 342 | Visualizar código-fonte
|
| 343 | </a>
|
| 344 | </div>
|
| 345 | </div>
|
| 346 | </div>
|
| 347 | </section>
|
| 348 | </main>
|
| 349 |
|
| 350 | <footer class="bg-background-light border-t border-border-subtle mt-20">
|
| 351 | <div class="grid grid-cols-2 md:grid-cols-4 gap-section-gap px-container-padding py-16 max-w-7xl mx-auto">
|
| 352 | <div class="col-span-2 md:col-span-1">
|
| 353 | <div class="text-headline-md font-headline-md text-text-primary mb-6">nexo</div>
|
| 354 | <p class="text-text-secondary font-body-md mb-6 max-w-xs">
|
| 355 | Elevando o padrão de cuidado mental convergindo o que é necessário pra você.
|
| 356 | </p>
|
| 357 | </div>
|
| 358 |
|
| 359 | <div>
|
| 360 | <h4 class="font-bold text-text-primary mb-6">O app</h4>
|
| 361 | <ul class="space-y-4">
|
| 362 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Funcionalidades</a></li>
|
| 363 | <li>
|
| 364 | <a class="text-text-secondary hover:text-text-primary transition-all"
|
| 365 | href="/monografia">
|
| 366 | Monografia
|
| 367 | </a>
|
| 368 | </li>
|
| 369 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Ajuda</a></li>
|
| 370 | </ul>
|
| 371 | </div>
|
| 372 |
|
| 373 | <div>
|
| 374 | <h4 class="font-bold text-text-primary mb-6">Sobre</h4>
|
| 375 | <ul class="space-y-4">
|
| 376 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Fale conosco</a></li>
|
| 377 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Política de Privacidade</a></li>
|
| 378 | </ul>
|
| 379 | </div>
|
| 380 |
|
| 381 | <!-- Legal -->
|
| 382 | <div>
|
| 383 | <h4 class="font-bold text-text-primary mb-6">Legal</h4>
|
| 384 | <ul class="space-y-4">
|
| 385 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Termos de uso</a></li>
|
| 386 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Política de Cookies</a></li>
|
| 387 | <li><a class="text-text-secondary hover:text-text-primary transition-all" href="#">Segurança</a></li>
|
| 388 | </ul>
|
| 389 | </div>
|
| 390 | </div>
|
| 391 | <div class="border-t border-border-subtle py-8 text-center text-label-sm font-label-sm text-text-secondary">
|
| 392 | © 2025 <a href="https://cabotia.dev">cabotia</a>.
|
| 393 | Todos os direitos reservados. Código-fonte e texto sob os termos das
|
| 394 | respectivas licenças.
|
| 395 | </div>
|
| 396 | </footer>
|
| 397 |
|
| 398 | <script src="https://cdn.jsdelivr.net/npm/@glidejs/glide/dist/glide.min.js"></script>
|
| 399 | <script src="https://cdn.jsdelivr.net/npm/atropos/atropos.min.js"></script>
|
| 400 | <script src="/js/app.js">
|
| 401 | </script>
|
| 402 | </body>
|
| 403 | </html>
|