C2MV commited on
Commit
0615069
·
verified ·
1 Parent(s): 873ab03

Upload 71 files

Browse files
This view is limited to 50 files because it contains too many changes.   See raw diff
Files changed (50) hide show
  1. .gitattributes +44 -0
  2. index.html +898 -19
  3. presentacion_colegios_biotecnologia_global.html +786 -0
  4. presentacion_colegios_biotecnologia_global.pdf +3 -0
  5. presentacion_colegios_biotecnologia_global.pptx +3 -0
  6. slides/images/biotech_investment_data_2023_2024.png +3 -0
  7. slides/slide01_titulo.html +180 -0
  8. slides/slide01_titulo_quality_check_1750782851.png +3 -0
  9. slides/slide02_resumen.html +266 -0
  10. slides/slide02_resumen_quality_check_1750782925.png +3 -0
  11. slides/slide03_modelo1.html +271 -0
  12. slides/slide03_modelo1_quality_check_1750783001.png +3 -0
  13. slides/slide04_modelo2.html +252 -0
  14. slides/slide04_modelo2_quality_check_1750783078.png +3 -0
  15. slides/slide04_modelo2_quality_check_1750783149.png +3 -0
  16. slides/slide04_modelo2_quality_check_1750783255.png +3 -0
  17. slides/slide05_comparativo.html +293 -0
  18. slides/slide05_comparativo_quality_check_1750783332.png +3 -0
  19. slides/slide05_comparativo_quality_check_1750783400.png +3 -0
  20. slides/slide06_caso_ecuador.html +263 -0
  21. slides/slide06_caso_ecuador_quality_check_1750783496.png +3 -0
  22. slides/slide06_caso_ecuador_quality_check_1750783598.png +3 -0
  23. slides/slide07_ecosistema_academico.html +303 -0
  24. slides/slide07_ecosistema_academico_quality_check_1750783704.png +3 -0
  25. slides/slide08_indicadores.html +327 -0
  26. slides/slide08_indicadores_quality_check_1750783799.png +3 -0
  27. slides/slide08_indicadores_quality_check_1750783888.png +0 -0
  28. slides/slide08_indicadores_quality_check_1750783973.png +3 -0
  29. slides/slide09_brechas_oportunidades.html +367 -0
  30. slides/slide09_brechas_oportunidades_quality_check_1750784077.png +3 -0
  31. slides/slide09_brechas_oportunidades_quality_check_1750784170.png +3 -0
  32. slides/slide10_tendencias.html +362 -0
  33. slides/slide10_tendencias_quality_check_1750784271.png +3 -0
  34. slides/slide10_tendencias_quality_check_1750784385.png +3 -0
  35. slides/slide11_csb_argentina.html +335 -0
  36. slides/slide11_csb_argentina_quality_check_1750784501.png +3 -0
  37. slides/slide12_analisis_cuantitativo.html +225 -0
  38. slides/slide12_analisis_cuantitativo_corregido.html +288 -0
  39. slides/slide12_analisis_cuantitativo_corregido_quality_check_1750786871.png +3 -0
  40. slides/slide12_analisis_cuantitativo_corregido_quality_check_1750786944.png +3 -0
  41. slides/slide12_analisis_cuantitativo_quality_check_1750784617.png +0 -0
  42. slides/slide12_analisis_cuantitativo_quality_check_1750784705.png +3 -0
  43. slides/slide12_analisis_cuantitativo_quality_check_1750784787.png +0 -0
  44. slides/slide12_analisis_cuantitativo_v2.html +350 -0
  45. slides/slide12_analisis_cuantitativo_v2_quality_check_1750784856.png +3 -0
  46. slides/slide12_analisis_cuantitativo_v2_quality_check_1750784935.png +3 -0
  47. slides/slide12_analisis_cuantitativo_v2_quality_check_1750785036.png +3 -0
  48. slides/slide13_correlacion_educacion.html +303 -0
  49. slides/slide13_correlacion_educacion_quality_check_1750785114.png +3 -0
  50. slides/slide14_modelos_comparativos.html +270 -0
.gitattributes CHANGED
@@ -33,3 +33,47 @@ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
33
  *.zip filter=lfs diff=lfs merge=lfs -text
34
  *.zst filter=lfs diff=lfs merge=lfs -text
35
  *tfevents* filter=lfs diff=lfs merge=lfs -text
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
33
  *.zip filter=lfs diff=lfs merge=lfs -text
34
  *.zst filter=lfs diff=lfs merge=lfs -text
35
  *tfevents* filter=lfs diff=lfs merge=lfs -text
