@nswds/app 1.114.1 → 1.116.0

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/globals.css CHANGED
@@ -36,7 +36,6 @@
36
36
  --color-slate-600: oklch(44.6% 0.043 257.281);
37
37
  --color-slate-800: oklch(27.9% 0.041 260.031);
38
38
  --color-slate-900: oklch(20.8% 0.042 265.755);
39
- --color-slate-950: oklch(12.9% 0.042 264.695);
40
39
  --color-gray-50: oklch(98.5% 0.002 247.839);
41
40
  --color-gray-100: oklch(96.7% 0.003 264.542);
42
41
  --color-gray-200: oklch(92.8% 0.006 264.531);
@@ -371,6 +370,12 @@
371
370
  .inset-y-0 {
372
371
  inset-block: calc(var(--spacing) * 0);
373
372
  }
373
+ .inset-y-8 {
374
+ inset-block: calc(var(--spacing) * 8);
375
+ }
376
+ .inset-y-12 {
377
+ inset-block: calc(var(--spacing) * 12);
378
+ }
374
379
  .start {
375
380
  inset-inline-start: var(--spacing);
376
381
  }
@@ -413,15 +418,54 @@
413
418
  .top-7 {
414
419
  top: calc(var(--spacing) * 7);
415
420
  }
421
+ .top-10 {
422
+ top: calc(var(--spacing) * 10);
423
+ }
424
+ .top-12 {
425
+ top: calc(var(--spacing) * 12);
426
+ }
427
+ .top-14 {
428
+ top: calc(var(--spacing) * 14);
429
+ }
416
430
  .top-16 {
417
431
  top: calc(var(--spacing) * 16);
418
432
  }
433
+ .top-20 {
434
+ top: calc(var(--spacing) * 20);
435
+ }
436
+ .top-24 {
437
+ top: calc(var(--spacing) * 24);
438
+ }
419
439
  .top-28 {
420
440
  top: calc(var(--spacing) * 28);
421
441
  }
442
+ .top-40 {
443
+ top: calc(var(--spacing) * 40);
444
+ }
445
+ .top-60 {
446
+ top: calc(var(--spacing) * 60);
447
+ }
422
448
  .top-\[1px\] {
423
449
  top: 1px;
424
450
  }
451
+ .top-\[10\%\] {
452
+ top: 10%;
453
+ }
454
+ .top-\[12\%\] {
455
+ top: 12%;
456
+ }
457
+ .top-\[18\%\] {
458
+ top: 18%;
459
+ }
460
+ .top-\[24\%\] {
461
+ top: 24%;
462
+ }
463
+ .top-\[28\%\] {
464
+ top: 28%;
465
+ }
466
+ .top-\[34\%\] {
467
+ top: 34%;
468
+ }
425
469
  .top-\[50\%\] {
426
470
  top: 50%;
427
471
  }
@@ -458,6 +502,42 @@
458
502
  .right-4 {
459
503
  right: calc(var(--spacing) * 4);
460
504
  }
505
+ .right-8 {
506
+ right: calc(var(--spacing) * 8);
507
+ }
508
+ .right-10 {
509
+ right: calc(var(--spacing) * 10);
510
+ }
511
+ .right-12 {
512
+ right: calc(var(--spacing) * 12);
513
+ }
514
+ .right-14 {
515
+ right: calc(var(--spacing) * 14);
516
+ }
517
+ .right-20 {
518
+ right: calc(var(--spacing) * 20);
519
+ }
520
+ .right-28 {
521
+ right: calc(var(--spacing) * 28);
522
+ }
523
+ .right-\[-6\%\] {
524
+ right: -6%;
525
+ }
526
+ .right-\[4\%\] {
527
+ right: 4%;
528
+ }
529
+ .right-\[8\%\] {
530
+ right: 8%;
531
+ }
532
+ .right-\[14\%\] {
533
+ right: 14%;
534
+ }
535
+ .right-\[18\%\] {
536
+ right: 18%;
537
+ }
538
+ .right-\[20\%\] {
539
+ right: 20%;
540
+ }
461
541
  .-bottom-2 {
462
542
  bottom: calc(var(--spacing) * -2);
463
543
  }
@@ -476,6 +556,30 @@
476
556
  .bottom-4 {
477
557
  bottom: calc(var(--spacing) * 4);
478
558
  }
