PageSourceSearch

https://gps-brasilia.netlify.app/

html gps-brasilia.netlify.app collected 2026-10-03 08:17:18 UTC 21,491 bytes, 788 lines download raw bytes

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.