File size: 28,145 Bytes
94b8f27
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
a0b7d8c
 
 
94b8f27
 
 
 
 
 
a0b7d8c
94b8f27
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
a0b7d8c
94b8f27
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
a0b7d8c
 
 
94b8f27
 
 
 
a0b7d8c
94b8f27
a0b7d8c
94b8f27
 
a0b7d8c
 
 
94b8f27
a0b7d8c
 
 
 
94b8f27
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
a0b7d8c
94b8f27
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
a0b7d8c
 
 
94b8f27
 
a0b7d8c
 
 
94b8f27
 
a0b7d8c
 
 
94b8f27
 
a0b7d8c
 
 
94b8f27
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7487512
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>SciML & AI for Science β€” Aethron Labs</title>
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  <link href="https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400&family=Syne:wght@400;600;700;800&display=swap" rel="stylesheet" />
  <style>
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg: #060810;
      --surface: #0b0f1e;
      --surface2: #111628;
      --border: rgba(100,120,255,0.12);
      --violet: #7c5cfc;
      --cyan: #00e5ff;
      --gold: #ffc857;
      --green: #39d353;
      --pink: #ff4d8d;
      --text: #e8eaf6;
      --muted: #5a6080;
      --mono: 'Space Mono', monospace;
      --sans: 'Syne', sans-serif;
    }
    html { scroll-behavior: smooth; }
    body {
      background: var(--bg);
      color: var(--text);
      font-family: var(--sans);
      overflow-x: hidden;
    }

    /* GRID BG */
    body::before {
      content: '';
      position: fixed; inset: 0;
      background-image:
        linear-gradient(rgba(124,92,252,0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(124,92,252,0.035) 1px, transparent 1px);
      background-size: 48px 48px;
      pointer-events: none; z-index: 0;
    }

    /* GLOW ORBS */
    .orb { position: fixed; border-radius: 50%; filter: blur(140px); pointer-events: none; z-index: 0; }
    .orb-1 { width: 700px; height: 700px; background: #5c3ffc; opacity: 0.12; top: -300px; left: -200px; }
    .orb-2 { width: 500px; height: 500px; background: #00e5ff; opacity: 0.08; bottom: -100px; right: -150px; }
    .orb-3 { width: 350px; height: 350px; background: #ffc857; opacity: 0.06; top: 50%; left: 60%; }

    /* NAV */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 100;
      display: flex; align-items: center; justify-content: space-between;
      padding: 1rem 2.5rem;
      background: rgba(6,8,16,0.88); backdrop-filter: blur(14px);
      border-bottom: 1px solid var(--border);
    }
    .nav-logo { font-family: var(--mono); font-size: 0.78rem; color: var(--cyan); letter-spacing: 0.18em; text-transform: uppercase; }
    .nav-logo em { color: var(--violet); font-style: normal; }
    .nav-pill {
      font-family: var(--mono); font-size: 0.65rem; letter-spacing: 0.12em; text-transform: uppercase;
      padding: 0.3rem 0.9rem; border: 1px solid rgba(0,229,255,0.3); border-radius: 2px; color: var(--cyan);
    }

    /* HERO */
    .hero {
      position: relative; z-index: 1;
      min-height: 100vh;
      display: grid; place-items: center;
      padding: 8rem 2rem 4rem;
      text-align: center;
    }
    .hero-inner { max-width: 900px; }
    .hero-eyebrow {
      display: inline-flex; align-items: center; gap: 0.5rem;
      font-family: var(--mono); font-size: 0.65rem; letter-spacing: 0.25em; text-transform: uppercase;
      color: var(--cyan); border: 1px solid rgba(0,229,255,0.25); padding: 0.3rem 1rem; border-radius: 2px;
      margin-bottom: 2.5rem;
    }
    .hero-eyebrow::before { content: ''; display: block; width: 6px; height: 6px; background: var(--cyan); border-radius: 50%; animation: blink 1.4s infinite; }
    @keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.2} }

    .hero h1 {
      font-size: clamp(2.8rem, 7vw, 6.5rem);
      font-weight: 800; line-height: 1.05; letter-spacing: -0.03em;
      margin-bottom: 2rem; overflow: visible;
    }
    .h1-line1 { display: block; color: var(--text); }
    .h1-line2 {
      display: block;
      background: linear-gradient(120deg, var(--violet) 0%, var(--cyan) 45%, var(--gold) 100%);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
      padding-bottom: 0.1em;
    }
    .hero-desc {
      font-family: var(--mono); font-size: 0.9rem; color: var(--muted);
      line-height: 1.85; max-width: 620px; margin: 0 auto 3rem;
    }
    .hero-cta { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
    .btn {
      font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase;
      padding: 0.8rem 2rem; border-radius: 2px; text-decoration: none; transition: all 0.18s;
      display: inline-block;
    }
    .btn-v { background: var(--violet); color: #fff; border: 1px solid var(--violet); }
    .btn-v:hover { background: #9b7ffe; transform: translateY(-2px); }
    .btn-o { background: transparent; color: var(--cyan); border: 1px solid rgba(0,229,255,0.35); }
    .btn-o:hover { background: rgba(0,229,255,0.07); transform: translateY(-2px); }



    /* SECTION */
    section { position: relative; z-index: 1; }
    .container { max-width: 1100px; margin: 0 auto; padding: 6rem 2rem; }
    .section-label {
      font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.28em; text-transform: uppercase;
      color: var(--violet); margin-bottom: 0.8rem;
    }
    .section-title { font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 800; line-height: 1.15; margin-bottom: 1.5rem; }
    .section-body { font-family: var(--mono); font-size: 0.82rem; color: var(--muted); line-height: 1.9; max-width: 680px; }

    /* DEFINITION CARD β€” big hero panel */
    .def-card {
      background: var(--surface);
      border: 1px solid var(--border);
      padding: 3rem;
      margin-top: 3rem;
      position: relative;
      overflow: hidden;
    }
    .def-card::before {
      content: '';
      position: absolute; top: 0; left: 0; right: 0; height: 2px;
      background: linear-gradient(90deg, var(--violet), var(--cyan), var(--gold));
    }
    .def-card-label {
      font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase;
      color: var(--cyan); margin-bottom: 1rem;
    }
    .def-card-title { font-size: 1.6rem; font-weight: 800; margin-bottom: 1.25rem; }
    .def-card-body { font-family: var(--mono); font-size: 0.8rem; color: var(--muted); line-height: 1.9; }
    .def-card-body strong { color: var(--text); }

    /* EQUATION STRIP */
    .eq-strip {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 1px; margin-top: 2.5rem;
    }
    .eq-item {
      background: var(--surface2);
      border: 1px solid var(--border);
      padding: 2rem 1.5rem;
      text-align: center;
      display: flex; flex-direction: column; align-items: center; gap: 0.75rem;
    }
    .eq-formula {
      font-family: var(--mono); font-size: 1rem; color: var(--cyan);
      line-height: 1.6; letter-spacing: 0;
      white-space: nowrap;
    }
    .eq-name {
      font-size: 0.95rem; font-weight: 700; color: var(--text);
    }
    .eq-label { font-family: var(--mono); font-size: 0.6rem; color: var(--muted); letter-spacing: 0.12em; text-transform: uppercase; }

    /* DOMAIN GRID */
    .domain-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 1px;
      margin-top: 3.5rem;
    }
    .domain-card {
      background: var(--surface);
      border: 1px solid var(--border);
      padding: 2.5rem;
      transition: background 0.2s;
      position: relative;
    }
    .domain-card:hover { background: rgba(124,92,252,0.05); }
    .domain-accent {
      width: 3px; height: 40px;
      position: absolute; left: 0; top: 2.5rem;
    }
    .domain-num {
      font-family: var(--mono); font-size: 0.6rem; color: var(--muted);
      letter-spacing: 0.2em; margin-bottom: 1rem;
    }
    .domain-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 0.75rem; }
    .domain-body { font-family: var(--mono); font-size: 0.75rem; color: var(--muted); line-height: 1.75; }
    .domain-examples {
      margin-top: 1rem; display: flex; flex-wrap: wrap; gap: 0.4rem;
    }
    .domain-tag {
      font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase;
      padding: 0.18rem 0.55rem; border-radius: 2px;
    }

    /* COMPARISON TABLE */
    .compare-wrap { margin-top: 3rem; overflow-x: auto; }
    table { width: 100%; border-collapse: collapse; font-family: var(--mono); font-size: 0.75rem; }
    thead tr { border-bottom: 1px solid var(--border); }
    th { padding: 1rem 1.25rem; text-align: left; color: var(--muted); font-weight: 400; letter-spacing: 0.1em; text-transform: uppercase; font-size: 0.62rem; }
    td { padding: 1rem 1.25rem; border-bottom: 1px solid rgba(100,120,255,0.07); color: var(--text); }
    tr:hover td { background: rgba(124,92,252,0.04); }
    .td-good { color: var(--green); }
    .td-warn { color: var(--gold); }
    .td-bad  { color: var(--pink); }

    /* TIMELINE */
    .timeline { margin-top: 3rem; display: flex; flex-direction: column; gap: 0; }
    .tl-item {
      display: grid; grid-template-columns: 80px 1px 1fr;
      gap: 0 1.5rem; padding-bottom: 2.5rem;
    }
    .tl-year { font-family: var(--mono); font-size: 0.75rem; color: var(--cyan); padding-top: 0.15rem; text-align: right; }
    .tl-line { background: var(--border); position: relative; }
    .tl-line::before { content: ''; position: absolute; top: 6px; left: 50%; transform: translateX(-50%); width: 8px; height: 8px; background: var(--violet); border-radius: 50%; }
    .tl-content { padding-top: 0; }
    .tl-title { font-weight: 700; font-size: 0.9rem; margin-bottom: 0.4rem; }
    .tl-body { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); line-height: 1.7; }

    /* BILLBOARD BANNER */
    .billboard {
      position: relative; z-index: 1;
      background: var(--surface);
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      padding: 5rem 2rem;
      text-align: center;
      overflow: hidden;
    }
    .billboard::before {
      content: '';
      position: absolute; inset: 0;
      background: radial-gradient(ellipse at 50% 50%, rgba(124,92,252,0.12) 0%, transparent 70%);
    }
    .billboard-quote {
      position: relative; z-index: 1;
      font-size: clamp(1.4rem, 3.5vw, 2.8rem);
      font-weight: 700; line-height: 1.3;
      max-width: 820px; margin: 0 auto 1.5rem;
    }
    .billboard-quote em { font-style: normal; color: var(--cyan); }
    .billboard-attr {
      font-family: var(--mono); font-size: 0.7rem; color: var(--muted); letter-spacing: 0.1em;
    }

    /* FOOTER */
    footer {
      position: relative; z-index: 1;
      border-top: 1px solid var(--border);
      padding: 2rem 2.5rem;
      display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem;
    }
    .footer-left { font-family: var(--mono); font-size: 0.68rem; color: var(--muted); }
    .footer-left strong { color: var(--cyan); }
    .footer-links { display: flex; gap: 1.5rem; }
    .footer-links a { font-family: var(--mono); font-size: 0.62rem; color: var(--muted); text-decoration: none; letter-spacing: 0.1em; text-transform: uppercase; transition: color 0.2s; }
    .footer-links a:hover { color: var(--violet); }
  </style>
</head>
<body>

  <div class="orb orb-1"></div>
  <div class="orb orb-2"></div>
  <div class="orb orb-3"></div>

  <nav>
    <div class="nav-logo">AETHRON<em>LABS</em> / SciML</div>
    <div class="nav-pill">AI for Science</div>
  </nav>

  <!-- HERO -->
  <section class="hero">
    <div class="hero-inner">
      <div class="hero-eyebrow">Scientific Machine Learning Β· AI4Science</div>
      <h1>
        <span class="h1-line1">Where Physics</span>
        <span class="h1-line2">Meets Intelligence</span>
      </h1>
      <p class="hero-desc">
        Scientific Machine Learning (SciML) is the discipline of embedding physical laws, symmetries, and domain knowledge directly into neural architectures β€” enabling AI that doesn't just fit data, but understands the universe that generated it.
      </p>
      <div class="hero-cta">
        <a href="#what-is-sciml" class="btn btn-v">Explore SciML</a>
        <a href="https://huggingface.co/AethronPhantom" target="_blank" class="btn btn-o">Aethron on HF</a>
      </div>
    </div>

  </section>

  <!-- WHAT IS SCIML -->
  <section id="what-is-sciml">
    <div class="container">
      <div class="section-label">// definition</div>
      <h2 class="section-title">What is Scientific<br />Machine Learning?</h2>
      <p class="section-body">
        Classical ML learns patterns from data alone. SciML goes further β€” it fuses the expressive power of deep learning with centuries of accumulated scientific knowledge encoded in differential equations, conservation laws, and physical symmetries. The result is models that generalise better, require less data, and produce physically consistent predictions.
      </p>

      <div class="def-card">
        <div class="def-card-label">// core idea</div>
        <div class="def-card-title">Physics-Informed Learning</div>
        <p class="def-card-body">
          A SciML model doesn't just minimise prediction error on training data. It simultaneously satisfies <strong>governing equations</strong> β€” such as the Navier-Stokes equations for fluid flow, SchrΓΆdinger's equation for quantum systems, or Maxwell's equations for electromagnetics β€” as soft or hard constraints during training. This means the model is <strong>physically consistent by construction</strong>, not just statistically plausible.
        </p>
        <p class="def-card-body" style="margin-top:1rem;">
          The canonical example is the <strong>Physics-Informed Neural Network (PINN)</strong>, where the loss function is augmented with PDE residuals evaluated at collocation points scattered throughout the domain. But SciML extends far beyond PINNs β€” it encompasses equivariant architectures, neural operators, differentiable simulators, and generative models for scientific discovery.
        </p>
      </div>

      <div class="eq-strip">
        <div class="eq-item">
          <div class="eq-name">PINN Loss</div>
          <div class="eq-formula">L = L_data + &lambda; &middot; L_PDE</div>
          <div class="eq-label">Physics-Informed Training</div>
        </div>
        <div class="eq-item">
          <div class="eq-name">Equivariance</div>
          <div class="eq-formula">f(R&middot;x) = &rho;(R) &middot; f(x)</div>
          <div class="eq-label">Symmetry Constraint</div>
        </div>
        <div class="eq-item">
          <div class="eq-name">Neural Operator</div>
          <div class="eq-formula">G : a(x) &rarr; u(x)</div>
          <div class="eq-label">Function-Space Mapping</div>
        </div>
        <div class="eq-item">
          <div class="eq-name">Diffusion Prior</div>
          <div class="eq-formula">p(x_0) = &int; p(x_T) dT</div>
          <div class="eq-label">Generative Sampling</div>
        </div>
      </div>
    </div>
  </section>

  <!-- DOMAINS -->
  <section id="domains">
    <div class="container">
      <div class="section-label">// application domains</div>
      <h2 class="section-title">Where AI4Science<br />Is Transforming Research</h2>
      <p class="section-body">
        AI for Science is not a single technique β€” it is a paradigm shift across every quantitative discipline. These are the domains where the impact is most immediate and profound.
      </p>

      <div class="domain-grid">
        <div class="domain-card">
          <div class="domain-accent" style="background:var(--violet)"></div>
          <div class="domain-num">01 / MATERIALS</div>
          <div class="domain-title">Materials Discovery</div>
          <p class="domain-body">Generative models and graph neural networks predict crystal structures, electronic properties, and synthesis routes orders of magnitude faster than DFT calculations. E(3)-equivariant diffusion models like NexaMat generate stable crystal candidates directly.</p>
          <div class="domain-examples">
            <span class="domain-tag" style="background:rgba(124,92,252,0.15);color:var(--violet)">Crystal Gen</span>
            <span class="domain-tag" style="background:rgba(124,92,252,0.15);color:var(--violet)">GNN Potentials</span>
            <span class="domain-tag" style="background:rgba(124,92,252,0.15);color:var(--violet)">Property Pred</span>
          </div>
        </div>

        <div class="domain-card">
          <div class="domain-accent" style="background:var(--cyan)"></div>
          <div class="domain-num">02 / PHYSICS</div>
          <div class="domain-title">Physics Simulation</div>
          <p class="domain-body">Neural operators (FNO, DeepONet) learn mappings between function spaces, enabling real-time surrogate models for turbulence, climate systems, and plasma dynamics that would take days on traditional HPC clusters.</p>
          <div class="domain-examples">
            <span class="domain-tag" style="background:rgba(0,229,255,0.12);color:var(--cyan)">FNO</span>
            <span class="domain-tag" style="background:rgba(0,229,255,0.12);color:var(--cyan)">PINNs</span>
            <span class="domain-tag" style="background:rgba(0,229,255,0.12);color:var(--cyan)">Turbulence</span>
          </div>
        </div>

        <div class="domain-card">
          <div class="domain-accent" style="background:var(--gold)"></div>
          <div class="domain-num">03 / CHEMISTRY</div>
          <div class="domain-title">Drug & Molecule Design</div>
          <p class="domain-body">Graph transformers and diffusion models over molecular graphs enable de novo drug design, retrosynthesis prediction, and binding affinity estimation β€” compressing years of wet-lab screening into hours of compute.</p>
          <div class="domain-examples">
            <span class="domain-tag" style="background:rgba(255,200,87,0.12);color:var(--gold)">AlphaFold</span>
            <span class="domain-tag" style="background:rgba(255,200,87,0.12);color:var(--gold)">MolGen</span>
            <span class="domain-tag" style="background:rgba(255,200,87,0.12);color:var(--gold)">ADMET</span>
          </div>
        </div>

        <div class="domain-card">
          <div class="domain-accent" style="background:var(--green)"></div>
          <div class="domain-num">04 / CLIMATE</div>
          <div class="domain-title">Climate & Earth Science</div>
          <p class="domain-body">Foundation models trained on decades of reanalysis data can emulate global atmospheric models at 1/1000th the cost. GraphCast and Pangu-Weather have already surpassed traditional NWP models in medium-range forecasting.</p>
          <div class="domain-examples">
            <span class="domain-tag" style="background:rgba(57,211,83,0.12);color:var(--green)">GraphCast</span>
            <span class="domain-tag" style="background:rgba(57,211,83,0.12);color:var(--green)">Emulation</span>
            <span class="domain-tag" style="background:rgba(57,211,83,0.12);color:var(--green)">NWP</span>
          </div>
        </div>

        <div class="domain-card">
          <div class="domain-accent" style="background:var(--pink)"></div>
          <div class="domain-num">05 / BIOLOGY</div>
          <div class="domain-title">Genomics & Systems Biology</div>
          <p class="domain-body">Transformer architectures pretrained on genomic sequences (Enformer, Nucleotide Transformer) predict gene expression, regulatory elements, and protein-DNA interactions from sequence alone, opening new frontiers in precision medicine.</p>
          <div class="domain-examples">
            <span class="domain-tag" style="background:rgba(255,77,141,0.12);color:var(--pink)">Genomics</span>
            <span class="domain-tag" style="background:rgba(255,77,141,0.12);color:var(--pink)">Protein LMs</span>
            <span class="domain-tag" style="background:rgba(255,77,141,0.12);color:var(--pink)">Cell Atlas</span>
          </div>
        </div>

        <div class="domain-card">
          <div class="domain-accent" style="background:var(--violet)"></div>
          <div class="domain-num">06 / ASTRONOMY</div>
          <div class="domain-title">Astrophysics & Cosmology</div>
          <p class="domain-body">Simulation-based inference and normalising flows enable Bayesian parameter estimation for gravitational wave signals, galaxy morphology classification, and dark matter density field reconstruction from survey data.</p>
          <div class="domain-examples">
            <span class="domain-tag" style="background:rgba(124,92,252,0.15);color:var(--violet)">SBI</span>
            <span class="domain-tag" style="background:rgba(124,92,252,0.15);color:var(--violet)">Grav. Waves</span>
            <span class="domain-tag" style="background:rgba(124,92,252,0.15);color:var(--violet)">Cosmology</span>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- COMPARISON -->
  <section id="compare">
    <div class="container">
      <div class="section-label">// classical ml vs sciml</div>
      <h2 class="section-title">How SciML Differs from<br />Standard Deep Learning</h2>
      <p class="section-body">
        The distinction is not just architectural β€” it is epistemological. SciML treats physical knowledge as a first-class citizen of the learning process, not an afterthought.
      </p>
      <div class="compare-wrap">
        <table>
          <thead>
            <tr>
              <th>Dimension</th>
              <th>Classical ML</th>
              <th>Scientific ML</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Data requirement</td>
              <td class="td-warn">Large labelled datasets</td>
              <td class="td-good">Can work with sparse/noisy data via physics constraints</td>
            </tr>
            <tr>
              <td>Extrapolation</td>
              <td class="td-bad">Fails outside training distribution</td>
              <td class="td-good">Physical laws enforce valid extrapolation</td>
            </tr>
            <tr>
              <td>Interpretability</td>
              <td class="td-warn">Black-box predictions</td>
              <td class="td-good">Residuals tied to physical quantities</td>
            </tr>
            <tr>
              <td>Symmetry handling</td>
              <td class="td-bad">Must be learned from data</td>
              <td class="td-good">Encoded via equivariant architectures</td>
            </tr>
            <tr>
              <td>Conservation laws</td>
              <td class="td-bad">Not guaranteed</td>
              <td class="td-good">Hard or soft constraints in loss</td>
            </tr>
            <tr>
              <td>Compute cost</td>
              <td class="td-warn">High for large models</td>
              <td class="td-good">Surrogate models: 100–10,000Γ— faster than simulation</td>
            </tr>
            <tr>
              <td>Uncertainty</td>
              <td class="td-warn">Requires separate calibration</td>
              <td class="td-good">Bayesian and ensemble methods well-integrated</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </section>

  <!-- TIMELINE -->
  <section id="timeline">
    <div class="container">
      <div class="section-label">// key milestones</div>
      <h2 class="section-title">A Decade of<br />AI4Science Progress</h2>
      <div class="timeline">
        <div class="tl-item">
          <div class="tl-year">2017</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">Physics-Informed Neural Networks (PINNs)</div>
            <p class="tl-body">Raissi, Perdikaris & Karniadakis introduce PINNs β€” neural networks trained to satisfy PDEs as soft constraints. Opens the door to mesh-free PDE solvers.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2019</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">DeepMind's AlphaFold (v1) & SE(3) Networks</div>
            <p class="tl-body">Protein structure prediction enters the ML era. Simultaneously, SE(3)-equivariant networks establish the mathematical framework for 3D molecular learning.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2020</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">Fourier Neural Operator (FNO)</div>
            <p class="tl-body">Li et al. introduce FNO β€” learning operators between function spaces in Fourier space. Enables 1000Γ— faster fluid simulation surrogates.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2021</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">AlphaFold 2 β€” Structure Prediction Solved</div>
            <p class="tl-body">DeepMind achieves near-experimental accuracy on CASP14. A landmark moment demonstrating that AI can solve fundamental scientific problems at superhuman level.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2022</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">Score-Based Diffusion for Molecules</div>
            <p class="tl-body">DiffSBDD, DiffDock, and related models apply denoising diffusion to 3D molecular generation. E(3)-equivariant diffusion becomes the dominant paradigm for structure generation.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2023</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">GraphCast & Weather Foundation Models</div>
            <p class="tl-body">Google DeepMind's GraphCast surpasses ECMWF's operational NWP model for 10-day forecasts. AI weather prediction becomes production-grade.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2024</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">MatterGen & Crystal Diffusion at Scale</div>
            <p class="tl-body">Microsoft Research releases MatterGen β€” a periodic E(3)-equivariant diffusion model generating novel stable inorganic crystals conditioned on composition and properties. Marks the arrival of AI-native materials design.</p>
          </div>
        </div>
        <div class="tl-item">
          <div class="tl-year">2025+</div>
          <div class="tl-line"></div>
          <div class="tl-content">
            <div class="tl-title">Scientific Foundation Models (SciFMs)</div>
            <p class="tl-body">The frontier: large pretrained models that generalise across scientific domains β€” from molecules to PDEs to genomics. Aethron Labs is building in this space with NexaMat and the broader Nexa Stack.</p>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- BILLBOARD QUOTE -->
  <div class="billboard">
    <p class="billboard-quote">
      "The next decade of AI will not be defined by language models alone β€” it will be defined by machines that can <em>reason about the physical world</em> with the rigour of a physicist and the speed of a GPU."
    </p>
    <p class="billboard-attr">β€” Aethron Labs Research Philosophy</p>
  </div>

  <!-- FOOTER -->
  <footer>
    <div class="footer-left">
      &copy; 2025 <strong>Aethron Labs</strong> β€” Scientific Machine Learning Research<br />
      <span style="font-size:0.58rem;opacity:0.5;">This space is a static explainer. No data is collected.</span>
    </div>
    <div class="footer-links">
      <a href="https://huggingface.co/AethronPhantom" target="_blank">HF Org</a>
      <a href="https://huggingface.co/spaces/AethronPhantom/nexamat-crystal-viewer" target="_blank">NexaMat</a>
      <a href="https://huggingface.co/spaces/AethronPhantom/Nexa" target="_blank">R&D Studio</a>
    </div>
  </footer>

</body>
</html>