559
+ .bottom-12 {
560
+ bottom: calc(var(--spacing) * 12);
561
+ }
562
+ .bottom-14 {
563
+ bottom: calc(var(--spacing) * 14);
564
+ }
565
+ .bottom-16 {
566
+ bottom: calc(var(--spacing) * 16);
567
+ }
568
+ .bottom-\[-10\%\] {
569
+ bottom: -10%;
570
+ }
571
+ .bottom-\[12\%\] {
572
+ bottom: 12%;
573
+ }
574
+ .bottom-\[14\%\] {
575
+ bottom: 14%;
576
+ }
577
+ .bottom-\[18\%\] {
578
+ bottom: 18%;
579
+ }
580
+ .bottom-\[26\%\] {
581
+ bottom: 26%;
582
+ }
479
583
  .-left-12 {
480
584
  left: calc(var(--spacing) * -12);
481
585
  }
@@ -494,6 +598,39 @@
494
598
  .left-3 {
495
599
  left: calc(var(--spacing) * 3);
496
600
  }
601
+ .left-8 {
602
+ left: calc(var(--spacing) * 8);
603
+ }
604
+ .left-10 {
605
+ left: calc(var(--spacing) * 10);
606
+ }
607
+ .left-16 {
608
+ left: calc(var(--spacing) * 16);
609
+ }
610
+ .left-20 {
611
+ left: calc(var(--spacing) * 20);
612
+ }
613
+ .left-24 {
614
+ left: calc(var(--spacing) * 24);
615
+ }
616
+ .left-28 {
617
+ left: calc(var(--spacing) * 28);
618
+ }
619
+ .left-32 {
620
+ left: calc(var(--spacing) * 32);
621
+ }
622
+ .left-\[10\%\] {
623
+ left: 10%;
624
+ }
625
+ .left-\[12\%\] {
626
+ left: 12%;
627
+ }
628
+ .left-\[16\%\] {
629
+ left: 16%;
630
+ }
631
+ .left-\[22\%\] {
632
+ left: 22%;
633
+ }
497
634
  .left-\[50\%\] {
498
635
  left: 50%;
499
636
  }
@@ -1400,6 +1537,9 @@
1400
1537
  .h-24 {
1401
1538
  height: calc(var(--spacing) * 24);
1402
1539
  }
1540
+ .h-28 {
1541
+ height: calc(var(--spacing) * 28);
1542
+ }
1403
1543
  .h-32 {
1404
1544
  height: calc(var(--spacing) * 32);
1405
1545
  }
@@ -1415,6 +1555,9 @@
1415
1555
  .h-52 {
1416
1556
  height: calc(var(--spacing) * 52);
1417
1557
  }
1558
+ .h-56 {
1559
+ height: calc(var(--spacing) * 56);
1560
+ }
1418
1561
  .h-64 {
1419
1562
  height: calc(var(--spacing) * 64);
1420
1563
  }
@@ -1535,6 +1678,9 @@
1535
1678
  .min-h-\[12rem\] {
1536
1679
  min-height: 12rem;
1537
1680
  }
1681
+ .min-h-\[15rem\] {
1682
+ min-height: 15rem;
1683
+ }
1538
1684
  .min-h-\[16rem\] {
1539
1685
  min-height: 16rem;
1540
1686
  }
@@ -1556,9 +1702,6 @@
1556
1702
  .min-h-\[420px\] {
1557
1703
  min-height: 420px;
1558
1704
  }
1559
- .min-h-\[560px\] {
1560
- min-height: 560px;
1561
- }
1562
1705
  .min-h-dvh {
1563
1706
  min-height: 100dvh;
1564
1707
  }
@@ -1649,6 +1792,9 @@
1649
1792
  .w-40 {
1650
1793
  width: calc(var(--spacing) * 40);
1651
1794
  }
1795
+ .w-44 {
1796
+ width: calc(var(--spacing) * 44);
1797
+ }
1652
1798
  .w-48 {
1653
1799
  width: calc(var(--spacing) * 48);
1654
1800
  }
@@ -1679,12 +1825,24 @@
1679
1825
  .w-\[30rem\] {
1680
1826
  width: 30rem;
1681
1827
  }
