wardo-studio/tech.html at main · WRDStudio/wardo-studio · 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
<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Wardo Studio | Tech</title>
    <link rel="icon" type="image/svg+xml" href="/images/WS-2D.svg?v=2" />
    <meta name="description" content="Wardo Tech - Systems that power creativity.">
    <link rel="canonical" href="https://www.wardostudio.com/tech">
    <link rel="preload" href="/fonts/CormorantGaramond-Bold.woff2" as="font" type="font/woff2">
    <link rel="stylesheet" href="./style.css">
</head>

<body>
    <div id="app">
        <header class="site-header">
            <div class="logo">
                <a href="/" class="logo">
                    <img src="/images/WS-2D.svg" alt="Wardo Studio Icon" class="header-icon" width="100" height="100">
                    <img src="/images/WS-Lettering.svg" alt="Wardo Studio Lettering" class="header-logo-text-img"
                        width="240" height="100">
                </a>
            </div>
            <nav>
                <a href="/index.html#explore">Explore Wardo Studio</a>
                <a href="/index.html#universe">Our Universe</a>
                <a href="#contact">Contact</a>
            </nav>
        </header>

        <main>
            <!-- Sub-Page Hero -->
            <section class="subpage-hero">
                <div class="subpage-content-wrapper">
                    <span class="category-tag" style="color: #44D62C;">CATEGORY — TECH</span>
                    <h1 class="subpage-title" style="color: #44D62C;">Systems that power creativity.</h1>
                    <p class="subpage-intro">Wardo Studio builds tools that solve real operational problems for creative
                        businesses
                        and hospitality spaces: Inventory, costing, time tracking, wellness and crypto insights.</p>
                </div>
            </section>

            <!-- Cards Grid -->
            <section class="subpage-grid-section">
                <div class="subpage-content-wrapper">
                    <div class="info-card-grid">
                        <!-- Card 1: SDI -->
                        <div class="info-card">
                            <h3>SDI — Sistema Dinámico de Inventario</h3>
                            <p>A dynamic inventory system built for bars and creative venues, designed for real-world
                                scenarios,
                                offline resilience and clear decision-making.</p>
                            <p class="meta-info">Placeholder for UI gallery and live demo link.</p>
                        </div>

                        <!-- Card 2: SCC -->
                        <div class="info-card">
                            <h3>SCC — Sistema de Costeo de Cocina</h3>
                            <p>A cost-control engine for gastronomy projects. From recipes to margin analysis, SCC keeps
                                kitchen operations honest and profitable.</p>
                            <p class="meta-info">Placeholder for documentation and case studies.</p>
                        </div>

                        <!-- Card 3: WWW -->
                        <div class="info-card">
                            <h3>WWW — Wardo’s Worked Worth</h3>
                            <p>A personal time-value tracker. Measure your hours, understand your worth and align your
                                energy
                                with where it truly compounds.</p>
                            <span class="coming-soon-badge">Concept in development</span>
                        </div>

                        <!-- Card 4: Equilibrium -->
                        <div class="info-card">
                            <h3>Equilibrium</h3>
                            <p>A wellness companion designed to balance productivity with health. Tracking metrics that
                                matter for longevity and focus.</p>
                            <p class="meta-info">Placeholder for product narrative.</p>
                        </div>

                        <!-- Card 5: ChoiceLatam / Meridiano Crypto -->
                        <div class="info-card">
                            <h3>ChoiceLatam / Meridiano Crypto</h3>
                            <p>First crypto bulletins directed for Latam investors, not just narrative but Engines /
                                SaaS
                                / On-chain analytics.</p>
                            <p class="meta-info">Bridging culture and data.</p>
                        </div>
                    </div>
                </div>
            </section>

            <!-- Contact Section (Reused) -->
            <section id="contact" class="contact-section">
                <div class="contact-container">
                    <!-- Left Column: Info -->
                    <div class="contact-info">
                        <h2>Work With Us</h2>
                        <p class="contact-subtext">Interested in collaborating, booking a DJ set, developing a system or
                            designing a new experience?</p>

                        <div class="contact-services">
                            <h3>What we do</h3>
                            <ul>
                                <li>Music & DJ Sets for clubs, festivals and brands.</li>
                                <li>Custom systems for hospitality and creative businesses.</li>
                                <li>Hospitality concepts and product development.</li>
                                <li>Creative consulting for brands and venues.</li>
                            </ul>
                        </div>
                    </div>

                    <!-- Right Column: Form -->
                    <div class="contact-form-wrapper">
                        <form action="https://formsubmit.co/house@wardostudio.com" method="POST" class="contact-form">
                            <input type="hidden" name="_subject" value="New Inquiry from Wardo Studio Site (Tech Page)">
                            <input type="hidden" name="_captcha" value="false">
                            <input type="hidden" name="_template" value="table">
                            <input type="text" name="_honey" style="display:none">

                            <div class="form-group">
                                <label for="name">Name</label>
                                <input type="text" id="name" name="name" placeholder="Your name" required>
                            </div>

                            <div class="form-group">
                                <label for="email">Email</label>
                                <input type="email" id="email" name="email" placeholder="you@example.com" required>
                            </div>

                            <div class="form-group">
                                <label for="project-type">Project Type</label>
                                <div class="select-wrapper">
                                    <select id="project-type" name="project_type" required>
                                        <option value="" disabled selected>Select project type</option>
                                        <option value="Music / DJ">Music / DJ</option>
                                        <option value="Tech / Systems">Tech / Systems</option>
                                        <option value="Hospitality / Concept">Hospitality / Concept</option>
                                        <option value="Media / Content">Media / Content</option>
                                        <option value="Other">Other</option>
                                    </select>
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="message">Message</label>
                                <textarea id="message" name="message" rows="5"
                                    placeholder="Tell us about your idea or project" required></textarea>
                            </div>

                            <button type="submit" class="submit-btn" style="color: black;">Send Inquiry</button>
                        </form>
                    </div>
                </div>
            </section>
        </main>

        <footer class="creative-footer">
            <div class="footer-content">
                <p class="footer-tagline" style="margin-bottom: 4rem;">The Creative Operating System</p>

                <div class="footer-bottom">
                    <div class="social-links">
                        <a href="https://instagram.com/wardo.cr" target="_blank">@wardo.cr</a>
                        <a href="https://instagram.com/chilijunglecr" target="_blank">@chilijunglecr</a>
                        <a href="https://instagram.com/garitoplayground" target="_blank">@garitoplayground</a>
                    </div>
                    <p class="copyright">© 2025 Wardo Studio. All rights reserved.</p>
                </div>
            </div>
        </footer>
    </div>
    <script type="module" src="/main.js"></script>
</body>

</html>