36
+ presentacion_colegios_biotecnologia_global.pdf filter=lfs diff=lfs merge=lfs -text
37
+ presentacion_colegios_biotecnologia_global.pptx filter=lfs diff=lfs merge=lfs -text
38
+ slides/images/biotech_investment_data_2023_2024.png filter=lfs diff=lfs merge=lfs -text
39
+ slides/slide01_titulo_quality_check_1750782851.png filter=lfs diff=lfs merge=lfs -text
40
+ slides/slide02_resumen_quality_check_1750782925.png filter=lfs diff=lfs merge=lfs -text
41
+ slides/slide03_modelo1_quality_check_1750783001.png filter=lfs diff=lfs merge=lfs -text
42
+ slides/slide04_modelo2_quality_check_1750783078.png filter=lfs diff=lfs merge=lfs -text
43
+ slides/slide04_modelo2_quality_check_1750783149.png filter=lfs diff=lfs merge=lfs -text
44
+ slides/slide04_modelo2_quality_check_1750783255.png filter=lfs diff=lfs merge=lfs -text
45
+ slides/slide05_comparativo_quality_check_1750783332.png filter=lfs diff=lfs merge=lfs -text
46
+ slides/slide05_comparativo_quality_check_1750783400.png filter=lfs diff=lfs merge=lfs -text
47
+ slides/slide06_caso_ecuador_quality_check_1750783496.png filter=lfs diff=lfs merge=lfs -text
48
+ slides/slide06_caso_ecuador_quality_check_1750783598.png filter=lfs diff=lfs merge=lfs -text
49
+ slides/slide07_ecosistema_academico_quality_check_1750783704.png filter=lfs diff=lfs merge=lfs -text
50
+ slides/slide08_indicadores_quality_check_1750783799.png filter=lfs diff=lfs merge=lfs -text
51
+ slides/slide08_indicadores_quality_check_1750783973.png filter=lfs diff=lfs merge=lfs -text
52
+ slides/slide09_brechas_oportunidades_quality_check_1750784077.png filter=lfs diff=lfs merge=lfs -text
53
+ slides/slide09_brechas_oportunidades_quality_check_1750784170.png filter=lfs diff=lfs merge=lfs -text
54
+ slides/slide10_tendencias_quality_check_1750784271.png filter=lfs diff=lfs merge=lfs -text
55
+ slides/slide10_tendencias_quality_check_1750784385.png filter=lfs diff=lfs merge=lfs -text
56
+ slides/slide11_csb_argentina_quality_check_1750784501.png filter=lfs diff=lfs merge=lfs -text
57
+ slides/slide12_analisis_cuantitativo_corregido_quality_check_1750786871.png filter=lfs diff=lfs merge=lfs -text
58
+ slides/slide12_analisis_cuantitativo_corregido_quality_check_1750786944.png filter=lfs diff=lfs merge=lfs -text
59
+ slides/slide12_analisis_cuantitativo_quality_check_1750784705.png filter=lfs diff=lfs merge=lfs -text
60
+ slides/slide12_analisis_cuantitativo_v2_quality_check_1750784856.png filter=lfs diff=lfs merge=lfs -text
61
+ slides/slide12_analisis_cuantitativo_v2_quality_check_1750784935.png filter=lfs diff=lfs merge=lfs -text
62
+ slides/slide12_analisis_cuantitativo_v2_quality_check_1750785036.png filter=lfs diff=lfs merge=lfs -text
63
+ slides/slide13_correlacion_educacion_quality_check_1750785114.png filter=lfs diff=lfs merge=lfs -text
64
+ slides/slide14_modelos_comparativos_quality_check_1750785221.png filter=lfs diff=lfs merge=lfs -text
65
+ slides/slide14_modelos_comparativos_quality_check_1750785287.png filter=lfs diff=lfs merge=lfs -text
66
+ slides/slide15_america_latina_quality_check_1750785381.png filter=lfs diff=lfs merge=lfs -text
67
+ slides/slide15_america_latina_quality_check_1750785480.png filter=lfs diff=lfs merge=lfs -text
68
+ slides/slide15_america_latina_quality_check_1750785545.png filter=lfs diff=lfs merge=lfs -text
69
+ slides/slide16_casos_estudio_quality_check_1750785680.png filter=lfs diff=lfs merge=lfs -text
70
+ slides/slide16_casos_estudio_quality_check_1750785776.png filter=lfs diff=lfs merge=lfs -text
71
+ slides/slide16_casos_estudio_quality_check_1750785876.png filter=lfs diff=lfs merge=lfs -text
72
+ slides/slide16_casos_estudio_simple_quality_check_1750785950.png filter=lfs diff=lfs merge=lfs -text
73
+ slides/slide17_conclusiones_quality_check_1750786051.png filter=lfs diff=lfs merge=lfs -text
74
+ slides/slide18_bibliografia_quality_check_1750786135.png filter=lfs diff=lfs merge=lfs -text
75
+ slides/slide18_bibliografia_quality_check_1750786200.png filter=lfs diff=lfs merge=lfs -text
76
+ slides/slide18_bibliografia_quality_check_1750786262.png filter=lfs diff=lfs merge=lfs -text
77
+ slides/slide19_agradecimientos_quality_check_1750786359.png filter=lfs diff=lfs merge=lfs -text
78
+ slides/slide19_agradecimientos_quality_check_1750786449.png filter=lfs diff=lfs merge=lfs -text
79
+ slides/slide19_agradecimientos_quality_check_1750786536.png filter=lfs diff=lfs merge=lfs -text
index.html CHANGED
@@ -1,19 +1,898 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>PPT Presentation Viewer</title>
7
+ <style>
8
+ :root {
9
+ --text-color: #111111;
10
+ --secondary-text: #666666;
11
+ --bg-color: #ffffff;
12
+ --light-bg: #f8f8f8;
13
+ --dark-bg: #111111;
14
+ --border-color: #e0e0e0;
15
+ --hover-color: #f0f0f0;
16
+ --active-color: #000000;
17
+ --shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 1px 4px rgba(0, 0, 0, 0.05), 0 2px 8px rgba(0, 0, 0, 0.05);
18
+ --btn-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
19
+ --card-radius: 4px;
20
+ --btn-radius: 4px;
21
+ }
22
+
23
+ * {
24
+ margin: 0;
25
+ padding: 0;
26
+ box-sizing: border-box;
27
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
28
+ }
29
+
30
+ body {
31
+ background-color: var(--light-bg);
32
+ color: var(--text-color);
33
+ line-height: 1.5;
34
+ -webkit-font-smoothing: antialiased;
35
+ }
36
+
37
+ .container {
38
+ max-width: 1800px;
39
+ margin: 0 auto;
40
+ padding: 24px;
41
+ }
42
+
43
+ header {
44
+ display: flex;
45
+ justify-content: space-between;
46
+ align-items: center;
47
+ padding: 16px 24px;
48
+ background-color: var(--dark-bg);
49
+ color: white;
50
+ margin-bottom: 32px;
51
+ box-shadow: var(--shadow);
52
+ }
53
+
54
+ header h1 {
55
+ font-size: 18px;
56
+ font-weight: 500;
57
+ letter-spacing: 0.2px;
58
+ display: flex;
59
+ align-items: center;
60
+ }
61
+
62
+ header h1 svg {
63
+ margin-right: 12px;
64
+ }
65
+
66
+ .controls {
67
+ display: flex;
68
+ gap: 16px;
69
+ align-items: center;
70
+ }
71
+
72
+ .view-controls {
73
+ display: flex;
74
+ background: rgba(255, 255, 255, 0.1);
75
+ border-radius: var(--btn-radius);
76
+ overflow: hidden;
77
+ }
78
+
79
+ .view-controls button {
80
+ background: none;
81
+ color: white;
82
+ border: none;
83
+ padding: 6px 12px;
84
+ cursor: pointer;
85
+ font-size: 13px;
86
+ font-weight: 500;
87
+ transition: all 0.2s ease;
88
+ }
89
+
90
+ .view-controls button.active {
91
+ background: rgba(255, 255, 255, 0.2);
92
+ }
93
+
94
+ .play-button {
95
+ background-color: white;
96
+ color: var(--dark-bg);
97
+ border: none;
98
+ padding: 8px 16px;
99
+ border-radius: var(--btn-radius);
100
+ cursor: pointer;
101
+ display: flex;
102
+ align-items: center;
103
+ transition: all 0.2s ease;
104
+ font-weight: 500;
105
+ font-size: 13px;
106
+ box-shadow: var(--btn-shadow);
107
+ }
108
+
109
+ .play-button:hover {
110
+ background-color: var(--hover-color);
111
+ transform: translateY(-1px);
112
+ }
113
+
114
+ .play-button svg {
115
+ margin-right: 8px;
116
+ }
117
+
118
+ /* Grid View */
119
+ .preview-container {
120
+ display: grid;
121
+ grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));
122
+ gap: 24px;
123
+ margin-top: 24px;
124
+ }
125
+
126
+ /* Grid mode specific styles */
127
+ .preview-container:not(.list-view) .slide-frame-container {
128
+ position: relative;
129
+ padding-top: 56.25%; /* 16:9 Aspect Ratio */
130
+ width: 100%;
131
+ overflow: hidden;
132
+ }
133
+
134
+ .preview-container:not(.list-view) .slide-frame {
135
+ position: absolute;
136
+ top: 50%;
137
+ left: 50%;
138
+ width: 1280px;
139
+ height: 720px;
140
+ border: none;
141
+ transform-origin: center center;
142
+ transform: translate(-50%, -50%) scale(1);
143
+ }
144
+
145
+ /* List View */
146
+ .preview-container.list-view {
147
+ display: flex;
148
+ flex-direction: column;
149
+ gap: 32px;
150
+ align-items: center;
151
+ }
152
+
153
+ .preview-container.list-view .slide-preview {
154
+ width: 1280px;
155
+ height: 720px;
156
+ max-width: 90vw;
157
+ }
158
+
159
+ .preview-container.list-view .slide-frame-container {
160
+ width: 100%;
161
+ height: 100%;
162
+ position: relative;
163
+ padding-top: 0;
164
+ }
165
+
166
+ .preview-container.list-view .slide-frame {
167
+ position: absolute;
168
+ top: 0;
169
+ left: 0;
170
+ width: 100%;
171
+ height: 100%;
172
+ border: none;
173
+ }
174
+
175
+ .slide-preview {
176
+ background: var(--bg-color);
177
+ border-radius: var(--card-radius);
178
+ overflow: hidden;
179
+ box-shadow: var(--shadow);
180
+ transition: transform 0.2s ease, box-shadow 0.2s ease;
181
+ cursor: pointer;
182
+ position: relative;
183
+ border: 1px solid var(--border-color);
184
+ }
185
+
186
+ .slide-preview:hover {
187
+ transform: translateY(-2px);
188
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
189
+ }
190
+
191
+ .slide-preview.active {
192
+ border: 1px solid var(--active-color);
193
+ }
194
+
195
+ .slide-number {
196
+ position: absolute;
197
+ top: 12px;
198
+ left: 12px;
199
+ background-color: rgba(0, 0, 0, 0.7);
200
+ color: white;
201
+ border-radius: 50%;
202
+ width: 28px;
203
+ height: 28px;
204
+ display: flex;
205
+ align-items: center;
206
+ justify-content: center;
207
+ font-size: 12px;
208
+ font-weight: 600;
209
+ z-index: 2;
210
+ }
211
+
212
+ /* Presentation mode */
213
+ .presentation-mode {
214
+ position: fixed;
215
+ top: 0;
216
+ left: 0;
217
+ width: 100%;
218
+ height: 100%;
219
+ background-color: #000;
220
+ z-index: 1000;
221
+ display: none;
222
+ flex-direction: column;
223
+ align-items: center;
224
+ justify-content: center;
225
+ }
226
+
227
+ /* Fullscreen mode adjustments */
228
+ .presentation-mode:fullscreen {
229
+ width: 100vw;
230
+ height: 100vh;
231
+ }
232
+
233
+ .presentation-mode:-webkit-full-screen {
234
+ width: 100vw;
235
+ height: 100vh;
236
+ }
237
+
238
+ .presentation-mode:-moz-full-screen {
239
+ width: 100vw;
240
+ height: 100vh;
241
+ }
242
+
243
+ .presentation-mode:-ms-fullscreen {
244
+ width: 100vw;
245
+ height: 100vh;
246
+ }
247
+
248
+ .presentation-slide {
249
+ width: 1280px;
250
+ height: 720px;
251
+ border: none;
252
+ transform-origin: center center;
253
+ }
254
+
255
+ .presentation-slide-container {
256
+ display: flex;
257
+ align-items: center;
258
+ justify-content: center;
259
+ flex: 1;
260
+ width: 100%;
261
+ padding: 20px;
262
+ }
263
+
264
+ .presentation-controls {
265
+ height: 48px;
266
+ background-color: rgba(0, 0, 0, 0.9);
267
+ display: flex;
268
+ justify-content: center;
269
+ align-items: center;
270
+ gap: 24px;
271
+ padding: 0 24px;
272
+ position: relative;
273
+ z-index: 1001;
274
+ }
275
+
276
+ .presentation-controls.fullscreen {
277
+ position: fixed;
278
+ bottom: 0;
279
+ left: 0;
280
+ right: 0;
281
+ opacity: 0;
282
+ transition: opacity 0.3s ease;
283
+ }
284
+
285
+ .presentation-controls.fullscreen:hover,
286
+ .presentation-controls.fullscreen.show {
287
+ opacity: 1;
288
+ }
289
+
290
+ .progress-bar {
291
+ flex: 1;
292
+ max-width: 400px;
293
+ height: 2px;
294
+ background-color: rgba(255, 255, 255, 0.2);
295
+ border-radius: 1px;
296
+ overflow: hidden;
297
+ position: relative;
298
+ }
299
+
300
+ .progress-fill {
301
+ height: 100%;
302
+ background-color: white;
303
+ width: 0%;
304
+ transition: width 0.3s ease;
305
+ }
306
+
307
+ .slide-indicators {
308
+ color: white;
309
+ font-size: 12px;
310
+ min-width: 40px;
311
+ text-align: center;
312
+ }
313
+
314
+ .presentation-controls button {
315
+ background-color: transparent;
316
+ color: white;
317
+ border: none;
318
+ width: 32px;
319
+ height: 32px;
320
+ border-radius: 50%;
321
+ display: flex;
322
+ align-items: center;
323
+ justify-content: center;
324
+ cursor: pointer;
325
+ transition: background-color 0.2s ease;
326
+ }
327
+
328
+ .presentation-controls button:hover {
329
+ background-color: rgba(255, 255, 255, 0.1);
330
+ }
331
+
332
+ /* Responsive adjustments */
333
+ @media (max-width: 1200px) {
334
+ .preview-container:not(.list-view) {
335
+ grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
336
+ }
337
+ }
338
+
339
+ @media (max-width: 900px) {
340
+ .preview-container:not(.list-view) {
341
+ grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
342
+ }
343
+ }
344
+
345
+ @media (max-width: 640px) {
346
+ .container {
347
+ padding: 16px;
348
+ }
349
+
350
+ .preview-container:not(.list-view) {
351
+ grid-template-columns: 1fr;
352
+ gap: 16px;
353
+ }
354
+
355
+ header {
356
+ flex-direction: column;
357
+ align-items: flex-start;
358
+ gap: 16px;
359
+ padding: 16px;
360
+ }
361
+
362
+ .controls {
363
+ width: 100%;
364
+ justify-content: space-between;
365
+ }
366
+ }
367
+ </style>
368
+ </head>
369
+ <body>
370
+ <div class="container">
371
+ <header>
372
+ <h1>
373
+ Presentation Viewer
374
+ </h1>
375
+ <div class="controls">
376
+ <div class="view-controls">
377
+ <button id="grid-view-btn">Grid</button>
378
+ <button id="list-view-btn" class="active">List</button>
379
+ </div>
380
+ <button id="play-button" class="play-button">
381
+ <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
382
+ <polygon points="5 3 19 12 5 21 5 3"></polygon>
383
+ </svg>
384
+ Play Slides
385
+ </button>
386
+ </div>
387
+ </header>
388
+
389
+ <div class="preview-container list-view" id="preview-container">
390
+ <!-- Slide previews will be dynamically inserted here -->
391
+ </div>
392
+ </div>
393
+
394
+ <div class="presentation-mode" id="presentation-mode">
395
+ <div class="presentation-slide-container">
396
+ <iframe id="presentation-slide" class="presentation-slide" src="" frameborder="0"></iframe>
397
+ </div>
398
+ <div class="presentation-controls">
399
+ <button id="prev-slide">
400
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
401
+ <line x1="19" y1="12" x2="5" y2="12"></line>
402
+ <polyline points="12 19 5 12 12 5"></polyline>
403
+ </svg>
404
+ </button>
405
+ <div class="progress-bar">
406
+ <div class="progress-fill" id="progress-fill"></div>
407
+ </div>
408
+ <div class="slide-indicators">
409
+ <span id="current-slide">1</span>/<span id="total-slides">0</span>
410
+ </div>
411
+ <button id="next-slide">
412
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
413
+ <line x1="5" y1="12" x2="19" y2="12"></line>
414
+ <polyline points="12 5 19 12 12 19"></polyline>
415
+ </svg>
416
+ </button>
417
+ <button id="fullscreen-toggle" title="Toggle Fullscreen">
418
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
419
+ <path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"></path>
420
+ </svg>
421
+ </button>
422
+ <button id="exit-presentation">
423
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
424
+ <rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
425
+ <line x1="9" y1="9" x2="15" y2="15"></line>
426
+ <line x1="15" y1="9" x2="9" y2="15"></line>
427
+ </svg>
428
+ </button>
429
+ </div>
430
+ </div>
431
+
432
+ <script>
433
+ // Load the slides data
434
+ const slides = ["slides/slide01_titulo.html", "slides/slide02_resumen.html", "slides/slide03_modelo1.html", "slides/slide04_modelo2.html", "slides/slide05_comparativo.html", "slides/slide06_caso_ecuador.html", "slides/slide07_ecosistema_academico.html", "slides/slide08_indicadores.html", "slides/slide09_brechas_oportunidades.html", "slides/slide10_tendencias.html", "slides/slide11_csb_argentina.html", "slides/slide12_analisis_cuantitativo_v2.html", "slides/slide13_correlacion_educacion.html", "slides/slide14_modelos_comparativos.html", "slides/slide15_america_latina.html", "slides/slide16_casos_estudio_simple.html", "slides/slide17_conclusiones.html", "slides/slide18_bibliografia.html", "slides/slide19_agradecimientos.html"];
435
+ let currentSlideIndex = 0;
436
+ let viewMode = 'list'; // 'grid' or 'list'
437
+
438
+ // DOM elements
439
+ const previewContainer = document.getElementById('preview-container');
440
+ const presentationMode = document.getElementById('presentation-mode');
441
+ const presentationSlide = document.getElementById('presentation-slide');
442
+ const playButton = document.getElementById('play-button');
443
+ const prevButton = document.getElementById('prev-slide');
444
+ const nextButton = document.getElementById('next-slide');
445
+ const exitButton = document.getElementById('exit-presentation');
446
+ const fullscreenToggle = document.getElementById('fullscreen-toggle');
447
+ const presentationControls = document.querySelector('.presentation-controls');
448
+ const progressFill = document.getElementById('progress-fill');
449
+ const currentSlideElement = document.getElementById('current-slide');
450
+ const totalSlidesElement = document.getElementById('total-slides');
451
+ const gridViewBtn = document.getElementById('grid-view-btn');
452
+ const listViewBtn = document.getElementById('list-view-btn');
453
+
454
+ // Fullscreen state
455
+ let isFullscreen = false;
456
+ let controlsTimeout;
457
+
458
+ // Initialize the viewer
459
+ function initViewer() {
460
+ // Set total slides
461
+ totalSlidesElement.textContent = slides.length;
462
+
463
+ // Generate slide previews
464
+ generatePreviews();
465
+
466
+ // Set up view mode buttons
467
+ gridViewBtn.addEventListener('click', () => setViewMode('grid'));
468
+ listViewBtn.addEventListener('click', () => setViewMode('list'));
469
+ }
470
+
471
+ // Generate slide previews
472
+ function generatePreviews() {
473
+ previewContainer.innerHTML = '';
474
+
475
+ slides.forEach((slide, index) => {
476
+ const slidePreview = document.createElement('div');
477
+ slidePreview.className = 'slide-preview';
478
+ if (index === currentSlideIndex) {
479
+ slidePreview.classList.add('active');
480
+ }
481
+
482
+ slidePreview.innerHTML = `
483
+ <div class="slide-number">${index + 1}</div>
484
+ <div class="slide-frame-container">
485
+ <iframe class="slide-frame" src="${slide}" frameborder="0"></iframe>
486
+ </div>
487
+ `;
488
+
489
+ slidePreview.addEventListener('click', () => {
490
+ startPresentation(index);
491
+ });
492
+
493
+ previewContainer.appendChild(slidePreview);
494
+ });
495
+
496
+ // Scale grid previews after generating
497
+ if (viewMode === 'grid') {
498
+ setTimeout(scaleGridPreviews, 100);
499
+ }
500
+ }
501
+
502
+ // Set view mode (grid or list)
503
+ function setViewMode(mode) {
504
+ viewMode = mode;
505
+
506
+ if (mode === 'grid') {
507
+ previewContainer.classList.remove('list-view');
508
+ gridViewBtn.classList.add('active');
509
+ listViewBtn.classList.remove('active');
510
+
511
+ // Scale grid previews after mode change
512
+ setTimeout(scaleGridPreviews, 100);
513
+ } else {
514
+ previewContainer.classList.add('list-view');
515
+ gridViewBtn.classList.remove('active');
516
+ listViewBtn.classList.add('active');
517
+
518
+ // Reset all iframe transforms for list mode
519
+ resetListPreviews();
520
+ }
521
+ }
522
+
523
+ // Reset transforms for list mode
524
+ function resetListPreviews() {
525
+ const slideFrames = document.querySelectorAll('.slide-frame');
526
+ slideFrames.forEach(frame => {
527
+ frame.style.transform = '';
528
+ });
529
+ }
530
+
531
+ // Scale grid mode previews
532
+ function scaleGridPreviews() {
533
+ if (viewMode !== 'grid') return;
534
+
535
+ const slideFrames = document.querySelectorAll('.preview-container:not(.list-view) .slide-frame');
536
+ slideFrames.forEach(frame => {
537
+ const container = frame.closest('.slide-frame-container');
538
+ if (!container) return;
539
+
540
+ const containerWidth = container.clientWidth;
541
+ const containerHeight = container.clientHeight;
542
+
543
+ // Calculate scale to fit 1280x720 within container
544
+ const scaleX = containerWidth / 1280;
545
+ const scaleY = containerHeight / 720;
546
+ const scale = Math.min(scaleX, scaleY);
547
+
548
+ frame.style.transform = `translate(-50%, -50%) scale(${scale})`;
549
+ });
550
+ }
551
+
552
+ // Start presentation mode
553
+ function startPresentation(index = 0) {
554
+ currentSlideIndex = index;
555
+ presentationMode.style.display = 'flex';
556
+ document.body.style.overflow = 'hidden';
557
+ updateSlide();
558
+
559
+ // Auto-enter fullscreen
560
+ requestFullscreen();
561
+ }
562
+
563
+ // Request fullscreen
564
+ function requestFullscreen() {
565
+ const element = presentationMode;
566
+
567
+ if (element.requestFullscreen) {
568
+ element.requestFullscreen();
569
+ } else if (element.webkitRequestFullscreen) {
570
+ element.webkitRequestFullscreen();
571
+ } else if (element.mozRequestFullScreen) {
572
+ element.mozRequestFullScreen();
573
+ } else if (element.msRequestFullscreen) {
574
+ element.msRequestFullscreen();
575
+ }
576
+ }
577
+
578
+ // Exit fullscreen
579
+ function exitFullscreen() {
580
+ if (document.exitFullscreen) {
581
+ document.exitFullscreen();
582
+ } else if (document.webkitExitFullscreen) {
583
+ document.webkitExitFullscreen();
584
+ } else if (document.mozCancelFullScreen) {
585
+ document.mozCancelFullScreen();
586
+ } else if (document.msExitFullscreen) {
587
+ document.msExitFullscreen();
588
+ }
589
+ }
590
+
591
+ // Toggle fullscreen
592
+ function toggleFullscreen() {
593
+ if (isFullscreen) {
594
+ exitFullscreen();
595
+ } else {
596
+ requestFullscreen();
597
+ }
598
+ }
599
+
600
+ // Handle fullscreen change
601
+ function handleFullscreenChange() {
602
+ isFullscreen = !!(document.fullscreenElement ||
603
+ document.webkitFullscreenElement ||
604
+ document.mozFullScreenElement ||
605
+ document.msFullscreenElement);
606
+
607
+ if (isFullscreen) {
608
+ presentationControls.classList.add('fullscreen');
609
+ setupControlsAutoHide();
610
+ } else {
611
+ presentationControls.classList.remove('fullscreen');
612
+ clearTimeout(controlsTimeout);
613
+ }
614
+
615
+ // Re-scale slide when fullscreen changes
616
+ setTimeout(scalePresentationSlide, 100);
617
+ }
618
+
619
+ // Setup auto-hide controls in fullscreen
620
+ function setupControlsAutoHide() {
621
+ if (!isFullscreen) return;
622
+
623
+ // Show controls initially
624
+ presentationControls.classList.add('show');
625
+
626
+ // Auto-hide after 3 seconds
627
+ controlsTimeout = setTimeout(() => {
628
+ if (isFullscreen) {
629
+ presentationControls.classList.remove('show');
630
+ }
631
+ }, 3000);
632
+ }
633
+
634
+ // Show controls temporarily
635
+ function showControlsTemporarily() {
636
+ if (!isFullscreen) return;
637
+
638
+ presentationControls.classList.add('show');
639
+ clearTimeout(controlsTimeout);
640
+
641
+ controlsTimeout = setTimeout(() => {
642
+ if (isFullscreen) {
643
+ presentationControls.classList.remove('show');
644
+ }
645
+ }, 3000);
646
+ }
647
+
648
+ // Exit presentation mode
649
+ function exitPresentation() {
650
+ // Exit fullscreen if in fullscreen mode
651
+ if (isFullscreen) {
652
+ exitFullscreen();
653
+ }
654
+
655
+ presentationMode.style.display = 'none';
656
+ document.body.style.overflow = 'auto';
657
+ }
658
+
659
+ // Update current slide
660
+ function updateSlide() {
661
+ presentationSlide.src = slides[currentSlideIndex];
662
+ currentSlideElement.textContent = currentSlideIndex + 1;
663
+
664
+ // Update progress bar
665
+ const progress = ((currentSlideIndex + 1) / slides.length) * 100;
666
+ progressFill.style.width = `${progress}%`;
667
+
668
+ // Scale presentation slide to fit container
669
+ scalePresentationSlide();
670
+
671
+ // Update preview highlighting
672
+ document.querySelectorAll('.slide-preview').forEach((preview, index) => {
673
+ if (index === currentSlideIndex) {
674
+ preview.classList.add('active');
675
+ } else {
676
+ preview.classList.remove('active');
677
+ }
678
+ });
679
+ }
680
+
681
+ // Scale presentation slide to fit container
682
+ function scalePresentationSlide() {
683
+ const container = document.querySelector('.presentation-slide-container');
684
+ const containerWidth = container.clientWidth - 40; // Account for padding
685
+ const containerHeight = container.clientHeight - 40;
686
+
687
+ // In fullscreen mode, use full viewport dimensions
688
+ if (isFullscreen) {
689
+ const viewportWidth = window.innerWidth;
690
+ const viewportHeight = window.innerHeight - 48; // Account for controls height
691
+
692
+ const scaleX = viewportWidth / 1280;
693
+ const scaleY = viewportHeight / 720;
694
+ const scale = Math.min(scaleX, scaleY);
695
+
696
+ presentationSlide.style.transform = `scale(${scale})`;
697
+ } else {
698
+ // Calculate scale based on container size and slide dimensions (1280x720)
699
+ const scaleX = containerWidth / 1280;
700
+ const scaleY = containerHeight / 720;
701
+ const scale = Math.min(scaleX, scaleY);
702
+
703
+ presentationSlide.style.transform = `scale(${scale})`;
704
+ }
705
+ }
706
+
707
+ // Go to next slide
708
+ function nextSlide() {
709
+ if (currentSlideIndex < slides.length - 1) {
710
+ currentSlideIndex++;
711
+ updateSlide();
712
+ }
713
+ }
714
+
715
+ // Go to previous slide
716
+ function prevSlide() {
717
+ if (currentSlideIndex > 0) {
718
+ currentSlideIndex--;
719
+ updateSlide();
720
+ }
721
+ }
722
+
723
+ // Event listeners
724
+ playButton.addEventListener('click', () => startPresentation(0));
725
+ prevButton.addEventListener('click', () => {
726
+ prevSlide();
727
+ showControlsTemporarily();
728
+ });
729
+ nextButton.addEventListener('click', () => {
730
+ nextSlide();
731
+ showControlsTemporarily();
732
+ });
733
+ exitButton.addEventListener('click', exitPresentation);
734
+ fullscreenToggle.addEventListener('click', () => {
735
+ toggleFullscreen();
736
+ showControlsTemporarily();
737
+ });
738
+
739
+ // Fullscreen change listeners
740
+ document.addEventListener('fullscreenchange', handleFullscreenChange);
741
+ document.addEventListener('webkitfullscreenchange', handleFullscreenChange);
742
+ document.addEventListener('mozfullscreenchange', handleFullscreenChange);
743
+ document.addEventListener('MSFullscreenChange', handleFullscreenChange);
744
+
745
+ // Mouse movement in fullscreen mode
746
+ presentationMode.addEventListener('mousemove', showControlsTemporarily);
747
+
748
+ // Keyboard navigation
749
+ document.addEventListener('keydown', (e) => {
750
+ if (presentationMode.style.display === 'flex') {
751
+ if (e.key === 'ArrowRight' || e.key === ' ' || e.key === 'n') {
752
+ nextSlide();
753
+ showControlsTemporarily();
754
+ } else if (e.key === 'ArrowLeft' || e.key === 'p') {
755
+ prevSlide();
756
+ showControlsTemporarily();
757
+ } else if (e.key === 'Escape') {
758
+ if (isFullscreen) {
759
+ exitFullscreen();
760
+ } else {
761
+ exitPresentation();
762
+ }
763
+ } else if (e.key === 'f' || e.key === 'F') {
764
+ toggleFullscreen();
765
+ showControlsTemporarily();
766
+ }
767
+ }
768
+ });
769
+
770
+ // Initialize the viewer when the page loads
771
+ window.addEventListener('load', initViewer);
772
+
773
+ // Handle window resize for presentation mode scaling
774
+ window.addEventListener('resize', () => {
775
+ if (presentationMode.style.display === 'flex') {
776
+ scalePresentationSlide();
777
+ }
778
+
779
+ // Also scale grid previews on resize
780
+ if (viewMode === 'grid') {
781
+ scaleGridPreviews();
782
+ }
783
+ });
784
+ </script>
785
+
786
+ <style>
787
+ #minimax-floating-ball {
788
+ position: fixed;
789
+ bottom: 20px;
790
+ right: 20px;
791
+ padding: 10px 12px;
792
+ background: #222222;
793
+ border-radius: 12px;
794
+ display: flex;
795
+ align-items: center;
796
+ color: #F8F8F8;
797
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
798
+ z-index: 9999;
799
+ transition: all 0.3s ease;
800
+ overflow: hidden;
801
+ cursor: pointer;
802
+ }
803
+
804
+ #minimax-floating-ball:hover {
805
+ transform: translateY(-2px);
806
+ background: #383838;
807
+ }
808
+
809
+ .minimax-ball-content {
810
+ display: flex;
811
+ align-items: center;
812
+ gap: 8px;
813
+ }
814
+
815
+ .minimax-logo-wave {
816
+ width: 26px;
817
+ height: 22px;
818
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='22' viewBox='0 0 26 22' fill='none'%3E%3Cg clip-path='url(%23clip0_3442_102412)'%3E%3Cpath d='M12.8405 14.6775C12.8405 14.9897 13.0932 15.2424 13.4055 15.2424C13.7178 15.2424 13.9705 14.9897 13.9705 14.6775V2.98254C13.9705 1.88957 13.0809 1 11.9879 1C10.895 1 10.0054 1.88957 10.0054 2.98254V11.566V17.1068C10.0054 17.5773 9.62327 17.9594 9.1528 17.9594C8.68233 17.9594 8.30021 17.5773 8.30021 17.1068V8.04469C8.30021 6.95172 7.41063 6.06215 6.31767 6.06215C5.22471 6.06215 4.33513 6.95172 4.33513 8.04469V11.8855C4.33513 12.3559 3.953 12.7381 3.48254 12.7381C3.01207 12.7381 2.62994 12.3559 2.62994 11.8855V10.4936C2.62994 10.1813 2.37725 9.92861 2.06497 9.92861C1.7527 9.92861 1.5 10.1813 1.5 10.4936V11.8855C1.5 12.9784 2.38957 13.868 3.48254 13.868C4.5755 13.868 5.46508 12.9784 5.46508 11.8855V8.04469C5.46508 7.57422 5.8472 7.19209 6.31767 7.19209C6.78814 7.19209 7.17026 7.57422 7.17026 8.04469V17.1068C7.17026 18.1998 8.05984 19.0894 9.1528 19.0894C10.2458 19.0894 11.1353 18.1998 11.1353 17.1068V2.98254C11.1353 2.51207 11.5175 2.12994 11.9879 2.12994C12.4584 2.12994 12.8405 2.51207 12.8405 2.98254V14.6775Z' fill='%23F8F8F8'/%3E%3Cpath d='M23.3278 6.06215C22.2348 6.06215 21.3452 6.95172 21.3452 8.04469V15.6143C21.3452 16.0847 20.9631 16.4669 20.4926 16.4669C20.0222 16.4669 19.6401 16.0847 19.6401 15.6143V2.98254C19.6401 1.88957 18.7505 1 17.6575 1C16.5645 1 15.675 1.88957 15.675 2.98254V19.0175C15.675 19.4879 15.2928 19.8701 14.8224 19.8701C14.3519 19.8701 13.9698 19.4879 13.9698 19.0175V17.0329C13.9698 16.7206 13.7171 16.4679 13.4048 16.4679C13.0925 16.4679 12.8398 16.7206 12.8398 17.0329V19.0175C12.8398 20.1104 13.7294 21 14.8224 21C15.9153 21 16.8049 20.1104 16.8049 19.0175V2.98254C16.8049 2.51207 17.187 2.12994 17.6575 2.12994C18.128 2.12994 18.5101 2.51207 18.5101 2.98254V15.6143C18.5101 16.7072 19.3997 17.5968 20.4926 17.5968C21.5856 17.5968 22.4752 16.7072 22.4752 15.6143V8.04469C22.4752 7.57422 22.8573 7.19209 23.3278 7.19209C23.7982 7.19209 24.1804 7.57422 24.1804 8.04469V14.6775C24.1804 14.9897 24.4331 15.2424 24.7453 15.2424C25.0576 15.2424 25.3103 14.9897 25.3103 14.6775V8.04469C25.3103 6.95172 24.4207 6.06215 23.3278 6.06215Z' fill='%23F8F8F8'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3442_102412'%3E%3Crect width='25' height='22' fill='white' transform='translate(0.5)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
819
+ background-repeat: no-repeat;
820
+ background-position: center;
821
+ }
822
+
823
+ .minimax-ball-text {
824
+ font-size: 12px;
825
+ font-weight: 500;
826
+ white-space: nowrap;
827
+ }
828
+
829
+ .minimax-close-icon {
830
+ margin-left: 8px;
831
+ font-size: 16px;
832
+ width: 18px;
833
+ height: 18px;
834
+ display: flex;
835
+ align-items: center;
836
+ justify-content: center;
837
+ border-radius: 50%;
838
+ cursor: pointer;
839
+ opacity: 0.7;
840
+ transition: opacity 0.2s ease;
841
+ }
842
+
843
+ .minimax-close-icon:hover {
844
+ opacity: 1;
845
+ }
846
+ </style>
847
+ <div id="minimax-floating-ball">
848
+ <div class="minimax-ball-content">
849
+ <div class="minimax-logo-wave"></div>
850
+ <span class="minimax-ball-text">Created by MiniMax Agent</span>
851
+ </div>
852
+ <div class="minimax-close-icon">×</div>
853
+ </div>
854
+ <script>
855
+ // Initialize floating ball functionality
856
+ function initFloatingBall() {
857
+ const ball = document.getElementById('minimax-floating-ball');
858
+ if (!ball) return;
859
+
860
+ // Initial animation
861
+ ball.style.opacity = '0';
862
+ ball.style.transform = 'translateY(20px)';
863
+
864
+ setTimeout(() => {
865
+ ball.style.opacity = '1';
866
+ ball.style.transform = 'translateY(0)';
867
+ }, 500);
868
+
869
+ // Handle logo click
870
+ const ballContent = ball.querySelector('.minimax-ball-content');
871
+ ballContent.addEventListener('click', function (e) {
872
+ e.stopPropagation();
873
+ window.open('https://agent.minimax.io/agent', '_blank');
874
+ ball.style.transform = 'scale(0.95)';
875
+ setTimeout(() => {
876
+ ball.style.transform = 'scale(1)';
877
+ }, 100);
878
+ });
879
+
880
+ // Handle close button click
881
+ const closeIcon = ball.querySelector('.minimax-close-icon');
882
+ closeIcon.addEventListener('click', function (e) {
883
+ e.stopPropagation();
884
+ ball.style.opacity = '0';
885
+ ball.style.transform = 'translateY(20px)';
886
+
887
+ setTimeout(() => {
888
+ ball.style.display = 'none';
889
+ }, 300);
890
+ });
891
+ }
892
+
893
+ // Initialize when DOM is ready
894
+ document.addEventListener('DOMContentLoaded', initFloatingBall);
895
+ </script>
896
+
897
+ </body>
898
+ </html>
presentacion_colegios_biotecnologia_global.html ADDED
@@ -0,0 +1,786 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>PPT Presentation Viewer</title>
7
+ <style>
8
+ :root {
9
+ --text-color: #111111;
10
+ --secondary-text: #666666;
11
+ --bg-color: #ffffff;
12
+ --light-bg: #f8f8f8;
13
+ --dark-bg: #111111;
14
+ --border-color: #e0e0e0;
15
+ --hover-color: #f0f0f0;
16
+ --active-color: #000000;
17
+ --shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 1px 4px rgba(0, 0, 0, 0.05), 0 2px 8px rgba(0, 0, 0, 0.05);
18
+ --btn-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
19
+ --card-radius: 4px;
20
+ --btn-radius: 4px;
21
+ }
22
+
23
+ * {
24
+ margin: 0;
25
+ padding: 0;
26
+ box-sizing: border-box;
27
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
28
+ }
29
+
30
+ body {
31
+ background-color: var(--light-bg);
32
+ color: var(--text-color);
33
+ line-height: 1.5;
34
+ -webkit-font-smoothing: antialiased;
35
+ }
36
+
37
+ .container {
38
+ max-width: 1800px;
39
+ margin: 0 auto;
40
+ padding: 24px;
41
+ }
42
+
43
+ header {
44
+ display: flex;
45
+ justify-content: space-between;
46
+ align-items: center;
47
+ padding: 16px 24px;
48
+ background-color: var(--dark-bg);
49
+ color: white;
50
+ margin-bottom: 32px;
51
+ box-shadow: var(--shadow);
52
+ }
53
+
54
+ header h1 {
55
+ font-size: 18px;
56
+ font-weight: 500;
57
+ letter-spacing: 0.2px;
58
+ display: flex;
59
+ align-items: center;
60
+ }
61
+
62
+ header h1 svg {
63
+ margin-right: 12px;
64
+ }
65
+
66
+ .controls {
67
+ display: flex;
68
+ gap: 16px;
69
+ align-items: center;
70
+ }
71
+
72
+ .view-controls {
73
+ display: flex;
74
+ background: rgba(255, 255, 255, 0.1);
75
+ border-radius: var(--btn-radius);
76
+ overflow: hidden;
77
+ }
78
+
79
+ .view-controls button {
80
+ background: none;
81
+ color: white;
82
+ border: none;
83
+ padding: 6px 12px;
84
+ cursor: pointer;
85
+ font-size: 13px;
86
+ font-weight: 500;
87
+ transition: all 0.2s ease;
88
+ }
89
+
90
+ .view-controls button.active {
91
+ background: rgba(255, 255, 255, 0.2);
92
+ }
93
+
94
+ .play-button {
95
+ background-color: white;
96
+ color: var(--dark-bg);
97
+ border: none;
98
+ padding: 8px 16px;
99
+ border-radius: var(--btn-radius);
100
+ cursor: pointer;
101
+ display: flex;
102
+ align-items: center;
103
+ transition: all 0.2s ease;
104
+ font-weight: 500;
105
+ font-size: 13px;
106
+ box-shadow: var(--btn-shadow);
107
+ }
108
+
109
+ .play-button:hover {
110
+ background-color: var(--hover-color);
111
+ transform: translateY(-1px);
112
+ }
113
+
114
+ .play-button svg {
115
+ margin-right: 8px;
116
+ }
117
+
118
+ /* Grid View */
119
+ .preview-container {
120
+ display: grid;
121
+ grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));
122
+ gap: 24px;
123
+ margin-top: 24px;
124
+ }
125
+
126
+ /* Grid mode specific styles */
127
+ .preview-container:not(.list-view) .slide-frame-container {
128
+ position: relative;
129
+ padding-top: 56.25%; /* 16:9 Aspect Ratio */
130
+ width: 100%;
131
+ overflow: hidden;
132
+ }
133
+
134
+ .preview-container:not(.list-view) .slide-frame {
135
+ position: absolute;
136
+ top: 50%;
137
+ left: 50%;
138
+ width: 1280px;
139
+ height: 720px;
140
+ border: none;
141
+ transform-origin: center center;
142
+ transform: translate(-50%, -50%) scale(1);
143
+ }
144
+
145
+ /* List View */
146
+ .preview-container.list-view {
147
+ display: flex;
148
+ flex-direction: column;
149
+ gap: 32px;
150
+ align-items: center;
151
+ }
152
+
153
+ .preview-container.list-view .slide-preview {
154
+ width: 1280px;
155
+ height: 720px;
156
+ max-width: 90vw;
157
+ }
158
+
159
+ .preview-container.list-view .slide-frame-container {
160
+ width: 100%;
161
+ height: 100%;
162
+ position: relative;
163
+ padding-top: 0;
164
+ }
165
+
166
+ .preview-container.list-view .slide-frame {
167
+ position: absolute;
168
+ top: 0;
169
+ left: 0;
170
+ width: 100%;
171
+ height: 100%;
172
+ border: none;
173
+ }
174
+
175
+ .slide-preview {
176
+ background: var(--bg-color);
177
+ border-radius: var(--card-radius);
178
+ overflow: hidden;
179
+ box-shadow: var(--shadow);
180
+ transition: transform 0.2s ease, box-shadow 0.2s ease;
181
+ cursor: pointer;
182
+ position: relative;
183
+ border: 1px solid var(--border-color);
184
+ }
185
+
186
+ .slide-preview:hover {
187
+ transform: translateY(-2px);
188
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
189
+ }
190
+
191
+ .slide-preview.active {
192
+ border: 1px solid var(--active-color);
193
+ }
194
+
195
+ .slide-number {
196
+ position: absolute;
197
+ top: 12px;
198
+ left: 12px;
199
+ background-color: rgba(0, 0, 0, 0.7);
200
+ color: white;
201
+ border-radius: 50%;
202
+ width: 28px;
203
+ height: 28px;
204
+ display: flex;
205
+ align-items: center;
206
+ justify-content: center;
207
+ font-size: 12px;
208
+ font-weight: 600;
209
+ z-index: 2;
210
+ }
211
+
212
+ /* Presentation mode */
213
+ .presentation-mode {
214
+ position: fixed;
215
+ top: 0;
216
+ left: 0;
217
+ width: 100%;
218
+ height: 100%;
219
+ background-color: #000;
220
+ z-index: 1000;
221
+ display: none;
222
+ flex-direction: column;
223
+ align-items: center;
224
+ justify-content: center;
225
+ }
226
+
227
+ /* Fullscreen mode adjustments */
228
+ .presentation-mode:fullscreen {
229
+ width: 100vw;
230
+ height: 100vh;
231
+ }
232
+
233
+ .presentation-mode:-webkit-full-screen {
234
+ width: 100vw;
235
+ height: 100vh;
236
+ }
237
+
238
+ .presentation-mode:-moz-full-screen {
239
+ width: 100vw;
240
+ height: 100vh;
241
+ }
242
+
243
+ .presentation-mode:-ms-fullscreen {
244
+ width: 100vw;
245
+ height: 100vh;
246
+ }
247
+
248
+ .presentation-slide {
249
+ width: 1280px;
250
+ height: 720px;
251
+ border: none;
252
+ transform-origin: center center;
253
+ }
254
+
255
+ .presentation-slide-container {
256
+ display: flex;
257
+ align-items: center;
258
+ justify-content: center;
259
+ flex: 1;
260
+ width: 100%;
261
+ padding: 20px;
262
+ }
263
+
264
+ .presentation-controls {
265
+ height: 48px;
266
+ background-color: rgba(0, 0, 0, 0.9);
267
+ display: flex;
268
+ justify-content: center;
269
+ align-items: center;
270
+ gap: 24px;
271
+ padding: 0 24px;
272
+ position: relative;
273
+ z-index: 1001;
274
+ }
275
+
276
+ .presentation-controls.fullscreen {
277
+ position: fixed;
278
+ bottom: 0;
279
+ left: 0;
280
+ right: 0;
281
+ opacity: 0;
282
+ transition: opacity 0.3s ease;
283
+ }
284
+
285
+ .presentation-controls.fullscreen:hover,
286
+ .presentation-controls.fullscreen.show {
287
+ opacity: 1;
288
+ }
289
+
290
+ .progress-bar {
291
+ flex: 1;
292
+ max-width: 400px;
293
+ height: 2px;
294
+ background-color: rgba(255, 255, 255, 0.2);
295
+ border-radius: 1px;
296
+ overflow: hidden;
297
+ position: relative;
298
+ }
299
+
300
+ .progress-fill {
301
+ height: 100%;
302
+ background-color: white;
303
+ width: 0%;
304
+ transition: width 0.3s ease;
305
+ }
306
+
307
+ .slide-indicators {
308
+ color: white;
309
+ font-size: 12px;
310
+ min-width: 40px;
311
+ text-align: center;
312
+ }
313
+
314
+ .presentation-controls button {
315
+ background-color: transparent;
316
+ color: white;
317
+ border: none;
318
+ width: 32px;
319
+ height: 32px;
320
+ border-radius: 50%;
321
+ display: flex;
322
+ align-items: center;
323
+ justify-content: center;
324
+ cursor: pointer;
325
+ transition: background-color 0.2s ease;
326
+ }
327
+
328
+ .presentation-controls button:hover {
329
+ background-color: rgba(255, 255, 255, 0.1);
330
+ }
331
+
332
+ /* Responsive adjustments */
333
+ @media (max-width: 1200px) {
334
+ .preview-container:not(.list-view) {
335
+ grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
336
+ }
337
+ }
338
+
339
+ @media (max-width: 900px) {
340
+ .preview-container:not(.list-view) {
341
+ grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
342
+ }
343
+ }
344
+
345
+ @media (max-width: 640px) {
346
+ .container {
347
+ padding: 16px;
348
+ }
349
+
350
+ .preview-container:not(.list-view) {
351
+ grid-template-columns: 1fr;
352
+ gap: 16px;
353
+ }
354
+
355
+ header {
356
+ flex-direction: column;
357
+ align-items: flex-start;
358
+ gap: 16px;
359
+ padding: 16px;
360
+ }
361
+
362
+ .controls {
363
+ width: 100%;
364
+ justify-content: space-between;
365
+ }
366
+ }
367
+ </style>
368
+ </head>
369
+ <body>
370
+ <div class="container">
371
+ <header>
372
+ <h1>
373
+ Presentation Viewer
374
+ </h1>
375
+ <div class="controls">
376
+ <div class="view-controls">
377
+ <button id="grid-view-btn">Grid</button>
378
+ <button id="list-view-btn" class="active">List</button>
379
+ </div>
380
+ <button id="play-button" class="play-button">
381
+ <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
382
+ <polygon points="5 3 19 12 5 21 5 3"></polygon>
383
+ </svg>
384
+ Play Slides
385
+ </button>
386
+ </div>
387
+ </header>
388
+
389
+ <div class="preview-container list-view" id="preview-container">
390
+ <!-- Slide previews will be dynamically inserted here -->
391
+ </div>
392
+ </div>
393
+
394
+ <div class="presentation-mode" id="presentation-mode">
395
+ <div class="presentation-slide-container">
396
+ <iframe id="presentation-slide" class="presentation-slide" src="" frameborder="0"></iframe>
397
+ </div>
398
+ <div class="presentation-controls">
399
+ <button id="prev-slide">
400
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
401
+ <line x1="19" y1="12" x2="5" y2="12"></line>
402
+ <polyline points="12 19 5 12 12 5"></polyline>
403
+ </svg>
404
+ </button>
405
+ <div class="progress-bar">
406
+ <div class="progress-fill" id="progress-fill"></div>
407
+ </div>
408
+ <div class="slide-indicators">
409
+ <span id="current-slide">1</span>/<span id="total-slides">0</span>
410
+ </div>
411
+ <button id="next-slide">
412
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
413
+ <line x1="5" y1="12" x2="19" y2="12"></line>
414
+ <polyline points="12 5 19 12 12 19"></polyline>
415
+ </svg>
416
+ </button>
417
+ <button id="fullscreen-toggle" title="Toggle Fullscreen">
418
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
419
+ <path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"></path>
420
+ </svg>
421
+ </button>
422
+ <button id="exit-presentation">
423
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
424
+ <rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
425
+ <line x1="9" y1="9" x2="15" y2="15"></line>
426
+ <line x1="15" y1="9" x2="9" y2="15"></line>
427
+ </svg>
428
+ </button>
429
+ </div>
430
+ </div>
431
+
432
+ <script>
433
+ // Load the slides data
434
+ const slides = ["slides/slide01_titulo.html", "slides/slide02_resumen.html", "slides/slide03_modelo1.html", "slides/slide04_modelo2.html", "slides/slide05_comparativo.html", "slides/slide06_caso_ecuador.html", "slides/slide07_ecosistema_academico.html", "slides/slide08_indicadores.html", "slides/slide09_brechas_oportunidades.html", "slides/slide10_tendencias.html", "slides/slide11_csb_argentina.html", "slides/slide12_analisis_cuantitativo_v2.html", "slides/slide13_correlacion_educacion.html", "slides/slide14_modelos_comparativos.html", "slides/slide15_america_latina.html", "slides/slide16_casos_estudio_simple.html", "slides/slide17_conclusiones.html", "slides/slide18_bibliografia.html", "slides/slide19_agradecimientos.html"];
435
+ let currentSlideIndex = 0;
436
+ let viewMode = 'list'; // 'grid' or 'list'
437
+
438
+ // DOM elements
439
+ const previewContainer = document.getElementById('preview-container');
440
+ const presentationMode = document.getElementById('presentation-mode');
441
+ const presentationSlide = document.getElementById('presentation-slide');
442
+ const playButton = document.getElementById('play-button');
443
+ const prevButton = document.getElementById('prev-slide');
444
+ const nextButton = document.getElementById('next-slide');
445
+ const exitButton = document.getElementById('exit-presentation');
446
+ const fullscreenToggle = document.getElementById('fullscreen-toggle');
447
+ const presentationControls = document.querySelector('.presentation-controls');
448
+ const progressFill = document.getElementById('progress-fill');
449
+ const currentSlideElement = document.getElementById('current-slide');
450
+ const totalSlidesElement = document.getElementById('total-slides');
451
+ const gridViewBtn = document.getElementById('grid-view-btn');
452
+ const listViewBtn = document.getElementById('list-view-btn');
453
+
454
+ // Fullscreen state
455
+ let isFullscreen = false;
456
+ let controlsTimeout;
457
+
458
+ // Initialize the viewer
459
+ function initViewer() {
460
+ // Set total slides
461
+ totalSlidesElement.textContent = slides.length;
462
+
463
+ // Generate slide previews
464
+ generatePreviews();
465
+
466
+ // Set up view mode buttons
467
+ gridViewBtn.addEventListener('click', () => setViewMode('grid'));
468
+ listViewBtn.addEventListener('click', () => setViewMode('list'));
469
+ }
470
+
471
+ // Generate slide previews
472
+ function generatePreviews() {
473
+ previewContainer.innerHTML = '';
474
+
475
+ slides.forEach((slide, index) => {
476
+ const slidePreview = document.createElement('div');
477
+ slidePreview.className = 'slide-preview';
478
+ if (index === currentSlideIndex) {
479
+ slidePreview.classList.add('active');
480
+ }
481
+
482
+ slidePreview.innerHTML = `
483
+ <div class="slide-number">${index + 1}</div>
484
+ <div class="slide-frame-container">
485
+ <iframe class="slide-frame" src="${slide}" frameborder="0"></iframe>
486
+ </div>
487
+ `;
488
+
489
+ slidePreview.addEventListener('click', () => {
490
+ startPresentation(index);
491
+ });
492
+
493
+ previewContainer.appendChild(slidePreview);
494
+ });
495
+
496
+ // Scale grid previews after generating
497
+ if (viewMode === 'grid') {
498
+ setTimeout(scaleGridPreviews, 100);
499
+ }
500
+ }
501
+
502
+ // Set view mode (grid or list)
503
+ function setViewMode(mode) {
504
+ viewMode = mode;
505
+
506
+ if (mode === 'grid') {
507
+ previewContainer.classList.remove('list-view');
508
+ gridViewBtn.classList.add('active');
509
+ listViewBtn.classList.remove('active');
510
+
511
+ // Scale grid previews after mode change
512
+ setTimeout(scaleGridPreviews, 100);
513
+ } else {
514
+ previewContainer.classList.add('list-view');
515
+ gridViewBtn.classList.remove('active');
516
+ listViewBtn.classList.add('active');
517
+
518
+ // Reset all iframe transforms for list mode
519
+ resetListPreviews();
520
+ }
521
+ }
522
+
523
+ // Reset transforms for list mode
524
+ function resetListPreviews() {
525
+ const slideFrames = document.querySelectorAll('.slide-frame');
526
+ slideFrames.forEach(frame => {
527
+ frame.style.transform = '';
528
+ });
529
+ }
530
+
531
+ // Scale grid mode previews
532
+ function scaleGridPreviews() {
533
+ if (viewMode !== 'grid') return;
534
+
535
+ const slideFrames = document.querySelectorAll('.preview-container:not(.list-view) .slide-frame');
536
+ slideFrames.forEach(frame => {
537
+ const container = frame.closest('.slide-frame-container');
538
+ if (!container) return;
539
+
540
+ const containerWidth = container.clientWidth;
541
+ const containerHeight = container.clientHeight;
542
+
543
+ // Calculate scale to fit 1280x720 within container
544
+ const scaleX = containerWidth / 1280;
545
+ const scaleY = containerHeight / 720;
546
+ const scale = Math.min(scaleX, scaleY);
547
+
548
+ frame.style.transform = `translate(-50%, -50%) scale(${scale})`;
549
+ });
550
+ }
551
+
552
+ // Start presentation mode
553
+ function startPresentation(index = 0) {
554
+ currentSlideIndex = index;
555
+ presentationMode.style.display = 'flex';
556
+ document.body.style.overflow = 'hidden';
557
+ updateSlide();
558
+
559
+ // Auto-enter fullscreen
560
+ requestFullscreen();
561
+ }
562
+
563
+ // Request fullscreen
564
+ function requestFullscreen() {
565
+ const element = presentationMode;
566
+
567
+ if (element.requestFullscreen) {
568
+ element.requestFullscreen();
569
+ } else if (element.webkitRequestFullscreen) {
570
+ element.webkitRequestFullscreen();
571
+ } else if (element.mozRequestFullScreen) {
572
+ element.mozRequestFullScreen();
573
+ } else if (element.msRequestFullscreen) {
574
+ element.msRequestFullscreen();
575
+ }
576
+ }
577
+
578
+ // Exit fullscreen
579
+ function exitFullscreen() {
580
+ if (document.exitFullscreen) {
581
+ document.exitFullscreen();
582
+ } else if (document.webkitExitFullscreen) {
583
+ document.webkitExitFullscreen();
584
+ } else if (document.mozCancelFullScreen) {
585
+ document.mozCancelFullScreen();
586
+ } else if (document.msExitFullscreen) {
587
+ document.msExitFullscreen();
588
+ }
589
+ }
590
+
591
+ // Toggle fullscreen
592
+ function toggleFullscreen() {
593
+ if (isFullscreen) {
594
+ exitFullscreen();
595
+ } else {
596
+ requestFullscreen();
597
+ }
598
+ }
599
+
600
+ // Handle fullscreen change
601
+ function handleFullscreenChange() {
602
+ isFullscreen = !!(document.fullscreenElement ||
603
+ document.webkitFullscreenElement ||
604
+ document.mozFullScreenElement ||
605
+ document.msFullscreenElement);
606
+
607
+ if (isFullscreen) {
608
+ presentationControls.classList.add('fullscreen');
609
+ setupControlsAutoHide();
610
+ } else {
611
+ presentationControls.classList.remove('fullscreen');
612
+ clearTimeout(controlsTimeout);
613
+ }
614
+
615
+ // Re-scale slide when fullscreen changes
616
+ setTimeout(scalePresentationSlide, 100);
617
+ }
618
+
619
+ // Setup auto-hide controls in fullscreen
620
+ function setupControlsAutoHide() {
621
+ if (!isFullscreen) return;
622
+
623
+ // Show controls initially
624
+ presentationControls.classList.add('show');
625
+
626
+ // Auto-hide after 3 seconds
627
+ controlsTimeout = setTimeout(() => {
628
+ if (isFullscreen) {
629
+ presentationControls.classList.remove('show');
630
+ }
631
+ }, 3000);
632
+ }
633
+
634
+ // Show controls temporarily
635
+ function showControlsTemporarily() {
636
+ if (!isFullscreen) return;
637
+
638
+ presentationControls.classList.add('show');
639
+ clearTimeout(controlsTimeout);
640
+
641
+ controlsTimeout = setTimeout(() => {
642
+ if (isFullscreen) {
643
+ presentationControls.classList.remove('show');
644
+ }
645
+ }, 3000);
646
+ }
647
+
648
+ // Exit presentation mode
649
+ function exitPresentation() {
650
+ // Exit fullscreen if in fullscreen mode
651
+ if (isFullscreen) {
652
+ exitFullscreen();
653
+ }
654
+
655
+ presentationMode.style.display = 'none';
656
+ document.body.style.overflow = 'auto';
657
+ }
658
+
659
+ // Update current slide
660
+ function updateSlide() {
661
+ presentationSlide.src = slides[currentSlideIndex];
662
+ currentSlideElement.textContent = currentSlideIndex + 1;
663
+
664
+ // Update progress bar
665
+ const progress = ((currentSlideIndex + 1) / slides.length) * 100;
666
+ progressFill.style.width = `${progress}%`;
667
+
668
+ // Scale presentation slide to fit container
669
+ scalePresentationSlide();
670
+
671
+ // Update preview highlighting
672
+ document.querySelectorAll('.slide-preview').forEach((preview, index) => {
673
+ if (index === currentSlideIndex) {
674
+ preview.classList.add('active');
675
+ } else {
676
+ preview.classList.remove('active');
677
+ }
678
+ });
679
+ }
680
+
681
+ // Scale presentation slide to fit container
682
+ function scalePresentationSlide() {
683
+ const container = document.querySelector('.presentation-slide-container');
684
+ const containerWidth = container.clientWidth - 40; // Account for padding
685
+ const containerHeight = container.clientHeight - 40;
686
+
687
+ // In fullscreen mode, use full viewport dimensions
688
+ if (isFullscreen) {
689
+ const viewportWidth = window.innerWidth;
690
+ const viewportHeight = window.innerHeight - 48; // Account for controls height
691
+
692
+ const scaleX = viewportWidth / 1280;
693
+ const scaleY = viewportHeight / 720;
694
+ const scale = Math.min(scaleX, scaleY);
695
+
696
+ presentationSlide.style.transform = `scale(${scale})`;
697
+ } else {
698
+ // Calculate scale based on container size and slide dimensions (1280x720)
699
+ const scaleX = containerWidth / 1280;
700
+ const scaleY = containerHeight / 720;
701
+ const scale = Math.min(scaleX, scaleY);
702
+
703
+ presentationSlide.style.transform = `scale(${scale})`;
704
+ }
705
+ }
706
+
707
+ // Go to next slide
708
+ function nextSlide() {
709
+ if (currentSlideIndex < slides.length - 1) {
710
+ currentSlideIndex++;
711
+ updateSlide();
712
+ }
713
+ }
714
+
715
+ // Go to previous slide
716
+ function prevSlide() {
717
+ if (currentSlideIndex > 0) {
718
+ currentSlideIndex--;
719
+ updateSlide();
720
+ }
721
+ }
722
+
723
+ // Event listeners
724
+ playButton.addEventListener('click', () => startPresentation(0));
725
+ prevButton.addEventListener('click', () => {
726
+ prevSlide();
727
+ showControlsTemporarily();
728
+ });
729
+ nextButton.addEventListener('click', () => {
730
+ nextSlide();
731
+ showControlsTemporarily();
732
+ });
733
+ exitButton.addEventListener('click', exitPresentation);
734
+ fullscreenToggle.addEventListener('click', () => {
735
+ toggleFullscreen();
736
+ showControlsTemporarily();
737
+ });
738
+
739
+ // Fullscreen change listeners
740
+ document.addEventListener('fullscreenchange', handleFullscreenChange);
741
+ document.addEventListener('webkitfullscreenchange', handleFullscreenChange);
742
+ document.addEventListener('mozfullscreenchange', handleFullscreenChange);
743
+ document.addEventListener('MSFullscreenChange', handleFullscreenChange);
744
+
745
+ // Mouse movement in fullscreen mode
746
+ presentationMode.addEventListener('mousemove', showControlsTemporarily);
747
+
748
+ // Keyboard navigation
749
+ document.addEventListener('keydown', (e) => {
750
+ if (presentationMode.style.display === 'flex') {
751
+ if (e.key === 'ArrowRight' || e.key === ' ' || e.key === 'n') {
752
+ nextSlide();
753
+ showControlsTemporarily();
754
+ } else if (e.key === 'ArrowLeft' || e.key === 'p') {
755
+ prevSlide();
756
+ showControlsTemporarily();
757
+ } else if (e.key === 'Escape') {
758
+ if (isFullscreen) {
759
+ exitFullscreen();
760
+ } else {
761
+ exitPresentation();
762
+ }
763
+ } else if (e.key === 'f' || e.key === 'F') {
764
+ toggleFullscreen();
765
+ showControlsTemporarily();
766
+ }
767
+ }
768
+ });
769
+
770
+ // Initialize the viewer when the page loads
771
+ window.addEventListener('load', initViewer);
772
+
773
+ // Handle window resize for presentation mode scaling
774
+ window.addEventListener('resize', () => {
775
+ if (presentationMode.style.display === 'flex') {
776
+ scalePresentationSlide();
777
+ }
778
+
779
+ // Also scale grid previews on resize
780
+ if (viewMode === 'grid') {
781
+ scaleGridPreviews();
782
+ }
783
+ });
784
+ </script>
785
+ </body>
786
+ </html>
presentacion_colegios_biotecnologia_global.pdf ADDED
@@ -0,0 +1,3 @@
 
 
 
 
1
+ version https://git-lfs.github.com/spec/v1
2
+ oid sha256:b06442cf7aa40a497588b39c6647581c127e16046732b3b6e7f40abe48c138c3
3
+ size 1654795
presentacion_colegios_biotecnologia_global.pptx ADDED
@@ -0,0 +1,3 @@
 
 
 
 
1
+ version https://git-lfs.github.com/spec/v1
2
+ oid sha256:a30efd9a3e64f72cb7aac3281362316546e2d1dbd028c4eb682d96dc28ed062f
3
+ size 133507
slides/images/biotech_investment_data_2023_2024.png ADDED