1828
+ .w-\[42\%\] {
1829
+ width: 42%;
1830
+ }
1831
+ .w-\[50\%\] {
1832
+ width: 50%;
1833
+ }
1682
1834
  .w-\[50vw\] {
1683
1835
  width: 50vw;
1684
1836
  }
1837
+ .w-\[72\%\] {
1838
+ width: 72%;
1839
+ }
1685
1840
  .w-\[80px\] {
1686
1841
  width: 80px;
1687
1842
  }
1843
+ .w-\[82\%\] {
1844
+ width: 82%;
1845
+ }
1688
1846
  .w-\[100px\] {
1689
1847
  width: 100px;
1690
1848
  }
@@ -2054,6 +2212,9 @@
2054
2212
  .scroll-my-1 {
2055
2213
  scroll-margin-block: calc(var(--spacing) * 1);
2056
2214
  }
2215
+ .scroll-mt-8 {
2216
+ scroll-margin-top: calc(var(--spacing) * 8);
2217
+ }
2057
2218
  .scroll-py-1 {
2058
2219
  scroll-padding-block: calc(var(--spacing) * 1);
2059
2220
  }
@@ -2363,6 +2524,9 @@
2363
2524
  .gap-y-3 {
2364
2525
  row-gap: calc(var(--spacing) * 3);
2365
2526
  }
