@nok-integration/storefront-react 0.29.1 → 0.29.3

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.
@@ -2627,28 +2627,28 @@
2627
2627
  grid-template-columns: repeat(2, 1fr);
2628
2628
  gap: var(--space-16);
2629
2629
  }
2630
- ._rail_15pjn_7 {
2630
+ ._rail_st5m2_7 {
2631
2631
  display: flex;
2632
2632
  flex-direction: column;
2633
2633
  gap: var(--space-12);
2634
2634
  padding: var(--space-24) 0 var(--space-16);
2635
2635
  }
2636
- ._header_15pjn_14 {
2636
+ ._header_st5m2_14 {
2637
2637
  display: flex;
2638
2638
  align-items: baseline;
2639
2639
  justify-content: space-between;
2640
2640
  padding: 0 var(--space-16);
2641
2641
  }
2642
- ._title_15pjn_21 {
2642
+ ._title_st5m2_21 {
2643
2643
  font-size: var(--type-heading-md-size);
2644
2644
  line-height: 1.38;
2645
2645
  }
2646
- ._seeAll_15pjn_27 {
2646
+ ._seeAll_st5m2_27 {
2647
2647
  font-size: var(--type-trimmed-sm-size);
2648
2648
  color: var(--color-text-subtle);
2649
2649
  text-decoration: none;
2650
2650
  }
2651
- ._track_15pjn_33 {
2651
+ ._track_st5m2_33 {
2652
2652
  display: flex;
2653
2653
  gap: var(--space-12);
2654
2654
  list-style: none;
@@ -2660,41 +2660,42 @@
2660
2660
  -webkit-overflow-scrolling: touch;
2661
2661
  scrollbar-width: none;
2662
2662
  }
2663
- ._track_15pjn_33::-webkit-scrollbar {
2663
+ ._track_st5m2_33::-webkit-scrollbar {
2664
2664
  display: none;
2665
2665
  }
2666
- ._item_15pjn_67 {
2666
+ ._item_st5m2_67 {
2667
2667
  flex: 0 0 auto;
2668
2668
  width: 165px;
2669
2669
  scroll-snap-align: start;
2670
2670
  }
2671
- ._inset_15pjn_79 ._header_15pjn_14 {
2671
+ ._inset_st5m2_79 ._header_st5m2_14 {
2672
2672
  padding: 0;
2673
2673
  }
2674
- ._inset_15pjn_79 ._track_15pjn_33 {
2674
+ ._inset_st5m2_79 ._track_st5m2_33 {
2675
2675
  padding-left: 0;
2676
2676
  padding-right: 0;
2677
2677
  scroll-padding-inline: 0;
2678
2678
  }
2679
- ._inset_15pjn_79 {
2679
+ ._inset_st5m2_79 {
2680
2680
  padding: 0;
2681
2681
  }
2682
- ._inset_15pjn_79 ._item_15pjn_67 {
2682
+ ._inset_st5m2_79 ._item_st5m2_67 {
2683
2683
  width: 165px;
2684
2684
  max-width: none;
2685
2685
  }
2686
2686
  @media (min-width: 1200px) {
2687
- [data-shop-layout=wide] ._inset_15pjn_79 ._track_15pjn_33 {
2687
+ [data-shop-layout=wide] ._inset_st5m2_79 ._track_st5m2_33 {
2688
2688
  display: grid;
2689
- grid-template-columns: repeat(4, minmax(0, 1fr));
2689
+ grid-template-columns: repeat(4, minmax(0, 260px));
2690
+ justify-content: start;
2690
2691
  gap: var(--space-12);
2691
2692
  padding: 0;
2692
2693
  overflow: visible;
2693
2694
  }
2694
- [data-shop-layout=wide] ._inset_15pjn_79 ._item_15pjn_67 {
2695
+ [data-shop-layout=wide] ._inset_st5m2_79 ._item_st5m2_67 {
2695
2696
  width: auto;
2696
2697
  }
2697
- [data-shop-layout=wide] ._inset_15pjn_79 ._item_15pjn_67:nth-child(n+5) {
2698
+ [data-shop-layout=wide] ._inset_st5m2_79 ._item_st5m2_67:nth-child(n+5) {
2698
2699
  display: none;
2699
2700
  }
2700
2701
  }
@@ -3084,33 +3085,33 @@
3084
3085
  ._actions_23dkv_70 > * {
3085
3086
  flex: 1 1 0;
3086
3087
  }
3087
- ._surface_qvckt_15 {
3088
+ ._surface_o6bcy_15 {
3088
3089
  display: flex;
3089
3090
  flex-direction: column;
3090
3091
  }
3091
- ._screen_qvckt_20 {
3092
+ ._screen_o6bcy_20 {
3092
3093
  display: flex;
3093
3094
  flex-direction: column;
3094
3095
  flex: 1 1 auto;
3095
3096
  }
3096
- ._body_qvckt_12 {
3097
+ ._body_o6bcy_12 {
3097
3098
  display: flex;
3098
3099
  flex-direction: column;
3099
3100
  gap: var(--space-20);
3100
3101
  padding: var(--space-20) var(--space-16) 0;
3101
3102
  flex: 1 1 auto;
3102
3103
  }
3103
- ._items_qvckt_34 {
3104
+ ._items_o6bcy_34 {
3104
3105
  display: flex;
3105
3106
  flex-direction: column;
3106
3107
  gap: var(--space-20);
3107
3108
  }
3108
- ._sectionHeader_qvckt_40 {
3109
+ ._sectionHeader_o6bcy_40 {
3109
3110
  display: flex;
3110
3111
  align-items: center;
3111
3112
  gap: var(--space-12);
3112
3113
  }
3113
- ._sectionTitle_qvckt_46 {
3114
+ ._sectionTitle_o6bcy_46 {
3114
3115
  margin: 0;
3115
3116
  font-size: var(--type-heading-md-size);
3116
3117
  line-height: 1.38;
@@ -3118,7 +3119,7 @@
3118
3119
  flex: 1 0 0;
3119
3120
  min-width: 0;
3120
3121
  }
3121
- ._count_qvckt_67 {
3122
+ ._count_o6bcy_67 {
3122
3123
  display: inline-flex;
3123
3124
  align-items: center;
3124
3125
  justify-content: center;
@@ -3133,7 +3134,7 @@
3133
3134
  font-variant-numeric: tabular-nums;
3134
3135
  flex-shrink: 0;
3135
3136
  }
3136
- ._lines_qvckt_91 {
3137
+ ._lines_o6bcy_91 {
3137
3138
  list-style: none;
3138
3139
  margin: 0;
3139
3140
  padding: 0;
@@ -3141,18 +3142,33 @@
3141
3142
  flex-direction: column;
3142
3143
  gap: var(--space-20);
3143
3144
  }
3144
- ._footer_qvckt_101 {
3145
+ ._footer_o6bcy_101 {
3146
+ display: contents;
3147
+ }
3148
+ ._empty_o6bcy_105 {
3145
3149
  display: contents;
3146
3150
  }
3147
3151
  @media (min-width: 1200px) {
3148
- [data-shop-panel] ._surface_qvckt_15 {
3152
+ [data-shop-panel] ._empty_o6bcy_105 p {
3153
+ max-width: none;
3154
+ white-space: nowrap;
3155
+ }
3156
+ [data-shop-panel] ._empty_o6bcy_105 button {
3157
+ width: 154px;
3158
+ padding: 0;
3159
+ }
3160
+ [data-shop-panel] ._count_o6bcy_67 {
3161
+ border: 1px solid var(--color-border-default);
3162
+ background: transparent;
3163
+ }
3164
+ [data-shop-panel] ._surface_o6bcy_15 {
3149
3165
  justify-content: center;
3150
3166
  background: var(--color-surface-base);
3151
3167
  }
3152
- [data-shop-panel] ._body_qvckt_12 {
3168
+ [data-shop-panel] ._body_o6bcy_12 {
3153
3169
  padding: var(--space-4) var(--space-24) var(--space-24);
3154
3170
  }
3155
- [data-shop-panel] ._footer_qvckt_101 {
3171
+ [data-shop-panel] ._footer_o6bcy_101 {
3156
3172
  position: sticky;
3157
3173
  bottom: 0;
3158
3174
  z-index: 50;
@@ -3163,14 +3179,14 @@
3163
3179
  border-top: 1px solid #e6e6e6;
3164
3180
  background: var(--color-surface-base);
3165
3181
  }
3166
- [data-shop-panel] ._cta_qvckt_127 {
3182
+ [data-shop-panel] ._cta_o6bcy_146 {
3167
3183
  position: static;
3168
3184
  padding: 0;
3169
3185
  border-top: none;
3170
3186
  background: transparent;
3171
3187
  }
3172
3188
  }
3173
- ._ctaError_qvckt_135 {
3189
+ ._ctaError_o6bcy_154 {
3174
3190
  margin: 0;
3175
3191
  font-size: var(--type-caption-sm-size);
3176
3192
  line-height: var(--type-caption-sm-line);
@@ -3308,7 +3324,7 @@
3308
3324
  ._badges_1m6o7_49 li {
3309
3325
  background: var(--color-surface-default);
3310
3326
  }
3311
- ._scrim_n0uqj_8 {
3327
+ ._scrim_mvuuv_8 {
3312
3328
  position: fixed;
3313
3329
  inset: 0;
3314
3330
  z-index: 60;
@@ -3316,9 +3332,9 @@
3316
3332
  align-items: flex-end;
3317
3333
  justify-content: center;
3318
3334
  background: rgba(12, 22, 28, 0.32);
3319
- animation: _fade_n0uqj_1 160ms ease-out;
3335
+ animation: _fade_mvuuv_1 160ms ease-out;
3320
3336
  }
3321
- ._sheet_n0uqj_2 {
3337
+ ._sheet_mvuuv_2 {
3322
3338
  display: flex;
3323
3339
  flex-direction: column;
3324
3340
  width: 100%;
@@ -3327,9 +3343,9 @@
3327
3343
  overflow: hidden;
3328
3344
  border-radius: 16px 16px 0 0;
3329
3345
  background: #ffffff;
3330
- animation: _rise_n0uqj_1 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
3346
+ animation: _rise_mvuuv_1 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
3331
3347
  }
3332
- ._body_n0uqj_40 {
3348
+ ._body_mvuuv_40 {
3333
3349
  flex: 1 1 auto;
3334
3350
  overflow-y: auto;
3335
3351
  display: flex;
@@ -3339,31 +3355,31 @@
3339
3355
  background: var(--color-surface-default);
3340
3356
  scrollbar-width: none;
3341
3357
  }
3342
- ._body_n0uqj_40::-webkit-scrollbar {
3358
+ ._body_mvuuv_40::-webkit-scrollbar {
3343
3359
  display: none;
3344
3360
  }
3345
- ._body_n0uqj_40 > * {
3361
+ ._body_mvuuv_40 > * {
3346
3362
  flex-shrink: 0;
3347
3363
  }
3348
- ._titles_n0uqj_67 {
3364
+ ._titles_mvuuv_67 {
3349
3365
  display: flex;
3350
3366
  flex-direction: column;
3351
3367
  gap: var(--space-2);
3352
3368
  }
3353
- ._title_n0uqj_67 {
3369
+ ._title_mvuuv_67 {
3354
3370
  margin: 0;
3355
3371
  font-size: var(--type-heading-md-size);
3356
3372
  line-height: 1.32;
3357
3373
  font-weight: var(--font-weight-bold);
3358
3374
  color: var(--color-text-default);
3359
3375
  }
3360
- ._subtitle_n0uqj_83 {
3376
+ ._subtitle_mvuuv_83 {
3361
3377
  margin: 0;
3362
3378
  font-size: var(--type-caption-sm-size);
3363
3379
  line-height: var(--type-caption-sm-line);
3364
3380
  color: var(--color-text-subtle);
3365
3381
  }
3366
- ._units_n0uqj_96 {
3382
+ ._units_mvuuv_96 {
3367
3383
  display: flex;
3368
3384
  align-items: center;
3369
3385
  width: 190px;
@@ -3372,7 +3388,7 @@
3372
3388
  border-radius: 9px;
3373
3389
  background: var(--color-surface-soft);
3374
3390
  }
3375
- ._unit_n0uqj_96 {
3391
+ ._unit_mvuuv_96 {
3376
3392
  flex: 1 1 0;
3377
3393
  display: inline-flex;
3378
3394
  align-items: center;
@@ -3388,35 +3404,35 @@
3388
3404
  line-height: 10px;
3389
3405
  cursor: pointer;
3390
3406
  }
3391
- ._unitOn_n0uqj_130 {
3407
+ ._unitOn_mvuuv_130 {
3392
3408
  height: 32px;
3393
3409
  background: var(--color-surface-neutral);
3394
3410
  font-weight: var(--font-weight-bold);
3395
3411
  }
3396
- ._unitOff_n0uqj_138 {
3412
+ ._unitOff_mvuuv_138 {
3397
3413
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.04);
3398
3414
  font-weight: var(--font-weight-regular);
3399
3415
  }
3400
- ._tableWrap_n0uqj_147 {
3416
+ ._tableWrap_mvuuv_147 {
3401
3417
  overflow-x: auto;
3402
3418
  scrollbar-width: none;
3403
3419
  }
3404
- ._tableWrap_n0uqj_147::-webkit-scrollbar {
3420
+ ._tableWrap_mvuuv_147::-webkit-scrollbar {
3405
3421
  display: none;
3406
3422
  }
3407
- ._table_n0uqj_147 {
3423
+ ._table_mvuuv_147 {
3408
3424
  width: 100%;
3409
3425
  border-collapse: separate;
3410
3426
  border-spacing: 0;
3411
3427
  table-layout: fixed;
3412
3428
  }
3413
- ._col_n0uqj_179 {
3429
+ ._col_mvuuv_179 {
3414
3430
  width: 18.6006%;
3415
3431
  }
3416
- ._colEdge_n0uqj_183 {
3432
+ ._colEdge_mvuuv_183 {
3417
3433
  width: 22.0991%;
3418
3434
  }
3419
- ._table_n0uqj_147 thead th {
3435
+ ._table_mvuuv_147 thead th {
3420
3436
  height: 36px;
3421
3437
  padding: 0;
3422
3438
  background: #f5f5f5;
@@ -3427,17 +3443,17 @@
3427
3443
  letter-spacing: 0.12px;
3428
3444
  text-align: center;
3429
3445
  }
3430
- ._table_n0uqj_147 thead th:first-child {
3446
+ ._table_mvuuv_147 thead th:first-child {
3431
3447
  padding-left: var(--space-12);
3432
3448
  border-top-left-radius: var(--radius-8);
3433
3449
  text-align: left;
3434
3450
  }
3435
- ._table_n0uqj_147 thead th:last-child {
3451
+ ._table_mvuuv_147 thead th:last-child {
3436
3452
  padding-right: var(--space-12);
3437
3453
  border-top-right-radius: var(--radius-8);
3438
3454
  }
3439
- ._table_n0uqj_147 tbody th,
3440
- ._table_n0uqj_147 tbody td {
3455
+ ._table_mvuuv_147 tbody th,
3456
+ ._table_mvuuv_147 tbody td {
3441
3457
  height: 44px;
3442
3458
  padding: 0;
3443
3459
  border-bottom: 1px solid var(--color-surface-soft);
@@ -3447,19 +3463,19 @@
3447
3463
  font-weight: var(--font-weight-regular);
3448
3464
  text-align: center;
3449
3465
  }
3450
- ._table_n0uqj_147 tbody th {
3466
+ ._table_mvuuv_147 tbody th {
3451
3467
  padding-left: var(--space-12);
3452
3468
  font-weight: var(--font-weight-bold);
3453
3469
  text-align: left;
3454
3470
  }
3455
- ._table_n0uqj_147 tbody td:last-child {
3471
+ ._table_mvuuv_147 tbody td:last-child {
3456
3472
  padding-right: var(--space-12);
3457
3473
  }
3458
- ._table_n0uqj_147 tbody tr:last-child th,
3459
- ._table_n0uqj_147 tbody tr:last-child td {
3474
+ ._table_mvuuv_147 tbody tr:last-child th,
3475
+ ._table_mvuuv_147 tbody tr:last-child td {
3460
3476
  border-bottom: 0;
3461
3477
  }
3462
- ._note_n0uqj_251 {
3478
+ ._note_mvuuv_251 {
3463
3479
  margin: 0;
3464
3480
  padding: var(--space-8) var(--space-12);
3465
3481
  border-radius: var(--radius-8);
@@ -3468,35 +3484,35 @@
3468
3484
  font-size: var(--type-trimmed-xs-size);
3469
3485
  line-height: 1.52;
3470
3486
  }
3471
- ._how_n0uqj_263 {
3487
+ ._how_mvuuv_263 {
3472
3488
  display: flex;
3473
3489
  flex-direction: column;
3474
3490
  gap: var(--space-16);
3475
3491
  }
3476
- ._howTitle_n0uqj_269 {
3492
+ ._howTitle_mvuuv_269 {
3477
3493
  margin: 0;
3478
3494
  font-size: var(--type-heading-sm-size);
3479
3495
  line-height: var(--type-heading-sm-line);
3480
3496
  font-weight: var(--font-weight-bold);
3481
3497
  color: #0d0d0d;
3482
3498
  }
3483
- ._howList_n0uqj_277 {
3499
+ ._howList_mvuuv_277 {
3484
3500
  margin: 0;
3485
3501
  display: flex;
3486
3502
  flex-direction: column;
3487
3503
  gap: var(--space-8);
3488
3504
  }
3489
- ._howItem_n0uqj_284 {
3505
+ ._howItem_mvuuv_284 {
3490
3506
  display: flex;
3491
3507
  flex-direction: column;
3492
3508
  gap: var(--space-8);
3493
3509
  }
3494
- ._howItem_n0uqj_284 + ._howItem_n0uqj_284 {
3510
+ ._howItem_mvuuv_284 + ._howItem_mvuuv_284 {
3495
3511
  margin-top: -1px;
3496
3512
  padding-top: var(--space-8);
3497
3513
  border-top: 1px solid var(--color-surface-soft);
3498
3514
  }
3499
- ._howLabel_n0uqj_309 {
3515
+ ._howLabel_mvuuv_309 {
3500
3516
  padding: 5px 0;
3501
3517
  margin: -5px 0;
3502
3518
  font-size: var(--type-trimmed-xs-size);
@@ -3505,31 +3521,31 @@
3505
3521
  letter-spacing: 0.12px;
3506
3522
  color: #0d0d0d;
3507
3523
  }
3508
- ._howText_n0uqj_319 {
3524
+ ._howText_mvuuv_319 {
3509
3525
  margin: 0;
3510
3526
  font-size: var(--type-trimmed-xs-size);
3511
3527
  line-height: 1.52;
3512
3528
  color: #6b6b6b;
3513
3529
  }
3514
- ._fabric_n0uqj_328 {
3530
+ ._fabric_mvuuv_328 {
3515
3531
  display: flex;
3516
3532
  flex-direction: column;
3517
3533
  gap: var(--space-2);
3518
3534
  }
3519
- ._fabricLabel_n0uqj_336 {
3535
+ ._fabricLabel_mvuuv_336 {
3520
3536
  margin: 0;
3521
3537
  font-size: var(--type-trimmed-xs-size);
3522
3538
  line-height: 1.52;
3523
3539
  font-weight: var(--font-weight-bold);
3524
3540
  color: #0d0d0d;
3525
3541
  }
3526
- ._fabricText_n0uqj_344 {
3542
+ ._fabricText_mvuuv_344 {
3527
3543
  margin: 0;
3528
3544
  font-size: var(--type-trimmed-xs-size);
3529
3545
  line-height: 1.52;
3530
3546
  color: #6b6b6b;
3531
3547
  }
3532
- ._notes_n0uqj_355 {
3548
+ ._notes_mvuuv_355 {
3533
3549
  margin: 0;
3534
3550
  padding-left: var(--space-16);
3535
3551
  display: flex;
@@ -3539,7 +3555,7 @@
3539
3555
  line-height: var(--type-caption-sm-line);
3540
3556
  color: var(--color-text-subtle);
3541
3557
  }
3542
- @keyframes _fade_n0uqj_1 {
3558
+ @keyframes _fade_mvuuv_1 {
3543
3559
  from {
3544
3560
  opacity: 0;
3545
3561
  }
@@ -3547,7 +3563,7 @@
3547
3563
  opacity: 1;
3548
3564
  }
3549
3565
  }
3550
- @keyframes _rise_n0uqj_1 {
3566
+ @keyframes _rise_mvuuv_1 {
3551
3567
  from {
3552
3568
  transform: translateY(12%);
3553
3569
  }
@@ -3556,27 +3572,29 @@
3556
3572
  }
3557
3573
  }
3558
3574
  @media (prefers-reduced-motion: reduce) {
3559
- ._scrim_n0uqj_8,
3560
- ._sheet_n0uqj_2 {
3575
+ ._scrim_mvuuv_8,
3576
+ ._sheet_mvuuv_2 {
3561
3577
  animation: none;
3562
3578
  }
3563
3579
  }
3564
3580
  @media (min-width: 1200px) {
3565
- body:has([data-shop-nav]) ._scrim_n0uqj_8 {
3581
+ body:has([data-shop-nav]) ._scrim_mvuuv_8 {
3566
3582
  top: var(--shop-chrome-top, 0px);
3567
3583
  align-items: center;
3584
+ background: rgba(0, 0, 0, 0.6);
3568
3585
  }
3569
- body:has([data-shop-nav]) ._sheet_n0uqj_2 {
3586
+ body:has([data-shop-nav]) ._sheet_mvuuv_2 {
3570
3587
  max-width: 560px;
3571
3588
  max-height: min(720px, calc(100dvh - var(--shop-chrome-top, 0px) - 32px));
3572
3589
  padding-bottom: var(--space-24);
3573
3590
  border-radius: 16px;
3574
- animation: _fade_n0uqj_1 160ms ease-out;
3591
+ animation: _fade_mvuuv_1 160ms ease-out;
3575
3592
  }
3576
- body:has([data-shop-nav]) ._body_n0uqj_40 {
3593
+ body:has([data-shop-nav]) ._body_mvuuv_40 {
3577
3594
  padding-bottom: var(--space-24);
3595
+ background: #ffffff;
3578
3596
  }
3579
- body:has([data-shop-nav]) ._sheet_n0uqj_2 [data-sheet-handle] {
3597
+ body:has([data-shop-nav]) ._sheet_mvuuv_2 [data-sheet-handle] {
3580
3598
  visibility: hidden;
3581
3599
  }
3582
3600
  }
@@ -3675,12 +3693,12 @@
3675
3693
  background: var(--color-surface-soft);
3676
3694
  }
3677
3695
  }
3678
- ._root_1h4ny_1 {
3696
+ ._root_1jst2_1 {
3679
3697
  display: flex;
3680
3698
  flex-direction: column;
3681
3699
  gap: var(--space-12);
3682
3700
  }
3683
- ._header_1h4ny_9 {
3701
+ ._header_1jst2_9 {
3684
3702
  margin: 0;
3685
3703
  display: flex;
3686
3704
  align-items: center;
@@ -3688,20 +3706,20 @@
3688
3706
  font-size: var(--type-trimmed-md-size);
3689
3707
  line-height: var(--type-trimmed-md-line);
3690
3708
  }
3691
- ._title_1h4ny_18 {
3709
+ ._title_1jst2_18 {
3692
3710
  font-weight: var(--font-weight-bold);
3693
3711
  color: var(--color-text-default);
3694
3712
  }
3695
- ._value_1h4ny_23 {
3713
+ ._value_1jst2_23 {
3696
3714
  font-weight: var(--font-weight-regular);
3697
3715
  color: var(--color-text-subtle);
3698
3716
  }
3699
- ._tiles_1h4ny_28 {
3717
+ ._tiles_1jst2_28 {
3700
3718
  display: flex;
3701
3719
  flex-wrap: wrap;
3702
3720
  gap: var(--space-8);
3703
3721
  }
3704
- ._tile_1h4ny_28 {
3722
+ ._tile_1jst2_28 {
3705
3723
  position: relative;
3706
3724
  width: 79px;
3707
3725
  height: 105px;
@@ -3711,25 +3729,25 @@
3711
3729
  background: transparent;
3712
3730
  cursor: pointer;
3713
3731
  }
3714
- ._selected_1h4ny_52 {
3732
+ ._selected_1jst2_52 {
3715
3733
  border-color: var(--color-surface-max);
3716
3734
  }
3717
- ._media_1h4ny_36 {
3735
+ ._media_1jst2_36 {
3718
3736
  position: absolute;
3719
3737
  inset: 0;
3720
3738
  border-radius: var(--radius-8);
3721
3739
  overflow: hidden;
3722
3740
  background: var(--color-surface-soft);
3723
3741
  }
3724
- ._image_1h4ny_64 {
3742
+ ._image_1jst2_64 {
3725
3743
  object-fit: cover;
3726
3744
  }
3727
- ._placeholder_1h4ny_68 {
3745
+ ._placeholder_1jst2_68 {
3728
3746
  position: absolute;
3729
3747
  inset: 0;
3730
3748
  background: var(--color-surface-soft);
3731
3749
  }
3732
- ._scrim_1h4ny_76 {
3750
+ ._scrim_1jst2_76 {
3733
3751
  position: absolute;
3734
3752
  inset: 0;
3735
3753
  display: flex;
@@ -3742,7 +3760,7 @@
3742
3760
  font-weight: var(--font-weight-bold);
3743
3761
  text-align: center;
3744
3762
  }
3745
- ._stockBadge_1h4ny_95 {
3763
+ ._stockBadge_1jst2_95 {
3746
3764
  position: absolute;
3747
3765
  top: -10px;
3748
3766
  left: 50px;
@@ -3760,6 +3778,12 @@
3760
3778
  white-space: nowrap;
3761
3779
  pointer-events: none;
3762
3780
  }
3781
+ @media (min-width: 1200px) {
3782
+ ._tile_1jst2_28 {
3783
+ width: 80px;
3784
+ height: 106px;
3785
+ }
3786
+ }
3763
3787
  ._fieldset_1mnz1_1 {
3764
3788
  border: none;
3765
3789
  margin: 0;
@@ -4041,7 +4065,7 @@
4041
4065
  padding: 0;
4042
4066
  }
4043
4067
  }
4044
- ._hero_1747w_10 {
4068
+ ._hero_ht1e0_10 {
4045
4069
  --hero-height: clamp(480px, calc(100svh - var(--hero-top, 0px)), 812px);
4046
4070
  position: relative;
4047
4071
  height: var(--hero-height);
@@ -4049,15 +4073,15 @@
4049
4073
  background: var(--color-surface-default);
4050
4074
  margin-bottom: calc(var(--hero-height) * -237 / 812);
4051
4075
  }
4052
- ._image_1747w_42 {
4076
+ ._image_ht1e0_42 {
4053
4077
  position: absolute;
4054
4078
  inset: 0;
4055
4079
  }
4056
- ._image_1747w_42 img {
4080
+ ._image_ht1e0_42 img {
4057
4081
  object-fit: cover;
4058
4082
  object-position: top center;
4059
4083
  }
4060
- ._scrim_1747w_70 {
4084
+ ._scrim_ht1e0_70 {
4061
4085
  position: absolute;
4062
4086
  inset: 0;
4063
4087
  background:
@@ -4067,7 +4091,7 @@
4067
4091
  rgba(0, 0, 0, 0.1) 45%,
4068
4092
  rgba(0, 0, 0, 0) 70%);
4069
4093
  }
4070
- ._fade_1747w_94 {
4094
+ ._fade_ht1e0_94 {
4071
4095
  position: absolute;
4072
4096
  right: 0;
4073
4097
  bottom: 0;
@@ -4080,7 +4104,7 @@
4080
4104
  rgba(8, 14, 18, 0.65) 55%,
4081
4105
  var(--color-surface-default) 100%);
4082
4106
  }
4083
- ._text_1747w_108 {
4107
+ ._text_ht1e0_108 {
4084
4108
  position: absolute;
4085
4109
  top: max(var(--space-12), calc(65px - var(--hero-top, 0px)));
4086
4110
  left: 0;
@@ -4092,7 +4116,7 @@
4092
4116
  padding: var(--space-12) var(--space-24) var(--space-24);
4093
4117
  text-align: center;
4094
4118
  }
4095
- ._title_1747w_157 {
4119
+ ._title_ht1e0_157 {
4096
4120
  width: 327px;
4097
4121
  max-width: 100%;
4098
4122
  margin: 0;
@@ -4102,7 +4126,7 @@
4102
4126
  color: #f9fafa;
4103
4127
  text-wrap: balance;
4104
4128
  }
4105
- ._subtitle_1747w_168 {
4129
+ ._subtitle_ht1e0_168 {
4106
4130
  width: 224px;
4107
4131
  max-width: 100%;
4108
4132
  margin: 0;
@@ -4111,40 +4135,40 @@
4111
4135
  font-weight: var(--font-weight-regular);
4112
4136
  color: #f9fafa;
4113
4137
  }
4114
- ._noImage_1747w_183 {
4138
+ ._noImage_ht1e0_183 {
4115
4139
  height: auto;
4116
4140
  min-height: 0;
4117
4141
  max-height: none;
4118
4142
  margin-bottom: 0;
4119
4143
  }
4120
- ._noImage_1747w_183 ._text_1747w_108 {
4144
+ ._noImage_ht1e0_183 ._text_ht1e0_108 {
4121
4145
  position: static;
4122
4146
  padding-top: var(--space-24);
4123
4147
  }
4124
- ._noImage_1747w_183 ._title_1747w_157,
4125
- ._noImage_1747w_183 ._subtitle_1747w_168 {
4148
+ ._noImage_ht1e0_183 ._title_ht1e0_157,
4149
+ ._noImage_ht1e0_183 ._subtitle_ht1e0_168 {
4126
4150
  color: var(--color-text-default);
4127
4151
  }
4128
4152
  @media (min-width: 1200px) {
4129
- [data-shop-layout=wide] ._hero_1747w_10:not(._noImage_1747w_183) {
4153
+ [data-shop-layout=wide] ._hero_ht1e0_10:not(._noImage_ht1e0_183) {
4130
4154
  height: 567px;
4131
4155
  margin-bottom: 0;
4132
4156
  overflow: visible;
4133
4157
  }
4134
- [data-shop-layout=wide] ._image_1747w_42,
4135
- [data-shop-layout=wide] ._fade_1747w_94 {
4158
+ [data-shop-layout=wide] ._image_ht1e0_42,
4159
+ [data-shop-layout=wide] ._fade_ht1e0_94 {
4136
4160
  top: 0;
4137
4161
  bottom: auto;
4138
4162
  height: 810px;
4139
4163
  }
4140
- [data-shop-layout=wide] ._fade_1747w_94 {
4164
+ [data-shop-layout=wide] ._fade_ht1e0_94 {
4141
4165
  background:
4142
4166
  linear-gradient(
4143
4167
  to bottom,
4144
4168
  rgba(8, 14, 18, 0) 46.235%,
4145
4169
  #080e12 90.756%);
4146
4170
  }
4147
- [data-shop-layout=wide] ._scrim_1747w_70 {
4171
+ [data-shop-layout=wide] ._scrim_ht1e0_70 {
4148
4172
  bottom: auto;
4149
4173
  height: 240px;
4150
4174
  background:
@@ -4153,9 +4177,9 @@
4153
4177
  rgba(8, 14, 18, 0.7),
4154
4178
  rgba(8, 14, 18, 0));
4155
4179
  }
4156
- [data-shop-layout=wide] ._text_1747w_108 {
4180
+ [data-shop-layout=wide] ._text_ht1e0_108 {
4157
4181
  top: 477px;
4158
- left: max(176px, calc((100% - 1088px) / 2));
4182
+ left: calc((100% - min(1088px, 100%)) / 2);
4159
4183
  right: auto;
4160
4184
  width: 560px;
4161
4185
  align-items: flex-start;
@@ -4163,20 +4187,20 @@
4163
4187
  padding: 0;
4164
4188
  text-align: left;
4165
4189
  }
4166
- [data-shop-layout=wide] ._noImage_1747w_183 ._text_1747w_108 {
4190
+ [data-shop-layout=wide] ._noImage_ht1e0_183 ._text_ht1e0_108 {
4167
4191
  position: static;
4168
4192
  width: min(1088px, 100%);
4169
4193
  margin: 0 auto;
4170
4194
  padding-top: 88px;
4171
4195
  }
4172
- [data-shop-layout=wide] ._title_1747w_157 {
4196
+ [data-shop-layout=wide] ._title_ht1e0_157 {
4173
4197
  width: auto;
4174
4198
  font-size: 64px;
4175
4199
  line-height: 0.9375;
4176
4200
  letter-spacing: -0.64px;
4177
4201
  white-space: nowrap;
4178
4202
  }
4179
- [data-shop-layout=wide] ._subtitle_1747w_168 {
4203
+ [data-shop-layout=wide] ._subtitle_ht1e0_168 {
4180
4204
  width: 520px;
4181
4205
  font-size: 20px;
4182
4206
  line-height: 1.4;
@@ -4211,17 +4235,17 @@
4211
4235
  line-height: 1.1;
4212
4236
  }
4213
4237
  }
4214
- ._wrap_15g6o_10 {
4238
+ ._wrap_1p70i_10 {
4215
4239
  padding: var(--space-24) 0;
4216
4240
  }
4217
- ._box_15g6o_14 {
4241
+ ._box_1p70i_14 {
4218
4242
  position: relative;
4219
4243
  width: 100%;
4220
4244
  aspect-ratio: 3 / 4;
4221
4245
  overflow: hidden;
4222
4246
  background: var(--color-surface-soft);
4223
4247
  }
4224
- ._track_15g6o_23 {
4248
+ ._track_1p70i_23 {
4225
4249
  display: flex;
4226
4250
  list-style: none;
4227
4251
  margin: 0;
@@ -4232,22 +4256,22 @@
4232
4256
  -webkit-overflow-scrolling: touch;
4233
4257
  scrollbar-width: none;
4234
4258
  }
4235
- ._track_15g6o_23::-webkit-scrollbar {
4259
+ ._track_1p70i_23::-webkit-scrollbar {
4236
4260
  display: none;
4237
4261
  }
4238
- ._slide_15g6o_39 {
4262
+ ._slide_1p70i_39 {
4239
4263
  position: relative;
4240
4264
  flex: 0 0 100%;
4241
4265
  height: 100%;
4242
4266
  scroll-snap-align: start;
4243
4267
  }
4244
- ._image_15g6o_46 {
4268
+ ._image_1p70i_46 {
4245
4269
  object-fit: cover;
4246
4270
  }
4247
- ._desktopArt_15g6o_50 {
4271
+ ._desktopArt_1p70i_50 {
4248
4272
  display: none;
4249
4273
  }
4250
- ._dots_15g6o_55 {
4274
+ ._dots_1p70i_55 {
4251
4275
  position: absolute;
4252
4276
  bottom: 0;
4253
4277
  left: 0;
@@ -4259,28 +4283,28 @@
4259
4283
  gap: var(--space-8);
4260
4284
  pointer-events: none;
4261
4285
  }
4262
- ._dot_15g6o_55 {
4286
+ ._dot_1p70i_55 {
4263
4287
  width: 8px;
4264
4288
  height: 8px;
4265
4289
  border-radius: var(--radius-full);
4266
4290
  background: #9ea2a4;
4267
4291
  }
4268
- ._dotActive_15g6o_80 {
4292
+ ._dotActive_1p70i_80 {
4269
4293
  background: #f9fafa;
4270
4294
  }
4271
4295
  @media (min-width: 1200px) {
4272
- ._phoneArt_15g6o_85 {
4296
+ ._phoneArt_1p70i_85 {
4273
4297
  display: none;
4274
4298
  }
4275
- ._desktopArt_15g6o_50 {
4299
+ ._desktopArt_1p70i_50 {
4276
4300
  display: block;
4277
4301
  }
4278
- [data-shop-layout=wide] ._wrap_15g6o_10 {
4302
+ [data-shop-layout=wide] ._wrap_1p70i_10 {
4279
4303
  align-self: stretch;
4280
4304
  padding: 0;
4281
4305
  }
4282
- [data-shop-layout=wide] ._box_15g6o_14 {
4283
- aspect-ratio: 1440 / 810;
4306
+ [data-shop-layout=wide] ._box_1p70i_14 {
4307
+ aspect-ratio: 720 / 449;
4284
4308
  }
4285
4309
  }
4286
4310
  ._section_rtuv5_1 {
@@ -4842,16 +4866,16 @@
4842
4866
  font-size: 16px;
4843
4867
  line-height: normal;
4844
4868
  }
4845
- ._showcase_sml7n_14 {
4869
+ ._showcase_px8r_14 {
4846
4870
  --chrome-bleed: 0px;
4847
4871
  background: #080e12;
4848
4872
  }
4849
4873
  @supports (-webkit-touch-callout: none) {
4850
- ._showcase_sml7n_14 {
4874
+ ._showcase_px8r_14 {
4851
4875
  --chrome-bleed: calc(3 * (100lvh - 100svh));
4852
4876
  }
4853
4877
  }
4854
- ._panel_sml7n_40 {
4878
+ ._panel_px8r_40 {
4855
4879
  position: relative;
4856
4880
  height: 100lvh;
4857
4881
  height: calc(100lvh + var(--chrome-bleed, 0px));
@@ -4861,14 +4885,14 @@
4861
4885
  overflow: hidden;
4862
4886
  background: #080e12;
4863
4887
  }
4864
- ._image_sml7n_93 {
4888
+ ._image_px8r_93 {
4865
4889
  object-fit: cover;
4866
4890
  object-position: 50% var(--slide-focal-y, 50%);
4867
4891
  }
4868
- ._desktopArt_sml7n_98 {
4892
+ ._desktopArt_px8r_98 {
4869
4893
  display: none;
4870
4894
  }
4871
- ._hero_sml7n_137::after {
4895
+ ._hero_px8r_137::after {
4872
4896
  content: "";
4873
4897
  position: absolute;
4874
4898
  inset: 0;
@@ -4883,7 +4907,7 @@
4883
4907
  rgba(8, 14, 18, 0) calc(520px + var(--chrome-bleed, 0px)));
4884
4908
  pointer-events: none;
4885
4909
  }
4886
- ._hero_sml7n_137 ._heroContent_sml7n_228 {
4910
+ ._hero_px8r_137 ._heroContent_px8r_228 {
4887
4911
  position: absolute;
4888
4912
  bottom: 32px;
4889
4913
  bottom: calc(32px + var(--chrome-bleed, 0px) + 100lvh - 100svh);
@@ -4895,7 +4919,7 @@
4895
4919
  gap: 24px;
4896
4920
  align-items: stretch;
4897
4921
  }
4898
- ._heroText_sml7n_252 {
4922
+ ._heroText_px8r_252 {
4899
4923
  display: flex;
4900
4924
  flex-direction: column;
4901
4925
  gap: 8px;
@@ -4903,11 +4927,11 @@
4903
4927
  padding: 0 24px;
4904
4928
  text-align: center;
4905
4929
  }
4906
- ._heroText_sml7n_252 ._logo_sml7n_261 {
4930
+ ._heroText_px8r_252 ._logo_px8r_261 {
4907
4931
  width: 48px;
4908
4932
  height: 48px;
4909
4933
  }
4910
- ._heroTitle_sml7n_281 {
4934
+ ._heroTitle_px8r_281 {
4911
4935
  width: 100%;
4912
4936
  margin: 0;
4913
4937
  font-family:
@@ -4922,33 +4946,33 @@
4922
4946
  letter-spacing: -1.12px;
4923
4947
  color: #f9fafa;
4924
4948
  }
4925
- ._heroSub_sml7n_305 {
4949
+ ._heroSub_px8r_305 {
4926
4950
  margin: 0;
4927
4951
  font-size: 16px;
4928
4952
  line-height: 1.55;
4929
4953
  color: #f9fafa;
4930
4954
  max-width: 327px;
4931
4955
  }
4932
- ._swipe_sml7n_324 {
4956
+ ._swipe_px8r_324 {
4933
4957
  display: flex;
4934
4958
  flex-direction: column;
4935
4959
  align-items: center;
4936
4960
  gap: 6px;
4937
4961
  padding: 8px 0;
4938
4962
  }
4939
- ._swipeLabel_sml7n_331 {
4963
+ ._swipeLabel_px8r_331 {
4940
4964
  margin: 0;
4941
4965
  font-size: 14px;
4942
4966
  line-height: 1;
4943
4967
  color: rgba(255, 255, 255, 0.54);
4944
4968
  }
4945
- ._chevron_sml7n_337 {
4969
+ ._chevron_px8r_337 {
4946
4970
  width: 24px;
4947
4971
  height: 24px;
4948
4972
  color: rgba(255, 255, 255, 0.54);
4949
- animation: _bob_sml7n_1 1.8s ease-in-out infinite;
4973
+ animation: _bob_px8r_1 1.8s ease-in-out infinite;
4950
4974
  }
4951
- @keyframes _bob_sml7n_1 {
4975
+ @keyframes _bob_px8r_1 {
4952
4976
  0%, 100% {
4953
4977
  transform: translateY(0);
4954
4978
  }
@@ -4956,7 +4980,7 @@
4956
4980
  transform: translateY(4px);
4957
4981
  }
4958
4982
  }
4959
- ._overlay_sml7n_11 {
4983
+ ._overlay_px8r_11 {
4960
4984
  position: absolute;
4961
4985
  inset: 0;
4962
4986
  z-index: 1;
@@ -4977,7 +5001,7 @@
4977
5001
  padding: 0 0 32px;
4978
5002
  padding-bottom: calc(32px + var(--chrome-bleed, 0px) + 100lvh - 100svh);
4979
5003
  }
4980
- ._copy_sml7n_374 {
5004
+ ._copy_px8r_374 {
4981
5005
  position: absolute;
4982
5006
  top: 77px;
4983
5007
  left: 0;
@@ -4989,7 +5013,7 @@
4989
5013
  padding: 12px 24px 24px;
4990
5014
  text-align: center;
4991
5015
  }
4992
- ._title_sml7n_386 {
5016
+ ._title_px8r_386 {
4993
5017
  width: 327px;
4994
5018
  max-width: 100%;
4995
5019
  margin: 0;
@@ -4998,7 +5022,7 @@
4998
5022
  font-weight: 700;
4999
5023
  color: #f9fafa;
5000
5024
  }
5001
- ._subtitle_sml7n_395 {
5025
+ ._subtitle_px8r_395 {
5002
5026
  width: 224px;
5003
5027
  max-width: 100%;
5004
5028
  margin: 0;
@@ -5006,7 +5030,7 @@
5006
5030
  line-height: 1;
5007
5031
  color: #f9fafa;
5008
5032
  }
5009
- ._cta_sml7n_403 {
5033
+ ._cta_px8r_403 {
5010
5034
  display: inline-flex;
5011
5035
  align-items: center;
5012
5036
  justify-content: center;
@@ -5020,32 +5044,32 @@
5020
5044
  font-weight: 700;
5021
5045
  text-decoration: none;
5022
5046
  }
5023
- ._cta_sml7n_403::after {
5047
+ ._cta_px8r_403::after {
5024
5048
  content: "";
5025
5049
  position: absolute;
5026
5050
  inset: 0;
5027
5051
  }
5028
- ._cta_sml7n_403:active {
5052
+ ._cta_px8r_403:active {
5029
5053
  background: rgba(249, 250, 250, 0.12);
5030
5054
  }
5031
- ._cta_sml7n_403:focus-visible {
5055
+ ._cta_px8r_403:focus-visible {
5032
5056
  outline: none;
5033
5057
  box-shadow: var(--focus-ring);
5034
5058
  }
5035
- ._mosaic_sml7n_447 {
5059
+ ._mosaic_px8r_447 {
5036
5060
  background: #080e12;
5037
5061
  }
5038
- ._showcase_sml7n_14[data-viewport=fixed] {
5062
+ ._showcase_px8r_14[data-viewport=fixed] {
5039
5063
  --chrome-bleed: 0px;
5040
5064
  }
5041
- ._info_sml7n_459 {
5065
+ ._info_px8r_459 {
5042
5066
  display: contents;
5043
5067
  }
5044
- ._art_sml7n_463 {
5068
+ ._art_px8r_463 {
5045
5069
  position: absolute;
5046
5070
  inset: 0;
5047
5071
  }
5048
- ._band_sml7n_468 {
5072
+ ._band_px8r_468 {
5049
5073
  position: relative;
5050
5074
  z-index: 1;
5051
5075
  display: flex;
@@ -5053,7 +5077,7 @@
5053
5077
  gap: 12px;
5054
5078
  width: 100%;
5055
5079
  }
5056
- ._bandTitle_sml7n_477 {
5080
+ ._bandTitle_px8r_477 {
5057
5081
  margin: 0;
5058
5082
  padding: 0 16px;
5059
5083
  overflow: hidden;
@@ -5064,7 +5088,7 @@
5064
5088
  text-overflow: ellipsis;
5065
5089
  white-space: nowrap;
5066
5090
  }
5067
- ._products_sml7n_489 {
5091
+ ._products_px8r_489 {
5068
5092
  display: flex;
5069
5093
  gap: 12px;
5070
5094
  margin: 0;
@@ -5074,18 +5098,18 @@
5074
5098
  -webkit-overflow-scrolling: touch;
5075
5099
  scrollbar-width: none;
5076
5100
  }
5077
- ._products_sml7n_489::-webkit-scrollbar {
5101
+ ._products_px8r_489::-webkit-scrollbar {
5078
5102
  display: none;
5079
5103
  }
5080
- ._products_sml7n_489 > li {
5104
+ ._products_px8r_489 > li {
5081
5105
  flex: 0 0 auto;
5082
5106
  width: 135px;
5083
5107
  }
5084
- ._wideOnly_sml7n_509 {
5108
+ ._wideOnly_px8r_509 {
5085
5109
  display: none;
5086
5110
  }
5087
5111
  @media (max-width: 1199.98px) {
5088
- ._cta_sml7n_403 {
5112
+ ._cta_px8r_403 {
5089
5113
  position: absolute;
5090
5114
  inset: 0;
5091
5115
  min-height: 0;
@@ -5095,40 +5119,40 @@
5095
5119
  font-size: 0;
5096
5120
  color: transparent;
5097
5121
  }
5098
- ._cta_sml7n_403:active {
5122
+ ._cta_px8r_403:active {
5099
5123
  background: transparent;
5100
5124
  }
5101
- ._cta_sml7n_403:focus-visible {
5125
+ ._cta_px8r_403:focus-visible {
5102
5126
  box-shadow: inset 0 0 0 2px #ffffff, inset 0 0 0 4px #080e12;
5103
5127
  }
5104
5128
  }
5105
5129
  @media (min-width: 1200px) {
5106
- ._phoneOnly_sml7n_535,
5107
- ._phoneArt_sml7n_536 {
5130
+ ._phoneOnly_px8r_535,
5131
+ ._phoneArt_px8r_536 {
5108
5132
  display: none;
5109
5133
  }
5110
- ._desktopArt_sml7n_98 {
5134
+ ._desktopArt_px8r_98 {
5111
5135
  display: block;
5112
5136
  }
5113
- ._desktopArt_sml7n_98,
5114
- ._desktopFocal_sml7n_545 {
5137
+ ._desktopArt_px8r_98,
5138
+ ._desktopFocal_px8r_545 {
5115
5139
  object-position: 50% 50%;
5116
5140
  }
5117
- ._wideOnly_sml7n_509 {
5141
+ ._wideOnly_px8r_509 {
5118
5142
  display: inline;
5119
5143
  }
5120
- ._panel_sml7n_40 {
5144
+ ._panel_px8r_40 {
5121
5145
  height: max(100vh, 640px);
5122
5146
  scroll-margin-bottom: 0;
5123
5147
  }
5124
- ._mosaic_sml7n_447 {
5148
+ ._mosaic_px8r_447 {
5125
5149
  display: none;
5126
5150
  }
5127
- ._hero_sml7n_137 {
5151
+ ._hero_px8r_137 {
5128
5152
  height: max(calc(100vh - var(--shop-chrome-top, 0px)), 576px);
5129
5153
  scroll-margin-top: var(--shop-chrome-top, 0px);
5130
5154
  }
5131
- ._hero_sml7n_137::after {
5155
+ ._hero_px8r_137::after {
5132
5156
  background:
5133
5157
  linear-gradient(
5134
5158
  to bottom,
@@ -5139,47 +5163,47 @@
5139
5163
  rgba(8, 14, 18, 0) 50%,
5140
5164
  #080e12 100%);
5141
5165
  }
5142
- ._hero_sml7n_137 ._heroContent_sml7n_228 {
5166
+ ._hero_px8r_137 ._heroContent_px8r_228 {
5143
5167
  bottom: 16px;
5144
5168
  gap: 60px;
5145
5169
  align-items: center;
5146
5170
  }
5147
- ._heroText_sml7n_252 {
5171
+ ._heroText_px8r_252 {
5148
5172
  width: 677px;
5149
5173
  gap: 16px;
5150
5174
  padding: 0;
5151
5175
  }
5152
- ._heroText_sml7n_252 ._logo_sml7n_261 {
5176
+ ._heroText_px8r_252 ._logo_px8r_261 {
5153
5177
  width: 56px;
5154
5178
  height: 56px;
5155
5179
  }
5156
- ._heroTitle_sml7n_281 {
5180
+ ._heroTitle_px8r_281 {
5157
5181
  font-family: inherit;
5158
5182
  font-size: 64px;
5159
5183
  line-height: 0.9375;
5160
5184
  letter-spacing: -0.64px;
5161
5185
  }
5162
- ._heroSub_sml7n_305 {
5186
+ ._heroSub_px8r_305 {
5163
5187
  max-width: none;
5164
5188
  font-size: 20px;
5165
5189
  line-height: 1.4;
5166
5190
  }
5167
- ._showcase_sml7n_14 {
5191
+ ._showcase_px8r_14 {
5168
5192
  --cover-block: max(100vh, 640px);
5169
5193
  }
5170
- ._panel_sml7n_40[data-desktop] {
5194
+ ._panel_px8r_40[data-desktop] {
5171
5195
  height: auto;
5172
5196
  overflow: visible;
5173
5197
  }
5174
- ._panel_sml7n_40[data-desktop=products] ._art_sml7n_463 {
5198
+ ._panel_px8r_40[data-desktop=products] ._art_px8r_463 {
5175
5199
  display: none;
5176
5200
  }
5177
- ._panel_sml7n_40[data-desktop=cover] ._art_sml7n_463 {
5201
+ ._panel_px8r_40[data-desktop=cover] ._art_px8r_463 {
5178
5202
  inset: 0 0 auto;
5179
5203
  height: var(--cover-block);
5180
5204
  overflow: hidden;
5181
5205
  }
5182
- ._panel_sml7n_40[data-desktop=cover] ._art_sml7n_463::after {
5206
+ ._panel_px8r_40[data-desktop=cover] ._art_px8r_463::after {
5183
5207
  content: "";
5184
5208
  position: absolute;
5185
5209
  inset: 0;
@@ -5195,7 +5219,7 @@
5195
5219
  #080e12 100%);
5196
5220
  pointer-events: none;
5197
5221
  }
5198
- ._overlay_sml7n_11 {
5222
+ ._overlay_px8r_11 {
5199
5223
  position: relative;
5200
5224
  inset: auto;
5201
5225
  flex-direction: column;
@@ -5207,16 +5231,16 @@
5207
5231
  }
5208
5232
  @supports (animation-timeline: view()) {
5209
5233
  @media (prefers-reduced-motion: no-preference) {
5210
- ._panel_sml7n_40[data-desktop=cover] {
5234
+ ._panel_px8r_40[data-desktop=cover] {
5211
5235
  view-timeline: --cover-panel block;
5212
5236
  }
5213
- ._panel_sml7n_40[data-desktop=cover] ._art_sml7n_463 ._image_sml7n_93 {
5214
- animation: _coverParallax_sml7n_1 linear both;
5237
+ ._panel_px8r_40[data-desktop=cover] ._art_px8r_463 ._image_px8r_93 {
5238
+ animation: _coverParallax_px8r_1 linear both;
5215
5239
  animation-timeline: --cover-panel;
5216
5240
  animation-range: cover;
5217
5241
  will-change: transform;
5218
5242
  }
5219
- @keyframes _coverParallax_sml7n_1 {
5243
+ @keyframes _coverParallax_px8r_1 {
5220
5244
  from {
5221
5245
  transform: translateY(-12%) scale(1.25);
5222
5246
  }
@@ -5226,10 +5250,13 @@
5226
5250
  }
5227
5251
  }
5228
5252
  }
5229
- ._panel_sml7n_40[data-desktop=cover] ._overlay_sml7n_11 {
5253
+ ._panel_px8r_40[data-desktop=products] ._overlay_px8r_11 {
5254
+ padding-top: calc(64px + var(--shop-chrome-top, 0px) + var(--shop-nav-height, 64px));
5255
+ }
5256
+ ._panel_px8r_40[data-desktop=cover] ._overlay_px8r_11 {
5230
5257
  padding-top: calc(var(--cover-block) - 339px);
5231
5258
  }
5232
- ._copy_sml7n_374 {
5259
+ ._copy_px8r_374 {
5233
5260
  position: static;
5234
5261
  width: 100%;
5235
5262
  align-items: stretch;
@@ -5237,33 +5264,33 @@
5237
5264
  padding: 0;
5238
5265
  text-align: center;
5239
5266
  }
5240
- ._panel_sml7n_40[data-desktop=cover] ._copy_sml7n_374 {
5267
+ ._panel_px8r_40[data-desktop=cover] ._copy_px8r_374 {
5241
5268
  padding-bottom: 16px;
5242
5269
  }
5243
- ._title_sml7n_386 {
5270
+ ._title_px8r_386 {
5244
5271
  width: auto;
5245
5272
  font-size: 56px;
5246
5273
  line-height: 1;
5247
5274
  }
5248
- ._subtitle_sml7n_395 {
5275
+ ._subtitle_px8r_395 {
5249
5276
  width: auto;
5250
5277
  font-size: 18px;
5251
5278
  line-height: normal;
5252
5279
  color: #b3b9bb;
5253
5280
  }
5254
- ._cta_sml7n_403 {
5281
+ ._cta_px8r_403 {
5255
5282
  order: 2;
5256
5283
  }
5257
- ._cta_sml7n_403::after {
5284
+ ._cta_px8r_403::after {
5258
5285
  content: none;
5259
5286
  }
5260
- ._band_sml7n_468 {
5287
+ ._band_px8r_468 {
5261
5288
  display: contents;
5262
5289
  }
5263
- ._bandTitle_sml7n_477 {
5290
+ ._bandTitle_px8r_477 {
5264
5291
  display: none;
5265
5292
  }
5266
- ._products_sml7n_489 {
5293
+ ._products_px8r_489 {
5267
5294
  --type-paragraph-size: 18px;
5268
5295
  --type-trimmed-md-size: 18px;
5269
5296
  order: 1;
@@ -5274,20 +5301,20 @@
5274
5301
  padding: 0;
5275
5302
  overflow: visible;
5276
5303
  }
5277
- ._products_sml7n_489 > li {
5304
+ ._products_px8r_489 > li {
5278
5305
  flex: 0 0 276px;
5279
5306
  width: 276px;
5280
5307
  }
5281
- ._diptych_sml7n_736 {
5308
+ ._diptych_px8r_740 {
5282
5309
  display: flex;
5283
5310
  height: var(--cover-block);
5284
5311
  }
5285
- ._tile_sml7n_741 {
5312
+ ._tile_px8r_745 {
5286
5313
  position: relative;
5287
5314
  flex: 1 1 50%;
5288
5315
  overflow: hidden;
5289
5316
  }
5290
- ._tile_sml7n_741::after {
5317
+ ._tile_px8r_745::after {
5291
5318
  content: "";
5292
5319
  position: absolute;
5293
5320
  inset: 0;
@@ -5298,7 +5325,7 @@
5298
5325
  rgba(8, 14, 18, 0.75) 100%);
5299
5326
  pointer-events: none;
5300
5327
  }
5301
- ._tileCopy_sml7n_755 {
5328
+ ._tileCopy_px8r_759 {
5302
5329
  position: absolute;
5303
5330
  left: 0;
5304
5331
  right: 0;
@@ -5310,19 +5337,19 @@
5310
5337
  gap: 24px;
5311
5338
  padding: 48px;
5312
5339
  }
5313
- ._tileText_sml7n_768 {
5340
+ ._tileText_px8r_772 {
5314
5341
  display: flex;
5315
5342
  flex-direction: column;
5316
5343
  gap: 8px;
5317
5344
  color: #f9fafa;
5318
5345
  }
5319
- ._tileTitle_sml7n_775 {
5346
+ ._tileTitle_px8r_779 {
5320
5347
  margin: 0;
5321
5348
  font-size: 32px;
5322
5349
  line-height: 1;
5323
5350
  font-weight: 700;
5324
5351
  }
5325
- ._tileSubtitle_sml7n_782 {
5352
+ ._tileSubtitle_px8r_786 {
5326
5353
  margin: 0;
5327
5354
  font-size: 18px;
5328
5355
  line-height: 23px;
@@ -5448,7 +5475,7 @@
5448
5475
  width: auto;
5449
5476
  text-align: center;
5450
5477
  }
5451
- ._overlay_sz96n_5 {
5478
+ ._overlay_y4mxb_5 {
5452
5479
  position: fixed;
5453
5480
  inset: 0;
5454
5481
  z-index: 900;
@@ -5457,12 +5484,12 @@
5457
5484
  justify-content: center;
5458
5485
  padding: calc(var(--header-height) + var(--space-16) + env(safe-area-inset-top, 0px)) var(--space-16) var(--space-16);
5459
5486
  }
5460
- ._scrim_sz96n_21 {
5487
+ ._scrim_y4mxb_21 {
5461
5488
  position: absolute;
5462
5489
  inset: 0;
5463
5490
  background: rgba(12, 22, 28, 0.32);
5464
5491
  }
5465
- ._sheet_sz96n_31 {
5492
+ ._sheet_y4mxb_31 {
5466
5493
  position: relative;
5467
5494
  width: 100%;
5468
5495
  max-width: 343px;
@@ -5473,13 +5500,13 @@
5473
5500
  border-radius: var(--radius-12);
5474
5501
  display: flex;
5475
5502
  flex-direction: column;
5476
- animation: _menu-in_sz96n_1 160ms ease;
5503
+ animation: _menu-in_y4mxb_1 160ms ease;
5477
5504
  scrollbar-width: none;
5478
5505
  }
5479
- ._sheet_sz96n_31::-webkit-scrollbar {
5506
+ ._sheet_y4mxb_31::-webkit-scrollbar {
5480
5507
  display: none;
5481
5508
  }
5482
- @keyframes _menu-in_sz96n_1 {
5509
+ @keyframes _menu-in_y4mxb_1 {
5483
5510
  from {
5484
5511
  opacity: 0;
5485
5512
  transform: translateY(-8px);
@@ -5490,16 +5517,16 @@
5490
5517
  }
5491
5518
  }
5492
5519
  @media (prefers-reduced-motion: reduce) {
5493
- ._sheet_sz96n_31 {
5520
+ ._sheet_y4mxb_31 {
5494
5521
  animation: none;
5495
5522
  }
5496
5523
  }
5497
- ._header_sz96n_80 {
5524
+ ._header_y4mxb_80 {
5498
5525
  display: flex;
5499
5526
  justify-content: flex-end;
5500
5527
  border-bottom: 1px solid rgba(249, 250, 250, 0.2);
5501
5528
  }
5502
- ._close_sz96n_86 {
5529
+ ._close_y4mxb_86 {
5503
5530
  display: inline-flex;
5504
5531
  align-items: center;
5505
5532
  justify-content: center;
@@ -5511,19 +5538,19 @@
5511
5538
  color: inherit;
5512
5539
  cursor: pointer;
5513
5540
  }
5514
- ._close_sz96n_86:focus-visible {
5541
+ ._close_y4mxb_86:focus-visible {
5515
5542
  outline: none;
5516
5543
  box-shadow: var(--focus-ring);
5517
5544
  border-radius: var(--radius-4);
5518
5545
  }
5519
- ._list_sz96n_105 {
5546
+ ._list_y4mxb_105 {
5520
5547
  list-style: none;
5521
5548
  margin: 0;
5522
5549
  padding: var(--space-6) 0;
5523
5550
  display: flex;
5524
5551
  flex-direction: column;
5525
5552
  }
5526
- ._row_sz96n_120 {
5553
+ ._row_y4mxb_120 {
5527
5554
  display: flex;
5528
5555
  align-items: center;
5529
5556
  gap: var(--space-8);
@@ -5536,39 +5563,39 @@
5536
5563
  text-align: left;
5537
5564
  cursor: pointer;
5538
5565
  }
5539
- ._row_sz96n_120[disabled] {
5566
+ ._row_y4mxb_120[disabled] {
5540
5567
  cursor: default;
5541
5568
  }
5542
- ._row_sz96n_120:focus-visible {
5569
+ ._row_y4mxb_120:focus-visible {
5543
5570
  outline: none;
5544
5571
  box-shadow: var(--focus-ring);
5545
5572
  }
5546
- ._icon_sz96n_149 {
5573
+ ._icon_y4mxb_149 {
5547
5574
  display: inline-flex;
5548
5575
  flex: 0 0 24px;
5549
5576
  width: 24px;
5550
5577
  height: 24px;
5551
5578
  color: var(--color-text-default);
5552
5579
  }
5553
- ._text_sz96n_157 {
5580
+ ._text_y4mxb_157 {
5554
5581
  display: flex;
5555
5582
  flex: 1 1 auto;
5556
5583
  flex-direction: column;
5557
5584
  gap: var(--space-2);
5558
5585
  min-width: 0;
5559
5586
  }
5560
- ._title_sz96n_165 {
5587
+ ._title_y4mxb_165 {
5561
5588
  font-size: var(--type-paragraph-size);
5562
5589
  font-weight: var(--font-weight-bold);
5563
5590
  line-height: 1;
5564
5591
  color: var(--color-text-default);
5565
5592
  }
5566
- ._subtitle_sz96n_172 {
5593
+ ._subtitle_y4mxb_172 {
5567
5594
  font-size: var(--type-trimmed-xs-size);
5568
5595
  line-height: 1.52;
5569
5596
  color: var(--color-text-subtle);
5570
5597
  }
5571
- ._chevron_sz96n_178 {
5598
+ ._chevron_y4mxb_178 {
5572
5599
  display: inline-flex;
5573
5600
  flex: 0 0 16px;
5574
5601
  width: 16px;
@@ -5576,13 +5603,13 @@
5576
5603
  color: var(--color-text-subtle);
5577
5604
  }
5578
5605
  @media (min-width: 1200px) {
5579
- ._dropdown_sz96n_187 {
5606
+ ._dropdown_y4mxb_187 {
5580
5607
  padding: 0;
5581
5608
  }
5582
- ._dropdown_sz96n_187 ._scrim_sz96n_21 {
5609
+ ._dropdown_y4mxb_187 ._scrim_y4mxb_21 {
5583
5610
  background: transparent;
5584
5611
  }
5585
- ._dropdown_sz96n_187 ._sheet_sz96n_31 {
5612
+ ._dropdown_y4mxb_187 ._sheet_y4mxb_31 {
5586
5613
  position: absolute;
5587
5614
  top: calc(var(--shop-chrome-top, 0px) + 64px);
5588
5615
  right: calc(max(176px, calc((100% - 1088px) / 2)) - 8px);
@@ -5593,15 +5620,21 @@
5593
5620
  background: #f9fafa;
5594
5621
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
5595
5622
  }
5596
- ._dropdown_sz96n_187 ._list_sz96n_105 li:not(:last-child) ._row_sz96n_120 {
5623
+ ._dropdown_y4mxb_187 ._row_y4mxb_120 {
5624
+ min-height: 58px;
5625
+ }
5626
+ ._dropdown_y4mxb_187 ._list_y4mxb_105 li[data-row^=category-] + li[data-row=orders] {
5627
+ margin-top: var(--space-8);
5628
+ }
5629
+ ._dropdown_y4mxb_187 ._list_y4mxb_105 li:not(:last-child) ._row_y4mxb_120 {
5597
5630
  border-bottom: 1px solid #dddedf;
5598
5631
  }
5599
5632
  }
5600
- ._bar_z6nk8_1 {
5633
+ ._bar_10bv8_1 {
5601
5634
  display: none;
5602
5635
  }
5603
5636
  @media (min-width: 1200px) {
5604
- ._bar_z6nk8_1 {
5637
+ ._bar_10bv8_1 {
5605
5638
  position: sticky;
5606
5639
  top: var(--shop-chrome-top, 0px);
5607
5640
  z-index: 40;
@@ -5610,20 +5643,20 @@
5610
5643
  align-items: center;
5611
5644
  justify-content: space-between;
5612
5645
  width: 100%;
5613
- height: 64px;
5646
+ height: var(--shop-nav-height, 64px);
5614
5647
  padding: 0 max(176px, calc((100% - 1088px) / 2));
5615
5648
  font-family: var(--font-family-base);
5616
5649
  font-size: 16px;
5617
5650
  line-height: normal;
5618
5651
  }
5619
- ._media_z6nk8_22 {
5620
- margin-bottom: -64px;
5652
+ ._media_10bv8_22 {
5653
+ margin-bottom: calc(-1 * var(--shop-nav-height, 64px));
5621
5654
  background: rgba(8, 14, 18, 0.55);
5622
5655
  color: #f9fafa;
5623
5656
  --shop-nav-separator: rgba(249, 250, 250, 0.6);
5624
5657
  --shop-nav-trail: rgba(249, 250, 250, 0.7);
5625
5658
  }
5626
- ._light_z6nk8_30 {
5659
+ ._light_10bv8_30 {
5627
5660
  border-bottom: 1px solid rgba(8, 14, 18, 0.08);
5628
5661
  background: rgba(255, 255, 255, 0.85);
5629
5662
  -webkit-backdrop-filter: blur(12px);
@@ -5633,11 +5666,11 @@
5633
5666
  --shop-nav-trail: rgba(8, 14, 18, 0.7);
5634
5667
  }
5635
5668
  }
5636
- ._crumbs_z6nk8_41 {
5669
+ ._crumbs_10bv8_41 {
5637
5670
  min-width: 0;
5638
5671
  overflow: hidden;
5639
5672
  }
5640
- ._list_z6nk8_46 {
5673
+ ._list_10bv8_46 {
5641
5674
  display: flex;
5642
5675
  align-items: center;
5643
5676
  gap: 12px;
@@ -5646,41 +5679,41 @@
5646
5679
  list-style: none;
5647
5680
  white-space: nowrap;
5648
5681
  }
5649
- ._item_z6nk8_56 {
5682
+ ._item_10bv8_56 {
5650
5683
  display: flex;
5651
5684
  align-items: center;
5652
5685
  gap: 12px;
5653
5686
  min-width: 0;
5654
5687
  }
5655
- ._root_z6nk8_63,
5656
- ._trail_z6nk8_64,
5657
- ._current_z6nk8_65 {
5688
+ ._root_10bv8_63,
5689
+ ._trail_10bv8_64,
5690
+ ._current_10bv8_65 {
5658
5691
  color: inherit;
5659
5692
  text-decoration: none;
5660
5693
  }
5661
- ._root_z6nk8_63 {
5694
+ ._root_10bv8_63 {
5662
5695
  font-weight: var(--font-weight-bold);
5663
5696
  }
5664
- ._trail_z6nk8_64 {
5697
+ ._trail_10bv8_64 {
5665
5698
  font-weight: var(--font-weight-regular);
5666
5699
  color: var(--shop-nav-trail);
5667
5700
  }
5668
- ._current_z6nk8_65 {
5701
+ ._current_10bv8_65 {
5669
5702
  overflow: hidden;
5670
5703
  text-overflow: ellipsis;
5671
5704
  font-weight: var(--font-weight-regular);
5672
5705
  }
5673
- ._separator_z6nk8_85 {
5706
+ ._separator_10bv8_85 {
5674
5707
  font-weight: var(--font-weight-regular);
5675
5708
  color: var(--shop-nav-separator);
5676
5709
  }
5677
- ._actions_z6nk8_90 {
5710
+ ._actions_10bv8_90 {
5678
5711
  display: flex;
5679
5712
  flex-shrink: 0;
5680
5713
  align-items: center;
5681
5714
  gap: var(--space-16);
5682
5715
  }
5683
- ._iconBtn_z6nk8_97 {
5716
+ ._iconBtn_10bv8_97 {
5684
5717
  position: relative;
5685
5718
  display: inline-flex;
5686
5719
  align-items: center;
@@ -5694,19 +5727,19 @@
5694
5727
  cursor: pointer;
5695
5728
  text-decoration: none;
5696
5729
  }
5697
- ._iconBtn_z6nk8_97::after {
5730
+ ._iconBtn_10bv8_97::after {
5698
5731
  content: "";
5699
5732
  position: absolute;
5700
5733
  inset: -10px;
5701
5734
  }
5702
- ._iconBtn_z6nk8_97:focus-visible,
5703
- ._root_z6nk8_63:focus-visible,
5704
- ._trail_z6nk8_64:focus-visible {
5735
+ ._iconBtn_10bv8_97:focus-visible,
5736
+ ._root_10bv8_63:focus-visible,
5737
+ ._trail_10bv8_64:focus-visible {
5705
5738
  outline: 2px solid currentColor;
5706
5739
  outline-offset: 2px;
5707
5740
  border-radius: var(--radius-4);
5708
5741
  }
5709
- ._badge_z6nk8_126 {
5742
+ ._badge_10bv8_126 {
5710
5743
  position: absolute;
5711
5744
  top: -6px;
5712
5745
  left: 14px;