-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathen.html
More file actions
419 lines (418 loc) · 26.4 KB
/
Copy pathen.html
File metadata and controls
419 lines (418 loc) · 26.4 KB
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
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
<!DOCTYPE html>
<html class="light" lang="en"><head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>Write Your Book in 9 Months | Incubook Editorial Workshop</title>
<!-- Typography: Newsreader (Serif) & Manrope (Sans) -->
<link href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,200..800;1,6..72,200..800&family=Manrope:wght@200..800&display=swap" rel="stylesheet"/>
<!-- Material Symbols -->
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<script id="tailwind-config">
tailwind.config = {
darkMode: "class",
theme: {
extend: {
"colors": {
"background": "#f8f9fa",
"surface-container-low": "#f3f4f5",
"surface-container": "#edeeef",
"on-tertiary": "#ffffff",
"secondary-fixed": "#ffdbd0",
"outline-variant": "#c3c6ce",
"secondary": "#77574d",
"on-secondary-fixed-variant": "#5d4037",
"tertiary-container": "#692100",
"error-container": "#ffdad6",
"on-primary-fixed": "#ffffff",
"surface-dim": "#d9dadb",
"primary": "#002542",
"tertiary": "#451300",
"secondary-container": "#fed3c7",
"surface-bright": "#f8f9fa",
"on-background": "#191c1d",
"inverse-on-surface": "#f0f1f2",
"on-secondary": "#ffffff",
"primary-container": "#1b3b5a",
"on-error": "#ffffff",
"error": "#ba1a1a",
"on-tertiary-container": "#ff7d49",
"inverse-primary": "#abc9ef",
"on-surface-variant": "#43474d",
"secondary-fixed-dim": "#e7bdb1",
"outline": "#73777e",
"tertiary-fixed-dim": "#ffb59a",
"surface-container-highest": "#e1e3e4",
"surface-container-lowest": "#ffffff",
"primary-fixed-dim": "#abc9ef",
"on-primary": "#ffffff",
"surface-container-high": "#e7e8e9",
"on-primary-fixed-variant": "#d1e4ff",
"on-tertiary-fixed-variant": "#802a00",
"on-secondary-fixed": "#2c160e",
"on-primary-container": "#ffffff",
"surface": "#f8f9fa",
"on-error-container": "#93000a",
"on-surface": "#191c1d",
"surface-variant": "#e1e3e4",
"surface-tint": "#002542",
"on-tertiary-fixed": "#380d00",
"inverse-surface": "#2e3132",
"primary-fixed": "#002542",
"on-secondary-container": "#795950",
"tertiary-fixed": "#ffdbcf",
"accent-gold": "#E5B017"
},
"borderRadius": {
"DEFAULT": "0.5rem",
"lg": "0.5rem",
"xl": "1rem",
"full": "9999px"
},
"fontFamily": {
"headline": ["Newsreader", "serif"],
"body": ["Manrope", "sans-serif"],
"label": ["Manrope", "sans-serif"]
}
},
},
}
</script>
<style>
.material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.editorial-gradient {
background: linear-gradient(135deg, #002542 0%, #1b3b5a 100%);
}
.accent-gradient {
background: linear-gradient(135deg, #E5B017 0%, #B88A12 100%);
}
.timeline-node {
box-shadow: 0 0 15px rgba(229, 176, 23, 0.4);
}
</style>
</head>
<body class="bg-background text-on-surface font-body selection:bg-primary-container selection:text-on-primary-container">
<!-- TopNavBar -->
<nav class="fixed top-0 w-full z-50 bg-background/80 backdrop-blur-md">
<div class="flex justify-between items-center px-8 py-4 max-w-7xl mx-auto">
<div class="font-serif italic text-2xl text-primary">
<img alt="Incubook Editorial Workshop Logo" class="h-10 w-auto object-contain" src="https://lh3.googleusercontent.com/aida/ADBb0ugcEZtaTDvsUFUU0v9JnioMM7TG5k4_LLJrMOhjHACqZ6Kj1FX9uVJGvSHCQc-c31XCNIuEcgd3yuVooM1gfSVVXTuWgjYC5RppRtO6IeZYdsoXabytZobWcZJ5CBmKzZqBNzeHrqGnkcQO63L1jdauXI-qGVYCP78WLtfxt6ASBxZIpNX5VKL5K7eOK9oRBEPX_DxU0KujuJUN7fFmYKALQU-ktx_D6gHwTWmqfv2uTJvNgn5NvptBgP0XYMw2TDyBrmc2xHhv0A"/>
</div>
<div class="hidden md:flex items-center space-x-8 text-sm tracking-wide">
<a class="text-on-surface-variant hover:text-primary transition-colors duration-300" href="#how-it-works">How it Works</a>
<a class="text-on-surface-variant hover:text-primary transition-colors duration-300" href="#journey">Journey</a>
<a class="text-on-surface-variant hover:text-primary transition-colors duration-300" href="#mentors">Team</a>
<a class="font-bold text-accent-gold" href="/es">ES/<span class="underline decoration-2 underline-offset-4 text-primary">EN</span></a>
</div>
<div class="flex items-center space-x-4">
<a class="hidden md:block accent-gradient text-on-primary px-6 py-2 rounded-lg font-label text-sm hover:opacity-90 transition-all active:scale-95 duration-150 shadow-md" href="https://t.me/incubookbot">Join Workshop</a>
<button aria-label="Open support chat" class="text-primary p-2 rounded-full hover:bg-surface-container transition-colors">
<span class="material-symbols-outlined">chat</span>
</button>
</div>
</div>
</nav>
<main class="pt-24">
<!-- Hero Section -->
<section class="relative px-8 py-20 lg:py-32 overflow-hidden">
<div class="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
<div class="z-10">
<h1 class="font-headline text-5xl lg:text-7xl leading-tight text-accent-gold mb-8">
Write your book in 9 months.
</h1>
<p class="font-body text-lg lg:text-xl text-on-surface-variant mb-10 max-w-lg leading-relaxed">
A high-end editorial journey delivered 100% online via Telegram. Guided by Raúl Lilloy's methodology to discover and refine your literary voice.
</p>
<div class="flex flex-col sm:flex-row gap-4">
<a class="accent-gradient text-on-primary px-8 py-4 rounded-lg font-label text-base flex items-center justify-center gap-2 shadow-xl shadow-accent-gold/20 hover:translate-y-[-2px] transition-all" href="https://t.me/incubookbot">
Start on Telegram
</a>
<a class="bg-surface-container-highest text-primary px-8 py-4 rounded-lg font-label text-base flex items-center justify-center gap-2 hover:bg-surface-container-high transition-colors" href="https://wa.me/54926117058614?text=Hi%20I%20want%20to%20join%20the%20workshop">
Chat on WhatsApp
</a>
</div>
</div>
<div class="relative mb-12">
<div class="aspect-[4/5] rounded-xl overflow-hidden shadow-2xl">
<img alt="Portrait of Carson McCullers writing at her desk" class="w-full h-full object-cover" src="https://lh3.googleusercontent.com/aida/ADBb0ujfgKIhIaV7A9yMTWm78_CZWY_i4UEFvM1xAstPFfyBRjunqs9vSzWnA4_0KFnwpYh-6pTws6x5Au0nT6760_OFOuVM8D0u8l4hlr-ThF6lW-y_z6N1AN6KFSiufcKnV_A88TyoYqlFWVwx7f6OqXdktv_95G4I8ZM12xTJAc-GfdriufN-vnXEFdAeZtzGOyHIdPqj6q8k_VDUspYH6VHtDdYULpbOwQg03380zIFJVWFV5MIDgzipaZVgot2vpESungo18fYD"/>
</div>
<div class="absolute -bottom-10 -left-10 w-48 h-48 bg-primary/10 rounded-full mix-blend-multiply filter blur-3xl opacity-30 -z-10"></div>
<div class="absolute -bottom-6 -left-6 p-6 bg-primary text-on-primary rounded-lg shadow-xl max-w-[200px] z-20">
<p class="font-headline text-2xl italic leading-tight">"Writing is the game of invention."</p>
</div></div>
</div>
</section>
<!-- How It Works -->
<section class="py-24 bg-surface-container-low px-8" id="how-it-works">
<div class="max-w-5xl mx-auto text-center">
<h2 class="font-headline text-4xl text-primary mb-16">How it works</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-12 relative">
<div class="flex flex-col items-center">
<div class="w-20 h-20 rounded-full bg-white flex items-center justify-center shadow-lg mb-6 border-2 border-accent-gold/20">
<span class="material-symbols-outlined text-accent-gold text-4xl">assignment</span>
</div>
<h3 class="font-headline text-2xl mb-3 text-primary">1. Initial Survey</h3>
<p class="text-on-surface-variant text-sm px-4">A deep diagnostic of your creative intent and message.</p>
</div>
<div class="flex flex-col items-center">
<div class="w-20 h-20 rounded-full bg-white flex items-center justify-center shadow-lg mb-6 border-2 border-accent-gold/20">
<span class="material-symbols-outlined text-accent-gold text-4xl">calendar_month</span>
</div>
<h3 class="font-headline text-2xl mb-3 text-primary">2. Personal Plan</h3>
<p class="text-on-surface-variant text-sm px-4">A bespoke writing roadmap with weekly milestones.</p>
</div>
<div class="flex flex-col items-center">
<div class="w-20 h-20 rounded-full bg-white flex items-center justify-center shadow-lg mb-6 border-2 border-accent-gold/20">
<span class="material-symbols-outlined text-accent-gold text-4xl">forum</span>
</div>
<h3 class="font-headline text-2xl mb-3 text-primary">3. Bot Follow-up</h3>
<p class="text-on-surface-variant text-sm px-4">Daily guidance and accountability through our Telegram tutor.</p>
</div>
</div>
</div>
</section>
<!-- Manuscript Journey -->
<section class="py-24 px-8 overflow-hidden" id="journey">
<div class="max-w-7xl mx-auto">
<div class="text-center mb-16 lg:mb-24">
<h2 class="font-headline text-4xl lg:text-5xl text-accent-gold">The Manuscript Journey</h2>
<p class="mt-4 text-on-surface-variant max-w-2xl mx-auto">A roadmap of your transformation from idea to book.</p>
</div>
<!-- Desktop Timeline View -->
<div class="hidden lg:block relative py-12">
<div class="absolute top-1/2 left-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/40 to-transparent -translate-y-1/2"></div>
<div class="grid lg:grid-cols-6 gap-8 relative z-10">
<div class="flex flex-col items-center text-center">
<div class="mb-8"><span class="block font-headline text-lg text-primary">Idea & Plan</span></div>
<div class="w-5 h-5 bg-accent-gold rounded-full timeline-node ring-4 ring-background mb-8"></div>
<div><span class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Month 1</span></div>
</div>
<div class="flex flex-col items-center text-center">
<div class="mb-8"><span class="block font-headline text-lg text-primary">Mental Map</span></div>
<div class="w-5 h-5 bg-accent-gold rounded-full timeline-node ring-4 ring-background mb-8"></div>
<div><span class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Month 2</span></div>
</div>
<div class="flex flex-col items-center text-center">
<div class="mb-8"><span class="block font-headline text-lg text-primary">Structure</span></div>
<div class="w-5 h-5 bg-accent-gold rounded-full timeline-node ring-4 ring-background mb-8"></div>
<div><span class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Month 3</span></div>
</div>
<div class="flex flex-col items-center text-center">
<div class="mb-8"><span class="block font-headline text-lg text-primary font-bold">First Draft</span></div>
<div class="w-6 h-6 bg-accent-gold rounded-full timeline-node ring-4 ring-background mb-8"></div>
<div><span class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Months 4-5</span></div>
</div>
<div class="flex flex-col items-center text-center">
<div class="mb-8"><span class="block font-headline text-lg text-primary">Second Draft</span></div>
<div class="w-5 h-5 bg-accent-gold rounded-full timeline-node ring-4 ring-background mb-8"></div>
<div><span class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Months 6-7</span></div>
</div>
<div class="flex flex-col items-center text-center">
<div class="mb-8"><span class="block font-headline text-lg text-primary">Final Manuscript</span></div>
<div class="w-5 h-5 bg-accent-gold rounded-full timeline-node ring-4 ring-background mb-8"></div>
<div><span class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Months 8-9</span></div>
</div>
</div>
</div>
<!-- Mobile Vertical View -->
<div class="lg:hidden relative max-w-sm mx-auto pl-8">
<div class="absolute left-[3.5px] top-4 bottom-4 w-1 bg-accent-gold/20"></div>
<div class="space-y-10">
<div class="relative flex items-center gap-6">
<div class="absolute -left-[32.5px] w-2 h-2 bg-accent-gold rounded-full ring-4 ring-background z-10"></div>
<div>
<h4 class="font-headline text-primary text-lg">Idea & Plan</h4>
<p class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Month 1</p>
</div>
</div>
<div class="relative flex items-center gap-6">
<div class="absolute -left-[32.5px] w-2 h-2 bg-accent-gold rounded-full ring-4 ring-background z-10"></div>
<div>
<h4 class="font-headline text-primary text-lg">Mental Map</h4>
<p class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Month 2</p>
</div>
</div>
<div class="relative flex items-center gap-6">
<div class="absolute -left-[32.5px] w-2 h-2 bg-accent-gold rounded-full ring-4 ring-background z-10"></div>
<div>
<h4 class="font-headline text-primary text-lg">Structure</h4>
<p class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Month 3</p>
</div>
</div>
<div class="relative flex items-center gap-6">
<div class="absolute -left-[33.5px] w-3 h-3 bg-accent-gold rounded-full ring-4 ring-background z-10"></div>
<div>
<h4 class="font-headline text-primary text-lg font-bold">First Draft</h4>
<p class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Months 4-5</p>
</div>
</div>
<div class="relative flex items-center gap-6">
<div class="absolute -left-[32.5px] w-2 h-2 bg-accent-gold rounded-full ring-4 ring-background z-10"></div>
<div>
<h4 class="font-headline text-primary text-lg">Second Draft</h4>
<p class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Months 6-7</p>
</div>
</div>
<div class="relative flex items-center gap-6">
<div class="absolute -left-[32.5px] w-2 h-2 bg-accent-gold rounded-full ring-4 ring-background z-10"></div>
<div>
<h4 class="font-headline text-primary text-lg">Final Manuscript</h4>
<p class="font-label text-xs uppercase tracking-widest text-on-surface-variant opacity-60">Months 8-9</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Team Section -->
<section class="py-24 px-8 bg-surface-container-lowest" id="mentors">
<div class="max-w-7xl mx-auto">
<div class="mb-20 text-center">
<h2 class="font-headline text-4xl lg:text-5xl text-primary">Your Team of Clones</h2>
<p class="text-on-surface-variant mt-4 max-w-2xl mx-auto">You don't write alone. You are guided by the "clones" of those who decoded the literary labyrinth.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-5 gap-8">
<!-- Raúl -->
<div class="text-center group">
<div class="w-32 h-32 mx-auto rounded-full overflow-hidden mb-6 bg-surface-container-high ring-4 ring-accent-gold/10">
<img alt="Raúl Lilloy" class="w-full h-full object-cover grayscale group-hover:grayscale-0 transition-all duration-500" src="https://lh3.googleusercontent.com/aida/ADBb0ugofUVw3WU-ZONHB2Z5W9Ey0H4j1ZJGfkYNwBo-b4fJrKX_r0vFFc8hsXRG7vqBvavwazBs6A5whDFIn0HeMH6eDPelpKIWPGdzh7Szo42BFh3MEZUpSFA4pTr4qAiVtzsxkVZtNkT5jzntY3-sfZxx3bgdLaQMtyGI0w4b539_Daes_HKAvXgaFBHfcDyUiDz8yYn6HutXK2lZDqulVyNOXw9UMcOcF7p0GzpRbSClwpK0roBvu9Iny-cywtNggIKm56kcQ07KGQ"/>
</div>
<h4 class="font-headline text-xl text-primary">Raúl Lilloy</h4>
<p class="text-accent-gold font-label text-[10px] uppercase tracking-wider mt-2 font-bold px-2">Author of Finnegan’s Fast Talk, Memoirs of the Seventies, Kolón, and Pseudoscientific Tales.</p>
</div>
<!-- Joyce -->
<div class="text-center group">
<div class="w-32 h-32 mx-auto rounded-full overflow-hidden mb-6 bg-surface-container-high ring-4 ring-accent-gold/10">
<img alt="James Joyce" class="w-full h-full object-cover grayscale group-hover:grayscale-0 transition-all duration-500" src="https://lh3.googleusercontent.com/aida/ADBb0ugHV2xpCmXl4IRXnYeOf2A75kEfcittG2HhcWIKPbs1o8k6Hhkdn0lfqAX1QQcLouymnWUZC01_SSXTvhGWGKre5ELLanWSUjovNPR-JwvqtPATPPg3a9cY7e5Qw9E-c1PgwlVmmCWgDn1ljGovFEuiXmEGEnMFxFuPrGO1ChJR1NCM_Cez4Xuw454KAmkLCJhUhDaWaHukroqwwYd4sYXeYT9-8eY5cYuA8M-tTyfWYTQYvs-Tb1MumSSnOsxMXE0kA9QcdnLAAw"/>
</div>
<h4 class="font-headline text-xl text-primary">James Joyce</h4>
<p class="text-accent-gold font-label text-[10px] uppercase tracking-wider mt-2 font-bold px-2">Stream of consciousness specialist. May hide your keys in a pun.</p>
</div>
<!-- Borges -->
<div class="text-center group">
<div class="w-32 h-32 mx-auto rounded-full overflow-hidden mb-6 bg-surface-container-high ring-4 ring-accent-gold/10">
<img alt="Jorge Luis Borges" class="w-full h-full object-cover grayscale group-hover:grayscale-0 transition-all duration-500" src="https://lh3.googleusercontent.com/aida/ADBb0ugyOxNRTDhoSLstz9sHtVossiWpDm5-PwCD5f37eP8dxbN0G2zM7qhlr-4SSZMLQFK1zibi7FOiQEzRJffjVKxmCi1M4cGm1ZrQYffJwQhZQWPfV9tRiWUlwwuJ9gVnPOYRIX72I2XAE5oo882ch3JNGRA9sT21IL8WP6EdZWJqOPG6vhPXyWkztNyJmItZ6gwsTGe_urXev31a38qq9Ievzhp3wh5ygJxuEPSNO4wRp55x4jd_fyPOg7-k-uJcI6DE_37jegyW"/>
</div>
<h4 class="font-headline text-xl text-primary">Jorge Luis Borges</h4>
<p class="text-accent-gold font-label text-[10px] uppercase tracking-wider mt-2 font-bold px-2">The Architect of Labyrinths. Expert at turning a footnote into a universe.</p>
</div>
<!-- Pizarnik -->
<div class="text-center group">
<div class="w-32 h-32 mx-auto rounded-full overflow-hidden mb-6 bg-surface-container-high ring-4 ring-accent-gold/10">
<img alt="Alejandra Pizarnik" class="w-full h-full object-cover grayscale group-hover:grayscale-0 transition-all duration-500" src="https://lh3.googleusercontent.com/aida/ADBb0ug9lGyS5AKikFdTlzxifTJ9F7qbfrTXTI_JyG_QrD-iLATsAGpiF2pQ0RAKGYiVB5ydZiDjEj6ydUPalloLyjBqiA6KCcxCXpHXKe3NkFKGYuBVz_GlwDRLSSuVPoyc1pDOk5k74_V1vQPqZopZYDQUbEYY4lIif9jDrJqK7Uhd-EV5Qv9FGaqhavjNDp1Lm7ORdSMKVwZVlYnYeRRyIT_1RlACKJUt_2WRR1VRz-nIzBl8zvtMZgYxm7TYTZA65KaPDSmJDgO0kw"/>
</div>
<h4 class="font-headline text-xl text-primary">Alejandra Pizarnik</h4>
<p class="text-accent-gold font-label text-[10px] uppercase tracking-wider mt-2 font-bold px-2">Lyrical Precisionist. Can break your heart with three words and a comma.</p>
</div>
<!-- Gombrowicz -->
<div class="text-center group">
<div class="w-32 h-32 mx-auto rounded-full overflow-hidden mb-6 bg-surface-container-high ring-4 ring-accent-gold/10">
<img alt="Witold Gombrowicz" class="w-full h-full object-cover grayscale group-hover:grayscale-0 transition-all duration-500" src="https://lh3.googleusercontent.com/aida/ADBb0uhbcHDooqFBjrI_3GctNyGn7kOMx6Zmm6b95fhUvJU2q_jACoXw-tSCsKKZY7xYd1c7vBwZTjK6uooUZnWMVtlOIYzOWSlmdR8rcq5dMB-1g9xiMzCMHkzOUX9ox8m7q7pxYUsjCh6jsPojtajPRZL6aEudhZxyVmj8pt9gYOlipckFiy05Ndi8hn5FH0molrR4Ik4Kbc0CAOgtzY7f-J5CLoarLcPZkM4j_focyn3bEEQLOlIa7_ceFAWhzZ7mUPKF3c6PB181Aw"/>
</div>
<h4 class="font-headline text-xl text-primary">Witold Gombrowicz</h4>
<p class="text-accent-gold font-label text-[10px] uppercase tracking-wider mt-2 font-bold px-2">Immaturity Consultant. Specialist in subverting the 'Serious Author' pose.</p>
</div>
</div>
</div>
</section>
<!-- FAQ Section -->
<section class="py-24 px-8 bg-surface-container-low">
<div class="max-w-3xl mx-auto">
<h2 class="font-headline text-4xl text-center mb-12 text-primary">Frequently Asked Questions</h2>
<div class="space-y-4">
<details class="group bg-surface-container-lowest p-6 rounded-lg transition-all" open="">
<summary class="list-none cursor-pointer flex justify-between items-center font-headline text-xl text-primary">
What if I don't have a solid idea yet?
<span aria-hidden="true" class="material-symbols-outlined transition-transform group-open:rotate-180 text-accent-gold">expand_more</span>
</summary>
<p class="mt-4 text-on-surface-variant leading-relaxed">The entire first month is dedicated to mining your experiences and identifying a powerful narrative spark. We help you find the story only you can tell.</p>
</details>
<details class="group bg-surface-container-lowest p-6 rounded-lg transition-all">
<summary class="list-none cursor-pointer flex justify-between items-center font-headline text-xl text-primary">
How does the Telegram bot work?
<span aria-hidden="true" class="material-symbols-outlined transition-transform group-open:rotate-180 text-accent-gold">expand_more</span>
</summary>
<p class="mt-4 text-on-surface-variant leading-relaxed">The bot acts as a digital version of our editorial methodology. It prompts your daily writing, tracks your progress, and answers technical questions instantly to maintain your momentum.</p>
</details>
<details class="group bg-surface-container-lowest p-6 rounded-lg transition-all">
<summary class="list-none cursor-pointer flex justify-between items-center font-headline text-xl text-primary">
Is there a publication guarantee?
<span aria-hidden="true" class="material-symbols-outlined transition-transform group-open:rotate-180 text-accent-gold">expand_more</span>
</summary>
<p class="mt-4 text-on-surface-variant leading-relaxed">We provide the professional-grade editing and structural guidance required to make your book viable. While we aren't a publisher, our goal is to deliver a manuscript ready for the industry.</p>
</details>
</div>
</div>
</section>
<!-- Final CTA -->
<section class="py-24 px-8 text-center overflow-hidden relative" id="pricing">
<div class="max-w-4xl mx-auto relative z-10">
<h2 class="font-headline text-5xl lg:text-6xl text-primary mb-6">Begin your journey today.</h2>
<div class="mb-8">
<p class="text-2xl font-headline text-accent-gold font-bold">$10 USD per month</p>
<div class="mt-4 inline-flex items-center gap-2 accent-gradient text-on-primary px-6 py-2 rounded-full text-base font-bold uppercase tracking-wider shadow-lg shadow-accent-gold/30 animate-pulse">
<span class="material-symbols-outlined text-lg">celebration</span>
Try your first month for free!
</div>
</div>
<p class="text-xl text-on-surface-variant mb-12 italic">"A book is a heart that only beats in the chest of another."</p>
<div class="inline-flex flex-col sm:flex-row gap-6">
<div class="min-w-[200px]" id="paypal-button-container-P-50R77243A0991594PNHL6HUY"></div><script data-sdk-integration-source="button-factory" src="https://www.paypal.com/sdk/js?client-id=AUk0eYASIo5avEsxNjsdczwno_gqWvDXvZGbks86AvFe6ejsEOkjgEK7GN5P0JONKQWq43u4K5zxVXa_&vault=true&intent=subscription"></script><script>
paypal.Buttons({
style: {
shape: 'pill',
color: 'gold',
layout: 'vertical',
label: 'subscribe'
},
createSubscription: function(data, actions) {
return actions.subscription.create({
plan_id: 'P-50R77243A0991594PNHL6HUY'
});
},
onApprove: function(data, actions) {
alert(data.subscriptionID);
}
}).render('#paypal-button-container-P-50R77243A0991594PNHL6HUY');
</script>
<a class="bg-surface-container-highest text-primary px-12 py-5 rounded-lg font-label text-lg hover:bg-surface-container-high transition-all" href="https://wa.me/54926117058614">Consult via WhatsApp</a>
</div>
</div>
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] opacity-5 -z-0">
<img alt="Abstract artistic ink wash design" class="w-full h-full object-contain" src="https://lh3.googleusercontent.com/aida-public/AB6AXuDRLWqWjVAYeSFN6i-2lN4cJaPnqeoqlsL2kuZFUTBqY4eDSkdR8xQhIuz3XnMO66oAMrQG-Qqlo9l_kulu2Y36Gkq3aPLcxS8KOgl6iHN2A1eAOw_pO2_sQjAX0uOFH83HDChrP7so2RrcRK83Y3Rre_zrUO48F7YVsCEc5PK3eWJLvR6RlUf9ifFkbzoMq_WezixPLABKYcRhJVwlFnMF__-GFiZLXMdVZQRjleIuKz2Y0CjAvpyu9PyeBQzd7IdOCiXYuZeg2ko"/>
</div>
</section>
</main>
<!-- Footer -->
<footer class="w-full py-12 px-8 bg-surface-container-high border-t-0">
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 items-start max-w-7xl mx-auto">
<div>
<div class="mb-4">
<img alt="Incubook Editorial Workshop Logo" class="h-10 w-auto object-contain mb-4" src="https://lh3.googleusercontent.com/aida/ADBb0ugcEZtaTDvsUFUU0v9JnioMM7TG5k4_LLJrMOhjHACqZ6Kj1FX9uVJGvSHCQc-c31XCNIuEcgd3yuVooM1gfSVVXTuWgjYC5RppRtO6IeZYdsoXabytZobWcZJ5CBmKzZqBNzeHrqGnkcQO63L1jdauXI-qGVYCP78WLtfxt6ASBxZIpNX5VKL5K7eOK9oRBEPX_DxU0KujuJUN7fFmYKALQU-ktx_D6gHwTWmqfv2uTJvNgn5NvptBgP0XYMw2TDyBrmc2xHhv0A"/>
</div>
<p class="font-sans text-xs uppercase tracking-widest text-primary opacity-70">
© 2024 The Scholarly Workshop. All rights reserved.
</p>
</div>
<div class="grid grid-cols-2 gap-4">
<a class="font-sans text-xs uppercase tracking-widest opacity-70 hover:opacity-100 hover:text-accent-gold transition-all" href="#">Privacy Policy</a>
<a class="font-sans text-xs uppercase tracking-widest opacity-70 hover:opacity-100 hover:text-accent-gold transition-all" href="#">Terms of Service</a>
<a class="font-sans text-xs uppercase tracking-widest opacity-70 hover:opacity-100 hover:text-accent-gold transition-all" href="https://wa.me/54926117058614">WhatsApp Support</a>
<a class="font-sans text-xs uppercase tracking-widest opacity-70 hover:opacity-100 hover:text-accent-gold transition-all" href="#">Contact Us</a>
</div>
<div class="md:text-right">
<p class="font-sans text-xs uppercase tracking-widest text-primary mb-4">Connect with us</p>
<div class="flex md:justify-end gap-4">
<a aria-label="Email support" class="text-primary hover:text-accent-gold transition-colors" href="mailto:support@incubook.com">
<span class="material-symbols-outlined">mail</span>
</a>
<a aria-label="Telegram bot" class="text-primary hover:text-accent-gold transition-colors" href="https://t.me/incubookbot">
<span class="material-symbols-outlined">send</span>
</a>
</div>
</div>
</div>
</footer>
</body></html>