PunFiction/about.html at main · iwandres/PunFiction · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-41EV4HJ1LH"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'G-41EV4HJ1LH', {
          'game_name': 'portal'
      });
    </script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/png" href="p_green_white_bg.png">
    <title>About Us | PunFiction: Daily Parody Games</title>
    <link href="https://fonts.googleapis.com/css2?family=Bangers&family=Nunito:wght@400;700;800;900&display=swap" rel="stylesheet">
    <style>
        :root {
            --bg-color: #0f0f16;
            --card-bg: #181824;
            --text-color: #ffffff;
            --text-muted: #a0a0c0;
            --primary: #bd93f9;
            --accent: #ffb86c;
            --border-color: #000000;
        }

        body {
            font-family: 'Nunito', sans-serif;
            background-color: var(--bg-color);
            color: var(--text-color);
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            min-height: 100vh;
            align-items: center;
        }

        header {
            width: 100%;
            max-width: 800px;
            text-align: center;
            padding: 40px 20px 20px 20px;
            box-sizing: border-box;
        }

        h1.brand {
            font-family: 'Bangers', cursive;
            font-size: 3.5rem;
            letter-spacing: 3px;
            margin: 0;
            color: var(--text-color);
            text-shadow: 4px 4px 0px var(--border-color);
        }

        h1.brand span.accent {
            color: var(--accent);
        }

        .tagline {
            font-size: 1.2rem;
            font-weight: 800;
            color: var(--text-muted);
            margin-top: 5px;
            margin-bottom: 20px;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        main {
            flex: 1;
            width: 100%;
            max-width: 800px;
            padding: 0 20px 40px 20px;
            box-sizing: border-box;
        }

        .content-card {
            background-color: var(--card-bg);
            border: 4px solid var(--border-color);
            border-radius: 16px;
            box-shadow: 8px 8px 0px var(--border-color);
            padding: 40px;
            margin-bottom: 30px;
        }

        h2 {
            font-family: 'Bangers', cursive;
            font-size: 2.2rem;
            color: var(--accent);
            margin-top: 30px;
            margin-bottom: 15px;
            letter-spacing: 1px;
            text-shadow: 2px 2px 0px var(--border-color);
        }

        h2:first-of-type {
            margin-top: 0;
        }

        p {
            font-size: 1.1rem;
            line-height: 1.7;
            color: #e0e0f0;
            margin-bottom: 20px;
        }

        ul {
            margin-bottom: 25px;
            padding-left: 20px;
        }

        li {
            font-size: 1.05rem;
            line-height: 1.6;
            margin-bottom: 10px;
            color: #e0e0f0;
        }

        li strong {
            color: var(--primary);
        }

        .back-btn {
            display: inline-block;
            font-family: 'Bangers', cursive;
            font-size: 1.5rem;
            letter-spacing: 1px;
            background-color: var(--primary);
            color: var(--border-color);
            padding: 10px 25px;
            border: 3px solid var(--border-color);
            border-radius: 8px;
            text-decoration: none;
            box-shadow: 4px 4px 0px var(--border-color);
            transition: transform 0.1s, box-shadow 0.1s;
            cursor: pointer;
            margin-top: 20px;
        }

        .back-btn:hover {
            background-color: #c7a4ff;
            transform: translate(-1px, -1px);
            box-shadow: 5px 5px 0px var(--border-color);
        }

        .back-btn:active {
            transform: translate(2px, 2px);
            box-shadow: 2px 2px 0px var(--border-color);
        }

        footer {
            width: 100%;
            text-align: center;
            padding: 20px;
            color: var(--text-muted);
            font-size: 0.9rem;
            border-top: 1px solid rgba(255, 255, 255, 0.05);
            box-sizing: border-box;
            background: rgba(0, 0, 0, 0.2);
        }

        footer a {
            color: var(--primary);
            text-decoration: none;
            margin: 0 10px;
        }

        footer a:hover {
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <header>
        <h1 class="brand">Pun<span class="accent">Fiction</span></h1>
        <div class="tagline">About Our Daily Wordplay Games</div>
    </header>

    <main>
        <div class="content-card">
            <h2>🎬 Our Story & Mission</h2>
            <p>Welcome to PunFiction, the ultimate web destination for wordplay fanatics, movie buffs, and puzzle enthusiasts. Founded in 2026, PunFiction was created with a simple but ambitious goal: to merge pop culture with the lighthearted, intellectually engaging world of word puzzles and puns. Our game, <strong>Box Office Blunders</strong>, invites players every single day to step into an alternate parody universe—cracking classic movie titles corrupted by a single rhyming word change.</p>
            <p>We believe that games should be both fun and mentally stimulating. By tasking players with deciphering comedic plots, matching parody descriptions with original quotes, and leveraging logic-based hints, we foster an engaging environment that exercises the brain, celebrates visual design, and pays tribute to both classic cinema and famous global travel destinations.</p>

            <h2>🧠 The Cognitive Benefits of Daily Word Puzzles</h2>
            <p>Engaging in daily word games and puzzle solving does more than just fill a break in your day—it actually helps support long-term cognitive health. Researchers and neuroscientists have long studied how vocabulary-based games impact the human brain. Here are a few ways that playing games like PunFiction regularly can benefit your mind:</p>
            <ul>
                <li><strong>Enhances Cognitive Flexibility:</strong> Decoding puns and parodies requires you to look at words and phrases from multiple perspectives, switching between the literal meaning of a movie plot and its phonetic parody. This constant mental shifting strengthens your brain's cognitive flexibility.</li>
                <li><strong>Strengthens Retrieval & Recall:</strong> PunFiction prompts you to search your memory database for classic movie titles and famous quotes. Exercising these retrieval pathways on a daily basis keeps your memory search mechanisms sharp and responsive.</li>
                <li><strong>Builds Semantic Vocabulary:</strong> Discovering new puns, learning about classic cinema history, and associating rhyming terms expands your verbal intelligence and lateral thinking capabilities.</li>
                <li><strong>Promotes Problem-Solving Mindsets:</strong> Working through progressive clues (such as first-letter reveals or vowel fills) teaches the brain to approach complex problems systematically rather than giving up under pressure.</li>
            </ul>

            <h2>🎨 Neobrutalist Design & Retro Aesthetics</h2>
            <p>From the beginning, we wanted PunFiction to be more than just a grid of text. We drew inspiration from the <strong>Neobrutalist design movement</strong>, combining bold primary outlines, stark dropshadows, asymmetric cards, and eye-catching typography. This high-contrast style pays homage to vintage movie posters and classic theatrical prints in <strong>Box Office Blunders</strong>. By avoiding generic templates and focusing on rich visual aesthetics, we deliver a premium user experience that feels alive, responsive, and tactile with every click.</p>

            <h2>🌟 Dedicated to Open Source & Community</h2>
            <p>PunFiction is built by passionate creators and is proudly open source. We leverage modern web standards like HTML5, CSS3, and native JavaScript to ensure our games load lightning-fast on any device, from high-end desktop monitors to compact mobile viewports, without requiring any app store downloads or invasive account registrations. Our community-focused architecture syncs player progress across devices securely and anonymously using local storage and server integrations, ensuring you never lose your hard-earned daily streaks.</p>

            <div style="text-align: center;">
                <a href="./" class="back-btn">➔ Back to Portal</a>
            </div>
        </div>
    </main>

    <footer>
        <p>&copy; 2026 PunFiction. All rights reserved. | <a href="./">Home</a> | <a href="./about.html">About Us</a> | <a href="./how-to-play-boxoffice.html">How to Play Box Office</a> | Powered by <a href="https://github.com/iwandres/PunFiction">GitHub Pages</a></p>
    </footer>
</body>
</html>