@digital-b2c/coreui-kit 0.2.0 → 0.2.1

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 CHANGED
@@ -1,23 +1,23 @@
1
1
  /* src/components/Picture/Picture.module.scss */
2
- .image-desktop {
2
+ .Picture_module_image-desktop {
3
3
  display: block;
4
4
  }
5
5
  @media (max-width: 768px) {
6
- .image-desktop {
6
+ .Picture_module_image-desktop {
7
7
  display: none;
8
8
  }
9
9
  }
10
- .image-mobile {
10
+ .Picture_module_image-mobile {
11
11
  display: none;
12
12
  }
13
13
  @media (max-width: 768px) {
14
- .image-mobile {
14
+ .Picture_module_image-mobile {
15
15
  display: block;
16
16
  }
17
17
  }
18
18
 
19
19
  /* src/components/Button/Button.module.scss */
20
- .button {
20
+ .Button_module_button {
21
21
  width: fit-content;
22
22
  overflow: hidden;
23
23
  cursor: pointer;
@@ -41,17 +41,17 @@
41
41
  position: relative;
42
42
  transition: all 0.2s ease-in-out;
43
43
  }
44
- .button:hover {
44
+ .Button_module_button:hover {
45
45
  text-decoration: none;
46
46
  background: rgba(255, 255, 255, 0.2);
47
47
  }
48
- .button:active {
48
+ .Button_module_button:active {
49
49
  background: rgba(255, 255, 255, 0.3019607843);
50
50
  }
51
- .button.fullWidth {
51
+ .Button_module_button.Button_module_fullWidth {
52
52
  width: 100%;
53
53
  }
54
- .button.primary {
54
+ .Button_module_button.Button_module_primary {
55
55
  color: var(--color-white);
56
56
  background:
57
57
  radial-gradient(
@@ -60,7 +60,7 @@
60
60
  #1b1b1b 100%);
61
61
  border: 1px solid #000000;
62
62
  }
63
- .button.primary:hover {
63
+ .Button_module_button.Button_module_primary:hover {
64
64
  background:
65
65
  linear-gradient(
66
66
  0deg,
@@ -71,10 +71,10 @@
71
71
  #000000 0%,
72
72
  #1b1b1b 100%);
73
73
  }
74
- .button.primary:active {
74
+ .Button_module_button.Button_module_primary:active {
75
75
  background: #0e0e0e;
76
76
  }
77
- .button.primary:focus {
77
+ .Button_module_button.Button_module_primary:focus {
78
78
  background:
79
79
  linear-gradient(
80
80
  0deg,
@@ -86,87 +86,87 @@
86
86
  #1b1b1b 100%);
87
87
  outline: 4px solid var(--color-link);
88
88
  }
89
- .button.secondary {
89
+ .Button_module_button.Button_module_secondary {
90
90
  color: var(--color-black);
91
91
  background: var(--color-white);
92
92
  border: 1px solid #c2c2c2;
93
93
  }
94
- .button.secondary:hover {
94
+ .Button_module_button.Button_module_secondary:hover {
95
95
  background: #eeeeee;
96
96
  }
97
- .button.secondary:active {
97
+ .Button_module_button.Button_module_secondary:active {
98
98
  background: #e3e3e3;
99
99
  }
100
- .button.secondary:focus {
100
+ .Button_module_button.Button_module_secondary:focus {
101
101
  background: #eeeeee;
102
102
  outline: 4px solid var(--color-link);
103
103
  }
104
- .button.ghost {
104
+ .Button_module_button.Button_module_ghost {
105
105
  color: var(--color-black);
106
106
  background: var(--color-white);
107
107
  border: none;
108
108
  }
109
- .button.ghost:hover {
109
+ .Button_module_button.Button_module_ghost:hover {
110
110
  background: #eeeeee;
111
111
  }
112
- .button.ghost:active {
112
+ .Button_module_button.Button_module_ghost:active {
113
113
  background: #c3c3c3;
114
114
  }
115
- .button.ghost:focus {
115
+ .Button_module_button.Button_module_ghost:focus {
116
116
  background: #eeeeee;
117
117
  outline: 4px solid var(--color-link);
118
118
  }
119
- .button.nofill {
119
+ .Button_module_button.Button_module_nofill {
120
120
  color: var(--color-white);
121
121
  background: transparent;
122
122
  border: none;
123
123
  }
124
- .button.nofill:hover {
124
+ .Button_module_button.Button_module_nofill:hover {
125
125
  background: rgba(255, 255, 255, 0.2);
126
126
  }
127
- .button.nofill:active {
127
+ .Button_module_button.Button_module_nofill:active {
128
128
  background: rgba(255, 255, 255, 0.3019607843);
129
129
  }
130
- .button.nofill:focus {
130
+ .Button_module_button.Button_module_nofill:focus {
131
131
  background: rgba(255, 255, 255, 0.2);
132
132
  outline: 4px solid var(--color-link);
133
133
  }
134
- .button.nofillblack {
134
+ .Button_module_button.Button_module_nofillblack {
135
135
  color: var(--color-black);
136
136
  background: transparent;
137
137
  border: none;
138
138
  }
139
- .button.nofillblack:hover {
139
+ .Button_module_button.Button_module_nofillblack:hover {
140
140
  background: rgba(229, 229, 229, 0.5019607843);
141
141
  }
142
- .button.nofillblack:active {
142
+ .Button_module_button.Button_module_nofillblack:active {
143
143
  background: rgba(203, 203, 203, 0.5019607843);
144
144
  }
145
- .button.nofillblack:focus {
145
+ .Button_module_button.Button_module_nofillblack:focus {
146
146
  background: rgba(229, 229, 229, 0.5019607843);
147
147
  outline: 4px solid var(--color-link);
148
148
  }
149
- .button.grey {
149
+ .Button_module_button.Button_module_grey {
150
150
  color: var(--color-white);
151
151
  background: transparent;
152
152
  border: 1px solid #949494;
153
153
  }
154
- .button.grey:hover {
154
+ .Button_module_button.Button_module_grey:hover {
155
155
  background: rgba(255, 255, 255, 0.2);
156
156
  }
157
- .button.grey:active {
157
+ .Button_module_button.Button_module_grey:active {
158
158
  background: rgba(93, 93, 93, 0.9019607843);
159
159
  }
160
- .button.grey:focus {
160
+ .Button_module_button.Button_module_grey:focus {
161
161
  background: rgba(255, 255, 255, 0.2);
162
162
  outline: 4px solid var(--color-link);
163
163
  }
164
- .button.shiny {
164
+ .Button_module_button.Button_module_shiny {
165
165
  color: var(--color-white);
166
166
  background: transparent;
167
167
  border: none;
168
168
  }
169
- .button.shiny::before {
169
+ .Button_module_button.Button_module_shiny::before {
170
170
  content: "";
171
171
  position: absolute;
172
172
  inset: 0;
@@ -177,27 +177,27 @@
177
177
  #ffffff,
178
178
  rgba(153, 153, 153, 0.39));
179
179
  border-radius: inherit;
180
- animation: rotateGradient 2s ease-in infinite;
180
+ animation: Button_module_rotateGradient 2s ease-in infinite;
181
181
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
182
182
  -webkit-mask-composite: xor;
183
183
  mask-composite: exclude;
184
184
  pointer-events: none;
185
185
  }
186
- .button.shiny:hover {
186
+ .Button_module_button.Button_module_shiny:hover {
187
187
  background: rgba(255, 255, 255, 0.2);
188
188
  }
189
- .button.shiny:focus {
189
+ .Button_module_button.Button_module_shiny:focus {
190
190
  background: transparent;
191
191
  outline: 4px solid var(--color-link);
192
192
  }
193
- .button .icon,
194
- .button .logo {
193
+ .Button_module_button .Button_module_icon,
194
+ .Button_module_button .Button_module_logo {
195
195
  width: 24px;
196
196
  height: 24px;
197
197
  object-fit: contain;
198
198
  }
199
199
  @property --angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
200
- @keyframes rotateGradient {
200
+ @keyframes Button_module_rotateGradient {
201
201
  from {
202
202
  --angle: 0deg;
203
203
  }
@@ -207,14 +207,14 @@
207
207
  }
208
208
 
209
209
  /* src/components/BrandsStrip/BrandsStrip.module.scss */
210
- .brandsStrip {
210
+ .BrandsStrip_module_brandsStrip {
211
211
  display: flex;
212
212
  height: 116px;
213
213
  padding: 16px;
214
214
  position: relative;
215
215
  overflow: hidden;
216
216
  }
217
- .brandsStrip.light {
217
+ .BrandsStrip_module_brandsStrip.BrandsStrip_module_light {
218
218
  background:
219
219
  linear-gradient(
220
220
  89.48deg,
@@ -222,7 +222,7 @@
222
222
  rgba(153, 153, 153, 0) 187.82%);
223
223
  backdrop-filter: blur(7.45513px);
224
224
  }
225
- .brandsStrip.light::before {
225
+ .BrandsStrip_module_brandsStrip.BrandsStrip_module_light::before {
226
226
  content: "";
227
227
  position: absolute;
228
228
  inset: 0;
@@ -238,17 +238,17 @@
238
238
  mask-composite: exclude;
239
239
  pointer-events: none;
240
240
  }
241
- .brandsStrip.dark {
241
+ .BrandsStrip_module_brandsStrip.BrandsStrip_module_dark {
242
242
  background-color: var(--color-black);
243
243
  }
244
- .brandsStrip.small {
244
+ .BrandsStrip_module_brandsStrip.BrandsStrip_module_small {
245
245
  height: 80px;
246
246
  }
247
- .brandsStrip.small .logoWrapper {
247
+ .BrandsStrip_module_brandsStrip.BrandsStrip_module_small .BrandsStrip_module_logoWrapper {
248
248
  height: 49px;
249
249
  width: 183px;
250
250
  }
251
- .brandsStrip .container {
251
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_container {
252
252
  position: relative;
253
253
  display: flex;
254
254
  justify-content: center;
@@ -258,25 +258,25 @@
258
258
  height: 100%;
259
259
  transition: filter 0.3s ease;
260
260
  }
261
- .brandsStrip .container .title {
261
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_container .BrandsStrip_module_title {
262
262
  color: var(--color-white);
263
263
  }
264
- .brandsStrip .container.blurred {
264
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_container.BrandsStrip_module_blurred {
265
265
  filter: blur(15px);
266
266
  cursor: pointer;
267
267
  }
268
- .brandsStrip .logos {
268
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_logos {
269
269
  display: flex;
270
270
  gap: 120px;
271
271
  }
272
- .brandsStrip .logos.marquee {
272
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_logos.BrandsStrip_module_marquee {
273
273
  position: relative;
274
274
  display: flex;
275
275
  align-items: center;
276
276
  width: 100%;
277
277
  height: 100%;
278
278
  }
279
- .brandsStrip .logos.marquee .logoWrapper {
279
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_logos.BrandsStrip_module_marquee .BrandsStrip_module_logoWrapper {
280
280
  --marquee-duration: 8s;
281
281
  --marquee-item-width: 258px;
282
282
  --marquee-gap: 120px;
@@ -284,13 +284,13 @@
284
284
  position: absolute;
285
285
  inset-inline-start: 100%;
286
286
  width: var(--marquee-item-width);
287
- animation: scrollIndividual var(--marquee-duration) linear infinite;
287
+ animation: BrandsStrip_module_scrollIndividual var(--marquee-duration) linear infinite;
288
288
  animation-delay: calc(var(--marquee-duration) / var(--total-items) * var(--item-index) * -1);
289
289
  }
290
- .brandsStrip .logos.marquee .logoWrapper.paused {
290
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_logos.BrandsStrip_module_marquee .BrandsStrip_module_logoWrapper.BrandsStrip_module_paused {
291
291
  animation-play-state: paused;
292
292
  }
293
- .brandsStrip .logoWrapper {
293
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_logoWrapper {
294
294
  flex-shrink: 0;
295
295
  height: 69px;
296
296
  width: 260px;
@@ -298,12 +298,12 @@
298
298
  align-items: center;
299
299
  justify-content: center;
300
300
  }
301
- .brandsStrip .logoWrapper .logo {
301
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_logoWrapper .BrandsStrip_module_logo {
302
302
  width: 100%;
303
303
  height: auto;
304
304
  object-fit: contain;
305
305
  }
306
- .brandsStrip .cta {
306
+ .BrandsStrip_module_brandsStrip .BrandsStrip_module_cta {
307
307
  position: absolute;
308
308
  top: 50%;
309
309
  left: 50%;
@@ -311,14 +311,14 @@
311
311
  z-index: 10;
312
312
  max-width: 295px;
313
313
  }
314
- @keyframes scrollIndividual {
314
+ @keyframes BrandsStrip_module_scrollIndividual {
315
315
  to {
316
316
  transform: translateX(calc(var(--total-distance) * -1));
317
317
  }
318
318
  }
319
319
 
320
320
  /* src/components/Card/Card.module.scss */
321
- .card {
321
+ .Card_module_card {
322
322
  display: flex;
323
323
  flex-direction: column;
324
324
  border-radius: 8px;
@@ -327,15 +327,15 @@
327
327
  background: var(--color-gradient-black);
328
328
  min-width: 308px;
329
329
  }
330
- .card h3 {
330
+ .Card_module_card h3 {
331
331
  color: var(--color-white);
332
332
  }
333
- .card p {
333
+ .Card_module_card p {
334
334
  color: #cecece;
335
335
  }
336
336
 
337
337
  /* src/components/CountingCard/CountingCard.module.scss */
338
- .counting-card {
338
+ .CountingCard_module_counting-card {
339
339
  display: flex;
340
340
  flex-direction: column;
341
341
  border-radius: 16px;
@@ -345,29 +345,29 @@
345
345
  width: 314px;
346
346
  color: var(--color-white);
347
347
  }
348
- .counting-card .count::after {
348
+ .CountingCard_module_counting-card .CountingCard_module_count::after {
349
349
  content: "+";
350
350
  }
351
- .counting-card .logo {
351
+ .CountingCard_module_counting-card .CountingCard_module_logo {
352
352
  max-height: 67px;
353
353
  filter: brightness(0) invert(1);
354
354
  }
355
355
 
356
356
  /* src/components/InfoCard/InfoCard.module.scss */
357
- .info-card {
357
+ .InfoCard_module_info-card {
358
358
  width: 100%;
359
359
  display: flex;
360
360
  flex-direction: column;
361
361
  padding: var(--spacing-lg);
362
362
  gap: var(--spacing-md);
363
363
  }
364
- .info-card .header {
364
+ .InfoCard_module_info-card .InfoCard_module_header {
365
365
  display: flex;
366
366
  flex-direction: row;
367
367
  gap: var(--spacing-md);
368
368
  color: var(--color-black);
369
369
  }
370
- .info-card .badge {
370
+ .InfoCard_module_info-card .InfoCard_module_badge {
371
371
  border-radius: 50%;
372
372
  color: var(--color-white);
373
373
  width: 40px;
@@ -377,20 +377,20 @@
377
377
  justify-content: center;
378
378
  background-color: #cecece;
379
379
  }
380
- .info-card.hasIcon .header {
380
+ .InfoCard_module_info-card.InfoCard_module_hasIcon .InfoCard_module_header {
381
381
  color: var(--color-lenscrafter-blue);
382
382
  }
383
383
 
384
384
  /* src/components/Pagination/Pagination.module.scss */
385
- .pagination {
385
+ .Pagination_module_pagination {
386
386
  display: flex;
387
387
  flex-direction: row;
388
388
  gap: 11px;
389
389
  padding: 5px;
390
390
  align-items: center;
391
391
  }
392
- .pagination .next,
393
- .pagination .prev {
392
+ .Pagination_module_pagination .Pagination_module_next,
393
+ .Pagination_module_pagination .Pagination_module_prev {
394
394
  padding: 0;
395
395
  border: none;
396
396
  border-radius: 50%;
@@ -400,17 +400,17 @@
400
400
  cursor: pointer;
401
401
  background: none;
402
402
  }
403
- .pagination .next path,
404
- .pagination .prev path {
403
+ .Pagination_module_pagination .Pagination_module_next path,
404
+ .Pagination_module_pagination .Pagination_module_prev path {
405
405
  fill: var(--color-black);
406
406
  }
407
- .pagination .pages {
407
+ .Pagination_module_pagination .Pagination_module_pages {
408
408
  display: flex;
409
409
  justify-content: space-between;
410
410
  gap: 4px;
411
411
  width: max-content;
412
412
  }
413
- .pagination .page {
413
+ .Pagination_module_pagination .Pagination_module_page {
414
414
  padding: 0;
415
415
  margin: 0;
416
416
  width: 20px;
@@ -421,18 +421,18 @@
421
421
  transition: width 0.3s;
422
422
  cursor: pointer;
423
423
  }
424
- .pagination .page.active {
424
+ .Pagination_module_pagination .Pagination_module_page.Pagination_module_active {
425
425
  width: 40px;
426
426
  border: none;
427
427
  border-radius: 16px;
428
428
  background-color: var(--color-black);
429
429
  }
430
- .pagination .page.number.active {
430
+ .Pagination_module_pagination .Pagination_module_page.Pagination_module_number.Pagination_module_active {
431
431
  width: 28px;
432
432
  }
433
433
 
434
434
  /* src/components/primitives/Container/Container.module.scss */
435
- .container {
435
+ .Container_module_container {
436
436
  width: 100%;
437
437
  max-width: 1280px;
438
438
  overflow: visible;
@@ -441,7 +441,7 @@
441
441
  }
442
442
 
443
443
  /* src/components/PracticeCard/PracticeCard.module.scss */
444
- .practice-card {
444
+ .PracticeCard_module_practice-card {
445
445
  color: var(--color-white);
446
446
  position: relative;
447
447
  max-width: 426px;
@@ -449,11 +449,11 @@
449
449
  overflow: hidden;
450
450
  cursor: pointer;
451
451
  }
452
- .practice-card .wrapper {
452
+ .PracticeCard_module_practice-card .PracticeCard_module_wrapper {
453
453
  color: inherit;
454
454
  text-decoration: none;
455
455
  }
456
- .practice-card .background {
456
+ .PracticeCard_module_practice-card .PracticeCard_module_background {
457
457
  object-fit: cover;
458
458
  position: absolute;
459
459
  z-index: 1;
@@ -463,7 +463,7 @@
463
463
  height: 100%;
464
464
  transition: transform 0.2s ease;
465
465
  }
466
- .practice-card .container {
466
+ .PracticeCard_module_practice-card .PracticeCard_module_container {
467
467
  position: relative;
468
468
  z-index: 2;
469
469
  display: flex;
@@ -474,49 +474,49 @@
474
474
  padding: var(--spacing-lg);
475
475
  }
476
476
  @media (max-width: 768px) {
477
- .practice-card .container {
477
+ .PracticeCard_module_practice-card .PracticeCard_module_container {
478
478
  flex-direction: row;
479
479
  align-items: center;
480
480
  justify-content: space-between;
481
481
  padding: var(--spacing-md);
482
482
  }
483
483
  }
484
- .practice-card .title {
484
+ .PracticeCard_module_practice-card .PracticeCard_module_title {
485
485
  max-width: 196px;
486
486
  }
487
487
  @media (max-width: 768px) {
488
- .practice-card .title {
488
+ .PracticeCard_module_practice-card .PracticeCard_module_title {
489
489
  max-width: 146px;
490
490
  font-size: var(--font-size-xl);
491
491
  line-height: var(--line-height-tight-4);
492
492
  }
493
493
  }
494
- .practice-card .cta {
494
+ .PracticeCard_module_practice-card .PracticeCard_module_cta {
495
495
  display: flex;
496
496
  justify-content: flex-end;
497
497
  }
498
- .practice-card .ctaRest {
498
+ .PracticeCard_module_practice-card .PracticeCard_module_ctaRest {
499
499
  position: absolute;
500
500
  opacity: 1;
501
501
  transition: opacity 0.2s ease, transform 0.2s ease;
502
502
  }
503
- .practice-card .ctaHover {
503
+ .PracticeCard_module_practice-card .PracticeCard_module_ctaHover {
504
504
  opacity: 0;
505
505
  transition: opacity 0.2s ease;
506
506
  }
507
- .practice-card:hover .background {
507
+ .PracticeCard_module_practice-card:hover .PracticeCard_module_background {
508
508
  transform: scale(1.08);
509
509
  }
510
- .practice-card:hover .ctaRest {
510
+ .PracticeCard_module_practice-card:hover .PracticeCard_module_ctaRest {
511
511
  opacity: 0;
512
512
  transform: rotate(-45deg);
513
513
  }
514
- .practice-card:hover .ctaHover {
514
+ .PracticeCard_module_practice-card:hover .PracticeCard_module_ctaHover {
515
515
  opacity: 1;
516
516
  transition-delay: 0.1s;
517
517
  }
518
518
  @media (max-width: 768px) {
519
- .practice-card {
519
+ .PracticeCard_module_practice-card {
520
520
  width: 100%;
521
521
  max-width: unset;
522
522
  height: 140px;
@@ -524,114 +524,114 @@
524
524
  }
525
525
 
526
526
  /* src/widgets/CardCollection/CardCollection.module.scss */
527
- .card-collection {
527
+ .CardCollection_module_card-collection {
528
528
  display: block;
529
529
  width: 100%;
530
530
  padding: var(--spacing-3xl) var(--spacing-7xl);
531
531
  }
532
- .card-collection h2 {
532
+ .CardCollection_module_card-collection h2 {
533
533
  color: var(--color-black);
534
534
  margin-bottom: var(--spacing-sm);
535
535
  }
536
- .card-collection .content {
536
+ .CardCollection_module_card-collection .CardCollection_module_content {
537
537
  margin-bottom: var(--spacing-xl);
538
538
  }
539
- .card-collection .wrapper {
539
+ .CardCollection_module_card-collection .CardCollection_module_wrapper {
540
540
  display: grid;
541
541
  grid-template-columns: repeat(2, 1fr);
542
542
  gap: var(--spacing-md);
543
543
  }
544
- .card-collection.threeCols .wrapper {
544
+ .CardCollection_module_card-collection.CardCollection_module_threeCols .CardCollection_module_wrapper {
545
545
  grid-template-columns: repeat(3, 1fr);
546
546
  }
547
- .card-collection.examCard .wrapper {
547
+ .CardCollection_module_card-collection.CardCollection_module_examCard .CardCollection_module_wrapper {
548
548
  grid-template-columns: repeat(auto-fit, minmax(314px, 1fr));
549
549
  }
550
550
  @media (max-width: 768px) {
551
- .card-collection {
551
+ .CardCollection_module_card-collection {
552
552
  padding: var(--spacing-lg);
553
553
  }
554
- .card-collection .wrapper {
554
+ .CardCollection_module_card-collection .CardCollection_module_wrapper {
555
555
  grid-template-columns: 1fr;
556
556
  }
557
- .card-collection.threeCols .wrapper {
557
+ .CardCollection_module_card-collection.CardCollection_module_threeCols .CardCollection_module_wrapper {
558
558
  grid-template-columns: 1fr;
559
559
  }
560
560
  }
561
561
 
562
562
  /* src/widgets/ContactModule/ContactModule.module.scss */
563
- .contact-module {
563
+ .ContactModule_module_contact-module {
564
564
  width: 100%;
565
565
  display: block;
566
566
  padding-top: 96px;
567
567
  }
568
- .contact-module .container,
569
- .contact-module .wrapper,
570
- .contact-module .content,
571
- .contact-module .cta-wrapper {
568
+ .ContactModule_module_contact-module .ContactModule_module_container,
569
+ .ContactModule_module_contact-module .ContactModule_module_wrapper,
570
+ .ContactModule_module_contact-module .ContactModule_module_content,
571
+ .ContactModule_module_contact-module .ContactModule_module_cta-wrapper {
572
572
  display: flex;
573
573
  flex-direction: column;
574
574
  align-items: center;
575
575
  width: 100%;
576
576
  }
577
- .contact-module .cta-wrapper {
577
+ .ContactModule_module_contact-module .ContactModule_module_cta-wrapper {
578
578
  flex-direction: row;
579
579
  justify-content: center;
580
580
  gap: var(--spacing-sm);
581
581
  }
582
582
  @media (max-width: 768px) {
583
- .contact-module .cta-wrapper {
583
+ .ContactModule_module_contact-module .ContactModule_module_cta-wrapper {
584
584
  flex-direction: column-reverse;
585
585
  }
586
- .contact-module .cta-wrapper .cta {
586
+ .ContactModule_module_contact-module .ContactModule_module_cta-wrapper .ContactModule_module_cta {
587
587
  width: 100%;
588
588
  }
589
589
  }
590
- .contact-module .wrapper {
590
+ .ContactModule_module_contact-module .ContactModule_module_wrapper {
591
591
  gap: var(--spacing-lg);
592
592
  padding: 0 var(--spacing-md);
593
593
  }
594
- .contact-module .content {
594
+ .ContactModule_module_contact-module .ContactModule_module_content {
595
595
  gap: var(--spacing-sm);
596
596
  text-align: center;
597
597
  }
598
598
  @media (max-width: 768px) {
599
- .contact-module .content {
599
+ .ContactModule_module_contact-module .ContactModule_module_content {
600
600
  max-width: 80%;
601
601
  }
602
602
  }
603
- .contact-module .title {
603
+ .ContactModule_module_contact-module .ContactModule_module_title {
604
604
  color: var(--color-black);
605
605
  }
606
606
  @media (max-width: 768px) {
607
- .contact-module .title {
607
+ .ContactModule_module_contact-module .ContactModule_module_title {
608
608
  max-width: 75%;
609
609
  }
610
610
  }
611
611
  @media (max-width: 768px) {
612
- .contact-module .image {
612
+ .ContactModule_module_contact-module .ContactModule_module_image {
613
613
  max-width: 80%;
614
614
  margin-top: -14px;
615
615
  }
616
616
  }
617
617
 
618
618
  /* src/widgets/HeroBanner/HeroBanner.module.scss */
619
- .heroBanner {
619
+ .HeroBanner_module_heroBanner {
620
620
  width: 100%;
621
621
  position: relative;
622
622
  }
623
- .heroBanner.mainHeroBanner {
623
+ .HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner {
624
624
  background-color: #f3f3f3;
625
625
  padding: 48px 80px 0 80px;
626
626
  }
627
- .heroBanner.mainHeroBanner .container {
627
+ .HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner .HeroBanner_module_container {
628
628
  max-width: 1280px;
629
629
  height: calc(100dvh - 112px);
630
630
  margin: 0 auto;
631
631
  border-radius: 16px;
632
632
  overflow: hidden;
633
633
  }
634
- .heroBanner.bannerPodcast .container {
634
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container {
635
635
  flex-direction: row;
636
636
  align-items: center;
637
637
  justify-content: center;
@@ -639,47 +639,47 @@
639
639
  padding: var(--spacing-7xl);
640
640
  gap: 64px;
641
641
  }
642
- .heroBanner.bannerPodcast .container .banner {
642
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner {
643
643
  padding: 0;
644
644
  justify-content: center;
645
645
  }
646
- .heroBanner.bannerPodcast .container .banner .text .title {
646
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_text .HeroBanner_module_title {
647
647
  color: var(--color-black);
648
648
  }
649
- .heroBanner.bannerPodcast .container .banner .text .subtitle {
649
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_text .HeroBanner_module_subtitle {
650
650
  color: var(--color-gray);
651
651
  }
652
- .heroBanner.bannerPodcast .container .logoWrapper {
652
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper {
653
653
  z-index: 2;
654
654
  }
655
- .heroBanner.bannerPodcast .container .logoWrapper .logo {
655
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper .HeroBanner_module_logo {
656
656
  object-fit: contain;
657
657
  max-width: 466px;
658
658
  }
659
- .heroBanner.bannerPodcast .container .horizontalGradient {
659
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient {
660
660
  display: flex;
661
661
  height: 8px;
662
662
  }
663
- .heroBanner.bannerPodcast .container .horizontalGradient .lensCrafters {
663
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_lensCrafters {
664
664
  background-color: var(--color-lenscrafter-blue);
665
665
  }
666
- .heroBanner.bannerPodcast .container .horizontalGradient .forEyes {
666
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_forEyes {
667
667
  background-color: var(--color-foreyes-brown);
668
668
  }
669
- .heroBanner.bannerPodcast .container .horizontalGradient .optical {
669
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_optical {
670
670
  background-color: var(--color-targetoptical-red);
671
671
  }
672
- .heroBanner.bannerPodcast .container .horizontalGradient .pearleVision {
672
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_pearleVision {
673
673
  background-color: var(--color-pearlevision-green);
674
674
  }
675
- .heroBanner .container {
675
+ .HeroBanner_module_heroBanner .HeroBanner_module_container {
676
676
  position: relative;
677
677
  display: flex;
678
678
  flex-direction: column;
679
679
  justify-content: end;
680
680
  height: calc(100dvh - 64px);
681
681
  }
682
- .heroBanner .container .banner {
682
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner {
683
683
  display: flex;
684
684
  flex-direction: column;
685
685
  justify-content: end;
@@ -690,20 +690,20 @@
690
690
  padding: var(--spacing-7xl);
691
691
  z-index: 2;
692
692
  }
693
- .heroBanner .container .banner .text {
693
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_text {
694
694
  display: flex;
695
695
  flex-direction: column;
696
696
  gap: var(--spacing-sm);
697
697
  color: var(--color-white);
698
698
  }
699
- .heroBanner .container .banner .ctaContainer {
699
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_ctaContainer {
700
700
  display: flex;
701
701
  gap: var(--spacing-sm);
702
702
  }
703
- .heroBanner .container .brandsStrip {
703
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_brandsStrip {
704
704
  z-index: 3;
705
705
  }
706
- .heroBanner .container .backgroundImage {
706
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_backgroundImage {
707
707
  position: absolute;
708
708
  top: 0;
709
709
  left: 0;
@@ -712,49 +712,49 @@
712
712
  object-fit: cover;
713
713
  z-index: 1;
714
714
  }
715
- .heroBanner .scrollDown {
715
+ .HeroBanner_module_heroBanner .HeroBanner_module_scrollDown {
716
716
  display: flex;
717
717
  justify-content: center;
718
718
  align-items: center;
719
719
  width: 100%;
720
720
  height: 64px;
721
721
  }
722
- .heroBanner .scrollDown .arrow {
722
+ .HeroBanner_module_heroBanner .HeroBanner_module_scrollDown .HeroBanner_module_arrow {
723
723
  width: 32px;
724
724
  height: 32px;
725
725
  }
726
726
  @media (max-width: 768px) {
727
- .heroBanner.mainHeroBanner {
727
+ .HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner {
728
728
  padding: 24px 16px;
729
729
  }
730
- .heroBanner.mainHeroBanner .container {
730
+ .HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner .HeroBanner_module_container {
731
731
  height: calc(100dvh - 88px);
732
732
  }
733
- .heroBanner.bannerPodcast .container {
733
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container {
734
734
  flex-direction: column;
735
735
  padding: 24px 16px;
736
736
  gap: 32px;
737
737
  }
738
- .heroBanner.bannerPodcast .container .banner {
738
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner {
739
739
  order: 2;
740
740
  height: unset;
741
741
  }
742
- .heroBanner.bannerPodcast .container .logoWrapper {
742
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper {
743
743
  order: 1;
744
744
  }
745
- .heroBanner.bannerPodcast .container .logoWrapper .logo {
745
+ .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper .HeroBanner_module_logo {
746
746
  width: 100%;
747
747
  }
748
- .heroBanner .container .banner {
748
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner {
749
749
  padding: var(--spacing-lg) var(--spacing-md);
750
750
  }
751
- .heroBanner .container .banner .ctaContainer {
751
+ .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_ctaContainer {
752
752
  flex-direction: column;
753
753
  }
754
754
  }
755
755
 
756
756
  /* src/widgets/MiniBanner/MiniBanner.module.scss */
757
- .minibanner {
757
+ .MiniBanner_module_minibanner {
758
758
  width: 100%;
759
759
  background-color: #f3f3f3;
760
760
  min-height: 192px;
@@ -762,10 +762,10 @@
762
762
  color: var(--color-white);
763
763
  text-align: center;
764
764
  }
765
- .minibanner :global(.h1) {
765
+ .MiniBanner_module_minibanner .h1 {
766
766
  font-weight: 400;
767
767
  }
768
- .minibanner .background {
768
+ .MiniBanner_module_minibanner .MiniBanner_module_background {
769
769
  position: absolute;
770
770
  left: 0;
771
771
  top: 0;
@@ -774,7 +774,7 @@
774
774
  object-fit: cover;
775
775
  z-index: 1;
776
776
  }
777
- .minibanner .container {
777
+ .MiniBanner_module_minibanner .MiniBanner_module_container {
778
778
  display: flex;
779
779
  flex-direction: column;
780
780
  align-items: center;
@@ -784,136 +784,136 @@
784
784
  z-index: 2;
785
785
  }
786
786
  @media (max-width: 768px) {
787
- .minibanner .container {
787
+ .MiniBanner_module_minibanner .MiniBanner_module_container {
788
788
  padding: var(--spacing-3xl) var(--spacing-md);
789
789
  }
790
790
  }
791
- .minibanner.miniBannerNoBG {
791
+ .MiniBanner_module_minibanner.MiniBanner_module_miniBannerNoBG {
792
792
  color: var(--color-black);
793
793
  }
794
- .minibanner.miniBannerNoBG .container {
794
+ .MiniBanner_module_minibanner.MiniBanner_module_miniBannerNoBG .MiniBanner_module_container {
795
795
  gap: var(--spacing-lg);
796
796
  padding: var(--spacing-5xl) 0;
797
797
  }
798
798
  @media (max-width: 768px) {
799
- .minibanner.miniBannerNoBG .container {
799
+ .MiniBanner_module_minibanner.MiniBanner_module_miniBannerNoBG .MiniBanner_module_container {
800
800
  padding: var(--spacing-5xl) var(--spacing-md);
801
801
  }
802
802
  }
803
803
 
804
804
  /* src/widgets/MiniSectionCta/MiniSectionCta.module.scss */
805
- .miniSectionCta {
805
+ .MiniSectionCta_module_miniSectionCta {
806
806
  width: 100%;
807
807
  }
808
- .miniSectionCta .container {
808
+ .MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_container {
809
809
  display: flex;
810
810
  flex-direction: row;
811
811
  justify-content: space-between;
812
812
  gap: var(--spacing-md);
813
813
  padding: var(--spacing-3xl) var(--spacing-7xl);
814
814
  }
815
- .miniSectionCta .col {
815
+ .MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_col {
816
816
  display: flex;
817
817
  flex-direction: column;
818
818
  justify-content: center;
819
819
  }
820
- .miniSectionCta h2 {
820
+ .MiniSectionCta_module_miniSectionCta h2 {
821
821
  color: var(--color-black);
822
822
  }
823
- .miniSectionCta.BgColorBlack {
823
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack {
824
824
  background: var(--color-black);
825
825
  color: var(--color-white);
826
826
  }
827
- .miniSectionCta.BgColorBlack h2 {
827
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack h2 {
828
828
  color: var(--color-white);
829
829
  }
830
- .miniSectionCta.BgColorBlack :global(.subheading) {
830
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack .subheading {
831
831
  color: #cecece;
832
832
  }
833
- .miniSectionCta.infoCallout .col {
833
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout .MiniSectionCta_module_col {
834
834
  flex-direction: row;
835
835
  gap: 112px;
836
836
  align-items: center;
837
837
  }
838
- .miniSectionCta.infoCallout h2 {
838
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout h2 {
839
839
  min-width: fit-content;
840
840
  }
841
- .miniSectionCta.miniTextCenterCta .container {
841
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_miniTextCenterCta .MiniSectionCta_module_container {
842
842
  flex-direction: column;
843
843
  align-items: center;
844
844
  }
845
845
  @media (max-width: 768px) {
846
- .miniSectionCta .container {
846
+ .MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_container {
847
847
  flex-direction: column;
848
848
  padding: var(--spacing-lg) var(--spacing-md);
849
849
  }
850
- .miniSectionCta .cta {
850
+ .MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_cta {
851
851
  width: 100%;
852
852
  }
853
- .miniSectionCta.BgColorBlack {
853
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack {
854
854
  text-align: center;
855
855
  }
856
- .miniSectionCta.BgColorGrey {
856
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorGrey {
857
857
  text-align: center;
858
858
  }
859
- .miniSectionCta.infoCallout .col {
859
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout .MiniSectionCta_module_col {
860
860
  flex-direction: column;
861
861
  gap: var(--spacing-md);
862
862
  align-items: flex-start;
863
863
  }
864
- .miniSectionCta.infoCallout .subtitle {
864
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout .MiniSectionCta_module_subtitle {
865
865
  font-size: var(--font-size-lg);
866
866
  font-weight: var(--font-weight-medium);
867
867
  line-height: var(--line-height-tight-1);
868
868
  }
869
- .miniSectionCta.miniTextCenterCta .col {
869
+ .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_miniTextCenterCta .MiniSectionCta_module_col {
870
870
  width: 100%;
871
871
  }
872
872
  }
873
873
 
874
874
  /* src/widgets/PracticePathCards/PracticePathCards.module.scss */
875
- .practice-path-cards {
875
+ .PracticePathCards_module_practice-path-cards {
876
876
  display: block;
877
877
  width: 100%;
878
878
  padding: var(--spacing-3xl) 0;
879
879
  }
880
880
  @media (max-width: 768px) {
881
- .practice-path-cards {
881
+ .PracticePathCards_module_practice-path-cards {
882
882
  padding: var(--spacing-lg) var(--spacing-md);
883
883
  }
884
884
  }
885
- .practice-path-cards h2 {
885
+ .PracticePathCards_module_practice-path-cards h2 {
886
886
  color: var(--color-black);
887
887
  }
888
- .practice-path-cards .container {
888
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_container {
889
889
  display: flex;
890
890
  flex-direction: column;
891
891
  gap: var(--spacing-xl);
892
892
  }
893
- .practice-path-cards .wrapper {
893
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper {
894
894
  display: flex;
895
895
  align-items: center;
896
896
  justify-content: space-between;
897
897
  gap: var(--spacing-xl);
898
898
  }
899
899
  @media (max-width: 768px) {
900
- .practice-path-cards .wrapper {
900
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper {
901
901
  flex-direction: column;
902
902
  }
903
- .practice-path-cards .wrapper .ctaWrapper {
903
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper .PracticePathCards_module_ctaWrapper {
904
904
  width: 100%;
905
905
  padding: 0 var(--spacing-lg);
906
906
  }
907
- .practice-path-cards .wrapper .ctaWrapper .cta {
907
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper .PracticePathCards_module_ctaWrapper .PracticePathCards_module_cta {
908
908
  width: 100%;
909
909
  }
910
910
  }
911
- .practice-path-cards .content {
911
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_content {
912
912
  display: flex;
913
913
  flex-direction: column;
914
914
  gap: var(--spacing-sm);
915
915
  }
916
- .practice-path-cards .cards {
916
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_cards {
917
917
  display: flex;
918
918
  flex-direction: row;
919
919
  overflow: hidden;
@@ -921,107 +921,107 @@
921
921
  justify-content: center;
922
922
  }
923
923
  @media (max-width: 768px) {
924
- .practice-path-cards .cards {
924
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_cards {
925
925
  flex-direction: column;
926
926
  }
927
927
  }
928
- .practice-path-cards .card {
928
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_card {
929
929
  width: 33.333%;
930
930
  }
931
931
  @media (max-width: 768px) {
932
- .practice-path-cards .card {
932
+ .PracticePathCards_module_practice-path-cards .PracticePathCards_module_card {
933
933
  width: 100%;
934
934
  }
935
935
  }
936
936
 
937
937
  /* src/widgets/Teaser5050With3Text/Teaser5050With3Text.module.scss */
938
- .teaser5050-3text {
938
+ .Teaser5050With3Text_module_teaser5050-3text {
939
939
  width: 100%;
940
940
  }
941
- .teaser5050-3text .container {
941
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_container {
942
942
  display: flex;
943
943
  flex-direction: column;
944
944
  gap: var(--spacing-xl);
945
945
  }
946
- .teaser5050-3text .content {
946
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_content {
947
947
  display: flex;
948
948
  flex-direction: row;
949
949
  align-items: center;
950
950
  justify-content: center;
951
951
  gap: var(--spacing-xl);
952
952
  }
953
- .teaser5050-3text.right .content {
953
+ .Teaser5050With3Text_module_teaser5050-3text.Teaser5050With3Text_module_right .Teaser5050With3Text_module_content {
954
954
  flex-direction: row-reverse;
955
955
  }
956
- .teaser5050-3text .title {
956
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_title {
957
957
  color: var(--color-black);
958
958
  }
959
- .teaser5050-3text .image {
959
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_image {
960
960
  width: 50%;
961
961
  border-radius: 16px;
962
962
  }
963
963
  @media (max-width: 768px) {
964
- .teaser5050-3text .container {
964
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_container {
965
965
  padding: var(--spacing-lg) var(--spacing-md);
966
966
  gap: 0;
967
967
  }
968
- .teaser5050-3text.right .container {
968
+ .Teaser5050With3Text_module_teaser5050-3text.Teaser5050With3Text_module_right .Teaser5050With3Text_module_container {
969
969
  gap: var(--spacing-xl);
970
970
  }
971
- .teaser5050-3text .content {
971
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_content {
972
972
  flex-direction: column;
973
973
  }
974
- .teaser5050-3text.right .content {
974
+ .Teaser5050With3Text_module_teaser5050-3text.Teaser5050With3Text_module_right .Teaser5050With3Text_module_content {
975
975
  flex-direction: column-reverse;
976
976
  gap: var(--spacing-xl);
977
977
  }
978
- .teaser5050-3text .image {
978
+ .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_image {
979
979
  width: 100%;
980
980
  padding: 0;
981
981
  }
982
982
  }
983
983
 
984
984
  /* src/widgets/Teaser5050WithCta/Teaser5050WithCta.module.scss */
985
- .teaser5050 {
985
+ .Teaser5050WithCta_module_teaser5050 {
986
986
  width: 100%;
987
987
  }
988
- .teaser5050 .container {
988
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_container {
989
989
  display: flex;
990
990
  flex-direction: row;
991
991
  align-items: center;
992
992
  justify-content: center;
993
993
  }
994
- .teaser5050.right .container {
994
+ .Teaser5050WithCta_module_teaser5050.Teaser5050WithCta_module_right .Teaser5050WithCta_module_container {
995
995
  flex-direction: row-reverse;
996
996
  }
997
- .teaser5050 .wrapper {
997
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_wrapper {
998
998
  display: flex;
999
999
  flex-direction: column;
1000
1000
  gap: var(--spacing-md);
1001
1001
  padding: 0 var(--spacing-5xl);
1002
1002
  width: 50%;
1003
1003
  }
1004
- .teaser5050 .title {
1004
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_title {
1005
1005
  color: var(--color-black);
1006
1006
  }
1007
- .teaser5050 .image {
1007
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_image {
1008
1008
  width: 50%;
1009
1009
  border-radius: 16px;
1010
1010
  }
1011
1011
  @media (max-width: 768px) {
1012
- .teaser5050 .container {
1012
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_container {
1013
1013
  flex-direction: column-reverse;
1014
1014
  gap: var(--spacing-xl);
1015
1015
  }
1016
- .teaser5050.right .container {
1016
+ .Teaser5050WithCta_module_teaser5050.Teaser5050WithCta_module_right .Teaser5050WithCta_module_container {
1017
1017
  flex-direction: column-reverse;
1018
1018
  }
1019
- .teaser5050 .wrapper,
1020
- .teaser5050 .image {
1019
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_wrapper,
1020
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_image {
1021
1021
  width: 100%;
1022
1022
  padding: 0;
1023
1023
  }
1024
- .teaser5050 .cta {
1024
+ .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_cta {
1025
1025
  width: 100%;
1026
1026
  }
1027
1027
  }