Git LFS Details

  • SHA256: 6ab9558d4b2d155867ed10ea43ed3ea41af61bd7395f2880f55f1944cb1da993
  • Pointer size: 131 Bytes
  • Size of remote file: 555 kB
slides/slide01_titulo.html ADDED
@@ -0,0 +1,180 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Análisis Ecosistema Biotecnología</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ display: flex;
14
+ justify-content: center;
15
+ align-items: center;
16
+ height: 100vh;
17
+ background-color: #f0f0f0;
18
+ font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ position: relative;
25
+ overflow: hidden;
26
+ background: linear-gradient(135deg, #1e3c72, #2a5298, #00c9ff);
27
+ color: #ffffff;
28
+ display: flex;
29
+ flex-direction: column;
30
+ justify-content: center;
31
+ align-items: flex-start;
32
+ box-shadow: 0 10px 30px rgba(0,0,0,0.2);
33
+ }
34
+
35
+ .content {
36
+ position: relative;
37
+ z-index: 10;
38
+ padding: 0 80px;
39
+ max-width: 65%;
40
+ animation: fadeInContent 1.5s ease-out forwards;
41
+ }
42
+
43
+ @keyframes fadeInContent {
44
+ from { opacity: 0; transform: translateY(20px); }
45
+ to { opacity: 1; transform: translateY(0); }
46
+ }
47
+
48
+ .title {
49
+ font-size: 54px;
50
+ font-weight: 700;
51
+ line-height: 1.2;
52
+ text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.25);
53
+ margin: 0;
54
+ }
55
+
56
+ .subtitle {
57
+ font-size: 26px;
58
+ font-weight: 300;
59
+ line-height: 1.4;
60
+ margin-top: 25px;
61
+ opacity: 0.9;
62
+ max-width: 90%;
63
+ }
64
+
65
+ .footer {
66
+ position: absolute;
67
+ bottom: 60px;
68
+ left: 80px;
69
+ font-size: 18px;
70
+ font-weight: 400;
71
+ opacity: 0.8;
72
+ z-index: 10;
73
+ animation: fadeInContent 1.5s ease-out 0.5s forwards;
74
+ opacity: 0;
75
+ }
76
+
77
+ .dna-decoration {
78
+ position: absolute;
79
+ top: 0;
80
+ right: -150px;
81
+ width: 600px;
82
+ height: 100%;
83
+ z-index: 1;
84
+ transform: rotate(15deg);
85
+ }
86
+
87
+ .dot {
88
+ position: absolute;
89
+ background-color: rgba(255, 255, 255, 0.15);
90
+ border-radius: 50%;
91
+ animation: float 8s ease-in-out infinite;
92
+ }
93
+
94
+ .bar {
95
+ position: absolute;
96
+ background-color: rgba(255, 255, 255, 0.1);
97
+ height: 3px;
98
+ border-radius: 2px;
99
+ }
100
+
101
+ @keyframes float {
102
+ 0% { transform: translateY(0px); }
103
+ 50% { transform: translateY(-15px); }
104
+ 100% { transform: translateY(0px); }
105
+ }
106
+
107
+ /* Generación de la hélice de ADN con CSS */
108
+ .dna-helix .rung { position: absolute; width: 100px; height: 30px; }
109
+ .dna-helix .dot1 { position: absolute; top: 0; left: 0; width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.4); }
110
+ .dna-helix .dot2 { position: absolute; top: 0; right: 0; width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.4); }
111
+ .dna-helix .connector { position: absolute; top: 4.5px; left: 12px; right: 12px; height: 3px; background: rgba(255,255,255,0.2); }
112
+
113
+ /* Posicionamiento manual de los "peldaños" de la hélice */
114
+ .rung:nth-child(1) { top: 50px; left: 250px; transform: scale(0.6) rotate(-20deg); }
115
+ .rung:nth-child(2) { top: 90px; left: 265px; transform: scale(0.7) rotate(-10deg); }
116
+ .rung:nth-child(3) { top: 130px; left: 275px; transform: scale(0.8) rotate(0deg); }
117
+ .rung:nth-child(4) { top: 170px; left: 270px; transform: scale(0.9) rotate(10deg); }
118
+ .rung:nth-child(5) { top: 210px; left: 255px; transform: scale(1) rotate(20deg); }
119
+ .rung:nth-child(6) { top: 250px; left: 235px; transform: scale(0.95) rotate(10deg); }
120
+ .rung:nth-child(7) { top: 290px; left: 220px; transform: scale(0.85) rotate(0deg); }
121
+ .rung:nth-child(8) { top: 330px; left: 225px; transform: scale(0.75) rotate(-10deg); }
122
+ .rung:nth-child(9) { top: 370px; left: 240px; transform: scale(0.65) rotate(-20deg); }
123
+ .rung:nth-child(10) { top: 410px; left: 260px; transform: scale(0.7) rotate(-10deg); }
124
+ .rung:nth-child(11) { top: 450px; left: 270px; transform: scale(0.8) rotate(0deg); }
125
+ .rung:nth-child(12) { top: 490px; left: 265px; transform: scale(0.9) rotate(10deg); }
126
+ .rung:nth-child(13) { top: 530px; left: 250px; transform: scale(1) rotate(20deg); }
127
+ .rung:nth-child(14) { top: 570px; left: 230px; transform: scale(0.9) rotate(10deg); }
128
+ .rung:nth-child(15) { top: 610px; left: 215px; transform: scale(0.8) rotate(0deg); }
129
+
130
+ /* Moléculas de fondo */
131
+ .bg-shape { position: absolute; border-radius: 50%; background: rgba(255,255,255,0.05); animation: float 10s ease-in-out infinite alternate; }
132
+ .bg-shape.s1 { width: 200px; height: 200px; top: -50px; left: 5%; animation-duration: 12s; }
133
+ .bg-shape.s2 { width: 150px; height: 150px; bottom: -40px; right: 35%; animation-duration: 8s; }
134
+ .bg-shape.s3 { width: 80px; height: 80px; top: 40%; left: 45%; animation-duration: 15s; }
135
+ .bg-shape.s4 { width: 120px; height: 120px; top: 15%; right: 5%; animation-duration: 9s; }
136
+
137
+ </style>
138
+ </head>
139
+ <body>
140
+
141
+ <div class="slide">
142
+ <div class="bg-shape s1"></div>
143
+ <div class="bg-shape s2"></div>
144
+ <div class="bg-shape s3"></div>
145
+ <div class="bg-shape s4"></div>
146
+
147
+ <div class="dna-decoration">
148
+ <div class="dna-helix">
149
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
150
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
151
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
152
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
153
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
154
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
155
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
156
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
157
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
158
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
159
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
160
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
161
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
162
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
163
+ <div class="rung"><div class="dot1"></div><div class="connector"></div><div class="dot2"></div></div>
164
+ </div>
165
+ </div>
166
+
167
+ <div class="content">
168
+ <h1 class="title">Análisis Exhaustivo del Ecosistema Global de Colegios Profesionales de Biotecnología</h1>
169
+ <p class="subtitle">Un estudio comparativo de modelos organizacionales, desarrollo industrial y tendencias emergentes</p>
170
+ </div>
171
+
172
+ <div class="footer">
173
+ <p><strong>Autor:</strong> MiniMax Agent</p>
174
+ <p style="margin-top: -10px;"><strong>Fecha:</strong> 25 de junio de 2025</p>
175
+ </div>
176
+
177
+ </div>
178
+
179
+ </body>
180
+ </html>
slides/slide01_titulo_quality_check_1750782851.png ADDED

Git LFS Details

  • SHA256: d1bddf7e3852cec5f87380c1ccb9a6ae4613387c2498b0a8ad230de963a234d6
  • Pointer size: 131 Bytes
  • Size of remote file: 392 kB
