@total_onion/onion-library 1.0.82 → 1.0.84

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.
Files changed (20) hide show
  1. package/components/block-post-info-v3/post-info-v3.scss +16 -17
  2. package/components/block-section-separator-v3/section-separator-v3.scss +11 -9
  3. package/components/block-single-responsive-image-v3/single-responsive-image-v3.scss +0 -2
  4. package/components/block-standard-content-v3/standard-content-v3.scss +0 -1
  5. package/components/block-sub-group-container-v3/sub-group-container-v3.scss +6 -12
  6. package/components/component-animations-v3/animations-v3.scss +117 -0
  7. package/components/component-content-container-settings-v3/content-container-settings-v3.scss +13 -13
  8. package/components/component-element-positioning-v3/element-positioning-v3.scss +2 -3
  9. package/components/component-grid-layout-container-v3/grid-layout-container-v3.scss +5 -5
  10. package/components/component-grid-layout-element-v3/grid-layout-element-v3.scss +25 -0
  11. package/components/component-text-editor-settings-element-classes-v3/text-editor-settings-element-classes-v3.twig +4 -1
  12. package/components/component-text-editor-settings-v3/group_687a4e2334e37.json +26 -11
  13. package/components/fields-animations-v3/animations-v3.scss +121 -0
  14. package/components/fields-core-critical-v3/core-critical-v3.scss +5 -5
  15. package/components/fields-core-css-sizing-vars-v3/core-css-sizing-vars-v3.scss +20 -86
  16. package/components/fields-core-mixins-v3/core-mixins-v3.scss +1563 -1759
  17. package/components/fields-core-typography-mixins-v3/core-typography-mixins-v3.scss +988 -0
  18. package/components/fields-core-typography-v3/core-typography-v3.php +53 -53
  19. package/components/fields-core-typography-v3/core-typography-v3.scss +445 -166
  20. package/package.json +1 -1
package/components/fields-core-mixins-v3/core-mixins-v3.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  // LIBRARY FILE - Do not modify/override here as your changes will be lost when the package is updated.
2
2
  @use 'Assets/scss/theme/breakpoints';
3
- @use 'Assets/scss/modules/library-modules/core-functions/core-functions';
3
+ @use 'Assets/scss/modules/library-modules/core-functions-v3/core-functions-v3';
4
4
  @use 'sass:math';
5
5
 
