@kommon-lab/tokens 0.1.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.
Files changed (21) hide show
  1. package/README.md +1 -0
  2. package/dist/.gitkeep +0 -0
  3. package/dist/css/beebs.css +231 -0
  4. package/dist/css/ekstract.css +231 -0
  5. package/dist/css/kiabi-home.css +231 -0
  6. package/dist/css/kiabi.css +231 -0
  7. package/dist/css/kitchoun.css +231 -0
  8. package/package.json +22 -0
  9. package/tokens/beebs_tokens.json +213 -0
  10. package/tokens/colors_primitives.json +445 -0
  11. package/tokens/desktop-typography_tokens.json +74 -0
  12. package/tokens/desktop_tokens.json +41 -0
  13. package/tokens/ekstract_tokens.json +213 -0
  14. package/tokens/kiabi-home_tokens.json +213 -0
  15. package/tokens/kiabi_tokens.json +213 -0
  16. package/tokens/kitchoun_tokens.json +213 -0
  17. package/tokens/measures_primitives.json +60 -0
  18. package/tokens/measures_tokens.json +42 -0
  19. package/tokens/mobile-typography_tokens.json +74 -0
  20. package/tokens/mobile_tokens.json +41 -0
  21. package/tokens/typography_tokens.json +140 -0
package/README.md ADDED
@@ -0,0 +1 @@
1
+ # Kommon Lab
package/dist/.gitkeep ADDED
File without changes
package/dist/css/beebs.css ADDED
@@ -0,0 +1,231 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --size-0: 0;
7
+ --size-25: 4;
8
+ --size-50: 8;
9
+ --size-75: 12;
10
+ --size-100: 16;
11
+ --size-125: 20;
12
+ --size-150: 24;
13
+ --size-175: 28;
14
+ --size-200: 32;
15
+ --size-225: 36;
16
+ --size-250: 40;
17
+ --size-275: 44;
18
+ --size-300: 48;
19
+ --size-325: 52;
20
+ --size-350: 56;
21
+ --size-375: 60;
22
+ --size-400: 64;
23
+ --size-425: 68;
24
+ --size-450: 72;
25
+ --size-475: 76;
26
+ --size-500: 80;
27
+ --size-xxxs: 20;
28
+ --size-xxs: 24;
29
+ --size-xs: 32;
30
+ --size-s: 36;
31
+ --size-m: 40;
32
+ --size-l: 48;
33
+ --size-xl: 56;
34
+ --size-xxl: 64;
35
+ --size-xxxl: 80;
36
+ --space-0: 0;
37
+ --space-12: 2;
38
+ --space-25: 4;
39
+ --space-50: 8;
40
+ --space-75: 12;
41
+ --space-100: 16;
42
+ --space-125: 20;
43
+ --space-150: 24;
44
+ --space-175: 28;
45
+ --space-200: 32;
46
+ --space-225: 36;
47
+ --space-250: 40;
48
+ --space-275: 44;
49
+ --space-300: 48;
50
+ --space-325: 52;
51
+ --space-350: 56;
52
+ --space-375: 60;
53
+ --space-400: 64;
54
+ --space-none: 0;
55
+ --space-xxxxs: 2;
56
+ --space-xxxs: 4;
57
+ --space-xxs: 8;
58
+ --space-xs: 12;
59
+ --space-s: 16;
60
+ --space-m: 20;
61
+ --space-l: 24;
62
+ --space-xl: 32;
63
+ --space-xxl: 40;
64
+ --space-xxxl: 48;
65
+ --space-xxxxl: 56;
66
+ --font-body-m-font-family: Figtree;
67
+ --font-body-m-font-size: 1rem;
68
+ --font-body-m-line-height: 140%;
69
+ --font-body-m-font-weight: 400;
70
+ --font-body-m-letter-spacing: 0;
71
+ --font-body-m-text-decoration: none;
72
+ --font-body-m-bold-font-family: Figtree;
73
+ --font-body-m-bold-font-size: 1rem;
74
+ --font-body-m-bold-line-height: 140%;
75
+ --font-body-m-bold-font-weight: 600;
76
+ --font-body-m-bold-letter-spacing: 0;
77
+ --font-body-m-bold-text-decoration: none;
78
+ --font-body-s-font-family: Figtree;
79
+ --font-body-s-font-size: 0.875rem;
80
+ --font-body-s-line-height: 140%;
81
+ --font-body-s-font-weight: 400;
82
+ --font-body-s-letter-spacing: 0;
83
+ --font-body-s-text-decoration: none;
84
+ --font-body-s-bold-font-family: Figtree;
85
+ --font-body-s-bold-font-size: 0.875rem;
86
+ --font-body-s-bold-line-height: 140%;
87
+ --font-body-s-bold-font-weight: 600;
88
+ --font-body-s-bold-letter-spacing: 0;
89
+ --font-body-s-bold-text-decoration: none;
90
+ --font-body-xs-font-family: Figtree;
91
+ --font-body-xs-font-size: 0.75rem;
92
+ --font-body-xs-line-height: 140%;
93
+ --font-body-xs-font-weight: 400;
94
+ --font-body-xs-letter-spacing: 0;
95
+ --font-body-xs-text-decoration: none;
96
+ --font-body-xs-bold-font-family: Figtree;
97
+ --font-body-xs-bold-font-size: 0.75rem;
98
+ --font-body-xs-bold-line-height: 140%;
99
+ --font-body-xs-bold-font-weight: 600;
100
+ --font-body-xs-bold-letter-spacing: 0;
101
+ --font-body-xs-bold-text-decoration: none;
102
+ --font-link-m-font-family: Figtree;
103
+ --font-link-m-font-size: 1rem;
104
+ --font-link-m-line-height: 140%;
105
+ --font-link-m-font-weight: 400;
106
+ --font-link-m-letter-spacing: 0;
107
+ --font-link-m-text-decoration: underline;
108
+ --font-link-m-bold-font-family: Figtree;
109
+ --font-link-m-bold-font-size: 1rem;
110
+ --font-link-m-bold-line-height: 140%;
111
+ --font-link-m-bold-font-weight: 600;
112
+ --font-link-m-bold-letter-spacing: 0;
113
+ --font-link-m-bold-text-decoration: underline;
114
+ --font-link-s-font-family: Figtree;
115
+ --font-link-s-font-size: 0.875rem;
116
+ --font-link-s-line-height: 140%;
117
+ --font-link-s-font-weight: 400;
118
+ --font-link-s-letter-spacing: 0;
119
+ --font-link-s-text-decoration: underline;
120
+ --font-link-s-bold-font-family: Figtree;
121
+ --font-link-s-bold-font-size: 0.875rem;
122
+ --font-link-s-bold-line-height: 140%;
123
+ --font-link-s-bold-font-weight: 600;
124
+ --font-link-s-bold-letter-spacing: 0;
125
+ --font-link-s-bold-text-decoration: underline;
126
+ --font-link-xs-font-family: Figtree;
127
+ --font-link-xs-font-size: 0.75rem;
128
+ --font-link-xs-line-height: 140%;
129
+ --font-link-xs-font-weight: 400;
130
+ --font-link-xs-letter-spacing: 0;
131
+ --font-link-xs-text-decoration: underline;
132
+ --font-link-xs-bold-font-family: Figtree;
133
+ --font-link-xs-bold-font-size: 0.75rem;
134
+ --font-link-xs-bold-line-height: 140%;
135
+ --font-link-xs-bold-font-weight: 600;
136
+ --font-link-xs-bold-letter-spacing: 0;
137
+ --font-link-xs-bold-text-decoration: underline;
138
+ --font-display-l-font-family: Really Sans Small;
139
+ --font-display-l-font-size: 3rem;
140
+ --font-display-l-line-height: 100%;
141
+ --font-display-l-font-weight: 600;
142
+ --font-display-l-letter-spacing: 0;
143
+ --font-display-l-text-decoration: none;
144
+ --font-display-m-font-family: Really Sans Small;
145
+ --font-display-m-font-size: 2.375rem;
146
+ --font-display-m-line-height: 100%;
147
+ --font-display-m-font-weight: 600;
148
+ --font-display-m-letter-spacing: 0;
149
+ --font-display-m-text-decoration: none;
150
+ --font-title-l-font-family: Really Sans Small;
151
+ --font-title-l-font-size: 2rem;
152
+ --font-title-l-line-height: 120%;
153
+ --font-title-l-font-weight: 700;
154
+ --font-title-l-letter-spacing: 0;
155
+ --font-title-l-text-decoration: none;
156
+ --font-title-m-font-family: Really Sans Small;
157
+ --font-title-m-font-size: 1.75rem;
158
+ --font-title-m-line-height: 120%;
159
+ --font-title-m-font-weight: 700;
160
+ --font-title-m-letter-spacing: 0;
161
+ --font-title-m-text-decoration: none;
162
+ --font-title-s-font-family: Really Sans Small;
163
+ --font-title-s-font-size: 1.5rem;
164
+ --font-title-s-line-height: 120%;
165
+ --font-title-s-font-weight: 700;
166
+ --font-title-s-letter-spacing: 0;
167
+ --font-title-s-text-decoration: none;
168
+ --font-title-xs-font-family: Really Sans Small;
169
+ --font-title-xs-font-size: 1.25rem;
170
+ --font-title-xs-line-height: 120%;
171
+ --font-title-xs-font-weight: 700;
172
+ --font-title-xs-letter-spacing: 0;
173
+ --font-title-xs-text-decoration: none;
174
+ --color-bg-brand: #717afd;
175
+ --color-bg-base: #ffffff;
176
+ --color-bg-alternate: #f4f4f4;
177
+ --color-fg-brand: #717afd;
178
+ --color-fg-neutral: #353535;
179
+ --color-fg-subtle: #737373;
180
+ --color-fg-inverse: #ffffff;
181
+ --border-width-thin: 1;
182
+ --border-width-thick: 2;
183
+ --border-radius-none: 0;
184
+ --border-radius-xs: 4;
185
+ --border-radius-s: 8;
186
+ --border-radius-m: 12;
187
+ --border-radius-l: 16;
188
+ --border-radius-xl: 24;
189
+ --border-radius-pill: 999;
190
+ }
191
+
192
+ @media (min-width: 768px) {
193
+ :root {
194
+ --font-display-l-font-family: Really Sans Small;
195
+ --font-display-l-font-size: 4.5rem;
196
+ --font-display-l-line-height: 100%;
197
+ --font-display-l-font-weight: 600;
198
+ --font-display-l-letter-spacing: 0;
199
+ --font-display-l-text-decoration: none;
200
+ --font-display-m-font-family: Really Sans Small;
201
+ --font-display-m-font-size: 3.5rem;
202
+ --font-display-m-line-height: 100%;
203
+ --font-display-m-font-weight: 600;
204
+ --font-display-m-letter-spacing: 0;
205
+ --font-display-m-text-decoration: none;
206
+ --font-title-l-font-family: Really Sans Small;
207
+ --font-title-l-font-size: 2.5rem;
208
+ --font-title-l-line-height: 120%;
209
+ --font-title-l-font-weight: 700;
210
+ --font-title-l-letter-spacing: 0;
211
+ --font-title-l-text-decoration: none;
212
+ --font-title-m-font-family: Really Sans Small;
213
+ --font-title-m-font-size: 2rem;
214
+ --font-title-m-line-height: 120%;
215
+ --font-title-m-font-weight: 700;
216
+ --font-title-m-letter-spacing: 0;
217
+ --font-title-m-text-decoration: none;
218
+ --font-title-s-font-family: Really Sans Small;
219
+ --font-title-s-font-size: 1.5rem;
220
+ --font-title-s-line-height: 120%;
221
+ --font-title-s-font-weight: 700;
222
+ --font-title-s-letter-spacing: 0;
223
+ --font-title-s-text-decoration: none;
224
+ --font-title-xs-font-family: Really Sans Small;
225
+ --font-title-xs-font-size: 1.25rem;
226
+ --font-title-xs-line-height: 120%;
227
+ --font-title-xs-font-weight: 700;
228
+ --font-title-xs-letter-spacing: 0;
229
+ --font-title-xs-text-decoration: none;
230
+ }
231
+ }
package/dist/css/ekstract.css ADDED
@@ -0,0 +1,231 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --size-0: 0;
7
+ --size-25: 4;
8
+ --size-50: 8;
9
+ --size-75: 12;
10
+ --size-100: 16;
11
+ --size-125: 20;
12
+ --size-150: 24;
13
+ --size-175: 28;
14
+ --size-200: 32;
15
+ --size-225: 36;
16
+ --size-250: 40;
17
+ --size-275: 44;
18
+ --size-300: 48;
19
+ --size-325: 52;
20
+ --size-350: 56;
21
+ --size-375: 60;
22
+ --size-400: 64;
23
+ --size-425: 68;
24
+ --size-450: 72;
25
+ --size-475: 76;
26
+ --size-500: 80;
27
+ --size-xxxs: 20;
28
+ --size-xxs: 24;
29
+ --size-xs: 32;
30
+ --size-s: 36;
31
+ --size-m: 40;
32
+ --size-l: 48;
33
+ --size-xl: 56;
34
+ --size-xxl: 64;
35
+ --size-xxxl: 80;
36
+ --space-0: 0;
37
+ --space-12: 2;
38
+ --space-25: 4;
39
+ --space-50: 8;
40
+ --space-75: 12;
41
+ --space-100: 16;
42
+ --space-125: 20;
43
+ --space-150: 24;
44
+ --space-175: 28;
45
+ --space-200: 32;
46
+ --space-225: 36;
47
+ --space-250: 40;
48
+ --space-275: 44;
49
+ --space-300: 48;
50
+ --space-325: 52;
51
+ --space-350: 56;
52
+ --space-375: 60;
53
+ --space-400: 64;
54
+ --space-none: 0;
55
+ --space-xxxxs: 2;
56
+ --space-xxxs: 4;
57
+ --space-xxs: 8;
58
+ --space-xs: 12;
59
+ --space-s: 16;
60
+ --space-m: 20;
61
+ --space-l: 24;
62
+ --space-xl: 32;
63
+ --space-xxl: 40;
64
+ --space-xxxl: 48;
65
+ --space-xxxxl: 56;
66
+ --font-body-m-font-family: Figtree;
67
+ --font-body-m-font-size: 1rem;
68
+ --font-body-m-line-height: 140%;
69
+ --font-body-m-font-weight: 400;
70
+ --font-body-m-letter-spacing: 0;
71
+ --font-body-m-text-decoration: none;
72
+ --font-body-m-bold-font-family: Figtree;
73
+ --font-body-m-bold-font-size: 1rem;
74
+ --font-body-m-bold-line-height: 140%;
75
+ --font-body-m-bold-font-weight: 600;
76
+ --font-body-m-bold-letter-spacing: 0;
77
+ --font-body-m-bold-text-decoration: none;
78
+ --font-body-s-font-family: Figtree;
79
+ --font-body-s-font-size: 0.875rem;
80
+ --font-body-s-line-height: 140%;
81
+ --font-body-s-font-weight: 400;
82
+ --font-body-s-letter-spacing: 0;
83
+ --font-body-s-text-decoration: none;
84
+ --font-body-s-bold-font-family: Figtree;
85
+ --font-body-s-bold-font-size: 0.875rem;
86
+ --font-body-s-bold-line-height: 140%;
87
+ --font-body-s-bold-font-weight: 600;
88
+ --font-body-s-bold-letter-spacing: 0;
89
+ --font-body-s-bold-text-decoration: none;
90
+ --font-body-xs-font-family: Figtree;
91
+ --font-body-xs-font-size: 0.75rem;
92
+ --font-body-xs-line-height: 140%;
93
+ --font-body-xs-font-weight: 400;
94
+ --font-body-xs-letter-spacing: 0;
95
+ --font-body-xs-text-decoration: none;
96
+ --font-body-xs-bold-font-family: Figtree;
97
+ --font-body-xs-bold-font-size: 0.75rem;
98
+ --font-body-xs-bold-line-height: 140%;
99
+ --font-body-xs-bold-font-weight: 600;
100
+ --font-body-xs-bold-letter-spacing: 0;
101
+ --font-body-xs-bold-text-decoration: none;
102
+ --font-link-m-font-family: Figtree;
103
+ --font-link-m-font-size: 1rem;
104
+ --font-link-m-line-height: 140%;
105
+ --font-link-m-font-weight: 400;
106
+ --font-link-m-letter-spacing: 0;
107
+ --font-link-m-text-decoration: underline;
108
+ --font-link-m-bold-font-family: Figtree;
109
+ --font-link-m-bold-font-size: 1rem;
110
+ --font-link-m-bold-line-height: 140%;
111
+ --font-link-m-bold-font-weight: 600;
112
+ --font-link-m-bold-letter-spacing: 0;
113
+ --font-link-m-bold-text-decoration: underline;
114
+ --font-link-s-font-family: Figtree;
115
+ --font-link-s-font-size: 0.875rem;
116
+ --font-link-s-line-height: 140%;
117
+ --font-link-s-font-weight: 400;
118
+ --font-link-s-letter-spacing: 0;
119
+ --font-link-s-text-decoration: underline;
120
+ --font-link-s-bold-font-family: Figtree;
121
+ --font-link-s-bold-font-size: 0.875rem;
122
+ --font-link-s-bold-line-height: 140%;
123
+ --font-link-s-bold-font-weight: 600;
124
+ --font-link-s-bold-letter-spacing: 0;
125
+ --font-link-s-bold-text-decoration: underline;
126
+ --font-link-xs-font-family: Figtree;
127
+ --font-link-xs-font-size: 0.75rem;
128
+ --font-link-xs-line-height: 140%;
129
+ --font-link-xs-font-weight: 400;
130
+ --font-link-xs-letter-spacing: 0;
131
+ --font-link-xs-text-decoration: underline;
132
+ --font-link-xs-bold-font-family: Figtree;
133
+ --font-link-xs-bold-font-size: 0.75rem;
134
+ --font-link-xs-bold-line-height: 140%;
135
+ --font-link-xs-bold-font-weight: 600;
136
+ --font-link-xs-bold-letter-spacing: 0;
137
+ --font-link-xs-bold-text-decoration: underline;
138
+ --font-display-l-font-family: Ltt Recoleta;
139
+ --font-display-l-font-size: 3rem;
140
+ --font-display-l-line-height: 100%;
141
+ --font-display-l-font-weight: 700;
142
+ --font-display-l-letter-spacing: 0;
143
+ --font-display-l-text-decoration: none;
144
+ --font-display-m-font-family: Ltt Recoleta;
145
+ --font-display-m-font-size: 2.375rem;
146
+ --font-display-m-line-height: 100%;
147
+ --font-display-m-font-weight: 700;
148
+ --font-display-m-letter-spacing: 0;
149
+ --font-display-m-text-decoration: none;
150
+ --font-title-l-font-family: Ltt Recoleta;
151
+ --font-title-l-font-size: 2rem;
152
+ --font-title-l-line-height: 120%;
153
+ --font-title-l-font-weight: 800;
154
+ --font-title-l-letter-spacing: 0;
155
+ --font-title-l-text-decoration: none;
156
+ --font-title-m-font-family: Ltt Recoleta;
157
+ --font-title-m-font-size: 1.75rem;
158
+ --font-title-m-line-height: 120%;
159
+ --font-title-m-font-weight: 800;
160
+ --font-title-m-letter-spacing: 0;
161
+ --font-title-m-text-decoration: none;
162
+ --font-title-s-font-family: Ltt Recoleta;
163
+ --font-title-s-font-size: 1.5rem;
164
+ --font-title-s-line-height: 120%;
165
+ --font-title-s-font-weight: 800;
166
+ --font-title-s-letter-spacing: 0;
167
+ --font-title-s-text-decoration: none;
168
+ --font-title-xs-font-family: Ltt Recoleta;
169
+ --font-title-xs-font-size: 1.25rem;
170
+ --font-title-xs-line-height: 120%;
171
+ --font-title-xs-font-weight: 800;
172
+ --font-title-xs-letter-spacing: 0;
173
+ --font-title-xs-text-decoration: none;
174
+ --color-bg-brand: #194242;
175
+ --color-bg-base: #ffffff;
176
+ --color-bg-alternate: #f2f2f8;
177
+ --color-fg-brand: #194242;
178
+ --color-fg-neutral: #33323d;
179
+ --color-fg-subtle: #757388;
180
+ --color-fg-inverse: #ffffff;
181
+ --border-width-thin: 1;
182
+ --border-width-thick: 2;
183
+ --border-radius-none: 0;
184
+ --border-radius-xs: 4;
185
+ --border-radius-s: 8;
186
+ --border-radius-m: 12;
187
+ --border-radius-l: 16;
188
+ --border-radius-xl: 24;
189
+ --border-radius-pill: 999;
190
+ }
191
+
192
+ @media (min-width: 768px) {
193
+ :root {
194
+ --font-display-l-font-family: Ltt Recoleta;
195
+ --font-display-l-font-size: 4.5rem;
196
+ --font-display-l-line-height: 100%;
197
+ --font-display-l-font-weight: 700;
198
+ --font-display-l-letter-spacing: 0;
199
+ --font-display-l-text-decoration: none;
200
+ --font-display-m-font-family: Ltt Recoleta;
201
+ --font-display-m-font-size: 3.5rem;
202
+ --font-display-m-line-height: 100%;
203
+ --font-display-m-font-weight: 700;
204
+ --font-display-m-letter-spacing: 0;
205
+ --font-display-m-text-decoration: none;
206
+ --font-title-l-font-family: Ltt Recoleta;
207
+ --font-title-l-font-size: 2.5rem;
208
+ --font-title-l-line-height: 120%;
209
+ --font-title-l-font-weight: 800;
210
+ --font-title-l-letter-spacing: 0;
211
+ --font-title-l-text-decoration: none;
212
+ --font-title-m-font-family: Ltt Recoleta;
213
+ --font-title-m-font-size: 2rem;
214
+ --font-title-m-line-height: 120%;
215
+ --font-title-m-font-weight: 800;
216
+ --font-title-m-letter-spacing: 0;
217
+ --font-title-m-text-decoration: none;
218
+ --font-title-s-font-family: Ltt Recoleta;
219
+ --font-title-s-font-size: 1.5rem;
220
+ --font-title-s-line-height: 120%;
221
+ --font-title-s-font-weight: 800;
222
+ --font-title-s-letter-spacing: 0;
223
+ --font-title-s-text-decoration: none;
224
+ --font-title-xs-font-family: Ltt Recoleta;
225
+ --font-title-xs-font-size: 1.25rem;
226
+ --font-title-xs-line-height: 120%;
227
+ --font-title-xs-font-weight: 800;
228
+ --font-title-xs-letter-spacing: 0;
229
+ --font-title-xs-text-decoration: none;
230
+ }
231
+ }
package/dist/css/kiabi-home.css ADDED
@@ -0,0 +1,231 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --size-0: 0;
7
+ --size-25: 4;
8
+ --size-50: 8;
9
+ --size-75: 12;
10
+ --size-100: 16;
11
+ --size-125: 20;
12
+ --size-150: 24;
13
+ --size-175: 28;
14
+ --size-200: 32;
15
+ --size-225: 36;
16
+ --size-250: 40;
17
+ --size-275: 44;
18
+ --size-300: 48;
19
+ --size-325: 52;
20
+ --size-350: 56;
21
+ --size-375: 60;
22
+ --size-400: 64;
23
+ --size-425: 68;
24
+ --size-450: 72;
25
+ --size-475: 76;
26
+ --size-500: 80;
27
+ --size-xxxs: 20;
28
+ --size-xxs: 24;
29
+ --size-xs: 32;
30
+ --size-s: 36;
31
+ --size-m: 40;
32
+ --size-l: 48;
33
+ --size-xl: 56;
34
+ --size-xxl: 64;
35
+ --size-xxxl: 80;
36
+ --space-0: 0;
37
+ --space-12: 2;
38
+ --space-25: 4;
39
+ --space-50: 8;
40
+ --space-75: 12;
41
+ --space-100: 16;
42
+ --space-125: 20;
43
+ --space-150: 24;
44
+ --space-175: 28;
45
+ --space-200: 32;
46
+ --space-225: 36;
47
+ --space-250: 40;
48
+ --space-275: 44;
49
+ --space-300: 48;
50
+ --space-325: 52;
51
+ --space-350: 56;
52
+ --space-375: 60;
53
+ --space-400: 64;
54
+ --space-none: 0;
55
+ --space-xxxxs: 2;
56
+ --space-xxxs: 4;
57
+ --space-xxs: 8;
58
+ --space-xs: 12;
59
+ --space-s: 16;
60
+ --space-m: 20;
61
+ --space-l: 24;
62
+ --space-xl: 32;
63
+ --space-xxl: 40;
64
+ --space-xxxl: 48;
65
+ --space-xxxxl: 56;
66
+ --font-body-m-font-family: Figtree;
67
+ --font-body-m-font-size: 1rem;
68
+ --font-body-m-line-height: 140%;
69
+ --font-body-m-font-weight: 400;
70
+ --font-body-m-letter-spacing: 0;
71
+ --font-body-m-text-decoration: none;
72
+ --font-body-m-bold-font-family: Figtree;
73
+ --font-body-m-bold-font-size: 1rem;
74
+ --font-body-m-bold-line-height: 140%;
75
+ --font-body-m-bold-font-weight: 600;
76
+ --font-body-m-bold-letter-spacing: 0;
77
+ --font-body-m-bold-text-decoration: none;
78
+ --font-body-s-font-family: Figtree;
79
+ --font-body-s-font-size: 0.875rem;
80
+ --font-body-s-line-height: 140%;
81
+ --font-body-s-font-weight: 400;
82
+ --font-body-s-letter-spacing: 0;
83
+ --font-body-s-text-decoration: none;
84
+ --font-body-s-bold-font-family: Figtree;
85
+ --font-body-s-bold-font-size: 0.875rem;
86
+ --font-body-s-bold-line-height: 140%;
87
+ --font-body-s-bold-font-weight: 600;
88
+ --font-body-s-bold-letter-spacing: 0;
89
+ --font-body-s-bold-text-decoration: none;
90
+ --font-body-xs-font-family: Figtree;
91
+ --font-body-xs-font-size: 0.75rem;
92
+ --font-body-xs-line-height: 140%;
93
+ --font-body-xs-font-weight: 400;
94
+ --font-body-xs-letter-spacing: 0;
95
+ --font-body-xs-text-decoration: none;
96
+ --font-body-xs-bold-font-family: Figtree;
97
+ --font-body-xs-bold-font-size: 0.75rem;
98
+ --font-body-xs-bold-line-height: 140%;
99
+ --font-body-xs-bold-font-weight: 600;
100
+ --font-body-xs-bold-letter-spacing: 0;
101
+ --font-body-xs-bold-text-decoration: none;
102
+ --font-link-m-font-family: Figtree;
103
+ --font-link-m-font-size: 1rem;
104
+ --font-link-m-line-height: 140%;
105
+ --font-link-m-font-weight: 400;
106
+ --font-link-m-letter-spacing: 0;
107
+ --font-link-m-text-decoration: underline;
108
+ --font-link-m-bold-font-family: Figtree;
109
+ --font-link-m-bold-font-size: 1rem;
110
+ --font-link-m-bold-line-height: 140%;
111
+ --font-link-m-bold-font-weight: 600;
112
+ --font-link-m-bold-letter-spacing: 0;
113
+ --font-link-m-bold-text-decoration: underline;
114
+ --font-link-s-font-family: Figtree;
115
+ --font-link-s-font-size: 0.875rem;
116
+ --font-link-s-line-height: 140%;
117
+ --font-link-s-font-weight: 400;
118
+ --font-link-s-letter-spacing: 0;
119
+ --font-link-s-text-decoration: underline;
120
+ --font-link-s-bold-font-family: Figtree;
121
+ --font-link-s-bold-font-size: 0.875rem;
122
+ --font-link-s-bold-line-height: 140%;
123
+ --font-link-s-bold-font-weight: 600;
124
+ --font-link-s-bold-letter-spacing: 0;
125
+ --font-link-s-bold-text-decoration: underline;
126
+ --font-link-xs-font-family: Figtree;
127
+ --font-link-xs-font-size: 0.75rem;
128
+ --font-link-xs-line-height: 140%;
129
+ --font-link-xs-font-weight: 400;
130
+ --font-link-xs-letter-spacing: 0;
131
+ --font-link-xs-text-decoration: underline;
132
+ --font-link-xs-bold-font-family: Figtree;
133
+ --font-link-xs-bold-font-size: 0.75rem;
134
+ --font-link-xs-bold-line-height: 140%;
135
+ --font-link-xs-bold-font-weight: 600;
136
+ --font-link-xs-bold-letter-spacing: 0;
137
+ --font-link-xs-bold-text-decoration: underline;
138
+ --font-display-l-font-family: Figtree;
139
+ --font-display-l-font-size: 3rem;
140
+ --font-display-l-line-height: 100%;
141
+ --font-display-l-font-weight: 700;
142
+ --font-display-l-letter-spacing: 0;
143
+ --font-display-l-text-decoration: none;
144
+ --font-display-m-font-family: Figtree;
145
+ --font-display-m-font-size: 2.375rem;
146
+ --font-display-m-line-height: 100%;
147
+ --font-display-m-font-weight: 700;
148
+ --font-display-m-letter-spacing: 0;
149
+ --font-display-m-text-decoration: none;
150
+ --font-title-l-font-family: Figtree;
151
+ --font-title-l-font-size: 2rem;
152
+ --font-title-l-line-height: 120%;
153
+ --font-title-l-font-weight: 800;
154
+ --font-title-l-letter-spacing: 0;
155
+ --font-title-l-text-decoration: none;
156
+ --font-title-m-font-family: Figtree;
157
+ --font-title-m-font-size: 1.75rem;
158
+ --font-title-m-line-height: 120%;
159
+ --font-title-m-font-weight: 800;
160
+ --font-title-m-letter-spacing: 0;
161
+ --font-title-m-text-decoration: none;
162
+ --font-title-s-font-family: Figtree;
163
+ --font-title-s-font-size: 1.5rem;
164
+ --font-title-s-line-height: 120%;
165
+ --font-title-s-font-weight: 800;
166
+ --font-title-s-letter-spacing: 0;
167
+ --font-title-s-text-decoration: none;
168
+ --font-title-xs-font-family: Figtree;
169
+ --font-title-xs-font-size: 1.25rem;
170
+ --font-title-xs-line-height: 120%;
171
+ --font-title-xs-font-weight: 800;
172
+ --font-title-xs-letter-spacing: 0;
173
+ --font-title-xs-text-decoration: none;
174
+ --color-bg-brand: #b6a088;
175
+ --color-bg-base: #ffffff;
176
+ --color-bg-alternate: #f2f2f8;
177
+ --color-fg-brand: #040037;
178
+ --color-fg-neutral: #33323d;
179
+ --color-fg-subtle: #757388;
180
+ --color-fg-inverse: #ffffff;
181
+ --border-width-thin: 1;
182
+ --border-width-thick: 2;
183
+ --border-radius-none: 0;
184
+ --border-radius-xs: 4;
185
+ --border-radius-s: 8;
186
+ --border-radius-m: 12;
187
+ --border-radius-l: 16;
188
+ --border-radius-xl: 24;
189
+ --border-radius-pill: 999;
190
+ }
191
+
192
+ @media (min-width: 768px) {
193
+ :root {
194
+ --font-display-l-font-family: Figtree;
195
+ --font-display-l-font-size: 4.5rem;
196
+ --font-display-l-line-height: 100%;
197
+ --font-display-l-font-weight: 700;
198
+ --font-display-l-letter-spacing: 0;
199
+ --font-display-l-text-decoration: none;
200
+ --font-display-m-font-family: Figtree;
201
+ --font-display-m-font-size: 3.5rem;
202
+ --font-display-m-line-height: 100%;
203
+ --font-display-m-font-weight: 700;
204
+ --font-display-m-letter-spacing: 0;
205
+ --font-display-m-text-decoration: none;
206
+ --font-title-l-font-family: Figtree;
207
+ --font-title-l-font-size: 2.5rem;
208
+ --font-title-l-line-height: 120%;
209
+ --font-title-l-font-weight: 800;
210
+ --font-title-l-letter-spacing: 0;
211
+ --font-title-l-text-decoration: none;
212
+ --font-title-m-font-family: Figtree;
213
+ --font-title-m-font-size: 2rem;
214
+ --font-title-m-line-height: 120%;
215
+ --font-title-m-font-weight: 800;
216
+ --font-title-m-letter-spacing: 0;
217
+ --font-title-m-text-decoration: none;
218
+ --font-title-s-font-family: Figtree;
219
+ --font-title-s-font-size: 1.5rem;
220
+ --font-title-s-line-height: 120%;
221
+ --font-title-s-font-weight: 800;
222
+ --font-title-s-letter-spacing: 0;
223
+ --font-title-s-text-decoration: none;
224
+ --font-title-xs-font-family: Figtree;
225
+ --font-title-xs-font-size: 1.25rem;
226
+ --font-title-xs-line-height: 120%;
227
+ --font-title-xs-font-weight: 800;
228
+ --font-title-xs-letter-spacing: 0;
229
+ --font-title-xs-text-decoration: none;
230
+ }
231
+ }