slides/slide02_resumen.html ADDED
@@ -0,0 +1,266 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Resumen Ejecutivo - Biotecnología</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ display: flex;
14
+ justify-content: center;
15
+ align-items: center;
16
+ height: 100vh;
17
+ background-color: #f0f0f0;
18
+ font-family: 'Poppins', sans-serif;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background: linear-gradient(135deg, #e3f2fd, #e0f2f1);
25
+ display: flex;
26
+ flex-direction: column;
27
+ padding: 50px 70px;
28
+ box-sizing: border-box;
29
+ position: relative;
30
+ overflow: hidden;
31
+ animation: fadeIn 1s ease-in-out;
32
+ }
33
+
34
+ @keyframes fadeIn {
35
+ from { opacity: 0; transform: scale(0.98); }
36
+ to { opacity: 1; transform: scale(1); }
37
+ }
38
+
39
+ .slide-header {
40
+ text-align: left;
41
+ margin-bottom: 30px;
42
+ }
43
+
44
+ .slide-header h1 {
45
+ font-size: 48px;
46
+ font-weight: 700;
47
+ color: #004d40;
48
+ margin: 0;
49
+ padding-bottom: 10px;
50
+ border-bottom: 3px solid #00796b;
51
+ display: inline-block;
52
+ }
53
+
54
+ .content-grid {
55
+ display: grid;
56
+ grid-template-columns: 1fr 1fr;
57
+ grid-template-rows: auto 1fr;
58
+ gap: 30px 40px;
59
+ flex-grow: 1;
60
+ }
61
+
62
+ .section-title {
63
+ grid-column: 1 / -1;
64
+ font-size: 24px;
65
+ font-weight: 600;
66
+ color: #01579b;
67
+ margin: 10px 0 -10px 0;
68
+ border-left: 4px solid #0288d1;
69
+ padding-left: 15px;
70
+ }
71
+
72
+ .model-column {
73
+ background-color: rgba(255, 255, 255, 0.7);
74
+ border-radius: 12px;
75
+ padding: 25px;
76
+ box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
77
+ border: 1px solid rgba(0, 121, 107, 0.2);
78
+ display: flex;
79
+ flex-direction: column;
80
+ align-items: center;
81
+ text-align: center;
82
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
83
+ }
84
+
85
+ .model-column:hover {
86
+ transform: translateY(-5px);
87
+ box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
88
+ }
89
+
90
+ .icon {
91
+ width: 60px;
92
+ height: 60px;
93
+ margin-bottom: 20px;
94
+ position: relative;
95
+ }
96
+
97
+ /* CSS Icon: Industry/Gear */
98
+ .icon-industry::before {
99
+ content: '';
100
+ position: absolute;
101
+ top: 50%;
102
+ left: 50%;
103
+ width: 30px;
104
+ height: 30px;
105
+ background: #00796b;
106
+ border-radius: 50%;
107
+ transform: translate(-50%, -50%);
108
+ }
109
+ .icon-industry::after {
110
+ content: '';
111
+ position: absolute;
112
+ inset: 0;
113
+ background-image:
114
+ linear-gradient(#00796b, #00796b),
115
+ linear-gradient(#00796b, #00796b),
116
+ linear-gradient(#00796b, #00796b),
117
+ linear-gradient(#00796b, #00796b);
118
+ background-size: 8px 100%, 100% 8px, 8px 100%, 100% 8px;
119
+ background-position: center center, center center, center center, center center;
120
+ background-repeat: no-repeat;
121
+ transform: rotate(45deg);
122
+ animation: spin 12s linear infinite;
123
+ }
124
+
125
+ @keyframes spin {
126
+ from { transform: rotate(0deg); }
127
+ to { transform: rotate(360deg); }
128
+ }
129
+
130
+ /* CSS Icon: Regulation/Shield */
131
+ .icon-regulation {
132
+ background-color: #0277bd;
133
+ clip-path: polygon(50% 0%, 100% 15%, 100% 80%, 50% 100%, 0 80%, 0 15%);
134
+ }
135
+ .icon-regulation::after {
136
+ content: '✓';
137
+ font-size: 36px;
138
+ color: white;
139
+ position: absolute;
140
+ top: 50%;
141
+ left: 50%;
142
+ transform: translate(-50%, -50%);
143
+ font-weight: bold;
144
+ }
145
+
146
+ .model-column h3 {
147
+ font-size: 22px;
148
+ font-weight: 600;
149
+ color: #004d40;
150
+ margin: 0 0 10px 0;
151
+ }
152
+
153
+ .model-column p {
154
+ font-size: 16px;
155
+ color: #37474f;
156
+ margin: 0;
157
+ line-height: 1.5;
158
+ }
159
+
160
+ .findings-section {
161
+ grid-column: 1 / -1;
162
+ display: flex;
163
+ gap: 40px;
164
+ }
165
+
166
+ .findings-list, .challenge-section {
167
+ flex: 1;
168
+ }
169
+
170
+ .findings-list ul {
171
+ list-style: none;
172
+ padding: 0;
173
+ margin: 0;
174
+ }
175
+
176
+ .findings-list li {
177
+ font-size: 17px;
178
+ color: #333;
179
+ padding-left: 30px;
180
+ position: relative;
181
+ margin-bottom: 15px;
182
+ line-height: 1.6;
183
+ }
184
+
185
+ .findings-list li::before {
186
+ content: '';
187
+ position: absolute;
188
+ left: 0;
189
+ top: 8px;
190
+ width: 12px;
191
+ height: 12px;
192
+ background-color: #0288d1;
193
+ border-radius: 50%;
194
+ box-shadow: 0 0 0 3px rgba(2, 136, 209, 0.2);
195
+ }
196
+
197
+ .findings-list li strong {
198
+ font-weight: 600;
199
+ color: #004d40;
200
+ }
201
+
202
+ .challenge-section {
203
+ background-color: rgba(255, 236, 179, 0.4);
204
+ border-left: 4px solid #ffa000;
205
+ padding: 20px;
206
+ border-radius: 8px;
207
+ align-self: flex-start;
208
+ }
209
+
210
+ .challenge-section h3 {
211
+ font-size: 22px;
212
+ font-weight: 600;
213
+ color: #e65100;
214
+ margin: 0 0 10px 0;
215
+ }
216
+
217
+ .challenge-section p {
218
+ font-size: 17px;
219
+ color: #4e342e;
220
+ margin: 0;
221
+ line-height: 1.6;
222
+ }
223
+
224
+ </style>
225
+ </head>
226
+ <body>
227
+
228
+ <div class="slide">
229
+ <div class="slide-header">
230
+ <h1>Resumen Ejecutivo</h1>
231
+ </div>
232
+
233
+ <div class="content-grid">
234
+ <div class="section-title">Dos modelos organizacionales dominan el panorama global:</div>
235
+
236
+ <div class="model-column">
237
+ <div class="icon icon-industry"></div>
238
+ <h3>Asociación Industrial/Gremial</h3>
239
+ <p>EE.UU., Europa, Asia-Pacífico</p>
240
+ </div>
241
+
242
+ <div class="model-column">
243
+ <div class="icon icon-regulation"></div>
244
+ <h3>Regulación Profesional</h3>
245
+ <p>América Latina (modelo emergente)</p>
246
+ </div>
247
+
248
+ <div class="findings-section">
249
+ <div class="findings-list">
250
+ <h3 class="section-title" style="margin-top: 0; margin-bottom: 15px;">Hallazgos Clave</h3>
251
+ <ul>
252
+ <li>El modelo industrial se enfoca en <strong>lobby, desarrollo de negocios e innovación.</strong></li>
253
+ <li>El modelo de regulación profesional busca el <strong>control del ejercicio profesional.</strong></li>
254
+ <li>Ecuador (<strong>COBIEC 2024</strong>) representa la tendencia más reciente hacia la colegiación obligatoria.</li>
255
+ </ul>
256
+ </div>
257
+ <div class="challenge-section">
258
+ <h3>Desafío Principal</h3>
259
+ <p>Existe una brecha significativa entre una sólida base académica y un desarrollo industrial incipiente en las regiones emergentes.</p>
260
+ </div>
261
+ </div>
262
+ </div>
263
+ </div>
264
+
265
+ </body>
266
+ </html>
slides/slide02_resumen_quality_check_1750782925.png ADDED

Git LFS Details

  • SHA256: 1aea6219877bae9d8ed0d705180971fe2c53920f60d47bbc8031008ab802e50c
  • Pointer size: 131 Bytes
  • Size of remote file: 212 kB
slides/slide03_modelo1.html ADDED
@@ -0,0 +1,271 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Modelo 1: Asociación Industrial/Gremial</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ font-family: 'Poppins', sans-serif;
14
+ background-color: #1a1a1a;
15
+ display: flex;
16
+ justify-content: center;
17
+ align-items: center;
18
+ height: 100vh;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background: linear-gradient(135deg, #023e8a 0%, #0077b6 50%, #0096c7 100%);
25
+ color: #ffffff;
26
+ display: flex;
27
+ flex-direction: column;
28
+ justify-content: flex-start;
29
+ align-items: center;
30
+ position: relative;
31
+ overflow: hidden;
32
+ padding: 40px 60px;
33
+ box-sizing: border-box;
34
+ animation: fadeIn 1s ease-in-out;
35
+ }
36
+
37
+ @keyframes fadeIn {
38
+ from { opacity: 0; transform: scale(0.95); }
39
+ to { opacity: 1; transform: scale(1); }
40
+ }
41
+
42
+ .map-background {
43
+ position: absolute;
44
+ top: 0;
45
+ left: 0;
46
+ width: 100%;
47
+ height: 100%;
48
+ opacity: 0.08;
49
+ z-index: 0;
50
+ pointer-events: none;
51
+ }
52
+ .continent {
53
+ position: absolute;
54
+ background: #ffffff;
55
+ }
56
+ .north-america { top: 15%; left: 10%; width: 250px; height: 200px; border-radius: 60% 40% 30% 70% / 70% 50% 50% 30%; transform: rotate(-15deg); }
57
+ .europe { top: 20%; left: 45%; width: 150px; height: 120px; border-radius: 50% 50% 30% 70% / 60% 40% 60% 40%; }
58
+ .asia-pacific { top: 25%; left: 65%; width: 300px; height: 250px; border-radius: 30% 70% 50% 50% / 50% 60% 40% 50%; transform: rotate(10deg); }
59
+
60
+
61
+ .header {
62
+ width: 100%;
63
+ text-align: center;
64
+ margin-bottom: 30px;
65
+ z-index: 1;
66
+ }
67
+
68
+ .header h1 {
69
+ font-size: 48px;
70
+ font-weight: 700;
71
+ margin: 0;
72
+ text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
73
+ }
74
+
75
+ .header h2 {
76
+ font-size: 22px;
77
+ font-weight: 300;
78
+ margin: 5px 0 0 0;
79
+ opacity: 0.9;
80
+ }
81
+
82
+ .content-grid {
83
+ display: grid;
84
+ grid-template-columns: 1.1fr 1fr;
85
+ gap: 30px;
86
+ width: 100%;
87
+ flex-grow: 1;
88
+ z-index: 1;
89
+ }
90
+
91
+ .column {
92
+ display: flex;
93
+ flex-direction: column;
94
+ gap: 30px;
95
+ }
96
+
97
+ .card {
98
+ background: rgba(255, 255, 255, 0.1);
99
+ border: 1px solid rgba(255, 255, 255, 0.2);
100
+ border-radius: 12px;
101
+ padding: 25px;
102
+ box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2);
103
+ backdrop-filter: blur(4px);
104
+ -webkit-backdrop-filter: blur(4px);
105
+ height: 100%;
106
+ box-sizing: border-box;
107
+ animation: popIn 0.5s ease-out forwards;
108
+ opacity: 0;
109
+ }
110
+
111
+ .column:nth-child(1) .card { animation-delay: 0.2s; }
112
+ .column:nth-child(2) .card:nth-child(1) { animation-delay: 0.4s; }
113
+ .column:nth-child(2) .card:nth-child(2) { animation-delay: 0.6s; }
114
+
115
+ @keyframes popIn {
116
+ from { opacity: 0; transform: translateY(20px); }
117
+ to { opacity: 1; transform: translateY(0); }
118
+ }
119
+
120
+ .card h3 {
121
+ font-size: 24px;
122
+ font-weight: 600;
123
+ color: #ade8f4;
124
+ margin: 0 0 20px 0;
125
+ padding-bottom: 10px;
126
+ border-bottom: 2px solid rgba(173, 232, 244, 0.5);
127
+ display: flex;
128
+ align-items: center;
129
+ gap: 12px;
130
+ }
131
+
132
+ .card ul {
133
+ list-style: none;
134
+ padding: 0;
135
+ margin: 0;
136
+ }
137
+
138
+ .card ul li {
139
+ font-size: 16px;
140
+ line-height: 1.6;
141
+ margin-bottom: 15px;
142
+ display: flex;
143
+ align-items: flex-start;
144
+ }
145
+
146
+ .card ul li::before {
147
+ content: '■';
148
+ color: #ade8f4;
149
+ font-size: 12px;
150
+ margin-right: 12px;
151
+ margin-top: 5px;
152
+ }
153
+
154
+ .card ul li strong {
155
+ font-weight: 600;
156
+ color: #ffffff;
157
+ }
158
+
159
+ .card ul li span {
160
+ opacity: 0.85;
161
+ display: block;
162
+ margin-left: 0;
163
+ }
164
+
165
+ /* CSS Icons */
166
+ .css-icon { display: inline-block; position: relative; width: 24px; height: 24px; }
167
+
168
+ .icon-building::before {
169
+ content: '';
170
+ position: absolute;
171
+ width: 18px;
172
+ height: 22px;
173
+ background: #ade8f4;
174
+ bottom: 0;
175
+ left: 3px;
176
+ }
177
+ .icon-building::after {
178
+ content: '';
179
+ position: absolute;
180
+ width: 24px;
181
+ height: 4px;
182
+ background: #ade8f4;
183
+ bottom: 0;
184
+ left: 0;
185
+ }
186
+
187
+ .icon-goals::before {
188
+ content: '';
189
+ position: absolute;
190
+ width: 20px;
191
+ height: 20px;
192
+ border: 3px solid #ade8f4;
193
+ border-radius: 50%;
194
+ top: 0;
195
+ left: 0;
196
+ }
197
+ .icon-goals::after {
198
+ content: '';
199
+ position: absolute;
200
+ width: 10px;
201
+ height: 10px;
202
+ background: #ade8f4;
203
+ border-radius: 50%;
204
+ top: 5px;
205
+ left: 5px;
206
+ }
207
+
208
+ .icon-features::before {
209
+ content: '';
210
+ position: absolute;
211
+ width: 0;
212
+ height: 0;
213
+ border-left: 12px solid transparent;
214
+ border-right: 12px solid transparent;
215
+ border-bottom: 20px solid #ade8f4;
216
+ top: 2px;
217
+ }
218
+
219
+ </style>
220
+ </head>
221
+ <body>
222
+
223
+ <div class="slide">
224
+ <div class="map-background">
225
+ <div class="continent north-america"></div>
226
+ <div class="continent europe"></div>
227
+ <div class="continent asia-pacific"></div>
228
+ </div>
229
+
230
+ <div class="header">
231
+ <h1>Modelo 1: Asociación Industrial/Gremial</h1>
232
+ <h2>Dominante en Norteamérica, Europa y Asia-Pacífico</h2>
233
+ </div>
234
+
235
+ <div class="content-grid">
236
+ <div class="column">
237
+ <div class="card">
238
+ <h3><div class="css-icon icon-building"></div>Actores Clave</h3>
239
+ <ul>
240
+ <li><strong>BIO (Estados Unidos)</strong><span>Biotechnology Innovation Organization</span></li>
241
+ <li><strong>EuropaBio (Unión Europea)</strong><span>European Association for Bioindustries</span></li>
242
+ <li><strong>AseBio (España)</strong><span>Asociación Española de Bioempresas</span></li>
243
+ <li><strong>AusBiotech (Australia)</strong><span>Australia's Biotechnology Organization</span></li>
244
+ </ul>
245
+ </div>
246
+ </div>
247
+ <div class="column">
248
+ <div class="card">
249
+ <h3><div class="css-icon icon-goals"></div>Objetivos Principales</h3>
250
+ <ul>
251
+ <li>Lobby y desarrollo de políticas públicas favorables</li>
252
+ <li>Promoción del desarrollo de negocios y networking</li>
253
+ <li>Impulso a la innovación y atracción de inversión</li>
254
+ <li>Creación de ecosistemas empresariales robustos</li>
255
+ </ul>
256
+ </div>
257
+ <div class="card">
258
+ <h3><div class="css-icon icon-features"></div>Características</h3>
259
+ <ul>
260
+ <li>Foco en las empresas y el ecosistema, no en el profesional individual</li>
261
+ <li>Orientación hacia mercados y comercialización</li>
262
+ <li>Representación de intereses industriales</li>
263
+ </ul>
264
+ </div>
265
+ </div>
266
+ </div>
267
+
268
+ </div>
269
+
270
+ </body>
271
+ </html>
slides/slide03_modelo1_quality_check_1750783001.png ADDED

Git LFS Details

  • SHA256: 8a9000a2ac80a8b4b86a97f5789916606a274d3991b50c074621fcccc5ac9295
  • Pointer size: 131 Bytes
  • Size of remote file: 320 kB
slides/slide04_modelo2.html ADDED
@@ -0,0 +1,252 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Modelo 2: Regulación Profesional</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
9
+
10
+ body, html {
11
+ margin: 0;
12
+ padding: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ display: flex;
16
+ justify-content: center;
17
+ align-items: center;
18
+ background-color: #333;
19
+ font-family: 'Poppins', sans-serif;
20
+ }
21
+
22
+ .slide {
23
+ width: 1280px;
24
+ height: 720px;
25
+ background: linear-gradient(135deg, #0d6b61, #1e9a8a);
26
+ color: #ffffff;
27
+ display: flex;
28
+ flex-direction: column;
29
+ position: relative;
30
+ overflow: hidden;
31
+ box-shadow: 0 10px 30px rgba(0,0,0,0.2);
32
+ }
33
+
34
+ .header {
35
+ padding: 60px 80px 30px 80px;
36
+ animation: fadeInDown 1s ease-out;
37
+ }
38
+
39
+ .header h1 {
40
+ font-size: 56px;
41
+ font-weight: 700;
42
+ margin: 0;
43
+ padding: 0;
44
+ letter-spacing: 1px;
45
+ }
46
+
47
+ .header p {
48
+ font-size: 26px;
49
+ font-weight: 400;
50
+ margin: 10px 0 0 0;
51
+ padding-bottom: 15px;
52
+ border-bottom: 1px solid rgba(255, 255, 255, 0.3);
53
+ display: inline-block;
54
+ }
55
+
56
+ .content-grid {
57
+ display: flex;
58
+ flex-grow: 1;
59
+ padding: 10px 80px 60px 80px;
60
+ gap: 60px;
61
+ animation: fadeInUp 1s ease-out 0.3s;
62
+ animation-fill-mode: backwards;
63
+ }
64
+
65
+ .column {
66
+ flex: 1;
67
+ padding-top: 20px;
68
+ }
69
+
70
+ .column h2 {
71
+ font-size: 28px;
72
+ font-weight: 600;
73
+ margin-bottom: 25px;
74
+ display: flex;
75
+ align-items: center;
76
+ gap: 15px;
77
+ }
78
+
79
+ .icon-objetivos {
80
+ font-family: serif;
81
+ font-weight: bold;
82
+ font-size: 32px;
83
+ line-height: 1;
84
+ position: relative;
85
+ display: inline-block;
86
+ width: 30px;
87
+ height: 30px;
88
+ text-align: center;
89
+ }
90
+ .icon-objetivos::before {
91
+ content: '¶';
92
+ position: absolute;
93
+ left: 0;
94
+ top: -12px;
95
+ }
96
+ .icon-objetivos::after {
97
+ content: '';
98
+ width: 100%;
99
+ height: 2px;
100
+ background: #fff;
101
+ position: absolute;
102
+ left: 0;
103
+ bottom: 0;
104
+ }
105
+
106
+ ul {
107
+ list-style: none;
108
+ padding: 0;
109
+ margin: 0;
110
+ }
111
+
112
+ .column ul li {
113
+ font-size: 20px;
114
+ font-weight: 400;
115
+ margin-bottom: 20px;
116
+ line-height: 1.4;
117
+ display: flex;
118
+ align-items: flex-start;
119
+ }
120
+
121
+ .column.left ul li::before {
122
+ content: '✓';
123
+ color: #a7ffeb;
124
+ font-size: 24px;
125
+ font-weight: 600;
126
+ margin-right: 15px;
127
+ line-height: 1.1;
128
+ }
129
+
130
+ .column.right ul li {
131
+ flex-direction: column;
132
+ position: relative;
133
+ padding-left: 25px;
134
+ }
135
+
136
+ .column.right ul li::before {
137
+ content: '•';
138
+ position: absolute;
139
+ left: 0;
140
+ top: 0;
141
+ color: #a7ffeb;
142
+ font-size: 24px;
143
+ font-weight: 600;
144
+ line-height: 1.1;
145
+ }
146
+
147
+ .actor-description {
148
+ font-size: 16px;
149
+ color: rgba(255, 255, 255, 0.8);
150
+ padding-top: 4px;
151
+ font-style: italic;
152
+ }
153
+
154
+ .map-container {
155
+ position: absolute;
156
+ bottom: 20px;
157
+ right: 40px;
158
+ width: 320px;
159
+ height: 400px;
160
+ opacity: 0;
161
+ animation: zoomIn 1s ease-out 0.6s forwards;
162
+ }
163
+
164
+ .map-container svg {
165
+ width: 100%;
166
+ height: 100%;
167
+ overflow: visible;
168
+ }
169
+
170
+ .country-base {
171
+ fill: #145a52;
172
+ stroke: #0d4a43;
173
+ stroke-width: 1.5;
174
+ }
175
+
176
+ .country-highlight {
177
+ fill: #a7ffeb;
178
+ stroke: #fff;
179
+ stroke-width: 2;
180
+ transition: transform 0.3s ease;
181
+ }
182
+
183
+ .map-container:hover .country-highlight {
184
+ transform: scale(1.05);
185
+ }
186
+
187
+ .map-label {
188
+ font-family: 'Poppins', sans-serif;
189
+ font-size: 14px;
190
+ font-weight: 600;
191
+ fill: #000;
192
+ text-anchor: middle;
193
+ paint-order: stroke;
194
+ stroke: white;
195
+ stroke-width: 3px;
196
+ stroke-linecap: butt;
197
+ stroke-linejoin: miter;
198
+ }
199
+
200
+ @keyframes fadeInDown {
201
+ from { opacity: 0; transform: translateY(-30px); }
202
+ to { opacity: 1; transform: translateY(0); }
203
+ }
204
+ @keyframes fadeInUp {
205
+ from { opacity: 0; transform: translateY(30px); }
206
+ to { opacity: 1; transform: translateY(0); }
207
+ }
208
+ @keyframes zoomIn {
209
+ from { opacity: 0; transform: scale(0.8); }
210
+ to { opacity: 1; transform: scale(1); }
211
+ }
212
+
213
+ </style>
214
+ </head>
215
+ <body>
216
+ <div class="slide">
217
+ <div class="header">
218
+ <h1>Modelo 2: Regulación Profesional</h1>
219
+ <p>Tendencia emergente en América Latina</p>
220
+ </div>
221
+
222
+ <div class="content-grid">
223
+ <div class="column left">
224
+ <h2><span class="icon-objetivos"></span>Objetivos Principales</h2>
225
+ <ul>
226
+ <li>Regular y controlar el ejercicio profesional</li>
227
+ <li>Establecer estándares éticos y de práctica profesional</li>
228
+ <li>Gestionar matrícula y licenciamiento profesional</li>
229
+ <li>Defender los intereses del gremio profesional</li>
230
+ </ul>
231
+ </div>
232
+ <div class="column right">
233
+ <h2>Actores Clave</h2>
234
+ <ul>
235
+ <li>Colegio Santafesino de Biotecnólogos (Argentina)
236
+ <span class="actor-description">Modelo provincial consolidado con base legal sólida</span>
237
+ </li>
238
+ <li>Consejo Profesional de Biología (Colombia)
239
+ <span class="actor-description">Regulación por campo profesional afín</span>
240
+ </li>
241
+ <li>COBIEC - Colegio de Biotecnólogos del Ecuador
242
+ <span class="actor-description">Ejemplo más reciente (creado en 2024), nivel nacional</span>
243
+ </li>
244
+ </ul>
245
+ </div>
246
+ </div>
247
+
248
+ <div class="map-container">
249
+ <svg viewBox="0 0 200 250">
250
+ <g transform="translate(0, 10)">
251
+ <!-- South America Base Shape -->
252
+ <path class="country-base" d="M101.4,2.1c-2.3,1.3-4.9,2.5-4.9,5.2c0,0.8,0.5,2.1,0.5,2.1s-2.1,0.5-2.1,2.8s-0.5,3.9-0.5,3.9s-1.8,0.8-1.8,2.3 s-0.5,3.7-0.5,3.7s-2.5-0.3-4.4,0.3s-3.7,2-3.7,2s-1.3-1-3.4-1.3S76,23.1,76,23.1s-1.5,1.5-1.3,3.4s0.8,2.8,0.8,2.8s-2.3,1.3-2.3,3.1 s1,4.4,1,4.4s-1.8,3.9-1.8,6.2s0,4.7,0,4.7s-1,2.1-1,4.2s1.5,5.2,1.5,5.2l-2.3,2l-1,3.4l-1.3,3.9l-1.8,2.3l-2.3,1.3l-2.5,1.3 l-2.8,1.3l-2.5,1.8l-2.3,2.5l-2.3,3.4l-2.8,5.7l-2.8,7.8l-2.5,8.1l-1.3,5.4l-0.5,3.7l0.3,3.7l0.8,3.7l1.3,3.4l1.5,2.5l2,1.8 l2.3,1.5l2.8,1l3.1,0.8l3.4,0.5l3.4,0.3l3.7-0.3l3.9-0.5l4.2-1l4.4-1.5l4.7-2.3l4.7-3.1l4.4-4.2l3.7-5.2l2.8-5.4l2-5.4l1.3-4.7 l1.3-4.7l1-3.9l0.8-3.4l0.8-3.1l1-3.1l1.5-3.1l2-3.4l2.5-3.4l2.8-3.4l2.8-2.8l2.8-2.3l2.5-1.5l2.3-1l2-0.5l1.8,0l1.8,0.5 l1.8,1l1.5,1.3l1.5,1.8l1.3,2l1,2.3l0.8,2.5l0.5,2.8l0.3,3.1l0,3.1l-0.3,3.1l-0.5,2.8l-0.8,2.5l-1.3,2.3l-1.8,2l-2.3,1.8 l-2.8,1.5l-3.4,1.3l-3.9,1l-4.4,0.8l-4.7,0.5l-3.9,0l-3.4-0.5l-2.8-0.8l-2.3-1.3l-2-1.8l-1.8-2.3l-1.5-2.8l-1.3-3.4l-1-3.7 l-0.8-3.9l-0.5-3.7l-0.3-3.1l0.3-2.5l0.5-2.3l0.8-2l1.3-1.8l1.8-1.5l2.3-1.3l2.8-1l3.4-0.8l3.7-0.5l3.7,0l3.4,0.5l2.8,1 l2.3,1.5l1.8,2l1.3,2.5l0.8,2.8l0.5,3.4l0.3,3.9l-0.3,4.2l-0.8,4.4l-1.3,4.7l-2,5.2l-2.8,5.7l-3.9,6.2l-5.4,6.5l-6.2,6.2 l-5.7,4.7l-4.4,3.1l-3.1,1.8l-2.3,1l-1.8,0.5l-1.5,0.3l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1l-0.3-1.3l0.3-1.5l0.5-1.5l0.8-1.5 l1.3-1.3l1.5-1l1.8-0.8l1.8-0.5l1.5,0l1.3,0.3l1,0.5l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1 l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1l-0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1 l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8 l1.8,0.5l1.5,0l1.3-0.3l1-0.5l0.8-0.8l0.5-1l0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5 l-1.5,0l-1.3,0.3l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5 l-1.5,0l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1l-0.3-1.3l0.3-1.5l0.5-1.5l0.8-1.5l1.3-1.3l1.5-1l1.8-0.8l1.8-0.5l1.5,0 l1.3,0.3l1,0.5l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0 l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1l-0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0 l-1.3,0.3l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8l1.8,0.5l1.5,0l1.3-0.3 l1-0.5l0.8-0.8l0.5-1l0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3 l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3 l-1-0.5l-0.8-0.8l-0.5-1l-0.3-1.3l0.3-1.5l0.5-1.5l0.8-1.5l1.3-1.3l1.5-1l1.8-0.8l1.8-0.5l1.5,0l1.3,0.3l1,0.5 l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5 l-0.8-0.8l-0.5-1l-0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3 l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8l1.8,0.5l1.5,0l1.3-0.3l1,0.5 l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5 l-0.8-0.8l-0.5-1l-0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3 l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8l1.8,0.5l1.5,0l1.3-0.3l1,0.5 l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5 l-0.8-0.8l-0.5-1l-0.3-1.3l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3 l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8l1.8,0.5l1.5,0l1.3-0.3l1,0.5 l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5 l-0.8-0.8l-0.5-1l-0.3-1.3L38,187.6l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3l-1,0.5 l-0.8,0.8l-0.5,1l-0.3,1.3l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8l1.8,0.5l1.5,0l1.3-0.3l1,0.5l0.8,0.8l0.5,1 l0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1 l-0.3-1.3L20,230l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3l-1,0.5l-0.8,0.8l-0.5,1 l-0.3,1.3l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1 l-0.3-1.3l0.3-1.5l0.5-1.5l0.8-1.5l1.3-1.3l1.5-1l1.8-0.8l1.8-0.5l1.5,0l1.3,0.3l1,0.5l0.8,0.8l0.5,1l0.3,1.3 l-0.3,1.5l-0.5,1.5l-0.8,1.5l-1.3,1.3l-1.5,1l-1.8,0.8l-1.8,0.5l-1.5,0l-1.3-0.3l-1-0.5l-0.8-0.8l-0.5-1l-0.3-1.3 l-0.3-1.5l-0.5-1.5l-0.8-1.5l-1.3-1.3l-1.5-1l-1.8-0.8l-1.8-0.5l-1.5,0l-1.3,0.3l-1,0.5l-0.8,0.8l-0.5,1l-0.3,1.3 l0.3,1.5l0.5,1.5l0.8,1.5l1.3,1.3l1.5,1l1.8,0.8l1.8,0.5l1.5,0l1.3-0.3l1,0.5l0.8,0.8l0.5,1l0.3,1.3l-0.3,1.5l-0.5,1.5 l-
slides/slide04_modelo2_quality_check_1750783078.png ADDED

Git LFS Details

  • SHA256: 9a7fbdc7023a8e0eb2a6381cc39dadfa097333da23d1efe2b941c1b56a951dd3
  • Pointer size: 131 Bytes
  • Size of remote file: 395 kB
slides/slide04_modelo2_quality_check_1750783149.png ADDED

Git LFS Details

  • SHA256: 0c5ff91d795e73de51585a769311640f6c9c523f6238125d205ff431c7e195b3
  • Pointer size: 131 Bytes
  • Size of remote file: 459 kB
slides/slide04_modelo2_quality_check_1750783255.png ADDED

Git LFS Details

  • SHA256: 2eb958ccf596544b76bc2b4382d07bf8f32fd163a988695bddc50218209bcf38
  • Pointer size: 131 Bytes
  • Size of remote file: 402 kB
slides/slide05_comparativo.html ADDED
@@ -0,0 +1,293 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Análisis Comparativo Global</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
9
+
10
+ body, html {
11
+ margin: 0;
12
+ padding: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: center;
18
+ background-color: #1a1a1a;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background: linear-gradient(135deg, #0d2a3a, #0f3f4c);
25
+ font-family: 'Poppins', sans-serif;
26
+ color: #e0e0e0;
27
+ display: flex;
28
+ flex-direction: column;
29
+ padding: 40px;
30
+ box-sizing: border-box;
31
+ animation: fadeIn 1s ease-in-out;
32
+ }
33
+
34
+ @keyframes fadeIn {
35
+ from { opacity: 0; transform: scale(0.95); }
36
+ to { opacity: 1; transform: scale(1); }
37
+ }
38
+
39
+ .header {
40
+ text-align: left;
41
+ margin-bottom: 25px;
42
+ }
43
+
44
+ .header h1 {
45
+ font-size: 44px;
46
+ color: #ffffff;
47
+ margin: 0;
48
+ font-weight: 700;
49
+ }
50
+
51
+ .header h2 {
52
+ font-size: 20px;
53
+ color: #a0cadd;
54
+ margin: 5px 0 0 0;
55
+ font-weight: 400;
56
+ }
57
+
58
+ .content {
59
+ display: flex;
60
+ flex-grow: 1;
61
+ gap: 30px;
62
+ overflow: hidden;
63
+ }
64
+
65
+ .main-table-container {
66
+ flex: 3;
67
+ display: flex;
68
+ flex-direction: column;
69
+ }
70
+
71
+ .main-table {
72
+ width: 100%;
73
+ border-collapse: collapse;
74
+ font-size: 14px;
75
+ }
76
+
77
+ .main-table th, .main-table td {
78
+ padding: 8px 12px;
79
+ text-align: left;
80
+ vertical-align: middle;
81
+ }
82
+
83
+ .main-table th {
84
+ color: #a0cadd;
85
+ font-weight: 600;
86
+ font-size: 13px;
87
+ text-transform: uppercase;
88
+ border-bottom: 2px solid #2a5a6e;
89
+ }
90
+
91
+ .main-table td {
92
+ border-bottom: 1px solid #2a5a6e;
93
+ }
94
+
95
+ .main-table tr:last-child td {
96
+ border-bottom: none;
97
+ }
98
+
99
+ .model-cell {
100
+ display: flex;
101
+ align-items: center;
102
+ gap: 8px;
103
+ }
104
+
105
+ .model-cell svg {
106
+ width: 20px;
107
+ height: 20px;
108
+ }
109
+
110
+ .text-right {
111
+ text-align: right;
112
+ }
113
+
114
+ .bar-container {
115
+ display: flex;
116
+ align-items: center;
117
+ gap: 10px;
118
+ }
119
+
120
+ .bar-wrapper {
121
+ width: 100px;
122
+ height: 10px;
123
+ background-color: rgba(255, 255, 255, 0.15);
124
+ border-radius: 5px;
125
+ overflow: hidden;
126
+ }
127
+
128
+ .bar {
129
+ height: 100%;
130
+ background-color: #4fc3f7;
131
+ border-radius: 5px;
132
+ animation: growBar 1.5s ease-out;
133
+ }
134
+
135
+ @keyframes growBar {
136
+ from { width: 0; }
137
+ }
138
+
139
+ .intensity-value {
140
+ width: 35px;
141
+ text-align: right;
142
+ font-weight: 600;
143
+ color: #ffffff;
144
+ }
145
+
146
+ .faded-text {
147
+ color: #8899a6;
148
+ }
149
+
150
+ .sidebar {
151
+ flex: 1.5;
152
+ background-color: rgba(13, 42, 58, 0.6);
153
+ border-radius: 12px;
154
+ padding: 25px;
155
+ display: flex;
156
+ flex-direction: column;
157
+ gap: 20px;
158
+ border: 1px solid #2a5a6e;
159
+ }
160
+
161
+ .sidebar h3 {
162
+ font-size: 22px;
163
+ color: #ffffff;
164
+ margin: 0 0 10px 0;
165
+ border-bottom: 2px solid #4fc3f7;
166
+ padding-bottom: 10px;
167
+ }
168
+
169
+ .analysis-card {
170
+ background-color: #193a4d;
171
+ border-radius: 8px;
172
+ padding: 15px;
173
+ font-size: 14.5px;
174
+ line-height: 1.6;
175
+ border-left: 4px solid transparent;
176
+ transition: transform 0.3s ease;
177
+ }
178
+
179
+ .analysis-card:hover {
180
+ transform: translateY(-3px);
181
+ }
182
+
183
+ .analysis-card.efficiency { border-left-color: #4fc3f7; }
184
+ .analysis-card.productivity { border-left-color: #81c784; }
185
+ .analysis-card.gap { border-left-color: #ffd54f; }
186
+
187
+ .analysis-card strong {
188
+ font-weight: 600;
189
+ color: #ffffff;
190
+ }
191
+
192
+ .analysis-card .highlight {
193
+ color: #ffd54f;
194
+ font-weight: 600;
195
+ }
196
+
197
+ </style>
198
+ </head>
199
+ <body>
200
+ <div class="slide">
201
+ <div class="header">
202
+ <h1>Análisis Comparativo Global</h1>
203
+ <h2>Indicadores Clave de Desarrollo Biotecnológico</h2>
204
+ </div>
205
+ <div class="content">
206
+ <div class="main-table-container">
207
+ <table class="main-table">
208
+ <thead>
209
+ <tr>
210
+ <th>País</th>
211
+ <th>Modelo Organizacional</th>
212
+ <th class="text-right">Empresas</th>
213
+ <th class="text-right">Inversión I+D</th>
214
+ <th class="text-right">Patentes PCT</th>
215
+ <th>Intensidad I+D (M USD/empresa)</th>
216
+ </tr>
217
+ </thead>
218
+ <tbody>
219
+ <tr>
220
+ <td>Estados Unidos</td>
221
+ <td><div class="model-cell"><svg fill="#4fc3f7" viewBox="0 0 24 24"><path d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zM4 18V8h2.55v10H4zm4.45 0v-5h2.55v5h-2.55zM12 18V8h2.55v10H12zm4.45 0v-5h2.55v5h-2.55z"/></svg><span>Industrial/Gremial</span></div></td>
222
+ <td class="text-right">4,000+</td>
223
+ <td class="text-right">50,000 M USD</td>
224
+ <td class="text-right">8,500+</td>
225
+ <td><div class="bar-container"><div class="bar-wrapper"><div class="bar" style="width: 83.3%;"></div></div><span class="intensity-value">12.5</span></div></td>
226
+ </tr>
227
+ <tr>
228
+ <td>Alemania</td>
229
+ <td><div class="model-cell"><svg fill="#4fc3f7" viewBox="0 0 24 24"><path d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zM4 18V8h2.55v10H4zm4.45 0v-5h2.55v5h-2.55zM12 18V8h2.55v10H12zm4.45 0v-5h2.55v5h-2.55z"/></svg><span>Industrial/Gremial</span></div></td>
230
+ <td class="text-right">935</td>
231
+ <td class="text-right">5,300 M USD</td>
232
+ <td class="text-right">659</td>
233
+ <td><div class="bar-container"><div class="bar-wrapper"><div class="bar" style="width: 37.3%;"></div></div><span class="intensity-value">5.6</span></div></td>
234
+ </tr>
235
+ <tr>
236
+ <td>España</td>
237
+ <td><div class="model-cell"><svg fill="#4fc3f7" viewBox="0 0 24 24"><path d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zM4 18V8h2.55v10H4zm4.45 0v-5h2.55v5h-2.55zM12 18V8h2.55v10H12zm4.45 0v-5h2.55v5h-2.55z"/></svg><span>Industrial/Gremial</span></div></td>
238
+ <td class="text-right">1,233</td>
239
+ <td class="text-right">1,400 M USD</td>
240
+ <td class="text-right">112</td>
241
+ <td><div class="bar-container"><div class="bar-wrapper"><div class="bar" style="width: 8%;"></div></div><span class="intensity-value">1.2</span></div></td>
242
+ </tr>
243
+ <tr>
244
+ <td>Francia</td>
245
+ <td><div class="model-cell"><svg fill="#4fc3f7" viewBox="0 0 24 24"><path d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zM4 18V8h2.55v10H4zm4.45 0v-5h2.55v5h-2.55zM12 18V8h2.55v10H12zm4.45 0v-5h2.55v5h-2.55z"/></svg><span>Industrial/Gremial</span></div></td>
246
+ <td class="text-right">2,900</td>
247
+ <td class="text-right">5,200 M USD</td>
248
+ <td class="text-right">528</td>
249
+ <td><div class="bar-container"><div class="bar-wrapper"><div class="bar" style="width: 12%;"></div></div><span class="intensity-value">1.8</span></div></td>
250
+ </tr>
251
+ <tr>
252
+ <td>Corea del Sur</td>
253
+ <td><div class="model-cell"><svg fill="#4fc3f7" viewBox="0 0 24 24"><path d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zM4 18V8h2.55v10H4zm4.45 0v-5h2.55v5h-2.55zM12 18V8h2.55v10H12zm4.45 0v-5h2.55v5h-2.55z"/></svg><span>Industrial/Gremial</span></div></td>
254
+ <td class="text-right">1,800</td>
255
+ <td class="text-right">4,500 M USD</td>
256
+ <td class="text-right">1,407</td>
257
+ <td><div class="bar-container"><div class="bar-wrapper"><div class="bar" style="width: 16.7%;"></div></div><span class="intensity-value">2.5</span></div></td>
258
+ </tr>
259
+ <tr>
260
+ <td>Argentina</td>
261
+ <td><div class="model-cell"><svg fill="#81c784" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.59L12 15.17l-1.41 1.42L5 11.01l1.41-1.42L7.82 11l-2.82-2.82L6.41 6.77 12 12.36l5.59-5.59 1.41 1.41L13.41 11l2.83 2.82-1.41 1.41L12 13.76l1.41 1.42z" transform="scale(1.2) translate(-2, -2)"/></svg><span>Regulación Profesional</span></div></td>
262
+ <td class="text-right faded-text">N/D</td>
263
+ <td class="text-right faded-text">N/D</td>
264
+ <td class="text-right">8</td>
265
+ <td><div class="bar-container"><div class="bar-wrapper"></div><span class="intensity-value faded-text">N/D</span></div></td>
266
+ </tr>
267
+ <tr>
268
+ <td>Ecuador</td>
269
+ <td><div class="model-cell"><svg fill="#81c784" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.59L12 15.17l-1.41 1.42L5 11.01l1.41-1.42L7.82 11l-2.82-2.82L6.41 6.77 12 12.36l5.59-5.59 1.41 1.41L13.41 11l2.83 2.82-1.41 1.41L12 13.76l1.41 1.42z" transform="scale(1.2) translate(-2, -2)"/></svg><span>Regulación Profesional</span></div></td>
270
+ <td class="text-right">Incipiente</td>
271
+ <td class="text-right faded-text">N/D</td>
272
+ <td class="text-right">&lt;5</td>
273
+ <td><div class="bar-container"><div class="bar-wrapper"></div><span class="intensity-value faded-text">N/D</span></div></td>
274
+ </tr>
275
+ </tbody>
276
+ </table>
277
+ </div>
278
+ <div class="sidebar">
279
+ <h3>Análisis Destacado</h3>
280
+ <div class="analysis-card efficiency">
281
+ <strong>Patrón de Eficiencia:</strong> Gran disparidad en la intensidad de I+D. Suiza (13.6 M USD/empresa) supera ampliamente a España (1.2 M USD/empresa).
282
+ </div>
283
+ <div class="analysis-card productivity">
284
+ <strong>Productividad de Patentes:</strong> Corea del Sur lidera en la conversión de conocimiento académico a patentes, con ~400 patentes por programa académico.
285
+ </div>
286
+ <div class="analysis-card gap">
287
+ <strong>Brecha América Latina:</strong> A pesar de una fuerte base académica, la región muestra un <span class="highlight">desarrollo industrial limitado</span> y una baja generación de patentes, evidenciando un cuello de botella en la transferencia tecnológica.
288
+ </div>
289
+ </div>
290
+ </div>
291
+ </div>
292
+ </body>
293
+ </html>
slides/slide05_comparativo_quality_check_1750783332.png ADDED

Git LFS Details

  • SHA256: 2b1a717d1b889852ba16d09bfcd09c6181dfacce01230f23cb73b843b2ff225a
  • Pointer size: 131 Bytes
  • Size of remote file: 472 kB
slides/slide05_comparativo_quality_check_1750783400.png ADDED

Git LFS Details

  • SHA256: 2dc5ddc78cc8493f22461eb4e5612c1971acfd475706838208f2fc457d217236
  • Pointer size: 131 Bytes
  • Size of remote file: 332 kB
slides/slide06_caso_ecuador.html ADDED
@@ -0,0 +1,263 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Caso de Estudio: Ecuador y COBIEC</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
9
+
10
+ body, html {
11
+ margin: 0;
12
+ padding: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: center;
18
+ background-color: #333;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background-color: #0d1a26;
25
+ color: #e0e0e0;
26
+ font-family: 'Poppins', sans-serif;
27
+ display: flex;
28
+ flex-direction: column;
29
+ padding: 40px;
30
+ box-sizing: border-box;
31
+ overflow: hidden;
32
+ }
33
+
34
+ .header {
35
+ flex-shrink: 0;
36
+ padding-bottom: 20px;
37
+ }
38
+
39
+ .title {
40
+ font-size: 48px;
41
+ font-weight: 700;
42
+ color: #ffffff;
43
+ margin: 0;
44
+ animation: fadeInDown 0.8s ease-out;
45
+ }
46
+
47
+ .title .highlight {
48
+ color: #FBCB0A;
49
+ }
50
+
51
+ .subtitle {
52
+ font-size: 20px;
53
+ font-weight: 400;
54
+ color: #9cb3c9;
55
+ margin: 5px 0 0 0;
56
+ animation: fadeInDown 0.8s ease-out 0.2s;
57
+ animation-fill-mode: backwards;
58
+ }
59
+
60
+ .content-grid {
61
+ flex-grow: 1;
62
+ display: grid;
63
+ grid-template-columns: 4fr 5fr;
64
+ grid-template-rows: minmax(0, 1fr) auto;
65
+ gap: 20px;
66
+ height: 100%;
67
+ }
68
+
69
+ .info-box {
70
+ background-color: rgba(23, 42, 58, 0.7);
71
+ border: 1px solid #29c7ac;
72
+ border-radius: 16px;
73
+ padding: 20px;
74
+ display: flex;
75
+ flex-direction: column;
76
+ box-shadow: 0 0 20px rgba(41, 199, 172, 0.1);
77
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
78
+ animation: fadeInUp 0.6s ease-out;
79
+ animation-fill-mode: backwards;
80
+ }
81
+
82
+ .info-box:hover {
83
+ transform: translateY(-4px);
84
+ box-shadow: 0 8px 30px rgba(41, 199, 172, 0.25);
85
+ }
86
+
87
+ .box-title {
88
+ display: flex;
89
+ align-items: center;
90
+ gap: 12px;
91
+ font-size: 20px;
92
+ font-weight: 600;
93
+ color: #33d6b8;
94
+ margin-bottom: 12px;
95
+ flex-shrink: 0;
96
+ }
97
+
98
+ .box-title .icon {
99
+ width: 24px;
100
+ height: 24px;
101
+ fill: currentColor;
102
+ }
103
+
104
+ .box-content {
105
+ flex-grow: 1;
106
+ overflow: hidden;
107
+ }
108
+
109
+ .box-content ul {
110
+ list-style: none;
111
+ padding-left: 10px;
112
+ margin: 0;
113
+ }
114
+
115
+ .box-content li {
116
+ font-size: 15px;
117
+ line-height: 1.6;
118
+ padding-left: 20px;
119
+ position: relative;
120
+ }
121
+
122
+ .box-content li:not(:last-child) {
123
+ margin-bottom: 8px;
124
+ }
125
+
126
+ .box-content li::before {
127
+ content: '■';
128
+ position: absolute;
129
+ left: 0;
130
+ color: #FBCB0A;
131
+ font-size: 14px;
132
+ }
133
+
134
+ .top-left {
135
+ grid-area: 1 / 1 / 2 / 2;
136
+ animation-delay: 0.3s;
137
+ padding: 0;
138
+ align-items: center;
139
+ justify-content: center;
140
+ }
141
+
142
+ .top-right {
143
+ grid-area: 1 / 2 / 2 / 3;
144
+ display: flex;
145
+ flex-direction: column;
146
+ gap: 20px;
147
+ min-height: 0;
148
+ }
149
+
150
+ .top-right .info-box {
151
+ flex: 1;
152
+ min-height: 0;
153
+ }
154
+
155
+ .top-right .info-box:nth-child(1) { animation-delay: 0.5s; }
156
+ .top-right .info-box:nth-child(2) { animation-delay: 0.6s; }
157
+
158
+ .bottom-row {
159
+ grid-area: 2 / 1 / 3 / 3;
160
+ display: grid;
161
+ grid-template-columns: repeat(3, 1fr);
162
+ gap: 20px;
163
+ }
164
+
165
+ .bottom-row .info-box:nth-child(1) { animation-delay: 0.7s; }
166
+ .bottom-row .info-box:nth-child(2) { animation-delay: 0.8s; }
167
+ .bottom-row .info-box:nth-child(3) { animation-delay: 0.9s; }
168
+
169
+ .bottom-row .box-content li {
170
+ font-size: 13px;
171
+ }
172
+
173
+ .fish-container {
174
+ width: 100%;
175
+ height: 100%;
176
+ display: flex;
177
+ align-items: center;
178
+ justify-content: center;
179
+ filter: drop-shadow(0 0 15px rgba(51, 214, 184, 0.6));
180
+ }
181
+
182
+ .fish-svg {
183
+ width: 80%;
184
+ stroke-width: 4;
185
+ stroke: #33d6b8;
186
+ fill: none;
187
+ stroke-linecap: round;
188
+ stroke-linejoin: round;
189
+ }
190
+
191
+ .fish-glow-dot {
192
+ fill: #FBCB0A;
193
+ stroke: none;
194
+ filter: drop-shadow(0 0 8px #FBCB0A);
195
+ }
196
+
197
+ @keyframes fadeInDown {
198
+ from { opacity: 0; transform: translateY(-20px); }
199
+ to { opacity: 1; transform: translateY(0); }
200
+ }
201
+
202
+ @keyframes fadeInUp {
203
+ from { opacity: 0; transform: translateY(20px); }
204
+ to { opacity: 1; transform: translateY(0); }
205
+ }
206
+
207
+ </style>
208
+ </head>
209
+ <body>
210
+
211
+ <div class="slide">
212
+ <header class="header">
213
+ <h1 class="title">Caso de Estudio: <span class="highlight">Ecuador y COBIEC</span></h1>
214
+ <p class="subtitle">El ejemplo más reciente de colegiación profesional en biotecnología</p>
215
+ </header>
216
+
217
+ <main class="content-grid">
218
+ <div class="info-box top-left">
219
+ <div class="fish-container">
220
+ <svg viewBox="0 0 200 120" class="fish-svg">
221
+ <g>
222
+ <path d="M178.4,56.7c0,27.1-41,49-91.7,49S-5,83.8-5,56.7S36,7.7,86.7,7.7S178.4,29.6,178.4,56.7z M125.1,19.3 c-7.4,1.8-14.1,4.7-20.1,8.3 M125.1,19.3l21.6-13.6l10.8,17.2L146.7,30 M146.7,30l10.8,17.2l-21.6-13.6"/>
223
+ <circle class="fish-glow-dot" cx="130" cy="45" r="5" />
224
+ <circle class="fish-glow-dot" cx="145" cy="70" r="4" />
225
+ <circle class="fish-glow-dot" cx="110" cy="85" r="4" />
226
+ </g>
227
+ </svg>
228
+ </div>
229
+ </div>
230
+
231
+ <div class="top-right">
232
+ <div class="info-box">
233
+ <h2 class="box-title">
234
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-12h2v4h-2zm0 6h2v2h-2zm-5-2h2v2H6zm10 0h2v2h-2zM12 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>
235
+ <span>Objetivo Principal</span>
236
+ </h2>
237
+ <div class="box-content">
238
+ <ul>
239
+ <li>Agrupar y representar a los biotecnólogos del país.</li>
240
+ <li>Regular la práctica profesional en salud y biomedicina.</li>
241
+ <li>Establecer estándares éticos y profesionales de alto nivel.</li>
242
+ </ul>
243
+ </div>
244
+ </div>
245
+ <div class="info-box">
246
+ <h2 class="box-title">
247
+ <svg class="icon" viewBox="0 0 24 24"><path d="M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z"/></svg>
248
+ <span>Contexto Académico</span>
249
+ </h2>
250
+ <div class="box-content">
251
+ <ul>
252
+ <li>Base robusta con más de 11 universidades ofertando la carrera.</li>
253
+ <li>Graduados calificados sin una estructura gremial previa.</li>
254
+ <li>Alto potencial de transferencia tecnológica universidad-industria.</li>
255
+ </ul>
256
+ </div>
257
+ </div>
258
+ </div>
259
+
260
+ <div class="bottom-row">
261
+ <div class="info-box">
262
+ <h2 class="box-title">
263
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 10.99h7c-.53 4.12-3.28 7.79-7 8.94V12H5V6.3l
slides/slide06_caso_ecuador_quality_check_1750783496.png ADDED

Git LFS Details

  • SHA256: 6335fdd7aece7b6e5f1ed158764f74afae5c987331ae2183e019c492fb23f038
  • Pointer size: 131 Bytes
  • Size of remote file: 318 kB
slides/slide06_caso_ecuador_quality_check_1750783598.png ADDED

Git LFS Details

  • SHA256: 58447766d0ea831d406f0ad32b00bee8c3dd6b9303a9ecc85fd20631238bfafb
  • Pointer size: 131 Bytes
  • Size of remote file: 133 kB
slides/slide07_ecosistema_academico.html ADDED
@@ -0,0 +1,303 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Ecosistema Académico Global en Biotecnología</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ display: flex;
14
+ justify-content: center;
15
+ align-items: center;
16
+ height: 100vh;
17
+ background-color: #f0f2f5;
18
+ font-family: 'Poppins', sans-serif;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background: linear-gradient(135deg, #e0f7fa 0%, #f0f4c3 100%);
25
+ display: flex;
26
+ flex-direction: column;
27
+ overflow: hidden;
28
+ position: relative;
29
+ box-shadow: 0 10px 30px rgba(0,0,0,0.1);
30
+ animation: fadeIn 1s ease-in-out;
31
+ }
32
+
33
+ @keyframes fadeIn {
34
+ from { opacity: 0; transform: scale(0.95); }
35
+ to { opacity: 1; transform: scale(1); }
36
+ }
37
+
38
+ .header {
39
+ padding: 20px 50px;
40
+ text-align: center;
41
+ color: #003366;
42
+ border-bottom: 2px solid rgba(0, 83, 156, 0.1);
43
+ }
44
+
45
+ .header h1 {
46
+ font-size: 36px;
47
+ margin: 0;
48
+ font-weight: 700;
49
+ }
50
+
51
+ .header h2 {
52
+ font-size: 18px;
53
+ margin: 5px 0 0;
54
+ font-weight: 400;
55
+ color: #00539c;
56
+ }
57
+
58
+ .main-content {
59
+ display: grid;
60
+ grid-template-columns: repeat(4, 1fr);
61
+ grid-template-rows: auto auto;
62
+ gap: 15px;
63
+ padding: 20px;
64
+ flex-grow: 1;
65
+ }
66
+
67
+ .region-card {
68
+ background-color: rgba(255, 255, 255, 0.8);
69
+ border-radius: 12px;
70
+ padding: 15px;
71
+ border: 1px solid rgba(0,0,0,0.05);
72
+ box-shadow: 0 4px 12px rgba(0,0,0,0.05);
73
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
74
+ }
75
+
76
+ .region-card:hover {
77
+ transform: translateY(-5px);
78
+ box-shadow: 0 8px 20px rgba(0,0,0,0.1);
79
+ }
80
+
81
+ .region-card h3 {
82
+ margin: 0 0 10px 0;
83
+ font-size: 16px;
84
+ font-weight: 600;
85
+ display: flex;
86
+ align-items: center;
87
+ border-bottom: 2px solid;
88
+ padding-bottom: 8px;
89
+ }
90
+
91
+ .region-card h3 .icon {
92
+ width: 20px;
93
+ height: 20px;
94
+ margin-right: 8px;
95
+ }
96
+
97
+ .region-card ul {
98
+ margin: 0;
99
+ padding-left: 20px;
100
+ font-size: 13px;
101
+ color: #333;
102
+ }
103
+
104
+ .region-card ul li {
105
+ margin-bottom: 6px;
106
+ line-height: 1.4;
107
+ }
108
+
109
+ .region-card ul li::marker {
110
+ font-size: 1.2em;
111
+ }
112
+
113
+ #ecuador { grid-column: 1 / 2; grid-row: 1 / 2; border-left: 5px solid #FFC107; }
114
+ #ecuador h3 { color: #D4A000; border-color: #FFC107; }
115
+ #latam { grid-column: 2 / 3; grid-row: 1 / 2; border-left: 5px solid #28A745; }
116
+ #latam h3 { color: #1E7E34; border-color: #28A745; }
117
+ #global { grid-column: 1 / 2; grid-row: 2 / 3; border-left: 5px solid #007BFF; }
118
+ #global h3 { color: #0056B3; border-color: #007BFF; }
119
+ #apac { grid-column: 2 / 3; grid-row: 2 / 3; border-left: 5px solid #DC3545; }
120
+ #apac h3 { color: #B02A37; border-color: #DC3545; }
121
+
122
+ .map-container {
123
+ grid-column: 3 / 5;
124
+ grid-row: 1 / 3;
125
+ display: flex;
126
+ justify-content: center;
127
+ align-items: center;
128
+ position: relative;
129
+ }
130
+
131
+ #world-map {
132
+ width: 100%;
133
+ height: auto;
134
+ }
135
+
136
+ #world-map .land {
137
+ fill: #b2dfdb; /* Light teal for land */
138
+ stroke: #ffffff;
139
+ stroke-width: 0.5;
140
+ }
141
+
142
+ .map-marker {
143
+ fill: rgba(220, 53, 69, 0.8); /* Red marker */
144
+ stroke: white;
145
+ stroke-width: 0.5px;
146
+ animation: pulse 2s infinite;
147
+ cursor: pointer;
148
+ }
149
+
150
+ .map-marker-usa { fill: rgba(0, 123, 255, 0.8); } /* Blue for USA */
151
+ .map-marker-eu { fill: rgba(0, 123, 255, 0.8); } /* Blue for Europe */
152
+ .map-marker-latam { fill: rgba(40, 167, 69, 0.8); } /* Green for Latam */
153
+ .map-marker-apac { fill: rgba(220, 53, 69, 0.8); } /* Red for APAC */
154
+ .map-marker-ecu { fill: rgba(255, 193, 7, 0.9); } /* Yellow for Ecuador */
155
+
156
+
157
+ @keyframes pulse {
158
+ 0% { r: 3; opacity: 1; }
159
+ 50% { r: 6; opacity: 0.5; }
160
+ 100% { r: 3; opacity: 1; }
161
+ }
162
+
163
+ .footer {
164
+ display: grid;
165
+ grid-template-columns: 1fr 1.5fr;
166
+ gap: 20px;
167
+ padding: 0 20px 20px 20px;
168
+ align-items: stretch;
169
+ }
170
+
171
+ .conclusion-box, .factors-box, .flow-box {
172
+ background-color: rgba(255, 255, 255, 0.8);
173
+ border-radius: 12px;
174
+ padding: 15px;
175
+ border: 1px solid rgba(0,0,0,0.05);
176
+ box-shadow: 0 4px 12px rgba(0,0,0,0.05);
177
+ }
178
+
179
+ .bottom-container {
180
+ grid-column: 1 / 5;
181
+ display: flex;
182
+ gap: 15px;
183
+ align-items: stretch;
184
+ }
185
+
186
+ .flow-box {
187
+ flex: 2;
188
+ border-top: 5px solid #6f42c1;
189
+ }
190
+ .flow-chart {
191
+ display: flex;
192
+ justify-content: space-around;
193
+ align-items: center;
194
+ height: 100%;
195
+ }
196
+ .flow-item {
197
+ text-align: center;
198
+ color: #6f42c1;
199
+ font-weight: 600;
200
+ }
201
+ .flow-item .icon {
202
+ width: 40px;
203
+ height: 40px;
204
+ margin-bottom: 5px;
205
+ fill: #6f42c1;
206
+ }
207
+ .flow-arrow {
208
+ font-size: 30px;
209
+ color: #6f42c1;
210
+ font-weight: bold;
211
+ opacity: 0.5;
212
+ }
213
+
214
+ .conclusion-box {
215
+ flex: 1.5;
216
+ border-top: 5px solid #17a2b8;
217
+ display: flex;
218
+ flex-direction: column;
219
+ justify-content: center;
220
+ }
221
+ .conclusion-box h4 {
222
+ margin: 0 0 5px 0;
223
+ font-size: 16px;
224
+ color: #0f6674;
225
+ }
226
+ .conclusion-box p {
227
+ margin: 0;
228
+ font-size: 16px;
229
+ font-style: italic;
230
+ text-align: center;
231
+ color: #0f6674;
232
+ font-weight: 600;
233
+ }
234
+
235
+ .factors-box {
236
+ flex: 1.5;
237
+ border-top: 5px solid #fd7e14;
238
+ }
239
+ .factors-box h4 {
240
+ margin: 0 0 10px 0;
241
+ font-size: 16px;
242
+ color: #c4610f;
243
+ }
244
+ .factors-box ul {
245
+ margin: 0;
246
+ padding-left: 20px;
247
+ font-size: 13px;
248
+ color: #333;
249
+ list-style-type: '✓ ';
250
+ }
251
+ .factors-box ul li {
252
+ margin-bottom: 2px;
253
+ }
254
+ </style>
255
+ </head>
256
+ <body>
257
+ <div class="slide">
258
+ <div class="header">
259
+ <h1>Ecosistema Académico Global en Biotecnología</h1>
260
+ <h2>Base educativa como fundamento del desarrollo industrial</h2>
261
+ </div>
262
+
263
+ <div class="main-content">
264
+ <div class="region-card" id="ecuador">
265
+ <h3><svg class="icon" viewBox="0 0 24 24"><path fill="currentColor" d="M12,3L1,9L12,15L21,10.09V17H23V9L12,3M5,10.18L12,13.72L19,10.18L12,6.63L5,10.18Z" /></svg>Ecuador</h3>
266
+ <ul>
267
+ <li>11+ universidades con programas consolidados</li>
268
+ <li>Fortaleza en formación pero brecha de transferencia</li>
269
+ <li>Potencial para COBIEC como catalizador</li>
270
+ </ul>
271
+ </div>
272
+
273
+ <div class="region-card" id="latam">
274
+ <h3><svg class="icon" viewBox="0 0 24 24"><path fill="currentColor" d="M12,2C6.48,2 2,6.48 2,12s4.48,10 10,10s10,-4.48 10,-10S17.52,2 12,2zM13,12c0,3.31 -2.69,6 -6,6c-0.34,0 -0.67,-0.03 -1,-0.08C6.32,14.26 8.94,12 12,12c0.34,0 0.67,0.03 1,0.08c-0.32,3.72 -3.26,6.66 -7,6.92C3.18,17.43 2,14.86 2,12c0,-2.03 0.63,-3.9 1.69,-5.43C5.63,7.5 8.5,10.43 8.08,14c0.33,-0.05 0.66,-0.08 1,-0.08c3.31,0 6,-2.69 6,-6c0.34,0 0.67,0.03 1,0.08c-0.42,-3.57 2.2,-6.3 5.31,-6.63C16.37,3.63 14.03,6 11,6c-0.34,0 -0.67,-0.03 -1,-0.08c0.32,-3.72 3.26,-6.66 7,-6.92C19.82,4.57 22,8.14 22,12c0,2.03 -0.63,3.9 -1.69,5.43c-1.92,-0.92 -3.5,-2.59 -4.31,-4.5C14.5,10.43 11.5,7.5 11.92,4c-0.33,0.05 -0.66,0.08 -1,0.08C7.69,4 5,6.69 5,10c0,-0.34 -0.03,-0.67 -0.08,-1C8.74,8.68 12,5.45 12,2z" /></svg>Líderes Regionales: América Latina</h3>
275
+ <ul>
276
+ <li><b>Brasil:</b> Líder regional con ecosistema robusto</li>
277
+ <li><b>México:</b> Base académica sólida y sector industrial creciente</li>
278
+ <li><b>Argentina:</b> Modelo provincial avanzado (Colegio Santafesino)</li>
279
+ </ul>
280
+ </div>
281
+
282
+ <div class="region-card" id="global">
283
+ <h3><svg class="icon" viewBox="0 0 24 24"><path fill="currentColor" d="M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z" /></svg>Potencias Globales</h3>
284
+ <ul>
285
+ <li><b>EE.UU.:</b> MIT, Harvard, Stanford - Ecosistema integrado</li>
286
+ <li><b>Reino Unido:</b> Cambridge, Oxford - Excelencia investigativa</li>
287
+ <li><b>Suiza:</b> ETH Zurich - Modelo de alta eficiencia</li>
288
+ <li><b>Alemania:</b> Sistema descentralizado de BioRegions</li>
289
+ </ul>
290
+ </div>
291
+
292
+ <div class="region-card" id="apac">
293
+ <h3><svg class="icon" viewBox="0 0 24 24"><path fill="currentColor" d="M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z" /></svg>Asia-Pacífico Emergente</h3>
294
+ <ul>
295
+ <li><b>Japón:</b> U. de Tokio - Biotecnología médica</li>
296
+ <li><b>Corea del Sur:</b> U. Nacional de Seúl - Liderazgo en patentes</li>
297
+ <li><b>Australia:</b> Melbourne, Queensland - Crecimiento acelerado</li>
298
+ </ul>
299
+ </div>
300
+
301
+ <div class="map-container">
302
+ <svg id="world-map" viewBox="0 0 1000 500">
303
+ <path class="land" d="M632.5 425.8l-5.6-3.8-2.3-4.2-2.3-4.2-3.4-3.8-2.3-4.2-3.1-3.8-2.3-4.2-2.3-4.2-3.1-3.8-2.3-4.2-2.3-4.2-3.4-3.8-3.1-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-4.2-2.3-4.2-3.1-3.8-3.4-3.8-2.3-
slides/slide07_ecosistema_academico_quality_check_1750783704.png ADDED

Git LFS Details

  • SHA256: f0c2c3ad48c66fa92a47cc538a10774305a5c9016efed23c5eaf7fd1e8c96959
  • Pointer size: 131 Bytes
  • Size of remote file: 336 kB
slides/slide08_indicadores.html ADDED
@@ -0,0 +1,327 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Indicadores Clave del Desarrollo Biotecnológico</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ background-color: #f0f0f0;
14
+ display: flex;
15
+ justify-content: center;
16
+ align-items: center;
17
+ height: 100vh;
18
+ font-family: 'Poppins', sans-serif;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background: linear-gradient(135deg, #0A1931 0%, #182848 100%);
25
+ color: #E0E0E0;
26
+ display: flex;
27
+ flex-direction: column;
28
+ padding: 40px;
29
+ box-sizing: border-box;
30
+ position: relative;
31
+ overflow: hidden;
32
+ }
33
+
34
+ @keyframes fadeIn {
35
+ from { opacity: 0; }
36
+ to { opacity: 1; }
37
+ }
38
+
39
+ @keyframes slideUp {
40
+ from { transform: translateY(20px); opacity: 0; }
41
+ to { transform: translateY(0); opacity: 1; }
42
+ }
43
+
44
+ .slide-header {
45
+ animation: fadeIn 1s ease-out;
46
+ padding-bottom: 20px;
47
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
48
+ }
49
+
50
+ .slide-header h1 {
51
+ font-size: 36px;
52
+ margin: 0;
53
+ color: #FFFFFF;
54
+ font-weight: 700;
55
+ }
56
+
57
+ .slide-header h2 {
58
+ font-size: 18px;
59
+ margin: 5px 0 0 0;
60
+ color: #A0B0C0;
61
+ font-weight: 400;
62
+ }
63
+
64
+ .slide-content {
65
+ display: grid;
66
+ grid-template-columns: 1fr 1.2fr 1fr;
67
+ gap: 25px;
68
+ flex-grow: 1;
69
+ padding-top: 25px;
70
+ }
71
+
72
+ .card {
73
+ background-color: rgba(255, 255, 255, 0.03);
74
+ border: 1px solid rgba(255, 255, 255, 0.1);
75
+ border-radius: 12px;
76
+ padding: 20px;
77
+ box-sizing: border-box;
78
+ display: flex;
79
+ flex-direction: column;
80
+ animation: slideUp 0.8s ease-out forwards;
81
+ opacity: 0;
82
+ }
83
+
84
+ .card:nth-child(1) { animation-delay: 0.2s; }
85
+ .card:nth-child(2) { animation-delay: 0.3s; }
86
+ .card:nth-child(3) { animation-delay: 0.4s; }
87
+ .card:nth-child(4) { animation-delay: 0.5s; }
88
+ .card:nth-child(5) { animation-delay: 0.6s; }
89
+
90
+ .card-title {
91
+ font-size: 18px;
92
+ font-weight: 600;
93
+ color: #4DD0E1;
94
+ margin: 0 0 15px 0;
95
+ display: flex;
96
+ align-items: center;
97
+ }
98
+
99
+ .card-title svg {
100
+ margin-right: 10px;
101
+ width: 22px;
102
+ height: 22px;
103
+ }
104
+
105
+ .card ul {
106
+ list-style: none;
107
+ padding: 0;
108
+ margin: 0;
109
+ font-size: 14px;
110
+ line-height: 1.7;
111
+ }
112
+
113
+ .card ul li {
114
+ padding-left: 20px;
115
+ position: relative;
116
+ margin-bottom: 8px;
117
+ }
118
+
119
+ .card ul li::before {
120
+ content: '•';
121
+ position: absolute;
122
+ left: 0;
123
+ color: #FFCA28;
124
+ font-size: 18px;
125
+ line-height: 1;
126
+ }
127
+
128
+ .highlight {
129
+ color: #FFCA28;
130
+ font-weight: 600;
131
+ }
132
+
133
+ .column-1, .column-2, .column-3 {
134
+ display: flex;
135
+ flex-direction: column;
136
+ gap: 25px;
137
+ }
138
+
139
+ /* Patent Chart Styles */
140
+ .patent-chart {
141
+ list-style: none;
142
+ padding: 0;
143
+ margin: 0;
144
+ width: 100%;
145
+ }
146
+ .patent-item {
147
+ margin-bottom: 12px;
148
+ animation: slideUp 0.8s ease-out forwards;
149
+ opacity: 0;
150
+ }
151
+ .patent-item:nth-child(1) { animation-delay: 0.5s; }
152
+ .patent-item:nth-child(2) { animation-delay: 0.6s; }
153
+ .patent-item:nth-child(3) { animation-delay: 0.7s; }
154
+ .patent-item:nth-child(4) { animation-delay: 0.8s; }
155
+
156
+ .patent-label {
157
+ display: flex;
158
+ justify-content: space-between;
159
+ font-size: 14px;
160
+ margin-bottom: 5px;
161
+ }
162
+ .patent-bar-container {
163
+ background-color: rgba(0, 0, 0, 0.2);
164
+ border-radius: 4px;
165
+ height: 20px;
166
+ overflow: hidden;
167
+ }
168
+ @keyframes growBar {
169
+ from { width: 0%; }
170
+ to { /* width is set inline */ }
171
+ }
172
+ .patent-bar {
173
+ height: 100%;
174
+ background: linear-gradient(90deg, #29B6F6 0%, #4DD0E1 100%);
175
+ border-radius: 4px;
176
+ animation: growBar 1.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
177
+ }
178
+
179
+ /* Investment Chart Styles */
180
+ .investment-chart-container {
181
+ flex-grow: 1;
182
+ display: flex;
183
+ flex-direction: column;
184
+ justify-content: flex-end;
185
+ }
186
+ .chart-body {
187
+ display: flex;
188
+ justify-content: space-around;
189
+ align-items: flex-end;
190
+ height: 100%;
191
+ border-bottom: 1px solid #A0B0C0;
192
+ padding-bottom: 5px;
193
+ gap: 15px;
194
+ }
195
+ @keyframes growBarVertical {
196
+ from { height: 0%; }
197
+ to { /* height is set inline */ }
198
+ }
199
+ .chart-bar {
200
+ width: 35px;
201
+ background: linear-gradient(180deg, #4DD0E1 0%, #29B6F6 100%);
202
+ border-radius: 5px 5px 0 0;
203
+ animation: growBarVertical 1.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
204
+ }
205
+ .chart-labels {
206
+ display: flex;
207
+ justify-content: space-around;
208
+ font-size: 12px;
209
+ color: #A0B0C0;
210
+ padding-top: 5px;
211
+ gap: 15px;
212
+ }
213
+ .chart-label-item {
214
+ flex: 1;
215
+ text-align: center;
216
+ }
217
+
218
+ </style>
219
+ </head>
220
+ <body>
221
+
222
+ <div class="slide">
223
+ <div class="slide-header">
224
+ <h1>Indicadores Clave del Desarrollo Biotecnológico</h1>
225
+ <h2>Datos Actualizados 2023-2024</h2>
226
+ </div>
227
+
228
+ <div class="slide-content">
229
+ <div class="column-1">
230
+ <div class="card" style="animation-delay: 0.2s;">
231
+ <h3 class="card-title">
232
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#FFCA28"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.09V20h-2.82v-3.91c-1.7-.44-3-1.99-3-3.86 0-2.21 1.79-4 4-4s4 1.79 4 4c0 1.87-1.3 3.42-3 3.86zM12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg>
233
+ Inversión Global 2023-2024
234
+ </h3>
235
+ <ul>
236
+ <li>EE.UU: <span class="highlight">$15.2B</span> en capital de riesgo.</li>
237
+ <li>Europa: <span class="highlight">€99.5B</span> contribución al PIB (UE27).</li>
238
+ <li>Tendencias: Mercado de IPOs selectivo, foco en terapias avanzadas.</li>
239
+ </ul>
240
+ </div>
241
+ <div class="card" style="animation-delay: 0.3s;">
242
+ <h3 class="card-title">
243
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#4DD0E1"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>
244
+ Empleo y Impacto Económico
245
+ </h3>
246
+ <ul>
247
+ <li>UE27: <span class="highlight">825,000</span> empleos totales.</li>
248
+ <li>Crecimiento sostenido en biotecnología médica.</li>
249
+ <li>Expansión en biotecnología industrial y ambiental.</li>
250
+ </ul>
251
+ </div>
252
+ </div>
253
+
254
+ <div class="column-2">
255
+ <div class="card" style="flex-grow: 1; animation-delay: 0.4s;">
256
+ <h3 class="card-title">Emerging Therapeutic Company Investment Trends</h3>
257
+ <div class="investment-chart-container">
258
+ <div class="chart-body">
259
+ <div class="chart-bar" style="height: 45%; animation-delay: 0.5s;"></div>
260
+ <div class="chart-bar" style="height: 60%; animation-delay: 0.6s;"></div>
261
+ <div class="chart-bar" style="height: 55%; animation-delay: 0.7s;"></div>
262
+ <div class="chart-bar" style="height: 80%; animation-delay: 0.8s;"></div>
263
+ <div class="chart-bar" style="height: 95%; animation-delay: 0.9s;"></div>
264
+ <div class="chart-bar" style="height: 75%; animation-delay: 1.0s;"></div>
265
+ </div>
266
+ <div class="chart-labels">
267
+ <div class="chart-label-item">2019</div>
268
+ <div class="chart-label-item">2020</div>
269
+ <div class="chart-label-item">2021</div>
270
+ <div class="chart-label-item">2022</div>
271
+ <div class="chart-label-item">2023</div>
272
+ <div class="chart-label-item">2024</div>
273
+ </div>
274
+ </div>
275
+ </div>
276
+ <div class="card" style="animation-delay: 0.5s;">
277
+ <h3 class="card-title">Análisis</h3>
278
+ <ul>
279
+ <li>Consolidación del sector: Fusiones y adquisiciones.</li>
280
+ <li>Foco en sostenibilidad: Biotecnología verde.</li>
281
+ <li>Digitalización: IA aplicada a la biotecnología.</li>
282
+ </ul>
283
+ </div>
284
+ </div>
285
+
286
+ <div class="column-3">
287
+ <div class="card" style="animation-delay: 0.6s;">
288
+ <h3 class="card-title">
289
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#4DD0E1"><path d="M4 19h16v-7h-4v3h-2v-3h-4v3H8v-3H4v7zm0-9h16V4H4v6zm2-4h2v2H6V6zm4 0h2v2h-2V6zm4 0h2v2h-2V6z"/></svg>
290
+ Patentes y Innovación (2022)
291
+ </h3>
292
+ <ul class="patent-chart">
293
+ <li class="patent-item">
294
+ <div class="patent-label"><span>Corea del Sur</span><span>1,407</span></div>
295
+ <div class="patent-bar-container"><div class="patent-bar" style="width: 100%;"></div></div>
296
+ </li>
297
+ <li class="patent-item">
298
+ <div class="patent-label"><span>Alemania</span><span>659</span></div>
299
+ <div class="patent-bar-container"><div class="patent-bar" style="width: 46.8%;"></div></div>
300
+ </li>
301
+ <li class="patent-item">
302
+ <div class="patent-label"><span>Francia</span><span>528</span></div>
303
+ <div class="patent-bar-container"><div class="patent-bar" style="width: 37.5%;"></div></div>
304
+ </li>
305
+ <li class="patent-item">
306
+ <div class="patent-label"><span>Canadá</span><span>309</span></div>
307
+ <div class="patent-bar-container"><div class="patent-bar" style="width: 21.9%;"></div></div>
308
+ </li>
309
+ </ul>
310
+ </div>
311
+ <div class="card" style="animation-delay: 0.7s;">
312
+ <h3 class="card-title">
313
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#FFCA28"><path d="M14 6V4h-4v2h4zM4 8v11h16V8H4zm16-2c1.11 0 2 .89 2 2v11c0 1.11-.89 2-2 2H4c-1.11 0-2-.89-2-2V8c0-1.11.89-2 2-2h3V4c0-1.11.89-2 2-2h6c1.11 0 2 .89 2 2v2h3z"/></svg>
314
+ Modelos de Intensidad I+D
315
+ </h3>
316
+ <ul>
317
+ <li>Suiza: <span class="highlight">13.6 M USD</span> por empresa.</li>
318
+ <li>Alemania: <span class="highlight">5.6 M USD</span> por empresa.</li>
319
+ <li>España: <span class="highlight">1.2 M USD</span> por empresa.</li>
320
+ </ul>
321
+ </div>
322
+ </div>
323
+ </div>
324
+ </div>
325
+
326
+ </body>
327
+ </html>
slides/slide08_indicadores_quality_check_1750783799.png ADDED

Git LFS Details

  • SHA256: 61c33f4df70db026577e1553302c57edaac2067f9052652d8412e3cf6cffe1fd
  • Pointer size: 131 Bytes
  • Size of remote file: 382 kB
slides/slide08_indicadores_quality_check_1750783888.png ADDED
slides/slide08_indicadores_quality_check_1750783973.png ADDED

Git LFS Details

  • SHA256: 0eeaf9573dcce3f9f4c2ea279e84b1f23cf2693e246e7d15b8605ae0cf33ec29
  • Pointer size: 131 Bytes
  • Size of remote file: 384 kB
slides/slide09_brechas_oportunidades.html ADDED
@@ -0,0 +1,367 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Análisis de Brechas y Oportunidades</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
9
+
10
+ :root {
11
+ --bg-color: #1A1F2B;
12
+ --panel-bg-color: #232937;
13
+ --text-color: #E0E0E0;
14
+ --text-secondary-color: #A0AEC0;
15
+ --accent-blue: #4A90E2;
16
+ --accent-green: #50E3C2;
17
+ --accent-purple: #9013FE;
18
+ --accent-pink: #F53877;
19
+ --accent-red: #D0021B;
20
+ --accent-yellow: #F8E71C;
21
+ }
22
+
23
+ body, html {
24
+ margin: 0;
25
+ padding: 0;
26
+ width: 100%;
27
+ height: 100%;
28
+ display: flex;
29
+ align-items: center;
30
+ justify-content: center;
31
+ background-color: #111;
32
+ font-family: 'Poppins', sans-serif;
33
+ }
34
+
35
+ .slide {
36
+ width: 1280px;
37
+ height: 720px;
38
+ background-color: var(--bg-color);
39
+ color: var(--text-color);
40
+ display: flex;
41
+ flex-direction: column;
42
+ padding: 40px;
43
+ box-sizing: border-box;
44
+ animation: fadeIn 1s ease-in-out;
45
+ }
46
+
47
+ @keyframes fadeIn {
48
+ from { opacity: 0; transform: scale(0.95); }
49
+ to { opacity: 1; transform: scale(1); }
50
+ }
51
+
52
+ header {
53
+ text-align: left;
54
+ margin-bottom: 25px;
55
+ }
56
+
57
+ h1 {
58
+ font-size: 44px;
59
+ font-weight: 700;
60
+ margin: 0;
61
+ color: var(--text-color);
62
+ }
63
+
64
+ h1 .highlight-pink {
65
+ background: linear-gradient(90deg, var(--accent-pink), #BE3ECF);
66
+ -webkit-background-clip: text;
67
+ -webkit-text-fill-color: transparent;
68
+ background-clip: text;
69
+ text-fill-color: transparent;
70
+ }
71
+
72
+ h1 .highlight-green {
73
+ background: linear-gradient(90deg, #62F7B3, var(--accent-green));
74
+ -webkit-background-clip: text;
75
+ -webkit-text-fill-color: transparent;
76
+ background-clip: text;
77
+ text-fill-color: transparent;
78
+ }
79
+
80
+ .subtitle {
81
+ font-size: 18px;
82
+ font-weight: 400;
83
+ color: var(--text-secondary-color);
84
+ margin-top: 5px;
85
+ }
86
+
87
+ .content-grid {
88
+ display: grid;
89
+ grid-template-columns: 1fr 1fr;
90
+ grid-template-rows: 1fr 1fr;
91
+ gap: 24px;
92
+ flex-grow: 1;
93
+ }
94
+
95
+ .panel {
96
+ background-color: var(--panel-bg-color);
97
+ border-radius: 16px;
98
+ padding: 20px 24px;
99
+ display: flex;
100
+ flex-direction: column;
101
+ box-shadow: 0 4px 12px rgba(0,0,0,0.1);
102
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
103
+ }
104
+ .panel:hover {
105
+ transform: translateY(-5px);
106
+ box-shadow: 0 8px 20px rgba(0,0,0,0.15);
107
+ }
108
+
109
+ .panel-title {
110
+ font-size: 20px;
111
+ font-weight: 600;
112
+ margin-bottom: 15px;
113
+ display: flex;
114
+ align-items: center;
115
+ gap: 10px;
116
+ }
117
+
118
+ .icon {
119
+ font-size: 22px;
120
+ }
121
+
122
+ .panel-content {
123
+ display: flex;
124
+ gap: 20px;
125
+ flex-grow: 1;
126
+ }
127
+
128
+ .column {
129
+ flex: 1;
130
+ display: flex;
131
+ flex-direction: column;
132
+ }
133
+
134
+ .column h4 {
135
+ font-size: 16px;
136
+ color: var(--accent-blue);
137
+ margin-top: 0;
138
+ margin-bottom: 10px;
139
+ font-weight: 500;
140
+ }
141
+
142
+ ul {
143
+ list-style: none;
144
+ padding: 0;
145
+ margin: 0;
146
+ }
147
+
148
+ li {
149
+ font-size: 14px;
150
+ color: var(--text-secondary-color);
151
+ margin-bottom: 10px;
152
+ display: flex;
153
+ align-items: flex-start;
154
+ gap: 8px;
155
+ line-height: 1.5;
156
+ }
157
+
158
+ li .li-icon {
159
+ font-size: 16px;
160
+ line-height: 1.5;
161
+ min-width: 16px;
162
+ text-align: center;
163
+ }
164
+
165
+ .li-icon.up { color: var(--accent-green); }
166
+ .li-icon.down { color: var(--accent-pink); }
167
+ .li-icon.neutral { color: var(--accent-yellow); }
168
+ .li-icon.link { color: var(--accent-blue); }
169
+ .li-icon.info { color: var(--text-secondary-color); }
170
+
171
+ .bar-chart {
172
+ width: 100%;
173
+ display: flex;
174
+ flex-direction: column;
175
+ gap: 12px;
176
+ margin-top: 5px;
177
+ }
178
+
179
+ .bar-item {
180
+ display: flex;
181
+ align-items: center;
182
+ gap: 10px;
183
+ }
184
+
185
+ .bar-label {
186
+ width: 100px;
187
+ font-size: 14px;
188
+ color: var(--text-secondary-color);
189
+ text-align: right;
190
+ }
191
+
192
+ .bar-container {
193
+ flex-grow: 1;
194
+ height: 22px;
195
+ background-color: #333948;
196
+ border-radius: 4px;
197
+ display: flex;
198
+ align-items: center;
199
+ }
200
+
201
+ .bar {
202
+ height: 100%;
203
+ border-radius: 4px;
204
+ display: flex;
205
+ align-items: center;
206
+ justify-content: flex-end;
207
+ padding-right: 8px;
208
+ box-sizing: border-box;
209
+ color: white;
210
+ font-size: 12px;
211
+ font-weight: 600;
212
+ transition: width 1s ease-in-out;
213
+ }
214
+ .bar-1 { background: linear-gradient(90deg, #A855F7, #D946EF); width: 100%; }
215
+ .bar-2 { background: linear-gradient(90deg, #60A5FA, #3B82F6); width: 68.5%; }
216
+ .bar-3 { background: linear-gradient(90deg, #A3A3A3, #737373); width: 60.5%; }
217
+ .bar-4 { background: linear-gradient(90deg, #F97316, #EA580C); width: 35%; }
218
+ .bar-5 { background: linear-gradient(90deg, #EF4444, #DC2626); width: 6%; }
219
+
220
+ .radar-chart-container {
221
+ flex-grow: 1;
222
+ display: flex;
223
+ align-items: center;
224
+ justify-content: center;
225
+ }
226
+
227
+ .radar-chart {
228
+ animation: scaleUp 1s ease-in-out;
229
+ }
230
+
231
+ @keyframes scaleUp {
232
+ from { transform: scale(0.5); opacity: 0; }
233
+ to { transform: scale(1); opacity: 1; }
234
+ }
235
+
236
+ </style>
237
+ </head>
238
+ <body>
239
+ <div class="slide">
240
+ <header>
241
+ <h1>Análisis de <span class="highlight-pink">Brechas</span> y <span class="highlight-green">Oportunidades</span></h1>
242
+ <p class="subtitle">Patrones de desarrollo y potencial de crecimiento en la biotecnología global</p>
243
+ </header>
244
+ <main class="content-grid">
245
+
246
+ <section class="panel">
247
+ <h3 class="panel-title"><span class="icon">🌍</span>Casos Paradigmáticos</h3>
248
+ <div class="panel-content">
249
+ <div class="column">
250
+ <h4>El "Paradox Español"</h4>
251
+ <ul>
252
+ <li><span class="li-icon up">▲</span>1,233 empresas (3er lugar europeo)</li>
253
+ <li><span class="li-icon down">▼</span>Baja intensidad I+D (1.4 B USD)</li>
254
+ <li><span class="li-icon down">▼</span>Productividad limitada (24 patentes/prog)</li>
255
+ <li><span class="li-icon info">ⓘ</span>Diagnóstico: Dificultad de escalamiento</li>
256
+ </ul>
257
+ </div>
258
+ <div class="column">
259
+ <h4>El Potencial Ecuatoriano</h4>
260
+ <ul>
261
+ <li><span class="li-icon up">▲</span>11+ universidades con base sólida</li>
262
+ <li><span class="li-icon down">▼</span>Sector empresarial biotecnológico incipiente</li>
263
+ <li><span class="li-icon neutral">💡</span>Oportunidad: Catalizar transferencia tec.</li>
264
+ <li><span class="li-icon link">🔗</span>Palanca: Estándares y conexión intl.</li>
265
+ </ul>
266
+ </div>
267
+ </div>
268
+ </section>
269
+
270
+ <section class="panel">
271
+ <h3 class="panel-title"><span class="icon">🏆</span>Modelos y Variables Clave</h3>
272
+ <div class="panel-content">
273
+ <div class="column">
274
+ <h4>Modelos de Excelencia (DEU & CHE)</h4>
275
+ <ul>
276
+ <li><span class="li-icon neutral">💰</span>Inversión intensiva (>5M USD/empresa)</li>
277
+ <li><span class="li-icon link">🤝</span>Integración U-Industria sistemática</li>
278
+ <li><span class="li-icon info">🎯</span>Especialización en nichos de alto valor</li>
279
+ <li><span class="li-icon up">⚖️</span>Marco regulatorio robusto con incentivos</li>
280
+ </ul>
281
+ </div>
282
+ <div class="column">
283
+ <h4>Variables Críticas Identificadas</h4>
284
+ <ul>
285
+ <li><span class="li-icon up">🎓</span>Calidad académica > Cantidad</li>
286
+ <li><span class="li-icon up">💸</span>Disponibilidad de venture capital</li>
287
+ <li><span class="li-icon link">📜</span>Marcos para university spin-offs</li>
288
+ <li><span class="li-icon neutral">🛡️</span>Protección de propiedad intelectual</li>
289
+ </ul>
290
+ </div>
291
+ </div>
292
+ </section>
293
+
294
+ <section class="panel">
295
+ <h3 class="panel-title"><span class="icon">📊</span>Productividad Académica (Patentes PCT/Programa)</h3>
296
+ <div class="panel-content" style="padding-top: 10px;">
297
+ <div class="bar-chart">
298
+ <div class="bar-item">
299
+ <span class="bar-label">Corea del Sur</span>
300
+ <div class="bar-container"><div class="bar bar-1">400</div></div>
301
+ </div>
302
+ <div class="bar-item">
303
+ <span class="bar-label">EE. UU.</span>
304
+ <div class="bar-container"><div class="bar bar-2">274</div></div>
305
+ </div>
306
+ <div class="bar-item">
307
+ <span class="bar-label">Alemania</span>
308
+ <div class="bar-container"><div class="bar bar-3">242</div></div>
309
+ </div>
310
+ <div class="bar-item">
311
+ <span class="bar-label">Francia</span>
312
+ <div class="bar-container"><div class="bar bar-4">140</div></div>
313
+ </div>
314
+ <div class="bar-item">
315
+ <span class="bar-label">España</span>
316
+ <div class="bar-container"><div class="bar bar-5">24</div></div>
317
+ </div>
318
+ </div>
319
+ </div>
320
+ </section>
321
+
322
+ <section class="panel">
323
+ <h3 class="panel-title"><span class="icon">🕸️</span>Análisis Comparativo Multidimensional</h3>
324
+ <div class="radar-chart-container">
325
+ <svg class="radar-chart" width="280" height="230" viewBox="0 0 300 250">
326
+ <defs>
327
+ <linearGradient id="gradGreen" x1="0%" y1="0%" x2="0%" y2="100%">
328
+ <stop offset="0%" style="stop-color:rgba(80, 227, 194, 0.6);" />
329
+ <stop offset="100%" style="stop-color:rgba(80, 227, 194, 0.2);" />
330
+ </linearGradient>
331
+ <linearGradient id="gradRed" x1="0%" y1="0%" x2="0%" y2="100%">
332
+ <stop offset="0%" style="stop-color:rgba(245, 56, 119, 0.6);" />
333
+ <stop offset="100%" style="stop-color:rgba(245, 56, 119, 0.2);" />
334
+ </linearGradient>
335
+ </defs>
336
+ <g transform="translate(150, 125)">
337
+ <!-- Grid lines -->
338
+ <polygon points="100,0 50,-86.6 -50,-86.6 -100,0 -50,86.6 50,86.6" fill="none" stroke="#333948" stroke-width="1"/>
339
+ <polygon points="75,0 37.5,-65 -37.5,-65 -75,0 -37.5,65 37.5,65" fill="#2C3240" stroke="#333948" stroke-width="1"/>
340
+ <polygon points="50,0 25,-43.3 -25,-43.3 -50,0 -25,43.3 25,43.3" fill="#232937" stroke="#333948" stroke-width="1"/>
341
+ <polygon points="25,0 12.5,-21.65 -12.5,-21.65 -25,0 -12.5,21.65 12.5,21.65" fill="#2C3240" stroke="#333948" stroke-width="1"/>
342
+ <!-- Axes -->
343
+ <line x1="0" y1="0" x2="100" y2="0" stroke="#4F586E" stroke-width="1"/>
344
+ <line x1="0" y1="0" x2="50" y2="-86.6" stroke="#4F586E" stroke-width="1"/>
345
+ <line x1="0" y1="0" x2="-50" y2="-86.6" stroke="#4F586E" stroke-width="1"/>
346
+ <line x1="0" y1="0" x2="-100" y2="0" stroke="#4F586E" stroke-width="1"/>
347
+ <line x1="0" y1="0" x2="-50" y2="86.6" stroke="#4F586E" stroke-width="1"/>
348
+ <line x1="0" y1="0" x2="50" y2="86.6" stroke="#4F586E" stroke-width="1"/>
349
+ <!-- Data Polygons -->
350
+ <polygon points="80,0 30,-52 -60,-52 -40,0 -20,34.6 60,70" fill="url(#gradGreen)" stroke="#50E3C2" stroke-width="2"/>
351
+ <polygon points="24,0 20,-34.6 -25,-43.3 -70,0 -40,69.2 20,34.6" fill="url(#gradRed)" stroke="#F53877" stroke-width="2"/>
352
+ <!-- Labels -->
353
+ <text x="105" y="5" fill="#A0AEC0" font-size="12" text-anchor="start">Venture Capital</text>
354
+ <text x="55" y="-92" fill="#A0AEC0" font-size="12" text-anchor="middle">Inversión I+D</text>
355
+ <text x="-55" y="-92" fill="#A0AEC0" font-size="12" text-anchor="middle">Prod. Académica</text>
356
+ <text x="-105" y="5" fill="#A0AEC0" font-size="12" text-anchor="end">Regulación</text>
357
+ <text x="-55" y="102" fill="#A0AEC0" font-size="12" text-anchor="middle">Spin-offs</text>
358
+ <text x="55" y="102" fill="#A0AEC0" font-size="12" text-anchor="middle">Conexión Intl.</text>
359
+ </g>
360
+ </svg>
361
+ </div>
362
+ </section>
363
+
364
+ </main>
365
+ </div>
366
+ </body>
367
+ </html>
slides/slide09_brechas_oportunidades_quality_check_1750784077.png ADDED

Git LFS Details

  • SHA256: a9e98813ec39ea69de21571af960a4496c05470cfdc146e4f7b7abb20f0dc903
  • Pointer size: 131 Bytes
  • Size of remote file: 150 kB
slides/slide09_brechas_oportunidades_quality_check_1750784170.png ADDED

Git LFS Details

  • SHA256: 879620bd46b384d3e40d199639b828e8dbb570ea6687e55b7f8f8936b1b4972e
  • Pointer size: 131 Bytes
  • Size of remote file: 178 kB
slides/slide10_tendencias.html ADDED
@@ -0,0 +1,362 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Tendencias Emergentes en Biotecnología</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ font-family: 'Poppins', sans-serif;
14
+ background-color: #0A192F;
15
+ color: #CCD6F6;
16
+ display: flex;
17
+ justify-content: center;
18
+ align-items: center;
19
+ width: 100vw;
20
+ height: 100vh;
21
+ overflow: hidden;
22
+ }
23
+
24
+ .slide {
25
+ width: 1280px;
26
+ height: 720px;
27
+ background: radial-gradient(circle at top right, rgba(10, 25, 47, 0.8), #0A192F 70%), linear-gradient(135deg, #0A192F 0%, #112240 100%);
28
+ position: relative;
29
+ overflow: hidden;
30
+ display: flex;
31
+ flex-direction: column;
32
+ padding: 40px 60px;
33
+ box-sizing: border-box;
34
+ }
35
+
36
+ @keyframes fadeIn {
37
+ from { opacity: 0; transform: translateY(10px); }
38
+ to { opacity: 1; transform: translateY(0); }
39
+ }
40
+
41
+ .header {
42
+ animation: fadeIn 0.8s ease-out;
43
+ }
44
+
45
+ h1 {
46
+ font-size: 48px;
47
+ font-weight: 700;
48
+ color: #FFFFFF;
49
+ margin: 0;
50
+ line-height: 1.1;
51
+ }
52
+
53
+ h2 {
54
+ font-size: 20px;
55
+ font-weight: 400;
56
+ color: #64FFDA;
57
+ margin: 5px 0 0 0;
58
+ }
59
+
60
+ .content-grid {
61
+ display: grid;
62
+ grid-template-columns: 270px 270px 1fr;
63
+ grid-template-rows: auto auto;
64
+ gap: 20px;
65
+ margin-top: 25px;
66
+ flex-grow: 1;
67
+ }
68
+
69
+ .card {
70
+ background-color: rgba(17, 34, 64, 0.5);
71
+ border: 1px solid rgba(100, 255, 218, 0.2);
72
+ border-radius: 8px;
73
+ padding: 20px;
74
+ box-sizing: border-box;
75
+ animation: fadeIn 1s ease-out forwards;
76
+ backdrop-filter: blur(4px);
77
+ }
78
+
79
+ .card:nth-child(1) { animation-delay: 0.2s; opacity: 0; }
80
+ .card:nth-child(2) { animation-delay: 0.3s; opacity: 0; }
81
+ .card:nth-child(3) { animation-delay: 0.4s; opacity: 0; }
82
+ .card:nth-child(4) { animation-delay: 0.5s; opacity: 0; }
83
+ .info-section { animation-delay: 0.6s; opacity: 0; }
84
+ .info-box { animation-delay: 0.7s; opacity: 0; }
85
+ .region-box { animation-delay: 0.8s; opacity: 0; }
86
+
87
+
88
+ .card-title {
89
+ font-size: 16px;
90
+ font-weight: 600;
91
+ color: #64FFDA;
92
+ margin-bottom: 12px;
93
+ display: flex;
94
+ align-items: center;
95
+ }
96
+
97
+ .card-title .icon {
98
+ margin-right: 8px;
99
+ fill: #64FFDA;
100
+ width: 20px;
101
+ height: 20px;
102
+ }
103
+
104
+ .card ul {
105
+ list-style: none;
106
+ padding: 0;
107
+ margin: 0;
108
+ }
109
+
110
+ .card li {
111
+ font-size: 13px;
112
+ line-height: 1.6;
113
+ color: #CCD6F6;
114
+ margin-bottom: 6px;
115
+ padding-left: 15px;
116
+ position: relative;
117
+ }
118
+
119
+ .card li::before {
120
+ content: '•';
121
+ position: absolute;
122
+ left: 0;
123
+ color: #64FFDA;
124
+ }
125
+
126
+ .arrow-connector {
127
+ position: absolute;
128
+ top: 265px;
129
+ left: 310px;
130
+ width: 30px;
131
+ height: 30px;
132
+ background-color: #64FFDA;
133
+ clip-path: polygon(0 0, 100% 50%, 0 100%);
134
+ opacity: 0.5;
135
+ }
136
+
137
+ .info-section {
138
+ grid-column: 3 / 4;
139
+ grid-row: 1 / 3;
140
+ display: flex;
141
+ flex-direction: column;
142
+ gap: 20px;
143
+ animation: fadeIn 1s ease-out forwards;
144
+ }
145
+
146
+ .venn-diagram-container {
147
+ position: relative;
148
+ width: 100%;
149
+ height: 280px;
150
+ margin-top: -20px;
151
+ }
152
+
153
+ .venn-circle {
154
+ position: absolute;
155
+ border-radius: 50%;
156
+ mix-blend-mode: screen;
157
+ opacity: 0.7;
158
+ }
159
+
160
+ .circle1 {
161
+ width: 160px;
162
+ height: 160px;
163
+ background: rgba(100, 255, 218, 0.4);
164
+ top: 20px;
165
+ left: 50px;
166
+ }
167
+
168
+ .circle2 {
169
+ width: 160px;
170
+ height: 160px;
171
+ background: rgba(100, 200, 255, 0.4);
172
+ top: 20px;
173
+ right: 50px;
174
+ }
175
+
176
+ .circle3 {
177
+ width: 160px;
178
+ height: 160px;
179
+ background: rgba(138, 100, 255, 0.4);
180
+ bottom: 10px;
181
+ left: 125px;
182
+ }
183
+
184
+ .venn-label {
185
+ position: absolute;
186
+ color: #FFFFFF;
187
+ font-size: 14px;
188
+ font-weight: 600;
189
+ text-align: center;
190
+ }
191
+
192
+ .label-ia { top: 10px; left: 45px; }
193
+ .label-sintetica { top: 10px; right: 45px; width: 100px; }
194
+ .label-nano { bottom: 0px; left: 110px; }
195
+ .label-expo { top: 110px; left: 50%; transform: translateX(-50%); font-size: 16px; color: #FFFFFF; width: 120px; }
196
+
197
+
198
+ .info-box {
199
+ background-color: rgba(17, 34, 64, 0.5);
200
+ border-top: 2px solid #64FFDA;
201
+ padding: 15px;
202
+ border-radius: 0 0 4px 4px;
203
+ animation: fadeIn 1s ease-out forwards;
204
+ }
205
+
206
+ .info-box-title {
207
+ font-size: 16px;
208
+ font-weight: 600;
209
+ color: #FFFFFF;
210
+ margin-bottom: 10px;
211
+ }
212
+
213
+ .info-box p {
214
+ font-size: 13px;
215
+ line-height: 1.6;
216
+ color: #CCD6F6;
217
+ margin: 0 0 8px 0;
218
+ }
219
+ .info-box p strong {
220
+ color: #64FFDA;
221
+ font-weight: 600;
222
+ }
223
+
224
+ .region-box {
225
+ background-color: rgba(17, 34, 64, 0.5);
226
+ border-top: 2px solid #64FFDA;
227
+ padding: 15px;
228
+ border-radius: 0 0 4px 4px;
229
+ animation: fadeIn 1s ease-out forwards;
230
+ }
231
+
232
+ .region-box ul {
233
+ list-style: none;
234
+ padding: 0;
235
+ margin: 0;
236
+ }
237
+
238
+ .region-box li {
239
+ font-size: 13px;
240
+ color: #CCD6F6;
241
+ margin-bottom: 5px;
242
+ }
243
+
244
+ .region-box li strong {
245
+ color: #64FFDA;
246
+ font-weight: 600;
247
+ min-width: 100px;
248
+ display: inline-block;
249
+ }
250
+
251
+ .timeline {
252
+ position: absolute;
253
+ bottom: 40px;
254
+ left: 60px;
255
+ right: 60px;
256
+ height: 30px;
257
+ animation: fadeIn 1s ease-out 1s forwards;
258
+ opacity: 0;
259
+ }
260
+
261
+ .timeline-line {
262
+ width: 100%;
263
+ height: 2px;
264
+ background-color: rgba(100, 255, 218, 0.3);
265
+ position: absolute;
266
+ top: 50%;
267
+ transform: translateY(-50%);
268
+ }
269
+
270
+ .timeline-marker {
271
+ position: absolute;
272
+ top: 50%;
273
+ transform: translate(-50%, -50%);
274
+ }
275
+
276
+ .timeline-marker .dot {
277
+ width: 12px;
278
+ height: 12px;
279
+ background-color: #0A192F;
280
+ border: 2px solid #64FFDA;
281
+ border-radius: 50%;
282
+ }
283
+
284
+ .timeline-marker .year {
285
+ position: absolute;
286
+ top: -25px;
287
+ left: 50%;
288
+ transform: translateX(-50%);
289
+ font-size: 14px;
290
+ color: #CCD6F6;
291
+ }
292
+
293
+ .marker-2024 { left: 10%; }
294
+ .marker-2025 { left: 25%; }
295
+ .marker-2027 { left: 55%; }
296
+ .marker-2030 { left: 95%; }
297
+
298
+ </style>
299
+ </head>
300
+ <body>
301
+ <div class="slide">
302
+ <div class="header">
303
+ <h1>Tendencias Emergentes en <br>Biotecnología</h1>
304
+ <h2>Análisis Prospectivo 2024-2025</h2>
305
+ </div>
306
+
307
+ <div class="content-grid">
308
+ <!-- Column 1 -->
309
+ <div class="card">
310
+ <div class="card-title">
311
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12,2A10,10,0,0,0,2,12C2,16.42,5.58,20,10,20C14.42,20,18,16.42,18,12H16C16,15.31,13.31,18,10,18C6.69,18,4,15.31,4,12C4,8.69,6.69,6,10,6V2M12,4.67C12,6.4,10.4,7.84,8.67,7.62C7.2,7.42,6,6.23,5.73,4.82C5.5,3.5,6.2,2.23,7.47,1.93C8.8,1.6,10.09,2.27,10.83,3.34L12,4.67M19,8H22V11H19V8M19,13H22V16H19V13M19,18H22V21H19V18Z"></path></svg>
312
+ Biotecnología Verde y Sostenibilidad
313
+ </div>
314
+ <ul>
315
+ <li>Economía circular y bioeconomía</li>
316
+ <li>Reducción de huella de carbono</li>
317
+ <li>Materiales biodegradables y bioplásticos</li>
318
+ <li>Agricultura sostenible y precision farming</li>
319
+ </ul>
320
+ </div>
321
+ <div class="card">
322
+ <div class="card-title">
323
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12.4,5.1C12,4.9,11.6,5,11.3,5.3L7.8,8.8L6.4,7.4C6.1,7.1,5.6,7,5.3,7.3C5,7.6,4.9,8,5.1,8.4L7.1,11.4C7.2,11.5,7.4,11.6,7.5,11.7C7.6,11.7,7.8,11.8,7.9,11.8C8,11.8,8.2,11.7,8.3,11.7C8.5,11.6,8.6,11.5,8.7,11.4L12.9,7.1C13.2,6.8,13.2,6.3,12.9,6C12.8,5.8,12.6,5.7,12.4,5.7V5.7M21.7,13.8C20.8,13.4,19.7,13.3,18.6,13.6C17.6,13.8,16.6,14.4,15.9,15.1C15.2,15.8,14.6,16.8,14.4,17.8C14.1,18.9,14.2,20,14.6,21L13,22.6C12.8,22.8,12.5,23,12.2,23C12,23,11.7,22.9,11.5,22.7L9.3,20.5C9.1,20.3,9,20,9,19.8C9,19.5,9.1,19.2,9.3,19L10.9,17.4C10,17,9.1,17.1,8.2,17.4C7.2,17.6,6.2,18.2,5.5,18.9C4.8,19.6,4.2,20.6,4,21.6C3.7,22.7,3.8,23.8,4.2,24.7C4.4,25.2,4.8,25.5,5.3,25.5C5.4,25.5,5.5,25.5,5.6,25.4C6.6,25.1,7.5,24.6,8.2,23.9C8.9,23.2,9.5,22.3,9.7,21.3C10,20.5,9.9,19.6,9.5,18.8L11.5,16.8C11.7,16.6,12,16.5,12.2,16.5C12.5,16.5,12.8,16.6,13,16.8L14.6,18.4C15.1,17.9,15.6,17.5,16.2,17.2C16.8,16.9,17.5,16.7,18.2,16.6C18.9,16.5,19.6,16.6,20.3,16.8C21,17.1,21.6,17.5,22.2,18C22.4,18.2,22.7,18.3,23,18.3C23.2,18.3,23.5,18.2,23.7,18L25.5,16.2C25.7,16,25.8,15.7,25.8,15.5C25.8,15.2,25.7,14.9,25.5,14.7L22.9,12.1C22.6,11.8,22.1,11.7,21.8,12C21.7,12,21.6,12.1,21.5,12.1L19.9,13.7C19.4,13.2,18.8,12.8,18.2,12.5C17.6,12.2,16.9,12,16.2,11.9C15.5,11.8,14.8,11.9,14.1,12.1C13.4,12.4,12.8,12.8,12.2,13.3C12,13.1,11.7,13,11.5,13C11.2,13,10.9,13.1,10.7,13.3L8.9,15.1C9.1,15.3,9.3,15.4,9.5,15.6C9.7,15.8,9.8,16,9.9,16.2C10.2,17.1,10.1,18,9.7,18.8C9.5,19.7,8.9,20.5,8.2,21.2C7.5,21.9,6.6,22.5,5.6,22.7C4.8,23,4.1,22.9,3.5,22.5C2.8,22.1,2.3,21.5,2.1,20.7C1.9,19.8,2,18.9,2.4,18.1C2.8,17.3,3.4,16.6,4.1,16C4.8,15.3,5.7,14.7,6.7,14.5C7.7,14.2,8.8,14.3,9.7,14.7C9.9,14.8,10.1,14.8,10.3,14.7C10.5,14.7,10.7,14.6,10.8,14.4L12.8,12.4C12.7,12.2,12.6,12,12.5,11.8C12.4,11.6,12.3,11.5,12.2,11.3C11.9,10.4,12,9.5,12.4,8.7C12.8,7.9,13.4,7.2,14.1,6.6C14.8,5.9,15.7,5.3,16.7,5.1C17.7,4.8,18.8,4.9,19.7,5.3C20.2,5.5,20.5,6,20.5,6.5C20.5,6.6,20.5,6.7,20.4,6.8C20.1,7.8,19.6,8.7,18.9,9.4C18.2,10.1,17.3,10.7,16.3,10.9C15.5,11.2,14.6,11.1,13.8,10.7L15.8,8.7C16,8.5,16.1,8.2,16.1,8C16.1,7.7,16,7.4,15.8,7.2L14.2,5.6C14.7,5.1,15.2,4.7,15.8,4.4C16.4,4.1,17.1,3.9,17.8,3.8C18.5,3.7,19.2,3.8,19.9,4C20.6,4.3,21.2,4.7,21.8,5.2C22,5,22.3,4.9,22.5,4.9C22.8,4.9,23.1,5,23.3,5.2L25.1,7C25.3,7.2,25.4,7.5,25.4,7.7C25.4,8,25.3,8.3,25.1,8.5L22.5,11.1C22.3,11.3,22,11.4,21.8,11.4C21.5,11.4,21.2,11.3,21,11.1C20.1,10.2,19.6,9,19.6,7.8C19.6,7.2,19.7,6.7,20,6.2C19.5,5.9,19,5.7,18.5,5.6C17.9,5.5,17.4,5.5,16.9,5.7C16.3,5.8,15.8,6.1,15.4,6.4L17,8C17.5,8.5,17.5,9.3,17,9.8C16.8,10,16.5,10.1,16.2,10.1C16,10.1,15.7,10,15.5,9.8L13.5,7.8C13.4,8.6,13.5,9.5,13.9,10.3C14.3,11.1,14.9,11.8,15.6,12.4C16.3,13.1,17.2,13.7,18.2,13.9C19.1,14.1,20,14,20.8,13.6C21.1,13.5,21.4,13.5,21.7,13.8Z" transform="translate(-2 -1.9)"/></svg>
324
+ Convergencia Tecnológica
325
+ </div>
326
+ <ul>
327
+ <li>IA aplicada a drug discovery</li>
328
+ <li>Biotecnología digital y bioinformática</li>
329
+ <li>Nanotecnología biomédica</li>
330
+ <li>Synthetic biology y bioingeniería</li>
331
+ </ul>
332
+ </div>
333
+
334
+ <!-- Column 2 -->
335
+ <div class="card">
336
+ <div class="card-title">
337
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12,2A3,3 0 0,1 15,5V7H9V5A3,3 0 0,1 12,2M19,13H17V11H15V13H13V15H15V17H17V15H19V13M9,9H7V7H5V9H3V11H5V13H7V11H9V9M15,9H13V7H11V9H9V11H15V9M9,15V17H11V19H13V17H15V15H9Z"></path></svg>
338
+ Terapias Avanzadas y Medicina Personalizada
339
+ </div>
340
+ <ul>
341
+ <li>Terapias génicas y celulares</li>
342
+ <li>Medicina de precisión basada en genómica</li>
343
+ <li>Inmunoterapias de nueva generación</li>
344
+ <li>Biomarkers y diagnósticos companion</li>
345
+ </ul>
346
+ </div>
347
+ <div class="card">
348
+ <div class="card-title">
349
+ <svg class="icon" viewBox="0 0 24 24"><path d="M16 14H18V20H22V12C22 10.9 21.1 10 20 10H16V14M10 14H12V16H14V14H16V10H10V14M4 14H6V16H8V14H10V10H4V14M20 6H22V8H20V6M2 2H14V8H2V2M4 4V6H12V4H4Z"></path></svg>
350
+ Nuevos Modelos Organizacionales
351
+ </div>
352
+ <ul>
353
+ <li>Consolidación industrial (M&A)</li>
354
+ <li>Partnerships universidad-industria</li>
355
+ <li>Hubs de innovación regionales</li>
356
+ <li>Regulación adaptativa y fast-track</li>
357
+ </ul>
358
+ </div>
359
+
360
+ <div class="arrow-connector"></div>
361
+
362
+ <!--
slides/slide10_tendencias_quality_check_1750784271.png ADDED

Git LFS Details

  • SHA256: ffc0168a90ceedad6271eb476ed9f4bbdc2dba20314a7458a874da30c894c6b9
  • Pointer size: 131 Bytes
  • Size of remote file: 424 kB
slides/slide10_tendencias_quality_check_1750784385.png ADDED

Git LFS Details

  • SHA256: ab599b8da25c0ea0dcee23dcd3c3897e44929232c9c853a7f9aa225e71110389
  • Pointer size: 131 Bytes
  • Size of remote file: 152 kB
slides/slide11_csb_argentina.html ADDED
@@ -0,0 +1,335 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Colegio Santafesino de Biotecnólogos</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');
9
+
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ background-color: #f0f0f0;
14
+ display: flex;
15
+ justify-content: center;
16
+ align-items: center;
17
+ height: 100vh;
18
+ font-family: 'Montserrat', sans-serif;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ background: linear-gradient(135deg, #0a192f, #004d40);
25
+ color: #e6f1ff;
26
+ display: grid;
27
+ grid-template-columns: repeat(12, 1fr);
28
+ grid-template-rows: 120px 1fr 1fr;
29
+ gap: 20px;
30
+ padding: 40px;
31
+ box-sizing: border-box;
32
+ overflow: hidden;
33
+ position: relative;
34
+ }
35
+
36
+ .slide::before {
37
+ content: '';
38
+ position: absolute;
39
+ top: 0;
40
+ left: 0;
41
+ width: 100%;
42
+ height: 100%;
43
+ background-image:
44
+ radial-gradient(circle at 10% 20%, rgba(0, 128, 128, 0.1), transparent 40%),
45
+ radial-gradient(circle at 90% 80%, rgba(212, 175, 55, 0.1), transparent 40%);
46
+ pointer-events: none;
47
+ }
48
+
49
+ .header {
50
+ grid-column: 1 / -1;
51
+ grid-row: 1 / 2;
52
+ border-bottom: 2px solid rgba(212, 175, 55, 0.5);
53
+ padding-bottom: 10px;
54
+ text-align: left;
55
+ animation: fadeInDown 0.8s ease-out;
56
+ }
57
+
58
+ .header h1 {
59
+ font-size: 42px;
60
+ color: #D4AF37;
61
+ margin: 0;
62
+ font-weight: 700;
63
+ }
64
+
65
+ .header h2 {
66
+ font-size: 22px;
67
+ color: #a8b2d1;
68
+ margin: 5px 0 0;
69
+ font-weight: 400;
70
+ }
71
+
72
+ .card {
73
+ background-color: rgba(10, 25, 47, 0.7);
74
+ border-radius: 8px;
75
+ padding: 20px;
76
+ box-sizing: border-box;
77
+ border: 1px solid #00796b;
78
+ backdrop-filter: blur(5px);
79
+ }
80
+
81
+ .card h3 {
82
+ font-size: 18px;
83
+ color: #64ffda;
84
+ margin-top: 0;
85
+ margin-bottom: 15px;
86
+ border-bottom: 1px solid #304a69;
87
+ padding-bottom: 8px;
88
+ display: flex;
89
+ align-items: center;
90
+ }
91
+
92
+ .card h3 svg {
93
+ margin-right: 10px;
94
+ }
95
+
96
+ .card ul {
97
+ list-style: none;
98
+ padding: 0;
99
+ margin: 0;
100
+ font-size: 14px;
101
+ line-height: 1.6;
102
+ color: #a8b2d1;
103
+ }
104
+
105
+ .card ul li {
106
+ padding-left: 20px;
107
+ position: relative;
108
+ margin-bottom: 8px;
109
+ }
110
+
111
+ .card ul li::before {
112
+ content: '✓';
113
+ position: absolute;
114
+ left: 0;
115
+ color: #D4AF37;
116
+ font-weight: bold;
117
+ }
118
+
119
+ #legal-framework {
120
+ grid-column: 1 / 5;
121
+ grid-row: 2 / 3;
122
+ animation: fadeInLeft 1s ease-out 0.2s;
123
+ animation-fill-mode: backwards;
124
+ }
125
+
126
+ #functions {
127
+ grid-column: 1 / 5;
128
+ grid-row: 3 / 4;
129
+ animation: fadeInLeft 1s ease-out 0.4s;
130
+ animation-fill-mode: backwards;
131
+ }
132
+
133
+ #org-model {
134
+ grid-column: 5 / 9;
135
+ grid-row: 2 / 3;
136
+ animation: fadeIn 1s ease-out 0.6s;
137
+ animation-fill-mode: backwards;
138
+ }
139
+
140
+ #distinctive-features {
141
+ grid-column: 5 / 9;
142
+ grid-row: 3 / 4;
143
+ animation: fadeIn 1s ease-out 0.8s;
144
+ animation-fill-mode: backwards;
145
+ }
146
+
147
+ #lessons {
148
+ grid-column: 9 / -1;
149
+ grid-row: 3 / 4;
150
+ animation: fadeInRight 1s ease-out 1s;
151
+ animation-fill-mode: backwards;
152
+ }
153
+
154
+ #visuals {
155
+ grid-column: 9 / -1;
156
+ grid-row: 2 / 3;
157
+ background-color: transparent;
158
+ border: none;
159
+ padding: 0;
160
+ display: flex;
161
+ flex-direction: column;
162
+ justify-content: center;
163
+ align-items: center;
164
+ gap: 20px;
165
+ animation: fadeInRight 1s ease-out 1.2s;
166
+ animation-fill-mode: backwards;
167
+ }
168
+
169
+ .map-container {
170
+ width: 100%;
171
+ height: 200px;
172
+ display: flex;
173
+ justify-content: center;
174
+ align-items: center;
175
+ background-color: rgba(10, 25, 47, 0.7);
176
+ border: 1px solid #00796b;
177
+ border-radius: 8px;
178
+ padding: 10px;
179
+ box-sizing: border-box;
180
+ }
181
+
182
+ .map-container svg {
183
+ width: auto;
184
+ height: 100%;
185
+ }
186
+
187
+ #argentina-path {
188
+ fill: #304a69;
189
+ stroke: #64ffda;
190
+ stroke-width: 0.5;
191
+ }
192
+
193
+ #santafe-path {
194
+ fill: #D4AF37;
195
+ stroke: white;
196
+ stroke-width: 0.8;
197
+ }
198
+
199
+ .org-chart {
200
+ font-size: 12px;
201
+ text-align: center;
202
+ }
203
+ .org-level {
204
+ display: flex;
205
+ justify-content: center;
206
+ position: relative;
207
+ }
208
+ .org-node {
209
+ background-color: #00796b;
210
+ color: white;
211
+ padding: 5px 10px;
212
+ border-radius: 4px;
213
+ margin: 0 10px;
214
+ position: relative;
215
+ z-index: 1;
216
+ }
217
+ .org-level:not(:last-child) {
218
+ margin-bottom: 25px;
219
+ }
220
+ .org-level:not(:last-child)::after {
221
+ content: '';
222
+ position: absolute;
223
+ left: 50%;
224
+ top: 100%;
225
+ height: 15px;
226
+ width: 2px;
227
+ background-color: #304a69;
228
+ }
229
+ .org-level.children::before {
230
+ content: '';
231
+ position: absolute;
232
+ left: calc(50% - 60px);
233
+ top: -10px;
234
+ width: 120px;
235
+ height: 2px;
236
+ background-color: #304a69;
237
+ }
238
+
239
+ .icon {
240
+ width: 24px;
241
+ height: 24px;
242
+ fill: #64ffda;
243
+ }
244
+
245
+ @keyframes fadeInDown {
246
+ from { opacity: 0; transform: translateY(-20px); }
247
+ to { opacity: 1; transform: translateY(0); }
248
+ }
249
+ @keyframes fadeInLeft {
250
+ from { opacity: 0; transform: translateX(-20px); }
251
+ to { opacity: 1; transform: translateX(0); }
252
+ }
253
+ @keyframes fadeInRight {
254
+ from { opacity: 0; transform: translateX(20px); }
255
+ to { opacity: 1; transform: translateX(0); }
256
+ }
257
+ @keyframes fadeIn {
258
+ from { opacity: 0; }
259
+ to { opacity: 1; }
260
+ }
261
+
262
+ </style>
263
+ </head>
264
+ <body>
265
+
266
+ <div class="slide">
267
+ <header class="header">
268
+ <h1>Colegio Santafesino de Biotecnólogos (CSB)</h1>
269
+ <h2>Modelo Provincial Consolidado de Regulación Profesional</h2>
270
+ </header>
271
+
272
+ <div id="legal-framework" class="card">
273
+ <h3>
274
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12 2L2 7v5.5c0 5.55 3.84 10.74 9 12 .36-.12.7-.26 1-4.14V9.02L12 12.5l-8-4.5v-3l8 4.5 8-4.5v3.1c.3.06.59.15.87.26C21.43 14.1 22 10.3 22 7l-10-5zm4 11.45c-.83 1.18-1.83 2.1-3 2.82V14.5h-2v2.82c-1.17-.72-2.17-1.64-3-2.82V10.3l4 2.25 4-2.25v4.15zM19 16c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3zm-1 4h-1v-2h2v.5L18.5 19H20v1h-2v-1z"/></svg>
275
+ Marco Legal Sólido
276
+ </h3>
277
+ <ul>
278
+ <li>Creado por Ley Provincial 13.490</li>
279
+ <li>Base legal específica y clara</li>
280
+ <li>Poder regulatorio reconocido</li>
281
+ <li>Jurisdicción provincial definida</li>
282
+ </ul>
283
+ </div>
284
+
285
+ <div id="functions" class="card">
286
+ <h3>
287
+ <svg class="icon" viewBox="0 0 24 24"><path d="M14.25 2.26l.08.04.34.17.08.04c.1.05.18.1.27.15l.08.05c.29.18.54.39.75.63l.06.07c.09.1.18.2.26.3l.05.08c.18.29.39.54.63.75l.07.06c.1.09.2.18.3.26l.08.05c.29.18.54.39.75.63l.21.24c.05.05.1.1.15.15s.1.1.15.15l.24.21c.21.21.39.46.54.75l.05.08c.1.18.2.27.3.26l.06.07c.21.21.39.46.54.75l.15.27c.05.1.1.18.15.27l.04.08.17.34.04.08.04.08c.05.1.1.18.15.27l.05.08c.18.29.39.54.63.75l.07.06c.09.1.18.2.26.3l.08.05c.29.18.54.39.75.63l.24.21.15.15.15.15.21.24c.21.21.46.39.75.54l.08.05c.18.1.27.2.26.3l.07.06c.21.21.46.39.75.54l.27.15c.1.05.18.1.27.15l.08.04.34.17.08.04.08.04c.1.05.18.1.27.15l.08.05c.29.18.54.39.75.63l.06.07c.09.1.18.2.26.3l.05.08c.18.29.39.54.63.75l-6.1-6.1L14.25 2.26zM5 16h8v2H5v-2zm0-4h11v2H5v-2zm0-4h11v2H5V8zm13-5H3.99C3.44 3 3 3.45 3 4v16c0 .55.45 1 1.01 1H19c.55 0 1-.45 1-1V7l-5-5z"/></svg>
288
+ Funciones y Competencias
289
+ </h3>
290
+ <ul>
291
+ <li>Matriculación de profesionales</li>
292
+ <li>Control del ejercicio profesional</li>
293
+ <li>Establecimiento de aranceles</li>
294
+ <li>Régimen disciplinario y ético</li>
295
+ <li>Defensa del título y la profesión</li>
296
+ </ul>
297
+ </div>
298
+
299
+ <div id="org-model" class="card">
300
+ <h3>
301
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z"/></svg>
302
+ Modelo Organizacional
303
+ </h3>
304
+ <div class="org-chart">
305
+ <div class="org-level">
306
+ <div class="org-node">Asamblea</div>
307
+ </div>
308
+ <div class="org-level children">
309
+ <div class="org-node">Consejo Directivo</div>
310
+ <div class="org-node">Tribunal de Ética</div>
311
+ </div>
312
+ </div>
313
+ <ul>
314
+ <li>Representación en organismos públicos</li>
315
+ <li>Vinculación con universidades regionales</li>
316
+ </ul>
317
+ </div>
318
+
319
+ <div id="distinctive-features" class="card">
320
+ <h3>
321
+ <svg class="icon" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z"/></svg>
322
+ Características Distintivas
323
+ </h3>
324
+ <ul>
325
+ <li>Alcance Provincial vs. Nacional (CAB)</li>
326
+ <li>Modelo replicable en otras provincias</li>
327
+ <li>Regula competencias como análisis, I+D, industria y consultoría</li>
328
+ </ul>
329
+ </div>
330
+
331
+ <div id="visuals">
332
+ <div class="map-container">
333
+ <svg viewBox="0 0 275 500">
334
+ <g>
335
+ <path id="argentina-path" d="M112.5,490.6l-3.2-3.2l-3.2,1.6l-4.8,0l-3.2-1.6l-1.6,1.6l-1.6,4.8l-3.2,0l-1.6-1.6l-3.2-3.2l-1.6-4.8l-3.2-1.6l-1.6,3.2l-3.2-1.6l-1.6-3.2l-1.6,1.6l-3.2,0l-1.6-1.6l-1.6-4.8l-1.6-1.6l-1.6-3.2l-1.6,0l-1.6,1.6l-1.6-1.6l-3.2,0l-1.6-1.6l-3.2-3.2l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6-1.6l-1.6-3.2l-1.6,0l-1.6-1.6l-1.6-3.2l-1.6-1.6l-1.6,0l-1.6-1.6l-3.2,0l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6-1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-3.2,1.6l-1.6-1.6l-1.6-1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6-1.6l-1.6-1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6,1.6l-1.6-1.6l-1.6
slides/slide11_csb_argentina_quality_check_1750784501.png ADDED

Git LFS Details

  • SHA256: 134b4b0edcd455af8d226bcfe9e1aa7fbe6c378c39d012bf8499d9d53addf120
  • Pointer size: 131 Bytes
  • Size of remote file: 388 kB
slides/slide12_analisis_cuantitativo.html ADDED
@@ -0,0 +1,225 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Análisis Cuantitativo del Sector Biotecnológico</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
10
+ <style>
11
+ :root {
12
+ --bg-dark: #161b22;
13
+ --panel-bg: #1f2633;
14
+ --text-primary: #c9d1d9;
15
+ --text-secondary: #8b949e;
16
+ --border-color: #30363d;
17
+
18
+ --color-eeuu: #3b82f6; /* Blue */
19
+ --color-europa-de: #22c55e; /* Green */
20
+ --color-europa-fr: #16a34a; /* Darker Green */
21
+ --color-europa-es: #15803d; /* Darkest Green */
22
+ --color-europa-ch: #4ade80; /* Lighter Green */
23
+ --color-europa-be: #84cc16; /* Lime Green */
24
+ --color-corea: #f97316; /* Orange */
25
+ --color-amlat: #ef4444; /* Red */
26
+ --color-alemania-alt: #eab308; /* Gold */
27
+ --color-francia-alt: #db2777; /* Pink */
28
+ --color-espana-alt: #dc2626; /* Red */
29
+ }
30
+
31
+ * {
32
+ box-sizing: border-box;
33
+ margin: 0;
34
+ padding: 0;
35
+ }
36
+
37
+ body {
38
+ display: flex;
39
+ justify-content: center;
40
+ align-items: center;
41
+ min-height: 100vh;
42
+ background-color: #0d1117;
43
+ font-family: 'Poppins', sans-serif;
44
+ }
45
+
46
+ .slide {
47
+ width: 1280px;
48
+ height: 720px;
49
+ background-color: var(--bg-dark);
50
+ color: var(--text-primary);
51
+ display: flex;
52
+ flex-direction: column;
53
+ padding: 32px;
54
+ }
55
+
56
+ .main-header {
57
+ text-align: center;
58
+ margin-bottom: 24px;
59
+ }
60
+
61
+ .main-header h1 {
62
+ font-size: 32px;
63
+ font-weight: 700;
64
+ color: var(--text-primary);
65
+ }
66
+
67
+ .main-header p {
68
+ font-size: 18px;
69
+ color: var(--text-secondary);
70
+ font-weight: 400;
71
+ }
72
+
73
+ .dashboard {
74
+ flex-grow: 1;
75
+ display: grid;
76
+ grid-template-columns: repeat(6, 1fr);
77
+ grid-template-rows: repeat(2, 1fr);
78
+ gap: 24px;
79
+ }
80
+
81
+ .panel {
82
+ background-color: var(--panel-bg);
83
+ border-radius: 12px;
84
+ padding: 20px;
85
+ display: flex;
86
+ flex-direction: column;
87
+ animation: fadeIn 0.5s ease-in-out forwards;
88
+ opacity: 0;
89
+ }
90
+
91
+ @keyframes fadeIn {
92
+ to {
93
+ opacity: 1;
94
+ }
95
+ }
96
+ .panel-empresas { grid-column: 1 / 3; animation-delay: 0.1s; }
97
+ .panel-inversion { grid-column: 3 / 5; animation-delay: 0.2s; }
98
+ .panel-patentes { grid-column: 5 / 7; animation-delay: 0.3s; }
99
+ .panel-eficiencia { grid-column: 1 / 4; animation-delay: 0.4s; }
100
+ .panel-ratio { grid-column: 4 / 7; animation-delay: 0.5s; }
101
+
102
+
103
+ .panel-title {
104
+ font-size: 16px;
105
+ font-weight: 600;
106
+ color: var(--text-secondary);
107
+ margin-bottom: 16px;
108
+ border-bottom: 1px solid var(--border-color);
109
+ padding-bottom: 8px;
110
+ }
111
+
112
+ /* Panel 1: Número de Empresas */
113
+ .empresas-grid {
114
+ display: grid;
115
+ grid-template-columns: repeat(2, 1fr);
116
+ gap: 20px;
117
+ flex-grow: 1;
118
+ align-content: center;
119
+ }
120
+ .empresa-item {
121
+ text-align: center;
122
+ }
123
+ .empresa-item .number {
124
+ font-size: 32px;
125
+ font-weight: 700;
126
+ }
127
+ .empresa-item .country {
128
+ font-size: 14px;
129
+ color: var(--text-secondary);
130
+ }
131
+ .empresa-item .number.eeuu { color: var(--color-eeuu); }
132
+ .empresa-item .number.francia { color: var(--color-europa-fr); }
133
+ .empresa-item .number.corea { color: var(--color-corea); }
134
+ .empresa-item .number.espana { color: var(--color-europa-es); }
135
+ .empresa-item .number.alemania { color: var(--color-europa-de); }
136
+ .empresa-item .number.amlat { color: var(--color-amlat); }
137
+
138
+ /* Panel 2: Inversión I+D */
139
+ .inversion-content {
140
+ display: flex;
141
+ align-items: center;
142
+ gap: 24px;
143
+ flex-grow: 1;
144
+ }
145
+ .donut-chart-container {
146
+ position: relative;
147
+ width: 140px;
148
+ height: 140px;
149
+ }
150
+ .donut-chart {
151
+ width: 100%;
152
+ height: 100%;
153
+ border-radius: 50%;
154
+ background: conic-gradient(
155
+ var(--color-eeuu) 0% 74.7%,
156
+ var(--color-europa-de) 74.7% 82.6%,
157
+ var(--color-europa-fr) 82.6% 90.4%,
158
+ var(--color-corea) 90.4% 97.1%,
159
+ var(--color-europa-es) 97.1% 99.2%,
160
+ var(--color-amlat) 99.2% 100%
161
+ );
162
+ transition: transform 0.5s;
163
+ }
164
+ .donut-chart:hover {
165
+ transform: scale(1.05);
166
+ }
167
+ .donut-chart::before {
168
+ content: '';
169
+ position: absolute;
170
+ top: 50%;
171
+ left: 50%;
172
+ transform: translate(-50%, -50%);
173
+ width: 60%;
174
+ height: 60%;
175
+ background: var(--panel-bg);
176
+ border-radius: 50%;
177
+ }
178
+ .legend {
179
+ display: flex;
180
+ flex-direction: column;
181
+ gap: 6px;
182
+ font-size: 13px;
183
+ }
184
+ .legend-item {
185
+ display: flex;
186
+ align-items: center;
187
+ gap: 8px;
188
+ }
189
+ .legend-color {
190
+ width: 12px;
191
+ height: 12px;
192
+ border-radius: 3px;
193
+ }
194
+ .legend-text {
195
+ color: var(--text-secondary);
196
+ }
197
+ .legend-value {
198
+ color: var(--text-primary);
199
+ font-weight: 600;
200
+ margin-left: auto;
201
+ }
202
+
203
+ /* Panel 3 & 5: Bar Charts */
204
+ .bar-chart {
205
+ display: flex;
206
+ flex-direction: column;
207
+ gap: 12px;
208
+ flex-grow: 1;
209
+ justify-content: center;
210
+ }
211
+ .bar-item {
212
+ display: grid;
213
+ grid-template-columns: 70px 1fr 50px;
214
+ align-items: center;
215
+ gap: 10px;
216
+ font-size: 13px;
217
+ }
218
+ .bar-label {
219
+ color: var(--text-secondary);
220
+ text-align: left;
221
+ }
222
+ .bar-container {
223
+ background-color: var(--bg-dark);
224
+ border-radius: 4px;
225
+ height: 16px
slides/slide12_analisis_cuantitativo_corregido.html ADDED
@@ -0,0 +1,288 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Análisis Cuantitativo Global</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
9
+
10
+ body, html {
11
+ margin: 0;
12
+ padding: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ display: flex;
16
+ justify-content: center;
17
+ align-items: center;
18
+ background-color: #f0f0f0;
19
+ }
20
+
21
+ .slide {
22
+ width: 1280px;
23
+ height: 720px;
24
+ box-sizing: border-box;
25
+ background: linear-gradient(135deg, #0d1b2a, #1b263b);
26
+ color: #e0e1dd;
27
+ font-family: 'Poppins', sans-serif;
28
+ display: flex;
29
+ flex-direction: column;
30
+ padding: 40px;
31
+ overflow: hidden;
32
+ position: relative;
33
+ }
34
+
35
+ .slide-header {
36
+ text-align: left;
37
+ padding-bottom: 20px;
38
+ border-bottom: 1px solid rgba(125, 222, 191, 0.3);
39
+ animation: fadeInDown 0.8s ease-out;
40
+ }
41
+
42
+ .slide-header h1 {
43
+ font-size: 44px;
44
+ margin: 0;
45
+ font-weight: 700;
46
+ color: #ffffff;
47
+ }
48
+
49
+ .slide-header h2 {
50
+ font-size: 22px;
51
+ margin: 5px 0 0 0;
52
+ font-weight: 400;
53
+ color: #a9d6e5;
54
+ }
55
+
56
+ .main-content {
57
+ display: flex;
58
+ justify-content: space-between;
59
+ gap: 30px;
60
+ margin-top: 25px;
61
+ flex-grow: 1;
62
+ }
63
+
64
+ .data-card {
65
+ background-color: rgba(27, 38, 59, 0.6);
66
+ border-radius: 15px;
67
+ padding: 25px;
68
+ flex: 1;
69
+ display: flex;
70
+ flex-direction: column;
71
+ animation: fadeInUp 0.8s ease-out;
72
+ }
73
+ .data-card:nth-child(1) { animation-delay: 0.1s; }
74
+ .data-card:nth-child(2) { animation-delay: 0.2s; }
75
+ .data-card:nth-child(3) { animation-delay: 0.3s; }
76
+
77
+
78
+ .card-title {
79
+ display: flex;
80
+ align-items: center;
81
+ gap: 12px;
82
+ margin-bottom: 25px;
83
+ }
84
+
85
+ .card-title .icon {
86
+ font-size: 28px;
87
+ color: #7ddfbf;
88
+ }
89
+
90
+ .card-title h3 {
91
+ font-size: 20px;
92
+ font-weight: 600;
93
+ color: #7ddfbf;
94
+ margin: 0;
95
+ line-height: 1.2;
96
+ }
97
+
98
+ .data-list {
99
+ list-style: none;
100
+ padding: 0;
101
+ margin: 0;
102
+ display: flex;
103
+ flex-direction: column;
104
+ gap: 20px;
105
+ }
106
+
107
+ .data-item {
108
+ display: flex;
109
+ flex-direction: column;
110
+ gap: 6px;
111
+ }
112
+
113
+ .item-header {
114
+ display: flex;
115
+ justify-content: space-between;
116
+ font-size: 15px;
117
+ color: #cdd2e2;
118
+ }
119
+ .item-header .country {
120
+ font-weight: 600;
121
+ }
122
+ .item-header .value {
123
+ font-weight: 400;
124
+ }
125
+
126
+ .bar-container {
127
+ width: 100%;
128
+ height: 10px;
129
+ background-color: rgba(13, 27, 42, 0.8);
130
+ border-radius: 5px;
131
+ overflow: hidden;
132
+ }
133
+
134
+ .bar {
135
+ height: 100%;
136
+ background: linear-gradient(90deg, #4ecdc4, #5be2c5);
137
+ border-radius: 5px;
138
+ animation: growBar 1.5s cubic-bezier(0.25, 1, 0.5, 1);
139
+ }
140
+
141
+ .conclusions-section {
142
+ margin-top: 30px;
143
+ padding-top: 20px;
144
+ border-top: 1px solid rgba(125, 222, 191, 0.3);
145
+ display: grid;
146
+ grid-template-columns: 1fr 1fr;
147
+ grid-template-rows: auto auto;
148
+ gap: 10px 20px;
149
+ animation: fadeInUp 0.8s ease-out 0.5s;
150
+ animation-fill-mode: backwards;
151
+ }
152
+
153
+ .conclusion-item {
154
+ display: flex;
155
+ align-items: center;
156
+ gap: 10px;
157
+ font-size: 14px;
158
+ color: #cdd2e2;
159
+ }
160
+
161
+ .conclusion-item .check-icon {
162
+ color: #7ddfbf;
163
+ font-weight: bold;
164
+ font-size: 18px;
165
+ }
166
+
167
+ @keyframes fadeInDown {
168
+ from { opacity: 0; transform: translateY(-20px); }
169
+ to { opacity: 1; transform: translateY(0); }
170
+ }
171
+
172
+ @keyframes fadeInUp {
173
+ from { opacity: 0; transform: translateY(20px); }
174
+ to { opacity: 1; transform: translateY(0); }
175
+ }
176
+
177
+ @keyframes growBar {
178
+ from { width: 0; }
179
+ to { /* width is set inline */ }
180
+ }
181
+
182
+ </style>
183
+ </head>
184
+ <body>
185
+ <div class="slide">
186
+ <header class="slide-header">
187
+ <h1>Análisis Cuantitativo Global</h1>
188
+ <h2>Métricas Clave del Sector Biotecnológico</h2>
189
+ </header>
190
+
191
+ <main class="main-content">
192
+ <div class="data-card">
193
+ <div class="card-title">
194
+ <span class="icon">🏢</span>
195
+ <h3>Líderes en Empresas<br>Biotecnológicas</h3>
196
+ </div>
197
+ <ul class="data-list">
198
+ <li class="data-item">
199
+ <div class="item-header"><span class="country">Estados Unidos</span><span class="value">4,000+</span></div>
200
+ <div class="bar-container"><div class="bar" style="width: 100%;"></div></div>
201
+ </li>
202
+ <li class="data-item">
203
+ <div class="item-header"><span class="country">Francia</span><span class="value">2,900</span></div>
204
+ <div class="bar-container"><div class="bar" style="width: 72.5%;"></div></div>
205
+ </li>
206
+ <li class="data-item">
207
+ <div class="item-header"><span class="country">Corea del Sur</span><span class="value">1,800</span></div>
208
+ <div class="bar-container"><div class="bar" style="width: 45%;"></div></div>
209
+ </li>
210
+ <li class="data-item">
211
+ <div class="item-header"><span class="country">España</span><span class="value">1,233</span></div>
212
+ <div class="bar-container"><div class="bar" style="width: 30.8%;"></div></div>
213
+ </li>
214
+ <li class="data-item">
215
+ <div class="item-header"><span class="country">Alemania</span><span class="value">935</span></div>
216
+ <div class="bar-container"><div class="bar" style="width: 23.4%;"></div></div>
217
+ </li>
218
+ </ul>
219
+ </div>
220
+
221
+ <div class="data-card">
222
+ <div class="card-title">
223
+ <span class="icon">📈</span>
224
+ <h3>Inversión I+D<br>(Millones USD)</h3>
225
+ </div>
226
+ <ul class="data-list">
227
+ <li class="data-item">
228
+ <div class="item-header"><span class="country">Estados Unidos</span><span class="value">$50,000M</span></div>
229
+ <div class="bar-container"><div class="bar" style="width: 100%;"></div></div>
230
+ </li>
231
+ <li class="data-item">
232
+ <div class="item-header"><span class="country">Alemania</span><span class="value">$5,300M</span></div>
233
+ <div class="bar-container"><div class="bar" style="width: 45%;"></div></div>
234
+ </li>
235
+ <li class="data-item">
236
+ <div class="item-header"><span class="country">Francia</span><span class="value">$5,200M</span></div>
237
+ <div class="bar-container"><div class="bar" style="width: 44%;"></div></div>
238
+ </li>
239
+ <li class="data-item">
240
+ <div class="item-header"><span class="country">Corea del Sur</span><span class="value">$4,500M</span></div>
241
+ <div class="bar-container"><div class="bar" style="width: 38%;"></div></div>
242
+ </li>
243
+ <li class="data-item">
244
+ <div class="item-header"><span class="country">España</span><span class="value">$1,400M</span></div>
245
+ <div class="bar-container"><div class="bar" style="width: 15%;"></div></div>
246
+ </li>
247
+ </ul>
248
+ </div>
249
+
250
+ <div class="data-card">
251
+ <div class="card-title">
252
+ <span class="icon">💡</span>
253
+ <h3>Eficiencia I+D por<br>Empresa</h3>
254
+ </div>
255
+ <ul class="data-list">
256
+ <li class="data-item">
257
+ <div class="item-header"><span class="country">Suiza</span><span class="value">13.6 M USD</span></div>
258
+ <div class="bar-container"><div class="bar" style="width: 100%;"></div></div>
259
+ </li>
260
+ <li class="data-item">
261
+ <div class="item-header"><span class="country">Estados Unidos</span><span class="value">12.5 M USD</span></div>
262
+ <div class="bar-container"><div class="bar" style="width: 91.9%;"></div></div>
263
+ </li>
264
+ <li class="data-item">
265
+ <div class="item-header"><span class="country">Alemania</span><span class="value">5.6 M USD</span></div>
266
+ <div class="bar-container"><div class="bar" style="width: 41.2%;"></div></div>
267
+ </li>
268
+ <li class="data-item">
269
+ <div class="item-header"><span class="country">Francia</span><span class="value">1.8 M USD</span></div>
270
+ <div class="bar-container"><div class="bar" style="width: 13.2%;"></div></div>
271
+ </li>
272
+ <li class="data-item">
273
+ <div class="item-header"><span class="country">España</span><span class="value">1.2 M USD</span></div>
274
+ <div class="bar-container"><div class="bar" style="width: 8.8%;"></div></div>
275
+ </li>
276
+ </ul>
277
+ </div>
278
+ </main>
279
+
280
+ <footer class="conclusions-section">
281
+ <div class="conclusion-item"><span class="check-icon">✓</span><span>Estados Unidos domina en volumen absoluto</span></div>
282
+ <div class="conclusion-item"><span class="check-icon">✓</span><span>Europa muestra alta fragmentación empresarial</span></div>
283
+ <div class="conclusion-item"><span class="check-icon">✓</span><span>Asia-Pacífico lidera en eficiencia de patentes</span></div>
284
+ <div class="conclusion-item"><span class="check-icon">✓</span><span>América Latina tiene potencial académico no capitalizado</span></div>
285
+ </footer>
286
+ </div>
287
+ </body>
288
+ </html>
slides/slide12_analisis_cuantitativo_corregido_quality_check_1750786871.png ADDED

Git LFS Details

  • SHA256: 141ba81ccb9fc2490594c7e964819e1e696572d908d898445d3837b7f7f7a3a5
  • Pointer size: 131 Bytes
  • Size of remote file: 394 kB
slides/slide12_analisis_cuantitativo_corregido_quality_check_1750786944.png ADDED

Git LFS Details

  • SHA256: 5ef49467c274603b3f6bf1a031dd35a8e5ac748350f124f948da1182d5a6db37
  • Pointer size: 131 Bytes
  • Size of remote file: 277 kB
slides/slide12_analisis_cuantitativo_quality_check_1750784617.png ADDED
slides/slide12_analisis_cuantitativo_quality_check_1750784705.png ADDED

Git LFS Details

  • SHA256: 6b58f68ce68ccc27f3baa416ac2bc410e0e2f26ed69afb19472d2a304788cec7
  • Pointer size: 131 Bytes
  • Size of remote file: 121 kB
slides/slide12_analisis_cuantitativo_quality_check_1750784787.png ADDED
slides/slide12_analisis_cuantitativo_v2.html ADDED
@@ -0,0 +1,350 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Análisis Cuantitativo Global - Sector Biotecnológico</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
9
+
10
+ body, html {
11
+ margin: 0;
12
+ padding: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: center;
18
+ background-color: #f0f0f0;
19
+ font-family: 'Roboto', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
20
+ }
21
+
22
+ .slide {
23
+ width: 1280px;
24
+ height: 720px;
25
+ background: radial-gradient(circle, #1a4f63, #0f2c3a);
26
+ color: #e0f7fa;
27
+ display: flex;
28
+ flex-direction: column;
29
+ padding: 45px 60px;
30
+ box-sizing: border-box;
31
+ position: relative;
32
+ overflow: hidden;
33
+ }
34
+
35
+ .header {
36
+ text-align: center;
37
+ margin-bottom: 25px;
38
+ }
39
+
40
+ .header h1 {
41
+ font-size: 48px;
42
+ font-weight: 700;
43
+ margin: 0;
44
+ color: #ffffff;
45
+ animation: fadeInDown 0.8s ease-out;
46
+ }
47
+
48
+ .header h2 {
49
+ font-size: 22px;
50
+ font-weight: 300;
51
+ margin: 5px 0 0 0;
52
+ color: #b0bec5;
53
+ animation: fadeInDown 0.8s ease-out 0.2s;
54
+ animation-fill-mode: backwards;
55
+ }
56
+
57
+ .main-content {
58
+ display: grid;
59
+ grid-template-columns: repeat(3, 1fr);
60
+ gap: 25px;
61
+ margin-bottom: 25px;
62
+ flex-grow: 1;
63
+ }
64
+
65
+ .card {
66
+ background-color: rgba(38, 70, 83, 0.4);
67
+ border-radius: 12px;
68
+ padding: 20px;
69
+ box-sizing: border-box;
70
+ display: flex;
71
+ flex-direction: column;
72
+ border: 1px solid rgba(255, 255, 255, 0.1);
73
+ animation: fadeInUp 0.8s ease-out;
74
+ }
75
+
76
+ .main-content .card:nth-child(1) { animation-delay: 0.3s; animation-fill-mode: backwards; }
77
+ .main-content .card:nth-child(2) { animation-delay: 0.4s; animation-fill-mode: backwards; }
78
+ .main-content .card:nth-child(3) { animation-delay: 0.5s; animation-fill-mode: backwards; }
79
+
80
+
81
+ .card-title {
82
+ font-size: 18px;
83
+ font-weight: 500;
84
+ margin-bottom: 20px;
85
+ color: #ffffff;
86
+ border-left: 3px solid #4dd0e1;
87
+ padding-left: 10px;
88
+ }
89
+
90
+ .data-list {
91
+ list-style: none;
92
+ padding: 0;
93
+ margin: 0;
94
+ flex-grow: 1;
95
+ }
96
+
97
+ .data-item {
98
+ display: flex;
99
+ align-items: center;
100
+ margin-bottom: 16px;
101
+ font-size: 15px;
102
+ }
103
+
104
+ .data-item:last-child {
105
+ margin-bottom: 0;
106
+ }
107
+
108
+ .flag-icon {
109
+ width: 24px;
110
+ height: 18px;
111
+ margin-right: 10px;
112
+ border: 1px solid rgba(255,255,255,0.2);
113
+ }
114
+
115
+ .country-name {
116
+ width: 95px;
117
+ }
118
+
119
+ .bar-container {
120
+ flex-grow: 1;
121
+ height: 12px;
122
+ background-color: rgba(0, 0, 0, 0.25);
123
+ border-radius: 6px;
124
+ margin: 0 10px;
125
+ overflow: hidden;
126
+ }
127
+
128
+ .bar {
129
+ height: 100%;
130
+ background-color: #4dd0e1;
131
+ border-radius: 6px;
132
+ transform-origin: left;
133
+ animation: growBar 1.2s cubic-bezier(0.25, 1, 0.5, 1) forwards;
134
+ }
135
+
136
+ .data-value {
137
+ font-weight: 500;
138
+ width: 75px;
139
+ text-align: right;
140
+ color: #ffffff;
141
+ }
142
+
143
+ .footer-content {
144
+ display: grid;
145
+ grid-template-columns: 5fr 4fr;
146
+ gap: 25px;
147
+ }
148
+
149
+ .footer-content .card:nth-child(1) { animation-delay: 0.6s; animation-fill-mode: backwards; }
150
+ .footer-content .card:nth-child(2) { animation-delay: 0.7s; animation-fill-mode: backwards; }
151
+
152
+ .summary-list {
153
+ list-style: none;
154
+ padding: 0;
155
+ margin: 0;
156
+ }
157
+
158
+ .summary-item {
159
+ font-size: 15px;
160
+ font-weight: 300;
161
+ margin-bottom: 12px;
162
+ display: flex;
163
+ align-items: flex-start;
164
+ }
165
+
166
+ .summary-item:last-child {
167
+ margin-bottom: 0;
168
+ }
169
+
170
+ .summary-item .icon {
171
+ margin-right: 10px;
172
+ color: #4dd0e1;
173
+ font-weight: 700;
174
+ line-height: 1.5;
175
+ }
176
+
177
+ .conclusions .icon {
178
+ color: #66bb6a;
179
+ }
180
+
181
+ .conclusions .card-title {
182
+ border-left-color: #66bb6a;
183
+ }
184
+
185
+ /* Bar widths */
186
+ .bar-empresas-1 { width: 100%; }
187
+ .bar-empresas-2 { width: 72.5%; }
188
+ .bar-empresas-3 { width: 45%; }
189
+ .bar-empresas-4 { width: 30.8%; }
190
+ .bar-empresas-5 { width: 23.4%; }
191
+
192
+ .bar-inversion-1 { width: 100%; }
193
+ .bar-inversion-2 { width: 10.6%; }
194
+ .bar-inversion-3 { width: 10.4%; }
195
+ .bar-inversion-4 { width: 9%; }
196
+ .bar-inversion-5 { width: 2.8%; }
197
+
198
+ .bar-eficiencia-1 { width: 100%; }
199
+ .bar-eficiencia-2 { width: 91.9%; }
200
+ .bar-eficiencia-3 { width: 41.2%; }
201
+ .bar-eficiencia-4 { width: 13.2%; }
202
+ .bar-eficiencia-5 { width: 8.8%; }
203
+
204
+ /* Animations */
205
+ @keyframes fadeInDown {
206
+ from { opacity: 0; transform: translateY(-20px); }
207
+ to { opacity: 1; transform: translateY(0); }
208
+ }
209
+ @keyframes fadeInUp {
210
+ from { opacity: 0; transform: translateY(20px); }
211
+ to { opacity: 1; transform: translateY(0); }
212
+ }
213
+ @keyframes growBar {
214
+ from { transform: scaleX(0); }
215
+ to { transform: scaleX(1); }
216
+ }
217
+
218
+ </style>
219
+ </head>
220
+ <body>
221
+ <div class="slide">
222
+ <header class="header">
223
+ <h1>Análisis Cuantitativo Global</h1>
224
+ <h2>Datos Comparativos del Sector Biotecnológico</h2>
225
+ </header>
226
+
227
+ <main class="main-content">
228
+ <div class="card">
229
+ <h3 class="card-title">Líderes en N° de Empresas</h3>
230
+ <ul class="data-list">
231
+ <li class="data-item">
232
+ <svg class="flag-icon" viewBox="0 0 32 24"><path fill="#BF0A30" d="M0 0h32v24H0z"/><path fill="#FFF" d="M0 0h32v12H0z"/><path fill="#002868" d="M0 0h16v12H0z"/><path fill="#FFF" d="m2.5 1.25 1 2.9h3.1L4 5.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm8 0 1 2.9h3.1L12 5.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm0 5 1 2.9h3.1L12 11.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm-8 0 1 2.9h3.1L4 11.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1z"/></svg>
233
+ <span class="country-name">EE. UU.</span>
234
+ <div class="bar-container"><div class="bar bar-empresas-1"></div></div>
235
+ <span class="data-value">4,000+</span>
236
+ </li>
237
+ <li class="data-item">
238
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#002395" d="M0 0h1v2H0z"/><path fill="#fff" d="M1 0h1v2H1z"/><path fill="#ED2939" d="M2 0h1v2H2z"/></svg>
239
+ <span class="country-name">Francia</span>
240
+ <div class="bar-container"><div class="bar bar-empresas-2"></div></div>
241
+ <span class="data-value">2,900</span>
242
+ </li>
243
+ <li class="data-item">
244
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#fff" d="M0 0h3v2H0z"/><circle cx="1.5" cy="1" r=".5" fill="#CD2E3A"/><path d="M1.5 1a.5.5 0 0 1 0-1Z" fill="#0047A0"/><path fill="none" stroke="#000" stroke-width=".1" d="M.5.25h.25v.5H.5Zm1.5 0h.25v.5H2Zm-.25 1H2v.5h-.25Zm-1.5 0H.5v.5H.25Z"/></svg>
245
+ <span class="country-name">Corea del Sur</span>
246
+ <div class="bar-container"><div class="bar bar-empresas-3"></div></div>
247
+ <span class="data-value">1,800</span>
248
+ </li>
249
+ <li class="data-item">
250
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#C60B1E" d="M0 0h3v2H0z"/><path fill="#FFC400" d="M0 .5h3v1H0z"/></svg>
251
+ <span class="country-name">España</span>
252
+ <div class="bar-container"><div class="bar bar-empresas-4"></div></div>
253
+ <span class="data-value">1,233</span>
254
+ </li>
255
+ <li class="data-item">
256
+ <svg class="flag-icon" viewBox="0 0 5 3"><path d="M0 0h5v3H0z"/><path fill="#D00" d="M0 1h5v2H0z"/><path fill="#FFCE00" d="M0 2h5v1H0z"/></svg>
257
+ <span class="country-name">Alemania</span>
258
+ <div class="bar-container"><div class="bar bar-empresas-5"></div></div>
259
+ <span class="data-value">935</span>
260
+ </li>
261
+ </ul>
262
+ </div>
263
+ <div class="card">
264
+ <h3 class="card-title">Inversión en I+D (M USD)</h3>
265
+ <ul class="data-list">
266
+ <li class="data-item">
267
+ <svg class="flag-icon" viewBox="0 0 32 24"><path fill="#BF0A30" d="M0 0h32v24H0z"/><path fill="#FFF" d="M0 0h32v12H0z"/><path fill="#002868" d="M0 0h16v12H0z"/><path fill="#FFF" d="m2.5 1.25 1 2.9h3.1L4 5.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm8 0 1 2.9h3.1L12 5.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm0 5 1 2.9h3.1L12 11.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm-8 0 1 2.9h3.1L4 11.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1z"/></svg>
268
+ <span class="country-name">EE. UU.</span>
269
+ <div class="bar-container"><div class="bar bar-inversion-1"></div></div>
270
+ <span class="data-value">$50,000M</span>
271
+ </li>
272
+ <li class="data-item">
273
+ <svg class="flag-icon" viewBox="0 0 5 3"><path d="M0 0h5v3H0z"/><path fill="#D00" d="M0 1h5v2H0z"/><path fill="#FFCE00" d="M0 2h5v1H0z"/></svg>
274
+ <span class="country-name">Alemania</span>
275
+ <div class="bar-container"><div class="bar bar-inversion-2"></div></div>
276
+ <span class="data-value">$5,300M</span>
277
+ </li>
278
+ <li class="data-item">
279
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#002395" d="M0 0h1v2H0z"/><path fill="#fff" d="M1 0h1v2H1z"/><path fill="#ED2939" d="M2 0h1v2H2z"/></svg>
280
+ <span class="country-name">Francia</span>
281
+ <div class="bar-container"><div class="bar bar-inversion-3"></div></div>
282
+ <span class="data-value">$5,200M</span>
283
+ </li>
284
+ <li class="data-item">
285
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#fff" d="M0 0h3v2H0z"/><circle cx="1.5" cy="1" r=".5" fill="#CD2E3A"/><path d="M1.5 1a.5.5 0 0 1 0-1Z" fill="#0047A0"/><path fill="none" stroke="#000" stroke-width=".1" d="M.5.25h.25v.5H.5Zm1.5 0h.25v.5H2Zm-.25 1H2v.5h-.25Zm-1.5 0H.5v.5H.25Z"/></svg>
286
+ <span class="country-name">Corea del Sur</span>
287
+ <div class="bar-container"><div class="bar bar-inversion-4"></div></div>
288
+ <span class="data-value">$4,500M</span>
289
+ </li>
290
+ <li class="data-item">
291
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#C60B1E" d="M0 0h3v2H0z"/><path fill="#FFC400" d="M0 .5h3v1H0z"/></svg>
292
+ <span class="country-name">España</span>
293
+ <div class="bar-container"><div class="bar bar-inversion-5"></div></div>
294
+ <span class="data-value">$1,400M</span>
295
+ </li>
296
+ </ul>
297
+ </div>
298
+ <div class="card">
299
+ <h3 class="card-title">Eficiencia (I+D/empresa)</h3>
300
+ <ul class="data-list">
301
+ <li class="data-item">
302
+ <svg class="flag-icon" viewBox="0 0 1 1"><path fill="#D52B1E" d="M0 0h1v1H0z"/><path fill="#FFF" d="M.4.1h.2v.8H.4zM.1.4h.8v.2H.1z"/></svg>
303
+ <span class="country-name">Suiza</span>
304
+ <div class="bar-container"><div class="bar bar-eficiencia-1"></div></div>
305
+ <span class="data-value">13.6</span>
306
+ </li>
307
+ <li class="data-item">
308
+ <svg class="flag-icon" viewBox="0 0 32 24"><path fill="#BF0A30" d="M0 0h32v24H0z"/><path fill="#FFF" d="M0 0h32v12H0z"/><path fill="#002868" d="M0 0h16v12H0z"/><path fill="#FFF" d="m2.5 1.25 1 2.9h3.1L4 5.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm8 0 1 2.9h3.1L12 5.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm0 5 1 2.9h3.1L12 11.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1zm-8 0 1 2.9h3.1L4 11.9l1 2.9-2.5-1.8-2.5 1.8 1-2.9-2.6-1.75h3.1z"/></svg>
309
+ <span class="country-name">EE. UU.</span>
310
+ <div class="bar-container"><div class="bar bar-eficiencia-2"></div></div>
311
+ <span class="data-value">12.5</span>
312
+ </li>
313
+ <li class="data-item">
314
+ <svg class="flag-icon" viewBox="0 0 5 3"><path d="M0 0h5v3H0z"/><path fill="#D00" d="M0 1h5v2H0z"/><path fill="#FFCE00" d="M0 2h5v1H0z"/></svg>
315
+ <span class="country-name">Alemania</span>
316
+ <div class="bar-container"><div class="bar bar-eficiencia-3"></div></div>
317
+ <span class="data-value">5.6</span>
318
+ </li>
319
+ <li class="data-item">
320
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#002395" d="M0 0h1v2H0z"/><path fill="#fff" d="M1 0h1v2H1z"/><path fill="#ED2939" d="M2 0h1v2H2z"/></svg>
321
+ <span class="country-name">Francia</span>
322
+ <div class="bar-container"><div class="bar bar-eficiencia-4"></div></div>
323
+ <span class="data-value">1.8</span>
324
+ </li>
325
+ <li class="data-item">
326
+ <svg class="flag-icon" viewBox="0 0 3 2"><path fill="#C60B1E" d="M0 0h3v2H0z"/><path fill="#FFC400" d="M0 .5h3v1H0z"/></svg>
327
+ <span class="country-name">España</span>
328
+ <div class="bar-container"><div class="bar bar-eficiencia-5"></div></div>
329
+ <span class="data-value">1.2</span>
330
+ </li>
331
+ </ul>
332
+ </div>
333
+ </main>
334
+
335
+ <footer class="footer-content">
336
+ <div class="card">
337
+ <h3 class="card-title">Patrones Identificados</h3>
338
+ <ul class="summary-list">
339
+ <li class="summary-item"><span class="icon">✓</span><span>EE. UU. domina en volumen absoluto de empresas e inversión.</span></li>
340
+ <li class="summary-item"><span class="icon">✓</span><span>Europa muestra alta fragmentación empresarial pero con focos de eficiencia (Suiza, Alemania).</span></li>
341
+ <li class="summary-item"><span class="icon">✓</span><span>Asia-Pacífico (Corea del Sur) muestra un equilibrio entre volumen y inversión.</span></li>
342
+ <li class="summary-item"><span class="icon">✓</span><span>América Latina (no en top 5) tiene un potencial académico aún no capitalizado en la industria.</span></li>
343
+ </ul>
344
+ </div>
345
+ <div class="card conclusions">
346
+ <h3 class="card-title">Conclusiones Clave</h3>
347
+ <ul class="summary-list">
348
+ <li class="summary-item"><span class="icon">•</span><span>El volumen de empresas no garantiza por sí solo la eficiencia en I+D.</span></li>
349
+ <li class="summary-item"><span class="icon">•</span><span>La inversión intensiva por empresa es un factor clave para la competitividad global.</span></li>
350
+ <li class="summary-item"><span class="icon">•</span><span>Se necesitan políticas de transferencia tecnológica para convertir el
slides/slide12_analisis_cuantitativo_v2_quality_check_1750784856.png ADDED

Git LFS Details

  • SHA256: 462ee064e747ebb3771416954b74bcf0978d44e4c1b2a0cc29668f0019e06b0d
  • Pointer size: 131 Bytes
  • Size of remote file: 353 kB
slides/slide12_analisis_cuantitativo_v2_quality_check_1750784935.png ADDED

Git LFS Details

  • SHA256: 4dc3fc60c1751b7bd462c926b742ef1c8af1ee815ced233500837caf57cc0ee1
  • Pointer size: 131 Bytes
  • Size of remote file: 300 kB
slides/slide12_analisis_cuantitativo_v2_quality_check_1750785036.png ADDED

Git LFS Details

  • SHA256: 08be76457d85bc72dd0c51b7c345479981b3023d2731dfff9e969ef9cc8d4baa
  • Pointer size: 131 Bytes
  • Size of remote file: 438 kB
slides/slide13_correlacion_educacion.html ADDED
@@ -0,0 +1,303 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Correlación Educación vs. Desarrollo</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
9
+
10
+ body {
11
+ display: flex;
12
+ justify-content: center;
13
+ align-items: center;
14
+ width: 100vw;
15
+ height: 100vh;
16
+ margin: 0;
17
+ background-color: #f0f2f5;
18
+ font-family: 'Poppins', sans-serif;
19
+ overflow: hidden;
20
+ }
21
+
22
+ .slide {
23
+ width: 1280px;
24
+ height: 720px;
25
+ background: linear-gradient(135deg, #023a6d 0%, #00529b 30%, #0077b6 60%, #009688 100%);
26
+ color: #ffffff;
27
+ display: grid;
28
+ grid-template-columns: 1fr 1fr;
29
+ grid-template-rows: auto 1fr auto;
30
+ gap: 20px 40px;
31
+ padding: 40px;
32
+ box-sizing: border-box;
33
+ box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
34
+ animation: fadeIn 1s ease-in-out;
35
+ }
36
+
37
+ @keyframes fadeIn {
38
+ from { opacity: 0; transform: scale(0.95); }
39
+ to { opacity: 1; transform: scale(1); }
40
+ }
41
+
42
+ .header {
43
+ grid-column: 1 / -1;
44
+ text-align: left;
45
+ border-bottom: 2px solid rgba(255, 255, 255, 0.3);
46
+ padding-bottom: 15px;
47
+ }
48
+
49
+ .header h1 {
50
+ font-size: 48px;
51
+ margin: 0;
52
+ font-weight: 700;
53
+ letter-spacing: 1px;
54
+ }
55
+
56
+ .header h2 {
57
+ font-size: 22px;
58
+ margin: 5px 0 0;
59
+ font-weight: 300;
60
+ opacity: 0.9;
61
+ }
62
+
63
+ .section {
64
+ background: rgba(255, 255, 255, 0.05);
65
+ border-radius: 12px;
66
+ padding: 20px;
67
+ box-sizing: border-box;
68
+ display: flex;
69
+ flex-direction: column;
70
+ backdrop-filter: blur(5px);
71
+ }
72
+
73
+ .section-title {
74
+ font-size: 20px;
75
+ font-weight: 600;
76
+ margin-bottom: 15px;
77
+ color: #a7d8ff;
78
+ display: flex;
79
+ align-items: center;
80
+ }
81
+
82
+ .section-title svg {
83
+ margin-right: 10px;
84
+ }
85
+
86
+ .bar-chart-container {
87
+ flex-grow: 1;
88
+ display: flex;
89
+ flex-direction: column;
90
+ justify-content: space-around;
91
+ }
92
+
93
+ .bar-item {
94
+ display: flex;
95
+ align-items: center;
96
+ margin-bottom: 8px;
97
+ font-size: 14px;
98
+ }
99
+
100
+ .bar-label {
101
+ width: 100px;
102
+ text-align: right;
103
+ padding-right: 10px;
104
+ white-space: nowrap;
105
+ }
106
+
107
+ .bar-wrapper {
108
+ flex-grow: 1;
109
+ height: 20px;
110
+ background: rgba(0, 0, 0, 0.2);
111
+ border-radius: 10px;
112
+ }
113
+
114
+ .bar {
115
+ height: 100%;
116
+ background: linear-gradient(90deg, #4facfe 0%, #00f2fe 100%);
117
+ border-radius: 10px;
118
+ animation: growBar 1.5s cubic-bezier(0.25, 1, 0.5, 1);
119
+ transform-origin: left;
120
+ display: flex;
121
+ align-items: center;
122
+ justify-content: flex-end;
123
+ color: #003366;
124
+ font-weight: 600;
125
+ font-size: 12px;
126
+ padding-right: 8px;
127
+ box-sizing: border-box;
128
+ }
129
+
130
+ @keyframes growBar {
131
+ from { transform: scaleX(0); }
132
+ to { transform: scaleX(1); }
133
+ }
134
+
135
+ .list ul {
136
+ list-style: none;
137
+ padding-left: 0;
138
+ margin: 0;
139
+ }
140
+
141
+ .list li {
142
+ margin-bottom: 10px;
143
+ padding-left: 25px;
144
+ position: relative;
145
+ font-size: 14px;
146
+ line-height: 1.5;
147
+ }
148
+
149
+ .list li::before {
150
+ content: '✓';
151
+ position: absolute;
152
+ left: 0;
153
+ color: #4CAF50;
154
+ font-weight: bold;
155
+ font-size: 18px;
156
+ }
157
+
158
+ .comparison-list li {
159
+ display: flex;
160
+ align-items: flex-start;
161
+ margin-bottom: 12px;
162
+ }
163
+ .comparison-list li::before {
164
+ content: '•';
165
+ color: #4facfe;
166
+ font-size: 24px;
167
+ line-height: 1;
168
+ margin-right: 10px;
169
+ }
170
+ .comparison-list strong {
171
+ color: #a7d8ff;
172
+ display: block;
173
+ }
174
+
175
+ .flowchart {
176
+ display: flex;
177
+ justify-content: space-around;
178
+ align-items: center;
179
+ width: 100%;
180
+ margin-top: 15px;
181
+ }
182
+
183
+ .flow-item {
184
+ display: flex;
185
+ flex-direction: column;
186
+ align-items: center;
187
+ text-align: center;
188
+ }
189
+
190
+ .flow-icon {
191
+ width: 60px;
192
+ height: 60px;
193
+ background: rgba(255, 255, 255, 0.1);
194
+ border-radius: 50%;
195
+ display: flex;
196
+ justify-content: center;
197
+ align-items: center;
198
+ margin-bottom: 8px;
199
+ border: 2px solid #4facfe;
200
+ }
201
+
202
+ .flow-arrow {
203
+ font-size: 32px;
204
+ font-weight: bold;
205
+ color: #a7d8ff;
206
+ transform: translateY(-15px);
207
+ }
208
+
209
+ .conclusion {
210
+ grid-column: 1 / -1;
211
+ background: rgba(0, 0, 0, 0.2);
212
+ border-left: 5px solid #4CAF50;
213
+ padding: 20px;
214
+ border-radius: 0 8px 8px 0;
215
+ font-size: 20px;
216
+ font-style: italic;
217
+ text-align: center;
218
+ font-weight: 600;
219
+ letter-spacing: 0.5px;
220
+ }
221
+
222
+ </style>
223
+ </head>
224
+ <body>
225
+ <div class="slide">
226
+ <div class="header">
227
+ <h1>Correlación Educación vs. Desarrollo</h1>
228
+ <h2>Análisis de la relación entre oferta académica e innovación</h2>
229
+ </div>
230
+
231
+ <div class="section">
232
+ <h3 class="section-title">
233
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="fill: #a7d8ff;"><path d="M12 20V10"></path><path d="M18 20V4"></path><path d="M6 20v-4"></path></svg>
234
+ Productividad Académica (Patentes PCT / Programas)
235
+ </h3>
236
+ <div class="bar-chart-container">
237
+ <div class="bar-item">
238
+ <div class="bar-label">Corea del Sur</div>
239
+ <div class="bar-wrapper"><div class="bar" style="width: 100%;">400</div></div>
240
+ </div>
241
+ <div class="bar-item">
242
+ <div class="bar-label">Estados Unidos</div>
243
+ <div class="bar-wrapper"><div class="bar" style="width: 68.5%;">274</div></div>
244
+ </div>
245
+ <div class="bar-item">
246
+ <div class="bar-label">Alemania</div>
247
+ <div class="bar-wrapper"><div class="bar" style="width: 60.5%;">242</div></div>
248
+ </div>
249
+ <div class="bar-item">
250
+ <div class="bar-label">Francia</div>
251
+ <div class="bar-wrapper"><div class="bar" style="width: 35%;">140</div></div>
252
+ </div>
253
+ <div class="bar-item">
254
+ <div class="bar-label">España</div>
255
+ <div class="bar-wrapper"><div class="bar" style="width: 6%;">24</div></div>
256
+ </div>
257
+ </div>
258
+ <div class="flowchart">
259
+ <div class="flow-item">
260
+ <div class="flow-icon"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 10v6M2 10l10-5 10 5-10 5z"></path><path d="M6 12v5c3 3 9 3 12 0v-5"></path></svg></div>
261
+ <span>Academia</span>
262
+ </div>
263
+ <div class="flow-arrow">→</div>
264
+ <div class="flow-item">
265
+ <div class="flow-icon"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m12 19-7-7 7-7"></path><path d="M19 12H5"></path></svg></div>
266
+ <span>Transferencia</span>
267
+ </div>
268
+ <div class="flow-arrow">→</div>
269
+ <div class="flow-item">
270
+ <div class="flow-icon"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z"></path><path d="M12 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z"></path><path d="M12 2v2"></path><path d="M12 20v2"></path><path d="m4.93 4.93 1.41 1.41"></path><path d="m17.66 17.66 1.41 1.41"></path><path d="M2 12h2"></path><path d="M20 12h2"></path><path d="m4.93 19.07 1.41-1.41"></path><path d="m17.66 6.34 1.41-1.41"></path></svg></div>
271
+ <span>Industria</span>
272
+ </div>
273
+ </div>
274
+ </div>
275
+
276
+ <div class="section list">
277
+ <h3 class="section-title">
278
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="fill: #a7d8ff;"><path d="M14 9a2 2 0 0 1-2 2H6l-4 4V4c0-1.1.9-2 2-2h8a2 2 0 0 1 2 2v5Z"></path><path d="M18 9h2a2 2 0 0 1 2 2v9l-4-4h-2a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2Z"></path></svg>
279
+ Factores Determinantes
280
+ </h3>
281
+ <strong>Variables Críticas:</strong>
282
+ <ul>
283
+ <li>Calidad académica > Cantidad de programas</li>
284
+ <li>Integración universidad-industria sistemática</li>
285
+ <li>Disponibilidad de capital de riesgo especializado</li>
286
+ <li>Marcos regulatorios para spin-offs universitarios</li>
287
+ <li>Protección de propiedad intelectual</li>
288
+ </ul>
289
+ <br>
290
+ <strong>Modelos de Transferencia Exitosos:</strong>
291
+ <ul>
292
+ <li>Alemania: BioRegions descentralizadas</li>
293
+ <li>Estados Unidos: Clusters como Boston/Cambridge</li>
294
+ <li>Suiza: ETH Zurich - industria de alta eficiencia</li>
295
+ </ul>
296
+ </div>
297
+
298
+ <div class="conclusion">
299
+ "La academia es condición necesaria pero no suficiente. Se requiere un ecosistema integral de innovación."
300
+ </div>
301
+ </div>
302
+ </body>
303
+ </html>
slides/slide13_correlacion_educacion_quality_check_1750785114.png ADDED

Git LFS Details

  • SHA256: ed445cbfc10738650b38caf804ed8952c6afabb0d675cde12aa7a4a520b925d7
  • Pointer size: 131 Bytes
  • Size of remote file: 320 kB
slides/slide14_modelos_comparativos.html ADDED
@@ -0,0 +1,270 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="es">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Modelos Organizacionales Comparativos</title>
7
+ <style>
8
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
9
+
10
+ body, html {
11
+ margin: 0;
12
+ padding: 0;
13
+ width: 100%;
14
+ height: 100%;
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: center;
18
+ background-color: #f0f4f8;
19
+ font-family: 'Poppins', sans-serif;
20
+ }
21
+
22
+ .slide {
23
+ width: 1280px;
24
+ height: 720px;
25
+ background-color: #f0f4f8;
26
+ display: flex;
27
+ flex-direction: column;
28
+ align-items: center;
29
+ justify-content: center;
30
+ padding: 40px;
31
+ box-sizing: border-box;
32
+ animation: fadeIn 1s ease-in-out;
33
+ }
34
+
35
+ @keyframes fadeIn {
36
+ from { opacity: 0; }
37
+ to { opacity: 1; }
38
+ }
39
+
40
+ .header {
41
+ text-align: center;
42
+ margin-bottom: 30px;
43
+ color: #1c3d5a;
44
+ }
45
+
46
+ .header h1 {
47
+ font-size: 44px;
48
+ font-weight: 700;
49
+ margin: 0;
50
+ }
51
+
52
+ .header p {
53
+ font-size: 20px;
54
+ font-weight: 400;
55
+ margin: 5px 0 0 0;
56
+ color: #5a7184;
57
+ }
58
+
59
+ .comparison-container {
60
+ display: flex;
61
+ justify-content: center;
62
+ gap: 40px;
63
+ width: 100%;
64
+ }
65
+
66
+ .card {
67
+ background-color: #ffffff;
68
+ border-radius: 16px;
69
+ box-shadow: 0 8px 25px rgba(28, 61, 90, 0.1);
70
+ width: 540px;
71
+ padding: 25px 30px;
72
+ box-sizing: border-box;
73
+ border-top: 5px solid;
74
+ display: flex;
75
+ flex-direction: column;
76
+ gap: 20px;
77
+ animation: slideUp 0.8s ease-out forwards;
78
+ opacity: 0;
79
+ }
80
+
81
+ .card:nth-child(1) { animation-delay: 0.2s; }
82
+ .card:nth-child(2) { animation-delay: 0.4s; }
83
+
84
+ @keyframes slideUp {
85
+ from {
86
+ opacity: 0;
87
+ transform: translateY(30px);
88
+ }
89
+ to {
90
+ opacity: 1;
91
+ transform: translateY(0);
92
+ }
93
+ }
94
+
95
+ .card-industrial { border-color: #0077B6; }
96
+ .card-professional { border-color: #4CAF50; }
97
+
98
+ .card-header {
99
+ display: flex;
100
+ align-items: center;
101
+ gap: 15px;
102
+ }
103
+
104
+ .card-header .icon {
105
+ width: 40px;
106
+ height: 40px;
107
+ display: flex;
108
+ align-items: center;
109
+ justify-content: center;
110
+ border-radius: 8px;
111
+ }
112
+
113
+ .icon-industrial { background-color: #e6f2f8; }
114
+ .icon-professional { background-color: #e8f5e9; }
115
+
116
+ .card-header h2 {
117
+ font-size: 22px;
118
+ font-weight: 600;
119
+ margin: 0;
120
+ }
121
+
122
+ .card-industrial .card-header h2 { color: #0077B6; }
123
+ .card-professional .card-header h2 { color: #4CAF50; }
124
+
125
+ .section-title {
126
+ font-size: 18px;
127
+ font-weight: 600;
128
+ color: #1c3d5a;
129
+ margin-bottom: 10px;
130
+ }
131
+
132
+ .structure-items {
133
+ display: flex;
134
+ gap: 10px;
135
+ }
136
+
137
+ .structure-item {
138
+ background-color: #f8f9fa;
139
+ border: 1px solid #dee2e6;
140
+ border-radius: 8px;
141
+ padding: 8px 12px;
142
+ font-size: 14px;
143
+ color: #495057;
144
+ flex-grow: 1;
145
+ text-align: center;
146
+ }
147
+
148
+ .card-industrial .structure-item {
149
+ background-color: #e6f2f8;
150
+ border-color: #b3d7e8;
151
+ color: #005f8e;
152
+ }
153
+
154
+ .card-professional .structure-item {
155
+ background-color: #e8f5e9;
156
+ border-color: #c8e6c9;
157
+ color: #388e3c;
158
+ }
159
+
160
+ .examples-list, .functions-list {
161
+ list-style: none;
162
+ padding-left: 0;
163
+ margin: 0;
164
+ font-size: 15px;
165
+ color: #5a7184;
166
+ }
167
+
168
+ .examples-list li, .functions-list li {
169
+ margin-bottom: 8px;
170
+ line-height: 1.5;
171
+ }
172
+
173
+ .examples-list strong {
174
+ color: #343a40;
175
+ font-weight: 600;
176
+ }
177
+
178
+ .functions-list li {
179
+ display: flex;
180
+ align-items: center;
181
+ gap: 10px;
182
+ }
183
+
184
+ .check-icon {
185
+ width: 18px;
186
+ height: 18px;
187
+ flex-shrink: 0;
188
+ }
189
+ </style>
190
+ </head>
191
+ <body>
192
+ <div class="slide">
193
+ <div class="header">
194
+ <h1>Modelos Organizacionales Comparativos</h1>
195
+ <p>Análisis estructural de enfoques globales</p>
196
+ </div>
197
+ <div class="comparison-container">
198
+ <div class="card card-industrial">
199
+ <div class="card-header">
200
+ <div class="icon icon-industrial">
201
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#0077B6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>
202
+ </div>
203
+ <h2>MODELO INDUSTRIAL/GREMIAL</h2>
204
+ </div>
205
+ <div>
206
+ <h3 class="section-title">Estructura:</h3>
207
+ <div class="structure-items">
208
+ <div class="structure-item">Asociaciones</div>
209
+ <div class="structure-item">Federaciones</div>
210
+ <div class="structure-item">Cámaras</div>
211
+ </div>
212
+ </div>
213
+ <div>
214
+ <h3 class="section-title">Ejemplos Representativos:</h3>
215
+ <ul class="examples-list">
216
+ <li><strong>BIO (EE.UU.)</strong> - 1,000+ empresas</li>
217
+ <li><strong>EuropaBio (UE)</strong> - Federación</li>
218
+ <li><strong>AseBio (España)</strong> - 280+ socios</li>
219
+ <li><strong>AusBiotech (Australia)</strong> - Ecosistema</li>
220
+ </ul>
221
+ </div>
222
+ <div>
223
+ <h3 class="section-title">Funciones Principales:</h3>
224
+ <ul class="functions-list">
225
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#0077B6"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Lobby y advocacy político</li>
226
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#0077B6"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Desarrollo de mercados</li>
227
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#0077B6"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Networking empresarial</li>
228
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#0077B6"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Promoción de inversión</li>
229
+ </ul>
230
+ </div>
231
+ </div>
232
+
233
+ <div class="card card-professional">
234
+ <div class="card-header">
235
+ <div class="icon icon-professional">
236
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#4CAF50" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
237
+ </div>
238
+ <h2>MODELO REGULACIÓN PROFESIONAL</h2>
239
+ </div>
240
+ <div>
241
+ <h3 class="section-title">Estructura:</h3>
242
+ <div class="structure-items">
243
+ <div class="structure-item">Colegios profesionales</div>
244
+ <div class="structure-item">Consejos regulatorios</div>
245
+ <div class="structure-item">Órganos de control</div>
246
+ </div>
247
+ </div>
248
+ <div>
249
+ <h3 class="section-title">Ejemplos Representativos:</h3>
250
+ <ul class="examples-list">
251
+ <li><strong>CSB Argentina</strong> - Ley Provincial 13.490</li>
252
+ <li><strong>COBIEC Ecuador</strong> - Acuerdo Ministerial</li>
253
+ <li><strong>CPBiol Colombia</strong> - Regulación por campo</li>
254
+ <li><strong>Órganos de Control Ético</strong> - Varios países</li>
255
+ </ul>
256
+ </div>
257
+ <div>
258
+ <h3 class="section-title">Funciones Principales:</h3>
259
+ <ul class="functions-list">
260
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#4CAF50"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Matriculación profesional</li>
261
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#4CAF50"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Control del ejercicio</li>
262
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#4CAF50"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Estándares éticos</li>
263
+ <li><svg class="check-icon" viewBox="0 0 24 24" fill="#4CAF50"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>Defensa gremial</li>
264
+ </ul>
265
+ </div>
266
+ </div>
267
+ </div>
268
+ </div>
269
+ </body>
270
+ </html>