6
6
  @mixin textStyle() {
@@ -132,27 +132,27 @@
132
132
  rotate: var(--image-rotation);
133
133
  z-index: -1;
134
134
  border-radius: var(--content-image-border-radius);
135
- max-width: core-functions.fluidSize(
135
+ max-width: core-functions-v3.fluidSize(
136
136
  var(--image-max-width-mobile),
137
137
  'portrait'
138
138
  );
139
139
 
140
140
  @include device(breakpoints.$tabPortrait) {
141
- max-width: core-functions.fluidSize(
141
+ max-width: core-functions-v3.fluidSize(
142
142
  var(--image-max-width-portrait),
143
143
  'portrait'
144
144
  );
145
145
  }
146
146
 
147
147
  @include device(breakpoints.$tabLandscape) {
148
- max-width: core-functions.fluidSize(
148
+ max-width: core-functions-v3.fluidSize(
149
149
  var(--image-max-width-landscape),
150
150
  'landscape'
151
151
  );
152
152
  }
153
153
 
154
154
  @include device(breakpoints.$desktop) {
155
- max-width: core-functions.fluidSize(
155
+ max-width: core-functions-v3.fluidSize(
156
156
  var(--image-max-width-desktop),
157
157
  'desktop'
158
158
  );
@@ -160,1771 +160,1575 @@
160
160
  }
161
161
 
162
162
  @mixin boxShadow() {
163
- box-shadow: core-functions.fluidSize(var(--box-shadow-offset-x), 'static')
164
- core-functions.fluidSize(var(--box-shadow-offset-y), 'static')
165
- core-functions.fluidSize(var(--box-shadow-blur), 'static')
166
- core-functions.fluidSize(var(--box-shadow-spread), 'static')
163
+ box-shadow: core-functions-v3.fluidSize(
164
+ var(--box-shadow-offset-x),
165
+ 'static'
166
+ )
167
+ core-functions-v3.fluidSize(var(--box-shadow-offset-y), 'static')
168
+ core-functions-v3.fluidSize(var(--box-shadow-blur), 'static')
169
+ core-functions-v3.fluidSize(var(--box-shadow-spread), 'static')
167
170
  var(--box-shadow-colour) var(--box-shadow-position);
168
171
  &:hover {
169
- box-shadow: core-functions.fluidSize(
172
+ box-shadow: core-functions-v3.fluidSize(
170
173
  var(--box-shadow-hover-offset-x),
171
174
  'static'
172
175
  )
173
- core-functions.fluidSize(var(--box-shadow-hover-offset-y), 'static')
174
- core-functions.fluidSize(var(--box-shadow-hover-blur), 'static')
175
- core-functions.fluidSize(var(--box-shadow-hover-spread), 'static')
176
+ core-functions-v3.fluidSize(
177
+ var(--box-shadow-hover-offset-y),
178
+ 'static'
179
+ )
180
+ core-functions-v3.fluidSize(var(--box-shadow-hover-blur), 'static')
181
+ core-functions-v3.fluidSize(
182
+ var(--box-shadow-hover-spread),
183
+ 'static'
184
+ )
176
185
  var(--box-shadow-hover-colour) var(--box-shadow-hover-position);
177
186
  }
178
187
  }
179
188
 
180
189
  @mixin textShadow() {
181
- text-shadow: core-functions.fluidSize(var(--text-shadow-offset-x), 'static')
182
- core-functions.fluidSize(var(--text-shadow-offset-y), 'static')
183
- core-functions.fluidSize(var(--text-shadow-blur), 'static')
190
+ text-shadow: core-functions-v3.fluidSize(
191
+ var(--text-shadow-offset-x),
192
+ 'static'
193
+ )
194
+ core-functions-v3.fluidSize(var(--text-shadow-offset-y), 'static')
195
+ core-functions-v3.fluidSize(var(--text-shadow-blur), 'static')
184
196
  var(--text-shadow-colour);
185
197
  }
186
198
 
187
199
  //Typography Mixins
188
- @mixin h1-l {
189
- letter-spacing: var(--h1-l-letter-spacing);
190
- line-height: var(--h1-l-line-height);
191
- font-family: var(--h1-l-font-family);
192
- --default-font-weight: var(--h1-l-default-font-weight);
193
- font-weight: var(--default-font-weight);
194
-
195
- strong,
196
- b {
197
- font-weight: var(--h1-l-bold-font-weight);
198
- }
199
-
200
- font-size: clamp(
201
- var(--h-xl-font-size-min-mobile, 10px),
202
- core-functions.fontSize(var(--h1-l-mobile), 'mobile'),
203
- var(--h-xl-font-size-max-mobile, 180px)
204
- );
205
-
206
- @include device(breakpoints.$tabPortrait) {
207
- font-size: clamp(
208
- var(--h-xl-font-size-min-mobile, 10px),
209
- core-functions.fontSize(var(--h1-l-portrait), 'portrait'),
210
- var(--h-xl-font-size-max-mobile, 180px)
211
- );
212
- }
213
-
214
- @include device(breakpoints.$tabLandscape) {
215
- font-size: clamp(
216
- var(--h-xl-font-size-min-desktop, 10px),
217
- core-functions.fontSize(var(--h1-l-landscape), 'landscape'),
218
- var(--h-xl-font-size-max-desktop, 180px)
219
- );
220
- }
221
-
222
- @include device(breakpoints.$desktop) {
223
- font-size: clamp(
224
- var(--h-xl-font-size-min-desktop, 10px),
225
- core-functions.fontSize(var(--h1-l-desktop), 'desktop'),
226
- var(--h-xl-font-size-max-desktop, 180px)
227
- );
228
- }
229
- }
230
- @mixin h-x-large {
231
- letter-spacing: var(--h1-l-letter-spacing);
232
- line-height: var(--h1-l-line-height);
233
- font-family: var(--h1-l-font-family);
234
- --default-font-weight: var(--h1-l-default-font-weight);
235
- font-weight: var(--default-font-weight);
236
-
237
- strong,
238
- b {
239
- font-weight: var(--h1-l-bold-font-weight);
240
- }
241
-
242
- font-size: clamp(
243
- var(--h-xl-font-size-min-mobile, 10px),
244
- core-functions.fontSize(var(--h1-l-mobile), 'mobile'),
245
- var(--h-xl-font-size-max-mobile, 180px)
246
- );
247
-
248
- @include device(breakpoints.$tabPortrait) {
249
- font-size: clamp(
250
- var(--h-xl-font-size-min-mobile, 10px),
251
- core-functions.fontSize(var(--h1-l-portrait), 'portrait'),
252
- var(--h-xl-font-size-max-mobile, 180px)
253
- );
254
- }
255
-
256
- @include device(breakpoints.$tabLandscape) {
257
- font-size: clamp(
258
- var(--h-xl-font-size-min-desktop, 10px),
259
- core-functions.fontSize(var(--h1-l-landscape), 'landscape'),
260
- var(--h-xl-font-size-max-desktop, 180px)
261
- );
262
- }
263
-
264
- @include device(breakpoints.$desktop) {
265
- font-size: clamp(
266
- var(--h-xl-font-size-min-desktop, 10px),
267
- core-functions.fontSize(var(--h1-l-desktop), 'desktop'),
268
- var(--h-xl-font-size-max-desktop, 180px)
269
- );
270
- }
271
- }
272
-
273
- @mixin h1 {
274
- letter-spacing: var(--h1-letter-spacing);
275
- line-height: var(--h1-line-height);
276
- font-family: var(--h1-font-family);
277
- --default-font-weight: var(--h1-default-font-weight);
278
- font-weight: var(--default-font-weight);
279
-
280
- strong,
281
- b {
282
- font-weight: var(--h1-bold-font-weight);
283
- }
284
-
285
- font-size: clamp(
286
- var(--h-l-font-size-min-mobile, 10px),
287
- core-functions.fontSize(var(--h1-mobile), 'mobile'),
288
- var(--h-l-font-size-max-mobile, 180px)
289
- );
290
-
291
- @include device(breakpoints.$tabPortrait) {
292
- font-size: clamp(
293
- var(--h-l-font-size-min-mobile, 10px),
294
- core-functions.fontSize(var(--h1-portrait), 'portrait'),
295
- var(--h-l-font-size-max-mobile, 180px)
296
- );
297
- }
298
-
299
- @include device(breakpoints.$tabLandscape) {
300
- font-size: clamp(
301
- var(--h-l-font-size-min-desktop, 10px),
302
- core-functions.fontSize(var(--h1-landscape), 'landscape'),
303
- var(--h-l-font-size-max-desktop, 180px)
304
- );
305
- }
306
-
307
- @include device(breakpoints.$desktop) {
308
- font-size: clamp(
309
- var(--h-l-font-size-min-desktop, 10px),
310
- core-functions.fontSize(var(--h1-desktop), 'desktop'),
311
- var(--h-l-font-size-max-desktop, 180px)
312
- );
313
- }
314
- }
315
- @mixin h-large {
316
- letter-spacing: var(--h1-letter-spacing);
317
- line-height: var(--h1-line-height);
318
- font-family: var(--h1-font-family);
319
- --default-font-weight: var(--h1-default-font-weight);
320
- font-weight: var(--default-font-weight);
321
-
322
- strong,
323
- b {
324
- font-weight: var(--h1-bold-font-weight);
325
- }
326
-
327
- font-size: clamp(
328
- var(--h-l-font-size-min-mobile, 10px),
329
- core-functions.fontSize(var(--h1-mobile), 'mobile'),
330
- var(--h-l-font-size-max-mobile, 180px)
331
- );
332
-
333
- @include device(breakpoints.$tabPortrait) {
334
- font-size: clamp(
335
- var(--h-l-font-size-min-mobile, 10px),
336
- core-functions.fontSize(var(--h1-portrait), 'portrait'),
337
- var(--h-l-font-size-max-mobile, 180px)
338
- );
339
- }
340
-
341
- @include device(breakpoints.$tabLandscape) {
342
- font-size: clamp(
343
- var(--h-l-font-size-min-desktop, 10px),
344
- core-functions.fontSize(var(--h1-landscape), 'landscape'),
345
- var(--h-l-font-size-max-desktop, 180px)
346
- );
347
- }
348
-
349
- @include device(breakpoints.$desktop) {
350
- font-size: clamp(
351
- var(--h-l-font-size-min-desktop, 10px),
352
- core-functions.fontSize(var(--h1-desktop), 'desktop'),
353
- var(--h-l-font-size-max-desktop, 180px)
354
- );
355
- }
356
- }
357
-
358
- @mixin h2 {
359
- letter-spacing: var(--h2-letter-spacing);
360
- line-height: var(--h2-line-height);
361
- font-family: var(--h2-font-family);
362
- --default-font-weight: var(--h2-default-font-weight);
363
- font-weight: var(--default-font-weight);
364
-
365
- strong,
366
- b {
367
- font-weight: var(--h2-bold-font-weight);
368
- }
369
-
370
- font-size: clamp(
371
- var(--h-m-font-size-min-mobile, 10px),
372
- core-functions.fontSize(var(--h2-mobile), 'mobile'),
373
- var(--h-m-font-size-max-mobile, 180px)
374
- );
375
-
376
- @include device(breakpoints.$tabPortrait) {
377
- font-size: clamp(
378
- var(--h-m-font-size-min-mobile, 10px),
379
- core-functions.fontSize(var(--h2-portrait), 'portrait'),
380
- var(--h-m-font-size-max-mobile, 180px)
381
- );
382
- }
383
-
384
- @include device(breakpoints.$tabLandscape) {
385
- font-size: clamp(
386
- var(--h-m-font-size-min-desktop, 10px),
387
- core-functions.fontSize(var(--h2-landscape), 'landscape'),
388
- var(--h-m-font-size-max-desktop, 180px)
389
- );
390
- }
391
-
392
- @include device(breakpoints.$desktop) {
393
- font-size: clamp(
394
- var(--h-m-font-size-min-desktop, 10px),
395
- core-functions.fontSize(var(--h2-desktop), 'desktop'),
396
- var(--h-m-font-size-max-desktop, 180px)
397
- );
398
- }
399
- }
400
- @mixin h-medium {
401
- letter-spacing: var(--h2-letter-spacing);
402
- line-height: var(--h2-line-height);
403
- font-family: var(--h2-font-family);
404
- --default-font-weight: var(--h2-default-font-weight);
405
- font-weight: var(--default-font-weight);
406
-
407
- strong,
408
- b {
409
- font-weight: var(--h2-bold-font-weight);
410
- }
411
-
412
- font-size: clamp(
413
- var(--h-m-font-size-min-mobile, 10px),
414
- core-functions.fontSize(var(--h2-mobile), 'mobile'),
415
- var(--h-m-font-size-max-mobile, 180px)
416
- );
417
-
418
- @include device(breakpoints.$tabPortrait) {
419
- font-size: clamp(
420
- var(--h-m-font-size-min-mobile, 10px),
421
- core-functions.fontSize(var(--h2-portrait), 'portrait'),
422
- var(--h-m-font-size-max-mobile, 180px)
423
- );
424
- }
425
-
426
- @include device(breakpoints.$tabLandscape) {
427
- font-size: clamp(
428
- var(--h-m-font-size-min-desktop, 10px),
429
- core-functions.fontSize(var(--h2-landscape), 'landscape'),
430
- var(--h-m-font-size-max-desktop, 180px)
431
- );
432
- }
433
-
434
- @include device(breakpoints.$desktop) {
435
- font-size: clamp(
436
- var(--h-m-font-size-min-desktop, 10px),
437
- core-functions.fontSize(var(--h2-desktop), 'desktop'),
438
- var(--h-m-font-size-max-desktop, 180px)
439
- );
440
- }
441
- }
442
-
443
- @mixin h3 {
444
- letter-spacing: var(--h3-letter-spacing);
445
- line-height: var(--h3-line-height);
446
- font-family: var(--h3-font-family);
447
- --default-font-weight: var(--h3-default-font-weight);
448
- font-weight: var(--default-font-weight);
449
-
450
- strong,
451
- b {
452
- font-weight: var(--h3-bold-font-weight);
453
- }
454
-
455
- font-size: clamp(
456
- var(--h-s-font-size-min-mobile, 10px),
457
- core-functions.fontSize(var(--h3-mobile), 'mobile'),
458
- var(--h-s-font-size-max-mobile, 180px)
459
- );
460
-
461
- @include device(breakpoints.$tabPortrait) {
462
- font-size: clamp(
463
- var(--h-s-font-size-min-mobile, 10px),
464
- core-functions.fontSize(var(--h3-portrait), 'portrait'),
465
- var(--h-s-font-size-max-mobile, 180px)
466
- );
467
- }
468
-
469
- @include device(breakpoints.$tabLandscape) {
470
- font-size: clamp(
471
- var(--h-s-font-size-min-desktop, 10px),
472
- core-functions.fontSize(var(--h3-landscape), 'landscape'),
473
- var(--h-s-font-size-max-desktop, 180px)
474
- );
475
- }
476
-
477
- @include device(breakpoints.$desktop) {
478
- font-size: clamp(
479
- var(--h-s-font-size-min-desktop, 10px),
480
- core-functions.fontSize(var(--h3-desktop), 'desktop'),
481
- var(--h-s-font-size-max-desktop, 180px)
482
- );
483
- }
484
- }
485
- @mixin h-small {
486
- letter-spacing: var(--h3-letter-spacing);
487
- line-height: var(--h3-line-height);
488
- font-family: var(--h3-font-family);
489
- --default-font-weight: var(--h3-default-font-weight);
490
- font-weight: var(--default-font-weight);
491
-
492
- strong,
493
- b {
494
- font-weight: var(--h3-bold-font-weight);
495
- }
496
-
497
- font-size: clamp(
498
- var(--h-s-font-size-min-mobile, 10px),
499
- core-functions.fontSize(var(--h3-mobile), 'mobile'),
500
- var(--h-s-font-size-max-mobile, 180px)
501
- );
502
-
503
- @include device(breakpoints.$tabPortrait) {
504
- font-size: clamp(
505
- var(--h-s-font-size-min-mobile, 10px),
506
- core-functions.fontSize(var(--h3-portrait), 'portrait'),
507
- var(--h-s-font-size-max-mobile, 180px)
508
- );
509
- }
510
-
511
- @include device(breakpoints.$tabLandscape) {
512
- font-size: clamp(
513
- var(--h-s-font-size-min-desktop, 10px),
514
- core-functions.fontSize(var(--h3-landscape), 'landscape'),
515
- var(--h-s-font-size-max-desktop, 180px)
516
- );
517
- }
518
-
519
- @include device(breakpoints.$desktop) {
520
- font-size: clamp(
521
- var(--h-s-font-size-min-desktop, 10px),
522
- core-functions.fontSize(var(--h3-desktop), 'desktop'),
523
- var(--h-s-font-size-max-desktop, 180px)
524
- );
525
- }
526
- }
527
-
528
- @mixin h4 {
529
- letter-spacing: var(--h4-letter-spacing);
530
- line-height: var(--h4-line-height);
531
- font-family: var(--h4-font-family);
532
- --default-font-weight: var(--h4-default-font-weight);
533
- font-weight: var(--default-font-weight);
534
-
535
- strong,
536
- b {
537
- font-weight: var(--h4-bold-font-weight);
538
- }
539
-
540
- font-size: clamp(
541
- var(--h-xs-font-size-min-mobile, 10px),
542
- core-functions.fontSize(var(--h4-mobile), 'mobile'),
543
- var(--h-xs-font-size-max-mobile, 180px)
544
- );
545
-
546
- @include device(breakpoints.$tabPortrait) {
547
- font-size: clamp(
548
- var(--h-xs-font-size-min-mobile, 10px),
549
- core-functions.fontSize(var(--h4-portrait), 'portrait'),
550
- var(--h-xs-font-size-max-mobile, 180px)
551
- );
552
- }
553
-
554
- @include device(breakpoints.$tabLandscape) {
555
- font-size: clamp(
556
- var(--h-xs-font-size-min-desktop, 10px),
557
- core-functions.fontSize(var(--h4-landscape), 'landscape'),
558
- var(--h-xs-font-size-max-desktop, 180px)
559
- );
560
- }
561
-
562
- @include device(breakpoints.$desktop) {
563
- font-size: clamp(
564
- var(--h-xs-font-size-min-desktop, 10px),
565
- core-functions.fontSize(var(--h4-desktop), 'desktop'),
566
- var(--h-xs-font-size-max-desktop, 180px)
567
- );
568
- }
569
- }
570
- @mixin h-x-small {
571
- letter-spacing: var(--h4-letter-spacing);
572
- line-height: var(--h4-line-height);
573
- font-family: var(--h4-font-family);
574
- --default-font-weight: var(--h4-default-font-weight);
575
- font-weight: var(--default-font-weight);
576
-
577
- strong,
578
- b {
579
- font-weight: var(--h4-bold-font-weight);
580
- }
581
-
582
- font-size: clamp(
583
- var(--h-xs-font-size-min-mobile, 10px),
584
- core-functions.fontSize(var(--h4-mobile), 'mobile'),
585
- var(--h-xs-font-size-max-mobile, 180px)
586
- );
587
-
588
- @include device(breakpoints.$tabPortrait) {
589
- font-size: clamp(
590
- var(--h-xs-font-size-min-mobile, 10px),
591
- core-functions.fontSize(var(--h4-portrait), 'portrait'),
592
- var(--h-xs-font-size-max-mobile, 180px)
593
- );
594
- }
595
-
596
- @include device(breakpoints.$tabLandscape) {
597
- font-size: clamp(
598
- var(--h-xs-font-size-min-desktop, 10px),
599
- core-functions.fontSize(var(--h4-landscape), 'landscape'),
600
- var(--h-xs-font-size-max-desktop, 180px)
601
- );
602
- }
603
-
604
- @include device(breakpoints.$desktop) {
605
- font-size: clamp(
606
- var(--h-xs-font-size-min-desktop, 10px),
607
- core-functions.fontSize(var(--h4-desktop), 'desktop'),
608
- var(--h-xs-font-size-max-desktop, 180px)
609
- );
610
- }
611
- }
612
-
613
- @mixin h5 {
614
- letter-spacing: var(--h5-letter-spacing);
615
- line-height: var(--h5-line-height);
616
- font-family: var(--h5-font-family);
617
- --default-font-weight: var(--h5-default-font-weight);
618
- font-weight: var(--default-font-weight);
619
-
620
- strong,
621
- b {
622
- font-weight: var(--h5-bold-font-weight);
623
- }
624
-
625
- font-size: clamp(
626
- var(--h-xxs-font-size-min-mobile, 10px),
627
- core-functions.fontSize(var(--h5-mobile), 'mobile'),
628
- var(--h-xxs-font-size-max-mobile, 180px)
629
- );
630
-
631
- @include device(breakpoints.$tabPortrait) {
632
- font-size: clamp(
633
- var(--h-xxs-font-size-min-mobile, 10px),
634
- core-functions.fontSize(var(--h5-portrait), 'portrait'),
635
- var(--h-xxs-font-size-max-mobile, 180px)
636
- );
637
- }
638
-
639
- @include device(breakpoints.$tabLandscape) {
640
- font-size: clamp(
641
- var(--h-xxs-font-size-min-desktop, 10px),
642
- core-functions.fontSize(var(--h5-landscape), 'landscape'),
643
- var(--h-xxs-font-size-max-desktop, 180px)
644
- );
645
- }
646
-
647
- @include device(breakpoints.$desktop) {
648
- font-size: clamp(
649
- var(--h-xxs-font-size-min-desktop, 10px),
650
- core-functions.fontSize(var(--h5-desktop), 'desktop'),
651
- var(--h-xxs-font-size-max-desktop, 180px)
652
- );
653
- }
654
- }
655
- @mixin h-xx-small {
656
- letter-spacing: var(--h5-letter-spacing);
657
- line-height: var(--h5-line-height);
658
- font-family: var(--h5-font-family);
659
- --default-font-weight: var(--h5-default-font-weight);
660
- font-weight: var(--default-font-weight);
661
-
662
- strong,
663
- b {
664
- font-weight: var(--h5-bold-font-weight);
665
- }
666
-
667
- font-size: clamp(
668
- var(--h-xxs-font-size-min-mobile, 10px),
669
- core-functions.fontSize(var(--h5-mobile), 'mobile'),
670
- var(--h-xxs-font-size-max-mobile, 180px)
671
- );
672
-
673
- @include device(breakpoints.$tabPortrait) {
674
- font-size: clamp(
675
- var(--h-xxs-font-size-min-mobile, 10px),
676
- core-functions.fontSize(var(--h5-portrait), 'portrait'),
677
- var(--h-xxs-font-size-max-mobile, 180px)
678
- );
679
- }
680
-
681
- @include device(breakpoints.$tabLandscape) {
682
- font-size: clamp(
683
- var(--h-xxs-font-size-min-desktop, 10px),
684
- core-functions.fontSize(var(--h5-landscape), 'landscape'),
685
- var(--h-xxs-font-size-max-desktop, 180px)
686
- );
687
- }
688
-
689
- @include device(breakpoints.$desktop) {
690
- font-size: clamp(
691
- var(--h-xxs-font-size-min-desktop, 10px),
692
- core-functions.fontSize(var(--h5-desktop), 'desktop'),
693
- var(--h-xxs-font-size-max-desktop, 180px)
694
- );
695
- }
696
- }
697
-
698
- @mixin h6 {
699
- letter-spacing: var(--h6-letter-spacing);
700
- line-height: var(--h6-line-height);
701
- font-family: var(--h6-font-family);
702
- --default-font-weight: var(--h6-default-font-weight);
703
- font-weight: var(--default-font-weight);
704
-
705
- strong,
706
- b {
707
- font-weight: var(--h6-bold-font-weight);
708
- }
709
-
710
- font-size: clamp(
711
- var(--h-xxxs-font-size-min-mobile, 10px),
712
- core-functions.fontSize(var(--h6-mobile), 'mobile'),
713
- var(--h-xxxs-font-size-max-mobile, 180px)
714
- );
715
-
716
- @include device(breakpoints.$tabPortrait) {
717
- font-size: clamp(
718
- var(--h-xxxs-font-size-min-mobile, 10px),
719
- core-functions.fontSize(var(--h6-portrait), 'portrait'),
720
- var(--h-xxxs-font-size-max-mobile, 180px)
721
- );
722
- }
723
-
724
- @include device(breakpoints.$tabLandscape) {
725
- font-size: clamp(
726
- var(--h-xxxs-font-size-min-desktop, 10px),
727
- core-functions.fontSize(var(--h6-landscape), 'landscape'),
728
- var(--h-xxxs-font-size-max-desktop, 180px)
729
- );
730
- }
731
-
732
- @include device(breakpoints.$desktop) {
733
- font-size: clamp(
734
- var(--h-xxxs-font-size-min-desktop, 10px),
735
- core-functions.fontSize(var(--h6-desktop), 'desktop'),
736
- var(--h-xxxs-font-size-max-desktop, 180px)
737
- );
738
- }
739
- }
740
- @mixin h-xxx-small {
741
- letter-spacing: var(--h6-letter-spacing);
742
- line-height: var(--h6-line-height);
743
- font-family: var(--h6-font-family);
744
- --default-font-weight: var(--h6-default-font-weight);
745
- font-weight: var(--default-font-weight);
746
-
747
- strong,
748
- b {
749
- font-weight: var(--h6-bold-font-weight);
750
- }
751
-
752
- font-size: clamp(
753
- var(--h-xxxs-font-size-min-mobile, 10px),
754
- core-functions.fontSize(var(--h6-mobile), 'mobile'),
755
- var(--h-xxxs-font-size-max-mobile, 180px)
756
- );
757
-
758
- @include device(breakpoints.$tabPortrait) {
759
- font-size: clamp(
760
- var(--h-xxxs-font-size-min-mobile, 10px),
761
- core-functions.fontSize(var(--h6-portrait), 'portrait'),
762
- var(--h-xxxs-font-size-max-mobile, 180px)
763
- );
764
- }
765
-
766
- @include device(breakpoints.$tabLandscape) {
767
- font-size: clamp(
768
- var(--h-xxxs-font-size-min-desktop, 10px),
769
- core-functions.fontSize(var(--h6-landscape), 'landscape'),
770
- var(--h-xxxs-font-size-max-desktop, 180px)
771
- );
772
- }
773
-
774
- @include device(breakpoints.$desktop) {
775
- font-size: clamp(
776
- var(--h-xxxs-font-size-min-desktop, 10px),
777
- core-functions.fontSize(var(--h6-desktop), 'desktop'),
778
- var(--h-xxxs-font-size-max-desktop, 180px)
779
- );
780
- }
781
- }
782
-
783
- @mixin sh1 {
784
- letter-spacing: var(--sh1-letter-spacing);
785
- line-height: var(--sh1-line-height);
786
- font-family: var(--sh1-font-family);
787
- --default-font-weight: var(--sh1-default-font-weight);
788
- font-weight: var(--default-font-weight);
789
-
790
- strong,
791
- b {
792
- font-weight: var(--sh1-bold-font-weight);
793
- }
794
-
795
- font-size: clamp(
796
- var(--sh-xl-font-size-min-mobile, 10px),
797
- core-functions.fontSize(var(--sh1-mobile), 'mobile'),
798
- var(--sh-xl-font-size-max-mobile, 180px)
799
- );
800
-
801
- @include device(breakpoints.$tabPortrait) {
802
- font-size: clamp(
803
- var(--sh-xl-font-size-min-mobile, 10px),
804
- core-functions.fontSize(var(--sh1-portrait), 'portrait'),
805
- var(--sh-xl-font-size-max-mobile, 180px)
806
- );
807
- }
808
-
809
- @include device(breakpoints.$tabLandscape) {
810
- font-size: clamp(
811
- var(--sh-xl-font-size-min-desktop, 10px),
812
- core-functions.fontSize(var(--sh1-landscape), 'landscape'),
813
- var(--sh-xl-font-size-max-desktop, 180px)
814
- );
815
- }
816
-
817
- @include device(breakpoints.$desktop) {
818
- font-size: clamp(
819
- var(--sh-xl-font-size-min-desktop, 10px),
820
- core-functions.fontSize(var(--sh1-desktop), 'desktop'),
821
- var(--sh-xl-font-size-max-desktop, 180px)
822
- );
823
- }
824
- }
825
- @mixin sh-x-large {
826
- letter-spacing: var(--sh1-letter-spacing);
827
- line-height: var(--sh1-line-height);
828
- font-family: var(--sh1-font-family);
829
- --default-font-weight: var(--sh1-default-font-weight);
830
- font-weight: var(--default-font-weight);
831
-
832
- strong,
833
- b {
834
- font-weight: var(--sh1-bold-font-weight);
835
- }
836
-
837
- font-size: clamp(
838
- var(--sh-xl-font-size-min-mobile, 10px),
839
- core-functions.fontSize(var(--sh1-mobile), 'mobile'),
840
- var(--sh-xl-font-size-max-mobile, 180px)
841
- );
842
-
843
- @include device(breakpoints.$tabPortrait) {
844
- font-size: clamp(
845
- var(--sh-xl-font-size-min-mobile, 10px),
846
- core-functions.fontSize(var(--sh1-portrait), 'portrait'),
847
- var(--sh-xl-font-size-max-mobile, 180px)
848
- );
849
- }
850
-
851
- @include device(breakpoints.$tabLandscape) {
852
- font-size: clamp(
853
- var(--sh-xl-font-size-min-desktop, 10px),
854
- core-functions.fontSize(var(--sh1-landscape), 'landscape'),
855
- var(--sh-xl-font-size-max-desktop, 180px)
856
- );
857
- }
858
-
859
- @include device(breakpoints.$desktop) {
860
- font-size: clamp(
861
- var(--sh-xl-font-size-min-desktop, 10px),
862
- core-functions.fontSize(var(--sh1-desktop), 'desktop'),
863
- var(--sh-xl-font-size-max-desktop, 180px)
864
- );
865
- }
866
- }
867
-
868
- @mixin sh2 {
869
- letter-spacing: var(--sh2-letter-spacing);
870
- line-height: var(--sh2-line-height);
871
- font-family: var(--sh2-font-family);
872
- --default-font-weight: var(--sh2-default-font-weight);
873
- font-weight: var(--default-font-weight);
874
-
875
- strong,
876
- b {
877
- font-weight: var(--sh2-bold-font-weight);
878
- }
879
-
880
- font-size: clamp(
881
- var(--sh-l-font-size-min-mobile, 10px),
882
- core-functions.fontSize(var(--sh2-mobile), 'mobile'),
883
- var(--sh-l-font-size-max-mobile, 180px)
884
- );
885
-
886
- @include device(breakpoints.$tabPortrait) {
887
- font-size: clamp(
888
- var(--sh-l-font-size-min-mobile, 10px),
889
- core-functions.fontSize(var(--sh2-portrait), 'portrait'),
890
- var(--sh-l-font-size-max-mobile, 180px)
891
- );
892
- }
893
-
894
- @include device(breakpoints.$tabLandscape) {
895
- font-size: clamp(
896
- var(--sh-l-font-size-min-desktop, 10px),
897
- core-functions.fontSize(var(--sh2-landscape), 'landscape'),
898
- var(--sh-l-font-size-max-desktop, 180px)
899
- );
900
- }
901
-
902
- @include device(breakpoints.$desktop) {
903
- font-size: clamp(
904
- var(--sh-l-font-size-min-desktop, 10px),
905
- core-functions.fontSize(var(--sh2-desktop), 'desktop'),
906
- var(--sh-l-font-size-max-desktop, 180px)
907
- );
908
- }
909
- }
910
- @mixin sh-large {
911
- letter-spacing: var(--sh2-letter-spacing);
912
- line-height: var(--sh2-line-height);
913
- font-family: var(--sh2-font-family);
914
- --default-font-weight: var(--sh2-default-font-weight);
915
- font-weight: var(--default-font-weight);
916
-
917
- strong,
918
- b {
919
- font-weight: var(--sh2-bold-font-weight);
920
- }
921
-
922
- font-size: clamp(
923
- var(--sh-l-font-size-min-mobile, 10px),
924
- core-functions.fontSize(var(--sh2-mobile), 'mobile'),
925
- var(--sh-l-font-size-max-mobile, 180px)
926
- );
927
-
928
- @include device(breakpoints.$tabPortrait) {
929
- font-size: clamp(
930
- var(--sh-l-font-size-min-mobile, 10px),
931
- core-functions.fontSize(var(--sh2-portrait), 'portrait'),
932
- var(--sh-l-font-size-max-mobile, 180px)
933
- );
934
- }
935
-
936
- @include device(breakpoints.$tabLandscape) {
937
- font-size: clamp(
938
- var(--sh-l-font-size-min-desktop, 10px),
939
- core-functions.fontSize(var(--sh2-landscape), 'landscape'),
940
- var(--sh-l-font-size-max-desktop, 180px)
941
- );
942
- }
943
-
944
- @include device(breakpoints.$desktop) {
945
- font-size: clamp(
946
- var(--sh-l-font-size-min-desktop, 10px),
947
- core-functions.fontSize(var(--sh2-desktop), 'desktop'),
948
- var(--sh-l-font-size-max-desktop, 180px)
949
- );
950
- }
951
- }
952
-
953
- @mixin sh3 {
954
- letter-spacing: var(--sh3-letter-spacing);
955
- line-height: var(--sh3-line-height);
956
- font-family: var(--sh3-font-family);
957
- --default-font-weight: var(--sh3-default-font-weight);
958
- font-weight: var(--default-font-weight);
959
-
960
- strong,
961
- b {
962
- font-weight: var(--sh3-bold-font-weight);
963
- }
964
-
965
- font-size: clamp(
966
- var(--sh-m-font-size-min-mobile, 10px),
967
- core-functions.fontSize(var(--sh3-mobile), 'mobile'),
968
- var(--sh-m-font-size-max-mobile, 180px)
969
- );
970
-
971
- @include device(breakpoints.$tabPortrait) {
972
- font-size: clamp(
973
- var(--sh-m-font-size-min-mobile, 10px),
974
- core-functions.fontSize(var(--sh3-portrait), 'portrait'),
975
- var(--sh-m-font-size-max-mobile, 180px)
976
- );
977
- }
978
-
979
- @include device(breakpoints.$tabLandscape) {
980
- font-size: clamp(
981
- var(--sh-m-font-size-min-desktop, 10px),
982
- core-functions.fontSize(var(--sh3-landscape), 'landscape'),
983
- var(--sh-m-font-size-max-desktop, 180px)
984
- );
985
- }
986
-
987
- @include device(breakpoints.$desktop) {
988
- font-size: clamp(
989
- var(--sh-m-font-size-min-desktop, 10px),
990
- core-functions.fontSize(var(--sh3-desktop), 'desktop'),
991
- var(--sh-m-font-size-max-desktop, 180px)
992
- );
993
- }
994
- }
995
- @mixin sh-medium {
996
- letter-spacing: var(--sh3-letter-spacing);
997
- line-height: var(--sh3-line-height);
998
- font-family: var(--sh3-font-family);
999
- --default-font-weight: var(--sh3-default-font-weight);
1000
- font-weight: var(--default-font-weight);
1001
-
1002
- strong,
1003
- b {
1004
- font-weight: var(--sh3-bold-font-weight);
1005
- }
1006
-
1007
- font-size: clamp(
1008
- var(--sh-m-font-size-min-mobile, 10px),
1009
- core-functions.fontSize(var(--sh3-mobile), 'mobile'),
1010
- var(--sh-m-font-size-max-mobile, 180px)
1011
- );
1012
-
1013
- @include device(breakpoints.$tabPortrait) {
1014
- font-size: clamp(
1015
- var(--sh-m-font-size-min-mobile, 10px),
1016
- core-functions.fontSize(var(--sh3-portrait), 'portrait'),
1017
- var(--sh-m-font-size-max-mobile, 180px)
1018
- );
1019
- }
1020
-
1021
- @include device(breakpoints.$tabLandscape) {
1022
- font-size: clamp(
1023
- var(--sh-m-font-size-min-desktop, 10px),
1024
- core-functions.fontSize(var(--sh3-landscape), 'landscape'),
1025
- var(--sh-m-font-size-max-desktop, 180px)
1026
- );
1027
- }
1028
-
1029
- @include device(breakpoints.$desktop) {
1030
- font-size: clamp(
1031
- var(--sh-m-font-size-min-desktop, 10px),
1032
- core-functions.fontSize(var(--sh3-desktop), 'desktop'),
1033
- var(--sh-m-font-size-max-desktop, 180px)
1034
- );
1035
- }
1036
- }
1037
- @mixin sh4 {
1038
- letter-spacing: var(--sh4-letter-spacing);
1039
- line-height: var(--sh4-line-height);
1040
- font-family: var(--sh4-font-family);
1041
- --default-font-weight: var(--sh4-default-font-weight);
1042
- font-weight: var(--default-font-weight);
1043
-
1044
- strong,
1045
- b {
1046
- font-weight: var(--sh4-bold-font-weight);
1047
- }
1048
-
1049
- font-size: clamp(
1050
- var(--sh-s-font-size-min-mobile, 10px),
1051
- core-functions.fontSize(var(--sh4-mobile), 'mobile'),
1052
- var(--sh-s-font-size-max-mobile, 180px)
1053
- );
1054
-
1055
- @include device(breakpoints.$tabPortrait) {
1056
- font-size: clamp(
1057
- var(--sh-s-font-size-min-mobile, 10px),
1058
- core-functions.fontSize(var(--sh4-portrait), 'portrait'),
1059
- var(--sh-s-font-size-max-mobile, 180px)
1060
- );
1061
- }
1062
-
1063
- @include device(breakpoints.$tabLandscape) {
1064
- font-size: clamp(
1065
- var(--sh-s-font-size-min-desktop, 10px),
1066
- core-functions.fontSize(var(--sh4-landscape), 'landscape'),
1067
- var(--sh-s-font-size-max-desktop, 180px)
1068
- );
1069
- }
1070
-
1071
- @include device(breakpoints.$desktop) {
1072
- font-size: clamp(
1073
- var(--sh-s-font-size-min-desktop, 10px),
1074
- core-functions.fontSize(var(--sh4-desktop), 'desktop'),
1075
- var(--sh-s-font-size-max-desktop, 180px)
1076
- );
1077
- }
1078
- }
1079
- @mixin sh-small {
1080
- letter-spacing: var(--sh4-letter-spacing);
1081
- line-height: var(--sh4-line-height);
1082
- font-family: var(--sh4-font-family);
1083
- --default-font-weight: var(--sh4-default-font-weight);
1084
- font-weight: var(--default-font-weight);
1085
-
1086
- strong,
1087
- b {
1088
- font-weight: var(--sh4-bold-font-weight);
1089
- }
1090
-
1091
- font-size: clamp(
1092
- var(--sh-s-font-size-min-mobile, 10px),
1093
- core-functions.fontSize(var(--sh4-mobile), 'mobile'),
1094
- var(--sh-s-font-size-max-mobile, 180px)
1095
- );
1096
-
1097
- @include device(breakpoints.$tabPortrait) {
1098
- font-size: clamp(
1099
- var(--sh-s-font-size-min-mobile, 10px),
1100
- core-functions.fontSize(var(--sh4-portrait), 'portrait'),
1101
- var(--sh-s-font-size-max-mobile, 180px)
1102
- );
1103
- }
1104
-
1105
- @include device(breakpoints.$tabLandscape) {
1106
- font-size: clamp(
1107
- var(--sh-s-font-size-min-desktop, 10px),
1108
- core-functions.fontSize(var(--sh4-landscape), 'landscape'),
1109
- var(--sh-s-font-size-max-desktop, 180px)
1110
- );
1111
- }
1112
-
1113
- @include device(breakpoints.$desktop) {
1114
- font-size: clamp(
1115
- var(--sh-s-font-size-min-desktop, 10px),
1116
- core-functions.fontSize(var(--sh4-desktop), 'desktop'),
1117
- var(--sh-s-font-size-max-desktop, 180px)
1118
- );
1119
- }
1120
- }
1121
- @mixin sh5 {
1122
- letter-spacing: var(--sh5-letter-spacing);
1123
- line-height: var(--sh5-line-height);
1124
- font-family: var(--sh5-font-family);
1125
- --default-font-weight: var(--sh5-default-font-weight);
1126
- font-weight: var(--default-font-weight);
1127
-
1128
- strong,
1129
- b {
1130
- font-weight: var(--sh5-bold-font-weight);
1131
- }
1132
-
1133
- font-size: clamp(
1134
- var(--sh-xs-font-size-min-mobile, 10px),
1135
- core-functions.fontSize(var(--sh5-mobile), 'mobile'),
1136
- var(--sh-xs-font-size-max-mobile, 180px)
1137
- );
1138
-
1139
- @include device(breakpoints.$tabPortrait) {
1140
- font-size: clamp(
1141
- var(--sh-xs-font-size-min-mobile, 10px),
1142
- core-functions.fontSize(var(--sh5-portrait), 'portrait'),
1143
- var(--sh-xs-font-size-max-mobile, 180px)
1144
- );
1145
- }
1146
-
1147
- @include device(breakpoints.$tabLandscape) {
1148
- font-size: clamp(
1149
- var(--sh-xs-font-size-min-desktop, 10px),
1150
- core-functions.fontSize(var(--sh5-landscape), 'landscape'),
1151
- var(--sh-xs-font-size-max-desktop, 180px)
1152
- );
1153
- }
1154
-
1155
- @include device(breakpoints.$desktop) {
1156
- font-size: clamp(
1157
- var(--sh-xs-font-size-min-desktop, 10px),
1158
- core-functions.fontSize(var(--sh5-desktop), 'desktop'),
1159
- var(--sh-xs-font-size-max-desktop, 180px)
1160
- );
1161
- }
1162
- }
1163
- @mixin sh-x-small {
1164
- letter-spacing: var(--sh5-letter-spacing);
1165
- line-height: var(--sh5-line-height);
1166
- font-family: var(--sh5-font-family);
1167
- --default-font-weight: var(--sh5-default-font-weight);
1168
- font-weight: var(--default-font-weight);
1169
-
1170
- strong,
1171
- b {
1172
- font-weight: var(--sh5-bold-font-weight);
1173
- }
1174
-
1175
- font-size: clamp(
1176
- var(--sh-xs-font-size-min-mobile, 10px),
1177
- core-functions.fontSize(var(--sh5-mobile), 'mobile'),
1178
- var(--sh-xs-font-size-max-mobile, 180px)
1179
- );
1180
-
1181
- @include device(breakpoints.$tabPortrait) {
1182
- font-size: clamp(
1183
- var(--sh-xs-font-size-min-mobile, 10px),
1184
- core-functions.fontSize(var(--sh5-portrait), 'portrait'),
1185
- var(--sh-xs-font-size-max-mobile, 180px)
1186
- );
1187
- }
1188
-
1189
- @include device(breakpoints.$tabLandscape) {
1190
- font-size: clamp(
1191
- var(--sh-xs-font-size-min-desktop, 10px),
1192
- core-functions.fontSize(var(--sh5-landscape), 'landscape'),
1193
- var(--sh-xs-font-size-max-desktop, 180px)
1194
- );
1195
- }
1196
-
1197
- @include device(breakpoints.$desktop) {
1198
- font-size: clamp(
1199
- var(--sh-xs-font-size-min-desktop, 10px),
1200
- core-functions.fontSize(var(--sh5-desktop), 'desktop'),
1201
- var(--sh-xs-font-size-max-desktop, 180px)
1202
- );
1203
- }
1204
- }
1205
- @mixin sh6 {
1206
- letter-spacing: var(--sh6-letter-spacing);
1207
- line-height: var(--sh6-line-height);
1208
- font-family: var(--sh6-font-family);
1209
- --default-font-weight: var(--sh6-default-font-weight);
1210
- font-weight: var(--default-font-weight);
1211
-
1212
- strong,
1213
- b {
1214
- font-weight: var(--sh6-bold-font-weight);
1215
- }
1216
-
1217
- font-size: clamp(
1218
- var(--sh-xxs-font-size-min-mobile, 10px),
1219
- core-functions.fontSize(var(--sh6-mobile), 'mobile'),
1220
- var(--sh-xxs-font-size-max-mobile, 180px)
1221
- );
1222
-
1223
- @include device(breakpoints.$tabPortrait) {
1224
- font-size: clamp(
1225
- var(--sh-xxs-font-size-min-mobile, 10px),
1226
- core-functions.fontSize(var(--sh6-portrait), 'portrait'),
1227
- var(--sh-xxs-font-size-max-mobile, 180px)
1228
- );
1229
- }
1230
-
1231
- @include device(breakpoints.$tabLandscape) {
1232
- font-size: clamp(
1233
- var(--sh-xxs-font-size-min-desktop, 10px),
1234
- core-functions.fontSize(var(--sh6-landscape), 'landscape'),
1235
- var(--sh-xxs-font-size-max-desktop, 180px)
1236
- );
1237
- }
1238
-
1239
- @include device(breakpoints.$desktop) {
1240
- font-size: clamp(
1241
- var(--sh-xxs-font-size-min-desktop, 10px),
1242
- core-functions.fontSize(var(--sh6-desktop), 'desktop'),
1243
- var(--sh-xxs-font-size-max-desktop, 180px)
1244
- );
1245
- }
1246
- }
1247
- @mixin sh-xx-small {
1248
- letter-spacing: var(--sh6-letter-spacing);
1249
- line-height: var(--sh6-line-height);
1250
- font-family: var(--sh6-font-family);
1251
- --default-font-weight: var(--sh6-default-font-weight);
1252
- font-weight: var(--default-font-weight);
1253
-
1254
- strong,
1255
- b {
1256
- font-weight: var(--sh6-bold-font-weight);
1257
- }
1258
-
1259
- font-size: clamp(
1260
- var(--sh-xxs-font-size-min-mobile, 10px),
1261
- core-functions.fontSize(var(--sh6-mobile), 'mobile'),
1262
- var(--sh-xxs-font-size-max-mobile, 180px)
1263
- );
1264
-
1265
- @include device(breakpoints.$tabPortrait) {
1266
- font-size: clamp(
1267
- var(--sh-xxs-font-size-min-mobile, 10px),
1268
- core-functions.fontSize(var(--sh6-portrait), 'portrait'),
1269
- var(--sh-xxs-font-size-max-mobile, 180px)
1270
- );
1271
- }
1272
-
1273
- @include device(breakpoints.$tabLandscape) {
1274
- font-size: clamp(
1275
- var(--sh-xxs-font-size-min-desktop, 10px),
1276
- core-functions.fontSize(var(--sh6-landscape), 'landscape'),
1277
- var(--sh-xxs-font-size-max-desktop, 180px)
1278
- );
1279
- }
1280
-
1281
- @include device(breakpoints.$desktop) {
1282
- font-size: clamp(
1283
- var(--sh-xxs-font-size-min-desktop, 10px),
1284
- core-functions.fontSize(var(--sh6-desktop), 'desktop'),
1285
- var(--sh-xxs-font-size-max-desktop, 180px)
1286
- );
1287
- }
1288
- }
1289
-
1290
- @mixin p-l {
1291
- line-height: var(--paragraph-line-height);
1292
- letter-spacing: var(--paragraph-letter-spacing);
1293
- font-family: var(--paragraph-font-family);
1294
-
1295
- strong,
1296
- b {
1297
- font-weight: var(--paragraph-bold-font-weight);
1298
- }
1299
-
1300
- &:has(.font-tertiary) {
1301
- line-height: calc(
1302
- var(--paragraph-line-height) *
1303
- var(--global-line-height-multiplier-tertiary)
1304
- );
1305
- }
1306
-
1307
- em {
1308
- font-style: italic;
1309
- }
1310
-
1311
- font-size: clamp(
1312
- var(--p-l-font-size-min-mobile, 10px),
1313
- core-functions.fontSize(var(--p-l-mobile), 'mobile'),
1314
- var(--p-l-font-size-max-mobile, 180px)
1315
- );
1316
-
1317
- @include device(breakpoints.$tabPortrait) {
1318
- font-size: clamp(
1319
- var(--p-l-font-size-min-mobile, 10px),
1320
- core-functions.fontSize(var(--p-l-portrait), 'portrait'),
1321
- var(--p-l-font-size-max-mobile, 180px)
1322
- );
1323
- }
1324
-
1325
- @include device(breakpoints.$tabLandscape) {
1326
- font-size: clamp(
1327
- var(--p-l-font-size-min-desktop, 10px),
1328
- core-functions.fontSize(var(--p-l-landscape), 'landscape'),
1329
- var(--p-l-font-size-max-desktop, 180px)
1330
- );
1331
- }
1332
-
1333
- @include device(breakpoints.$desktop) {
1334
- font-size: clamp(
1335
- var(--p-l-font-size-min-desktop, 10px),
1336
- core-functions.fontSize(var(--p-l-desktop), 'desktop'),
1337
- var(--p-l-font-size-max-desktop, 180px)
1338
- );
1339
- }
1340
- }
1341
- @mixin p-large {
1342
- line-height: var(--paragraph-line-height);
1343
- letter-spacing: var(--paragraph-letter-spacing);
1344
- font-family: var(--paragraph-font-family);
1345
-
1346
- strong,
1347
- b {
1348
- font-weight: var(--paragraph-bold-font-weight);
1349
- }
1350
-
1351
- &:has(.font-tertiary) {
1352
- line-height: calc(
1353
- var(--paragraph-line-height) *
1354
- var(--global-line-height-multiplier-tertiary)
1355
- );
1356
- }
1357
-
1358
- em {
1359
- font-style: italic;
1360
- }
1361
-
1362
- font-size: clamp(
1363
- var(--p-l-font-size-min-mobile, 10px),
1364
- core-functions.fontSize(var(--p-l-mobile), 'mobile'),
1365
- var(--p-l-font-size-max-mobile, 180px)
1366
- );
1367
-
1368
- @include device(breakpoints.$tabPortrait) {
1369
- font-size: clamp(
1370
- var(--p-l-font-size-min-mobile, 10px),
1371
- core-functions.fontSize(var(--p-l-portrait), 'portrait'),
1372
- var(--p-l-font-size-max-mobile, 180px)
1373
- );
1374
- }
1375
-
1376
- @include device(breakpoints.$tabLandscape) {
1377
- font-size: clamp(
1378
- var(--p-l-font-size-min-desktop, 10px),
1379
- core-functions.fontSize(var(--p-l-landscape), 'landscape'),
1380
- var(--p-l-font-size-max-desktop, 180px)
1381
- );
1382
- }
1383
-
1384
- @include device(breakpoints.$desktop) {
1385
- font-size: clamp(
1386
- var(--p-l-font-size-min-desktop, 10px),
1387
- core-functions.fontSize(var(--p-l-desktop), 'desktop'),
1388
- var(--p-l-font-size-max-desktop, 180px)
1389
- );
1390
- }
1391
- }
1392
-
1393
- @mixin p {
1394
- line-height: var(--paragraph-line-height);
1395
- letter-spacing: var(--paragraph-letter-spacing);
1396
- font-family: var(--paragraph-font-family);
1397
- --default-font-weight: var(--paragraph-default-font-weight);
1398
- font-weight: var(--default-font-weight);
1399
-
1400
- strong,
1401
- b {
1402
- font-weight: var(--paragraph-bold-font-weight);
1403
- }
1404
-
1405
- &:has(.font-tertiary) {
1406
- line-height: calc(
1407
- var(--paragraph-line-height) *
1408
- var(--global-line-height-multiplier-tertiary)
1409
- );
1410
- }
1411
-
1412
- em {
1413
- font-style: italic;
1414
- }
1415
-
1416
- font-size: clamp(
1417
- var(--p-font-size-min-mobile, 10px),
1418
- core-functions.fontSize(var(--p-mobile), 'mobile'),
1419
- var(--p-font-size-max-mobile, 180px)
1420
- );
1421
-
1422
- @include device(breakpoints.$tabPortrait) {
1423
- font-size: clamp(
1424
- var(--p-font-size-min-mobile, 10px),
1425
- core-functions.fontSize(var(--p-portrait), 'portrait'),
1426
- var(--p-font-size-max-mobile, 180px)
1427
- );
1428
- }
1429
-
1430
- @include device(breakpoints.$tabLandscape) {
1431
- font-size: clamp(
1432
- var(--p-font-size-min-desktop, 10px),
1433
- core-functions.fontSize(var(--p-landscape), 'landscape'),
1434
- var(--p-font-size-max-desktop, 180px)
1435
- );
1436
- }
1437
-
1438
- @include device(breakpoints.$desktop) {
1439
- font-size: clamp(
1440
- var(--p-font-size-min-desktop, 10px),
1441
- core-functions.fontSize(var(--p-desktop), 'desktop'),
1442
- var(--p-font-size-max-desktop, 180px)
1443
- );
1444
- }
1445
- }
1446
- @mixin p-medium {
1447
- line-height: var(--paragraph-line-height);
1448
- letter-spacing: var(--paragraph-letter-spacing);
1449
- font-family: var(--paragraph-font-family);
1450
- --default-font-weight: var(--paragraph-default-font-weight);
1451
- font-weight: var(--default-font-weight);
1452
-
1453
- strong,
1454
- b {
1455
- font-weight: var(--paragraph-bold-font-weight);
1456
- }
1457
-
1458
- &:has(.font-tertiary) {
1459
- line-height: calc(
1460
- var(--paragraph-line-height) *
1461
- var(--global-line-height-multiplier-tertiary)
1462
- );
1463
- }
1464
-
1465
- em {
1466
- font-style: italic;
1467
- }
1468
-
1469
- font-size: clamp(
1470
- var(--p-font-size-min-mobile, 10px),
1471
- core-functions.fontSize(var(--p-mobile), 'mobile'),
1472
- var(--p-font-size-max-mobile, 180px)
1473
- );
1474
-
1475
- @include device(breakpoints.$tabPortrait) {
1476
- font-size: clamp(
1477
- var(--p-font-size-min-mobile, 10px),
1478
- core-functions.fontSize(var(--p-portrait), 'portrait'),
1479
- var(--p-font-size-max-mobile, 180px)
1480
- );
1481
- }
1482
-
1483
- @include device(breakpoints.$tabLandscape) {
1484
- font-size: clamp(
1485
- var(--p-font-size-min-desktop, 10px),
1486
- core-functions.fontSize(var(--p-landscape), 'landscape'),
1487
- var(--p-font-size-max-desktop, 180px)
1488
- );
1489
- }
1490
-
1491
- @include device(breakpoints.$desktop) {
1492
- font-size: clamp(
1493
- var(--p-font-size-min-desktop, 10px),
1494
- core-functions.fontSize(var(--p-desktop), 'desktop'),
1495
- var(--p-font-size-max-desktop, 180px)
1496
- );
1497
- }
1498
- }
1499
-
1500
- @mixin p-s {
1501
- line-height: var(--paragraph-line-height);
1502
- letter-spacing: var(--paragraph-letter-spacing);
1503
- font-family: var(--paragraph-font-family);
1504
-
1505
- strong,
1506
- b {
1507
- font-weight: var(--paragraph-bold-font-weight);
1508
- }
1509
-
1510
- &:has(.font-tertiary) {
1511
- line-height: calc(
1512
- var(--paragraph-line-height) *
1513
- var(--global-line-height-multiplier-tertiary)
1514
- );
1515
- }
1516
-
1517
- em {
1518
- font-style: italic;
1519
- }
1520
-
1521
- font-size: clamp(
1522
- var(--p-s-font-size-min-mobile, 10px),
1523
- core-functions.fontSize(var(--p-s-mobile), 'mobile'),
1524
- var(--p-s-font-size-max-mobile, 180px)
1525
- );
1526
-
1527
- @include device(breakpoints.$tabPortrait) {
1528
- font-size: clamp(
1529
- var(--p-s-font-size-min-mobile, 10px),
1530
- core-functions.fontSize(var(--p-s-portrait), 'portrait'),
1531
- var(--p-s-font-size-max-mobile, 180px)
1532
- );
1533
- }
1534
-
1535
- @include device(breakpoints.$tabLandscape) {
1536
- font-size: clamp(
1537
- var(--p-s-font-size-min-desktop, 10px),
1538
- core-functions.fontSize(var(--p-s-landscape), 'landscape'),
1539
- var(--p-s-font-size-max-desktop, 180px)
1540
- );
1541
- }
1542
-
1543
- @include device(breakpoints.$desktop) {
1544
- font-size: clamp(
1545
- var(--p-s-font-size-min-desktop, 10px),
1546
- core-functions.fontSize(var(--p-s-desktop), 'desktop'),
1547
- var(--p-s-font-size-max-desktop, 180px)
1548
- );
1549
- }
1550
- }
1551
- @mixin p-small {
1552
- line-height: var(--paragraph-line-height);
1553
- letter-spacing: var(--paragraph-letter-spacing);
1554
- font-family: var(--paragraph-font-family);
1555
-
1556
- strong,
1557
- b {
1558
- font-weight: var(--paragraph-bold-font-weight);
1559
- }
1560
-
1561
- &:has(.font-tertiary) {
1562
- line-height: calc(
1563
- var(--paragraph-line-height) *
1564
- var(--global-line-height-multiplier-tertiary)
1565
- );
1566
- }
1567
-
1568
- em {
1569
- font-style: italic;
1570
- }
1571
-
1572
- font-size: clamp(
1573
- var(--p-s-font-size-min-mobile, 10px),
1574
- core-functions.fontSize(var(--p-s-mobile), 'mobile'),
1575
- var(--p-s-font-size-max-mobile, 180px)
1576
- );
1577
-
1578
- @include device(breakpoints.$tabPortrait) {
1579
- font-size: clamp(
1580
- var(--p-s-font-size-min-mobile, 10px),
1581
- core-functions.fontSize(var(--p-s-portrait), 'portrait'),
1582
- var(--p-s-font-size-max-mobile, 180px)
1583
- );
1584
- }
1585
-
1586
- @include device(breakpoints.$tabLandscape) {
1587
- font-size: clamp(
1588
- var(--p-s-font-size-min-desktop, 10px),
1589
- core-functions.fontSize(var(--p-s-landscape), 'landscape'),
1590
- var(--p-s-font-size-max-desktop, 180px)
1591
- );
1592
- }
1593
-
1594
- @include device(breakpoints.$desktop) {
1595
- font-size: clamp(
1596
- var(--p-s-font-size-min-desktop, 10px),
1597
- core-functions.fontSize(var(--p-s-desktop), 'desktop'),
1598
- var(--p-s-font-size-max-desktop, 180px)
1599
- );
1600
- }
1601
- }
1602
-
1603
- @mixin p-xs {
1604
- line-height: var(--paragraph-line-height);
1605
- letter-spacing: var(--paragraph-letter-spacing);
1606
- font-family: var(--paragraph-font-family);
1607
-
1608
- strong,
1609
- b {
1610
- font-weight: var(--paragraph-bold-font-weight);
1611
- }
1612
-
1613
- &:has(.font-tertiary) {
1614
- line-height: calc(
1615
- var(--paragraph-line-height) *
1616
- var(--global-line-height-multiplier-tertiary)
1617
- );
1618
- }
1619
-
1620
- em {
1621
- font-style: italic;
1622
- }
1623
-
1624
- font-size: clamp(
1625
- var(--p-xs-font-size-min-mobile, 10px),
1626
- core-functions.fontSize(var(--p-xs-mobile), 'mobile'),
1627
- var(--p-xs-font-size-max-mobile, 180px)
1628
- );
1629
-
1630
- @include device(breakpoints.$tabPortrait) {
1631
- font-size: clamp(
1632
- var(--p-xs-font-size-min-mobile, 10px),
1633
- core-functions.fontSize(var(--p-xs-portrait), 'portrait'),
1634
- var(--p-xs-font-size-max-mobile, 180px)
1635
- );
1636
- }
1637
-
1638
- @include device(breakpoints.$tabLandscape) {
1639
- font-size: clamp(
1640
- var(--p-xs-font-size-min-desktop, 10px),
1641
- core-functions.fontSize(var(--p-xs-landscape), 'landscape'),
1642
- var(--p-xs-font-size-max-desktop, 180px)
1643
- );
1644
- }
1645
-
1646
- @include device(breakpoints.$desktop) {
1647
- font-size: clamp(
1648
- var(--p-xs-font-size-min-desktop, 10px),
1649
- core-functions.fontSize(var(--p-xs-desktop), 'desktop'),
1650
- var(--p-xs-font-size-max-desktop, 180px)
1651
- );
1652
- }
1653
- }
1654
- @mixin p-x-small {
1655
- line-height: var(--paragraph-line-height);
1656
- letter-spacing: var(--paragraph-letter-spacing);
1657
- font-family: var(--paragraph-font-family);
1658
-
1659
- strong,
1660
- b {
1661
- font-weight: var(--paragraph-bold-font-weight);
1662
- }
1663
-
1664
- &:has(.font-tertiary) {
1665
- line-height: calc(
1666
- var(--paragraph-line-height) *
1667
- var(--global-line-height-multiplier-tertiary)
1668
- );
1669
- }
1670
-
1671
- em {
1672
- font-style: italic;
1673
- }
1674
-
1675
- font-size: clamp(
1676
- var(--p-xs-font-size-min-mobile, 10px),
1677
- core-functions.fontSize(var(--p-xs-mobile), 'mobile'),
1678
- var(--p-xs-font-size-max-mobile, 180px)
1679
- );
1680
-
1681
- @include device(breakpoints.$tabPortrait) {
1682
- font-size: clamp(
1683
- var(--p-xs-font-size-min-mobile, 10px),
1684
- core-functions.fontSize(var(--p-xs-portrait), 'portrait'),
1685
- var(--p-xs-font-size-max-mobile, 180px)
1686
- );
1687
- }
1688
-
1689
- @include device(breakpoints.$tabLandscape) {
1690
- font-size: clamp(
1691
- var(--p-xs-font-size-min-desktop, 10px),
1692
- core-functions.fontSize(var(--p-xs-landscape), 'landscape'),
1693
- var(--p-xs-font-size-max-desktop, 180px)
1694
- );
1695
- }
1696
-
1697
- @include device(breakpoints.$desktop) {
1698
- font-size: clamp(
1699
- var(--p-xs-font-size-min-desktop, 10px),
1700
- core-functions.fontSize(var(--p-xs-desktop), 'desktop'),
1701
- var(--p-xs-font-size-max-desktop, 180px)
1702
- );
1703
- }
1704
- }
1705
-
1706
- @mixin p-xxs {
1707
- line-height: var(--paragraph-line-height);
1708
- letter-spacing: var(--paragraph-letter-spacing);
1709
- font-family: var(--paragraph-font-family);
1710
-
1711
- strong,
1712
- b {
1713
- font-weight: var(--paragraph-bold-font-weight);
1714
- }
1715
-
1716
- &:has(.font-tertiary) {
1717
- line-height: calc(
1718
- var(--paragraph-line-height) *
1719
- var(--global-line-height-multiplier-tertiary)
1720
- );
1721
- }
1722
-
1723
- em {
1724
- font-style: italic;
1725
- }
1726
-
1727
- font-size: clamp(
1728
- var(--p-xxs-font-size-min-mobile, 10px),
1729
- core-functions.fontSize(var(--p-xxs-mobile), 'mobile'),
1730
- var(--p-xxs-font-size-max-mobile, 180px)
1731
- );
1732
-
1733
- @include device(breakpoints.$tabPortrait) {
1734
- font-size: clamp(
1735
- var(--p-xxs-font-size-min-mobile, 10px),
1736
- core-functions.fontSize(var(--p-xxs-portrait), 'portrait'),
1737
- var(--p-xxs-font-size-max-mobile, 180px)
1738
- );
1739
- }
1740
-
1741
- @include device(breakpoints.$tabLandscape) {
1742
- font-size: clamp(
1743
- var(--p-xxs-font-size-min-desktop, 10px),
1744
- core-functions.fontSize(var(--p-xxs-landscape), 'landscape'),
1745
- var(--p-xxs-font-size-max-desktop, 180px)
1746
- );
1747
- }
1748
-
1749
- @include device(breakpoints.$desktop) {
1750
- font-size: clamp(
1751
- var(--p-xxs-font-size-min-desktop, 10px),
1752
- core-functions.fontSize(var(--p-xxs-desktop), 'desktop'),
1753
- var(--p-xxs-font-size-max-desktop, 180px)
1754
- );
1755
- }
1756
- }
1757
- @mixin p-xx-small {
1758
- line-height: var(--paragraph-line-height);
1759
- letter-spacing: var(--paragraph-letter-spacing);
1760
- font-family: var(--paragraph-font-family);
1761
-
1762
- strong,
1763
- b {
1764
- font-weight: var(--paragraph-bold-font-weight);
1765
- }
1766
-
1767
- &:has(.font-tertiary) {
1768
- line-height: calc(
1769
- var(--paragraph-line-height) *
1770
- var(--global-line-height-multiplier-tertiary)
1771
- );
1772
- }
1773
-
1774
- em {
1775
- font-style: italic;
1776
- }
1777
-
1778
- font-size: clamp(
1779
- var(--p-xxs-font-size-min-mobile, 10px),
1780
- core-functions.fontSize(var(--p-xxs-mobile), 'mobile'),
1781
- var(--p-xxs-font-size-max-mobile, 180px)
1782
- );
1783
-
1784
- @include device(breakpoints.$tabPortrait) {
1785
- font-size: clamp(
1786
- var(--p-xxs-font-size-min-mobile, 10px),
1787
- core-functions.fontSize(var(--p-xxs-portrait), 'portrait'),
1788
- var(--p-xxs-font-size-max-mobile, 180px)
1789
- );
1790
- }
1791
-
1792
- @include device(breakpoints.$tabLandscape) {
1793
- font-size: clamp(
1794
- var(--p-xxs-font-size-min-desktop, 10px),
1795
- core-functions.fontSize(var(--p-xxs-landscape), 'landscape'),
1796
- var(--p-xxs-font-size-max-desktop, 180px)
1797
- );
1798
- }
1799
-
1800
- @include device(breakpoints.$desktop) {
1801
- font-size: clamp(
1802
- var(--p-xxs-font-size-min-desktop, 10px),
1803
- core-functions.fontSize(var(--p-xxs-desktop), 'desktop'),
1804
- var(--p-xxs-font-size-max-desktop, 180px)
1805
- );
1806
- }
1807
- }
1808
-
1809
- @mixin p-xxxs {
1810
- line-height: var(--paragraph-line-height);
1811
- letter-spacing: var(--paragraph-letter-spacing);
1812
- font-family: var(--paragraph-font-family);
1813
-
1814
- strong,
1815
- b {
1816
- font-weight: var(--paragraph-bold-font-weight);
1817
- }
1818
-
1819
- &:has(.font-tertiary) {
1820
- line-height: calc(
1821
- var(--paragraph-line-height) *
1822
- var(--global-line-height-multiplier-tertiary)
1823
- );
1824
- }
1825
-
1826
- em {
1827
- font-style: italic;
1828
- }
1829
-
1830
- font-size: clamp(
1831
- var(--p-xxxs-font-size-min-mobile, 10px),
1832
- core-functions.fontSize(var(--p-xxxs-mobile), 'mobile'),
1833
- var(--p-xxxs-font-size-max-mobile, 180px)
1834
- );
1835
-
1836
- @include device(breakpoints.$tabPortrait) {
1837
- font-size: clamp(
1838
- var(--p-xxxs-font-size-min-mobile, 10px),
1839
- core-functions.fontSize(var(--p-xxxs-portrait), 'portrait'),
1840
- var(--p-xxxs-font-size-max-mobile, 180px)
1841
- );
1842
- }
1843
-
1844
- @include device(breakpoints.$tabLandscape) {
1845
- font-size: clamp(
1846
- var(--p-xxxs-font-size-min-desktop, 10px),
1847
- core-functions.fontSize(var(--p-xxxs-landscape), 'landscape'),
1848
- var(--p-xxxs-font-size-max-desktop, 180px)
1849
- );
1850
- }
1851
-
1852
- @include device(breakpoints.$desktop) {
1853
- font-size: clamp(
1854
- var(--p-xxxs-font-size-min-desktop, 10px),
1855
- core-functions.fontSize(var(--p-xxxs-desktop), 'desktop'),
1856
- var(--p-xxxs-font-size-max-desktop, 180px)
1857
- );
1858
- }
1859
- }
1860
- @mixin p-xxx-small {
1861
- line-height: var(--paragraph-line-height);
1862
- letter-spacing: var(--paragraph-letter-spacing);
1863
- font-family: var(--paragraph-font-family);
1864
-
1865
- strong,
1866
- b {
1867
- font-weight: var(--paragraph-bold-font-weight);
1868
- }
1869
-
1870
- &:has(.font-tertiary) {
1871
- line-height: calc(
1872
- var(--paragraph-line-height) *
1873
- var(--global-line-height-multiplier-tertiary)
1874
- );
1875
- }
1876
-
1877
- em {
1878
- font-style: italic;
1879
- }
1880
-
1881
- font-size: clamp(
1882
- var(--p-xxxs-font-size-min-mobile, 10px),
1883
- core-functions.fontSize(var(--p-xxxs-mobile), 'mobile'),
1884
- var(--p-xxxs-font-size-max-mobile, 180px)
1885
- );
1886
-
1887
- @include device(breakpoints.$tabPortrait) {
1888
- font-size: clamp(
1889
- var(--p-xxxs-font-size-min-mobile, 10px),
1890
- core-functions.fontSize(var(--p-xxxs-portrait), 'portrait'),
1891
- var(--p-xxxs-font-size-max-mobile, 180px)
1892
- );
1893
- }
1894
-
1895
- @include device(breakpoints.$tabLandscape) {
1896
- font-size: clamp(
1897
- var(--p-xxxs-font-size-min-desktop, 10px),
1898
- core-functions.fontSize(var(--p-xxxs-landscape), 'landscape'),
1899
- var(--p-xxxs-font-size-max-desktop, 180px)
1900
- );
1901
- }
1902
-
1903
- @include device(breakpoints.$desktop) {
1904
- font-size: clamp(
1905
- var(--p-xxxs-font-size-min-desktop, 10px),
1906
- core-functions.fontSize(var(--p-xxxs-desktop), 'desktop'),
1907
- var(--p-xxxs-font-size-max-desktop, 180px)
1908
- );
1909
- }
1910
- }
1911
-
1912
- @mixin fontPrimary() {
1913
- font-family: var(--primary-font-family), sans-serif;
1914
- --font-size-multiplier: var(--global-font-multiplier-primary);
1915
- }
1916
-
1917
- @mixin fontSecondary() {
1918
- font-family: var(--secondary-font-family), sans-serif;
1919
- --font-size-multiplier: var(--global-font-multiplier-secondary);
1920
- }
1921
-
1922
- @mixin fontTertiary() {
1923
- font-family: var(--tertiary-font-family), sans-serif;
1924
- --font-size-multiplier: var(--global-font-multiplier-tertiary);
1925
- }
1926
-
1927
- @mixin fontQuaternary() {
1928
- font-family: var(--quaternary-font-family), sans-serif;
1929
- --font-size-multiplier: var(--global-font-multiplier-quaternary);
1930
- }
200
+ // @mixin h1-l {
201
+ // letter-spacing: var(--h1-l-letter-spacing);
202
+ // line-height: var(--h1-l-line-height);
203
+ // font-family: var(--h1-l-font-family);
204
+ // --default-font-weight: var(--h1-l-default-font-weight);
205
+ // font-weight: var(--default-font-weight);
206
+
207
+ // strong,
208
+ // b {
209
+ // font-weight: var(--h1-l-bold-font-weight);
210
+ // }
211
+
212
+ // font-size: clamp(
213
+ // var(--h-xl-font-size-min-mobile, 10px),
214
+ // core-functions-v3.fontSize(var(--h1-l-mobile), 'mobile'),
215
+ // var(--h-xl-font-size-max-mobile, 180px)
216
+ // );
217
+
218
+ // @include device(breakpoints.$tabPortrait) {
219
+ // font-size: clamp(
220
+ // var(--h-xl-font-size-min-mobile, 10px),
221
+ // core-functions-v3.fontSize(var(--h1-l-portrait), 'portrait'),
222
+ // var(--h-xl-font-size-max-mobile, 180px)
223
+ // );
224
+ // }
225
+
226
+ // @include device(breakpoints.$tabLandscape) {
227
+ // font-size: clamp(
228
+ // var(--h-xl-font-size-min-desktop, 10px),
229
+ // core-functions-v3.fontSize(var(--h1-l-landscape), 'landscape'),
230
+ // var(--h-xl-font-size-max-desktop, 180px)
231
+ // );
232
+ // }
233
+
234
+ // @include device(breakpoints.$desktop) {
235
+ // font-size: clamp(
236
+ // var(--h-xl-font-size-min-desktop, 10px),
237
+ // core-functions-v3.fontSize(var(--h1-l-desktop), 'desktop'),
238
+ // var(--h-xl-font-size-max-desktop, 180px)
239
+ // );
240
+ // }
241
+ // }
242
+ // @mixin h1 {
243
+ // letter-spacing: var(--h1-letter-spacing);
244
+ // line-height: var(--h1-line-height);
245
+ // font-family: var(--h1-font-family);
246
+ // --default-font-weight: var(--h1-default-font-weight);
247
+ // font-weight: var(--default-font-weight);
248
+
249
+ // strong,
250
+ // b {
251
+ // font-weight: var(--h1-bold-font-weight);
252
+ // }
253
+
254
+ // font-size: clamp(
255
+ // var(--h-l-font-size-min-mobile, 10px),
256
+ // core-functions-v3.fontSize(var(--h1-mobile), 'mobile'),
257
+ // var(--h-l-font-size-max-mobile, 180px)
258
+ // );
259
+
260
+ // @include device(breakpoints.$tabPortrait) {
261
+ // font-size: clamp(
262
+ // var(--h-l-font-size-min-mobile, 10px),
263
+ // core-functions-v3.fontSize(var(--h1-portrait), 'portrait'),
264
+ // var(--h-l-font-size-max-mobile, 180px)
265
+ // );
266
+ // }
267
+
268
+ // @include device(breakpoints.$tabLandscape) {
269
+ // font-size: clamp(
270
+ // var(--h-l-font-size-min-desktop, 10px),
271
+ // core-functions-v3.fontSize(var(--h1-landscape), 'landscape'),
272
+ // var(--h-l-font-size-max-desktop, 180px)
273
+ // );
274
+ // }
275
+
276
+ // @include device(breakpoints.$desktop) {
277
+ // font-size: clamp(
278
+ // var(--h-l-font-size-min-desktop, 10px),
279
+ // core-functions-v3.fontSize(var(--h1-desktop), 'desktop'),
280
+ // var(--h-l-font-size-max-desktop, 180px)
281
+ // );
282
+ // }
283
+ // }
284
+ // @mixin h2 {
285
+ // letter-spacing: var(--h2-letter-spacing);
286
+ // line-height: var(--h2-line-height);
287
+ // font-family: var(--h2-font-family);
288
+ // --default-font-weight: var(--h2-default-font-weight);
289
+ // font-weight: var(--default-font-weight);
290
+
291
+ // strong,
292
+ // b {
293
+ // font-weight: var(--h2-bold-font-weight);
294
+ // }
295
+
296
+ // font-size: clamp(
297
+ // var(--h-m-font-size-min-mobile, 10px),
298
+ // core-functions-v3.fontSize(var(--h2-mobile), 'mobile'),
299
+ // var(--h-m-font-size-max-mobile, 180px)
300
+ // );
301
+
302
+ // @include device(breakpoints.$tabPortrait) {
303
+ // font-size: clamp(
304
+ // var(--h-m-font-size-min-mobile, 10px),
305
+ // core-functions-v3.fontSize(var(--h2-portrait), 'portrait'),
306
+ // var(--h-m-font-size-max-mobile, 180px)
307
+ // );
308
+ // }
309
+
310
+ // @include device(breakpoints.$tabLandscape) {
311
+ // font-size: clamp(
312
+ // var(--h-m-font-size-min-desktop, 10px),
313
+ // core-functions-v3.fontSize(var(--h2-landscape), 'landscape'),
314
+ // var(--h-m-font-size-max-desktop, 180px)
315
+ // );
316
+ // }
317
+
318
+ // @include device(breakpoints.$desktop) {
319
+ // font-size: clamp(
320
+ // var(--h-m-font-size-min-desktop, 10px),
321
+ // core-functions-v3.fontSize(var(--h2-desktop), 'desktop'),
322
+ // var(--h-m-font-size-max-desktop, 180px)
323
+ // );
324
+ // }
325
+ // }
326
+ // @mixin h3 {
327
+ // letter-spacing: var(--h3-letter-spacing);
328
+ // line-height: var(--h3-line-height);
329
+ // font-family: var(--h3-font-family);
330
+ // --default-font-weight: var(--h3-default-font-weight);
331
+ // font-weight: var(--default-font-weight);
332
+
333
+ // strong,
334
+ // b {
335
+ // font-weight: var(--h3-bold-font-weight);
336
+ // }
337
+
338
+ // font-size: clamp(
339
+ // var(--h-s-font-size-min-mobile, 10px),
340
+ // core-functions-v3.fontSize(var(--h3-mobile), 'mobile'),
341
+ // var(--h-s-font-size-max-mobile, 180px)
342
+ // );
343
+
344
+ // @include device(breakpoints.$tabPortrait) {
345
+ // font-size: clamp(
346
+ // var(--h-s-font-size-min-mobile, 10px),
347
+ // core-functions-v3.fontSize(var(--h3-portrait), 'portrait'),
348
+ // var(--h-s-font-size-max-mobile, 180px)
349
+ // );
350
+ // }
351
+
352
+ // @include device(breakpoints.$tabLandscape) {
353
+ // font-size: clamp(
354
+ // var(--h-s-font-size-min-desktop, 10px),
355
+ // core-functions-v3.fontSize(var(--h3-landscape), 'landscape'),
356
+ // var(--h-s-font-size-max-desktop, 180px)
357
+ // );
358
+ // }
359
+
360
+ // @include device(breakpoints.$desktop) {
361
+ // font-size: clamp(
362
+ // var(--h-s-font-size-min-desktop, 10px),
363
+ // core-functions-v3.fontSize(var(--h3-desktop), 'desktop'),
364
+ // var(--h-s-font-size-max-desktop, 180px)
365
+ // );
366
+ // }
367
+ // }
368
+ // @mixin h4 {
369
+ // letter-spacing: var(--h4-letter-spacing);
370
+ // line-height: var(--h4-line-height);
371
+ // font-family: var(--h4-font-family);
372
+ // --default-font-weight: var(--h4-default-font-weight);
373
+ // font-weight: var(--default-font-weight);
374
+
375
+ // strong,
376
+ // b {
377
+ // font-weight: var(--h4-bold-font-weight);
378
+ // }
379
+
380
+ // font-size: clamp(
381
+ // var(--h-xs-font-size-min-mobile, 10px),
382
+ // core-functions-v3.fontSize(var(--h4-mobile), 'mobile'),
383
+ // var(--h-xs-font-size-max-mobile, 180px)
384
+ // );
385
+
386
+ // @include device(breakpoints.$tabPortrait) {
387
+ // font-size: clamp(
388
+ // var(--h-xs-font-size-min-mobile, 10px),
389
+ // core-functions-v3.fontSize(var(--h4-portrait), 'portrait'),
390
+ // var(--h-xs-font-size-max-mobile, 180px)
391
+ // );
392
+ // }
393
+
394
+ // @include device(breakpoints.$tabLandscape) {
395
+ // font-size: clamp(
396
+ // var(--h-xs-font-size-min-desktop, 10px),
397
+ // core-functions-v3.fontSize(var(--h4-landscape), 'landscape'),
398
+ // var(--h-xs-font-size-max-desktop, 180px)
399
+ // );
400
+ // }
401
+
402
+ // @include device(breakpoints.$desktop) {
403
+ // font-size: clamp(
404
+ // var(--h-xs-font-size-min-desktop, 10px),
405
+ // core-functions-v3.fontSize(var(--h4-desktop), 'desktop'),
406
+ // var(--h-xs-font-size-max-desktop, 180px)
407
+ // );
408
+ // }
409
+ // }
410
+ // @mixin h5 {
411
+ // letter-spacing: var(--h5-letter-spacing);
412
+ // line-height: var(--h5-line-height);
413
+ // font-family: var(--h5-font-family);
414
+ // --default-font-weight: var(--h5-default-font-weight);
415
+ // font-weight: var(--default-font-weight);
416
+
417
+ // strong,
418
+ // b {
419
+ // font-weight: var(--h5-bold-font-weight);
420
+ // }
421
+
422
+ // font-size: clamp(
423
+ // var(--h-xxs-font-size-min-mobile, 10px),
424
+ // core-functions-v3.fontSize(var(--h5-mobile), 'mobile'),
425
+ // var(--h-xxs-font-size-max-mobile, 180px)
426
+ // );
427
+
428
+ // @include device(breakpoints.$tabPortrait) {
429
+ // font-size: clamp(
430
+ // var(--h-xxs-font-size-min-mobile, 10px),
431
+ // core-functions-v3.fontSize(var(--h5-portrait), 'portrait'),
432
+ // var(--h-xxs-font-size-max-mobile, 180px)
433
+ // );
434
+ // }
435
+
436
+ // @include device(breakpoints.$tabLandscape) {
437
+ // font-size: clamp(
438
+ // var(--h-xxs-font-size-min-desktop, 10px),
439
+ // core-functions-v3.fontSize(var(--h5-landscape), 'landscape'),
440
+ // var(--h-xxs-font-size-max-desktop, 180px)
441
+ // );
442
+ // }
443
+
444
+ // @include device(breakpoints.$desktop) {
445
+ // font-size: clamp(
446
+ // var(--h-xxs-font-size-min-desktop, 10px),
447
+ // core-functions-v3.fontSize(var(--h5-desktop), 'desktop'),
448
+ // var(--h-xxs-font-size-max-desktop, 180px)
449
+ // );
450
+ // }
451
+ // }
452
+ // @mixin h6 {
453
+ // letter-spacing: var(--h6-letter-spacing);
454
+ // line-height: var(--h6-line-height);
455
+ // font-family: var(--h6-font-family);
456
+ // --default-font-weight: var(--h6-default-font-weight);
457
+ // font-weight: var(--default-font-weight);
458
+
459
+ // strong,
460
+ // b {
461
+ // font-weight: var(--h6-bold-font-weight);
462
+ // }
463
+
464
+ // font-size: clamp(
465
+ // var(--h-xxxs-font-size-min-mobile, 10px),
466
+ // core-functions-v3.fontSize(var(--h6-mobile), 'mobile'),
467
+ // var(--h-xxxs-font-size-max-mobile, 180px)
468
+ // );
469
+
470
+ // @include device(breakpoints.$tabPortrait) {
471
+ // font-size: clamp(
472
+ // var(--h-xxxs-font-size-min-mobile, 10px),
473
+ // core-functions-v3.fontSize(var(--h6-portrait), 'portrait'),
474
+ // var(--h-xxxs-font-size-max-mobile, 180px)
475
+ // );
476
+ // }
477
+
478
+ // @include device(breakpoints.$tabLandscape) {
479
+ // font-size: clamp(
480
+ // var(--h-xxxs-font-size-min-desktop, 10px),
481
+ // core-functions-v3.fontSize(var(--h6-landscape), 'landscape'),
482
+ // var(--h-xxxs-font-size-max-desktop, 180px)
483
+ // );
484
+ // }
485
+
486
+ // @include device(breakpoints.$desktop) {
487
+ // font-size: clamp(
488
+ // var(--h-xxxs-font-size-min-desktop, 10px),
489
+ // core-functions-v3.fontSize(var(--h6-desktop), 'desktop'),
490
+ // var(--h-xxxs-font-size-max-desktop, 180px)
491
+ // );
492
+ // }
493
+ // }
494
+ // @mixin sh1 {
495
+ // letter-spacing: var(--sh1-letter-spacing);
496
+ // line-height: var(--sh1-line-height);
497
+ // font-family: var(--sh1-font-family);
498
+ // --default-font-weight: var(--sh1-default-font-weight);
499
+ // font-weight: var(--default-font-weight);
500
+
501
+ // strong,
502
+ // b {
503
+ // font-weight: var(--sh1-bold-font-weight);
504
+ // }
505
+
506
+ // font-size: clamp(
507
+ // var(--sh-xl-font-size-min-mobile, 10px),
508
+ // core-functions-v3.fontSize(var(--sh1-mobile), 'mobile'),
509
+ // var(--sh-xl-font-size-max-mobile, 180px)
510
+ // );
511
+
512
+ // @include device(breakpoints.$tabPortrait) {
513
+ // font-size: clamp(
514
+ // var(--sh-xl-font-size-min-mobile, 10px),
515
+ // core-functions-v3.fontSize(var(--sh1-portrait), 'portrait'),
516
+ // var(--sh-xl-font-size-max-mobile, 180px)
517
+ // );
518
+ // }
519
+
520
+ // @include device(breakpoints.$tabLandscape) {
521
+ // font-size: clamp(
522
+ // var(--sh-xl-font-size-min-desktop, 10px),
523
+ // core-functions-v3.fontSize(var(--sh1-landscape), 'landscape'),
524
+ // var(--sh-xl-font-size-max-desktop, 180px)
525
+ // );
526
+ // }
527
+
528
+ // @include device(breakpoints.$desktop) {
529
+ // font-size: clamp(
530
+ // var(--sh-xl-font-size-min-desktop, 10px),
531
+ // core-functions-v3.fontSize(var(--sh1-desktop), 'desktop'),
532
+ // var(--sh-xl-font-size-max-desktop, 180px)
533
+ // );
534
+ // }
535
+ // }
536
+ // @mixin sh2 {
537
+ // letter-spacing: var(--sh2-letter-spacing);
538
+ // line-height: var(--sh2-line-height);
539
+ // font-family: var(--sh2-font-family);
540
+ // --default-font-weight: var(--sh2-default-font-weight);
541
+ // font-weight: var(--default-font-weight);
542
+
543
+ // strong,
544
+ // b {
545
+ // font-weight: var(--sh2-bold-font-weight);
546
+ // }
547
+
548
+ // font-size: clamp(
549
+ // var(--sh-l-font-size-min-mobile, 10px),
550
+ // core-functions-v3.fontSize(var(--sh2-mobile), 'mobile'),
551
+ // var(--sh-l-font-size-max-mobile, 180px)
552
+ // );
553
+
554
+ // @include device(breakpoints.$tabPortrait) {
555
+ // font-size: clamp(
556
+ // var(--sh-l-font-size-min-mobile, 10px),
557
+ // core-functions-v3.fontSize(var(--sh2-portrait), 'portrait'),
558
+ // var(--sh-l-font-size-max-mobile, 180px)
559
+ // );
560
+ // }
561
+
562
+ // @include device(breakpoints.$tabLandscape) {
563
+ // font-size: clamp(
564
+ // var(--sh-l-font-size-min-desktop, 10px),
565
+ // core-functions-v3.fontSize(var(--sh2-landscape), 'landscape'),
566
+ // var(--sh-l-font-size-max-desktop, 180px)
567
+ // );
568
+ // }
569
+
570
+ // @include device(breakpoints.$desktop) {
571
+ // font-size: clamp(
572
+ // var(--sh-l-font-size-min-desktop, 10px),
573
+ // core-functions-v3.fontSize(var(--sh2-desktop), 'desktop'),
574
+ // var(--sh-l-font-size-max-desktop, 180px)
575
+ // );
576
+ // }
577
+ // }
578
+ // @mixin sh3 {
579
+ // letter-spacing: var(--sh3-letter-spacing);
580
+ // line-height: var(--sh3-line-height);
581
+ // font-family: var(--sh3-font-family);
582
+ // --default-font-weight: var(--sh3-default-font-weight);
583
+ // font-weight: var(--default-font-weight);
584
+
585
+ // strong,
586
+ // b {
587
+ // font-weight: var(--sh3-bold-font-weight);
588
+ // }
589
+
590
+ // font-size: clamp(
591
+ // var(--sh-m-font-size-min-mobile, 10px),
592
+ // core-functions-v3.fontSize(var(--sh3-mobile), 'mobile'),
593
+ // var(--sh-m-font-size-max-mobile, 180px)
594
+ // );
595
+
596
+ // @include device(breakpoints.$tabPortrait) {
597
+ // font-size: clamp(
598
+ // var(--sh-m-font-size-min-mobile, 10px),
599
+ // core-functions-v3.fontSize(var(--sh3-portrait), 'portrait'),
600
+ // var(--sh-m-font-size-max-mobile, 180px)
601
+ // );
602
+ // }
603
+
604
+ // @include device(breakpoints.$tabLandscape) {
605
+ // font-size: clamp(
606
+ // var(--sh-m-font-size-min-desktop, 10px),
607
+ // core-functions-v3.fontSize(var(--sh3-landscape), 'landscape'),
608
+ // var(--sh-m-font-size-max-desktop, 180px)
609
+ // );
610
+ // }
611
+
612
+ // @include device(breakpoints.$desktop) {
613
+ // font-size: clamp(
614
+ // var(--sh-m-font-size-min-desktop, 10px),
615
+ // core-functions-v3.fontSize(var(--sh3-desktop), 'desktop'),
616
+ // var(--sh-m-font-size-max-desktop, 180px)
617
+ // );
618
+ // }
619
+ // }
620
+ // @mixin sh4 {
621
+ // letter-spacing: var(--sh4-letter-spacing);
622
+ // line-height: var(--sh4-line-height);
623
+ // font-family: var(--sh4-font-family);
624
+ // --default-font-weight: var(--sh4-default-font-weight);
625
+ // font-weight: var(--default-font-weight);
626
+
627
+ // strong,
628
+ // b {
629
+ // font-weight: var(--sh4-bold-font-weight);
630
+ // }
631
+
632
+ // font-size: clamp(
633
+ // var(--sh-s-font-size-min-mobile, 10px),
634
+ // core-functions-v3.fontSize(var(--sh4-mobile), 'mobile'),
635
+ // var(--sh-s-font-size-max-mobile, 180px)
636
+ // );
637
+
638
+ // @include device(breakpoints.$tabPortrait) {
639
+ // font-size: clamp(
640
+ // var(--sh-s-font-size-min-mobile, 10px),
641
+ // core-functions-v3.fontSize(var(--sh4-portrait), 'portrait'),
642
+ // var(--sh-s-font-size-max-mobile, 180px)
643
+ // );
644
+ // }
645
+
646
+ // @include device(breakpoints.$tabLandscape) {
647
+ // font-size: clamp(
648
+ // var(--sh-s-font-size-min-desktop, 10px),
649
+ // core-functions-v3.fontSize(var(--sh4-landscape), 'landscape'),
650
+ // var(--sh-s-font-size-max-desktop, 180px)
651
+ // );
652
+ // }
653
+
654
+ // @include device(breakpoints.$desktop) {
655
+ // font-size: clamp(
656
+ // var(--sh-s-font-size-min-desktop, 10px),
657
+ // core-functions-v3.fontSize(var(--sh4-desktop), 'desktop'),
658
+ // var(--sh-s-font-size-max-desktop, 180px)
659
+ // );
660
+ // }
661
+ // }
662
+ // @mixin sh5 {
663
+ // letter-spacing: var(--sh5-letter-spacing);
664
+ // line-height: var(--sh5-line-height);
665
+ // font-family: var(--sh5-font-family);
666
+ // --default-font-weight: var(--sh5-default-font-weight);
667
+ // font-weight: var(--default-font-weight);
668
+
669
+ // strong,
670
+ // b {
671
+ // font-weight: var(--sh5-bold-font-weight);
672
+ // }
673
+
674
+ // font-size: clamp(
675
+ // var(--sh-xs-font-size-min-mobile, 10px),
676
+ // core-functions-v3.fontSize(var(--sh5-mobile), 'mobile'),
677
+ // var(--sh-xs-font-size-max-mobile, 180px)
678
+ // );
679
+
680
+ // @include device(breakpoints.$tabPortrait) {
681
+ // font-size: clamp(
682
+ // var(--sh-xs-font-size-min-mobile, 10px),
683
+ // core-functions-v3.fontSize(var(--sh5-portrait), 'portrait'),
684
+ // var(--sh-xs-font-size-max-mobile, 180px)
685
+ // );
686
+ // }
687
+
688
+ // @include device(breakpoints.$tabLandscape) {
689
+ // font-size: clamp(
690
+ // var(--sh-xs-font-size-min-desktop, 10px),
691
+ // core-functions-v3.fontSize(var(--sh5-landscape), 'landscape'),
692
+ // var(--sh-xs-font-size-max-desktop, 180px)
693
+ // );
694
+ // }
695
+
696
+ // @include device(breakpoints.$desktop) {
697
+ // font-size: clamp(
698
+ // var(--sh-xs-font-size-min-desktop, 10px),
699
+ // core-functions-v3.fontSize(var(--sh5-desktop), 'desktop'),
700
+ // var(--sh-xs-font-size-max-desktop, 180px)
701
+ // );
702
+ // }
703
+ // }
704
+ // @mixin sh6 {
705
+ // letter-spacing: var(--sh6-letter-spacing);
706
+ // line-height: var(--sh6-line-height);
707
+ // font-family: var(--sh6-font-family);
708
+ // --default-font-weight: var(--sh6-default-font-weight);
709
+ // font-weight: var(--default-font-weight);
710
+
711
+ // strong,
712
+ // b {
713
+ // font-weight: var(--sh6-bold-font-weight);
714
+ // }
715
+
716
+ // font-size: clamp(
717
+ // var(--sh-xxs-font-size-min-mobile, 10px),
718
+ // core-functions-v3.fontSize(var(--sh6-mobile), 'mobile'),
719
+ // var(--sh-xxs-font-size-max-mobile, 180px)
720
+ // );
721
+
722
+ // @include device(breakpoints.$tabPortrait) {
723
+ // font-size: clamp(
724
+ // var(--sh-xxs-font-size-min-mobile, 10px),
725
+ // core-functions-v3.fontSize(var(--sh6-portrait), 'portrait'),
726
+ // var(--sh-xxs-font-size-max-mobile, 180px)
727
+ // );
728
+ // }
729
+
730
+ // @include device(breakpoints.$tabLandscape) {
731
+ // font-size: clamp(
732
+ // var(--sh-xxs-font-size-min-desktop, 10px),
733
+ // core-functions-v3.fontSize(var(--sh6-landscape), 'landscape'),
734
+ // var(--sh-xxs-font-size-max-desktop, 180px)
735
+ // );
736
+ // }
737
+
738
+ // @include device(breakpoints.$desktop) {
739
+ // font-size: clamp(
740
+ // var(--sh-xxs-font-size-min-desktop, 10px),
741
+ // core-functions-v3.fontSize(var(--sh6-desktop), 'desktop'),
742
+ // var(--sh-xxs-font-size-max-desktop, 180px)
743
+ // );
744
+ // }
745
+ // }
746
+
747
+ // @mixin h-x-large-size {
748
+ // font-size: clamp(
749
+ // var(--h-xl-font-size-min-desktop, 10px),
750
+ // core-functions-v3.fontSize(var(--h-xl-desktop)),
751
+ // var(--h-xl-font-size-max-desktop, 180px)
752
+ // );
753
+ // }
754
+ // @mixin h-x-large {
755
+ // letter-spacing: var(--h1-l-letter-spacing);
756
+ // line-height: var(--h1-l-line-height);
757
+ // font-family: var(--h1-l-font-family);
758
+ // --default-font-weight: var(--h1-l-default-font-weight);
759
+ // font-weight: var(--default-font-weight);
760
+ // strong,
761
+ // b {
762
+ // font-weight: var(--h1-l-bold-font-weight);
763
+ // }
764
+ // font-size: clamp(
765
+ // var(--h-xl-font-size-min-mobile, 10px),
766
+ // core-functions-v3.fontSize(var(--h-xl-mobile), 'mobile'),
767
+ // var(--h-xl-font-size-max-mobile, 180px)
768
+ // );
769
+ // @include device(breakpoints.$tabPortrait) {
770
+ // font-size: clamp(
771
+ // var(--h-xl-font-size-min-mobile, 10px),
772
+ // core-functions-v3.fontSize(var(--h-xl-portrait), 'portrait'),
773
+ // var(--h-xl-font-size-max-mobile, 180px)
774
+ // );
775
+ // }
776
+ // @include device(breakpoints.$tabLandscape) {
777
+ // font-size: clamp(
778
+ // var(--h-xl-font-size-min-desktop, 10px),
779
+ // core-functions-v3.fontSize(var(--h-xl-landscape), 'landscape'),
780
+ // var(--h-xl-font-size-max-desktop, 180px)
781
+ // );
782
+ // }
783
+
784
+ // @include device(breakpoints.$desktop) {
785
+ // @include h-x-large-size();
786
+ // }
787
+ // }
788
+ // @mixin h-large-size {
789
+ // font-size: clamp(
790
+ // var(--h-l-font-size-min-desktop, 10px),
791
+ // core-functions-v3.fontSize(var(--h-l-desktop)),
792
+ // var(--h-l-font-size-max-desktop, 180px)
793
+ // );
794
+ // }
795
+ // @mixin h-large {
796
+ // letter-spacing: var(--h1-letter-spacing);
797
+ // line-height: var(--h1-line-height);
798
+ // font-family: var(--h1-font-family);
799
+ // --default-font-weight: var(--h1-default-font-weight);
800
+ // font-weight: var(--default-font-weight);
801
+
802
+ // strong,
803
+ // b {
804
+ // font-weight: var(--h1-bold-font-weight);
805
+ // }
806
+
807
+ // font-size: clamp(
808
+ // var(--h-l-font-size-min-mobile, 10px),
809
+ // core-functions-v3.fontSize(var(--h-l-mobile), 'mobile'),
810
+ // var(--h-l-font-size-max-mobile, 180px)
811
+ // );
812
+
813
+ // @include device(breakpoints.$tabPortrait) {
814
+ // font-size: clamp(
815
+ // var(--h-l-font-size-min-mobile, 10px),
816
+ // core-functions-v3.fontSize(var(--h-l-portrait), 'portrait'),
817
+ // var(--h-l-font-size-max-mobile, 180px)
818
+ // );
819
+ // }
820
+
821
+ // @include device(breakpoints.$tabLandscape) {
822
+ // font-size: clamp(
823
+ // var(--h-l-font-size-min-desktop, 10px),
824
+ // core-functions-v3.fontSize(var(--h-l-landscape), 'landscape'),
825
+ // var(--h-l-font-size-max-desktop, 180px)
826
+ // );
827
+ // }
828
+
829
+ // @include device(breakpoints.$desktop) {
830
+ // @include h-large-size();
831
+ // }
832
+ // }
833
+ // @mixin h-medium-size {
834
+ // font-size: clamp(
835
+ // var(--h-m-font-size-min-desktop, 10px),
836
+ // core-functions-v3.fontSize(var(--h-m-desktop)),
837
+ // var(--h-m-font-size-max-desktop, 180px)
838
+ // );
839
+ // }
840
+ // @mixin h-medium {
841
+ // letter-spacing: var(--h2-letter-spacing);
842
+ // line-height: var(--h2-line-height);
843
+ // font-family: var(--h2-font-family);
844
+ // --default-font-weight: var(--h2-default-font-weight);
845
+ // font-weight: var(--default-font-weight);
846
+
847
+ // strong,
848
+ // b {
849
+ // font-weight: var(--h2-bold-font-weight);
850
+ // }
851
+
852
+ // font-size: clamp(
853
+ // var(--h-m-font-size-min-mobile, 10px),
854
+ // core-functions-v3.fontSize(var(--h-m-mobile), 'mobile'),
855
+ // var(--h-m-font-size-max-mobile, 180px)
856
+ // );
857
+
858
+ // @include device(breakpoints.$tabPortrait) {
859
+ // font-size: clamp(
860
+ // var(--h-m-font-size-min-mobile, 10px),
861
+ // core-functions-v3.fontSize(var(--h-m-portrait), 'portrait'),
862
+ // var(--h-m-font-size-max-mobile, 180px)
863
+ // );
864
+ // }
865
+
866
+ // @include device(breakpoints.$tabLandscape) {
867
+ // font-size: clamp(
868
+ // var(--h-m-font-size-min-desktop, 10px),
869
+ // core-functions-v3.fontSize(var(--h-m-landscape), 'landscape'),
870
+ // var(--h-m-font-size-max-desktop, 180px)
871
+ // );
872
+ // }
873
+
874
+ // @include device(breakpoints.$desktop) {
875
+ // @include h-medium-size();
876
+ // }
877
+ // }
878
+ // @mixin h-small-size {
879
+ // font-size: clamp(
880
+ // var(--h-s-font-size-min-desktop, 10px),
881
+ // core-functions-v3.fontSize(var(--h-s-desktop)),
882
+ // var(--h-s-font-size-max-desktop, 180px)
883
+ // );
884
+ // }
885
+ // @mixin h-small {
886
+ // letter-spacing: var(--h3-letter-spacing);
887
+ // line-height: var(--h3-line-height);
888
+ // font-family: var(--h3-font-family);
889
+ // --default-font-weight: var(--h3-default-font-weight);
890
+ // font-weight: var(--default-font-weight);
891
+
892
+ // strong,
893
+ // b {
894
+ // font-weight: var(--h3-bold-font-weight);
895
+ // }
896
+
897
+ // font-size: clamp(
898
+ // var(--h-s-font-size-min-mobile, 10px),
899
+ // core-functions-v3.fontSize(var(--h-s-mobile), 'mobile'),
900
+ // var(--h-s-font-size-max-mobile, 180px)
901
+ // );
902
+
903
+ // @include device(breakpoints.$tabPortrait) {
904
+ // font-size: clamp(
905
+ // var(--h-s-font-size-min-mobile, 10px),
906
+ // core-functions-v3.fontSize(var(--h-s-portrait), 'portrait'),
907
+ // var(--h-s-font-size-max-mobile, 180px)
908
+ // );
909
+ // }
910
+
911
+ // @include device(breakpoints.$tabLandscape) {
912
+ // font-size: clamp(
913
+ // var(--h-s-font-size-min-desktop, 10px),
914
+ // core-functions-v3.fontSize(var(--h-s-landscape), 'landscape'),
915
+ // var(--h-s-font-size-max-desktop, 180px)
916
+ // );
917
+ // }
918
+
919
+ // @include device(breakpoints.$desktop) {
920
+ // @include h-small-size();
921
+ // }
922
+ // }
923
+ // @mixin h-x-small-size {
924
+ // font-size: clamp(
925
+ // var(--h-xs-font-size-min-desktop, 10px),
926
+ // core-functions-v3.fontSize(var(--h-xs-desktop)),
927
+ // var(--h-xs-font-size-max-desktop, 180px)
928
+ // );
929
+ // }
930
+ // @mixin h-x-small {
931
+ // letter-spacing: var(--h4-letter-spacing);
932
+ // line-height: var(--h4-line-height);
933
+ // font-family: var(--h4-font-family);
934
+ // --default-font-weight: var(--h4-default-font-weight);
935
+ // font-weight: var(--default-font-weight);
936
+
937
+ // strong,
938
+ // b {
939
+ // font-weight: var(--h4-bold-font-weight);
940
+ // }
941
+
942
+ // font-size: clamp(
943
+ // var(--h-xs-font-size-min-mobile, 10px),
944
+ // core-functions-v3.fontSize(var(--h-xs-mobile), 'mobile'),
945
+ // var(--h-xs-font-size-max-mobile, 180px)
946
+ // );
947
+
948
+ // @include device(breakpoints.$tabPortrait) {
949
+ // font-size: clamp(
950
+ // var(--h-xs-font-size-min-mobile, 10px),
951
+ // core-functions-v3.fontSize(var(--h-xs-portrait), 'portrait'),
952
+ // var(--h-xs-font-size-max-mobile, 180px)
953
+ // );
954
+ // }
955
+
956
+ // @include device(breakpoints.$tabLandscape) {
957
+ // font-size: clamp(
958
+ // var(--h-xs-font-size-min-desktop, 10px),
959
+ // core-functions-v3.fontSize(var(--h-xs-landscape), 'landscape'),
960
+ // var(--h-xs-font-size-max-desktop, 180px)
961
+ // );
962
+ // }
963
+
964
+ // @include device(breakpoints.$desktop) {
965
+ // @include h-x-small-size();
966
+ // }
967
+ // }
968
+ // @mixin h-xx-small-size {
969
+ // font-size: clamp(
970
+ // var(--h-xxs-font-size-min-desktop, 10px),
971
+ // core-functions-v3.fontSize(var(--h-xxs-desktop)),
972
+ // var(--h-xxs-font-size-max-desktop, 180px)
973
+ // );
974
+ // }
975
+ // @mixin h-xx-small {
976
+ // letter-spacing: var(--h5-letter-spacing);
977
+ // line-height: var(--h5-line-height);
978
+ // font-family: var(--h5-font-family);
979
+ // --default-font-weight: var(--h5-default-font-weight);
980
+ // font-weight: var(--default-font-weight);
981
+
982
+ // strong,
983
+ // b {
984
+ // font-weight: var(--h5-bold-font-weight);
985
+ // }
986
+
987
+ // font-size: clamp(
988
+ // var(--h-xxs-font-size-min-mobile, 10px),
989
+ // core-functions-v3.fontSize(var(--h-xxs-mobile), 'mobile'),
990
+ // var(--h-xxs-font-size-max-mobile, 180px)
991
+ // );
992
+
993
+ // @include device(breakpoints.$tabPortrait) {
994
+ // font-size: clamp(
995
+ // var(--h-xxs-font-size-min-mobile, 10px),
996
+ // core-functions-v3.fontSize(var(--h5-portrait), 'portrait'),
997
+ // var(--h-xxs-font-size-max-mobile, 180px)
998
+ // );
999
+ // }
1000
+
1001
+ // @include device(breakpoints.$tabLandscape) {
1002
+ // font-size: clamp(
1003
+ // var(--h-xxs-font-size-min-desktop, 10px),
1004
+ // core-functions-v3.fontSize(var(--h5-landscape), 'landscape'),
1005
+ // var(--h-xxs-font-size-max-desktop, 180px)
1006
+ // );
1007
+ // }
1008
+
1009
+ // @include device(breakpoints.$desktop) {
1010
+ // font-size: clamp(
1011
+ // var(--h-xxs-font-size-min-desktop, 10px),
1012
+ // core-functions-v3.fontSize(var(--h5-desktop), 'desktop'),
1013
+ // var(--h-xxs-font-size-max-desktop, 180px)
1014
+ // );
1015
+ // }
1016
+ // }
1017
+ // @mixin h-xxx-small-size {
1018
+ // font-size: clamp(
1019
+ // var(--h-xxxs-font-size-min-desktop, 10px),
1020
+ // core-functions-v3.fontSize(var(--h-xxxs-desktop)),
1021
+ // var(--h-xxxs-font-size-max-desktop, 180px)
1022
+ // );
1023
+ // }
1024
+ // @mixin h-xxx-small {
1025
+ // letter-spacing: var(--h6-letter-spacing);
1026
+ // line-height: var(--h6-line-height);
1027
+ // font-family: var(--h6-font-family);
1028
+ // --default-font-weight: var(--h6-default-font-weight);
1029
+ // font-weight: var(--default-font-weight);
1030
+
1031
+ // strong,
1032
+ // b {
1033
+ // font-weight: var(--h6-bold-font-weight);
1034
+ // }
1035
+
1036
+ // font-size: clamp(
1037
+ // var(--h-xxxs-font-size-min-mobile, 10px),
1038
+ // core-functions-v3.fontSize(var(--h-xxxs-mobile), 'mobile'),
1039
+ // var(--h-xxxs-font-size-max-mobile, 180px)
1040
+ // );
1041
+
1042
+ // @include device(breakpoints.$tabPortrait) {
1043
+ // font-size: clamp(
1044
+ // var(--h-xxxs-font-size-min-mobile, 10px),
1045
+ // core-functions-v3.fontSize(var(--h-xxxs-portrait), 'portrait'),
1046
+ // var(--h-xxxs-font-size-max-mobile, 180px)
1047
+ // );
1048
+ // }
1049
+
1050
+ // @include device(breakpoints.$tabLandscape) {
1051
+ // font-size: clamp(
1052
+ // var(--h-xxxs-font-size-min-desktop, 10px),
1053
+ // core-functions-v3.fontSize(var(--h-xxxs-landscape), 'landscape'),
1054
+ // var(--h-xxxs-font-size-max-desktop, 180px)
1055
+ // );
1056
+ // }
1057
+
1058
+ // @include device(breakpoints.$desktop) {
1059
+ // @include h-xxx-small-size();
1060
+ // }
1061
+ // }
1062
+ // @mixin sh-x-large-size {
1063
+ // font-size: clamp(
1064
+ // var(--sh-xl-font-size-min-desktop, 10px),
1065
+ // core-functions-v3.fontSize(var(--sh-xl-desktop)),
1066
+ // var(--sh-xl-font-size-max-desktop, 180px)
1067
+ // );
1068
+ // }
1069
+ // @mixin sh-x-large {
1070
+ // letter-spacing: var(--sh1-letter-spacing);
1071
+ // line-height: var(--sh1-line-height);
1072
+ // font-family: var(--sh1-font-family);
1073
+ // --default-font-weight: var(--sh1-default-font-weight);
1074
+ // font-weight: var(--default-font-weight);
1075
+
1076
+ // strong,
1077
+ // b {
1078
+ // font-weight: var(--sh1-bold-font-weight);
1079
+ // }
1080
+
1081
+ // font-size: clamp(
1082
+ // var(--sh-xl-font-size-min-mobile, 10px),
1083
+ // core-functions-v3.fontSize(var(--sh-xl-mobile)),
1084
+ // var(--sh-xl-font-size-max-mobile, 180px)
1085
+ // );
1086
+
1087
+ // @include device(breakpoints.$tabPortrait) {
1088
+ // font-size: clamp(
1089
+ // var(--sh-xl-font-size-min-mobile, 10px),
1090
+ // core-functions-v3.fontSize(var(--sh-xl-portrait), 'portrait'),
1091
+ // var(--sh-xl-font-size-max-mobile, 180px)
1092
+ // );
1093
+ // }
1094
+
1095
+ // @include device(breakpoints.$tabLandscape) {
1096
+ // font-size: clamp(
1097
+ // var(--sh-xl-font-size-min-desktop, 10px),
1098
+ // core-functions-v3.fontSize(var(--sh-xl-landscape), 'landscape'),
1099
+ // var(--sh-xl-font-size-max-desktop, 180px)
1100
+ // );
1101
+ // }
1102
+
1103
+ // @include device(breakpoints.$desktop) {
1104
+ // @include sh-x-large-size();
1105
+ // }
1106
+ // }
1107
+ // @mixin sh-large-size {
1108
+ // font-size: clamp(
1109
+ // var(--sh-l-font-size-min-desktop, 10px),
1110
+ // core-functions-v3.fontSize(var(--sh-l-desktop)),
1111
+ // var(--sh-l-font-size-max-desktop, 180px)
1112
+ // );
1113
+ // }
1114
+ // @mixin sh-large {
1115
+ // letter-spacing: var(--sh2-letter-spacing);
1116
+ // line-height: var(--sh2-line-height);
1117
+ // font-family: var(--sh2-font-family);
1118
+ // --default-font-weight: var(--sh2-default-font-weight);
1119
+ // font-weight: var(--default-font-weight);
1120
+
1121
+ // strong,
1122
+ // b {
1123
+ // font-weight: var(--sh2-bold-font-weight);
1124
+ // }
1125
+
1126
+ // font-size: clamp(
1127
+ // var(--sh-l-font-size-min-mobile, 10px),
1128
+ // core-functions-v3.fontSize(var(--sh-l-mobile)),
1129
+ // var(--sh-l-font-size-max-mobile, 180px)
1130
+ // );
1131
+
1132
+ // @include device(breakpoints.$tabPortrait) {
1133
+ // font-size: clamp(
1134
+ // var(--sh-l-font-size-min-mobile, 10px),
1135
+ // core-functions-v3.fontSize(var(--sh-l-portrait)),
1136
+ // var(--sh-l-font-size-max-mobile, 180px)
1137
+ // );
1138
+ // }
1139
+
1140
+ // @include device(breakpoints.$tabLandscape) {
1141
+ // font-size: clamp(
1142
+ // var(--sh-l-font-size-min-desktop, 10px),
1143
+ // core-functions-v3.fontSize(var(--sh-l-landscape)),
1144
+ // var(--sh-l-font-size-max-desktop, 180px)
1145
+ // );
1146
+ // }
1147
+
1148
+ // @include device(breakpoints.$desktop) {
1149
+ // @include sh-large-size();
1150
+ // }
1151
+ // }
1152
+ // @mixin sh-medium-size {
1153
+ // font-size: clamp(
1154
+ // var(--sh-m-font-size-min-desktop, 10px),
1155
+ // core-functions-v3.fontSize(var(--sh-m-desktop)),
1156
+ // var(--sh-m-font-size-max-desktop, 180px)
1157
+ // );
1158
+ // }
1159
+ // @mixin sh-medium {
1160
+ // letter-spacing: var(--sh3-letter-spacing);
1161
+ // line-height: var(--sh3-line-height);
1162
+ // font-family: var(--sh3-font-family);
1163
+ // --default-font-weight: var(--sh3-default-font-weight);
1164
+ // font-weight: var(--default-font-weight);
1165
+
1166
+ // strong,
1167
+ // b {
1168
+ // font-weight: var(--sh3-bold-font-weight);
1169
+ // }
1170
+
1171
+ // font-size: clamp(
1172
+ // var(--sh-m-font-size-min-mobile, 10px),
1173
+ // core-functions-v3.fontSize(var(--sh-m-mobile)),
1174
+ // var(--sh-m-font-size-max-mobile, 180px)
1175
+ // );
1176
+
1177
+ // @include device(breakpoints.$tabPortrait) {
1178
+ // font-size: clamp(
1179
+ // var(--sh-m-font-size-min-mobile, 10px),
1180
+ // core-functions-v3.fontSize(var(--sh-m-portrait)),
1181
+ // var(--sh-m-font-size-max-mobile, 180px)
1182
+ // );
1183
+ // }
1184
+
1185
+ // @include device(breakpoints.$tabLandscape) {
1186
+ // font-size: clamp(
1187
+ // var(--sh-m-font-size-min-desktop, 10px),
1188
+ // core-functions-v3.fontSize(var(--sh-m-landscape)),
1189
+ // var(--sh-m-font-size-max-desktop, 180px)
1190
+ // );
1191
+ // }
1192
+
1193
+ // @include device(breakpoints.$desktop) {
1194
+ // @include sh-medium-size();
1195
+ // }
1196
+ // }
1197
+ // @mixin sh-small-size {
1198
+ // font-size: clamp(
1199
+ // var(--sh-s-font-size-min-desktop, 10px),
1200
+ // core-functions-v3.fontSize(var(--sh-s-desktop)),
1201
+ // var(--sh-s-font-size-max-desktop, 180px)
1202
+ // );
1203
+ // }
1204
+ // @mixin sh-small {
1205
+ // letter-spacing: var(--sh4-letter-spacing);
1206
+ // line-height: var(--sh4-line-height);
1207
+ // font-family: var(--sh4-font-family);
1208
+ // --default-font-weight: var(--sh4-default-font-weight);
1209
+ // font-weight: var(--default-font-weight);
1210
+
1211
+ // strong,
1212
+ // b {
1213
+ // font-weight: var(--sh4-bold-font-weight);
1214
+ // }
1215
+
1216
+ // font-size: clamp(
1217
+ // var(--sh-s-font-size-min-mobile, 10px),
1218
+ // core-functions-v3.fontSize(var(--sh-s-mobile)),
1219
+ // var(--sh-s-font-size-max-mobile, 180px)
1220
+ // );
1221
+
1222
+ // @include device(breakpoints.$tabPortrait) {
1223
+ // font-size: clamp(
1224
+ // var(--sh-s-font-size-min-mobile, 10px),
1225
+ // core-functions-v3.fontSize(var(--sh-s-portrait)),
1226
+ // var(--sh-s-font-size-max-mobile, 180px)
1227
+ // );
1228
+ // }
1229
+
1230
+ // @include device(breakpoints.$tabLandscape) {
1231
+ // font-size: clamp(
1232
+ // var(--sh-s-font-size-min-desktop, 10px),
1233
+ // core-functions-v3.fontSize(var(--sh-s-landscape)),
1234
+ // var(--sh-s-font-size-max-desktop, 180px)
1235
+ // );
1236
+ // }
1237
+
1238
+ // @include device(breakpoints.$desktop) {
1239
+ // @include sh-small-size();
1240
+ // }
1241
+ // }
1242
+ // @mixin sh-x-small-size {
1243
+ // font-size: clamp(
1244
+ // var(--sh-xs-font-size-min-desktop, 10px),
1245
+ // core-functions-v3.fontSize(var(--sh-xs-desktop)),
1246
+ // var(--sh-xs-font-size-max-desktop, 180px)
1247
+ // );
1248
+ // }
1249
+ // @mixin sh-x-small {
1250
+ // letter-spacing: var(--sh5-letter-spacing);
1251
+ // line-height: var(--sh5-line-height);
1252
+ // font-family: var(--sh5-font-family);
1253
+ // --default-font-weight: var(--sh5-default-font-weight);
1254
+ // font-weight: var(--default-font-weight);
1255
+
1256
+ // strong,
1257
+ // b {
1258
+ // font-weight: var(--sh5-bold-font-weight);
1259
+ // }
1260
+
1261
+ // font-size: clamp(
1262
+ // var(--sh-xs-font-size-min-mobile, 10px),
1263
+ // core-functions-v3.fontSize(var(--sh-xs-mobile)),
1264
+ // var(--sh-xs-font-size-max-mobile, 180px)
1265
+ // );
1266
+
1267
+ // @include device(breakpoints.$tabPortrait) {
1268
+ // font-size: clamp(
1269
+ // var(--sh-xs-font-size-min-mobile, 10px),
1270
+ // core-functions-v3.fontSize(var(--sh-xs-portrait)),
1271
+ // var(--sh-xs-font-size-max-mobile, 180px)
1272
+ // );
1273
+ // }
1274
+
1275
+ // @include device(breakpoints.$tabLandscape) {
1276
+ // font-size: clamp(
1277
+ // var(--sh-xs-font-size-min-desktop, 10px),
1278
+ // core-functions-v3.fontSize(var(--sh-xs-landscape)),
1279
+ // var(--sh-xs-font-size-max-desktop, 180px)
1280
+ // );
1281
+ // }
1282
+
1283
+ // @include device(breakpoints.$desktop) {
1284
+ // @include sh-x-small-size();
1285
+ // }
1286
+ // }
1287
+ // @mixin sh-xx-small-size {
1288
+ // font-size: clamp(
1289
+ // var(--sh-xxs-font-size-min-desktop, 10px),
1290
+ // core-functions-v3.fontSize(var(--sh-xxs-desktop)),
1291
+ // var(--sh-xxs-font-size-max-desktop, 180px)
1292
+ // );
1293
+ // }
1294
+ // @mixin sh-xx-small {
1295
+ // letter-spacing: var(--sh6-letter-spacing);
1296
+ // line-height: var(--sh6-line-height);
1297
+ // font-family: var(--sh6-font-family);
1298
+ // --default-font-weight: var(--sh6-default-font-weight);
1299
+ // font-weight: var(--default-font-weight);
1300
+
1301
+ // strong,
1302
+ // b {
1303
+ // font-weight: var(--sh6-bold-font-weight);
1304
+ // }
1305
+
1306
+ // font-size: clamp(
1307
+ // var(--sh-xxs-font-size-min-mobile, 10px),
1308
+ // core-functions-v3.fontSize(var(--sh-xxs-mobile)),
1309
+ // var(--sh-xxs-font-size-max-mobile, 180px)
1310
+ // );
1311
+
1312
+ // @include device(breakpoints.$tabPortrait) {
1313
+ // font-size: clamp(
1314
+ // var(--sh-xxs-font-size-min-mobile, 10px),
1315
+ // core-functions-v3.fontSize(var(--sh-xxs-portrait)),
1316
+ // var(--sh-xxs-font-size-max-mobile, 180px)
1317
+ // );
1318
+ // }
1319
+
1320
+ // @include device(breakpoints.$tabLandscape) {
1321
+ // font-size: clamp(
1322
+ // var(--sh-xxs-font-size-min-desktop, 10px),
1323
+ // core-functions-v3.fontSize(var(--sh-xxs-landscape)),
1324
+ // var(--sh-xxs-font-size-max-desktop, 180px)
1325
+ // );
1326
+ // }
1327
+
1328
+ // @include device(breakpoints.$desktop) {
1329
+ // @include sh-xx-small-size();
1330
+ // }
1331
+ // }
1332
+ // @mixin p-l-size {
1333
+ // font-size: clamp(
1334
+ // var(--p-l-font-size-min-desktop, 10px),
1335
+ // core-functions-v3.fontSize(var(--p-l-desktop)),
1336
+ // var(--p-l-font-size-max-desktop, 180px)
1337
+ // );
1338
+ // }
1339
+ // @mixin p-l {
1340
+ // line-height: var(--paragraph-line-height);
1341
+ // letter-spacing: var(--paragraph-letter-spacing);
1342
+ // font-family: var(--paragraph-font-family);
1343
+
1344
+ // strong,
1345
+ // b {
1346
+ // font-weight: var(--paragraph-bold-font-weight);
1347
+ // }
1348
+
1349
+ // &:has(.font-tertiary) {
1350
+ // line-height: calc(
1351
+ // var(--paragraph-line-height) *
1352
+ // var(--global-line-height-multiplier-tertiary)
1353
+ // );
1354
+ // }
1355
+
1356
+ // em {
1357
+ // font-style: italic;
1358
+ // }
1359
+
1360
+ // font-size: clamp(
1361
+ // var(--p-l-font-size-min-mobile, 10px),
1362
+ // core-functions-v3.fontSize(var(--p-l-mobile), 'mobile'),
1363
+ // var(--p-l-font-size-max-mobile, 180px)
1364
+ // );
1365
+
1366
+ // @include device(breakpoints.$tabPortrait) {
1367
+ // font-size: clamp(
1368
+ // var(--p-l-font-size-min-mobile, 10px),
1369
+ // core-functions-v3.fontSize(var(--p-l-portrait), 'portrait'),
1370
+ // var(--p-l-font-size-max-mobile, 180px)
1371
+ // );
1372
+ // }
1373
+
1374
+ // @include device(breakpoints.$tabLandscape) {
1375
+ // font-size: clamp(
1376
+ // var(--p-l-font-size-min-desktop, 10px),
1377
+ // core-functions-v3.fontSize(var(--p-l-landscape), 'landscape'),
1378
+ // var(--p-l-font-size-max-desktop, 180px)
1379
+ // );
1380
+ // }
1381
+
1382
+ // @include device(breakpoints.$desktop) {
1383
+ // @include p-l-size();
1384
+ // }
1385
+ // }
1386
+ // @mixin p-size {
1387
+ // font-size: clamp(
1388
+ // var(--p-m-font-size-min-desktop, 10px),
1389
+ // core-functions-v3.fontSize(var(--p-m-desktop)),
1390
+ // var(--p-m-font-size-max-desktop, 180px)
1391
+ // );
1392
+ // }
1393
+ // @mixin p-size {
1394
+ // font-size: clamp(
1395
+ // var(--p-font-size-min-desktop, 10px),
1396
+ // core-functions-v3.fontSize(var(--p-desktop)),
1397
+ // var(--p-font-size-max-desktop, 180px)
1398
+ // );
1399
+ // }
1400
+ // @mixin p {
1401
+ // line-height: var(--paragraph-line-height);
1402
+ // letter-spacing: var(--paragraph-letter-spacing);
1403
+ // font-family: var(--paragraph-font-family);
1404
+ // --default-font-weight: var(--paragraph-default-font-weight);
1405
+ // font-weight: var(--default-font-weight);
1406
+
1407
+ // strong,
1408
+ // b {
1409
+ // font-weight: var(--paragraph-bold-font-weight);
1410
+ // }
1411
+
1412
+ // &:has(.font-tertiary) {
1413
+ // line-height: calc(
1414
+ // var(--paragraph-line-height) *
1415
+ // var(--global-line-height-multiplier-tertiary)
1416
+ // );
1417
+ // }
1418
+
1419
+ // em {
1420
+ // font-style: italic;
1421
+ // }
1422
+
1423
+ // font-size: clamp(
1424
+ // var(--p-font-size-min-mobile, 10px),
1425
+ // core-functions-v3.fontSize(var(--p-mobile), 'mobile'),
1426
+ // var(--p-font-size-max-mobile, 180px)
1427
+ // );
1428
+
1429
+ // @include device(breakpoints.$tabPortrait) {
1430
+ // font-size: clamp(
1431
+ // var(--p-font-size-min-mobile, 10px),
1432
+ // core-functions-v3.fontSize(var(--p-portrait), 'portrait'),
1433
+ // var(--p-font-size-max-mobile, 180px)
1434
+ // );
1435
+ // }
1436
+
1437
+ // @include device(breakpoints.$tabLandscape) {
1438
+ // font-size: clamp(
1439
+ // var(--p-font-size-min-desktop, 10px),
1440
+ // core-functions-v3.fontSize(var(--p-landscape), 'landscape'),
1441
+ // var(--p-font-size-max-desktop, 180px)
1442
+ // );
1443
+ // }
1444
+
1445
+ // @include device(breakpoints.$desktop) {
1446
+ // @include p-size();
1447
+ // }
1448
+ // }
1449
+ // @mixin p-s-size {
1450
+ // font-size: clamp(
1451
+ // var(--p-s-font-size-min-desktop, 10px),
1452
+ // core-functions-v3.fontSize(var(--p-s-desktop)),
1453
+ // var(--p-s-font-size-max-desktop, 180px)
1454
+ // );
1455
+ // }
1456
+ // @mixin p-s {
1457
+ // line-height: var(--paragraph-line-height);
1458
+ // letter-spacing: var(--paragraph-letter-spacing);
1459
+ // font-family: var(--paragraph-font-family);
1460
+
1461
+ // strong,
1462
+ // b {
1463
+ // font-weight: var(--paragraph-bold-font-weight);
1464
+ // }
1465
+
1466
+ // &:has(.font-tertiary) {
1467
+ // line-height: calc(
1468
+ // var(--paragraph-line-height) *
1469
+ // var(--global-line-height-multiplier-tertiary)
1470
+ // );
1471
+ // }
1472
+
1473
+ // em {
1474
+ // font-style: italic;
1475
+ // }
1476
+
1477
+ // font-size: clamp(
1478
+ // var(--p-s-font-size-min-mobile, 10px),
1479
+ // core-functions-v3.fontSize(var(--p-s-mobile), 'mobile'),
1480
+ // var(--p-s-font-size-max-mobile, 180px)
1481
+ // );
1482
+
1483
+ // @include device(breakpoints.$tabPortrait) {
1484
+ // font-size: clamp(
1485
+ // var(--p-s-font-size-min-mobile, 10px),
1486
+ // core-functions-v3.fontSize(var(--p-s-portrait), 'portrait'),
1487
+ // var(--p-s-font-size-max-mobile, 180px)
1488
+ // );
1489
+ // }
1490
+
1491
+ // @include device(breakpoints.$tabLandscape) {
1492
+ // font-size: clamp(
1493
+ // var(--p-s-font-size-min-desktop, 10px),
1494
+ // core-functions-v3.fontSize(var(--p-s-landscape), 'landscape'),
1495
+ // var(--p-s-font-size-max-desktop, 180px)
1496
+ // );
1497
+ // }
1498
+
1499
+ // @include device(breakpoints.$desktop) {
1500
+ // @include p-s-size();
1501
+ // }
1502
+ // }
1503
+ // @mixin p-xs-size {
1504
+ // font-size: clamp(
1505
+ // var(--p-xs-font-size-min-desktop, 10px),
1506
+ // core-functions-v3.fontSize(var(--p-xs-desktop)),
1507
+ // var(--p-xs-font-size-max-desktop, 180px)
1508
+ // );
1509
+ // }
1510
+ // @mixin p-xs {
1511
+ // line-height: var(--paragraph-line-height);
1512
+ // letter-spacing: var(--paragraph-letter-spacing);
1513
+ // font-family: var(--paragraph-font-family);
1514
+
1515
+ // strong,
1516
+ // b {
1517
+ // font-weight: var(--paragraph-bold-font-weight);
1518
+ // }
1519
+
1520
+ // &:has(.font-tertiary) {
1521
+ // line-height: calc(
1522
+ // var(--paragraph-line-height) *
1523
+ // var(--global-line-height-multiplier-tertiary)
1524
+ // );
1525
+ // }
1526
+
1527
+ // em {
1528
+ // font-style: italic;
1529
+ // }
1530
+
1531
+ // font-size: clamp(
1532
+ // var(--p-xs-font-size-min-mobile, 10px),
1533
+ // core-functions-v3.fontSize(var(--p-xs-mobile)),
1534
+ // var(--p-xs-font-size-max-mobile, 180px)
1535
+ // );
1536
+
1537
+ // @include device(breakpoints.$tabPortrait) {
1538
+ // font-size: clamp(
1539
+ // var(--p-xs-font-size-min-mobile, 10px),
1540
+ // core-functions-v3.fontSize(var(--p-xs-portrait)),
1541
+ // var(--p-xs-font-size-max-mobile, 180px)
1542
+ // );
1543
+ // }
1544
+
1545
+ // @include device(breakpoints.$tabLandscape) {
1546
+ // font-size: clamp(
1547
+ // var(--p-xs-font-size-min-desktop, 10px),
1548
+ // core-functions-v3.fontSize(var(--p-xs-landscape)),
1549
+ // var(--p-xs-font-size-max-desktop, 180px)
1550
+ // );
1551
+ // }
1552
+
1553
+ // @include device(breakpoints.$desktop) {
1554
+ // @include p-xs-size();
1555
+ // }
1556
+ // }
1557
+ // @mixin p-xs-size {
1558
+ // font-size: clamp(
1559
+ // var(--p-xs-font-size-min-desktop, 10px),
1560
+ // core-functions-v3.fontSize(var(--p-xs-desktop)),
1561
+ // var(--p-xs-font-size-max-desktop, 180px)
1562
+ // );
1563
+ // }
1564
+ // @mixin p-xs {
1565
+ // line-height: var(--paragraph-line-height);
1566
+ // letter-spacing: var(--paragraph-letter-spacing);
1567
+ // font-family: var(--paragraph-font-family);
1568
+
1569
+ // strong,
1570
+ // b {
1571
+ // font-weight: var(--paragraph-bold-font-weight);
1572
+ // }
1573
+
1574
+ // &:has(.font-tertiary) {
1575
+ // line-height: calc(
1576
+ // var(--paragraph-line-height) *
1577
+ // var(--global-line-height-multiplier-tertiary)
1578
+ // );
1579
+ // }
1580
+
1581
+ // em {
1582
+ // font-style: italic;
1583
+ // }
1584
+
1585
+ // font-size: clamp(
1586
+ // var(--p-xs-font-size-min-mobile, 10px),
1587
+ // core-functions-v3.fontSize(var(--p-xs-mobile)),
1588
+ // var(--p-xs-font-size-max-mobile, 180px)
1589
+ // );
1590
+
1591
+ // @include device(breakpoints.$tabPortrait) {
1592
+ // font-size: clamp(
1593
+ // var(--p-xs-font-size-min-mobile, 10px),
1594
+ // core-functions-v3.fontSize(var(--p-xs-portrait)),
1595
+ // var(--p-xs-font-size-max-mobile, 180px)
1596
+ // );
1597
+ // }
1598
+
1599
+ // @include device(breakpoints.$tabLandscape) {
1600
+ // font-size: clamp(
1601
+ // var(--p-xs-font-size-min-desktop, 10px),
1602
+ // core-functions-v3.fontSize(var(--p-xs-landscape)),
1603
+ // var(--p-xs-font-size-max-desktop, 180px)
1604
+ // );
1605
+ // }
1606
+
1607
+ // @include device(breakpoints.$desktop) {
1608
+ // @include p-xs-size();
1609
+ // }
1610
+ // }
1611
+ // @mixin p-xxs-size {
1612
+ // font-size: clamp(
1613
+ // var(--p-xxs-font-size-min-desktop, 10px),
1614
+ // core-functions-v3.fontSize(var(--p-xxs-desktop)),
1615
+ // var(--p-xxs-font-size-max-desktop, 180px)
1616
+ // );
1617
+ // }
1618
+ // @mixin p-xxs {
1619
+ // line-height: var(--paragraph-line-height);
1620
+ // letter-spacing: var(--paragraph-letter-spacing);
1621
+ // font-family: var(--paragraph-font-family);
1622
+
1623
+ // strong,
1624
+ // b {
1625
+ // font-weight: var(--paragraph-bold-font-weight);
1626
+ // }
1627
+
1628
+ // &:has(.font-tertiary) {
1629
+ // line-height: calc(
1630
+ // var(--paragraph-line-height) *
1631
+ // var(--global-line-height-multiplier-tertiary)
1632
+ // );
1633
+ // }
1634
+
1635
+ // em {
1636
+ // font-style: italic;
1637
+ // }
1638
+
1639
+ // font-size: clamp(
1640
+ // var(--p-xxs-font-size-min-mobile, 10px),
1641
+ // core-functions-v3.fontSize(var(--p-xxs-mobile)),
1642
+ // var(--p-xxs-font-size-max-mobile, 180px)
1643
+ // );
1644
+
1645
+ // @include device(breakpoints.$tabPortrait) {
1646
+ // font-size: clamp(
1647
+ // var(--p-xxs-font-size-min-mobile, 10px),
1648
+ // core-functions-v3.fontSize(var(--p-xxs-portrait)),
1649
+ // var(--p-xxs-font-size-max-mobile, 180px)
1650
+ // );
1651
+ // }
1652
+
1653
+ // @include device(breakpoints.$tabLandscape) {
1654
+ // font-size: clamp(
1655
+ // var(--p-xxs-font-size-min-desktop, 10px),
1656
+ // core-functions-v3.fontSize(var(--p-xxs-landscape)),
1657
+ // var(--p-xxs-font-size-max-desktop, 180px)
1658
+ // );
1659
+ // }
1660
+
1661
+ // @include device(breakpoints.$desktop) {
1662
+ // @include p-xxs-size();
1663
+ // }
1664
+ // }
1665
+ // @mixin p-xxxs-size {
1666
+ // font-size: clamp(
1667
+ // var(--p-xxxs-font-size-min-desktop, 10px),
1668
+ // core-functions-v3.fontSize(var(--p-xxxs-desktop)),
1669
+ // var(--p-xxxs-font-size-max-desktop, 180px)
1670
+ // );
1671
+ // }
1672
+ // @mixin p-xxxs {
1673
+ // line-height: var(--paragraph-line-height);
1674
+ // letter-spacing: var(--paragraph-letter-spacing);
1675
+ // font-family: var(--paragraph-font-family);
1676
+
1677
+ // strong,
1678
+ // b {
1679
+ // font-weight: var(--paragraph-bold-font-weight);
1680
+ // }
1681
+
1682
+ // &:has(.font-tertiary) {
1683
+ // line-height: calc(
1684
+ // var(--paragraph-line-height) *
1685
+ // var(--global-line-height-multiplier-tertiary)
1686
+ // );
1687
+ // }
1688
+
1689
+ // em {
1690
+ // font-style: italic;
1691
+ // }
1692
+
1693
+ // font-size: clamp(
1694
+ // var(--p-xxxs-font-size-min-mobile, 10px),
1695
+ // core-functions-v3.fontSize(var(--p-xxxs-mobile)),
1696
+ // var(--p-xxxs-font-size-max-mobile, 180px)
1697
+ // );
1698
+
1699
+ // @include device(breakpoints.$tabPortrait) {
1700
+ // font-size: clamp(
1701
+ // var(--p-xxxs-font-size-min-mobile, 10px),
1702
+ // core-functions-v3.fontSize(var(--p-xxxs-portrait)),
1703
+ // var(--p-xxxs-font-size-max-mobile, 180px)
1704
+ // );
1705
+ // }
1706
+
1707
+ // @include device(breakpoints.$tabLandscape) {
1708
+ // font-size: clamp(
1709
+ // var(--p-xxxs-font-size-min-desktop, 10px),
1710
+ // core-functions-v3.fontSize(var(--p-xxxs-landscape)),
1711
+ // var(--p-xxxs-font-size-max-desktop, 180px)
1712
+ // );
1713
+ // }
1714
+
1715
+ // @include device(breakpoints.$desktop) {
1716
+ // @include p-xxxs-size();
1717
+ // }
1718
+ // }
1719
+ // @mixin fontPrimary() {
1720
+ // font-family: var(--primary-font-family), sans-serif;
1721
+ // --font-size-multiplier: var(--global-font-multiplier-primary);
1722
+ // }
1723
+ // @mixin fontSecondary() {
1724
+ // font-family: var(--secondary-font-family), sans-serif;
1725
+ // --font-size-multiplier: var(--global-font-multiplier-secondary);
1726
+ // }
1727
+ // @mixin fontTertiary() {
1728
+ // font-family: var(--tertiary-font-family), sans-serif;
1729
+ // --font-size-multiplier: var(--global-font-multiplier-tertiary);
1730
+ // }
1731
+ // @mixin fontQuaternary() {
1732
+ // font-family: var(--quaternary-font-family), sans-serif;
1733
+ // --font-size-multiplier: var(--global-font-multiplier-quaternary);
1734
+ // }