@dmitriikapustin/ui 0.2.0 → 0.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css DELETED
@@ -1,4596 +0,0 @@
1
- @charset "UTF-8";
2
-
3
- /* src/atoms/Spinner.module.scss */
4
- @keyframes Spinner_module_spin {
5
- to {
6
- transform: rotate(360deg);
7
- }
8
- }
9
- .Spinner_module_root {
10
- display: inline-flex;
11
- align-items: center;
12
- justify-content: center;
13
- }
14
- .Spinner_module_fallback {
15
- border-radius: 9999px;
16
- border: 2px solid var(--border-color);
17
- border-top-color: var(--fg);
18
- animation: Spinner_module_spin 1s linear infinite;
19
- }
20
-
21
- /* src/atoms/Button.module.scss */
22
- .Button_module_root {
23
- display: inline-flex;
24
- align-items: center;
25
- justify-content: center;
26
- font-weight: 500;
27
- transition: all var(--transition-fast);
28
- cursor: pointer;
29
- user-select: none;
30
- white-space: nowrap;
31
- }
32
- .Button_module_primary {
33
- background: var(--fg);
34
- color: var(--bg);
35
- border: 1px solid var(--bg);
36
- box-shadow: var(--shadow-sm);
37
- }
38
- .Button_module_primary:hover {
39
- opacity: 0.9;
40
- }
41
- .Button_module_primary:active {
42
- opacity: 0.8;
43
- }
44
- .Button_module_secondary {
45
- background: var(--bg-tertiary);
46
- color: var(--fg);
47
- }
48
- .Button_module_secondary:hover {
49
- background: var(--border-color);
50
- }
51
- .Button_module_secondary:active {
52
- background: var(--border-color-strong);
53
- }
54
- .Button_module_outline {
55
- border: 1px solid var(--fg-secondary);
56
- color: var(--fg-secondary);
57
- }
58
- .Button_module_outline:hover {
59
- background: var(--bg-tertiary);
60
- }
61
- .Button_module_outline:active {
62
- background: var(--border-color);
63
- }
64
- .Button_module_ghost {
65
- color: var(--fg-secondary);
66
- }
67
- .Button_module_ghost:hover {
68
- color: var(--fg);
69
- background: var(--bg-tertiary);
70
- }
71
- .Button_module_ghost:active {
72
- background: var(--border-color);
73
- }
74
- .Button_module_sm {
75
- font-size: 13px;
76
- padding-inline: 1rem;
77
- padding-block: 0.5rem;
78
- border-radius: 9999px;
79
- letter-spacing: -0.25px;
80
- gap: 0.375rem;
81
- }
82
- .Button_module_md {
83
- font-size: 13px;
84
- padding-inline: 1rem;
85
- padding-block: 0.5rem;
86
- border-radius: 9999px;
87
- letter-spacing: -0.25px;
88
- gap: 0.5rem;
89
- }
90
- .Button_module_disabled {
91
- opacity: 0.5;
92
- cursor: not-allowed;
93
- pointer-events: none;
94
- }
95
-
96
- /* src/atoms/Input.module.scss */
97
- .Input_module_wrapper {
98
- display: flex;
99
- flex-direction: column;
100
- gap: 0.375rem;
101
- }
102
- .Input_module_label {
103
- font-size: 13px;
104
- font-weight: 500;
105
- color: var(--fg);
106
- letter-spacing: -0.25px;
107
- }
108
- .Input_module_inputWrap {
109
- position: relative;
110
- }
111
- .Input_module_input {
112
- width: 100%;
113
- border: 1px solid var(--fg-muted);
114
- background: var(--bg);
115
- padding-inline: 15px;
116
- padding-block: 0.75rem;
117
- font-size: 13px;
118
- letter-spacing: -0.25px;
119
- color: var(--fg-secondary);
120
- transition: all var(--transition-fast);
121
- border-radius: 9999px;
122
- }
123
- .Input_module_input::placeholder {
124
- color: var(--fg-muted);
125
- }
126
- .Input_module_input:focus {
127
- outline: none;
128
- border-color: var(--fg);
129
- }
130
- .Input_module_hasIconLeft {
131
- padding-left: 2.5rem;
132
- }
133
- .Input_module_hasIconRight {
134
- padding-right: 2.5rem;
135
- }
136
- .Input_module_iconLeft {
137
- position: absolute;
138
- left: 0.875rem;
139
- top: 50%;
140
- transform: translateY(-50%);
141
- color: var(--fg-muted);
142
- }
143
- .Input_module_iconRight {
144
- position: absolute;
145
- right: 0.875rem;
146
- top: 50%;
147
- transform: translateY(-50%);
148
- color: var(--fg-muted);
149
- }
150
- .Input_module_error {
151
- border-color: var(--color-error);
152
- }
153
- .Input_module_error:focus {
154
- border-color: var(--color-error);
155
- }
156
- .Input_module_errorText {
157
- font-size: 13px;
158
- letter-spacing: -0.25px;
159
- color: var(--color-error);
160
- }
161
-
162
- /* src/atoms/Badge.module.scss */
163
- .Badge_module_root {
164
- display: inline-flex;
165
- align-items: center;
166
- padding-inline: 0.625rem;
167
- padding-block: 0.125rem;
168
- border-radius: 9999px;
169
- font-size: 13px;
170
- font-weight: 600;
171
- letter-spacing: -0.25px;
172
- }
173
- .Badge_module_default {
174
- background: var(--bg-tertiary);
175
- color: var(--fg);
176
- }
177
- .Badge_module_success {
178
- background: var(--bg-tertiary);
179
- color: var(--color-success);
180
- }
181
- .Badge_module_warning {
182
- background: var(--bg-tertiary);
183
- color: var(--color-warning);
184
- }
185
- .Badge_module_error {
186
- background: var(--bg-tertiary);
187
- color: var(--color-error);
188
- }
189
- .Badge_module_info {
190
- background: var(--bg-tertiary);
191
- color: var(--color-info);
192
- }
193
-
194
- /* src/atoms/Tag.module.scss */
195
- .Tag_module_root {
196
- display: inline-flex;
197
- align-items: center;
198
- gap: 0.375rem;
199
- padding-inline: 0.75rem;
200
- padding-block: 0.25rem;
201
- border-radius: 9999px;
202
- font-size: 13px;
203
- font-weight: 500;
204
- letter-spacing: -0.25px;
205
- border: 1px solid;
206
- }
207
- .Tag_module_default {
208
- background: var(--bg-tertiary);
209
- color: var(--fg-secondary);
210
- border-color: var(--border-color);
211
- }
212
- .Tag_module_primary {
213
- background: var(--bg-tertiary);
214
- color: var(--fg);
215
- border-color: var(--border-color-strong);
216
- }
217
- .Tag_module_success {
218
- background: var(--bg-tertiary);
219
- color: var(--color-success);
220
- border-color: var(--border-color);
221
- }
222
- .Tag_module_warning {
223
- background: var(--bg-tertiary);
224
- color: var(--color-warning);
225
- border-color: var(--border-color);
226
- }
227
- .Tag_module_error {
228
- background: var(--bg-tertiary);
229
- color: var(--color-error);
230
- border-color: var(--border-color);
231
- }
232
- .Tag_module_closeBtn {
233
- cursor: pointer;
234
- transition: opacity 200ms ease;
235
- }
236
- .Tag_module_closeBtn:hover {
237
- opacity: 0.7;
238
- }
239
-
240
- /* src/atoms/Toggle.module.scss */
241
- .Toggle_module_root {
242
- display: inline-flex;
243
- align-items: center;
244
- gap: 0.625rem;
245
- cursor: pointer;
246
- }
247
- .Toggle_module_track {
248
- position: relative;
249
- display: inline-flex;
250
- align-items: center;
251
- height: 1.5rem;
252
- width: 2.75rem;
253
- flex-shrink: 0;
254
- border-radius: 9999px;
255
- padding-inline: 2px;
256
- transition: background-color 200ms ease-in-out;
257
- cursor: pointer;
258
- }
259
- .Toggle_module_track:focus {
260
- outline: none;
261
- }
262
- .Toggle_module_trackOn {
263
- background: var(--color-accent);
264
- }
265
- .Toggle_module_trackOff {
266
- background: var(--border-color);
267
- }
268
- .Toggle_module_knob {
269
- pointer-events: none;
270
- display: inline-block;
271
- height: 1.25rem;
272
- width: 1.25rem;
273
- border-radius: 9999px;
274
- background: white;
275
- transition: transform 200ms ease-in-out;
276
- }
277
- .Toggle_module_knobOn {
278
- transform: translateX(20px);
279
- }
280
- .Toggle_module_knobOff {
281
- transform: translateX(0);
282
- }
283
- .Toggle_module_label {
284
- font-size: 13px;
285
- font-weight: 500;
286
- color: var(--fg);
287
- letter-spacing: -0.25px;
288
- }
289
- .Toggle_module_disabled {
290
- opacity: 0.5;
291
- cursor: not-allowed;
292
- }
293
-
294
- /* src/atoms/Avatar.module.scss */
295
- .Avatar_module_root {
296
- border-radius: 9999px;
297
- object-fit: cover;
298
- }
299
- .Avatar_module_initials {
300
- border-radius: 9999px;
301
- background: var(--bg-tertiary);
302
- border: 1px solid var(--border-color);
303
- display: flex;
304
- align-items: center;
305
- justify-content: center;
306
- }
307
- .Avatar_module_initialsText {
308
- font-weight: 500;
309
- color: var(--fg-secondary);
310
- user-select: none;
311
- }
312
- .Avatar_module_sm {
313
- width: 32px;
314
- height: 32px;
315
- }
316
- .Avatar_module_md {
317
- width: 40px;
318
- height: 40px;
319
- }
320
- .Avatar_module_lg {
321
- width: 48px;
322
- height: 48px;
323
- }
324
- .Avatar_module_xl {
325
- width: 64px;
326
- height: 64px;
327
- }
328
- .Avatar_module_textSm {
329
- font-size: 12px;
330
- }
331
- .Avatar_module_textMd {
332
- font-size: 14px;
333
- }
334
- .Avatar_module_textLg {
335
- font-size: 16px;
336
- }
337
- .Avatar_module_textXl {
338
- font-size: 18px;
339
- }
340
-
341
- /* src/atoms/Divider.module.scss */
342
- .Divider_module_root {
343
- border: none;
344
- height: 1px;
345
- background: var(--border-color);
346
- }
347
- .Divider_module_withLabel {
348
- display: flex;
349
- align-items: center;
350
- gap: 1rem;
351
- }
352
- .Divider_module_line {
353
- flex: 1;
354
- height: 1px;
355
- background: var(--border-color);
356
- }
357
- .Divider_module_label {
358
- font-size: 12px;
359
- font-weight: 500;
360
- color: var(--fg-muted);
361
- text-transform: uppercase;
362
- letter-spacing: 0.05em;
363
- }
364
-
365
- /* src/atoms/MenuItem.module.scss */
366
- .MenuItem_module_root {
367
- display: inline-flex;
368
- align-items: center;
369
- padding-inline: 4px;
370
- padding-block: 2px;
371
- font-size: 13px;
372
- font-weight: 500;
373
- letter-spacing: -0.25px;
374
- cursor: pointer;
375
- border: none;
376
- text-align: left;
377
- white-space: nowrap;
378
- transition: color 150ms;
379
- background: transparent;
380
- color: var(--fg-muted);
381
- }
382
- .MenuItem_module_root:hover {
383
- color: var(--fg-secondary);
384
- }
385
- .MenuItem_module_active {
386
- background: var(--bg-secondary);
387
- color: var(--fg);
388
- }
389
- .MenuItem_module_active:hover {
390
- color: var(--fg);
391
- }
392
-
393
- /* src/atoms/IconButton.module.scss */
394
- .IconButton_module_root {
395
- display: inline-flex;
396
- align-items: center;
397
- justify-content: center;
398
- width: 36px;
399
- height: 36px;
400
- border-radius: 9999px;
401
- transition: all var(--transition-fast);
402
- cursor: pointer;
403
- flex-shrink: 0;
404
- border: none;
405
- }
406
- .IconButton_module_primary {
407
- background: var(--fg);
408
- color: var(--bg);
409
- border: 1px solid var(--bg);
410
- box-shadow: var(--shadow-sm);
411
- }
412
- .IconButton_module_secondary {
413
- background: var(--bg-tertiary);
414
- color: var(--fg-secondary);
415
- }
416
- .IconButton_module_clear {
417
- background: transparent;
418
- color: var(--fg-secondary);
419
- box-shadow: var(--shadow-sm);
420
- }
421
- .IconButton_module_disabled {
422
- background: var(--bg-tertiary);
423
- color: var(--fg-muted);
424
- opacity: 0.5;
425
- cursor: not-allowed;
426
- }
427
- .IconButton_module_contrast {
428
- background: var(--border-color);
429
- color: var(--fg-secondary);
430
- }
431
- .IconButton_module_isDisabled {
432
- cursor: not-allowed;
433
- }
434
-
435
- /* src/atoms/Logo.module.scss */
436
- .Logo_module_short {
437
- width: 19px;
438
- height: 20px;
439
- }
440
- .Logo_module_full {
441
- height: 20px;
442
- width: 130px;
443
- }
444
- .Logo_module_third {
445
- display: flex;
446
- align-items: center;
447
- gap: 0.375rem;
448
- }
449
- .Logo_module_thirdText {
450
- font-size: 13px;
451
- font-weight: 500;
452
- color: var(--fg);
453
- letter-spacing: -0.25px;
454
- }
455
-
456
- /* src/atoms/StatBadge.module.scss */
457
- .StatBadge_module_root {
458
- display: inline-flex;
459
- align-items: center;
460
- font-size: 13px;
461
- font-weight: 500;
462
- color: var(--fg-secondary);
463
- letter-spacing: -0.25px;
464
- white-space: nowrap;
465
- }
466
- .StatBadge_module_bracket {
467
- color: var(--fg-muted);
468
- }
469
-
470
- /* src/atoms/Textarea.module.scss */
471
- .Textarea_module_wrapper {
472
- display: flex;
473
- flex-direction: column;
474
- gap: 0.375rem;
475
- }
476
- .Textarea_module_label {
477
- font-size: 13px;
478
- font-weight: 500;
479
- color: var(--fg);
480
- letter-spacing: -0.25px;
481
- }
482
- .Textarea_module_textarea {
483
- width: 100%;
484
- border: 1px solid var(--fg-muted);
485
- background: var(--bg);
486
- padding-inline: 15px;
487
- padding-block: 0.75rem;
488
- font-size: 13px;
489
- letter-spacing: -0.25px;
490
- color: var(--fg-secondary);
491
- transition: all var(--transition-fast);
492
- border-radius: var(--radius-lg);
493
- resize: vertical;
494
- }
495
- .Textarea_module_textarea::placeholder {
496
- color: var(--fg-muted);
497
- }
498
- .Textarea_module_textarea:focus {
499
- outline: none;
500
- border-color: var(--fg);
501
- }
502
- .Textarea_module_error {
503
- border-color: var(--color-error);
504
- }
505
- .Textarea_module_error:focus {
506
- border-color: var(--color-error);
507
- }
508
- .Textarea_module_errorText {
509
- font-size: 13px;
510
- letter-spacing: -0.25px;
511
- color: var(--color-error);
512
- }
513
-
514
- /* src/atoms/Select.module.scss */
515
- .Select_module_wrapper {
516
- display: flex;
517
- flex-direction: column;
518
- gap: 0.375rem;
519
- }
520
- .Select_module_label {
521
- font-size: 13px;
522
- font-weight: 500;
523
- color: var(--fg);
524
- letter-spacing: -0.25px;
525
- }
526
- .Select_module_selectWrap {
527
- position: relative;
528
- }
529
- .Select_module_select {
530
- width: 100%;
531
- appearance: none;
532
- border: 1px solid var(--fg-muted);
533
- background: var(--bg);
534
- padding-inline: 15px;
535
- padding-block: 0.75rem;
536
- padding-right: 2.5rem;
537
- font-size: 13px;
538
- letter-spacing: -0.25px;
539
- color: var(--fg-secondary);
540
- transition: all var(--transition-fast);
541
- border-radius: 9999px;
542
- }
543
- .Select_module_select:focus {
544
- outline: none;
545
- border-color: var(--fg);
546
- }
547
- .Select_module_chevron {
548
- position: absolute;
549
- right: 0.875rem;
550
- top: 50%;
551
- transform: translateY(-50%);
552
- pointer-events: none;
553
- color: var(--fg-muted);
554
- }
555
- .Select_module_error {
556
- border-color: var(--color-error);
557
- }
558
- .Select_module_error:focus {
559
- border-color: var(--color-error);
560
- }
561
- .Select_module_errorText {
562
- font-size: 13px;
563
- letter-spacing: -0.25px;
564
- color: var(--color-error);
565
- }
566
-
567
- /* src/atoms/Checkbox.module.scss */
568
- .Checkbox_module_root {
569
- display: inline-flex;
570
- align-items: center;
571
- gap: 0.625rem;
572
- cursor: pointer;
573
- }
574
- .Checkbox_module_hiddenInput {
575
- position: absolute;
576
- opacity: 0;
577
- width: 0;
578
- height: 0;
579
- }
580
- .Checkbox_module_box {
581
- display: flex;
582
- align-items: center;
583
- justify-content: center;
584
- width: 18px;
585
- height: 18px;
586
- border-radius: 5px;
587
- border: 1px solid;
588
- transition:
589
- color 200ms,
590
- background-color 200ms,
591
- border-color 200ms;
592
- flex-shrink: 0;
593
- }
594
- .Checkbox_module_checked {
595
- background: var(--color-accent);
596
- border-color: var(--color-accent);
597
- }
598
- .Checkbox_module_unchecked {
599
- border-color: var(--fg-muted);
600
- background: transparent;
601
- }
602
- .Checkbox_module_label {
603
- font-size: 13px;
604
- font-weight: 500;
605
- color: var(--fg);
606
- letter-spacing: -0.25px;
607
- }
608
- .Checkbox_module_disabled {
609
- opacity: 0.5;
610
- cursor: not-allowed;
611
- }
612
-
613
- /* src/atoms/Radio.module.scss */
614
- .Radio_module_root {
615
- display: inline-flex;
616
- align-items: center;
617
- gap: 0.625rem;
618
- cursor: pointer;
619
- }
620
- .Radio_module_hiddenInput {
621
- position: absolute;
622
- opacity: 0;
623
- width: 0;
624
- height: 0;
625
- }
626
- .Radio_module_circle {
627
- display: flex;
628
- align-items: center;
629
- justify-content: center;
630
- width: 18px;
631
- height: 18px;
632
- border-radius: 9999px;
633
- border: 1px solid;
634
- transition:
635
- color 200ms,
636
- background-color 200ms,
637
- border-color 200ms;
638
- flex-shrink: 0;
639
- }
640
- .Radio_module_checked {
641
- border-color: var(--color-accent);
642
- }
643
- .Radio_module_unchecked {
644
- border-color: var(--fg-muted);
645
- }
646
- .Radio_module_dot {
647
- width: 8px;
648
- height: 8px;
649
- border-radius: 9999px;
650
- background: var(--color-accent);
651
- }
652
- .Radio_module_label {
653
- font-size: 13px;
654
- font-weight: 500;
655
- color: var(--fg);
656
- letter-spacing: -0.25px;
657
- }
658
- .Radio_module_disabled {
659
- opacity: 0.5;
660
- cursor: not-allowed;
661
- }
662
-
663
- /* src/atoms/Link.module.scss */
664
- .Link_module_root {
665
- font-size: 13px;
666
- letter-spacing: -0.25px;
667
- transition: color var(--transition-fast);
668
- display: inline-flex;
669
- align-items: center;
670
- gap: 0.25rem;
671
- }
672
- .Link_module_default {
673
- color: var(--color-accent);
674
- }
675
- .Link_module_default:hover {
676
- text-decoration: underline;
677
- }
678
- .Link_module_muted {
679
- color: var(--fg-muted);
680
- }
681
- .Link_module_muted:hover {
682
- color: var(--fg);
683
- }
684
- .Link_module_underline {
685
- color: var(--fg);
686
- text-decoration: underline;
687
- text-underline-offset: 2px;
688
- }
689
- .Link_module_underline:hover {
690
- color: var(--color-accent);
691
- }
692
-
693
- /* src/atoms/Tooltip.module.scss */
694
- .Tooltip_module_root {
695
- position: relative;
696
- display: inline-flex;
697
- }
698
- .Tooltip_module_root:hover .Tooltip_module_tooltip {
699
- visibility: visible;
700
- opacity: 1;
701
- }
702
- .Tooltip_module_tooltip {
703
- position: absolute;
704
- visibility: hidden;
705
- opacity: 0;
706
- transition: opacity 200ms ease;
707
- background: var(--fg);
708
- color: var(--bg);
709
- font-size: 11px;
710
- padding-inline: 0.5rem;
711
- padding-block: 0.25rem;
712
- border-radius: 0.375rem;
713
- white-space: nowrap;
714
- z-index: 50;
715
- pointer-events: none;
716
- }
717
- .Tooltip_module_top {
718
- bottom: 100%;
719
- left: 50%;
720
- transform: translateX(-50%);
721
- margin-bottom: 0.375rem;
722
- }
723
- .Tooltip_module_bottom {
724
- top: 100%;
725
- left: 50%;
726
- transform: translateX(-50%);
727
- margin-top: 0.375rem;
728
- }
729
- .Tooltip_module_left {
730
- right: 100%;
731
- top: 50%;
732
- transform: translateY(-50%);
733
- margin-right: 0.375rem;
734
- }
735
- .Tooltip_module_right {
736
- left: 100%;
737
- top: 50%;
738
- transform: translateY(-50%);
739
- margin-left: 0.375rem;
740
- }
741
-
742
- /* src/atoms/Skeleton.module.scss */
743
- @keyframes Skeleton_module_pulse {
744
- 0%, 100% {
745
- opacity: 1;
746
- }
747
- 50% {
748
- opacity: 0.5;
749
- }
750
- }
751
- .Skeleton_module_root {
752
- animation: Skeleton_module_pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
753
- background: var(--bg-tertiary);
754
- }
755
- .Skeleton_module_line {
756
- height: 1rem;
757
- width: 100%;
758
- border-radius: 9999px;
759
- }
760
- .Skeleton_module_circle {
761
- border-radius: 9999px;
762
- }
763
- .Skeleton_module_rect {
764
- border-radius: var(--radius-lg);
765
- }
766
-
767
- /* src/atoms/TicketButton.module.scss */
768
- .TicketButton_module_root {
769
- position: relative;
770
- display: inline-flex;
771
- align-items: stretch;
772
- cursor: pointer;
773
- border: none;
774
- background: transparent;
775
- padding: 0;
776
- user-select: none;
777
- }
778
- .TicketButton_module_root:hover .TicketButton_module_stub {
779
- transform: translateX(6px);
780
- }
781
- .TicketButton_module_body {
782
- position: relative;
783
- display: flex;
784
- align-items: center;
785
- }
786
- .TicketButton_module_bodySvg {
787
- position: absolute;
788
- inset: 0;
789
- width: 100%;
790
- height: 100%;
791
- }
792
- .TicketButton_module_bodyText {
793
- position: relative;
794
- z-index: 10;
795
- padding-inline: 1.5rem;
796
- padding-block: 1rem;
797
- font-size: 13px;
798
- font-weight: 600;
799
- letter-spacing: -0.25px;
800
- white-space: nowrap;
801
- }
802
- .TicketButton_module_stub {
803
- position: relative;
804
- display: flex;
805
- align-items: center;
806
- transition: transform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);
807
- }
808
- .TicketButton_module_stubSvg {
809
- position: absolute;
810
- inset: 0;
811
- width: 100%;
812
- height: 100%;
813
- }
814
- .TicketButton_module_stubIcon {
815
- position: relative;
816
- z-index: 10;
817
- width: 56px;
818
- height: 56px;
819
- display: flex;
820
- align-items: center;
821
- justify-content: center;
822
- }
823
-
824
- /* src/molecules/Card.module.scss */
825
- .Card_module_root {
826
- border-radius: var(--radius-xl);
827
- border: 1px solid var(--border-color);
828
- background: var(--bg);
829
- overflow: hidden;
830
- box-shadow: var(--shadow-xs);
831
- transition: all var(--transition-base);
832
- }
833
- .Card_module_root:hover {
834
- box-shadow: var(--shadow-md);
835
- transform: translateY(-2px);
836
- }
837
- .Card_module_imageWrapper {
838
- aspect-ratio: 16/9;
839
- overflow: hidden;
840
- }
841
- .Card_module_image {
842
- width: 100%;
843
- height: 100%;
844
- object-fit: cover;
845
- }
846
- .Card_module_body {
847
- padding: 1.25rem;
848
- }
849
- .Card_module_title {
850
- font-size: 1rem;
851
- font-weight: 600;
852
- color: var(--fg);
853
- margin-bottom: 0.25rem;
854
- }
855
- .Card_module_description {
856
- font-size: 0.875rem;
857
- color: var(--fg-secondary);
858
- line-height: 1.625;
859
- }
860
- .Card_module_footer {
861
- padding-inline: 1.25rem;
862
- padding-block: 0.75rem;
863
- border-top: 1px solid var(--border-color);
864
- background: var(--bg-secondary);
865
- }
866
-
867
- /* src/molecules/FormField.module.scss */
868
- .FormField_module_root {
869
- display: flex;
870
- flex-direction: column;
871
- gap: 0.375rem;
872
- }
873
- .FormField_module_hint {
874
- font-size: 0.8125rem;
875
- color: var(--fg-muted);
876
- }
877
-
878
- /* src/molecules/SearchBar.module.scss */
879
- .SearchBar_module_root {
880
- position: relative;
881
- display: flex;
882
- align-items: center;
883
- }
884
- .SearchBar_module_searchIcon {
885
- position: absolute;
886
- left: 0.75rem;
887
- color: var(--fg-muted);
888
- }
889
- .SearchBar_module_input {
890
- width: 100%;
891
- border-radius: var(--radius-lg);
892
- border: 1px solid var(--border-color);
893
- background: var(--bg);
894
- padding: 0.625rem 2.5rem;
895
- font-size: 0.875rem;
896
- color: var(--fg);
897
- transition: all var(--transition-fast);
898
- outline: none;
899
- }
900
- .SearchBar_module_input::placeholder {
901
- color: var(--fg-muted);
902
- }
903
- .SearchBar_module_input:focus {
904
- outline: none;
905
- box-shadow: 0 0 0 2px var(--brand-primary);
906
- border-color: transparent;
907
- }
908
- .SearchBar_module_clearBtn {
909
- position: absolute;
910
- right: 0.75rem;
911
- color: var(--fg-muted);
912
- transition: color var(--transition-fast);
913
- cursor: pointer;
914
- background: none;
915
- border: none;
916
- padding: 0;
917
- }
918
- .SearchBar_module_clearBtn:hover {
919
- color: var(--fg);
920
- }
921
-
922
- /* src/molecules/Stat.module.scss */
923
- .Stat_module_root {
924
- display: flex;
925
- flex-direction: column;
926
- gap: 0.25rem;
927
- }
928
- .Stat_module_valueRow {
929
- display: flex;
930
- align-items: baseline;
931
- gap: 0.5rem;
932
- }
933
- .Stat_module_value {
934
- font-size: 1.5rem;
935
- font-weight: 700;
936
- color: var(--fg);
937
- }
938
- .Stat_module_trend {
939
- font-size: 0.875rem;
940
- font-weight: 500;
941
- }
942
- .Stat_module_positive {
943
- color: var(--color-success);
944
- }
945
- .Stat_module_negative {
946
- color: var(--color-error);
947
- }
948
- .Stat_module_label {
949
- font-size: 0.875rem;
950
- color: var(--fg-muted);
951
- }
952
-
953
- /* src/molecules/Alert.module.scss */
954
- .Alert_module_root {
955
- display: flex;
956
- gap: 0.75rem;
957
- padding: 1rem;
958
- border-radius: var(--radius-lg);
959
- border: 1px solid var(--border-color);
960
- background: var(--bg-secondary);
961
- }
962
- .Alert_module_icon {
963
- flex-shrink: 0;
964
- margin-top: 0.125rem;
965
- }
966
- .Alert_module_info {
967
- color: var(--color-info);
968
- }
969
- .Alert_module_success {
970
- color: var(--color-success);
971
- }
972
- .Alert_module_warning {
973
- color: var(--color-warning);
974
- }
975
- .Alert_module_error {
976
- color: var(--color-error);
977
- }
978
- .Alert_module_content {
979
- flex: 1;
980
- min-width: 0;
981
- }
982
- .Alert_module_title {
983
- font-size: 13px;
984
- font-weight: 500;
985
- letter-spacing: -0.25px;
986
- margin-bottom: 0.125rem;
987
- }
988
- .Alert_module_message {
989
- font-size: 13px;
990
- letter-spacing: -0.25px;
991
- color: var(--fg-secondary);
992
- }
993
- .Alert_module_dismiss {
994
- flex-shrink: 0;
995
- color: var(--fg-muted);
996
- transition: all var(--transition-fast);
997
- cursor: pointer;
998
- background: none;
999
- border: none;
1000
- padding: 0;
1001
- }
1002
- .Alert_module_dismiss:hover {
1003
- color: var(--fg);
1004
- }
1005
-
1006
- /* src/molecules/Tabs.module.scss */
1007
- .Tabs_module_tabList {
1008
- display: flex;
1009
- border-bottom: 1px solid var(--border-color);
1010
- }
1011
- .Tabs_module_tab {
1012
- padding: 0.625rem 1rem;
1013
- font-size: 0.875rem;
1014
- font-weight: 500;
1015
- transition: color var(--transition-fast);
1016
- cursor: pointer;
1017
- position: relative;
1018
- background: none;
1019
- border: none;
1020
- color: var(--fg-muted);
1021
- }
1022
- .Tabs_module_tab:hover {
1023
- color: var(--fg);
1024
- }
1025
- .Tabs_module_active {
1026
- color: var(--brand-primary);
1027
- }
1028
- .Tabs_module_indicator {
1029
- position: absolute;
1030
- bottom: 0;
1031
- left: 0;
1032
- right: 0;
1033
- height: 2px;
1034
- background: var(--brand-primary);
1035
- border-radius: 9999px;
1036
- }
1037
- .Tabs_module_panel {
1038
- padding-top: 1rem;
1039
- }
1040
-
1041
- /* src/molecules/ChatInput.module.scss */
1042
- .ChatInput_module_root {
1043
- border-radius: 16px;
1044
- overflow: hidden;
1045
- display: flex;
1046
- flex-direction: column;
1047
- gap: 1rem;
1048
- width: 100%;
1049
- max-width: 440px;
1050
- cursor: text;
1051
- }
1052
- .ChatInput_module_contrast {
1053
- background: var(--bg);
1054
- border: 1px solid var(--bg-tertiary);
1055
- box-shadow: var(--shadow-md);
1056
- padding: 13px 15px;
1057
- }
1058
- .ChatInput_module_plain {
1059
- background: var(--bg-tertiary);
1060
- padding: 0.75rem 0.75rem 0.75rem 0.875rem;
1061
- }
1062
- .ChatInput_module_input {
1063
- width: 100%;
1064
- background: transparent;
1065
- border: none;
1066
- outline: none;
1067
- font-size: 13px;
1068
- letter-spacing: -0.25px;
1069
- color: var(--fg);
1070
- font-weight: 400;
1071
- }
1072
- .ChatInput_module_input::placeholder {
1073
- color: var(--fg-muted);
1074
- }
1075
- .ChatInput_module_actions {
1076
- display: flex;
1077
- align-items: center;
1078
- }
1079
- .ChatInput_module_actionsFull {
1080
- justify-content: space-between;
1081
- }
1082
- .ChatInput_module_actionsEasy {
1083
- justify-content: flex-end;
1084
- }
1085
- .ChatInput_module_toolGroup {
1086
- display: flex;
1087
- align-items: center;
1088
- gap: 0.25rem;
1089
- }
1090
-
1091
- /* src/molecules/ChatMessage.module.scss */
1092
- .ChatMessage_module_root {
1093
- display: flex;
1094
- }
1095
- .ChatMessage_module_user {
1096
- justify-content: flex-end;
1097
- }
1098
- .ChatMessage_module_ai {
1099
- justify-content: flex-start;
1100
- }
1101
- .ChatMessage_module_bubble {
1102
- font-size: 13px;
1103
- letter-spacing: -0.25px;
1104
- font-weight: 400;
1105
- padding-inline: 1rem;
1106
- border-top-left-radius: 16px;
1107
- border-top-right-radius: 16px;
1108
- line-height: normal;
1109
- }
1110
- .ChatMessage_module_sm {
1111
- padding-block: 0.5rem;
1112
- }
1113
- .ChatMessage_module_lg {
1114
- width: 225px;
1115
- padding-block: 0.75rem;
1116
- }
1117
- .ChatMessage_module_bubbleUser {
1118
- background: var(--bg-secondary);
1119
- color: var(--fg);
1120
- border-bottom-left-radius: 16px;
1121
- }
1122
- .ChatMessage_module_bubbleAi {
1123
- background: var(--color-accent);
1124
- color: var(--bg);
1125
- border-bottom-right-radius: 16px;
1126
- }
1127
-
1128
- /* src/molecules/TopPromo.module.scss */
1129
- .TopPromo_module_root {
1130
- display: flex;
1131
- align-items: center;
1132
- gap: 0.625rem;
1133
- }
1134
- .TopPromo_module_text {
1135
- font-size: 13px;
1136
- letter-spacing: -0.25px;
1137
- color: var(--fg-secondary);
1138
- }
1139
-
1140
- /* src/molecules/ProfileNav.module.scss */
1141
- .ProfileNav_module_root {
1142
- display: flex;
1143
- align-items: center;
1144
- gap: 1.25rem;
1145
- }
1146
- .ProfileNav_module_stats {
1147
- display: flex;
1148
- align-items: center;
1149
- gap: 0.25rem;
1150
- }
1151
- .ProfileNav_module_statItem {
1152
- display: inline-flex;
1153
- align-items: center;
1154
- font-size: 13px;
1155
- font-weight: 500;
1156
- letter-spacing: -0.25px;
1157
- white-space: nowrap;
1158
- }
1159
- .ProfileNav_module_statText {
1160
- color: var(--fg-secondary);
1161
- }
1162
- .ProfileNav_module_separator {
1163
- color: var(--fg-muted);
1164
- }
1165
-
1166
- /* src/molecules/IconWithText.module.scss */
1167
- .IconWithText_module_root {
1168
- display: inline-flex;
1169
- align-items: center;
1170
- gap: 0.375rem;
1171
- padding-block: 0.25rem;
1172
- border-radius: 9999px;
1173
- }
1174
- .IconWithText_module_icon {
1175
- flex-shrink: 0;
1176
- width: 1.25rem;
1177
- height: 1.25rem;
1178
- display: flex;
1179
- align-items: center;
1180
- justify-content: center;
1181
- }
1182
- .IconWithText_module_text {
1183
- font-size: 13px;
1184
- font-weight: 500;
1185
- color: var(--fg);
1186
- letter-spacing: -0.25px;
1187
- white-space: nowrap;
1188
- }
1189
-
1190
- /* src/molecules/StampCard.module.scss */
1191
- .StampCard_module_root {
1192
- position: relative;
1193
- }
1194
- .StampCard_module_plain {
1195
- border-radius: var(--radius-xl);
1196
- border: 1px solid var(--border-color);
1197
- background: var(--bg);
1198
- overflow: hidden;
1199
- box-shadow: var(--shadow-xs);
1200
- }
1201
- .StampCard_module_inner {
1202
- background: var(--bg);
1203
- }
1204
-
1205
- /* src/molecules/PasswordInput.module.scss */
1206
- .PasswordInput_module_toggle {
1207
- display: flex;
1208
- align-items: center;
1209
- justify-content: center;
1210
- cursor: pointer;
1211
- }
1212
-
1213
- /* src/molecules/Breadcrumbs.module.scss */
1214
- .Breadcrumbs_module_list {
1215
- display: flex;
1216
- align-items: center;
1217
- gap: 0.375rem;
1218
- font-size: 13px;
1219
- letter-spacing: -0.25px;
1220
- list-style: none;
1221
- margin: 0;
1222
- padding: 0;
1223
- }
1224
- .Breadcrumbs_module_item {
1225
- display: flex;
1226
- align-items: center;
1227
- gap: 0.375rem;
1228
- }
1229
- .Breadcrumbs_module_separator {
1230
- color: var(--fg-muted);
1231
- }
1232
- .Breadcrumbs_module_active {
1233
- color: var(--fg);
1234
- font-weight: 500;
1235
- }
1236
- .Breadcrumbs_module_link {
1237
- color: var(--fg-muted);
1238
- text-decoration: none;
1239
- transition: color var(--transition-fast);
1240
- }
1241
- .Breadcrumbs_module_link:hover {
1242
- color: var(--fg);
1243
- }
1244
-
1245
- /* src/molecules/Toast.module.scss */
1246
- .Toast_module_root {
1247
- position: fixed;
1248
- bottom: 1.5rem;
1249
- right: 1.5rem;
1250
- z-index: 50;
1251
- display: flex;
1252
- gap: 0.75rem;
1253
- padding: 1rem;
1254
- border-radius: var(--radius-lg);
1255
- border: 1px solid var(--border-color);
1256
- background: var(--bg-secondary);
1257
- box-shadow: var(--shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1));
1258
- max-width: 24rem;
1259
- }
1260
- .Toast_module_icon {
1261
- flex-shrink: 0;
1262
- margin-top: 0.125rem;
1263
- }
1264
- .Toast_module_info {
1265
- color: var(--color-info);
1266
- }
1267
- .Toast_module_success {
1268
- color: var(--color-success);
1269
- }
1270
- .Toast_module_warning {
1271
- color: var(--color-warning);
1272
- }
1273
- .Toast_module_error {
1274
- color: var(--color-error);
1275
- }
1276
- .Toast_module_content {
1277
- flex: 1;
1278
- min-width: 0;
1279
- }
1280
- .Toast_module_title {
1281
- font-size: 13px;
1282
- font-weight: 500;
1283
- letter-spacing: -0.25px;
1284
- margin-bottom: 0.125rem;
1285
- }
1286
- .Toast_module_message {
1287
- font-size: 13px;
1288
- letter-spacing: -0.25px;
1289
- color: var(--fg-secondary);
1290
- }
1291
- .Toast_module_dismiss {
1292
- flex-shrink: 0;
1293
- color: var(--fg-muted);
1294
- transition: all var(--transition-fast);
1295
- cursor: pointer;
1296
- background: none;
1297
- border: none;
1298
- padding: 0;
1299
- }
1300
- .Toast_module_dismiss:hover {
1301
- color: var(--fg);
1302
- }
1303
-
1304
- /* src/molecules/Pagination.module.scss */
1305
- .Pagination_module_root {
1306
- display: flex;
1307
- align-items: center;
1308
- gap: 0.25rem;
1309
- }
1310
- .Pagination_module_pageBtn {
1311
- min-width: 36px;
1312
- height: 36px;
1313
- display: flex;
1314
- align-items: center;
1315
- justify-content: center;
1316
- font-size: 13px;
1317
- letter-spacing: -0.25px;
1318
- transition: all var(--transition-fast);
1319
- cursor: pointer;
1320
- border-radius: 9999px;
1321
- background: none;
1322
- border: none;
1323
- color: var(--fg-secondary);
1324
- }
1325
- .Pagination_module_pageBtn:hover {
1326
- color: var(--fg);
1327
- background: var(--bg-secondary);
1328
- }
1329
- .Pagination_module_activePage {
1330
- background: var(--fg);
1331
- color: var(--bg);
1332
- font-weight: 500;
1333
- }
1334
- .Pagination_module_activePage:hover {
1335
- background: var(--fg);
1336
- color: var(--bg);
1337
- }
1338
- .Pagination_module_ellipsis {
1339
- min-width: 36px;
1340
- height: 36px;
1341
- display: flex;
1342
- align-items: center;
1343
- justify-content: center;
1344
- font-size: 13px;
1345
- color: var(--fg-muted);
1346
- }
1347
- .Pagination_module_nav {
1348
- min-width: 36px;
1349
- height: 36px;
1350
- display: flex;
1351
- align-items: center;
1352
- justify-content: center;
1353
- font-size: 13px;
1354
- letter-spacing: -0.25px;
1355
- transition: all var(--transition-fast);
1356
- cursor: pointer;
1357
- background: none;
1358
- border: none;
1359
- color: var(--fg-secondary);
1360
- }
1361
- .Pagination_module_nav:hover {
1362
- color: var(--fg);
1363
- }
1364
- .Pagination_module_nav:disabled {
1365
- opacity: 0.5;
1366
- cursor: not-allowed;
1367
- }
1368
-
1369
- /* src/molecules/CodeInput.module.scss */
1370
- .CodeInput_module_root {
1371
- display: flex;
1372
- flex-direction: column;
1373
- gap: 0.375rem;
1374
- }
1375
- .CodeInput_module_label {
1376
- font-size: 13px;
1377
- font-weight: 500;
1378
- color: var(--fg);
1379
- letter-spacing: -0.25px;
1380
- }
1381
- .CodeInput_module_group {
1382
- display: flex;
1383
- gap: 0.75rem;
1384
- }
1385
- .CodeInput_module_digitInput {
1386
- width: 3rem;
1387
- height: 3rem;
1388
- text-align: center;
1389
- font-size: 1.125rem;
1390
- border: 1px solid var(--fg-muted);
1391
- background: var(--bg);
1392
- color: var(--fg);
1393
- border-radius: var(--radius-lg);
1394
- transition: all var(--transition-fast);
1395
- }
1396
- .CodeInput_module_digitInput:focus {
1397
- outline: none;
1398
- border-color: var(--fg);
1399
- }
1400
- .CodeInput_module_digitError {
1401
- border-color: var(--color-error);
1402
- }
1403
- .CodeInput_module_digitError:focus {
1404
- border-color: var(--color-error);
1405
- }
1406
- .CodeInput_module_errorText {
1407
- font-size: 13px;
1408
- letter-spacing: -0.25px;
1409
- color: var(--color-error);
1410
- }
1411
-
1412
- /* src/molecules/Modal.module.scss */
1413
- .Modal_module_dialog {
1414
- max-width: 32rem;
1415
- width: 100%;
1416
- padding: 0;
1417
- border-radius: var(--radius-lg);
1418
- box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
1419
- background: var(--bg);
1420
- border: 1px solid var(--border-color);
1421
- }
1422
- .Modal_module_dialog::backdrop {
1423
- background: rgba(0, 0, 0, 0.5);
1424
- }
1425
- .Modal_module_content {
1426
- padding: 1.5rem;
1427
- }
1428
- .Modal_module_header {
1429
- display: flex;
1430
- align-items: flex-start;
1431
- justify-content: space-between;
1432
- margin-bottom: 1rem;
1433
- }
1434
- .Modal_module_title {
1435
- font-size: 1.125rem;
1436
- font-weight: 600;
1437
- color: var(--fg);
1438
- letter-spacing: -0.25px;
1439
- }
1440
- .Modal_module_closeBtn {
1441
- flex-shrink: 0;
1442
- margin-left: auto;
1443
- color: var(--fg-muted);
1444
- transition: all var(--transition-fast);
1445
- cursor: pointer;
1446
- background: none;
1447
- border: none;
1448
- padding: 0;
1449
- }
1450
- .Modal_module_closeBtn:hover {
1451
- color: var(--fg);
1452
- }
1453
- .Modal_module_body {
1454
- font-size: 0.875rem;
1455
- color: var(--fg-secondary);
1456
- line-height: 1.625;
1457
- }
1458
- .Modal_module_footer {
1459
- display: flex;
1460
- gap: 0.75rem;
1461
- justify-content: flex-end;
1462
- margin-top: 1.5rem;
1463
- }
1464
-
1465
- /* src/molecules/DropdownMenu.module.scss */
1466
- .DropdownMenu_module_root {
1467
- position: relative;
1468
- display: inline-block;
1469
- }
1470
- .DropdownMenu_module_trigger {
1471
- cursor: pointer;
1472
- display: inline-flex;
1473
- }
1474
- .DropdownMenu_module_menu {
1475
- position: absolute;
1476
- top: 100%;
1477
- margin-top: 0.25rem;
1478
- z-index: 50;
1479
- border-radius: var(--radius-lg);
1480
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
1481
- border: 1px solid var(--border-color);
1482
- background: var(--bg);
1483
- min-width: 180px;
1484
- padding: 0.25rem 0;
1485
- }
1486
- .DropdownMenu_module_alignLeft {
1487
- left: 0;
1488
- }
1489
- .DropdownMenu_module_alignRight {
1490
- right: 0;
1491
- }
1492
- .DropdownMenu_module_item {
1493
- display: flex;
1494
- align-items: center;
1495
- gap: 0.5rem;
1496
- width: 100%;
1497
- padding: 0.5rem 0.75rem;
1498
- font-size: 13px;
1499
- letter-spacing: -0.25px;
1500
- color: var(--fg-secondary);
1501
- transition: all var(--transition-fast);
1502
- cursor: pointer;
1503
- text-align: left;
1504
- background: none;
1505
- border: none;
1506
- }
1507
- .DropdownMenu_module_item:hover {
1508
- background: var(--bg-secondary);
1509
- color: var(--fg);
1510
- }
1511
- .DropdownMenu_module_itemIcon {
1512
- flex-shrink: 0;
1513
- color: var(--fg-muted);
1514
- }
1515
- .DropdownMenu_module_divider {
1516
- margin: 0.25rem 0;
1517
- border: none;
1518
- border-top: 1px solid var(--border-color);
1519
- }
1520
-
1521
- /* src/organisms/Header.module.scss */
1522
- .Header_module_root {
1523
- border-bottom: 1px solid var(--border-color);
1524
- background: color-mix(in srgb, var(--bg) 80%, transparent);
1525
- backdrop-filter: blur(12px);
1526
- position: sticky;
1527
- top: 0;
1528
- z-index: 50;
1529
- }
1530
- .Header_module_container {
1531
- max-width: 80rem;
1532
- margin: 0 auto;
1533
- padding: 0 1rem;
1534
- }
1535
- @media (min-width: 640px) {
1536
- .Header_module_container {
1537
- padding: 0 1.5rem;
1538
- }
1539
- }
1540
- @media (min-width: 1024px) {
1541
- .Header_module_container {
1542
- padding: 0 2rem;
1543
- }
1544
- }
1545
- .Header_module_bar {
1546
- display: flex;
1547
- align-items: center;
1548
- justify-content: space-between;
1549
- height: 4rem;
1550
- }
1551
- .Header_module_leftGroup {
1552
- display: flex;
1553
- align-items: center;
1554
- gap: 2rem;
1555
- }
1556
- .Header_module_logoFallback {
1557
- font-size: 1.125rem;
1558
- font-weight: 700;
1559
- color: var(--fg);
1560
- }
1561
- .Header_module_logoBrand {
1562
- color: var(--brand-primary);
1563
- }
1564
- .Header_module_desktopNav {
1565
- display: none;
1566
- align-items: center;
1567
- gap: 0.25rem;
1568
- }
1569
- @media (min-width: 768px) {
1570
- .Header_module_desktopNav {
1571
- display: flex;
1572
- }
1573
- }
1574
- .Header_module_navLink {
1575
- padding: 0.5rem 0.75rem;
1576
- font-size: 0.875rem;
1577
- color: var(--fg-secondary);
1578
- border-radius: var(--radius-md);
1579
- transition: color 0.15s, background 0.15s;
1580
- }
1581
- .Header_module_navLink:hover {
1582
- color: var(--fg);
1583
- background: var(--bg-tertiary);
1584
- }
1585
- .Header_module_desktopActions {
1586
- display: none;
1587
- align-items: center;
1588
- gap: 0.75rem;
1589
- }
1590
- @media (min-width: 768px) {
1591
- .Header_module_desktopActions {
1592
- display: flex;
1593
- }
1594
- }
1595
- .Header_module_mobileToggle {
1596
- display: block;
1597
- padding: 0.5rem;
1598
- color: var(--fg-secondary);
1599
- cursor: pointer;
1600
- background: none;
1601
- border: none;
1602
- }
1603
- .Header_module_mobileToggle:hover {
1604
- color: var(--fg);
1605
- }
1606
- @media (min-width: 768px) {
1607
- .Header_module_mobileToggle {
1608
- display: none;
1609
- }
1610
- }
1611
- .Header_module_mobileMenu {
1612
- display: block;
1613
- border-top: 1px solid var(--border-color);
1614
- background: var(--bg);
1615
- padding: 1rem;
1616
- }
1617
- @media (min-width: 768px) {
1618
- .Header_module_mobileMenu {
1619
- display: none;
1620
- }
1621
- }
1622
- .Header_module_mobileNav {
1623
- display: flex;
1624
- flex-direction: column;
1625
- gap: 0.25rem;
1626
- }
1627
- .Header_module_mobileActions {
1628
- display: flex;
1629
- flex-direction: column;
1630
- gap: 0.5rem;
1631
- margin-top: 1rem;
1632
- padding-top: 1rem;
1633
- border-top: 1px solid var(--border-color);
1634
- }
1635
-
1636
- /* src/organisms/Footer.module.scss */
1637
- .Footer_module_root {
1638
- border-top: 1px solid var(--border-color);
1639
- background: var(--bg);
1640
- }
1641
- .Footer_module_container {
1642
- max-width: 80rem;
1643
- margin: 0 auto;
1644
- padding: 3rem 1rem;
1645
- }
1646
- @media (min-width: 640px) {
1647
- .Footer_module_container {
1648
- padding: 3rem 1.5rem;
1649
- }
1650
- }
1651
- @media (min-width: 1024px) {
1652
- .Footer_module_container {
1653
- padding: 3rem 2rem;
1654
- }
1655
- }
1656
- .Footer_module_grid {
1657
- display: grid;
1658
- grid-template-columns: repeat(2, 1fr);
1659
- gap: 2rem;
1660
- }
1661
- @media (min-width: 768px) {
1662
- .Footer_module_grid {
1663
- grid-template-columns: repeat(4, 1fr);
1664
- }
1665
- }
1666
- .Footer_module_brand {
1667
- font-size: 1.125rem;
1668
- font-weight: 700;
1669
- color: var(--fg);
1670
- }
1671
- .Footer_module_brandAccent {
1672
- color: var(--brand-primary);
1673
- }
1674
- .Footer_module_tagline {
1675
- margin-top: 0.75rem;
1676
- font-size: 13px;
1677
- color: var(--fg-muted);
1678
- line-height: 1.625;
1679
- letter-spacing: -0.25px;
1680
- }
1681
- .Footer_module_columnTitle {
1682
- font-size: 13px;
1683
- font-weight: 600;
1684
- color: var(--fg-secondary);
1685
- margin-bottom: 0.75rem;
1686
- letter-spacing: -0.25px;
1687
- }
1688
- .Footer_module_linkList {
1689
- display: flex;
1690
- flex-direction: column;
1691
- gap: 0.625rem;
1692
- list-style: none;
1693
- padding: 0;
1694
- margin: 0;
1695
- }
1696
- .Footer_module_link {
1697
- font-size: 13px;
1698
- color: var(--fg-muted);
1699
- letter-spacing: -0.25px;
1700
- transition: color var(--transition-fast);
1701
- }
1702
- .Footer_module_link:hover {
1703
- color: var(--fg);
1704
- }
1705
- .Footer_module_bottom {
1706
- margin-top: 3rem;
1707
- padding-top: 2rem;
1708
- border-top: 1px solid var(--border-color);
1709
- display: flex;
1710
- flex-direction: column;
1711
- justify-content: space-between;
1712
- align-items: center;
1713
- gap: 1rem;
1714
- }
1715
- @media (min-width: 640px) {
1716
- .Footer_module_bottom {
1717
- flex-direction: row;
1718
- }
1719
- }
1720
- .Footer_module_copyright {
1721
- font-size: 13px;
1722
- color: var(--fg-muted);
1723
- letter-spacing: -0.25px;
1724
- }
1725
- .Footer_module_socials {
1726
- display: flex;
1727
- gap: 1rem;
1728
- }
1729
- .Footer_module_socialLink {
1730
- font-size: 13px;
1731
- color: var(--fg-muted);
1732
- letter-spacing: -0.25px;
1733
- transition: color var(--transition-fast);
1734
- }
1735
- .Footer_module_socialLink:hover {
1736
- color: var(--fg);
1737
- }
1738
-
1739
- /* src/organisms/PricingCard.module.scss */
1740
- .PricingCard_module_root {
1741
- position: relative;
1742
- border-radius: var(--radius-xl);
1743
- border: 1px solid var(--border-color);
1744
- padding: 1.5rem;
1745
- display: flex;
1746
- flex-direction: column;
1747
- background: var(--bg);
1748
- box-shadow: var(--shadow-xs);
1749
- }
1750
- .PricingCard_module_highlighted {
1751
- border-color: var(--brand-primary);
1752
- box-shadow: 0 0 0 1px var(--brand-primary), var(--shadow-lg);
1753
- }
1754
- .PricingCard_module_badgeWrap {
1755
- position: absolute;
1756
- top: -0.75rem;
1757
- left: 50%;
1758
- transform: translateX(-50%);
1759
- }
1760
- .PricingCard_module_header {
1761
- margin-bottom: 1rem;
1762
- }
1763
- .PricingCard_module_plan {
1764
- font-size: 1.125rem;
1765
- font-weight: 600;
1766
- color: var(--fg);
1767
- }
1768
- .PricingCard_module_description {
1769
- font-size: 0.875rem;
1770
- color: var(--fg-muted);
1771
- margin-top: 0.25rem;
1772
- }
1773
- .PricingCard_module_priceBlock {
1774
- margin-bottom: 1.5rem;
1775
- }
1776
- .PricingCard_module_price {
1777
- font-size: 2.25rem;
1778
- font-weight: 700;
1779
- color: var(--fg);
1780
- }
1781
- .PricingCard_module_period {
1782
- color: var(--fg-muted);
1783
- }
1784
- .PricingCard_module_features {
1785
- display: flex;
1786
- flex-direction: column;
1787
- gap: 0.75rem;
1788
- margin-bottom: 2rem;
1789
- flex: 1;
1790
- }
1791
- .PricingCard_module_featureItem {
1792
- display: flex;
1793
- align-items: flex-start;
1794
- gap: 0.625rem;
1795
- font-size: 0.875rem;
1796
- color: var(--fg-secondary);
1797
- }
1798
- .PricingCard_module_featureIcon {
1799
- flex-shrink: 0;
1800
- margin-top: 2px;
1801
- color: var(--color-success);
1802
- }
1803
- .PricingCard_module_cta {
1804
- width: 100%;
1805
- }
1806
-
1807
- /* src/organisms/TestimonialCard.module.scss */
1808
- .TestimonialCard_module_root {
1809
- border-radius: var(--radius-xl);
1810
- border: 1px solid var(--border-color);
1811
- background: var(--bg);
1812
- padding: 1.5rem;
1813
- box-shadow: var(--shadow-xs);
1814
- }
1815
- .TestimonialCard_module_quoteIcon {
1816
- color: var(--brand-primary);
1817
- opacity: 0.3;
1818
- margin-bottom: 1rem;
1819
- }
1820
- .TestimonialCard_module_quoteText {
1821
- font-size: 0.875rem;
1822
- color: var(--fg-secondary);
1823
- line-height: 1.625;
1824
- margin-bottom: 1.5rem;
1825
- }
1826
- .TestimonialCard_module_author {
1827
- display: flex;
1828
- align-items: center;
1829
- gap: 0.75rem;
1830
- }
1831
- .TestimonialCard_module_authorName {
1832
- font-size: 0.875rem;
1833
- font-weight: 500;
1834
- color: var(--fg);
1835
- }
1836
- .TestimonialCard_module_authorRole {
1837
- font-size: 0.75rem;
1838
- color: var(--fg-muted);
1839
- }
1840
-
1841
- /* src/organisms/FeatureGrid.module.scss */
1842
- .FeatureGrid_module_root {
1843
- display: grid;
1844
- grid-template-columns: 1fr;
1845
- gap: 1.5rem;
1846
- }
1847
- @media (min-width: 768px) {
1848
- .FeatureGrid_module_cols2 {
1849
- grid-template-columns: repeat(2, 1fr);
1850
- }
1851
- }
1852
- @media (min-width: 768px) {
1853
- .FeatureGrid_module_cols3 {
1854
- grid-template-columns: repeat(3, 1fr);
1855
- }
1856
- }
1857
- @media (min-width: 768px) {
1858
- .FeatureGrid_module_cols4 {
1859
- grid-template-columns: repeat(2, 1fr);
1860
- }
1861
- }
1862
- @media (min-width: 1024px) {
1863
- .FeatureGrid_module_cols4 {
1864
- grid-template-columns: repeat(4, 1fr);
1865
- }
1866
- }
1867
- .FeatureGrid_module_card {
1868
- border-radius: var(--radius-xl);
1869
- border: 1px solid var(--border-color);
1870
- background: var(--bg);
1871
- padding: 1.5rem;
1872
- transition: all var(--transition-base);
1873
- }
1874
- .FeatureGrid_module_card:hover {
1875
- box-shadow: var(--shadow-md);
1876
- transform: translateY(-2px);
1877
- }
1878
- .FeatureGrid_module_cardIcon {
1879
- width: 2.5rem;
1880
- height: 2.5rem;
1881
- border-radius: var(--radius-lg);
1882
- background: color-mix(in srgb, var(--brand-primary) 10%, transparent);
1883
- display: flex;
1884
- align-items: center;
1885
- justify-content: center;
1886
- color: var(--brand-primary);
1887
- margin-bottom: 1rem;
1888
- }
1889
- .FeatureGrid_module_cardTitle {
1890
- font-size: 0.875rem;
1891
- font-weight: 600;
1892
- color: var(--fg);
1893
- margin-bottom: 0.375rem;
1894
- }
1895
- .FeatureGrid_module_cardDescription {
1896
- font-size: 0.875rem;
1897
- color: var(--fg-muted);
1898
- line-height: 1.625;
1899
- }
1900
-
1901
- /* src/organisms/Sidebar.module.scss */
1902
- .Sidebar_module_root {
1903
- background: var(--bg);
1904
- border-right: 1px solid var(--border-color);
1905
- display: flex;
1906
- flex-direction: column;
1907
- justify-content: space-between;
1908
- padding: 2rem;
1909
- flex-shrink: 0;
1910
- height: 100%;
1911
- }
1912
- .Sidebar_module_menu {
1913
- width: 240px;
1914
- }
1915
- .Sidebar_module_courseSubmenu {
1916
- width: 340px;
1917
- }
1918
- .Sidebar_module_nav {
1919
- display: flex;
1920
- flex-direction: column;
1921
- gap: 0.25rem;
1922
- align-items: flex-start;
1923
- }
1924
- .Sidebar_module_footer {
1925
- display: flex;
1926
- flex-direction: column;
1927
- gap: 1.25rem;
1928
- width: 100%;
1929
- }
1930
- .Sidebar_module_legal {
1931
- font-size: 10px;
1932
- color: var(--fg-muted);
1933
- letter-spacing: -0.2px;
1934
- }
1935
-
1936
- /* src/organisms/AppCard.module.scss */
1937
- .AppCard_module_defaultCard {
1938
- display: flex;
1939
- flex-direction: column;
1940
- width: 320px;
1941
- }
1942
- .AppCard_module_stampCard {
1943
- display: flex;
1944
- flex-direction: column;
1945
- width: 320px;
1946
- position: relative;
1947
- }
1948
- .AppCard_module_imageWrap {
1949
- position: relative;
1950
- width: 100%;
1951
- aspect-ratio: 16/9;
1952
- overflow: hidden;
1953
- }
1954
- .AppCard_module_imageWrapRounded {
1955
- border-radius: 16px 16px 0 0;
1956
- }
1957
- .AppCard_module_image {
1958
- position: absolute;
1959
- inset: 0;
1960
- width: 100%;
1961
- height: 100%;
1962
- object-fit: cover;
1963
- }
1964
- .AppCard_module_contentArea {
1965
- background: var(--bg);
1966
- overflow: hidden;
1967
- display: flex;
1968
- flex-direction: column;
1969
- justify-content: space-between;
1970
- padding: 25px 25px 21px;
1971
- flex: 1;
1972
- min-height: 220px;
1973
- position: relative;
1974
- }
1975
- .AppCard_module_contentDefault {
1976
- border: 1px solid var(--bg-tertiary);
1977
- box-shadow: var(--shadow-md);
1978
- }
1979
- .AppCard_module_contentDefaultNoImage {
1980
- border-radius: 16px;
1981
- }
1982
- .AppCard_module_contentDefaultWithImage {
1983
- border-radius: 0 0 16px 16px;
1984
- }
1985
- .AppCard_module_contentStamp {
1986
- }
1987
- .AppCard_module_textGroup {
1988
- display: flex;
1989
- flex-direction: column;
1990
- gap: 0.75rem;
1991
- padding-right: 2rem;
1992
- }
1993
- .AppCard_module_cardTitle {
1994
- font-size: 1rem;
1995
- font-weight: 600;
1996
- color: var(--fg-secondary);
1997
- letter-spacing: -0.25px;
1998
- }
1999
- .AppCard_module_cardDesc {
2000
- font-size: 13px;
2001
- color: var(--fg-muted);
2002
- letter-spacing: -0.25px;
2003
- line-height: 1.5;
2004
- }
2005
- .AppCard_module_footer {
2006
- display: flex;
2007
- align-items: center;
2008
- justify-content: space-between;
2009
- margin-top: 1.25rem;
2010
- }
2011
- .AppCard_module_iconRow {
2012
- display: flex;
2013
- align-items: center;
2014
- gap: 0.25rem;
2015
- }
2016
- .AppCard_module_shadowWrap {
2017
- filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.15)) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.12));
2018
- }
2019
- .AppCard_module_stampBg {
2020
- background: var(--bg);
2021
- }
2022
-
2023
- /* src/organisms/AppTopLine.module.scss */
2024
- .AppTopLine_module_root {
2025
- background: var(--bg);
2026
- display: flex;
2027
- align-items: center;
2028
- justify-content: space-between;
2029
- width: 100%;
2030
- }
2031
-
2032
- /* src/organisms/EmptyState.module.scss */
2033
- .EmptyState_module_root {
2034
- border-radius: var(--radius-xl);
2035
- border: 1px solid var(--border-color);
2036
- background: var(--bg);
2037
- padding: 2rem;
2038
- box-shadow: var(--shadow-xs);
2039
- display: flex;
2040
- flex-direction: column;
2041
- align-items: center;
2042
- text-align: center;
2043
- }
2044
- .EmptyState_module_icon {
2045
- color: var(--fg-muted);
2046
- margin-bottom: 1rem;
2047
- }
2048
- .EmptyState_module_title {
2049
- font-size: 1.125rem;
2050
- font-weight: 600;
2051
- color: var(--fg);
2052
- }
2053
- .EmptyState_module_description {
2054
- font-size: 13px;
2055
- color: var(--fg-muted);
2056
- letter-spacing: -0.25px;
2057
- margin-top: 0.25rem;
2058
- max-width: 24rem;
2059
- }
2060
- .EmptyState_module_action {
2061
- margin-top: 1.25rem;
2062
- }
2063
-
2064
- /* src/organisms/HeroSection.module.scss */
2065
- .HeroSection_module_root {
2066
- position: relative;
2067
- overflow: hidden;
2068
- }
2069
- .HeroSection_module_bgGlow {
2070
- position: absolute;
2071
- inset: 0;
2072
- pointer-events: none;
2073
- }
2074
- .HeroSection_module_glowOrb {
2075
- position: absolute;
2076
- top: 0;
2077
- left: 50%;
2078
- transform: translateX(-50%);
2079
- width: 800px;
2080
- height: 600px;
2081
- background:
2082
- radial-gradient(
2083
- ellipse at center,
2084
- var(--brand-primary) 0%,
2085
- transparent 70%);
2086
- opacity: 0.04;
2087
- }
2088
- .HeroSection_module_inner {
2089
- position: relative;
2090
- padding: 5rem 0;
2091
- }
2092
- @media (min-width: 768px) {
2093
- .HeroSection_module_inner {
2094
- padding: 8rem 0;
2095
- }
2096
- }
2097
- .HeroSection_module_innerCompact {
2098
- position: relative;
2099
- padding: 4rem 0;
2100
- }
2101
- @media (min-width: 768px) {
2102
- .HeroSection_module_innerCompact {
2103
- padding: 5rem 0;
2104
- }
2105
- }
2106
- .HeroSection_module_content {
2107
- max-width: 56rem;
2108
- }
2109
- .HeroSection_module_contentCenter {
2110
- margin-left: auto;
2111
- margin-right: auto;
2112
- text-align: center;
2113
- }
2114
- .HeroSection_module_eyebrowWrap {
2115
- margin-bottom: 1rem;
2116
- }
2117
- @media (min-width: 768px) {
2118
- .HeroSection_module_eyebrowWrap {
2119
- margin-bottom: 1.25rem;
2120
- }
2121
- }
2122
- .HeroSection_module_eyebrowCenter {
2123
- display: flex;
2124
- justify-content: center;
2125
- }
2126
- .HeroSection_module_eyebrow {
2127
- display: inline-flex;
2128
- align-items: center;
2129
- gap: 0.375rem;
2130
- padding: 0.25rem 0.75rem;
2131
- border-radius: 9999px;
2132
- font-size: 11px;
2133
- font-weight: 600;
2134
- text-transform: uppercase;
2135
- letter-spacing: 0.08em;
2136
- background: color-mix(in srgb, var(--brand-primary) 10%, transparent);
2137
- color: var(--brand-primary);
2138
- border: 1px solid color-mix(in srgb, var(--brand-primary) 15%, transparent);
2139
- }
2140
- .HeroSection_module_eyebrowDot {
2141
- width: 0.375rem;
2142
- height: 0.375rem;
2143
- border-radius: 9999px;
2144
- background: var(--brand-primary);
2145
- animation: HeroSection_module_pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
2146
- }
2147
- @keyframes HeroSection_module_pulse {
2148
- 0%, 100% {
2149
- opacity: 1;
2150
- }
2151
- 50% {
2152
- opacity: 0.5;
2153
- }
2154
- }
2155
- .HeroSection_module_title {
2156
- font-size: clamp(2rem, 5vw, 3.75rem);
2157
- font-weight: 700;
2158
- line-height: 1.08;
2159
- letter-spacing: -0.035em;
2160
- color: var(--fg);
2161
- text-wrap: balance;
2162
- }
2163
- .HeroSection_module_subtitle {
2164
- margin-top: 1.25rem;
2165
- font-size: 1rem;
2166
- color: var(--fg-secondary);
2167
- line-height: 1.625;
2168
- max-width: 42rem;
2169
- }
2170
- @media (min-width: 768px) {
2171
- .HeroSection_module_subtitle {
2172
- margin-top: 1.5rem;
2173
- font-size: 1.125rem;
2174
- }
2175
- }
2176
- .HeroSection_module_subtitleCenter {
2177
- margin-left: auto;
2178
- margin-right: auto;
2179
- }
2180
- .HeroSection_module_actions {
2181
- margin-top: 2rem;
2182
- display: flex;
2183
- flex-wrap: wrap;
2184
- gap: 0.75rem;
2185
- }
2186
- @media (min-width: 768px) {
2187
- .HeroSection_module_actions {
2188
- margin-top: 2.5rem;
2189
- }
2190
- }
2191
- .HeroSection_module_actionsCenter {
2192
- justify-content: center;
2193
- }
2194
- .HeroSection_module_mediaWrap {
2195
- margin-top: 3rem;
2196
- max-width: 64rem;
2197
- }
2198
- @media (min-width: 768px) {
2199
- .HeroSection_module_mediaWrap {
2200
- margin-top: 4rem;
2201
- }
2202
- }
2203
- .HeroSection_module_mediaWrapCenter {
2204
- margin-left: auto;
2205
- margin-right: auto;
2206
- max-width: 64rem;
2207
- }
2208
- .HeroSection_module_mediaWrapLeft {
2209
- max-width: 56rem;
2210
- }
2211
- .HeroSection_module_mediaBox {
2212
- border-radius: var(--radius-xl);
2213
- border: 1px solid var(--border-color);
2214
- box-shadow: var(--shadow-xl);
2215
- overflow: hidden;
2216
- background: var(--bg-secondary);
2217
- }
2218
-
2219
- /* src/organisms/LogoCloud.module.scss */
2220
- .LogoCloud_module_root {
2221
- padding-block: 2.5rem;
2222
- }
2223
- @media (min-width: 768px) {
2224
- .LogoCloud_module_root {
2225
- padding-block: 3.5rem;
2226
- }
2227
- }
2228
- .LogoCloud_module_label {
2229
- text-align: center;
2230
- font-size: 11px;
2231
- font-weight: 600;
2232
- text-transform: uppercase;
2233
- letter-spacing: 0.1em;
2234
- color: var(--fg-muted);
2235
- margin-bottom: 2rem;
2236
- }
2237
- .LogoCloud_module_grid {
2238
- display: flex;
2239
- flex-wrap: wrap;
2240
- align-items: center;
2241
- justify-content: center;
2242
- column-gap: 2.5rem;
2243
- row-gap: 1.5rem;
2244
- }
2245
- @media (min-width: 768px) {
2246
- .LogoCloud_module_grid {
2247
- column-gap: 3.5rem;
2248
- }
2249
- }
2250
- .LogoCloud_module_logoItem {
2251
- display: flex;
2252
- align-items: center;
2253
- gap: 0.5rem;
2254
- opacity: 0.4;
2255
- transition: opacity var(--transition-base);
2256
- }
2257
- .LogoCloud_module_logoItem:hover {
2258
- opacity: 0.7;
2259
- }
2260
- .LogoCloud_module_logoImg {
2261
- height: 1.5rem;
2262
- width: auto;
2263
- object-fit: contain;
2264
- }
2265
- @media (min-width: 768px) {
2266
- .LogoCloud_module_logoImg {
2267
- height: 1.75rem;
2268
- }
2269
- }
2270
- .LogoCloud_module_logoText {
2271
- font-size: 0.875rem;
2272
- font-weight: 700;
2273
- letter-spacing: -0.02em;
2274
- color: var(--fg);
2275
- user-select: none;
2276
- }
2277
- @media (min-width: 768px) {
2278
- .LogoCloud_module_logoText {
2279
- font-size: 1rem;
2280
- }
2281
- }
2282
-
2283
- /* src/organisms/StatsBar.module.scss */
2284
- .StatsBar_module_root {
2285
- padding-block: 2.5rem;
2286
- }
2287
- @media (min-width: 768px) {
2288
- .StatsBar_module_root {
2289
- padding-block: 3.5rem;
2290
- }
2291
- }
2292
- .StatsBar_module_inline {
2293
- border-top: 1px solid var(--border-color);
2294
- border-bottom: 1px solid var(--border-color);
2295
- }
2296
- .StatsBar_module_inlineGrid {
2297
- display: flex;
2298
- flex-wrap: wrap;
2299
- align-items: center;
2300
- justify-content: center;
2301
- gap: 2rem;
2302
- }
2303
- @media (min-width: 768px) {
2304
- .StatsBar_module_inlineGrid {
2305
- gap: 4rem;
2306
- }
2307
- }
2308
- .StatsBar_module_inlineItem {
2309
- text-align: center;
2310
- }
2311
- .StatsBar_module_cardsGrid {
2312
- display: grid;
2313
- grid-template-columns: repeat(2, 1fr);
2314
- gap: 1rem;
2315
- }
2316
- @media (min-width: 768px) {
2317
- .StatsBar_module_cardsGrid {
2318
- grid-template-columns: repeat(4, 1fr);
2319
- }
2320
- }
2321
- .StatsBar_module_card {
2322
- border-radius: var(--radius-xl);
2323
- border: 1px solid var(--border-color);
2324
- background: var(--bg);
2325
- padding: 1.25rem;
2326
- text-align: center;
2327
- transition: all var(--transition-base);
2328
- }
2329
- @media (min-width: 768px) {
2330
- .StatsBar_module_card {
2331
- padding: 1.5rem;
2332
- }
2333
- }
2334
- .StatsBar_module_card:hover {
2335
- box-shadow: var(--shadow-md);
2336
- transform: translateY(-2px);
2337
- }
2338
- .StatsBar_module_cardIconWrap {
2339
- display: flex;
2340
- justify-content: center;
2341
- margin-bottom: 0.75rem;
2342
- color: var(--brand-primary);
2343
- }
2344
- .StatsBar_module_statValue {
2345
- font-size: 1.5rem;
2346
- font-weight: 700;
2347
- color: var(--fg);
2348
- letter-spacing: -0.03em;
2349
- font-variant-numeric: tabular-nums;
2350
- }
2351
- @media (min-width: 768px) {
2352
- .StatsBar_module_statValue {
2353
- font-size: 1.875rem;
2354
- }
2355
- }
2356
- .StatsBar_module_statLabel {
2357
- margin-top: 0.25rem;
2358
- font-size: 13px;
2359
- color: var(--fg-muted);
2360
- letter-spacing: -0.25px;
2361
- }
2362
-
2363
- /* src/organisms/CTASection.module.scss */
2364
- .CTASection_module_root {
2365
- }
2366
- .CTASection_module_default {
2367
- padding-block: 4rem;
2368
- }
2369
- @media (min-width: 768px) {
2370
- .CTASection_module_default {
2371
- padding-block: 6rem;
2372
- }
2373
- }
2374
- .CTASection_module_filled {
2375
- padding-block: 3rem;
2376
- padding-inline: 1.5rem;
2377
- border-radius: var(--radius-xl);
2378
- background: var(--fg);
2379
- color: var(--bg);
2380
- }
2381
- @media (min-width: 768px) {
2382
- .CTASection_module_filled {
2383
- padding-block: 4rem;
2384
- padding-inline: 3rem;
2385
- }
2386
- }
2387
- .CTASection_module_bordered {
2388
- padding-block: 3rem;
2389
- padding-inline: 1.5rem;
2390
- border-radius: var(--radius-xl);
2391
- border: 2px dashed var(--border-color-strong);
2392
- }
2393
- @media (min-width: 768px) {
2394
- .CTASection_module_bordered {
2395
- padding-block: 4rem;
2396
- padding-inline: 3rem;
2397
- }
2398
- }
2399
- .CTASection_module_inner {
2400
- max-width: 42rem;
2401
- margin-inline: auto;
2402
- text-align: center;
2403
- }
2404
- .CTASection_module_title {
2405
- font-size: 1.5rem;
2406
- font-weight: 700;
2407
- letter-spacing: -0.03em;
2408
- line-height: 1.1;
2409
- color: var(--fg);
2410
- }
2411
- @media (min-width: 768px) {
2412
- .CTASection_module_title {
2413
- font-size: 2.25rem;
2414
- }
2415
- }
2416
- .CTASection_module_titleFilled {
2417
- color: var(--bg);
2418
- }
2419
- .CTASection_module_description {
2420
- margin-top: 1rem;
2421
- font-size: 1rem;
2422
- line-height: 1.625;
2423
- color: var(--fg-secondary);
2424
- }
2425
- .CTASection_module_descriptionFilled {
2426
- color: color-mix(in srgb, var(--bg) 70%, transparent);
2427
- }
2428
- .CTASection_module_actions {
2429
- margin-top: 2rem;
2430
- display: flex;
2431
- flex-wrap: wrap;
2432
- gap: 0.75rem;
2433
- justify-content: center;
2434
- }
2435
-
2436
- /* src/organisms/BentoGrid.module.scss */
2437
- .BentoGrid_module_root {
2438
- padding-block: 2.5rem;
2439
- }
2440
- @media (min-width: 768px) {
2441
- .BentoGrid_module_root {
2442
- padding-block: 3.5rem;
2443
- }
2444
- }
2445
- .BentoGrid_module_grid {
2446
- display: grid;
2447
- grid-template-columns: 1fr;
2448
- gap: 1rem;
2449
- }
2450
- @media (min-width: 768px) {
2451
- .BentoGrid_module_grid {
2452
- grid-template-columns: repeat(3, 1fr);
2453
- }
2454
- }
2455
- .BentoGrid_module_item {
2456
- position: relative;
2457
- border-radius: var(--radius-xl);
2458
- border: 1px solid var(--border-color);
2459
- background: var(--bg);
2460
- overflow: hidden;
2461
- transition: all var(--transition-base);
2462
- }
2463
- .BentoGrid_module_item:hover {
2464
- box-shadow: var(--shadow-md);
2465
- border-color: var(--border-color-strong);
2466
- }
2467
- @media (min-width: 768px) {
2468
- .BentoGrid_module_colSpan2 {
2469
- grid-column: span 2;
2470
- }
2471
- }
2472
- @media (min-width: 768px) {
2473
- .BentoGrid_module_rowSpan2 {
2474
- grid-row: span 2;
2475
- }
2476
- }
2477
- .BentoGrid_module_mediaWrap {
2478
- width: 100%;
2479
- overflow: hidden;
2480
- }
2481
- .BentoGrid_module_content {
2482
- padding: 1.25rem;
2483
- }
2484
- @media (min-width: 768px) {
2485
- .BentoGrid_module_content {
2486
- padding: 1.5rem;
2487
- }
2488
- }
2489
- .BentoGrid_module_contentTall {
2490
- display: flex;
2491
- flex-direction: column;
2492
- height: 100%;
2493
- }
2494
- .BentoGrid_module_itemIcon {
2495
- width: 2.25rem;
2496
- height: 2.25rem;
2497
- border-radius: var(--radius-md);
2498
- background: color-mix(in srgb, var(--brand-primary) 10%, transparent);
2499
- display: flex;
2500
- align-items: center;
2501
- justify-content: center;
2502
- color: var(--brand-primary);
2503
- margin-bottom: 0.875rem;
2504
- }
2505
- .BentoGrid_module_itemTitle {
2506
- font-size: 15px;
2507
- font-weight: 600;
2508
- color: var(--fg);
2509
- letter-spacing: -0.01em;
2510
- }
2511
- .BentoGrid_module_itemDescription {
2512
- margin-top: 0.375rem;
2513
- font-size: 13px;
2514
- color: var(--fg-muted);
2515
- line-height: 1.625;
2516
- letter-spacing: -0.25px;
2517
- }
2518
-
2519
- /* src/organisms/FAQSection.module.scss */
2520
- .FAQSection_module_root {
2521
- padding: 3.5rem 0;
2522
- }
2523
- @media (min-width: 768px) {
2524
- .FAQSection_module_root {
2525
- padding: 5rem 0;
2526
- }
2527
- }
2528
- .FAQSection_module_container {
2529
- max-width: 42rem;
2530
- margin: 0 auto;
2531
- }
2532
- .FAQSection_module_title {
2533
- font-size: 1.5rem;
2534
- font-weight: 700;
2535
- color: var(--fg);
2536
- letter-spacing: -0.03em;
2537
- text-align: center;
2538
- }
2539
- @media (min-width: 768px) {
2540
- .FAQSection_module_title {
2541
- font-size: 1.875rem;
2542
- }
2543
- }
2544
- .FAQSection_module_subtitle {
2545
- margin-top: 0.75rem;
2546
- font-size: 1rem;
2547
- color: var(--fg-secondary);
2548
- text-align: center;
2549
- }
2550
- .FAQSection_module_list {
2551
- margin-top: 2.5rem;
2552
- }
2553
- .FAQSection_module_item {
2554
- padding: 1.25rem 0;
2555
- }
2556
- .FAQSection_module_item + .FAQSection_module_item {
2557
- border-top: 1px solid var(--border-color);
2558
- }
2559
- .FAQSection_module_question {
2560
- width: 100%;
2561
- display: flex;
2562
- align-items: center;
2563
- justify-content: space-between;
2564
- gap: 1rem;
2565
- text-align: left;
2566
- cursor: pointer;
2567
- background: none;
2568
- border: none;
2569
- padding: 0;
2570
- }
2571
- .FAQSection_module_question:hover .FAQSection_module_questionText {
2572
- color: var(--brand-primary);
2573
- }
2574
- .FAQSection_module_questionText {
2575
- font-size: 15px;
2576
- font-weight: 500;
2577
- color: var(--fg);
2578
- transition: color 0.15s;
2579
- }
2580
- .FAQSection_module_toggleIcon {
2581
- flex-shrink: 0;
2582
- width: 1.25rem;
2583
- height: 1.25rem;
2584
- display: flex;
2585
- align-items: center;
2586
- justify-content: center;
2587
- color: var(--fg-muted);
2588
- transition: transform 0.2s;
2589
- }
2590
- .FAQSection_module_toggleIconOpen {
2591
- transform: rotate(45deg);
2592
- }
2593
- .FAQSection_module_answer {
2594
- overflow: hidden;
2595
- transition: max-height 0.2s ease-out, opacity 0.2s ease-out;
2596
- }
2597
- .FAQSection_module_answerOpen {
2598
- max-height: 24rem;
2599
- opacity: 1;
2600
- margin-top: 0.75rem;
2601
- }
2602
- .FAQSection_module_answerClosed {
2603
- max-height: 0;
2604
- opacity: 0;
2605
- }
2606
- .FAQSection_module_answerText {
2607
- font-size: 14px;
2608
- color: var(--fg-secondary);
2609
- line-height: 1.625;
2610
- padding-right: 2rem;
2611
- }
2612
-
2613
- /* src/organisms/ComparisonTable.module.scss */
2614
- .ComparisonTable_module_root {
2615
- padding: 2.5rem 0;
2616
- }
2617
- @media (min-width: 768px) {
2618
- .ComparisonTable_module_root {
2619
- padding: 3.5rem 0;
2620
- }
2621
- }
2622
- .ComparisonTable_module_scrollWrap {
2623
- overflow-x: auto;
2624
- margin: 0 -1rem;
2625
- padding: 0 1rem;
2626
- }
2627
- .ComparisonTable_module_table {
2628
- width: 100%;
2629
- border-collapse: collapse;
2630
- min-width: 500px;
2631
- }
2632
- .ComparisonTable_module_headerCell {
2633
- text-align: left;
2634
- padding: 1rem;
2635
- font-size: 13px;
2636
- font-weight: 500;
2637
- color: var(--fg-muted);
2638
- letter-spacing: -0.25px;
2639
- width: 40%;
2640
- }
2641
- .ComparisonTable_module_columnHeader {
2642
- padding: 1rem;
2643
- text-align: center;
2644
- font-size: 0.875rem;
2645
- font-weight: 600;
2646
- color: var(--fg);
2647
- }
2648
- .ComparisonTable_module_columnHeaderHighlighted {
2649
- color: var(--brand-primary);
2650
- background: color-mix(in srgb, var(--brand-primary) 5%, transparent);
2651
- border-radius: var(--radius-lg) var(--radius-lg) 0 0;
2652
- }
2653
- .ComparisonTable_module_bodyRow {
2654
- border-top: 1px solid var(--border-color);
2655
- }
2656
- .ComparisonTable_module_featureCell {
2657
- padding: 0.875rem 1rem;
2658
- font-size: 14px;
2659
- color: var(--fg-secondary);
2660
- }
2661
- .ComparisonTable_module_valueCell {
2662
- padding: 0.875rem 1rem;
2663
- text-align: center;
2664
- }
2665
- .ComparisonTable_module_valueCellHighlighted {
2666
- background: color-mix(in srgb, var(--brand-primary) 5%, transparent);
2667
- }
2668
- .ComparisonTable_module_valueCellHighlightedLast {
2669
- border-radius: 0 0 var(--radius-lg) var(--radius-lg);
2670
- }
2671
- .ComparisonTable_module_iconSuccess {
2672
- display: inline-flex;
2673
- color: var(--color-success);
2674
- }
2675
- .ComparisonTable_module_iconMuted {
2676
- display: inline-flex;
2677
- color: color-mix(in srgb, var(--fg-muted) 40%, transparent);
2678
- }
2679
- .ComparisonTable_module_textValue {
2680
- font-size: 13px;
2681
- font-weight: 500;
2682
- color: var(--fg);
2683
- }
2684
-
2685
- /* src/organisms/PromoBento.module.scss */
2686
- .PromoBento_module_root {
2687
- padding: 4rem 0;
2688
- }
2689
- @media (min-width: 768px) {
2690
- .PromoBento_module_root {
2691
- padding: 6rem 0;
2692
- }
2693
- }
2694
- .PromoBento_module_header {
2695
- margin-bottom: 2.5rem;
2696
- max-width: 36rem;
2697
- }
2698
- @media (min-width: 768px) {
2699
- .PromoBento_module_header {
2700
- margin-bottom: 3.5rem;
2701
- }
2702
- }
2703
- .PromoBento_module_heading {
2704
- font-size: clamp(1.75rem, 4vw, 2.75rem);
2705
- font-weight: 700;
2706
- line-height: 1.1;
2707
- letter-spacing: -0.03em;
2708
- color: var(--fg);
2709
- text-wrap: balance;
2710
- }
2711
- .PromoBento_module_subtitle {
2712
- margin-top: 0.75rem;
2713
- font-size: 1rem;
2714
- color: var(--fg-secondary);
2715
- line-height: 1.625;
2716
- }
2717
- .PromoBento_module_grid {
2718
- display: grid;
2719
- grid-template-columns: 1fr;
2720
- gap: 1.5rem;
2721
- }
2722
- @media (min-width: 768px) {
2723
- .PromoBento_module_grid {
2724
- grid-template-columns: repeat(2, 1fr);
2725
- gap: 2.25rem;
2726
- }
2727
- }
2728
- .PromoBento_module_card {
2729
- position: relative;
2730
- display: flex;
2731
- flex-direction: column;
2732
- border-radius: clamp(24px, 3vw, 48px);
2733
- background: var(--bg-secondary);
2734
- overflow: hidden;
2735
- transition: box-shadow var(--transition-slow);
2736
- }
2737
- .PromoBento_module_card:hover {
2738
- box-shadow: var(--shadow-lg);
2739
- }
2740
- .PromoBento_module_cardMedia {
2741
- position: relative;
2742
- flex: 1;
2743
- min-height: 240px;
2744
- overflow: hidden;
2745
- }
2746
- @media (min-width: 768px) {
2747
- .PromoBento_module_cardMedia {
2748
- min-height: 320px;
2749
- }
2750
- }
2751
- .PromoBento_module_cardMediaInner {
2752
- position: absolute;
2753
- inset: 0;
2754
- display: flex;
2755
- align-items: center;
2756
- justify-content: center;
2757
- padding: 1.5rem;
2758
- }
2759
- .PromoBento_module_cardFade {
2760
- position: absolute;
2761
- bottom: 0;
2762
- left: 0;
2763
- right: 0;
2764
- height: 140px;
2765
- pointer-events: none;
2766
- background:
2767
- linear-gradient(
2768
- to top,
2769
- var(--bg-secondary) 0%,
2770
- transparent 100%);
2771
- }
2772
- .PromoBento_module_cardContent {
2773
- position: relative;
2774
- display: flex;
2775
- flex-direction: column;
2776
- gap: 1rem;
2777
- padding: 1.5rem;
2778
- padding-top: 0;
2779
- }
2780
- @media (min-width: 768px) {
2781
- .PromoBento_module_cardContent {
2782
- padding: 2rem;
2783
- padding-top: 0;
2784
- }
2785
- }
2786
- .PromoBento_module_pill {
2787
- display: flex;
2788
- }
2789
- .PromoBento_module_pillInner {
2790
- display: inline-flex;
2791
- align-items: center;
2792
- gap: 0.5rem;
2793
- padding: 0.5rem 1rem;
2794
- border-radius: 9999px;
2795
- background: var(--bg);
2796
- border: 1px solid var(--border-color);
2797
- font-size: 0.875rem;
2798
- font-weight: 600;
2799
- color: var(--fg);
2800
- }
2801
- .PromoBento_module_pillIcon {
2802
- width: 1.25rem;
2803
- height: 1.25rem;
2804
- display: flex;
2805
- align-items: center;
2806
- justify-content: center;
2807
- }
2808
- .PromoBento_module_cardTitle {
2809
- font-size: 1.25rem;
2810
- line-height: 1.2;
2811
- letter-spacing: -0.02em;
2812
- color: var(--fg);
2813
- }
2814
- @media (min-width: 768px) {
2815
- .PromoBento_module_cardTitle {
2816
- font-size: 28px;
2817
- }
2818
- }
2819
- .PromoBento_module_cardDesc {
2820
- font-size: 0.875rem;
2821
- line-height: 1.625;
2822
- color: var(--fg-secondary);
2823
- max-width: 85%;
2824
- }
2825
- @media (min-width: 768px) {
2826
- .PromoBento_module_cardDesc {
2827
- font-size: 1rem;
2828
- }
2829
- }
2830
- .PromoBento_module_cardCta {
2831
- margin-top: 0.25rem;
2832
- }
2833
-
2834
- /* src/organisms/PromoShowcase.module.scss */
2835
- .PromoShowcase_module_root {
2836
- padding-block: 4rem;
2837
- }
2838
- @media (min-width: 768px) {
2839
- .PromoShowcase_module_root {
2840
- padding-block: 6rem;
2841
- }
2842
- }
2843
- .PromoShowcase_module_heading {
2844
- margin-bottom: 2.5rem;
2845
- max-width: 36rem;
2846
- }
2847
- @media (min-width: 768px) {
2848
- .PromoShowcase_module_heading {
2849
- margin-bottom: 3.5rem;
2850
- }
2851
- }
2852
- .PromoShowcase_module_headingText {
2853
- font-size: clamp(1.75rem, 4vw, 2.75rem);
2854
- font-weight: 700;
2855
- line-height: 1.1;
2856
- letter-spacing: -0.03em;
2857
- color: var(--fg);
2858
- text-wrap: balance;
2859
- }
2860
- .PromoShowcase_module_body {
2861
- display: flex;
2862
- flex-direction: column;
2863
- gap: 1.5rem;
2864
- }
2865
- @media (min-width: 768px) {
2866
- .PromoShowcase_module_body {
2867
- gap: 2rem;
2868
- }
2869
- }
2870
- .PromoShowcase_module_stepper {
2871
- display: flex;
2872
- gap: 0.25rem;
2873
- padding: 0.25rem;
2874
- border-radius: 9999px;
2875
- background: var(--bg-secondary);
2876
- border: 1px solid var(--border-color);
2877
- width: fit-content;
2878
- }
2879
- .PromoShowcase_module_stepButton {
2880
- padding: 0.625rem 1.25rem;
2881
- border-radius: 9999px;
2882
- font-size: 0.875rem;
2883
- font-weight: 500;
2884
- transition: all var(--transition-base);
2885
- cursor: pointer;
2886
- border: none;
2887
- background: none;
2888
- color: var(--fg-secondary);
2889
- }
2890
- .PromoShowcase_module_stepButton:hover {
2891
- color: var(--fg);
2892
- background: var(--bg-tertiary);
2893
- }
2894
- .PromoShowcase_module_stepButtonActive {
2895
- background: var(--fg);
2896
- color: var(--bg);
2897
- box-shadow: var(--shadow-sm);
2898
- }
2899
- .PromoShowcase_module_stepButtonActive:hover {
2900
- background: var(--fg);
2901
- color: var(--bg);
2902
- }
2903
- .PromoShowcase_module_contentArea {
2904
- position: relative;
2905
- border-radius: clamp(16px, 2vw, 32px);
2906
- border: 1px solid var(--border-color);
2907
- background: var(--bg-secondary);
2908
- overflow: hidden;
2909
- min-height: 300px;
2910
- }
2911
- @media (min-width: 768px) {
2912
- .PromoShowcase_module_contentArea {
2913
- min-height: 480px;
2914
- }
2915
- }
2916
- .PromoShowcase_module_panel {
2917
- position: absolute;
2918
- inset: 0;
2919
- transition: opacity 300ms ease-out;
2920
- opacity: 0;
2921
- z-index: 0;
2922
- pointer-events: none;
2923
- }
2924
- .PromoShowcase_module_panelActive {
2925
- opacity: 1;
2926
- z-index: 10;
2927
- pointer-events: auto;
2928
- }
2929
- .PromoShowcase_module_panelInner {
2930
- width: 100%;
2931
- height: 100%;
2932
- display: flex;
2933
- align-items: center;
2934
- justify-content: center;
2935
- padding: 1.5rem;
2936
- }
2937
- @media (min-width: 768px) {
2938
- .PromoShowcase_module_panelInner {
2939
- padding: 2.5rem;
2940
- }
2941
- }
2942
-
2943
- /* src/organisms/PromoSplit.module.scss */
2944
- .PromoSplit_module_root {
2945
- padding: 4rem 0;
2946
- }
2947
- @media (min-width: 768px) {
2948
- .PromoSplit_module_root {
2949
- padding: 6rem 0;
2950
- }
2951
- }
2952
- .PromoSplit_module_grid {
2953
- display: grid;
2954
- grid-template-columns: 1fr;
2955
- gap: 2.5rem;
2956
- align-items: center;
2957
- }
2958
- @media (min-width: 768px) {
2959
- .PromoSplit_module_grid {
2960
- gap: 4rem;
2961
- }
2962
- }
2963
- @media (min-width: 1024px) {
2964
- .PromoSplit_module_grid {
2965
- grid-template-columns: repeat(2, 1fr);
2966
- }
2967
- }
2968
- .PromoSplit_module_gridReversed {
2969
- }
2970
- @media (min-width: 1024px) {
2971
- .PromoSplit_module_gridReversed {
2972
- direction: rtl;
2973
- }
2974
- }
2975
- .PromoSplit_module_textColumn {
2976
- display: flex;
2977
- flex-direction: column;
2978
- gap: 1.5rem;
2979
- }
2980
- @media (min-width: 1024px) {
2981
- .PromoSplit_module_textColumnLtr {
2982
- direction: ltr;
2983
- }
2984
- }
2985
- .PromoSplit_module_heading {
2986
- font-size: clamp(1.75rem, 4vw, 2.75rem);
2987
- font-weight: 700;
2988
- line-height: 1.1;
2989
- letter-spacing: -0.03em;
2990
- color: var(--fg);
2991
- text-wrap: balance;
2992
- }
2993
- .PromoSplit_module_description {
2994
- font-size: 1rem;
2995
- line-height: 1.625;
2996
- color: var(--fg-secondary);
2997
- }
2998
- @media (min-width: 768px) {
2999
- .PromoSplit_module_description {
3000
- font-size: 1.125rem;
3001
- }
3002
- }
3003
- .PromoSplit_module_features {
3004
- display: flex;
3005
- flex-direction: column;
3006
- gap: 1.25rem;
3007
- margin-top: 0.5rem;
3008
- }
3009
- .PromoSplit_module_feature {
3010
- display: flex;
3011
- flex-direction: column;
3012
- gap: 0.375rem;
3013
- }
3014
- .PromoSplit_module_featureTitle {
3015
- font-size: 1rem;
3016
- font-weight: 600;
3017
- color: var(--fg);
3018
- }
3019
- .PromoSplit_module_featureDesc {
3020
- font-size: 0.875rem;
3021
- color: var(--fg-secondary);
3022
- line-height: 1.625;
3023
- }
3024
- .PromoSplit_module_mediaColumn {
3025
- position: relative;
3026
- }
3027
- @media (min-width: 1024px) {
3028
- .PromoSplit_module_mediaColumnLtr {
3029
- direction: ltr;
3030
- }
3031
- }
3032
- .PromoSplit_module_mediaBox {
3033
- position: relative;
3034
- border-radius: clamp(16px, 2vw, 32px);
3035
- background: var(--bg-secondary);
3036
- border: 1px solid var(--border-color);
3037
- overflow: hidden;
3038
- min-height: 280px;
3039
- }
3040
- @media (min-width: 768px) {
3041
- .PromoSplit_module_mediaBox {
3042
- min-height: 380px;
3043
- }
3044
- }
3045
- .PromoSplit_module_mediaContent {
3046
- position: absolute;
3047
- inset: 0;
3048
- display: flex;
3049
- align-items: center;
3050
- justify-content: center;
3051
- padding: 1.5rem;
3052
- }
3053
- .PromoSplit_module_mediaPlaceholder {
3054
- position: absolute;
3055
- inset: 0;
3056
- display: flex;
3057
- align-items: center;
3058
- justify-content: center;
3059
- }
3060
- .PromoSplit_module_placeholderCircle {
3061
- width: 5rem;
3062
- height: 5rem;
3063
- border-radius: 9999px;
3064
- background: var(--bg-tertiary);
3065
- display: flex;
3066
- align-items: center;
3067
- justify-content: center;
3068
- }
3069
-
3070
- /* src/organisms/PromoTrustGrid.module.scss */
3071
- .PromoTrustGrid_module_root {
3072
- padding-block: 4rem;
3073
- }
3074
- @media (min-width: 768px) {
3075
- .PromoTrustGrid_module_root {
3076
- padding-block: 6rem;
3077
- }
3078
- }
3079
- .PromoTrustGrid_module_heading {
3080
- margin-bottom: 2.5rem;
3081
- }
3082
- @media (min-width: 768px) {
3083
- .PromoTrustGrid_module_heading {
3084
- margin-bottom: 3.5rem;
3085
- }
3086
- }
3087
- .PromoTrustGrid_module_headingText {
3088
- font-size: clamp(1.75rem, 4vw, 2.75rem);
3089
- font-weight: 700;
3090
- line-height: 1.1;
3091
- letter-spacing: -0.03em;
3092
- color: var(--fg);
3093
- text-wrap: balance;
3094
- }
3095
- .PromoTrustGrid_module_grid {
3096
- display: grid;
3097
- grid-template-columns: 1fr;
3098
- gap: 1.5rem;
3099
- margin-bottom: 2.5rem;
3100
- }
3101
- @media (min-width: 768px) {
3102
- .PromoTrustGrid_module_grid {
3103
- grid-template-columns: repeat(3, 1fr);
3104
- margin-bottom: 3.5rem;
3105
- }
3106
- }
3107
- .PromoTrustGrid_module_featureCard {
3108
- position: relative;
3109
- display: flex;
3110
- flex-direction: column;
3111
- gap: 0.75rem;
3112
- padding: 1.5rem;
3113
- border-radius: var(--radius-xl);
3114
- background: var(--bg);
3115
- border: 1px solid var(--border-color);
3116
- transition: all var(--transition-base);
3117
- }
3118
- @media (min-width: 768px) {
3119
- .PromoTrustGrid_module_featureCard {
3120
- padding: 2rem;
3121
- }
3122
- }
3123
- .PromoTrustGrid_module_featureCard:hover {
3124
- box-shadow: var(--shadow-md);
3125
- transform: translateY(-2px);
3126
- }
3127
- .PromoTrustGrid_module_featureIcon {
3128
- width: 2.5rem;
3129
- height: 2.5rem;
3130
- border-radius: var(--radius-lg);
3131
- background: color-mix(in srgb, var(--fg) 5%, transparent);
3132
- display: flex;
3133
- align-items: center;
3134
- justify-content: center;
3135
- color: var(--fg);
3136
- margin-bottom: 0.25rem;
3137
- }
3138
- .PromoTrustGrid_module_featureTitle {
3139
- font-size: 1rem;
3140
- font-weight: 600;
3141
- color: var(--fg);
3142
- line-height: 1.4;
3143
- }
3144
- .PromoTrustGrid_module_featureDescription {
3145
- font-size: 0.875rem;
3146
- color: var(--fg-secondary);
3147
- line-height: 1.625;
3148
- }
3149
- .PromoTrustGrid_module_media {
3150
- position: relative;
3151
- border-radius: clamp(16px, 2vw, 32px);
3152
- background: var(--bg-secondary);
3153
- border: 1px solid var(--border-color);
3154
- overflow: hidden;
3155
- min-height: 280px;
3156
- }
3157
- @media (min-width: 768px) {
3158
- .PromoTrustGrid_module_media {
3159
- min-height: 420px;
3160
- }
3161
- }
3162
- .PromoTrustGrid_module_mediaInner {
3163
- position: absolute;
3164
- inset: 0;
3165
- display: flex;
3166
- align-items: center;
3167
- justify-content: center;
3168
- padding: 1.5rem;
3169
- }
3170
-
3171
- /* src/organisms/PromoDevicesCTA.module.scss */
3172
- .PromoDevicesCTA_module_root {
3173
- padding-block: 4rem;
3174
- }
3175
- @media (min-width: 768px) {
3176
- .PromoDevicesCTA_module_root {
3177
- padding-block: 6rem;
3178
- }
3179
- }
3180
- .PromoDevicesCTA_module_textBlock {
3181
- max-width: 42rem;
3182
- margin-inline: auto;
3183
- text-align: center;
3184
- margin-bottom: 2rem;
3185
- }
3186
- @media (min-width: 768px) {
3187
- .PromoDevicesCTA_module_textBlock {
3188
- margin-bottom: 2.5rem;
3189
- }
3190
- }
3191
- .PromoDevicesCTA_module_heading {
3192
- font-size: clamp(1.75rem, 4vw, 2.75rem);
3193
- font-weight: 700;
3194
- line-height: 1.1;
3195
- letter-spacing: -0.03em;
3196
- color: var(--fg);
3197
- text-wrap: balance;
3198
- }
3199
- .PromoDevicesCTA_module_description {
3200
- margin-top: 1rem;
3201
- font-size: 1rem;
3202
- line-height: 1.625;
3203
- color: var(--fg-secondary);
3204
- }
3205
- @media (min-width: 768px) {
3206
- .PromoDevicesCTA_module_description {
3207
- font-size: 1.125rem;
3208
- }
3209
- }
3210
- .PromoDevicesCTA_module_ctaWrap {
3211
- margin-top: 1.5rem;
3212
- display: flex;
3213
- justify-content: center;
3214
- }
3215
- .PromoDevicesCTA_module_devices {
3216
- position: relative;
3217
- display: flex;
3218
- align-items: flex-end;
3219
- justify-content: center;
3220
- gap: 1.5rem;
3221
- padding-inline: 1rem;
3222
- max-width: 56rem;
3223
- margin-inline: auto;
3224
- }
3225
- @media (min-width: 768px) {
3226
- .PromoDevicesCTA_module_devices {
3227
- gap: 2.5rem;
3228
- padding-inline: 0;
3229
- }
3230
- }
3231
- .PromoDevicesCTA_module_laptop {
3232
- display: none;
3233
- position: relative;
3234
- width: 38%;
3235
- max-width: 380px;
3236
- }
3237
- @media (min-width: 768px) {
3238
- .PromoDevicesCTA_module_laptop {
3239
- display: block;
3240
- }
3241
- }
3242
- .PromoDevicesCTA_module_laptopScreen {
3243
- aspect-ratio: 16/10;
3244
- border-top-left-radius: var(--radius-lg);
3245
- border-top-right-radius: var(--radius-lg);
3246
- border: 1px solid var(--border-color);
3247
- border-bottom: none;
3248
- background: var(--bg-secondary);
3249
- overflow: hidden;
3250
- box-shadow: var(--shadow-md);
3251
- }
3252
- .PromoDevicesCTA_module_laptopScreenInner {
3253
- position: absolute;
3254
- inset: 0.75rem;
3255
- border-radius: var(--radius-md);
3256
- background: var(--bg-tertiary);
3257
- }
3258
- .PromoDevicesCTA_module_laptopHinge {
3259
- height: 0.625rem;
3260
- background: var(--bg-tertiary);
3261
- border: 1px solid var(--border-color);
3262
- border-radius: 0 0 2px 2px;
3263
- }
3264
- .PromoDevicesCTA_module_laptopBase {
3265
- height: 0.25rem;
3266
- background: var(--bg-tertiary);
3267
- border-left: 1px solid var(--border-color);
3268
- border-right: 1px solid var(--border-color);
3269
- border-bottom: 1px solid var(--border-color);
3270
- border-radius: 0 0 var(--radius-sm) var(--radius-sm);
3271
- margin-inline: -4%;
3272
- }
3273
- .PromoDevicesCTA_module_tablet {
3274
- position: relative;
3275
- width: 40%;
3276
- max-width: 280px;
3277
- }
3278
- @media (min-width: 768px) {
3279
- .PromoDevicesCTA_module_tablet {
3280
- width: 28%;
3281
- }
3282
- }
3283
- .PromoDevicesCTA_module_tabletShell {
3284
- aspect-ratio: 3/4;
3285
- border-radius: var(--radius-xl);
3286
- border: 2px solid var(--border-color);
3287
- background: var(--bg-secondary);
3288
- overflow: hidden;
3289
- box-shadow: var(--shadow-lg);
3290
- }
3291
- .PromoDevicesCTA_module_tabletScreen {
3292
- position: absolute;
3293
- inset: 0.625rem;
3294
- border-radius: var(--radius-lg);
3295
- background: var(--bg-tertiary);
3296
- }
3297
- .PromoDevicesCTA_module_phone {
3298
- position: relative;
3299
- width: 24%;
3300
- max-width: 140px;
3301
- }
3302
- @media (min-width: 768px) {
3303
- .PromoDevicesCTA_module_phone {
3304
- width: 14%;
3305
- }
3306
- }
3307
- .PromoDevicesCTA_module_phoneShell {
3308
- aspect-ratio: 9/19;
3309
- border-radius: clamp(12px, 2vw, 24px);
3310
- border: 2px solid var(--border-color);
3311
- background: var(--bg-secondary);
3312
- overflow: hidden;
3313
- box-shadow: var(--shadow-lg);
3314
- }
3315
- .PromoDevicesCTA_module_phoneNotch {
3316
- position: absolute;
3317
- top: 0.375rem;
3318
- left: 50%;
3319
- transform: translateX(-50%);
3320
- width: 40%;
3321
- height: 3%;
3322
- border-radius: 9999px;
3323
- background: var(--border-color);
3324
- }
3325
- .PromoDevicesCTA_module_phoneScreen {
3326
- position: absolute;
3327
- inset: 0.375rem;
3328
- top: 6%;
3329
- border-radius: clamp(8px, 1.5vw, 16px);
3330
- background: var(--bg-tertiary);
3331
- }
3332
-
3333
- /* src/organisms/PromoTestimonials.module.scss */
3334
- .PromoTestimonials_module_root {
3335
- padding: 4rem 0;
3336
- }
3337
- @media (min-width: 768px) {
3338
- .PromoTestimonials_module_root {
3339
- padding: 6rem 0;
3340
- }
3341
- }
3342
- .PromoTestimonials_module_wrapper {
3343
- position: relative;
3344
- border-radius: clamp(20px, 3vw, 40px);
3345
- border: 1px solid var(--border-color);
3346
- background: var(--bg);
3347
- overflow: hidden;
3348
- }
3349
- .PromoTestimonials_module_avatarSection {
3350
- display: flex;
3351
- justify-content: center;
3352
- padding: 2.5rem 0 0.5rem;
3353
- }
3354
- @media (min-width: 768px) {
3355
- .PromoTestimonials_module_avatarSection {
3356
- padding-top: 3.5rem;
3357
- }
3358
- }
3359
- .PromoTestimonials_module_avatarStack {
3360
- display: flex;
3361
- }
3362
- .PromoTestimonials_module_avatarStack > * + * {
3363
- margin-left: -0.75rem;
3364
- }
3365
- .PromoTestimonials_module_avatarRing {
3366
- position: relative;
3367
- border-radius: 9999px;
3368
- box-shadow: 0 0 0 3px var(--bg);
3369
- }
3370
- .PromoTestimonials_module_overflowBadge {
3371
- position: relative;
3372
- border-radius: 9999px;
3373
- box-shadow: 0 0 0 3px var(--bg);
3374
- z-index: 0;
3375
- }
3376
- .PromoTestimonials_module_overflowCircle {
3377
- width: 2.5rem;
3378
- height: 2.5rem;
3379
- border-radius: 9999px;
3380
- background: var(--bg-tertiary);
3381
- display: flex;
3382
- align-items: center;
3383
- justify-content: center;
3384
- font-size: 0.75rem;
3385
- font-weight: 600;
3386
- color: var(--fg-secondary);
3387
- }
3388
- .PromoTestimonials_module_headingSection {
3389
- text-align: center;
3390
- padding: 0 1.5rem 2rem;
3391
- }
3392
- @media (min-width: 768px) {
3393
- .PromoTestimonials_module_headingSection {
3394
- padding-bottom: 2.5rem;
3395
- }
3396
- }
3397
- .PromoTestimonials_module_heading {
3398
- font-size: clamp(1.75rem, 4vw, 2.75rem);
3399
- font-weight: 700;
3400
- line-height: 1.1;
3401
- letter-spacing: -0.03em;
3402
- color: var(--fg);
3403
- text-wrap: balance;
3404
- }
3405
- .PromoTestimonials_module_subtitle {
3406
- margin-top: 0.75rem;
3407
- font-size: 1rem;
3408
- color: var(--fg-secondary);
3409
- line-height: 1.625;
3410
- max-width: 32rem;
3411
- margin-left: auto;
3412
- margin-right: auto;
3413
- }
3414
- .PromoTestimonials_module_cardsSection {
3415
- padding: 0 1.5rem 2rem;
3416
- }
3417
- @media (min-width: 768px) {
3418
- .PromoTestimonials_module_cardsSection {
3419
- padding: 0 2.5rem 3rem;
3420
- }
3421
- }
3422
- .PromoTestimonials_module_cardsGrid {
3423
- display: grid;
3424
- grid-template-columns: 1fr;
3425
- gap: 1rem;
3426
- }
3427
- @media (min-width: 768px) {
3428
- .PromoTestimonials_module_cardsGrid {
3429
- grid-template-columns: repeat(2, 1fr);
3430
- gap: 1.25rem;
3431
- }
3432
- }
3433
- @media (min-width: 1024px) {
3434
- .PromoTestimonials_module_cardsGrid {
3435
- grid-template-columns: repeat(3, 1fr);
3436
- }
3437
- }
3438
- .PromoTestimonials_module_card {
3439
- display: flex;
3440
- flex-direction: column;
3441
- gap: 1rem;
3442
- padding: 1.25rem;
3443
- border-radius: var(--radius-xl);
3444
- border: 1px solid var(--border-color);
3445
- background: var(--bg);
3446
- transition: box-shadow var(--transition-base);
3447
- }
3448
- @media (min-width: 768px) {
3449
- .PromoTestimonials_module_card {
3450
- padding: 1.5rem;
3451
- }
3452
- }
3453
- .PromoTestimonials_module_card:hover {
3454
- box-shadow: var(--shadow-md);
3455
- }
3456
- .PromoTestimonials_module_quote {
3457
- font-size: 0.875rem;
3458
- color: var(--fg-secondary);
3459
- line-height: 1.625;
3460
- flex: 1;
3461
- }
3462
- .PromoTestimonials_module_author {
3463
- display: flex;
3464
- align-items: center;
3465
- gap: 0.75rem;
3466
- padding-top: 0.25rem;
3467
- }
3468
- .PromoTestimonials_module_authorName {
3469
- font-size: 0.875rem;
3470
- font-weight: 500;
3471
- color: var(--fg);
3472
- }
3473
- .PromoTestimonials_module_authorRole {
3474
- font-size: 0.75rem;
3475
- color: var(--fg-muted);
3476
- }
3477
- .PromoTestimonials_module_mediaSection {
3478
- padding: 0 1.5rem 2rem;
3479
- }
3480
- @media (min-width: 768px) {
3481
- .PromoTestimonials_module_mediaSection {
3482
- padding: 0 2.5rem 3rem;
3483
- }
3484
- }
3485
- .PromoTestimonials_module_mediaBox {
3486
- border-radius: var(--radius-xl);
3487
- background: var(--bg-secondary);
3488
- overflow: hidden;
3489
- }
3490
-
3491
- /* src/organisms/PromoHero.module.scss */
3492
- .PromoHero_module_root {
3493
- position: relative;
3494
- overflow: hidden;
3495
- border-radius: clamp(20px, 3vw, 40px);
3496
- min-height: 480px;
3497
- display: flex;
3498
- align-items: center;
3499
- }
3500
- @media (min-width: 768px) {
3501
- .PromoHero_module_root {
3502
- min-height: 600px;
3503
- }
3504
- }
3505
- .PromoHero_module_dark {
3506
- background: var(--neutral-900);
3507
- color: white;
3508
- }
3509
- .PromoHero_module_light {
3510
- background: var(--bg);
3511
- color: var(--fg);
3512
- }
3513
- .PromoHero_module_gradient {
3514
- background:
3515
- linear-gradient(
3516
- to bottom right,
3517
- var(--neutral-900),
3518
- var(--neutral-800),
3519
- var(--neutral-700));
3520
- color: white;
3521
- }
3522
- .PromoHero_module_glowLayer {
3523
- position: absolute;
3524
- inset: 0;
3525
- pointer-events: none;
3526
- }
3527
- .PromoHero_module_glowTop {
3528
- position: absolute;
3529
- top: -20%;
3530
- right: -10%;
3531
- width: 600px;
3532
- height: 600px;
3533
- border-radius: 9999px;
3534
- background: rgba(255, 255, 255, 0.03);
3535
- filter: blur(100px);
3536
- }
3537
- .PromoHero_module_glowBottom {
3538
- position: absolute;
3539
- bottom: -30%;
3540
- left: -5%;
3541
- width: 400px;
3542
- height: 400px;
3543
- border-radius: 9999px;
3544
- background: rgba(255, 255, 255, 0.02);
3545
- filter: blur(80px);
3546
- }
3547
- .PromoHero_module_inner {
3548
- position: relative;
3549
- z-index: 10;
3550
- display: grid;
3551
- grid-template-columns: 1fr;
3552
- gap: 2.5rem;
3553
- width: 100%;
3554
- padding: 2rem;
3555
- align-items: center;
3556
- }
3557
- @media (min-width: 768px) {
3558
- .PromoHero_module_inner {
3559
- gap: 4rem;
3560
- padding: 3rem;
3561
- }
3562
- }
3563
- @media (min-width: 1024px) {
3564
- .PromoHero_module_inner {
3565
- grid-template-columns: repeat(2, 1fr);
3566
- padding: 4rem;
3567
- }
3568
- }
3569
- .PromoHero_module_textColumn {
3570
- display: flex;
3571
- flex-direction: column;
3572
- gap: 1.25rem;
3573
- }
3574
- @media (min-width: 768px) {
3575
- .PromoHero_module_textColumn {
3576
- gap: 1.5rem;
3577
- }
3578
- }
3579
- .PromoHero_module_title {
3580
- font-size: clamp(2.25rem, 5.5vw, 5rem);
3581
- font-weight: 700;
3582
- line-height: 0.95;
3583
- letter-spacing: -0.04em;
3584
- text-wrap: balance;
3585
- }
3586
- .PromoHero_module_subtitle {
3587
- font-size: 1rem;
3588
- line-height: 1.625;
3589
- max-width: 32rem;
3590
- }
3591
- @media (min-width: 768px) {
3592
- .PromoHero_module_subtitle {
3593
- font-size: 1.125rem;
3594
- }
3595
- }
3596
- .PromoHero_module_subtitleDark {
3597
- color: rgba(255, 255, 255, 0.7);
3598
- }
3599
- .PromoHero_module_subtitleLight {
3600
- color: var(--fg-secondary);
3601
- }
3602
- .PromoHero_module_actions {
3603
- display: flex;
3604
- flex-wrap: wrap;
3605
- gap: 0.75rem;
3606
- margin-top: 0.5rem;
3607
- }
3608
- .PromoHero_module_ctaDark {
3609
- border-color: rgba(255, 255, 255, 0.2);
3610
- color: white;
3611
- }
3612
- .PromoHero_module_ctaDark:hover {
3613
- background: rgba(255, 255, 255, 0.1);
3614
- }
3615
- .PromoHero_module_ghostDark {
3616
- color: rgba(255, 255, 255, 0.7);
3617
- }
3618
- .PromoHero_module_ghostDark:hover {
3619
- color: white;
3620
- background: rgba(255, 255, 255, 0.05);
3621
- }
3622
- .PromoHero_module_mediaColumn {
3623
- position: relative;
3624
- display: flex;
3625
- align-items: center;
3626
- justify-content: center;
3627
- }
3628
-
3629
- /* src/organisms/PromoPricing.module.scss */
3630
- .PromoPricing_module_root {
3631
- padding: 4rem 1.5rem;
3632
- border-radius: clamp(20px, 3vw, 40px);
3633
- }
3634
- @media (min-width: 768px) {
3635
- .PromoPricing_module_root {
3636
- padding: 6rem 3rem;
3637
- }
3638
- }
3639
- .PromoPricing_module_dark {
3640
- background: var(--neutral-900);
3641
- color: white;
3642
- }
3643
- .PromoPricing_module_light {
3644
- background: var(--bg);
3645
- }
3646
- .PromoPricing_module_headingSection {
3647
- text-align: center;
3648
- margin-bottom: 2.5rem;
3649
- max-width: 42rem;
3650
- margin-left: auto;
3651
- margin-right: auto;
3652
- }
3653
- @media (min-width: 768px) {
3654
- .PromoPricing_module_headingSection {
3655
- margin-bottom: 3.5rem;
3656
- }
3657
- }
3658
- .PromoPricing_module_heading {
3659
- font-size: clamp(2rem, 5vw, 4.75rem);
3660
- font-weight: 700;
3661
- line-height: 0.95;
3662
- letter-spacing: -0.04em;
3663
- text-wrap: balance;
3664
- }
3665
- .PromoPricing_module_headingDark {
3666
- color: white;
3667
- }
3668
- .PromoPricing_module_headingLight {
3669
- color: var(--fg);
3670
- }
3671
- .PromoPricing_module_subtitle {
3672
- margin-top: 1rem;
3673
- font-size: 1rem;
3674
- line-height: 1.625;
3675
- }
3676
- @media (min-width: 768px) {
3677
- .PromoPricing_module_subtitle {
3678
- font-size: 1.125rem;
3679
- }
3680
- }
3681
- .PromoPricing_module_subtitleDark {
3682
- color: rgba(255, 255, 255, 0.6);
3683
- }
3684
- .PromoPricing_module_subtitleLight {
3685
- color: var(--fg-secondary);
3686
- }
3687
- .PromoPricing_module_tiersGrid {
3688
- display: grid;
3689
- grid-template-columns: 1fr;
3690
- gap: 1.25rem;
3691
- max-width: 64rem;
3692
- margin: 0 auto;
3693
- }
3694
- @media (min-width: 768px) {
3695
- .PromoPricing_module_tiersGrid {
3696
- grid-template-columns: repeat(2, 1fr);
3697
- gap: 1.5rem;
3698
- }
3699
- }
3700
- @media (min-width: 1024px) {
3701
- .PromoPricing_module_tiersGrid {
3702
- grid-template-columns: repeat(3, 1fr);
3703
- }
3704
- }
3705
- .PromoPricing_module_tierCard {
3706
- position: relative;
3707
- display: flex;
3708
- flex-direction: column;
3709
- border-radius: var(--radius-xl);
3710
- padding: 1.5rem;
3711
- transition: all var(--transition-base);
3712
- }
3713
- @media (min-width: 768px) {
3714
- .PromoPricing_module_tierCard {
3715
- padding: 2rem;
3716
- }
3717
- }
3718
- .PromoPricing_module_tierDefault {
3719
- background: var(--bg);
3720
- border: 1px solid var(--border-color);
3721
- }
3722
- .PromoPricing_module_tierDefault:hover {
3723
- box-shadow: var(--shadow-md);
3724
- transform: translateY(-2px);
3725
- }
3726
- .PromoPricing_module_tierHighlighted {
3727
- background: var(--fg);
3728
- color: var(--bg);
3729
- box-shadow: var(--shadow-xl);
3730
- }
3731
- .PromoPricing_module_tierDark {
3732
- background: rgba(255, 255, 255, 0.06);
3733
- border: 1px solid rgba(255, 255, 255, 0.1);
3734
- color: white;
3735
- }
3736
- .PromoPricing_module_tierDark:hover {
3737
- background: rgba(255, 255, 255, 0.1);
3738
- }
3739
- .PromoPricing_module_tierDarkHighlighted {
3740
- background: white;
3741
- color: var(--neutral-900);
3742
- box-shadow: 0 0 60px rgba(255, 255, 255, 0.1);
3743
- }
3744
- .PromoPricing_module_tierName {
3745
- font-size: 0.875rem;
3746
- font-weight: 600;
3747
- text-transform: uppercase;
3748
- letter-spacing: 0.06em;
3749
- margin-bottom: 1rem;
3750
- }
3751
- .PromoPricing_module_tierNameMuted {
3752
- color: var(--fg-muted);
3753
- }
3754
- .PromoPricing_module_tierNameDark {
3755
- color: rgba(255, 255, 255, 0.5);
3756
- }
3757
- .PromoPricing_module_tierNameHighlightedLight {
3758
- color: color-mix(in srgb, var(--bg) 60%, transparent);
3759
- }
3760
- .PromoPricing_module_tierNameHighlightedDark {
3761
- color: var(--neutral-500);
3762
- }
3763
- .PromoPricing_module_price {
3764
- font-size: 2.25rem;
3765
- font-weight: 700;
3766
- letter-spacing: -0.03em;
3767
- margin-bottom: 0.5rem;
3768
- }
3769
- @media (min-width: 768px) {
3770
- .PromoPricing_module_price {
3771
- font-size: 3rem;
3772
- }
3773
- }
3774
- .PromoPricing_module_period {
3775
- font-size: 0.875rem;
3776
- margin-left: 0.25rem;
3777
- }
3778
- .PromoPricing_module_periodMuted {
3779
- color: var(--fg-muted);
3780
- }
3781
- .PromoPricing_module_periodDark {
3782
- color: rgba(255, 255, 255, 0.4);
3783
- }
3784
- .PromoPricing_module_periodHighlightedLight {
3785
- color: color-mix(in srgb, var(--bg) 50%, transparent);
3786
- }
3787
- .PromoPricing_module_periodHighlightedDark {
3788
- color: var(--neutral-500);
3789
- }
3790
- .PromoPricing_module_tierDesc {
3791
- font-size: 0.875rem;
3792
- margin-bottom: 1.5rem;
3793
- }
3794
- .PromoPricing_module_tierDescMuted {
3795
- color: var(--fg-secondary);
3796
- }
3797
- .PromoPricing_module_tierDescDark {
3798
- color: rgba(255, 255, 255, 0.5);
3799
- }
3800
- .PromoPricing_module_tierDescHighlightedLight {
3801
- color: color-mix(in srgb, var(--bg) 60%, transparent);
3802
- }
3803
- .PromoPricing_module_tierDescHighlightedDark {
3804
- color: var(--neutral-600);
3805
- }
3806
- .PromoPricing_module_featureList {
3807
- display: flex;
3808
- flex-direction: column;
3809
- gap: 0.625rem;
3810
- margin-bottom: 2rem;
3811
- flex: 1;
3812
- list-style: none;
3813
- padding: 0;
3814
- }
3815
- .PromoPricing_module_featureItem {
3816
- display: flex;
3817
- align-items: flex-start;
3818
- gap: 0.625rem;
3819
- font-size: 0.875rem;
3820
- }
3821
- .PromoPricing_module_checkIcon {
3822
- flex-shrink: 0;
3823
- margin-top: 2px;
3824
- }
3825
- .PromoPricing_module_checkDefault {
3826
- color: var(--color-success);
3827
- }
3828
- .PromoPricing_module_checkDark {
3829
- color: rgba(255, 255, 255, 0.4);
3830
- }
3831
- .PromoPricing_module_checkHighlightedLight {
3832
- color: var(--color-success-light);
3833
- }
3834
- .PromoPricing_module_checkHighlightedDark {
3835
- color: var(--color-success);
3836
- }
3837
- .PromoPricing_module_featureText {
3838
- }
3839
- .PromoPricing_module_featureTextMuted {
3840
- color: var(--fg-secondary);
3841
- }
3842
- .PromoPricing_module_featureTextDark {
3843
- color: rgba(255, 255, 255, 0.7);
3844
- }
3845
- .PromoPricing_module_featureTextHighlightedLight {
3846
- color: color-mix(in srgb, var(--bg) 80%, transparent);
3847
- }
3848
- .PromoPricing_module_featureTextHighlightedDark {
3849
- color: var(--neutral-700);
3850
- }
3851
- .PromoPricing_module_ctaWrap {
3852
- margin-top: auto;
3853
- }
3854
-
3855
- /* src/organisms/PromoActionCards.module.scss */
3856
- .PromoActionCards_module_root {
3857
- padding: 4rem 0;
3858
- }
3859
- @media (min-width: 768px) {
3860
- .PromoActionCards_module_root {
3861
- padding: 6rem 0;
3862
- }
3863
- }
3864
- .PromoActionCards_module_header {
3865
- margin-bottom: 2.5rem;
3866
- max-width: 36rem;
3867
- }
3868
- @media (min-width: 768px) {
3869
- .PromoActionCards_module_header {
3870
- margin-bottom: 3.5rem;
3871
- }
3872
- }
3873
- .PromoActionCards_module_heading {
3874
- font-size: clamp(1.25rem, 3vw, 1.5rem);
3875
- font-weight: 500;
3876
- line-height: 1.3;
3877
- letter-spacing: -0.01em;
3878
- color: var(--fg-secondary);
3879
- text-wrap: balance;
3880
- }
3881
- .PromoActionCards_module_subtitle {
3882
- margin-top: 0.5rem;
3883
- font-size: 0.875rem;
3884
- color: var(--fg-muted);
3885
- }
3886
- .PromoActionCards_module_grid {
3887
- display: grid;
3888
- grid-template-columns: 1fr;
3889
- gap: 1rem;
3890
- }
3891
- @media (min-width: 768px) {
3892
- .PromoActionCards_module_grid {
3893
- gap: 1.25rem;
3894
- }
3895
- }
3896
- .PromoActionCards_module_grid2 {
3897
- }
3898
- @media (min-width: 768px) {
3899
- .PromoActionCards_module_grid2 {
3900
- grid-template-columns: repeat(2, 1fr);
3901
- }
3902
- }
3903
- .PromoActionCards_module_grid3 {
3904
- }
3905
- @media (min-width: 768px) {
3906
- .PromoActionCards_module_grid3 {
3907
- grid-template-columns: repeat(2, 1fr);
3908
- }
3909
- }
3910
- @media (min-width: 1024px) {
3911
- .PromoActionCards_module_grid3 {
3912
- grid-template-columns: repeat(3, 1fr);
3913
- }
3914
- }
3915
- .PromoActionCards_module_card {
3916
- display: flex;
3917
- flex-direction: column;
3918
- gap: 1rem;
3919
- padding: 1.25rem;
3920
- border-radius: var(--radius-xl);
3921
- border: 1px solid var(--border-color);
3922
- background: var(--bg);
3923
- transition: box-shadow var(--transition-base), border-color var(--transition-base);
3924
- }
3925
- @media (min-width: 768px) {
3926
- .PromoActionCards_module_card {
3927
- padding: 1.5rem;
3928
- }
3929
- }
3930
- .PromoActionCards_module_card:hover {
3931
- box-shadow: var(--shadow-md);
3932
- border-color: var(--border-color-strong);
3933
- }
3934
- .PromoActionCards_module_cardContent {
3935
- display: flex;
3936
- flex-direction: column;
3937
- gap: 0.5rem;
3938
- flex: 1;
3939
- }
3940
- .PromoActionCards_module_cardTitle {
3941
- font-size: 15px;
3942
- font-weight: 600;
3943
- color: var(--fg);
3944
- line-height: 1.4;
3945
- }
3946
- .PromoActionCards_module_cardDesc {
3947
- font-size: 0.875rem;
3948
- color: var(--fg-secondary);
3949
- line-height: 1.625;
3950
- }
3951
- .PromoActionCards_module_cardFooter {
3952
- display: flex;
3953
- align-items: center;
3954
- justify-content: space-between;
3955
- padding-top: 0.25rem;
3956
- }
3957
- .PromoActionCards_module_iconGroup {
3958
- display: flex;
3959
- align-items: center;
3960
- gap: 0.5rem;
3961
- }
3962
- .PromoActionCards_module_iconCircle {
3963
- width: 1.75rem;
3964
- height: 1.75rem;
3965
- border-radius: 9999px;
3966
- background: var(--bg-secondary);
3967
- display: flex;
3968
- align-items: center;
3969
- justify-content: center;
3970
- color: var(--fg-secondary);
3971
- }
3972
- .PromoActionCards_module_ctaBtn {
3973
- display: inline-flex;
3974
- align-items: center;
3975
- gap: 0.375rem;
3976
- padding: 0.375rem 0.75rem;
3977
- border-radius: 9999px;
3978
- font-size: 0.75rem;
3979
- font-weight: 500;
3980
- background: var(--fg);
3981
- color: var(--bg);
3982
- border: none;
3983
- cursor: pointer;
3984
- transition: opacity 0.15s;
3985
- }
3986
- .PromoActionCards_module_ctaBtn:hover {
3987
- opacity: 0.9;
3988
- }
3989
-
3990
- /* src/templates/ArticleHero.module.scss */
3991
- .ArticleHero_module_root {
3992
- position: relative;
3993
- width: 100%;
3994
- border-radius: var(--radius-xl);
3995
- overflow: hidden;
3996
- min-height: 320px;
3997
- display: flex;
3998
- flex-direction: column;
3999
- justify-content: space-between;
4000
- padding: 1.25rem;
4001
- }
4002
- @media (min-width: 768px) {
4003
- .ArticleHero_module_root {
4004
- min-height: 480px;
4005
- padding: 2.5rem;
4006
- }
4007
- }
4008
- .ArticleHero_module_bgLayer {
4009
- position: absolute;
4010
- inset: 0;
4011
- pointer-events: none;
4012
- }
4013
- .ArticleHero_module_bgImage {
4014
- position: absolute;
4015
- inset: 0;
4016
- width: 100%;
4017
- height: 100%;
4018
- object-fit: cover;
4019
- }
4020
- .ArticleHero_module_overlay {
4021
- position: absolute;
4022
- inset: 0;
4023
- background: rgba(0, 0, 0, 0.4);
4024
- }
4025
- .ArticleHero_module_topBar {
4026
- position: relative;
4027
- z-index: 10;
4028
- display: flex;
4029
- align-items: center;
4030
- width: 100%;
4031
- }
4032
- .ArticleHero_module_logo {
4033
- flex-shrink: 0;
4034
- padding-right: 1rem;
4035
- }
4036
- @media (min-width: 768px) {
4037
- .ArticleHero_module_logo {
4038
- padding-right: 2.5rem;
4039
- }
4040
- }
4041
- .ArticleHero_module_divider {
4042
- flex: 1;
4043
- height: 1px;
4044
- background: rgba(255, 255, 255, 0.3);
4045
- }
4046
- .ArticleHero_module_nav {
4047
- flex-shrink: 0;
4048
- padding-left: 1rem;
4049
- }
4050
- @media (min-width: 768px) {
4051
- .ArticleHero_module_nav {
4052
- padding-left: 2.5rem;
4053
- }
4054
- }
4055
- .ArticleHero_module_bottom {
4056
- position: relative;
4057
- z-index: 10;
4058
- max-width: 500px;
4059
- }
4060
- .ArticleHero_module_category {
4061
- font-size: 1.125rem;
4062
- color: #fff;
4063
- line-height: 1.75rem;
4064
- margin-bottom: 0.5rem;
4065
- }
4066
- .ArticleHero_module_title {
4067
- font-size: 32px;
4068
- line-height: 34px;
4069
- font-weight: 400;
4070
- color: #fff;
4071
- letter-spacing: -2px;
4072
- margin-bottom: 1rem;
4073
- }
4074
- @media (min-width: 768px) {
4075
- .ArticleHero_module_title {
4076
- font-size: 60px;
4077
- line-height: 60px;
4078
- letter-spacing: -3px;
4079
- }
4080
- }
4081
- .ArticleHero_module_subtitle {
4082
- font-size: 1.125rem;
4083
- color: rgba(255, 255, 255, 0.9);
4084
- line-height: 22.5px;
4085
- }
4086
-
4087
- /* src/templates/ArticleBody.module.scss */
4088
- .ArticleBody_module_root {
4089
- font-size: 16px;
4090
- line-height: 1.75rem;
4091
- color: var(--fg-secondary);
4092
- font-weight: 400;
4093
- }
4094
-
4095
- /* src/templates/ArticleHeading.module.scss */
4096
- .ArticleHeading_module_root {
4097
- display: flex;
4098
- flex-direction: column;
4099
- gap: 0.25rem;
4100
- }
4101
- .ArticleHeading_module_header {
4102
- display: flex;
4103
- align-items: center;
4104
- justify-content: space-between;
4105
- }
4106
- .ArticleHeading_module_h2 {
4107
- font-size: 24px;
4108
- line-height: 2rem;
4109
- font-weight: 700;
4110
- padding-top: 3rem;
4111
- color: var(--fg);
4112
- letter-spacing: -0.025em;
4113
- }
4114
- .ArticleHeading_module_h3 {
4115
- font-size: 20px;
4116
- line-height: 2rem;
4117
- font-weight: 600;
4118
- padding-top: 2rem;
4119
- color: var(--fg);
4120
- letter-spacing: -0.025em;
4121
- }
4122
- .ArticleHeading_module_action {
4123
- flex-shrink: 0;
4124
- }
4125
- .ArticleHeading_module_subtitle {
4126
- font-size: 14px;
4127
- line-height: 1.25rem;
4128
- color: var(--fg-muted);
4129
- }
4130
-
4131
- /* src/templates/ArticleFigure.module.scss */
4132
- .ArticleFigure_module_root {
4133
- width: 100%;
4134
- }
4135
- .ArticleFigure_module_imageWrapper {
4136
- width: 100%;
4137
- border-radius: var(--radius-lg);
4138
- overflow: hidden;
4139
- background: var(--bg-secondary);
4140
- display: flex;
4141
- align-items: center;
4142
- justify-content: center;
4143
- }
4144
- .ArticleFigure_module_image {
4145
- width: 100%;
4146
- height: 100%;
4147
- object-fit: contain;
4148
- }
4149
- .ArticleFigure_module_childWrapper {
4150
- width: 100%;
4151
- height: 100%;
4152
- padding: 1rem;
4153
- }
4154
- .ArticleFigure_module_placeholder {
4155
- display: flex;
4156
- flex-direction: column;
4157
- align-items: center;
4158
- gap: 0.5rem;
4159
- color: var(--fg-muted);
4160
- }
4161
- .ArticleFigure_module_placeholderText {
4162
- font-size: 0.875rem;
4163
- }
4164
- .ArticleFigure_module_legend {
4165
- display: flex;
4166
- align-items: center;
4167
- gap: 1rem;
4168
- margin-top: 0.75rem;
4169
- flex-wrap: wrap;
4170
- }
4171
- .ArticleFigure_module_legendItem {
4172
- display: flex;
4173
- align-items: center;
4174
- gap: 0.375rem;
4175
- }
4176
- .ArticleFigure_module_legendSwatch {
4177
- width: 0.75rem;
4178
- height: 0.75rem;
4179
- border-radius: 2px;
4180
- flex-shrink: 0;
4181
- }
4182
- .ArticleFigure_module_legendLabel {
4183
- font-size: 12px;
4184
- line-height: 1rem;
4185
- color: var(--fg-secondary);
4186
- }
4187
- .ArticleFigure_module_caption {
4188
- margin-top: 0.5rem;
4189
- font-size: 14px;
4190
- line-height: 1.25rem;
4191
- color: var(--fg-muted);
4192
- }
4193
-
4194
- /* src/templates/ArticleTable.module.scss */
4195
- .ArticleTable_module_root {
4196
- width: 100%;
4197
- }
4198
- .ArticleTable_module_headerRow {
4199
- display: flex;
4200
- align-items: center;
4201
- border-bottom: 1px solid var(--border-color);
4202
- padding-bottom: 1px;
4203
- }
4204
- .ArticleTable_module_rankCell {
4205
- width: 120px;
4206
- flex-shrink: 0;
4207
- }
4208
- .ArticleTable_module_headerCell {
4209
- flex: 1;
4210
- padding: 0.875rem 1rem;
4211
- }
4212
- .ArticleTable_module_headerLabel {
4213
- font-size: 14px;
4214
- line-height: 1.25rem;
4215
- font-weight: 500;
4216
- color: var(--fg-muted);
4217
- }
4218
- .ArticleTable_module_row {
4219
- display: flex;
4220
- align-items: center;
4221
- gap: 1rem;
4222
- border-bottom: 1px solid var(--border-color);
4223
- }
4224
- .ArticleTable_module_row:last-child {
4225
- border-bottom: none;
4226
- }
4227
- .ArticleTable_module_rankValue {
4228
- width: 120px;
4229
- flex-shrink: 0;
4230
- padding: 1rem;
4231
- font-size: 14px;
4232
- line-height: 1.25rem;
4233
- color: var(--fg-muted);
4234
- }
4235
- .ArticleTable_module_cell {
4236
- flex: 1;
4237
- padding: 1rem;
4238
- display: flex;
4239
- align-items: center;
4240
- gap: 0.75rem;
4241
- }
4242
- .ArticleTable_module_cellText {
4243
- font-size: 14px;
4244
- line-height: 1.25rem;
4245
- color: var(--fg-secondary);
4246
- }
4247
- .ArticleTable_module_badge {
4248
- display: inline-flex;
4249
- align-items: center;
4250
- padding: 0.125rem 0.625rem;
4251
- border-radius: 9999px;
4252
- font-size: 12px;
4253
- line-height: 1rem;
4254
- font-weight: 600;
4255
- background: var(--bg-tertiary);
4256
- color: var(--fg);
4257
- }
4258
- .ArticleTable_module_showMore {
4259
- margin-top: 1rem;
4260
- font-size: 14px;
4261
- line-height: 1.25rem;
4262
- font-weight: 500;
4263
- color: var(--fg-muted);
4264
- transition: color 0.15s;
4265
- cursor: pointer;
4266
- background: none;
4267
- border: none;
4268
- padding: 0;
4269
- }
4270
- .ArticleTable_module_showMore:hover {
4271
- color: var(--fg);
4272
- }
4273
-
4274
- /* src/templates/ArticleList.module.scss */
4275
- .ArticleList_module_root {
4276
- padding-left: 26px;
4277
- display: flex;
4278
- flex-direction: column;
4279
- gap: 0.5rem;
4280
- font-size: 16px;
4281
- line-height: 1.75rem;
4282
- color: var(--fg-secondary);
4283
- }
4284
- .ArticleList_module_ordered {
4285
- list-style-type: decimal;
4286
- }
4287
- .ArticleList_module_unordered {
4288
- list-style-type: disc;
4289
- }
4290
- .ArticleList_module_item {
4291
- padding-left: 0.25rem;
4292
- }
4293
-
4294
- /* src/templates/ArticleNote.module.scss */
4295
- .ArticleNote_module_root {
4296
- font-size: 16px;
4297
- line-height: 1.75rem;
4298
- color: var(--fg-secondary);
4299
- font-style: italic;
4300
- }
4301
-
4302
- /* src/templates/ArticleChatBlock.module.scss */
4303
- .ArticleChatBlock_module_root {
4304
- width: 100%;
4305
- border-radius: var(--radius-lg);
4306
- overflow: hidden;
4307
- }
4308
- .ArticleChatBlock_module_assistant {
4309
- background: var(--bg-secondary);
4310
- }
4311
- .ArticleChatBlock_module_system {
4312
- background: var(--bg-tertiary);
4313
- }
4314
- .ArticleChatBlock_module_user {
4315
- background: var(--bg-secondary);
4316
- }
4317
- .ArticleChatBlock_module_header {
4318
- display: flex;
4319
- align-items: center;
4320
- gap: 0.5rem;
4321
- padding: 1rem 1.25rem 0.5rem;
4322
- }
4323
- .ArticleChatBlock_module_roleLabel {
4324
- font-size: 12px;
4325
- line-height: 1rem;
4326
- color: var(--fg-secondary);
4327
- }
4328
- .ArticleChatBlock_module_toolBadge {
4329
- padding: 0 1.25rem 0.5rem;
4330
- }
4331
- .ArticleChatBlock_module_toolBadgeInner {
4332
- display: inline-flex;
4333
- align-items: center;
4334
- gap: 0.375rem;
4335
- padding: 0.25rem 0.75rem;
4336
- border-radius: 9999px;
4337
- border: 1px solid var(--border-color);
4338
- background: var(--bg);
4339
- }
4340
- .ArticleChatBlock_module_toolDot {
4341
- width: 0.375rem;
4342
- height: 0.375rem;
4343
- border-radius: 9999px;
4344
- background: var(--color-accent);
4345
- }
4346
- .ArticleChatBlock_module_toolLabel {
4347
- font-size: 13px;
4348
- font-weight: 500;
4349
- letter-spacing: -0.25px;
4350
- color: var(--fg-secondary);
4351
- }
4352
- .ArticleChatBlock_module_divider {
4353
- margin-left: 1.25rem;
4354
- margin-right: 1.25rem;
4355
- height: 1px;
4356
- background: var(--border-color);
4357
- }
4358
- .ArticleChatBlock_module_contentWrapper {
4359
- position: relative;
4360
- }
4361
- .ArticleChatBlock_module_content {
4362
- padding: 1rem 1.25rem;
4363
- font-size: 14px;
4364
- line-height: 1.5rem;
4365
- color: var(--fg-secondary);
4366
- overflow: hidden;
4367
- transition: all 0.2s;
4368
- }
4369
- .ArticleChatBlock_module_fadeOverlay {
4370
- position: absolute;
4371
- bottom: 0;
4372
- left: 0;
4373
- right: 0;
4374
- }
4375
- .ArticleChatBlock_module_fadeGradient {
4376
- height: 4rem;
4377
- pointer-events: none;
4378
- }
4379
- .ArticleChatBlock_module_showMoreBar {
4380
- padding: 0 1.25rem 1rem;
4381
- }
4382
- .ArticleChatBlock_module_showMoreBtn {
4383
- font-size: 14px;
4384
- line-height: 1.25rem;
4385
- font-weight: 500;
4386
- color: var(--fg-muted);
4387
- transition: color 0.15s;
4388
- cursor: pointer;
4389
- background: none;
4390
- border: none;
4391
- padding: 0;
4392
- }
4393
- .ArticleChatBlock_module_showMoreBtn:hover {
4394
- color: var(--fg);
4395
- }
4396
-
4397
- /* src/templates/ArticleLinkButton.module.scss */
4398
- .ArticleLinkButton_module_root {
4399
- display: inline-flex;
4400
- align-items: center;
4401
- justify-content: center;
4402
- padding: 0.5rem 1rem;
4403
- border-radius: 9999px;
4404
- background: var(--fg);
4405
- font-size: 13px;
4406
- font-weight: 500;
4407
- letter-spacing: -0.25px;
4408
- color: var(--bg);
4409
- border: 1px solid var(--bg);
4410
- box-shadow: var(--shadow-sm);
4411
- transition: all var(--transition-fast);
4412
- cursor: pointer;
4413
- }
4414
- .ArticleLinkButton_module_root:hover {
4415
- opacity: 0.9;
4416
- }
4417
- .ArticleLinkButton_module_root:active {
4418
- opacity: 0.8;
4419
- }
4420
-
4421
- /* src/templates/ArticleFooter.module.scss */
4422
- .ArticleFooter_module_root {
4423
- width: 100%;
4424
- padding: 2.5rem 5rem;
4425
- display: flex;
4426
- flex-direction: column;
4427
- gap: 2.5rem;
4428
- }
4429
- .ArticleFooter_module_topBar {
4430
- display: flex;
4431
- align-items: center;
4432
- }
4433
- .ArticleFooter_module_logo {
4434
- flex-shrink: 0;
4435
- padding-right: 2.5rem;
4436
- }
4437
- .ArticleFooter_module_divider {
4438
- flex: 1;
4439
- height: 1px;
4440
- background: var(--fg);
4441
- }
4442
- .ArticleFooter_module_copyright {
4443
- font-size: 14px;
4444
- line-height: 1.25rem;
4445
- color: var(--fg-muted);
4446
- }
4447
-
4448
- /* src/templates/ArticleLayout.module.scss */
4449
- .ArticleLayout_module_root {
4450
- width: 100%;
4451
- max-width: 1100px;
4452
- margin-left: auto;
4453
- margin-right: auto;
4454
- display: flex;
4455
- flex-direction: column;
4456
- gap: 1.25rem;
4457
- }
4458
- .ArticleLayout_module_wide {
4459
- width: 100%;
4460
- }
4461
- .ArticleLayout_module_narrow {
4462
- width: 100%;
4463
- max-width: 720px;
4464
- }
4465
-
4466
- /* src/templates/ArticleChart.module.scss */
4467
- .ArticleChart_module_figure {
4468
- width: 100%;
4469
- }
4470
- .ArticleChart_module_chartWrapper {
4471
- width: 100%;
4472
- }
4473
- .ArticleChart_module_tooltip {
4474
- background: var(--bg);
4475
- border: 1px solid var(--border-color);
4476
- border-radius: var(--radius-md);
4477
- box-shadow: var(--shadow-md);
4478
- padding: 0.5rem 0.75rem;
4479
- font-size: 12px;
4480
- line-height: 1rem;
4481
- }
4482
- .ArticleChart_module_tooltipLabel {
4483
- color: var(--fg-muted);
4484
- margin-bottom: 0.25rem;
4485
- }
4486
- .ArticleChart_module_tooltipRow {
4487
- display: flex;
4488
- align-items: center;
4489
- gap: 0.5rem;
4490
- }
4491
- .ArticleChart_module_tooltipDot {
4492
- width: 0.5rem;
4493
- height: 0.5rem;
4494
- border-radius: 9999px;
4495
- flex-shrink: 0;
4496
- }
4497
- .ArticleChart_module_tooltipName {
4498
- color: var(--fg-secondary);
4499
- }
4500
- .ArticleChart_module_tooltipValue {
4501
- font-weight: 500;
4502
- color: var(--fg);
4503
- margin-left: auto;
4504
- padding-left: 0.75rem;
4505
- }
4506
- .ArticleChart_module_scatterTooltipLabel {
4507
- font-weight: 500;
4508
- color: var(--fg);
4509
- margin-bottom: 0.25rem;
4510
- }
4511
- .ArticleChart_module_scatterTooltipRow {
4512
- color: var(--fg-secondary);
4513
- }
4514
- .ArticleChart_module_legend {
4515
- display: flex;
4516
- align-items: center;
4517
- gap: 1rem;
4518
- margin-top: 0.75rem;
4519
- flex-wrap: wrap;
4520
- }
4521
- .ArticleChart_module_legendItem {
4522
- display: flex;
4523
- align-items: center;
4524
- gap: 0.375rem;
4525
- }
4526
- .ArticleChart_module_legendSwatch {
4527
- width: 0.75rem;
4528
- height: 0.75rem;
4529
- border-radius: 2px;
4530
- flex-shrink: 0;
4531
- }
4532
- .ArticleChart_module_legendLabel {
4533
- font-size: 12px;
4534
- line-height: 1rem;
4535
- color: var(--fg-secondary);
4536
- }
4537
-
4538
- /* src/templates/LandingLayout.module.scss */
4539
- .LandingLayout_module_headerMode {
4540
- min-height: 100vh;
4541
- background: var(--bg);
4542
- }
4543
- .LandingLayout_module_headerMain {
4544
- max-width: 80rem;
4545
- margin-left: auto;
4546
- margin-right: auto;
4547
- padding-left: 1rem;
4548
- padding-right: 1rem;
4549
- }
4550
- @media (min-width: 640px) {
4551
- .LandingLayout_module_headerMain {
4552
- padding-left: 1.5rem;
4553
- padding-right: 1.5rem;
4554
- }
4555
- }
4556
- @media (min-width: 1024px) {
4557
- .LandingLayout_module_headerMain {
4558
- padding-left: 2rem;
4559
- padding-right: 2rem;
4560
- }
4561
- }
4562
- .LandingLayout_module_sidebarMode {
4563
- display: flex;
4564
- min-height: 100vh;
4565
- background: var(--bg);
4566
- }
4567
- .LandingLayout_module_sidebarNav {
4568
- display: none;
4569
- flex-shrink: 0;
4570
- }
4571
- @media (min-width: 768px) {
4572
- .LandingLayout_module_sidebarNav {
4573
- display: flex;
4574
- }
4575
- }
4576
- .LandingLayout_module_sidebarMain {
4577
- flex: 1;
4578
- overflow-y: auto;
4579
- }
4580
- .LandingLayout_module_sidebarContent {
4581
- padding-left: 1.5rem;
4582
- padding-right: 1.5rem;
4583
- max-width: 64rem;
4584
- }
4585
- @media (min-width: 768px) {
4586
- .LandingLayout_module_sidebarContent {
4587
- padding-left: 2.5rem;
4588
- padding-right: 2.5rem;
4589
- }
4590
- }
4591
- @media (min-width: 1024px) {
4592
- .LandingLayout_module_sidebarContent {
4593
- padding-left: 4rem;
4594
- padding-right: 4rem;
4595
- }
4596
- }