2527
+ .gap-y-4 {
2528
+ row-gap: calc(var(--spacing) * 4);
2529
+ }
2366
2530
  .divide-y {
2367
2531
  :where(& > :not(:last-child)) {
2368
2532
  --tw-divide-y-reverse: 0;
@@ -2459,9 +2623,21 @@
2459
2623
  .rounded-\[2px\] {
2460
2624
  border-radius: 2px;
2461
2625
  }
2626
+ .rounded-\[2rem\] {
2627
+ border-radius: 2rem;
2628
+ }
2462
2629
  .rounded-\[4px\] {
2463
2630
  border-radius: 4px;
2464
2631
  }
2632
+ .rounded-\[44\%\] {
2633
+ border-radius: 44%;
2634
+ }
2635
+ .rounded-\[45\%\] {
2636
+ border-radius: 45%;
2637
+ }
2638
+ .rounded-\[46\%\] {
2639
+ border-radius: 46%;
2640
+ }
2465
2641
  .rounded-\[inherit\] {
2466
2642
  border-radius: inherit;
2467
2643
  }
@@ -2505,6 +2681,10 @@
2505
2681
  .rounded-tl-sm {
2506
2682
  border-top-left-radius: var(--radius-sm);
2507
2683
  }
2684
+ .rounded-r-full {
2685
+ border-top-right-radius: calc(infinity * 1px);
2686
+ border-bottom-right-radius: calc(infinity * 1px);
2687
+ }
2508
2688
  .rounded-r-md {
2509
2689
  border-top-right-radius: var(--radius-md);
2510
2690
  border-bottom-right-radius: var(--radius-md);
@@ -2533,10 +2713,18 @@
2533
2713
  border-style: var(--tw-border-style);
2534
2714
  border-width: 2px;
2535
2715
  }
2716
+ .border-4 {
2717
+ border-style: var(--tw-border-style);
2718
+ border-width: 4px;
2719
+ }
2536
2720
  .border-\[1\.5px\] {
2537
2721
  border-style: var(--tw-border-style);
2538
2722
  border-width: 1.5px;
2539
2723
  }
2724
+ .border-\[10px\] {
2725
+ border-style: var(--tw-border-style);
2726
+ border-width: 10px;
2727
+ }
2540
2728
  .border-x {
2541
2729
  border-inline-style: var(--tw-border-style);
2542
2730
  border-inline-width: 1px;
@@ -2577,6 +2765,10 @@
2577
2765
  border-left-style: var(--tw-border-style);
2578
2766
  border-left-width: 2px;
2579
2767
  }
2768
+ .border-l-4 {
2769
+ border-left-style: var(--tw-border-style);
2770
+ border-left-width: 4px;
2771
+ }
2580
2772
  .border-dashed {
2581
2773
  --tw-border-style: dashed;
2582
2774
  border-style: dashed;
@@ -2682,6 +2874,9 @@
2682
2874
  .border-grey-200 {
2683
2875
  border-color: var(--color-grey-200);
2684
2876
  }
2877
+ .border-grey-250 {
2878
+ border-color: var(--color-grey-250);
2879
+ }
2685
2880
  .border-grey-300 {
2686
2881
  border-color: var(--color-grey-300);
2687
2882
  }
@@ -2748,6 +2943,36 @@
2748
2943
  .border-primary-100 {
2749
2944
  border-color: var(--color-primary-100);
2750
2945
  }
2946
+ .border-primary-100\/20 {
2947
+ border-color: var(--color-primary-100);
2948
+ @supports (color: color-mix(in lab, red, red)) {
2949
+ border-color: color-mix(in oklab, var(--color-primary-100) 20%, transparent);
2950
+ }
2951
+ }
2952
+ .border-primary-100\/25 {
2953
+ border-color: var(--color-primary-100);
2954
+ @supports (color: color-mix(in lab, red, red)) {
2955
+ border-color: color-mix(in oklab, var(--color-primary-100) 25%, transparent);
2956
+ }
2957
+ }
2958
+ .border-primary-100\/45 {
2959
+ border-color: var(--color-primary-100);
2960
+ @supports (color: color-mix(in lab, red, red)) {
2961
+ border-color: color-mix(in oklab, var(--color-primary-100) 45%, transparent);
2962
+ }
2963
+ }
2964
+ .border-primary-100\/60 {
2965
+ border-color: var(--color-primary-100);
2966
+ @supports (color: color-mix(in lab, red, red)) {
2967
+ border-color: color-mix(in oklab, var(--color-primary-100) 60%, transparent);
2968
+ }
2969
+ }
2970
+ .border-primary-100\/70 {
2971
+ border-color: var(--color-primary-100);
2972
+ @supports (color: color-mix(in lab, red, red)) {
2973
+ border-color: color-mix(in oklab, var(--color-primary-100) 70%, transparent);
2974
+ }
2975
+ }
2751
2976
  .border-primary-200 {
2752
2977
  border-color: var(--color-primary-200);
2753
2978
  }
@@ -2769,9 +2994,24 @@
2769
2994
  .border-primary-700 {
2770
2995
  border-color: var(--color-primary-700);
2771
2996
  }
2997
+ .border-primary-700\/30 {
2998
+ border-color: var(--color-primary-700);
2999
+ @supports (color: color-mix(in lab, red, red)) {
3000
+ border-color: color-mix(in oklab, var(--color-primary-700) 30%, transparent);
3001
+ }
3002
+ }
3003
+ .border-primary-700\/35 {
3004
+ border-color: var(--color-primary-700);
3005
+ @supports (color: color-mix(in lab, red, red)) {
3006
+ border-color: color-mix(in oklab, var(--color-primary-700) 35%, transparent);
3007
+ }
3008
+ }
2772
3009
  .border-primary-800 {
2773
3010
  border-color: var(--color-primary-800);
2774
3011
  }
3012
+ .border-primary-900 {
3013
+ border-color: var(--color-primary-900);
3014
+ }
2775
3015
  .border-primary\/20 {
2776
3016
  border-color: var(--primary);
2777
3017
  @supports (color: color-mix(in lab, red, red)) {
@@ -2829,6 +3069,12 @@
2829
3069
  .border-white {
2830
3070
  border-color: var(--color-white);
2831
3071
  }
3072
+ .border-white\/15 {
3073
+ border-color: color-mix(in srgb, #fff 15%, transparent);
3074
+ @supports (color: color-mix(in lab, red, red)) {
3075
+ border-color: color-mix(in oklab, var(--color-white) 15%, transparent);
3076
+ }
3077
+ }
2832
3078
  .border-white\/30 {
2833
3079
  border-color: color-mix(in srgb, #fff 30%, transparent);
2834
3080
  @supports (color: color-mix(in lab, red, red)) {
@@ -2898,6 +3144,18 @@
2898
3144
  .bg-accent-50 {
2899
3145
  background-color: var(--color-accent-50);
2900
3146
  }
3147
+ .bg-accent-200 {
3148
+ background-color: var(--color-accent-200);
3149
+ }
3150
+ .bg-accent-200\/80 {
3151
+ background-color: var(--color-accent-200);
3152
+ @supports (color: color-mix(in lab, red, red)) {
3153
+ background-color: color-mix(in oklab, var(--color-accent-200) 80%, transparent);
3154
+ }
3155
+ }
3156
+ .bg-accent-400 {
3157
+ background-color: var(--color-accent-400);
3158
+ }
2901
3159
  .bg-accent-600 {
2902
3160
  background-color: var(--color-accent-600);
2903
3161
  }
@@ -3111,18 +3369,60 @@
3111
3369
  background-color: color-mix(in oklab, var(--color-primary-50) 70%, transparent);
3112
3370
  }
3113
3371
  }
3372
+ .bg-primary-100 {
3373
+ background-color: var(--color-primary-100);
3374
+ }
3375
+ .bg-primary-100\/35 {
3376
+ background-color: var(--color-primary-100);
3377
+ @supports (color: color-mix(in lab, red, red)) {
3378
+ background-color: color-mix(in oklab, var(--color-primary-100) 35%, transparent);
3379
+ }
3380
+ }
3381
+ .bg-primary-100\/80 {
3382
+ background-color: var(--color-primary-100);
3383
+ @supports (color: color-mix(in lab, red, red)) {
3384
+ background-color: color-mix(in oklab, var(--color-primary-100) 80%, transparent);
3385
+ }
3386
+ }
3114
3387
  .bg-primary-200 {
3115
3388
  background-color: var(--color-primary-200);
3116
3389
  }
3390
+ .bg-primary-200\/60 {
3391
+ background-color: var(--color-primary-200);
3392
+ @supports (color: color-mix(in lab, red, red)) {
3393
+ background-color: color-mix(in oklab, var(--color-primary-200) 60%, transparent);
3394
+ }
3395
+ }
3396
+ .bg-primary-200\/75 {
3397
+ background-color: var(--color-primary-200);
3398
+ @supports (color: color-mix(in lab, red, red)) {
3399
+ background-color: color-mix(in oklab, var(--color-primary-200) 75%, transparent);
3400
+ }
3401
+ }
3117
3402
  .bg-primary-400 {
3118
3403
  background-color: var(--color-primary-400);
3119
3404
  }
3120
3405
  .bg-primary-500 {
3121
3406
  background-color: var(--color-primary-500);
3122
3407
  }
3408
+ .bg-primary-500\/20 {
3409
+ background-color: var(--color-primary-500);
3410
+ @supports (color: color-mix(in lab, red, red)) {
3411
+ background-color: color-mix(in oklab, var(--color-primary-500) 20%, transparent);
3412
+ }
3413
+ }
3123
3414
  .bg-primary-600 {
3124
3415
  background-color: var(--color-primary-600);
3125
3416
  }
3417
+ .bg-primary-700 {
3418
+ background-color: var(--color-primary-700);
3419
+ }
3420
+ .bg-primary-700\/60 {
3421
+ background-color: var(--color-primary-700);
3422
+ @supports (color: color-mix(in lab, red, red)) {
3423
+ background-color: color-mix(in oklab, var(--color-primary-700) 60%, transparent);
3424
+ }
3425
+ }
3126
3426
  .bg-primary-800 {
3127
3427
  background-color: var(--color-primary-800);
3128
3428
  }
@@ -3138,6 +3438,12 @@
3138
3438
  background-color: color-mix(in oklab, var(--color-primary-800) 20%, transparent);
3139
3439
  }
3140
3440
  }
3441
+ .bg-primary-900 {
3442
+ background-color: var(--color-primary-900);
3443
+ }
3444
+ .bg-primary-950 {
3445
+ background-color: var(--color-primary-950);
3446
+ }
3141
3447
  .bg-primary\/10 {
3142
3448
  background-color: var(--primary);
3143
3449
  @supports (color: color-mix(in lab, red, red)) {
@@ -3210,6 +3516,12 @@
3210
3516
  .bg-white {
3211
3517
  background-color: var(--color-white);
3212
3518
  }
3519
+ .bg-white\/10 {
3520
+ background-color: color-mix(in srgb, #fff 10%, transparent);
3521
+ @supports (color: color-mix(in lab, red, red)) {
3522
+ background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
3523
+ }
3524
+ }
3213
3525
  .bg-white\/75 {
3214
3526
  background-color: color-mix(in srgb, #fff 75%, transparent);
3215
3527
  @supports (color: color-mix(in lab, red, red)) {
@@ -3525,15 +3837,15 @@
3525
3837
  .px-\[calc\(--spacing\(2\)\*1\.25\)\] {
3526
3838
  padding-inline: calc(calc(var(--spacing) * 2) * 1.25);
3527
3839
  }
3528
- .px-\[calc\(--spacing\(4\)-1px\)\] {
3529
- padding-inline: calc(calc(var(--spacing) * 4) - 1px);
3530
- }
3531
3840
  .px-\[calc\(--spacing\(5\)-1px\)\] {
3532
3841
  padding-inline: calc(calc(var(--spacing) * 5) - 1px);
3533
3842
  }
3534
3843
  .px-\[calc\(--spacing\(6\)-1px\)\] {
3535
3844
  padding-inline: calc(calc(var(--spacing) * 6) - 1px);
3536
3845
  }
3846
+ .px-\[calc\(--spacing\(7\)-1px\)\] {
3847
+ padding-inline: calc(calc(var(--spacing) * 7) - 1px);
3848
+ }
3537
3849
  .py-0 {
3538
3850
  padding-block: calc(var(--spacing) * 0);
3539
3851
  }
@@ -3582,6 +3894,9 @@
3582
3894
  .py-16 {
3583
3895
  padding-block: calc(var(--spacing) * 16);
3584
3896
  }
3897
+ .py-24 {
3898
+ padding-block: calc(var(--spacing) * 24);
3899
+ }
3585
3900
  .py-\[calc\(--spacing\(1\)\)\] {
3586
3901
  padding-block: calc(calc(var(--spacing) * 1));
3587
3902
  }
@@ -4050,6 +4365,10 @@
4050
4365
  --tw-tracking: 0.1em;
4051
4366
  letter-spacing: 0.1em;
4052
4367
  }
4368
+ .tracking-\[0\.2em\] {
4369
+ --tw-tracking: 0.2em;
4370
+ letter-spacing: 0.2em;
4371
+ }
4053
4372
  .tracking-\[0\.04em\] {
4054
4373
  --tw-tracking: 0.04em;
4055
4374
  letter-spacing: 0.04em;
@@ -4173,6 +4492,9 @@
4173
4492
  .text-accent-700 {
4174
4493
  color: var(--color-accent-700);
4175
4494
  }
4495
+ .text-accent-800 {
4496
+ color: var(--color-accent-800);
4497
+ }
4176
4498
  .text-accent-900 {
4177
4499
  color: var(--color-accent-900);
4178
4500
  }
@@ -4299,6 +4621,9 @@
4299
4621
  .text-primary {
4300
4622
  color: var(--primary);
4301
4623
  }
4624
+ .text-primary-100 {
4625
+ color: var(--color-primary-100);
4626
+ }
4302
4627
  .text-primary-500 {
4303
4628
  color: var(--color-primary-500);
4304
4629
  }
@@ -5041,9 +5366,6 @@
5041
5366
  .\[--btn-icon-size\:--spacing\(8\)\] {
5042
5367
  --btn-icon-size: calc(var(--spacing) * 8);
5043
5368
  }
5044
- .\[--btn-icon-size\:--spacing\(9\)\] {
5045
- --btn-icon-size: calc(var(--spacing) * 9);
5046
- }
5047
5369
  .\[--btn-icon\:var\(--footer-social\)\] {
5048
5370
  --btn-icon: var(--footer-social);
5049
5371
  }
@@ -10382,11 +10704,6 @@
10382
10704
  padding-inline: calc(var(--spacing) * 8);
10383
10705
  }
10384
10706
  }
10385
- .sm\:px-\[calc\(--spacing\(3\.5\)-1px\)\] {
10386
- @media (width >= 40rem) {
10387
- padding-inline: calc(calc(var(--spacing) * 3.5) - 1px);
10388
- }
10389
- }
10390
10707
  .sm\:px-\[calc\(--spacing\(4\)\)\] {
10391
10708
  @media (width >= 40rem) {
10392
10709
  padding-inline: calc(calc(var(--spacing) * 4));
@@ -10402,6 +10719,11 @@
10402
10719
  padding-inline: calc(calc(var(--spacing) * 5.5) - 1px);
10403
10720
  }
10404
10721
  }
10722
+ .sm\:px-\[calc\(--spacing\(6\.5\)-1px\)\] {
10723
+ @media (width >= 40rem) {
10724
+ padding-inline: calc(calc(var(--spacing) * 6.5) - 1px);
10725
+ }
10726
+ }
10405
10727
  .sm\:px-px {
10406
10728
  @media (width >= 40rem) {
10407
10729
  padding-inline: 1px;
@@ -10432,6 +10754,11 @@
10432
10754
  padding-block: calc(var(--spacing) * 8);
10433
10755
  }
10434
10756
  }
10757
+ .sm\:py-32 {
10758
+ @media (width >= 40rem) {
10759
+ padding-block: calc(var(--spacing) * 32);
10760
+ }
10761
+ }
10435
10762
  .sm\:py-\[calc\(--spacing\(2\)-1px\)\] {
10436
10763
  @media (width >= 40rem) {
10437
10764
  padding-block: calc(calc(var(--spacing) * 2) - 1px);
@@ -10662,11 +10989,6 @@
10662
10989
  --btn-icon-size: calc(var(--spacing) * 7);
10663
10990
  }
10664
10991
  }
10665
- .sm\:\[--btn-icon-size\:--spacing\(8\)\] {
10666
- @media (width >= 40rem) {
10667
- --btn-icon-size: calc(var(--spacing) * 8);
10668
- }
10669
- }
10670
10992
  .sm\:duration-300 {
10671
10993
  @media (width >= 40rem) {
10672
10994
  animation-duration: 300ms;
@@ -10983,21 +11305,61 @@
10983
11305
  inset: calc(var(--spacing) * 0);
10984
11306
  }
10985
11307
  }
11308
+ .lg\:col-span-1 {
11309
+ @media (width >= 64rem) {
11310
+ grid-column: span 1 / span 1;
11311
+ }
11312
+ }
10986
11313
  .lg\:col-span-2 {
10987
11314
  @media (width >= 64rem) {
10988
11315
  grid-column: span 2 / span 2;
10989
11316
  }
10990
11317
  }
11318
+ .lg\:col-span-3 {
11319
+ @media (width >= 64rem) {
11320
+ grid-column: span 3 / span 3;
11321
+ }
11322
+ }
10991
11323
  .lg\:col-span-4 {
10992
11324
  @media (width >= 64rem) {
10993
11325
  grid-column: span 4 / span 4;
10994
11326
  }
10995
11327
  }
11328
+ .lg\:col-span-5 {
11329
+ @media (width >= 64rem) {
11330
+ grid-column: span 5 / span 5;
11331
+ }
11332
+ }
11333
+ .lg\:col-span-6 {
11334
+ @media (width >= 64rem) {
11335
+ grid-column: span 6 / span 6;
11336
+ }
11337
+ }
11338
+ .lg\:col-span-7 {
11339
+ @media (width >= 64rem) {
11340
+ grid-column: span 7 / span 7;
11341
+ }
11342
+ }
10996
11343
  .lg\:col-span-8 {
10997
11344
  @media (width >= 64rem) {
10998
11345
  grid-column: span 8 / span 8;
10999
11346
  }
11000
11347
  }
11348
+ .lg\:col-span-9 {
11349
+ @media (width >= 64rem) {
11350
+ grid-column: span 9 / span 9;
11351
+ }
11352
+ }
11353
+ .lg\:col-span-10 {
11354
+ @media (width >= 64rem) {
11355
+ grid-column: span 10 / span 10;
11356
+ }
11357
+ }
11358
+ .lg\:col-span-11 {
11359
+ @media (width >= 64rem) {
11360
+ grid-column: span 11 / span 11;
11361
+ }
11362
+ }
11001
11363
  .lg\:mx-0 {
11002
11364
  @media (width >= 64rem) {
11003
11365
  margin-inline: calc(var(--spacing) * 0);
@@ -11063,6 +11425,11 @@
11063
11425
  height: 100%;
11064
11426
  }
11065
11427
  }
11428
+ .lg\:min-h-\[25rem\] {
11429
+ @media (width >= 64rem) {
11430
+ min-height: 25rem;
11431
+ }
11432
+ }
11066
11433
  .lg\:w-64 {
11067
11434
  @media (width >= 64rem) {
11068
11435
  width: calc(var(--spacing) * 64);
@@ -11083,6 +11450,11 @@
11083
11450
  width: auto;
11084
11451
  }
11085
11452
  }
11453
+ .lg\:max-w-\[var\(--hero-copy-max-width\)\] {
11454
+ @media (width >= 64rem) {
11455
+ max-width: var(--hero-copy-max-width);
11456
+ }
11457
+ }
11086
11458
  .lg\:max-w-none {
11087
11459
  @media (width >= 64rem) {
11088
11460
  max-width: none;
@@ -11158,6 +11530,11 @@
11158
11530
  flex-wrap: wrap;
11159
11531
  }
11160
11532
  }
11533
+ .lg\:items-baseline {
11534
+ @media (width >= 64rem) {
11535
+ align-items: baseline;
11536
+ }
11537
+ }
11161
11538
  .lg\:items-center {
11162
11539
  @media (width >= 64rem) {
11163
11540
  align-items: center;
@@ -11207,6 +11584,18 @@
11207
11584
  border-radius: var(--radius-sm);
11208
11585
  }
11209
11586
  }
11587
+ .lg\:border-t-0 {
11588
+ @media (width >= 64rem) {
11589
+ border-top-style: var(--tw-border-style);
11590
+ border-top-width: 0px;
11591
+ }
11592
+ }
11593
+ .lg\:border-l {
11594
+ @media (width >= 64rem) {
11595
+ border-left-style: var(--tw-border-style);
11596
+ border-left-width: 1px;
11597
+ }
11598
+ }
11210
11599
  .lg\:bg-white {
11211
11600
  @media (width >= 64rem) {
11212
11601
  background-color: var(--color-white);
@@ -11242,6 +11631,16 @@
11242
11631
  padding-inline: calc(var(--spacing) * 12);
11243
11632
  }
11244
11633
  }
11634
+ .lg\:py-14 {
11635
+ @media (width >= 64rem) {
11636
+ padding-block: calc(var(--spacing) * 14);
11637
+ }
11638
+ }
11639
+ .lg\:py-16 {
11640
+ @media (width >= 64rem) {
11641
+ padding-block: calc(var(--spacing) * 16);
11642
+ }
11643
+ }
11245
11644
  .lg\:pt-24 {
11246
11645
  @media (width >= 64rem) {
11247
11646
  padding-top: calc(var(--spacing) * 24);
@@ -11267,6 +11666,11 @@
11267
11666
  padding-left: calc(var(--spacing) * 8);
11268
11667
  }
11269
11668
  }
11669
+ .lg\:pl-16 {
11670
+ @media (width >= 64rem) {
11671
+ padding-left: calc(var(--spacing) * 16);
11672
+ }
11673
+ }
11270
11674
  .lg\:text-left {
11271
11675
  @media (width >= 64rem) {
11272
11676
  text-align: left;
@@ -11308,9 +11712,9 @@
11308
11712
  position: sticky;
11309
11713
  }
11310
11714
  }
11311
- .xl\:inset-0 {
11715
+ .xl\:inset-y-0 {
11312
11716
  @media (width >= 80rem) {
11313
- inset: calc(var(--spacing) * 0);
11717
+ inset-block: calc(var(--spacing) * 0);
11314
11718
  }
11315
11719
  }
11316
11720
  .xl\:top-0 {
@@ -11328,14 +11732,14 @@
11328
11732
  top: var(--tool-sidebar-top);
11329
11733
  }
11330
11734
  }
11331
- .xl\:left-2\/3 {
11735
+ .xl\:right-0 {
11332
11736
  @media (width >= 80rem) {
11333
- left: calc(2 / 3 * 100%);
11737
+ right: calc(var(--spacing) * 0);
11334
11738
  }
11335
11739
  }
11336
- .xl\:col-span-8 {
11740
+ .xl\:left-\[var\(--hero-image-start\)\] {
11337
11741
  @media (width >= 80rem) {
11338
- grid-column: span 8 / span 8;
11742
+ left: var(--hero-image-start);
11339
11743
  }
11340
11744
  }
11341
11745
  .xl\:-mr-6 {
@@ -11995,11 +12399,6 @@
11995
12399
  }
11996
12400
  }
11997
12401
  }
11998
- .dark\:bg-slate-950 {
11999
- &:where([data-theme=dark], [data-theme=dark] *) {
12000
- background-color: var(--color-slate-950);
12001
- }
12002
- }
12003
12402
  .dark\:bg-success-500 {
12004
12403
  &:where([data-theme=dark], [data-theme=dark] *) {
12005
12404
  background-color: var(--success-500);