1<!doctype html> 2<html lang="pt-BR"> 3 4<head> 5 <meta charset="UTF-8"> 6<!-- This site is hosted on Netlify. Anyone can build and deploy a site 7 like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=a2da36df-3620-437a-9e0c-159328dc2ca9 8 Netlify hosting facts for this site: static/SSR served via Netlify Edge. --> 9 10 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 11 12 <meta name="description" content="GPS BrasÃlia: lugares, histórias e experiências para viver a capital."> 13 14 <title>GPS BrasÃlia | Descubra. Viva. Pertença.</title> 15 16 <!-- Fonte Poppins --> 17 <link rel="preconnect" href="https://fonts.googleapis.com"> 18 19 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 20 21 <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap" rel="stylesheet"> 22 23 <!-- CSS principal --> 24 <link rel="stylesheet" href="/pasta_estilo/styles.css"> 25 <link rel="stylesheet" href="/pasta_estilo/experiencias-modal.css"> 26 <link rel="stylesheet" href="/pasta_estilo/explorar-modal.css"> 27 <link rel="stylesheet" href="/pasta_estilo/chatbot.css"> 28 <style> 29 30 .gps-navbar { 31 position: sticky; 32 top: 0; 33 z-index: 9999; 34 35 display: flex; 36 align-items: center; 37 justify-content: space-between; 38 39 width: 100%; 40 height: 90px; 41 42 padding: 0 5%; 43 44 background-color: #ffffff; 45 border-bottom: 1px solid #e5e7eb; 46 47 overflow: visible; 48 } 49 50 .gps-navbar-logo-link { 51 display: flex; 52 align-items: center; 53 54 width: 170px; 55 height: 80px; 56 57 margin: 0; 58 padding: 0; 59 60 flex-shrink: 0; 61 } 62 63 .gps-navbar-logo { 64 display: block !important; 65 66 width: 180px !important; 67 height: 76px !important; 68 max-width: 180px !important; 69 max-height: 76px !important; 70 71 margin: 0 !important; 72 padding: 0 !important; 73 74 object-fit: contain !important; 75 object-position: left center !important; 76 } 77 78 .gps-navbar-menu { 79 display: flex; 80 align-items: center; 81 gap: 28px; 82 83 margin: 0; 84 padding: 0; 85 } 86 87 .gps-navbar-menu a { 88 color: #0d1b3d; 89 90 font-family: "Poppins", Arial, sans-serif; 91 font-size: 0.72rem; 92 font-weight: 500; 93 letter-spacing: 0.08em; 94 text-transform: uppercase; 95 text-decoration: none; 96 } 97 98 .gps-navbar-menu a:hover { 99 color: #00bfa8; 100 } 101 102 @media (max-width: 850px) { 103 104 .gps-navbar { 105 height: 72px; 106 padding: 0 20px; 107 } 108 109 .gps-navbar-logo-link { 110 width: 190px; 111 height: 80px; 112 } 113 114 .gps-navbar-logo { 115 width: 120px !important; 116 height: 55px !important; 117 max-width: 120px !important; 118 max-height: 55px !important; 119 } 120 121 .gps-navbar-menu { 122 position: absolute; 123 top: 72px; 124 right: 0; 125 left: 0; 126 127 display: none; 128 flex-direction: column; 129 align-items: flex-start; 130 gap: 0; 131 132 padding: 15px 20px; 133 134 background: #ffffff; 135 border-bottom: 1px solid #e5e7eb; 136 } 137 138 .gps-navbar-menu.open { 139 display: flex; 140 } 141 142 .gps-navbar-menu a { 143 width: 100%; 144 padding: 12px 0; 145 } 146 147 } 148 149</style> 150</head> 151 152<body> 153 154 <!-- CABEÃALHO --> 155 <header class="site-header" id="inicio"> 156 157 <!-- LOGO --> 158 <a class="brand" href="#inicio" aria-label="GPS BrasÃlia, inÃcio"> 159 <img 160 class="header-logo" 161 src="/assets/Inserir um tÃtulo.png" 162 alt="Logo GPS BrasÃlia" 163 > 164 </a> 165 166 <!-- BOTÃO DO MENU PARA CELULAR --> 167 <button 168 class="menu-toggle" 169 type="button" 170 aria-label="Abrir menu" 171 aria-expanded="false" 172 > 173 â° 174 </button> 175 176 <!-- NAVEGAÃÃO --> 177 <nav class="main-nav" aria-label="Navegação principal"> 178 179 <a href="#inicio">InÃcio</a> 180 <a href="#sobre">Sobre</a> 181 <a href="#explorar">Explorar</a> 182 <a href="#experiencias">Experiências</a> 183 <a href="#mapa">Mapa</a> 184 185 <!-- MENU DE PERFIL --> 186 <div class="profile-menu"> 187 188 <button 189 class="profile-trigger" 190 id="profile-trigger" 191 type="button" 192 aria-label="Abrir menu do perfil" 193 aria-expanded="false" 194 aria-controls="profile-dropdown" 195 > 196 <!-- ÃCONE DE PERFIL --> 197 <svg
198 viewBox="0 0 24 24" 199 aria-hidden="true" 200 > 201 <circle cx="12" cy="8" r="4"></circle> 202 203 <path 204 d="M4 21c0-4.2 3.6-7 8-7s8 2.8 8 7" 205 ></path> 206 </svg> 207 </button> 208 209 <!-- MENU QUE ABRE AO CLICAR --> 210 <div 211 class="profile-dropdown" 212 id="profile-dropdown" 213 hidden 214 > 215 216 <div class="profile-dropdown-header"> 217 <span class="profile-small-icon">â</span> 218 219 <div> 220 <strong>Bem-vindo!</strong> 221 <small>Acesse sua conta</small> 222 </div> 223 </div> 224 225 <a href='/home/login2'> 226 <span>Entrar</span> 227 <span>â</span> 228 </a> 229 230 <a href='/home/minha-conta'> 231 <span>Minha conta</span> 232 <span>â</span> 233 </a> 234 235 <a href='/home/favoritos'> 236 <span>Meus favoritos</span> 237 <span>â¡</span> 238 </a> 239 240 <a href='/home/indicar-local'> 241 <span>Indicar um local</span> 242 <span>ï¼</span> 243 </a> 244 245 </div> 246 247 </div> 248 249 </nav> 250 251</header> 252 253 <main> 254 255 <!-- HERO --> 256 <section class="hero" aria-labelledby="hero-title"> 257 <video class="hero-video" autoplay muted loop playsinline> 258 <source src="../assets/GPS_BRASILIA_VIDEO.mp4" type="video/mp4"> 259 </video> 260 <div class="hero-content"> 261 262 <p class="eyebrow light"> 263 Descubra. Viva. Pertença. 264 </p> 265 266 <h1 id="hero-title"> 267 BrasÃlia, 268 <br> 269 270 seu 271 <em>caminho,</em> 272 273 <br> 274 275 sua 276 <span>cidade!</span> 277 </h1> 278 279 <p class="hero-copy"> 280 Descubra lugares, histórias e experiências que fazem 281 de BrasÃlia um lugar único. 282 </p> 283 284 <div class="actions"> 285 286 <a class="button primary" href="#explorar"> 287 Explorar 288 </a> 289 290 <a class="text-link light" href="#sobre"> 291 Saiba mais 292 <span>â</span> 293 </a> 294 295 </div> 296 297 </div> 298 299 </section> 300 301 <!-- SOBRE --> 302 <section class="section about" id="sobre"> 303 304 <div class="about-copy reveal"> 305 306 <p class="eyebrow">Quem somos</p> 307 308 <h2> 309 Sobre o 310 <br> 311 GPS BrasÃlia 312 </h2> 313 314 <div class="rule"></div> 315 316 <p> 317 Somos um guia digital colaborativo que conecta pessoas 318 aos melhores lugares, histórias e experiências de BrasÃlia. 319 </p> 320 321 <p> 322 Mais que um guia, somos um ponto de encontro entre você 323 e a cidade. 324 </p> 325 326 </div> 327 328 <div class="about-visual reveal"> 329 330 <div class="line-symbol" aria-hidden="true"> 331 â 332 </div> 333 334 <!-- TROQUE A IMAGEM DA SEÃÃO SOBRE AQUI --> 335 <img 336 src="/assets/palacio-alvorada.jpg" 337 alt="Palácio da Alvorada, em BrasÃlia" 338 loading="lazy" 339 > 340 341 </div> 342 343 <div class="stats" aria-label="Números do GPS BrasÃlia"> 344 345 <div> 346 <strong>+500</strong> 347 <span>Lugares</span> 348 </div> 349 350 <div> 351 <strong>+50</strong>
352 <span>Experiências</span> 353 </div> 354 355 <div> 356 <strong>+10K</strong> 357 <span>Usuários</span> 358 </div> 359 360 <div> 361 <strong>1</strong> 362 <span>Cidade única</span> 363 </div> 364 365 </div> 366 367 </section> 368 369 <!-- EXPLORAR --> 370<section class="section explore" id="explorar"> 371 <div class="section-heading reveal"> 372 <div> 373 <p class="eyebrow">Do seu jeito</p> 374 <h2>Explore<br>BrasÃlia</h2> 375 <div class="rule"></div> 376 </div> 377 378 <p> 379 Encontre o que combina com você e descubra 380 o melhor da nossa cidade. 381 </p> 382 </div> 383 384 <div class="category-grid reveal"> 385 386 <button class="explore-category" type="button" data-category="gastronomia"> 387 <img class="category-icon" src="../assets/Culinaria.png" alt=""> 388 <span>Gastronomia</span> 389 </button> 390 391 <button class="explore-category" type="button" data-category="lazer"> 392 <img class="category-icon" src="../assets/LAZER.png" alt=""> 393 <span>Lazer ao ar livre</span> 394 </button> 395 396 <button class="explore-category" type="button" data-category="cultura"> 397 <img class="category-icon" src="../assets/cultura.png" alt=""> 398 <span>Cultura</span> 399 </button> 400 401 <button class="explore-category" type="button" data-category="arquitetura"> 402 <img class="category-icon" src="../assets/arquitetura.png" alt=""> 403 <span>Arquitetura</span> 404 </button> 405 406 <button class="explore-category" type="button" data-category="compras"> 407 <img class="category-icon" src="../assets/compras.png" alt=""> 408 <span>Compras</span> 409 </button> 410 411 <button class="explore-category" type="button" data-category="vida-noturna"> 412 <img class="category-icon" src="../assets/vidanoturna.png" alt=""> 413 <span>Vida noturna</span> 414 </button> 415 416 <button class="explore-category" type="button" data-category="historia"> 417 <img class="category-icon" src="../assets/historia.png" alt=""> 418 <span>História</span> 419 </button> 420 421 <button class="explore-category" type="button" data-category="familia"> 422 <img class="category-icon" src="../assets/familia.png" alt=""> 423 <span>FamÃlia</span> 424 </button> 425 426</div> 427</section> 428 429 430<!-- MODAL UTILIZADO PELAS OITO CATEGORIAS --> 431<div 432 class="explore-modal" 433 id="explore-modal" 434 role="dialog" 435 aria-modal="true" 436 aria-labelledby="explore-modal-title" 437 aria-hidden="true" 438> 439 <div class="explore-dialog" tabindex="-1"> 440 441 <header class="explore-modal-header"> 442 443 <div> 444 <p class="explore-modal-eyebrow"> 445 Explore BrasÃlia 446 </p> 447 448 <h2 id="explore-modal-title"></h2> 449 450 <div class="explore-modal-rule"></div> 451 452 <p 453 class="explore-modal-description" 454 id="explore-modal-description" 455 ></p> 456 </div> 457 458 <button 459 class="explore-modal-close" 460 type="button" 461 aria-label="Fechar categoria" 462 > 463 à 464 </button> 465 466 </header> 467 468 <!-- O JavaScript colocará os filtros aqui --> 469 <div 470 class="explore-modal-filters" 471 id="explore-modal-filters" 472 ></div> 473 474 <!-- O JavaScript colocará os lugares aqui --> 475 <div 476 class="explore-places-grid" 477 id="explore-places-grid" 478 ></div> 479 480 <div class="explore-modal-bottom"> 481 482 <p> 483 Conhece outro lugar especial? 484 </p> 485 486 <a href='/home/indicar-local'> 487 Indique um lugar â 488 </a> 489 490 </div> 491 492 </div> 493</div> 494 <!-- EXPERIÃNCIAS --> 495 <section class="section experiences" id="experiencias"> 496 497 <div class="section-heading reveal"> 498 <div> 499 <p class="eyebrow">Para guardar na memória</p> 500 <h2>Viva experiências<br>inesquecÃveis</h2> 501 <div class="rule"></div> 502 </div> 503 504 <p> 505 Atividades, eventos e roteiros para você viver 506 o melhor de BrasÃlia. 507 </p> 508 </div> 509 510 <div class="card-grid"> 511 512 <article class="place-card reveal"> 513 <!-- IMAGEM DO PRIMEIRO CARD --> 514 <img src="/assets/brasilia-cathedral-cc.webp" 515 alt="Catedral Metropolitana de BrasÃlia ao entardecer" loading="lazy"> 516 517 <div>
518 <span>Roteiro</span> 519 <h3>BrasÃlia Monumental</h3> 520 521 <a href="#" class="experience-open" data-experience="monumental"> 522 Ver roteiro â 523 </a> 524 </div> 525 </article> 526 527 <article class="place-card reveal"> 528 <!-- IMAGEM DO SEGUNDO CARD --> 529 <img src="https://www.viajenaviagem.com/wp-content/uploads/2014/04/brasilia-ponte-jk-1920x640-1.jpg" 530 alt="Ponte JK ao entardecer" loading="lazy"> 531 532 <div> 533 <span>Experiência</span> 534 <h3>Pôr do sol no Lago Sul</h3> 535 536 <a href="#" class="experience-open" data-experience="por-do-sol"> 537 Ver mais â 538 </a> 539 </div> 540 </article> 541 542 <article class="place-card reveal accent-card"> 543 <div class="card-number">03</div> 544 545 <div> 546 <span>Evento</span> 547 <h3>BrasÃlia depois das seis</h3> 548 549 <p> 550 Descubra cultura, gastronomia e encontros 551 quando a cidade acende. 552 </p> 553 554 <a href="#" class="experience-open" data-experience="depois-das-seis"> 555 Ver mais â 556 </a> 557 </div> 558 </article> 559 560 </div> 561 562</section> 563 564<!-- 565 MODAL DAS EXPERIÃNCIAS 566 Cole este bloco depois da seção Experiências ou antes de </main>. 567 O conteúdo é preenchido pelo arquivo experiencias-modal.js. 568--> 569<div class="experience-modal" id="experience-modal" role="dialog" aria-modal="true" 570 aria-labelledby="experience-modal-title" aria-hidden="true"> 571 <div class="experience-dialog" tabindex="-1"> 572 573 <button class="experience-close" type="button" aria-label="Fechar detalhes da experiência"> 574 à 575 </button> 576 577 <!-- METADE ESQUERDA: GALERIA --> 578 <div class="experience-gallery"> 579 580 <div class="experience-main-image"> 581 <img src="" alt="" id="experience-main-image"> 582 583 <button class="gallery-arrow gallery-prev" type="button" aria-label="Imagem anterior"> 584 â¹ 585 </button> 586 587 <button class="gallery-arrow gallery-next" type="button" aria-label="Próxima imagem"> 588 ⺠589 </button> 590 591 <span class="gallery-counter" id="gallery-counter">1 / 4</span> 592 </div> 593 594 <div class="experience-thumbnails" id="experience-thumbnails" aria-label="Miniaturas da experiência"></div> 595 596 </div> 597 598 <!-- METADE DIREITA: INFORMAÃÃES --> 599 <div class="experience-details"> 600 601 <div class="experience-heading"> 602 <div> 603 <p class="experience-category" id="experience-category"></p> 604 <h2 id="experience-modal-title"></h2> 605 </div> 606 607 <button class="experience-favorite" type="button" aria-label="Adicionar experiência aos favoritos"> 608 â¡ 609 </button> 610 </div> 611 612 <div class="experience-location"> 613 <svg viewBox="0 0 24 24" aria-hidden="true"> 614 <path d="M12 22s7-6.1 7-13A7 7 0 1 0 5 9c0 6.9 7 13 7 13Z"></path> 615 <circle cx="12" cy="9" r="2.3"></circle> 616 </svg> 617 <span id="experience-address"></span> 618 </div> 619 620 <p class="experience-description" id="experience-description"></p> 621 622 <div class="experience-info-grid"> 623 <div> 624 <span>Duração</span> 625 <strong id="experience-duration"></strong> 626 </div> 627 628 <div> 629 <span>Melhor horário</span> 630 <strong id="experience-time"></strong> 631 </div> 632 633 <div> 634 <span>Valor</span> 635 <strong id="experience-price"></strong> 636 </div> 637 638 <div>
639 <span>Indicado para</span> 640 <strong id="experience-audience"></strong> 641 </div> 642 </div> 643 644 <div class="experience-highlights"> 645 <h3>O que você vai encontrar</h3> 646 <ul id="experience-highlights"></ul> 647 </div> 648 649 <div class="experience-actions"> 650 <a class="experience-route" id="experience-route" href="#" target="_blank" rel="noopener"> 651 Ver rota no mapa â 652 </a> 653 654 <button class="experience-share" type="button"> 655 Compartilhar 656 </button> 657 </div> 658 659 </div> 660 661 </div> 662</div> 663 664 665 <!-- MAPA --> 666 <section class="map-section" id="mapa"> 667 668 <div class="map-copy reveal"> 669 670 <p class="eyebrow"> 671 Encontre seu caminho 672 </p> 673 674 <h2> 675 Mapa 676 <br> 677 interativo 678 </h2> 679 680 <div class="rule"></div> 681 682 <p> 683 Navegue pelo mapa e descubra lugares incrÃveis 684 perto de você. 685 </p> 686 687 <a class="button primary" href="https://www.google.com/maps/search/pontos+turÃsticos+BrasÃlia" 688 target="_blank" rel="noopener"> 689 Abrir mapa â 690 </a> 691 692 </div> 693 694 <div class="map-frame"> 695 696 <iframe title="Mapa de BrasÃlia" src="https://www.google.com/maps?q=BrasÃlia%20DF&output=embed" 697 loading="lazy" referrerpolicy="no-referrer-when-downgrade" allowfullscreen></iframe> 698 699 </div> 700 701 </section> 702 703 </main> 704 705 <!-- RODAPà --> 706 <footer class="site-footer"> 707 708 <div class="footer-brand"> 709 710 <a 711 class="footer-logo-link" 712 href="#inicio" 713 aria-label="GPS BrasÃlia, voltar ao inÃcio"> 714 715 <!-- TROQUE A LOGO DO RODAPà AQUI --> 716 <img 717 class="footer-logo" 718 src="/assets/Rectangle 6.png" 719 alt="GPS BrasÃlia" 720 > 721 722 </a> 723 724 <p> 725 Seu guia para descobrir, viver e se conectar com 726 o que faz da nossa cidade um lugar inesquecÃvel. 727 </p> 728 729 </div> 730 731 <div> 732 733 <h3>Navegue</h3> 734 735 <a href="#explorar">Explorar</a> 736 <a href="#experiencias">Experiências</a> 737 <a href="#mapa">Mapa</a> 738 739 </div> 740 741 <div> 742 743 <h3>Informações</h3> 744 745 <a href="#sobre">Sobre nós</a> 746 747 <a href="mailto:[email protected]"> 748 Seja parceiro 749 </a> 750 751 <a href="mailto:[email protected]"> 752 Fale conosco 753 </a> 754 755 </div> 756 757 <div> 758 759 <h3>Contato</h3> 760 761 <p>[email protected]</p> 762 <p>(61) 99999-9999</p> 763 <p>BrasÃlia, DF</p> 764 765 </div> 766 767 <div class="footer-bottom"> 768 769 <span> 770 © 2026 GPS BrasÃlia. 771 </span> 772 773 <span> 774 Descubra. Viva. Pertença. 775 </span> 776 777 </div> 778 779 </footer> 780 781 <!-- JavaScript --> 782
782<script src="../pasta_JS/index.js"></script>
782 783
783<script src="../pasta_JS/experiencias-modal.js"></script>
783 784
784<script src="../pasta_JS/explorar-modal.js"></script>
784 785
785<script src="../pasta_JS/chatbot.js"></script>
785 786</body> 787 788</html>
788<script async src="/.netlify/scripts/hud?variant=public" data-nf-variant="public" data-netlify-site-id="a2da36df-3620-437a-9e0c-159328dc2ca9" data-app-host="app.netlify.com"></script>
vendor: 1 bytes, line 788
788
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.