@asante-org/atlascopco-vt-litesitegenerator 3.6.21 → 3.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2106 +0,0 @@
1
- :root {
2
- --atlascopco-blue-1: #f5fbfc;
3
- --atlascopco-blue-3: #b8e0ec;
4
- --atlascopco-blue-5: #7ac6dc;
5
- --atlascopco-blue-7: #3daccc;
6
- --atlascopco-blue-9: #0092bc;
7
- --atlascopco-blue-11: #006f8f;
8
- --atlascopco-gray-1: #f8f9f9;
9
- --atlascopco-gray-3: #d1d4d7;
10
- --atlascopco-gray-5: #aab0b5;
11
- --atlascopco-gray-7: #828b92;
12
- --atlascopco-gray-9: #5b6770;
13
- --atlascopco-gray-11: #2f363a;
14
- --atlascopco-beige-1: #f5f2ef;
15
- --atlascopco-beige-2: #efebe6;
16
- --atlascopco-beige-3: #e7e0da;
17
- --atlascopco-beige-4: #dfd6ce;
18
- --atlascopco-blue: #0092bc;
19
- --atlascopco-blue-dark: #006f8f;
20
- --atlascopco-black: #000000;
21
- --atlascopco-white: #ffffff;
22
- --atlascopco-gradient-blue: linear-gradient(135deg, #0092bc 0%, #006f8f 100%);
23
- --atlascopco-gradient-gray: linear-gradient(135deg, #f8f9f9 0%, #aab0b5 100%);
24
- --atlascopco-gradient-beige: linear-gradient(135deg, #f5f2ef 0%, #e7e0da 100%);
25
- --atlascopco-gradient-dark: linear-gradient(135deg, #5b6770 0%, #2f363a 100%);
26
- --atlascopco-grey-100: #f8f9f9;
27
- --atlascopco-grey-200: #d1d4d7;
28
- --atlascopco-grey-300: #aab0b5;
29
- --atlascopco-grey-400: #828b92;
30
- --atlascopco-grey-500: #5b6770;
31
- --atlascopco-grey-600: #2f363a;
32
- --color-primary: #0092bc;
33
- --font-family-base: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif;
34
- --spacing-zero: 0px;
35
- --spacing-xxs: 4px;
36
- --spacing-xs: 8px;
37
- --spacing-sm: 12px;
38
- --spacing-md: 16px;
39
- --spacing-lg: 24px;
40
- --spacing-xl: 36px;
41
- --spacing-xxl: 48px;
42
- --spacing-3xl: 72px;
43
- --spacing-4xl: 96px;
44
- --h1-mobile-size: 32px;
45
- --h1-mobile-line-height: 1.2;
46
- --h2-mobile-size: 24px;
47
- --h2-mobile-line-height: 1.2;
48
- --h3-mobile-size: 18px;
49
- --h3-mobile-line-height: 1.6;
50
- --body-mobile-size: 14px;
51
- --body-mobile-line-height: 1.5;
52
- --h1-desktop-size: 55px;
53
- --h1-desktop-line-height: 1.15;
54
- --h2-desktop-size: 40px;
55
- --h2-desktop-line-height: 1.2;
56
- --h3-desktop-size: 32px;
57
- --h3-desktop-line-height: 1.2;
58
- --body-desktop-size: 18px;
59
- --body-desktop-line-height: 1.6;
60
- --text-lg-size: 27px;
61
- --text-lg-line-height: 1.4;
62
- --text-xl-size: 36px;
63
- --text-xl-line-height: 1.4;
64
- --text-xxl-size: 64px;
65
- --text-xxl-line-height: 1;
66
- }
67
-
68
- :root {
69
- --lsg-color-primary: #14532d;
70
- --lsg-color-secondary: #3f3f46;
71
- --lsg-color-tertiary: #c2410c;
72
- --lsg-color-light: #eeeeee;
73
- --lsg-color-dark: #18181b;
74
- --lsg-color-black: #09090b;
75
- --lsg-color-white: #ffffff;
76
- --lsg-size-Small: 14px;
77
- --lsg-size-body: 18px;
78
- --lsg-size-Pretitle: 18px;
79
- --lsg-size-H6: 18px;
80
- --lsg-size-H5: 21px;
81
- --lsg-size-H4: 28px;
82
- --lsg-size-H3: 30px;
83
- --lsg-size-H2: 36px;
84
- --lsg-size-H1: 45px;
85
- --lsg-size-large: 54px;
86
- --lsg-size-xl: 72px;
87
- --lsg-size-xxl: 90px;
88
- --lsg-size-xxxl: 108px;
89
- --lsg-font-family-primary: Calibri;
90
- --lsg-font-family-secondary: "Times New Roman";
91
- --lsg-font-weight-regular: 400;
92
- --lsg-font-weight-semibold: 600;
93
- --lsg-font-weight-bold: 700;
94
- --lsg-line-height-tight: 1.1;
95
- --lsg-line-height-heading: 1.2;
96
- --lsg-line-height-copy: 1.5;
97
- --lsg-type-heading-family: var(--lsg-font-family-secondary);
98
- --lsg-type-body-family: var(--lsg-font-family-primary);
99
- --lsg-type-h1-mobile-size: 36px;
100
- --lsg-type-h1-desktop-size: var(--lsg-size-H1);
101
- --lsg-type-h1-mobile-line-height: var(--lsg-line-height-tight);
102
- --lsg-type-h1-desktop-line-height: var(--lsg-line-height-tight);
103
- --lsg-type-h2-mobile-size: 32px;
104
- --lsg-type-h2-desktop-size: var(--lsg-size-H2);
105
- --lsg-type-h2-mobile-line-height: var(--lsg-line-height-heading);
106
- --lsg-type-h2-desktop-line-height: var(--lsg-line-height-heading);
107
- --lsg-type-h3-mobile-size: 28px;
108
- --lsg-type-h3-desktop-size: var(--lsg-size-H3);
109
- --lsg-type-h3-mobile-line-height: var(--lsg-line-height-heading);
110
- --lsg-type-h3-desktop-line-height: var(--lsg-line-height-heading);
111
- --lsg-type-h4-mobile-size: 24px;
112
- --lsg-type-h4-desktop-size: var(--lsg-size-H4);
113
- --lsg-type-h4-mobile-line-height: var(--lsg-line-height-heading);
114
- --lsg-type-h4-desktop-line-height: var(--lsg-line-height-heading);
115
- --lsg-type-h5-mobile-size: 20px;
116
- --lsg-type-h5-desktop-size: var(--lsg-size-H5);
117
- --lsg-type-h5-mobile-line-height: var(--lsg-line-height-heading);
118
- --lsg-type-h5-desktop-line-height: var(--lsg-line-height-heading);
119
- --lsg-type-h6-mobile-size: 18px;
120
- --lsg-type-h6-desktop-size: var(--lsg-size-H6);
121
- --lsg-type-h6-mobile-line-height: var(--lsg-line-height-copy);
122
- --lsg-type-h6-desktop-line-height: var(--lsg-line-height-copy);
123
- --lsg-type-pretitle-mobile-size: 16px;
124
- --lsg-type-pretitle-desktop-size: var(--lsg-size-Pretitle);
125
- --lsg-type-pretitle-mobile-line-height: var(--lsg-line-height-copy);
126
- --lsg-type-pretitle-desktop-line-height: var(--lsg-line-height-copy);
127
- --lsg-type-body-mobile-size: 16px;
128
- --lsg-type-body-desktop-size: var(--lsg-size-body);
129
- --lsg-type-body-mobile-line-height: var(--lsg-line-height-copy);
130
- --lsg-type-body-desktop-line-height: var(--lsg-line-height-copy);
131
- --lsg-type-large-mobile-size: 40px;
132
- --lsg-type-large-desktop-size: var(--lsg-size-large);
133
- --lsg-type-large-mobile-line-height: var(--lsg-line-height-tight);
134
- --lsg-type-large-desktop-line-height: var(--lsg-line-height-tight);
135
- --lsg-type-xlarge-mobile-size: 48px;
136
- --lsg-type-xlarge-desktop-size: var(--lsg-size-xl);
137
- --lsg-type-xlarge-mobile-line-height: var(--lsg-line-height-tight);
138
- --lsg-type-xlarge-desktop-line-height: var(--lsg-line-height-tight);
139
- --lsg-type-xxlarge-mobile-size: 56px;
140
- --lsg-type-xxlarge-desktop-size: var(--lsg-size-xxl);
141
- --lsg-type-xxlarge-mobile-line-height: var(--lsg-line-height-tight);
142
- --lsg-type-xxlarge-desktop-line-height: var(--lsg-line-height-tight);
143
- --lsg-type-xxxlarge-mobile-size: 64px;
144
- --lsg-type-xxxlarge-desktop-size: var(--lsg-size-xxxl);
145
- --lsg-type-xxxlarge-mobile-line-height: var(--lsg-line-height-tight);
146
- --lsg-type-xxxlarge-desktop-line-height: var(--lsg-line-height-tight);
147
- --lsg-radius-square: 0px;
148
- --lsg-radius-rounded: 10px;
149
- --lsg-radius-pill: 25px;
150
- --lsg-spacing-size-2XS: 4px;
151
- --lsg-spacing-size-XS: 8px;
152
- --lsg-spacing-size-SM: 16px;
153
- --lsg-spacing-size-MD: 24px;
154
- --lsg-spacing-size-LG: 32px;
155
- --lsg-spacing-size-XL: 64px;
156
- --lsg-spacing-size-2XL: 96px;
157
- --lsg-spacing-size-3XL: 128px;
158
- --lsg-spacing-size-48: 48px;
159
- --lsg-spacing-size-72: 72px;
160
- --lsg-spacing-size-120: 120px;
161
- --lsg-spacing-size-140: 140px;
162
- --lsg-container-width-full: 100%;
163
- --lsg-container-width-medium: 1280px;
164
- --lsg-container-width-narrow: 840px;
165
- --lsg-ai-banner-bg: var(--lsg-color-dark);
166
- --lsg-ai-banner-icon-color: var(--lsg-color-primary);
167
- --lsg-ai-banner-text-color: var(--lsg-color-white);
168
- --lsg-ai-banner-height: 50px;
169
- --lsg-ai-banner-icon-size: 18px;
170
- --lsg-ai-banner-font-size: 0.75rem;
171
- --lsg-ai-banner-gap: var(--lsg-spacing-size-XS);
172
- --lsg-ai-banner-max-width: var(--lsg-container-width-medium);
173
- --lsg-accordion-max-width: 600px;
174
- --lsg-accordion-divider-color: var(--atlascopco-beige-3, #e7e0da);
175
- --lsg-accordion-active-color: var(--lsg-color-primary);
176
- --lsg-accordion-active-border-width: 3px;
177
- --lsg-accordion-title-color: var(--lsg-color-black);
178
- --lsg-accordion-title-font-size: 1rem;
179
- --lsg-accordion-icon-color: var(--lsg-color-secondary, #5b6770);
180
- --lsg-accordion-icon-size: 16px;
181
- --lsg-accordion-icon-gap: 16px;
182
- --lsg-accordion-content-color: var(--lsg-color-secondary, #5b6770);
183
- --lsg-accordion-content-font-size: 1rem;
184
- --lsg-accordion-content-line-height: 1.6;
185
- --lsg-accordion-header-height: 60px;
186
- --lsg-accordion-header-padding-y: 12px;
187
- --lsg-accordion-content-indent: 16px;
188
- --lsg-accordion-content-border-width: 1px;
189
- --lsg-accordion-content-padding-bottom: 16px;
190
- --lsg-accordion-border-radius: 4px;
191
- --lsg-accordion-transition: 300ms ease;
192
- --lsg-accordion-faq-title-font-size: 1.125rem;
193
- --lsg-accordion-faq-content-font-size: 1rem;
194
- }
195
-
196
- .lsg-button {
197
- display: inline-flex;
198
- align-items: center;
199
- justify-content: center;
200
- gap: 8px;
201
- padding: 12px 24px;
202
- font-family: var(--lsg-font-family-primary);
203
- font-size: 0.9375rem;
204
- font-weight: 600;
205
- line-height: 1.5;
206
- text-decoration: none;
207
- border: 2px solid transparent;
208
- cursor: pointer;
209
- transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
210
- white-space: nowrap;
211
- }
212
- .lsg-button:focus-visible {
213
- outline: 2px solid var(--lsg-color-primary);
214
- outline-offset: 2px;
215
- }
216
- .lsg-button--primary {
217
- background-color: var(--lsg-color-primary);
218
- border-color: var(--lsg-color-primary);
219
- color: var(--lsg-color-white);
220
- }
221
- .lsg-button--primary:hover:not([disabled]):not(.lsg-button--disabled) {
222
- background-color: color-mix(in srgb, var(--lsg-color-primary) 82%, var(--lsg-color-black));
223
- border-color: color-mix(in srgb, var(--lsg-color-primary) 82%, var(--lsg-color-black));
224
- }
225
- .lsg-button--secondary {
226
- background-color: transparent;
227
- border-color: var(--lsg-color-primary);
228
- color: var(--lsg-color-primary);
229
- }
230
- .lsg-button--secondary:hover:not([disabled]):not(.lsg-button--disabled) {
231
- background-color: var(--lsg-color-primary);
232
- color: var(--lsg-color-white);
233
- }
234
- .lsg-button--disabled, .lsg-button[disabled] {
235
- opacity: 0.5;
236
- cursor: not-allowed;
237
- pointer-events: none;
238
- }
239
-
240
- .lsg-banner {
241
- position: relative;
242
- display: flex;
243
- align-items: center;
244
- min-height: 400px;
245
- padding: 72px 24px;
246
- background-color: var(--lsg-color-dark);
247
- color: var(--lsg-color-white);
248
- overflow: hidden;
249
- }
250
- .lsg-banner__background {
251
- position: absolute;
252
- inset: 0;
253
- }
254
- .lsg-banner__background img {
255
- width: 100%;
256
- height: 100%;
257
- object-fit: cover;
258
- display: block;
259
- }
260
- .lsg-banner__background::after {
261
- content: "";
262
- position: absolute;
263
- inset: 0;
264
- background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.15) 100%);
265
- }
266
- .lsg-banner__inner {
267
- position: relative;
268
- z-index: 1;
269
- width: 100%;
270
- max-width: 1280px;
271
- margin: 0 auto;
272
- padding: 0 24px;
273
- }
274
- .lsg-banner__eyebrow {
275
- display: block;
276
- font-size: 0.8125rem;
277
- font-weight: 700;
278
- letter-spacing: 0.1em;
279
- text-transform: uppercase;
280
- color: color-mix(in srgb, var(--lsg-color-primary) 35%, var(--lsg-color-white));
281
- margin: 0 0 12px;
282
- }
283
- .lsg-banner__heading {
284
- font-size: clamp(1.75rem, 4vw, 3rem);
285
- font-weight: 700;
286
- line-height: 1.15;
287
- margin: 0 0 16px;
288
- max-width: 720px;
289
- }
290
- .lsg-banner__copy {
291
- font-size: 1.125rem;
292
- line-height: 1.6;
293
- color: color-mix(in srgb, var(--lsg-color-white) 88%, var(--lsg-color-light));
294
- margin: 0 0 36px;
295
- max-width: 560px;
296
- }
297
- .lsg-card {
298
- display: flex;
299
- flex-direction: column;
300
- border: 1px solid color-mix(in srgb, var(--lsg-color-secondary) 18%, var(--lsg-color-white));
301
- border-radius: var(--lsg-radius-rounded);
302
- background: var(--lsg-color-white);
303
- overflow: hidden;
304
- transition: box-shadow 0.2s ease;
305
- height: 100%;
306
- }
307
- .lsg-card:hover {
308
- box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
309
- }
310
- .lsg-card__image {
311
- aspect-ratio: 16/9;
312
- overflow: hidden;
313
- }
314
- .lsg-card__image img {
315
- width: 100%;
316
- height: 100%;
317
- object-fit: cover;
318
- display: block;
319
- }
320
- .lsg-card__body {
321
- display: flex;
322
- flex-direction: column;
323
- flex: 1;
324
- padding: 24px;
325
- gap: 12px;
326
- }
327
- .lsg-card__title {
328
- font-size: 1.125rem;
329
- font-weight: 600;
330
- line-height: 1.3;
331
- color: var(--lsg-color-black);
332
- margin: 0;
333
- }
334
- .lsg-card__description {
335
- font-size: var(--lsg-size-body);
336
- line-height: 1.6;
337
- color: var(--lsg-color-secondary);
338
- margin: 0;
339
- flex: 1;
340
- }
341
- .lsg-card__footer {
342
- margin-top: auto;
343
- padding-top: 12px;
344
- border-top: 1px solid color-mix(in srgb, var(--lsg-color-secondary) 12%, var(--lsg-color-white));
345
- }
346
-
347
- .lsg-cards {
348
- display: grid;
349
- grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
350
- gap: 24px;
351
- list-style: none;
352
- padding: 0;
353
- margin: 0;
354
- }
355
-
356
- .lsg-logo {
357
- display: inline-flex;
358
- align-items: center;
359
- text-decoration: none;
360
- flex-shrink: 0;
361
- }
362
- .lsg-logo__image {
363
- display: block;
364
- width: auto;
365
- height: 40px;
366
- max-width: 160px;
367
- }
368
- .lsg-logo__text {
369
- font-family: var(--lsg-font-family-primary);
370
- font-size: 1.25rem;
371
- font-weight: 700;
372
- color: var(--lsg-color-primary);
373
- letter-spacing: -0.01em;
374
- }
375
-
376
- .lsg-nav {
377
- font-family: var(--lsg-font-family-primary);
378
- --lsg-header-green: var(--lsg-color-primary);
379
- --lsg-header-row-active: color-mix(
380
- in srgb,
381
- var(--lsg-color-primary) 11%,
382
- var(--lsg-color-white)
383
- );
384
- }
385
- .lsg-nav__list, .lsg-nav__dropdown {
386
- list-style: none;
387
- padding: 0;
388
- margin: 0;
389
- }
390
- .lsg-nav__list {
391
- display: flex;
392
- align-items: center;
393
- gap: 18px;
394
- }
395
- .lsg-nav__item {
396
- position: relative;
397
- display: flex;
398
- align-items: stretch;
399
- }
400
- .lsg-nav__link {
401
- display: inline-flex;
402
- align-items: center;
403
- justify-content: space-between;
404
- gap: 4px;
405
- min-height: 40px;
406
- padding: 8px 0;
407
- font-family: var(--lsg-font-family-primary);
408
- font-size: 16px;
409
- font-weight: 400;
410
- line-height: 1.5;
411
- color: var(--lsg-color-black);
412
- text-decoration: none;
413
- text-transform: uppercase;
414
- border-bottom: 2px solid transparent;
415
- transition: color 0.24s ease, border-color 0.24s ease, background-color 0.24s ease;
416
- }
417
- .lsg-nav__link p {
418
- margin: 0;
419
- line-height: inherit;
420
- }
421
- .lsg-nav__link:hover, .lsg-nav__link:focus-visible {
422
- color: var(--lsg-header-green);
423
- outline: none;
424
- }
425
- .lsg-nav__link:focus-visible {
426
- outline: 1px solid var(--lsg-header-green);
427
- outline-offset: 3px;
428
- }
429
- .lsg-nav__link--current {
430
- color: var(--lsg-header-green);
431
- border-bottom-color: var(--lsg-header-green);
432
- font-weight: 600;
433
- }
434
- .lsg-nav__chevron {
435
- display: inline-flex;
436
- align-items: center;
437
- justify-content: center;
438
- width: 10px;
439
- height: 5px;
440
- color: currentColor;
441
- transition: transform 0.24s ease;
442
- }
443
- .lsg-nav__chevron svg {
444
- display: block;
445
- width: 10px;
446
- height: 5px;
447
- fill: currentColor;
448
- }
449
- .lsg-nav--dropdown .lsg-nav__item--has-children > .lsg-nav__link .lsg-nav__chevron {
450
- transform: rotate(90deg);
451
- }
452
- .lsg-nav--dropdown .lsg-nav__dropdown {
453
- position: absolute;
454
- top: calc(100% + 9px);
455
- left: 50%;
456
- z-index: 40;
457
- width: 176px;
458
- padding: 8px 12px;
459
- background: var(--lsg-color-light);
460
- box-shadow: 0 12px 20px rgba(0, 0, 0, 0.05);
461
- opacity: 0;
462
- pointer-events: none;
463
- transform: translateX(-50%) translateY(-6px);
464
- transition: opacity 0.24s ease, transform 0.24s ease, visibility 0.24s ease;
465
- visibility: hidden;
466
- }
467
- .lsg-nav--dropdown .lsg-nav__dropdown::before {
468
- content: "";
469
- position: absolute;
470
- top: -9px;
471
- left: 0;
472
- width: 100%;
473
- height: 9px;
474
- }
475
- .lsg-nav--dropdown .lsg-nav__dropdown::after {
476
- content: "";
477
- position: absolute;
478
- top: -9px;
479
- left: 50%;
480
- width: 0;
481
- height: 0;
482
- border-right: 9px solid transparent;
483
- border-bottom: 9px solid var(--lsg-color-light);
484
- border-left: 9px solid transparent;
485
- transform: translateX(-50%);
486
- }
487
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__item {
488
- display: block;
489
- border-top: 1px solid rgba(0, 0, 0, 0.08);
490
- }
491
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__item:first-child {
492
- border-top: 0;
493
- }
494
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__link {
495
- display: flex;
496
- width: 100%;
497
- min-height: 40px;
498
- padding: 8px 0;
499
- border-bottom: 0;
500
- font-size: 14px;
501
- line-height: 1.4;
502
- text-transform: none;
503
- }
504
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__link:hover, .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__link:focus-visible, .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__link--current {
505
- color: var(--lsg-header-green);
506
- font-weight: 600;
507
- }
508
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__dropdown {
509
- position: static;
510
- display: none;
511
- width: auto;
512
- padding: 0 0 0 12px;
513
- box-shadow: none;
514
- opacity: 1;
515
- pointer-events: auto;
516
- transform: none;
517
- transition: none;
518
- visibility: visible;
519
- }
520
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__dropdown::before, .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__dropdown::after {
521
- content: none;
522
- }
523
- .lsg-nav--dropdown .lsg-nav__item--open > .lsg-nav__dropdown {
524
- opacity: 1;
525
- pointer-events: auto;
526
- transform: translateX(-50%) translateY(0);
527
- visibility: visible;
528
- }
529
- .lsg-nav--dropdown .lsg-nav__dropdown .lsg-nav__item--open > .lsg-nav__dropdown {
530
- display: block;
531
- transform: none;
532
- }
533
- .lsg-nav--dropdown .lsg-nav__item--open > .lsg-nav__link .lsg-nav__chevron {
534
- transform: rotate(270deg);
535
- }
536
-
537
- @media (max-width: 767px) {
538
- .lsg-nav {
539
- display: none;
540
- }
541
- }
542
- .lsg-lang-switcher {
543
- font-family: var(--lsg-font-family-primary);
544
- position: relative;
545
- }
546
- .lsg-lang-switcher__trigger {
547
- display: inline-flex;
548
- align-items: center;
549
- gap: 8px;
550
- padding: 8px 12px;
551
- font-family: var(--lsg-font-family-primary);
552
- font-size: 14px;
553
- font-weight: 500;
554
- color: var(--lsg-color-secondary);
555
- background: none;
556
- border: 1px solid color-mix(in srgb, var(--lsg-color-secondary) 18%, var(--lsg-color-white));
557
- border-radius: var(--lsg-radius-rounded);
558
- cursor: pointer;
559
- transition: border-color 0.15s ease, color 0.15s ease;
560
- }
561
- .lsg-lang-switcher__trigger:hover, .lsg-lang-switcher__trigger:focus-visible {
562
- border-color: var(--lsg-color-primary);
563
- color: var(--lsg-color-primary);
564
- outline: none;
565
- }
566
- .lsg-lang-switcher__trigger:focus-visible {
567
- outline: 2px solid var(--lsg-color-primary);
568
- outline-offset: 2px;
569
- }
570
- .lsg-lang-switcher__trigger svg {
571
- width: 12px;
572
- height: 12px;
573
- flex-shrink: 0;
574
- }
575
- .lsg-lang-switcher__trigger > svg:last-child {
576
- transition: transform 0.2s ease;
577
- }
578
- .lsg-lang-switcher__trigger[aria-expanded=true] > svg:last-child {
579
- transform: rotate(180deg);
580
- }
581
- .lsg-lang-switcher__globe {
582
- width: 24px;
583
- height: 24px;
584
- fill: currentColor;
585
- }
586
- .lsg-lang-switcher__current {
587
- line-height: 1;
588
- }
589
- .lsg-lang-switcher__dropdown {
590
- position: absolute;
591
- top: calc(100% + 4px);
592
- right: 0;
593
- min-width: 140px;
594
- background: var(--lsg-color-light);
595
- border: 1px solid color-mix(in srgb, var(--lsg-color-secondary) 18%, var(--lsg-color-white));
596
- border-radius: var(--lsg-radius-rounded);
597
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
598
- list-style: none;
599
- padding: 8px 0;
600
- margin: 0;
601
- z-index: 100;
602
- }
603
- .lsg-lang-switcher__option-link {
604
- display: block;
605
- padding: 8px 12px;
606
- font-size: 14px;
607
- color: var(--lsg-color-secondary);
608
- text-decoration: none;
609
- transition: background-color 0.1s ease, color 0.1s ease;
610
- }
611
- .lsg-lang-switcher__option-link:hover, .lsg-lang-switcher__option-link:focus-visible {
612
- background-color: color-mix(in srgb, var(--lsg-color-light) 70%, var(--lsg-color-white));
613
- color: var(--lsg-color-primary);
614
- outline: none;
615
- }
616
- .lsg-lang-switcher__option-link--active {
617
- font-weight: 600;
618
- color: var(--lsg-color-primary);
619
- }
620
-
621
- .lsg-search-trigger {
622
- display: inline-flex;
623
- align-items: center;
624
- justify-content: center;
625
- width: 40px;
626
- height: 40px;
627
- background: none;
628
- border: none;
629
- border-radius: 50%;
630
- cursor: pointer;
631
- color: var(--lsg-color-secondary);
632
- transition: background-color 0.15s ease, color 0.15s ease;
633
- }
634
- .lsg-search-trigger:hover, .lsg-search-trigger:focus-visible {
635
- background-color: color-mix(in srgb, var(--lsg-color-light) 70%, var(--lsg-color-white));
636
- color: var(--lsg-color-primary);
637
- }
638
- .lsg-search-trigger:focus-visible {
639
- outline: 2px solid var(--lsg-color-primary);
640
- outline-offset: 2px;
641
- }
642
- .lsg-search-trigger svg {
643
- width: 20px;
644
- height: 20px;
645
- pointer-events: none;
646
- }
647
-
648
- .lsg-search-overlay {
649
- font-family: var(--lsg-font-family-primary);
650
- position: fixed;
651
- inset: 0;
652
- z-index: 200;
653
- display: flex;
654
- align-items: flex-start;
655
- justify-content: center;
656
- padding-top: 80px;
657
- background-color: rgba(0, 0, 0, 0.55);
658
- opacity: 0;
659
- visibility: hidden;
660
- transition: opacity 0.2s ease, visibility 0.2s ease;
661
- }
662
- .lsg-search-overlay--open {
663
- opacity: 1;
664
- visibility: visible;
665
- }
666
- .lsg-search-overlay__panel {
667
- width: 100%;
668
- max-width: 640px;
669
- margin: 0 24px;
670
- background: var(--lsg-color-white);
671
- border-radius: var(--lsg-radius-rounded);
672
- padding: 24px;
673
- box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
674
- }
675
- .lsg-search-overlay__form {
676
- display: flex;
677
- align-items: center;
678
- gap: 12px;
679
- border-bottom: 2px solid var(--lsg-color-primary);
680
- padding-bottom: 12px;
681
- }
682
- .lsg-search-overlay__input {
683
- flex: 1;
684
- border: none;
685
- font-size: var(--lsg-size-body);
686
- font-family: var(--lsg-font-family-primary);
687
- color: var(--lsg-color-dark);
688
- background: transparent;
689
- }
690
- .lsg-search-overlay__input:focus {
691
- outline: none;
692
- }
693
- .lsg-search-overlay__input::placeholder {
694
- color: color-mix(in srgb, var(--lsg-color-secondary) 45%, var(--lsg-color-white));
695
- }
696
- .lsg-search-overlay__submit {
697
- display: inline-flex;
698
- align-items: center;
699
- justify-content: center;
700
- background: none;
701
- border: none;
702
- cursor: pointer;
703
- color: var(--lsg-color-primary);
704
- padding: 8px;
705
- }
706
- .lsg-search-overlay__submit:focus-visible {
707
- outline: 2px solid var(--lsg-color-primary);
708
- outline-offset: 2px;
709
- border-radius: var(--lsg-radius-rounded);
710
- }
711
- .lsg-search-overlay__submit svg {
712
- width: 20px;
713
- height: 20px;
714
- }
715
- .lsg-search-overlay__close {
716
- display: inline-flex;
717
- align-items: center;
718
- justify-content: center;
719
- width: 32px;
720
- height: 32px;
721
- background: none;
722
- border: none;
723
- cursor: pointer;
724
- color: color-mix(in srgb, var(--lsg-color-secondary) 60%, var(--lsg-color-white));
725
- border-radius: 50%;
726
- transition: background-color 0.15s ease, color 0.15s ease;
727
- flex-shrink: 0;
728
- }
729
- .lsg-search-overlay__close:hover {
730
- background-color: color-mix(in srgb, var(--lsg-color-light) 70%, var(--lsg-color-white));
731
- color: var(--lsg-color-dark);
732
- }
733
- .lsg-search-overlay__close:focus-visible {
734
- outline: 2px solid var(--lsg-color-primary);
735
- outline-offset: 2px;
736
- }
737
- .lsg-search-overlay__close svg {
738
- width: 16px;
739
- height: 16px;
740
- }
741
-
742
- @keyframes lsg-header-panel-in {
743
- from {
744
- opacity: 0;
745
- transform: translateY(-6px);
746
- }
747
- to {
748
- opacity: 1;
749
- transform: translateY(0);
750
- }
751
- }
752
- .lsg-header {
753
- --lsg-header-green: var(--lsg-color-primary);
754
- --lsg-header-active: color-mix(in srgb, var(--lsg-color-primary) 11%, var(--lsg-color-white));
755
- --lsg-header-divider: rgba(255, 255, 255, 0.2);
756
- --lsg-header-text: var(--lsg-color-black);
757
- position: sticky;
758
- top: 0;
759
- z-index: 100;
760
- width: 100%;
761
- background: var(--lsg-color-white);
762
- color: var(--lsg-header-text);
763
- font-family: var(--lsg-font-family-primary);
764
- }
765
- .lsg-header__inner {
766
- box-sizing: border-box;
767
- display: flex;
768
- align-items: center;
769
- gap: 20px;
770
- width: min(100%, 1320px);
771
- height: 98px;
772
- margin: 0 auto;
773
- padding: 0 clamp(48px, 13.9vw, 200px);
774
- background: var(--lsg-color-white);
775
- }
776
- .lsg-header .lsg-logo-decorator {
777
- display: flex;
778
- flex: 0 0 auto;
779
- align-items: center;
780
- min-width: 170px;
781
- }
782
- .lsg-header .lsg-logo {
783
- min-width: 136px;
784
- min-height: 28px;
785
- }
786
- .lsg-header .lsg-logo__image {
787
- width: 136px;
788
- height: auto;
789
- max-width: 136px;
790
- }
791
- .lsg-header .lsg-logo__text {
792
- display: inline-flex;
793
- align-items: center;
794
- min-width: 136px;
795
- min-height: 28px;
796
- padding: 0 12px;
797
- background: linear-gradient(45deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%), linear-gradient(-45deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.04) 75%), linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.04) 75%);
798
- background-color: var(--lsg-color-white);
799
- background-position: 0 0, 0 6px, 6px -6px, -6px 0;
800
- background-size: 12px 12px;
801
- color: transparent;
802
- }
803
- .lsg-header__nav {
804
- display: flex;
805
- flex: 1 1 auto;
806
- justify-content: flex-end;
807
- min-width: 0;
808
- }
809
- .lsg-header__desktop-actions, .lsg-header__desktop-menu, .lsg-header__actions, .lsg-header__mobile-actions {
810
- display: flex;
811
- align-items: center;
812
- gap: 12px;
813
- }
814
- .lsg-header__desktop-actions {
815
- flex: 0 0 auto;
816
- }
817
- .lsg-header__desktop-menu {
818
- flex: 1 1 auto;
819
- justify-content: flex-end;
820
- }
821
- .lsg-header__mobile-actions {
822
- display: none;
823
- margin-left: auto;
824
- }
825
- .lsg-header__icon {
826
- display: block;
827
- width: 14px;
828
- height: 14px;
829
- fill: currentColor;
830
- }
831
- .lsg-header__icon svg {
832
- display: block;
833
- width: 100%;
834
- height: 100%;
835
- fill: currentColor;
836
- }
837
- .lsg-header__icon--search {
838
- width: 20px;
839
- height: 20px;
840
- }
841
- .lsg-header__icon-button, .lsg-header__menu-trigger {
842
- display: inline-flex;
843
- align-items: center;
844
- justify-content: center;
845
- padding: 0;
846
- color: var(--lsg-header-text);
847
- background: transparent;
848
- border: 0;
849
- border-radius: 0;
850
- cursor: pointer;
851
- text-decoration: none;
852
- transition: color 0.24s ease, outline-color 0.24s ease;
853
- }
854
- .lsg-header__icon-button:hover, .lsg-header__icon-button:focus-visible, .lsg-header__menu-trigger:hover, .lsg-header__menu-trigger:focus-visible {
855
- color: var(--lsg-header-green);
856
- outline: none;
857
- }
858
- .lsg-header__icon-button:focus-visible, .lsg-header__menu-trigger:focus-visible {
859
- outline: 1px solid var(--lsg-header-green);
860
- outline-offset: 3px;
861
- }
862
- .lsg-header__icon-button {
863
- width: 20px;
864
- height: 20px;
865
- }
866
- .lsg-header__icon-button .lsg-header__icon {
867
- width: 20px;
868
- height: 20px;
869
- }
870
- .lsg-header .lsg-lang-switcher__trigger {
871
- min-height: 20px;
872
- padding: 0;
873
- border: 0;
874
- color: var(--lsg-header-text);
875
- }
876
- .lsg-header .lsg-lang-switcher__globe {
877
- width: 24px;
878
- height: 24px;
879
- }
880
- .lsg-header .lsg-lang-switcher__current {
881
- font-size: 14px;
882
- }
883
- .lsg-header__menu-trigger {
884
- gap: 4px;
885
- min-height: 20px;
886
- font-size: 16px;
887
- line-height: 1;
888
- text-transform: uppercase;
889
- }
890
- .lsg-header__menu-trigger .lsg-header__icon {
891
- width: 20px;
892
- height: 14px;
893
- }
894
- .lsg-header__separator {
895
- display: inline-flex;
896
- align-items: center;
897
- justify-content: center;
898
- height: 18px;
899
- color: var(--lsg-header-text);
900
- font-size: 18px;
901
- line-height: 18px;
902
- opacity: 0.62;
903
- }
904
- .lsg-header__mega-panel {
905
- box-sizing: border-box;
906
- display: none;
907
- width: min(100%, 1320px);
908
- min-height: 330px;
909
- margin: 0 auto;
910
- padding: 44px clamp(48px, 13.9vw, 200px);
911
- background: var(--lsg-color-white);
912
- border-top: 1px solid transparent;
913
- animation: lsg-header-panel-in 0.24s ease both;
914
- }
915
- .lsg-header--menu-open > .lsg-header__mega-panel {
916
- display: block;
917
- }
918
- .lsg-header__mega-inner {
919
- display: flex;
920
- align-items: flex-start;
921
- gap: 0;
922
- }
923
- .lsg-header__mega-column {
924
- position: relative;
925
- width: 229px;
926
- min-height: 212px;
927
- padding: 0 20px 0 0;
928
- margin: 0;
929
- list-style: none;
930
- border-right: 1px solid rgba(0, 0, 0, 0.12);
931
- }
932
- .lsg-header__mega-column + .lsg-header__mega-column {
933
- padding-left: 20px;
934
- }
935
- .lsg-header__mega-column:last-child {
936
- border-right: 0;
937
- }
938
- .lsg-header__mega-column .lsg-header__mega-column {
939
- position: absolute;
940
- top: 0;
941
- left: 100%;
942
- display: none;
943
- padding-left: 20px;
944
- }
945
- .lsg-header__mega-column .lsg-header__mega-column--open {
946
- display: block;
947
- }
948
- .lsg-header__mega-item {
949
- margin: 0 0 4px;
950
- }
951
- .lsg-header__mega-item--open > .lsg-header__mega-link, .lsg-header__mega-item:hover > .lsg-header__mega-link, .lsg-header__mega-item:focus-within > .lsg-header__mega-link {
952
- color: var(--lsg-color-white);
953
- background: var(--lsg-color-primary);
954
- font-weight: 600;
955
- outline: none;
956
- }
957
- .lsg-header__mega-link {
958
- display: flex;
959
- align-items: center;
960
- justify-content: space-between;
961
- gap: 12px;
962
- min-height: 35px;
963
- padding: 6px 10px;
964
- font-size: 16px;
965
- font-weight: 400;
966
- line-height: 1.5;
967
- color: var(--lsg-color-white);
968
- background: var(--lsg-color-primary);
969
- text-decoration: none;
970
- text-transform: uppercase;
971
- transition: font-weight 0.1s ease;
972
- }
973
- .lsg-header__mega-link:hover, .lsg-header__mega-link:focus-visible {
974
- color: var(--lsg-color-white);
975
- background: var(--lsg-color-primary);
976
- font-weight: 600;
977
- outline: none;
978
- }
979
- .lsg-header__mega-link .lsg-header__icon {
980
- width: 8px;
981
- height: 8px;
982
- flex: 0 0 auto;
983
- fill: var(--lsg-color-white);
984
- }
985
- .lsg-header__mega-column .lsg-header__mega-link {
986
- font-size: 14px;
987
- text-transform: none;
988
- }
989
- .lsg-header__mega-item--active > .lsg-header__mega-link {
990
- color: var(--lsg-color-white);
991
- background: var(--lsg-color-primary);
992
- font-weight: 600;
993
- }
994
- .lsg-header__mobile-panel {
995
- display: none;
996
- }
997
- .lsg-header--simple .lsg-header__inner, .lsg-header--dropdown .lsg-header__inner {
998
- justify-content: flex-start;
999
- }
1000
- .lsg-header--mega .lsg-header__inner {
1001
- justify-content: space-between;
1002
- }
1003
-
1004
- .lsg-header-decorator {
1005
- min-height: 100vh;
1006
- padding: 48px 0;
1007
- background: var(--lsg-color-white);
1008
- }
1009
- .lsg-header-decorator .lsg-header {
1010
- position: relative;
1011
- width: min(100% - 96px, 1320px);
1012
- margin: 0 auto;
1013
- }
1014
-
1015
- @media (max-width: 767px) {
1016
- .lsg-header {
1017
- position: relative;
1018
- width: 100%;
1019
- min-height: 82px;
1020
- }
1021
- .lsg-header__inner {
1022
- width: 100%;
1023
- height: 82px;
1024
- padding: 0 16px;
1025
- gap: 8px;
1026
- }
1027
- .lsg-header .lsg-logo-decorator {
1028
- min-width: 150px;
1029
- }
1030
- .lsg-header .lsg-logo {
1031
- width: 150px;
1032
- min-width: 150px;
1033
- min-height: 50px;
1034
- }
1035
- .lsg-header .lsg-logo__image {
1036
- width: 150px;
1037
- max-width: 150px;
1038
- max-height: 50px;
1039
- object-fit: contain;
1040
- }
1041
- .lsg-header .lsg-logo__text {
1042
- min-width: 150px;
1043
- min-height: 50px;
1044
- background-position: 0 0, 0 7px, 7px -7px, -7px 0;
1045
- background-size: 14px 14px;
1046
- }
1047
- .lsg-header__nav, .lsg-header__desktop-actions, .lsg-header__desktop-menu, .lsg-header__mega-panel {
1048
- display: none;
1049
- }
1050
- .lsg-header--menu-open > .lsg-header__mega-panel {
1051
- display: none;
1052
- }
1053
- .lsg-header__mobile-actions {
1054
- display: flex;
1055
- gap: 9px;
1056
- }
1057
- .lsg-header__icon-button {
1058
- width: 20px;
1059
- height: 20px;
1060
- }
1061
- .lsg-header .lsg-lang-switcher__trigger {
1062
- min-height: 18px;
1063
- }
1064
- .lsg-header .lsg-lang-switcher__globe {
1065
- width: 24px;
1066
- height: 24px;
1067
- }
1068
- .lsg-header__icon {
1069
- width: 14px;
1070
- height: 14px;
1071
- }
1072
- .lsg-header__icon--search {
1073
- width: 20px;
1074
- height: 20px;
1075
- }
1076
- .lsg-header__separator {
1077
- height: 24px;
1078
- font-size: 24px;
1079
- line-height: 24px;
1080
- }
1081
- .lsg-header__mobile-panel {
1082
- display: none;
1083
- min-height: calc(100vh - 82px);
1084
- padding: 10px 16px 48px;
1085
- background: var(--lsg-color-white);
1086
- animation: lsg-header-panel-in 0.24s ease both;
1087
- }
1088
- .lsg-header--menu-open > .lsg-header__mobile-panel {
1089
- display: block;
1090
- }
1091
- .lsg-header__mobile-panel .lsg-nav {
1092
- display: block;
1093
- }
1094
- .lsg-header__mobile-panel .lsg-nav__list, .lsg-header__mobile-panel .lsg-nav__dropdown {
1095
- display: flex;
1096
- flex-direction: column;
1097
- gap: 8px;
1098
- padding: 0;
1099
- margin: 0;
1100
- list-style: none;
1101
- }
1102
- .lsg-header__mobile-panel .lsg-nav__item {
1103
- display: block;
1104
- }
1105
- .lsg-header__mobile-panel .lsg-nav__link {
1106
- display: flex;
1107
- width: 100%;
1108
- min-height: 40px;
1109
- padding: 0 8px;
1110
- border-bottom: 0;
1111
- font-size: 14px;
1112
- text-transform: uppercase;
1113
- }
1114
- .lsg-header__mobile-panel .lsg-nav__link:hover, .lsg-header__mobile-panel .lsg-nav__link:focus-visible, .lsg-header__mobile-panel .lsg-nav__link--current {
1115
- color: var(--lsg-header-green);
1116
- background: var(--lsg-header-active);
1117
- }
1118
- .lsg-header__mobile-panel .lsg-nav__chevron {
1119
- width: 10px;
1120
- height: 5px;
1121
- }
1122
- .lsg-header__mobile-panel .lsg-nav__chevron svg {
1123
- width: 10px;
1124
- height: 5px;
1125
- }
1126
- .lsg-header__mobile-panel .lsg-nav--dropdown .lsg-nav__dropdown {
1127
- position: static;
1128
- width: auto;
1129
- padding: 0 0 0 16px;
1130
- box-shadow: none;
1131
- opacity: 1;
1132
- pointer-events: auto;
1133
- transform: none;
1134
- visibility: visible;
1135
- }
1136
- .lsg-header__mobile-panel .lsg-nav--dropdown .lsg-nav__dropdown::before, .lsg-header__mobile-panel .lsg-nav--dropdown .lsg-nav__dropdown::after {
1137
- content: none;
1138
- }
1139
- .lsg-header__mobile-panel .lsg-nav--dropdown .lsg-nav__item--has-children:not(.lsg-nav__item--open) > .lsg-nav__dropdown {
1140
- display: none;
1141
- }
1142
- .lsg-header__mobile-panel .lsg-header__mega-panel {
1143
- display: block;
1144
- width: auto;
1145
- min-height: 0;
1146
- padding: 0;
1147
- animation: none;
1148
- }
1149
- .lsg-header__mobile-panel .lsg-header__mega-inner,
1150
- .lsg-header__mobile-panel .lsg-header__mega-column {
1151
- display: flex;
1152
- flex-direction: column;
1153
- width: auto;
1154
- min-height: 0;
1155
- padding: 0;
1156
- border-right: 0;
1157
- }
1158
- .lsg-header__mobile-panel .lsg-header__mega-link {
1159
- min-height: 40px;
1160
- font-size: 14px;
1161
- padding: 6px 10px;
1162
- background: var(--lsg-color-primary);
1163
- color: var(--lsg-color-white);
1164
- text-transform: uppercase;
1165
- }
1166
- .lsg-header__mega-column .lsg-header__mobile-panel .lsg-header__mega-link {
1167
- font-size: 14px;
1168
- text-transform: none;
1169
- }
1170
- .lsg-header__breadcrumb {
1171
- display: flex;
1172
- align-items: center;
1173
- gap: 7px;
1174
- min-height: 35px;
1175
- margin: -2px -16px 18px;
1176
- padding: 0 16px;
1177
- font-size: 14px;
1178
- color: var(--lsg-header-text);
1179
- border-bottom: 1px solid transparent;
1180
- }
1181
- .lsg-header__breadcrumb .lsg-header__icon {
1182
- width: 8px;
1183
- height: 5px;
1184
- flex: 0 0 auto;
1185
- }
1186
- .lsg-header__breadcrumb-home {
1187
- display: inline-flex;
1188
- align-items: center;
1189
- justify-content: center;
1190
- padding: 0;
1191
- color: var(--lsg-header-text);
1192
- background: transparent;
1193
- border: 0;
1194
- cursor: pointer;
1195
- transition: color 0.24s ease;
1196
- }
1197
- .lsg-header__breadcrumb-home .lsg-header__icon {
1198
- width: 18px;
1199
- height: 16px;
1200
- }
1201
- .lsg-header__breadcrumb-ancestor, .lsg-header__breadcrumb-current {
1202
- min-width: 0;
1203
- padding: 0;
1204
- overflow: hidden;
1205
- color: inherit;
1206
- font: inherit;
1207
- text-overflow: ellipsis;
1208
- white-space: nowrap;
1209
- background: transparent;
1210
- border: 0;
1211
- cursor: pointer;
1212
- transition: color 0.24s ease, border-color 0.24s ease;
1213
- }
1214
- .lsg-header__breadcrumb-ancestor {
1215
- max-width: 80px;
1216
- }
1217
- .lsg-header__breadcrumb-ancestor--ellipsis {
1218
- flex: 0 0 auto;
1219
- width: 1em;
1220
- max-width: 1em;
1221
- text-align: center;
1222
- text-overflow: clip;
1223
- }
1224
- .lsg-header__breadcrumb-current {
1225
- max-width: 170px;
1226
- padding: 0 0 5px;
1227
- color: var(--lsg-header-green);
1228
- border-bottom: 2px solid var(--lsg-header-green);
1229
- }
1230
- .lsg-header__breadcrumb-home:hover, .lsg-header__breadcrumb-home:focus-visible, .lsg-header__breadcrumb-ancestor:hover, .lsg-header__breadcrumb-ancestor:focus-visible, .lsg-header__breadcrumb-current:hover, .lsg-header__breadcrumb-current:focus-visible {
1231
- color: var(--lsg-header-green);
1232
- outline: none;
1233
- }
1234
- .lsg-header__mobile-list {
1235
- display: flex;
1236
- flex-direction: column;
1237
- gap: 8px;
1238
- padding: 0;
1239
- margin: 0;
1240
- list-style: none;
1241
- }
1242
- .lsg-header__mobile-link {
1243
- display: flex;
1244
- align-items: center;
1245
- justify-content: space-between;
1246
- gap: 16px;
1247
- min-height: 40px;
1248
- padding: 0 8px;
1249
- font-size: 14px;
1250
- line-height: 1.4;
1251
- color: var(--lsg-header-text);
1252
- text-decoration: none;
1253
- transition: color 0.24s ease, background-color 0.24s ease;
1254
- }
1255
- .lsg-header__mobile-link .lsg-header__icon {
1256
- width: 10px;
1257
- height: 5px;
1258
- flex: 0 0 auto;
1259
- }
1260
- .lsg-header__mobile-link:hover, .lsg-header__mobile-link:focus-visible {
1261
- color: var(--lsg-header-green);
1262
- background: var(--lsg-header-active);
1263
- outline: none;
1264
- }
1265
- .lsg-header__mobile-item--active > .lsg-header__mobile-link {
1266
- color: var(--lsg-header-green);
1267
- background: var(--lsg-header-active);
1268
- font-weight: 600;
1269
- }
1270
- .lsg-header-decorator {
1271
- padding: 0;
1272
- }
1273
- .lsg-header-decorator .lsg-header {
1274
- width: 393px;
1275
- max-width: 100%;
1276
- margin: 0 auto;
1277
- }
1278
- }
1279
- .lsg-quick-links__heading {
1280
- font-size: 0.8125rem;
1281
- font-weight: 700;
1282
- letter-spacing: 0.08em;
1283
- text-transform: uppercase;
1284
- color: color-mix(in srgb, var(--lsg-color-secondary) 38%, var(--lsg-color-white));
1285
- margin: 0 0 16px;
1286
- }
1287
- .lsg-quick-links__list {
1288
- list-style: none;
1289
- padding: 0;
1290
- margin: 0;
1291
- display: flex;
1292
- flex-direction: column;
1293
- gap: 8px;
1294
- }
1295
- .lsg-quick-links__link {
1296
- font-size: 0.9375rem;
1297
- color: color-mix(in srgb, var(--lsg-color-secondary) 30%, var(--lsg-color-white));
1298
- text-decoration: none;
1299
- transition: color 0.15s ease;
1300
- }
1301
- .lsg-quick-links__link:hover, .lsg-quick-links__link:focus-visible {
1302
- color: var(--lsg-color-white);
1303
- outline: none;
1304
- }
1305
- .lsg-quick-links__link:focus-visible {
1306
- text-decoration: underline;
1307
- }
1308
-
1309
- .lsg-social-icons {
1310
- display: flex;
1311
- align-items: center;
1312
- gap: 12px;
1313
- list-style: none;
1314
- padding: 0;
1315
- margin: 0;
1316
- }
1317
- .lsg-social-icons__link {
1318
- display: inline-flex;
1319
- align-items: center;
1320
- justify-content: center;
1321
- width: 36px;
1322
- height: 36px;
1323
- color: color-mix(in srgb, var(--lsg-color-secondary) 38%, var(--lsg-color-white));
1324
- border-radius: 50%;
1325
- border: 1px solid color-mix(in srgb, var(--lsg-color-secondary) 52%, var(--lsg-color-white));
1326
- transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
1327
- }
1328
- .lsg-social-icons__link:hover, .lsg-social-icons__link:focus-visible {
1329
- color: var(--lsg-color-white);
1330
- border-color: var(--lsg-color-white);
1331
- background-color: rgba(255, 255, 255, 0.1);
1332
- }
1333
- .lsg-social-icons__link:focus-visible {
1334
- outline: 2px solid color-mix(in srgb, var(--lsg-color-primary) 35%, var(--lsg-color-white));
1335
- outline-offset: 2px;
1336
- }
1337
- .lsg-social-icons__link svg {
1338
- width: 16px;
1339
- height: 16px;
1340
- pointer-events: none;
1341
- fill: currentColor;
1342
- }
1343
-
1344
- .lsg-footer {
1345
- font-family: var(--lsg-font-family-primary);
1346
- background-color: #18181b;
1347
- color: #ffffff;
1348
- width: 100%;
1349
- }
1350
- .lsg-footer--simple .lsg-footer__simple-inner {
1351
- max-width: 1440px;
1352
- margin: 0 auto;
1353
- padding: 0 72px;
1354
- height: 80px;
1355
- display: flex;
1356
- align-items: center;
1357
- justify-content: space-between;
1358
- gap: 16px;
1359
- }
1360
- @media (max-width: 768px) {
1361
- .lsg-footer--simple .lsg-footer__simple-inner {
1362
- height: auto;
1363
- flex-direction: column-reverse;
1364
- align-items: flex-start;
1365
- padding: 36px 16px;
1366
- gap: 0;
1367
- }
1368
- }
1369
- .lsg-footer--simple .lsg-footer__simple-nav {
1370
- display: flex;
1371
- align-items: center;
1372
- gap: 0;
1373
- }
1374
- @media (max-width: 768px) {
1375
- .lsg-footer--simple .lsg-footer__simple-nav {
1376
- flex-direction: column;
1377
- align-items: flex-start;
1378
- width: 100%;
1379
- margin-bottom: 24px;
1380
- }
1381
- }
1382
- .lsg-footer--simple .lsg-footer__pipe {
1383
- color: #ffffff;
1384
- font-size: 0.875rem;
1385
- padding: 0 8px;
1386
- opacity: 0.5;
1387
- }
1388
- @media (max-width: 768px) {
1389
- .lsg-footer--simple .lsg-footer__pipe {
1390
- display: none;
1391
- }
1392
- }
1393
- .lsg-footer--simple .lsg-footer__mobile-divider {
1394
- display: none;
1395
- }
1396
- @media (max-width: 768px) {
1397
- .lsg-footer--simple .lsg-footer__mobile-divider {
1398
- display: block;
1399
- border: none;
1400
- border-top: 1px solid rgba(255, 255, 255, 0.2);
1401
- margin: 0;
1402
- width: 100%;
1403
- }
1404
- }
1405
- .lsg-footer--simple .lsg-footer__simple-nav-item {
1406
- color: #ffffff;
1407
- text-decoration: none;
1408
- font-size: 0.875rem;
1409
- height: 40px;
1410
- display: inline-flex;
1411
- align-items: center;
1412
- padding: 0 4px;
1413
- white-space: nowrap;
1414
- }
1415
- .lsg-footer--simple .lsg-footer__simple-nav-item:hover {
1416
- text-decoration: underline;
1417
- }
1418
- @media (max-width: 768px) {
1419
- .lsg-footer--simple .lsg-footer__simple-nav-item {
1420
- width: 100%;
1421
- padding: 0;
1422
- font-size: 0.9375rem;
1423
- }
1424
- }
1425
- .lsg-footer--complex .lsg-footer__complex-inner {
1426
- max-width: 1440px;
1427
- margin: 0 auto;
1428
- padding: 72px;
1429
- display: grid;
1430
- grid-template-columns: 200px 1fr;
1431
- gap: 72px;
1432
- }
1433
- @media (max-width: 768px) {
1434
- .lsg-footer--complex .lsg-footer__complex-inner {
1435
- grid-template-columns: 1fr;
1436
- gap: 36px;
1437
- padding: 36px 16px;
1438
- }
1439
- }
1440
- .lsg-footer--complex .lsg-footer__logo-col {
1441
- display: flex;
1442
- align-items: flex-start;
1443
- padding-top: 4px;
1444
- }
1445
- .lsg-footer--complex .lsg-footer__logo-col .lsg-logo__text {
1446
- color: #ffffff;
1447
- font-weight: 700;
1448
- }
1449
- .lsg-footer--complex .lsg-footer__logo-col .lsg-logo__image {
1450
- filter: brightness(0) invert(1);
1451
- }
1452
- @media (max-width: 768px) {
1453
- .lsg-footer--complex .lsg-footer__logo-col {
1454
- padding-top: 0;
1455
- }
1456
- }
1457
- .lsg-footer--complex .lsg-footer__content-cols {
1458
- display: grid;
1459
- grid-template-columns: 1fr 1fr;
1460
- gap: 72px;
1461
- }
1462
- @media (max-width: 768px) {
1463
- .lsg-footer--complex .lsg-footer__content-cols {
1464
- grid-template-columns: 1fr;
1465
- gap: 36px;
1466
- }
1467
- .lsg-footer--complex .lsg-footer__content-cols .lsg-footer__quicklinks-col {
1468
- order: 1;
1469
- }
1470
- .lsg-footer--complex .lsg-footer__content-cols .lsg-footer__contact-col {
1471
- order: 2;
1472
- }
1473
- }
1474
- .lsg-footer--complex .lsg-footer__col-heading {
1475
- font-size: 0.875rem;
1476
- font-weight: 600;
1477
- letter-spacing: 0.08em;
1478
- text-transform: uppercase;
1479
- color: #ffffff;
1480
- margin: 0 0 24px 0;
1481
- padding: 0;
1482
- line-height: 25px;
1483
- }
1484
- .lsg-footer--complex .lsg-footer__address {
1485
- display: flex;
1486
- gap: 12px;
1487
- align-items: flex-start;
1488
- margin-bottom: 16px;
1489
- }
1490
- .lsg-footer--complex .lsg-footer__address svg {
1491
- flex-shrink: 0;
1492
- margin-top: 3px;
1493
- color: #ffffff;
1494
- }
1495
- .lsg-footer--complex .lsg-footer__address p {
1496
- margin: 0;
1497
- font-size: 0.875rem;
1498
- line-height: 1.6;
1499
- color: #ffffff;
1500
- white-space: pre-line;
1501
- }
1502
- .lsg-footer--complex .lsg-footer__divider {
1503
- border: none;
1504
- border-top: 1px solid rgba(255, 255, 255, 0.2);
1505
- margin: 16px 0;
1506
- }
1507
- .lsg-footer--complex .lsg-footer__contact-items {
1508
- display: flex;
1509
- flex-direction: column;
1510
- gap: 12px;
1511
- }
1512
- .lsg-footer--complex .lsg-footer__contact-item {
1513
- display: flex;
1514
- align-items: center;
1515
- gap: 12px;
1516
- font-size: 0.875rem;
1517
- color: #ffffff;
1518
- height: 24px;
1519
- }
1520
- .lsg-footer--complex .lsg-footer__contact-item svg {
1521
- flex-shrink: 0;
1522
- color: #ffffff;
1523
- }
1524
- .lsg-footer--complex .lsg-footer__contact-item span,
1525
- .lsg-footer--complex .lsg-footer__contact-item a {
1526
- color: #ffffff;
1527
- text-decoration: none;
1528
- line-height: 24px;
1529
- }
1530
- .lsg-footer--complex .lsg-footer__contact-item a:hover {
1531
- text-decoration: underline;
1532
- }
1533
- .lsg-footer--complex .lsg-footer__quicklinks-list {
1534
- list-style: none;
1535
- margin: 0;
1536
- padding: 0;
1537
- }
1538
- .lsg-footer--complex .lsg-footer__quicklink-item:last-child .lsg-footer__divider {
1539
- display: none;
1540
- }
1541
- .lsg-footer--complex .lsg-footer__quicklink {
1542
- display: block;
1543
- color: #ffffff;
1544
- text-decoration: none;
1545
- font-size: 0.875rem;
1546
- line-height: 24px;
1547
- height: 24px;
1548
- }
1549
- .lsg-footer--complex .lsg-footer__quicklink:hover {
1550
- text-decoration: underline;
1551
- }
1552
- .lsg-footer--complex .lsg-footer__bottom-divider {
1553
- border: none;
1554
- border-top: 1px solid rgba(255, 255, 255, 0.2);
1555
- margin: 0;
1556
- }
1557
- .lsg-footer--complex .lsg-footer__bottom {
1558
- max-width: 1440px;
1559
- margin: 0 auto;
1560
- padding: 16px 72px;
1561
- }
1562
- @media (max-width: 768px) {
1563
- .lsg-footer--complex .lsg-footer__bottom {
1564
- padding: 16px;
1565
- }
1566
- }
1567
- .lsg-footer__copyright {
1568
- font-size: 0.875rem;
1569
- line-height: 29px;
1570
- color: #ffffff;
1571
- margin: 0;
1572
- }
1573
-
1574
- .cmp-container {
1575
- width: 100%;
1576
- }
1577
-
1578
- .layout-container-color-wrapper {
1579
- width: 100%;
1580
- }
1581
-
1582
- .layout-container-spacing-wrapper {
1583
- width: 100%;
1584
- box-sizing: border-box;
1585
- }
1586
-
1587
- .layout-container--full-width > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1588
- max-width: var(--lsg-container-width-full);
1589
- padding: 0 var(--lsg-spacing-size-SM);
1590
- }
1591
-
1592
- .layout-container--medium > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1593
- max-width: var(--lsg-container-width-medium);
1594
- margin-inline: auto;
1595
- padding-inline: 24px;
1596
- }
1597
-
1598
- .layout-container--narrow > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1599
- max-width: var(--lsg-container-width-narrow);
1600
- margin-inline: auto;
1601
- padding-inline: 24px;
1602
- }
1603
-
1604
- .layout-container--top-padding-0 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1605
- padding-top: 0;
1606
- }
1607
-
1608
- .layout-container--top-padding-4 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1609
- padding-top: var(--lsg-spacing-size-2XS);
1610
- }
1611
-
1612
- .layout-container--top-padding-8 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1613
- padding-top: var(--lsg-spacing-size-XS);
1614
- }
1615
-
1616
- .layout-container--top-padding-16 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1617
- padding-top: var(--lsg-spacing-size-SM);
1618
- }
1619
-
1620
- .layout-container--top-padding-24 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1621
- padding-top: var(--lsg-spacing-size-MD);
1622
- }
1623
-
1624
- .layout-container--top-padding-32 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1625
- padding-top: var(--lsg-spacing-size-LG);
1626
- }
1627
-
1628
- .layout-container--top-padding-64 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1629
- padding-top: var(--lsg-spacing-size-XL);
1630
- }
1631
-
1632
- .layout-container--top-padding-96 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1633
- padding-top: var(--lsg-spacing-size-2XL);
1634
- }
1635
-
1636
- .layout-container--top-padding-128 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1637
- padding-top: var(--lsg-spacing-size-3XL);
1638
- }
1639
-
1640
- .layout-container--bottom-padding-0 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1641
- padding-bottom: 0;
1642
- }
1643
-
1644
- .layout-container--bottom-padding-4 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1645
- padding-bottom: var(--lsg-spacing-size-2XS);
1646
- }
1647
-
1648
- .layout-container--bottom-padding-8 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1649
- padding-bottom: var(--lsg-spacing-size-XS);
1650
- }
1651
-
1652
- .layout-container--bottom-padding-16 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1653
- padding-bottom: var(--lsg-spacing-size-SM);
1654
- }
1655
-
1656
- .layout-container--bottom-padding-24 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1657
- padding-bottom: var(--lsg-spacing-size-MD);
1658
- }
1659
-
1660
- .layout-container--bottom-padding-32 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1661
- padding-bottom: var(--lsg-spacing-size-LG);
1662
- }
1663
-
1664
- .layout-container--bottom-padding-64 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1665
- padding-bottom: var(--lsg-spacing-size-XL);
1666
- }
1667
-
1668
- .layout-container--bottom-padding-96 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1669
- padding-bottom: var(--lsg-spacing-size-2XL);
1670
- }
1671
-
1672
- .layout-container--bottom-padding-128 > .layout-container-color-wrapper > .layout-container-spacing-wrapper {
1673
- padding-bottom: var(--lsg-spacing-size-3XL);
1674
- }
1675
-
1676
- .layout-container--vertical-alignment-top > .layout-container-color-wrapper {
1677
- display: flex;
1678
- flex-direction: column;
1679
- justify-content: flex-start;
1680
- }
1681
-
1682
- .layout-container--vertical-alignment-middle > .layout-container-color-wrapper {
1683
- display: flex;
1684
- flex-direction: column;
1685
- justify-content: center;
1686
- }
1687
-
1688
- .layout-container--background-color-white > .layout-container-color-wrapper {
1689
- background-color: var(--lsg-color-white);
1690
- color: var(--lsg-color-dark);
1691
- }
1692
-
1693
- .layout-container--background-color-light > .layout-container-color-wrapper {
1694
- background-color: var(--lsg-color-light);
1695
- color: var(--lsg-color-dark);
1696
- }
1697
-
1698
- .layout-container--background-color-primary > .layout-container-color-wrapper {
1699
- background-color: var(--lsg-color-primary);
1700
- color: var(--lsg-color-white);
1701
- }
1702
-
1703
- .layout-container--background-color-secondary > .layout-container-color-wrapper {
1704
- background-color: var(--lsg-color-secondary);
1705
- color: var(--lsg-color-white);
1706
- }
1707
-
1708
- .layout-container--background-color-tertiary > .layout-container-color-wrapper {
1709
- background-color: var(--lsg-color-tertiary);
1710
- color: var(--lsg-color-white);
1711
- }
1712
-
1713
- .layout-container--background-color-dark > .layout-container-color-wrapper {
1714
- background-color: var(--lsg-color-dark);
1715
- color: var(--lsg-color-white);
1716
- }
1717
-
1718
- .layout-container--background-color-black > .layout-container-color-wrapper {
1719
- background-color: var(--lsg-color-black);
1720
- color: var(--lsg-color-white);
1721
- }
1722
-
1723
- .lsg-ai-banner {
1724
- width: 100%;
1725
- background-color: var(--lsg-ai-banner-bg);
1726
- }
1727
- .lsg-ai-banner__inner {
1728
- display: flex;
1729
- align-items: center;
1730
- justify-content: center;
1731
- max-width: var(--lsg-ai-banner-max-width);
1732
- margin: 0 auto;
1733
- padding: 0 24px;
1734
- height: var(--lsg-ai-banner-height);
1735
- }
1736
- .lsg-ai-banner__content {
1737
- display: flex;
1738
- align-items: center;
1739
- justify-content: center;
1740
- gap: var(--lsg-ai-banner-gap);
1741
- min-width: 0;
1742
- }
1743
- @media (min-width: 768px) {
1744
- .lsg-ai-banner__content {
1745
- transform: translateX(25vw);
1746
- }
1747
- }
1748
- .lsg-ai-banner__icon {
1749
- display: flex;
1750
- align-items: center;
1751
- justify-content: center;
1752
- flex-shrink: 0;
1753
- color: var(--lsg-ai-banner-icon-color);
1754
- width: var(--lsg-ai-banner-icon-size);
1755
- height: var(--lsg-ai-banner-icon-size);
1756
- }
1757
- .lsg-ai-banner__icon-svg {
1758
- width: var(--lsg-ai-banner-icon-size);
1759
- height: var(--lsg-ai-banner-icon-size);
1760
- }
1761
- .lsg-ai-banner__text {
1762
- font-size: var(--lsg-ai-banner-font-size);
1763
- line-height: 1.35;
1764
- color: var(--lsg-ai-banner-text-color);
1765
- margin: 0;
1766
- text-align: center;
1767
- }
1768
- .lsg-ai-banner__text strong {
1769
- font-weight: inherit;
1770
- }
1771
-
1772
- .lsg-accordion {
1773
- font-family: var(--lsg-font-family-primary);
1774
- width: 100%;
1775
- max-width: var(--lsg-accordion-max-width);
1776
- }
1777
- .lsg-accordion--bordered {
1778
- border: 1px solid var(--lsg-accordion-divider-color);
1779
- border-radius: var(--lsg-accordion-border-radius);
1780
- overflow: hidden;
1781
- }
1782
- .lsg-accordion--bordered .lsg-accordion__item:first-child {
1783
- border-top: none;
1784
- }
1785
- .lsg-accordion__item {
1786
- border-top: 1px solid var(--lsg-accordion-divider-color);
1787
- }
1788
- .lsg-accordion__item--open > .lsg-accordion__header {
1789
- color: var(--lsg-accordion-active-color);
1790
- }
1791
- .lsg-accordion__header {
1792
- width: 100%;
1793
- min-height: var(--lsg-accordion-header-height);
1794
- display: flex;
1795
- align-items: center;
1796
- justify-content: space-between;
1797
- gap: 16px;
1798
- padding: var(--lsg-accordion-header-padding-y) 0;
1799
- background: none;
1800
- border: none;
1801
- cursor: pointer;
1802
- text-align: left;
1803
- color: var(--lsg-accordion-title-color);
1804
- font-family: var(--lsg-font-family-primary, inherit);
1805
- transition: color 200ms ease, border-color 200ms ease;
1806
- }
1807
- .lsg-accordion__header:hover {
1808
- color: var(--lsg-accordion-active-color);
1809
- }
1810
- .lsg-accordion__header:focus-visible {
1811
- outline: 2px solid var(--lsg-accordion-active-color);
1812
- outline-offset: -2px;
1813
- }
1814
- .lsg-accordion__title {
1815
- font-size: var(--lsg-accordion-title-font-size);
1816
- font-weight: var(--lsg-font-weight-semibold, 600);
1817
- line-height: 1.4;
1818
- flex: 1;
1819
- padding-left: calc(var(--lsg-accordion-icon-size) + var(--lsg-accordion-icon-gap));
1820
- }
1821
- .lsg-accordion__icon {
1822
- order: -1;
1823
- flex-shrink: 0;
1824
- display: flex;
1825
- align-items: center;
1826
- justify-content: center;
1827
- color: var(--lsg-accordion-icon-color);
1828
- transition: transform var(--lsg-accordion-transition), color 200ms ease;
1829
- }
1830
- .lsg-accordion__icon--open {
1831
- color: var(--lsg-accordion-active-color);
1832
- }
1833
- .lsg-accordion--icon-chevron .lsg-accordion__icon--open {
1834
- transform: rotate(180deg);
1835
- }
1836
- .lsg-accordion__icon--open .lsg-accordion__icon-plus-line {
1837
- display: none;
1838
- }
1839
- .lsg-accordion__icon-svg {
1840
- width: var(--lsg-accordion-icon-size);
1841
- height: var(--lsg-accordion-icon-size);
1842
- }
1843
- .lsg-accordion__panel {
1844
- overflow: hidden;
1845
- max-height: 0;
1846
- opacity: 0;
1847
- transition: max-height var(--lsg-accordion-transition), opacity var(--lsg-accordion-transition);
1848
- }
1849
- .lsg-accordion__panel--open {
1850
- max-height: 4000px;
1851
- opacity: 1;
1852
- padding-bottom: var(--lsg-accordion-content-padding-bottom);
1853
- }
1854
- .lsg-accordion__content {
1855
- margin-left: calc(var(--lsg-accordion-icon-size) / 2);
1856
- padding: 0 0 0 var(--lsg-accordion-content-indent);
1857
- border-left: var(--lsg-accordion-content-border-width) solid var(--lsg-accordion-active-color);
1858
- font-size: var(--lsg-accordion-content-font-size);
1859
- line-height: var(--lsg-accordion-content-line-height);
1860
- color: var(--lsg-accordion-content-color);
1861
- }
1862
- .lsg-accordion__content p {
1863
- margin: 0 0 12px;
1864
- }
1865
- .lsg-accordion__content p:last-child {
1866
- margin-bottom: 0;
1867
- }
1868
- .lsg-accordion__content ul, .lsg-accordion__content ol {
1869
- margin: 0 0 12px 24px;
1870
- padding: 0;
1871
- }
1872
- .lsg-accordion__content a {
1873
- color: var(--lsg-accordion-active-color);
1874
- }
1875
- .lsg-accordion__content img {
1876
- max-width: 100%;
1877
- height: auto;
1878
- }
1879
- .lsg-accordion--faq .lsg-accordion__title {
1880
- font-size: var(--lsg-accordion-faq-title-font-size);
1881
- }
1882
- .lsg-accordion--faq .lsg-accordion__content {
1883
- font-size: var(--lsg-accordion-faq-content-font-size);
1884
- }
1885
- @media (min-width: 768px) {
1886
- .lsg-accordion__header {
1887
- min-height: var(--lsg-accordion-header-height);
1888
- }
1889
- .lsg-accordion__title {
1890
- padding-left: var(--lsg-accordion-icon-gap);
1891
- }
1892
- }
1893
-
1894
- .lsg-visually-hidden {
1895
- position: absolute;
1896
- width: 1px;
1897
- height: 1px;
1898
- padding: 0;
1899
- margin: -1px;
1900
- overflow: hidden;
1901
- clip: rect(0, 0, 0, 0);
1902
- white-space: nowrap;
1903
- border: 0;
1904
- }
1905
-
1906
- .lsg-themed-component {
1907
- display: contents;
1908
- }
1909
-
1910
- .lsg-type-h1,
1911
- .cmp-lsg-title h1 {
1912
- font-family: var(--lsg-type-heading-family);
1913
- font-size: var(--lsg-type-h1-mobile-size);
1914
- font-weight: var(--lsg-font-weight-semibold);
1915
- line-height: var(--lsg-type-h1-mobile-line-height);
1916
- }
1917
- @media (min-width: 992px) {
1918
- .lsg-type-h1,
1919
- .cmp-lsg-title h1 {
1920
- font-size: var(--lsg-type-h1-desktop-size);
1921
- line-height: var(--lsg-type-h1-desktop-line-height);
1922
- }
1923
- }
1924
-
1925
- .lsg-type-h2,
1926
- .cmp-lsg-title h2 {
1927
- font-family: var(--lsg-type-heading-family);
1928
- font-size: var(--lsg-type-h2-mobile-size);
1929
- font-weight: var(--lsg-font-weight-semibold);
1930
- line-height: var(--lsg-type-h2-mobile-line-height);
1931
- }
1932
- @media (min-width: 992px) {
1933
- .lsg-type-h2,
1934
- .cmp-lsg-title h2 {
1935
- font-size: var(--lsg-type-h2-desktop-size);
1936
- line-height: var(--lsg-type-h2-desktop-line-height);
1937
- }
1938
- }
1939
-
1940
- .lsg-type-h3,
1941
- .cmp-lsg-title h3 {
1942
- font-family: var(--lsg-type-heading-family);
1943
- font-size: var(--lsg-type-h3-mobile-size);
1944
- font-weight: var(--lsg-font-weight-semibold);
1945
- line-height: var(--lsg-type-h3-mobile-line-height);
1946
- }
1947
- @media (min-width: 992px) {
1948
- .lsg-type-h3,
1949
- .cmp-lsg-title h3 {
1950
- font-size: var(--lsg-type-h3-desktop-size);
1951
- line-height: var(--lsg-type-h3-desktop-line-height);
1952
- }
1953
- }
1954
-
1955
- .lsg-type-h4,
1956
- .cmp-lsg-title h4 {
1957
- font-family: var(--lsg-type-heading-family);
1958
- font-size: var(--lsg-type-h4-mobile-size);
1959
- font-weight: var(--lsg-font-weight-semibold);
1960
- line-height: var(--lsg-type-h4-mobile-line-height);
1961
- }
1962
- @media (min-width: 992px) {
1963
- .lsg-type-h4,
1964
- .cmp-lsg-title h4 {
1965
- font-size: var(--lsg-type-h4-desktop-size);
1966
- line-height: var(--lsg-type-h4-desktop-line-height);
1967
- }
1968
- }
1969
-
1970
- .lsg-type-h5,
1971
- .cmp-lsg-title h5 {
1972
- font-family: var(--lsg-type-heading-family);
1973
- font-size: var(--lsg-type-h5-mobile-size);
1974
- font-weight: var(--lsg-font-weight-semibold);
1975
- line-height: var(--lsg-type-h5-mobile-line-height);
1976
- }
1977
- @media (min-width: 992px) {
1978
- .lsg-type-h5,
1979
- .cmp-lsg-title h5 {
1980
- font-size: var(--lsg-type-h5-desktop-size);
1981
- line-height: var(--lsg-type-h5-desktop-line-height);
1982
- }
1983
- }
1984
-
1985
- .lsg-type-h6,
1986
- .cmp-lsg-title h6 {
1987
- font-family: var(--lsg-type-heading-family);
1988
- font-size: var(--lsg-type-h6-mobile-size);
1989
- font-weight: var(--lsg-font-weight-semibold);
1990
- line-height: var(--lsg-type-h6-mobile-line-height);
1991
- }
1992
- @media (min-width: 992px) {
1993
- .lsg-type-h6,
1994
- .cmp-lsg-title h6 {
1995
- font-size: var(--lsg-type-h6-desktop-size);
1996
- line-height: var(--lsg-type-h6-desktop-line-height);
1997
- }
1998
- }
1999
-
2000
- .lsg-type-pretitle {
2001
- font-family: var(--lsg-type-body-family);
2002
- font-size: var(--lsg-type-pretitle-mobile-size);
2003
- font-weight: var(--lsg-font-weight-semibold);
2004
- line-height: var(--lsg-type-pretitle-mobile-line-height);
2005
- }
2006
- @media (min-width: 992px) {
2007
- .lsg-type-pretitle {
2008
- font-size: var(--lsg-type-pretitle-desktop-size);
2009
- line-height: var(--lsg-type-pretitle-desktop-line-height);
2010
- }
2011
- }
2012
-
2013
- .lsg-type-body,
2014
- .cmp-text,
2015
- .cmp-text p,
2016
- .cmp-text li {
2017
- font-family: var(--lsg-type-body-family);
2018
- font-size: var(--lsg-type-body-mobile-size);
2019
- font-weight: var(--lsg-font-weight-regular);
2020
- line-height: var(--lsg-type-body-mobile-line-height);
2021
- }
2022
- @media (min-width: 992px) {
2023
- .lsg-type-body,
2024
- .cmp-text,
2025
- .cmp-text p,
2026
- .cmp-text li {
2027
- font-size: var(--lsg-type-body-desktop-size);
2028
- line-height: var(--lsg-type-body-desktop-line-height);
2029
- }
2030
- }
2031
-
2032
- .lsg-type-large {
2033
- font-family: var(--lsg-type-heading-family);
2034
- font-size: var(--lsg-type-large-mobile-size);
2035
- font-weight: var(--lsg-font-weight-semibold);
2036
- line-height: var(--lsg-type-large-mobile-line-height);
2037
- }
2038
- @media (min-width: 992px) {
2039
- .lsg-type-large {
2040
- font-size: var(--lsg-type-large-desktop-size);
2041
- line-height: var(--lsg-type-large-desktop-line-height);
2042
- }
2043
- }
2044
-
2045
- .lsg-type-xlarge {
2046
- font-family: var(--lsg-type-heading-family);
2047
- font-size: var(--lsg-type-xlarge-mobile-size);
2048
- font-weight: var(--lsg-font-weight-semibold);
2049
- line-height: var(--lsg-type-xlarge-mobile-line-height);
2050
- }
2051
- @media (min-width: 992px) {
2052
- .lsg-type-xlarge {
2053
- font-size: var(--lsg-type-xlarge-desktop-size);
2054
- line-height: var(--lsg-type-xlarge-desktop-line-height);
2055
- }
2056
- }
2057
-
2058
- .lsg-type-xxlarge {
2059
- font-family: var(--lsg-type-heading-family);
2060
- font-size: var(--lsg-type-xxlarge-mobile-size);
2061
- font-weight: var(--lsg-font-weight-semibold);
2062
- line-height: var(--lsg-type-xxlarge-mobile-line-height);
2063
- }
2064
- @media (min-width: 992px) {
2065
- .lsg-type-xxlarge {
2066
- font-size: var(--lsg-type-xxlarge-desktop-size);
2067
- line-height: var(--lsg-type-xxlarge-desktop-line-height);
2068
- }
2069
- }
2070
-
2071
- .lsg-type-xxxlarge {
2072
- font-family: var(--lsg-type-heading-family);
2073
- font-size: var(--lsg-type-xxxlarge-mobile-size);
2074
- font-weight: var(--lsg-font-weight-semibold);
2075
- line-height: var(--lsg-type-xxxlarge-mobile-line-height);
2076
- }
2077
- @media (min-width: 992px) {
2078
- .lsg-type-xxxlarge {
2079
- font-size: var(--lsg-type-xxxlarge-desktop-size);
2080
- line-height: var(--lsg-type-xxxlarge-desktop-line-height);
2081
- }
2082
- }
2083
-
2084
- .cmp-lsg-title h1,
2085
- .cmp-lsg-title h2,
2086
- .cmp-lsg-title h3,
2087
- .cmp-lsg-title h4,
2088
- .cmp-lsg-title h5,
2089
- .cmp-lsg-title h6 {
2090
- margin: 0;
2091
- }
2092
-
2093
- .cmp-lsg-text p,
2094
- .cmp-lsg-text ul,
2095
- .cmp-lsg-text ol {
2096
- margin: 0;
2097
- }
2098
- .cmp-lsg-text p + p,
2099
- .cmp-lsg-text p + ul,
2100
- .cmp-lsg-text p + ol,
2101
- .cmp-lsg-text ul + p,
2102
- .cmp-lsg-text ol + p {
2103
- margin-top: 1em;
2104
- }
2105
-
2106
- /*# sourceMappingURL=lsg-clientlib.css.map */